From 19825c21d5c7f76fd8d5b7ba7f1341de763168ef Mon Sep 17 00:00:00 2001
From: shiyu <im@shiyu.dev>
Date: Fri, 8 May 2026 21:56:08 +0800
Subject: [PATCH] feat: add default file view mode configuration and UI support

---
 domain/config/api.py                             |  1 +
 web/src/i18n/locales/en.json                     |  1 +
 web/src/i18n/locales/zh.json                     |  1 +
 .../pages/FileExplorerPage/FileExplorerPage.tsx  | 16 ++++++++++++++++
 .../components/AppSettingsTab.tsx                | 15 +++++++++++++++
 5 files changed, 34 insertions(+)

diff --git a/domain/config/api.py b/domain/config/api.py
index 6dc0df0..8fcd91b 100644
--- a/domain/config/api.py
+++ b/domain/config/api.py
@@ -19,6 +19,7 @@ PUBLIC_CONFIG_KEYS = [
     "THEME_BORDER_RADIUS",
     "THEME_CUSTOM_TOKENS",
     "THEME_CUSTOM_CSS",
+    "DEFAULT_FILE_VIEW_MODE",
 ]
 
 
diff --git a/web/src/i18n/locales/en.json b/web/src/i18n/locales/en.json
index 9df7c08..efa2216 100644
--- a/web/src/i18n/locales/en.json
+++ b/web/src/i18n/locales/en.json
@@ -34,6 +34,7 @@
   "English": "English",
   "Default Language": "Default Language",
   "Used when the user has not selected a language": "Used when the user has not selected a language",
+  "Default File View Mode": "Default File View Mode",
   "Full Name": "Full Name",
   "Email": "Email",
   "Change Password": "Change Password",
diff --git a/web/src/i18n/locales/zh.json b/web/src/i18n/locales/zh.json
index 6144034..94eaba4 100644
--- a/web/src/i18n/locales/zh.json
+++ b/web/src/i18n/locales/zh.json
@@ -57,6 +57,7 @@
   "English": "English",
   "Default Language": "默认语言",
   "Used when the user has not selected a language": "用户未手动选择语言时使用",
+  "Default File View Mode": "默认文件展示方式",
   "Full Name": "昵称",
   "Email": "邮箱",
   "Change Password": "修改密码",
diff --git a/web/src/pages/FileExplorerPage/FileExplorerPage.tsx b/web/src/pages/FileExplorerPage/FileExplorerPage.tsx
index 5e4dd08..1abb8c7 100644
--- a/web/src/pages/FileExplorerPage/FileExplorerPage.tsx
+++ b/web/src/pages/FileExplorerPage/FileExplorerPage.tsx
@@ -28,6 +28,7 @@ import { MoveCopyModal } from './components/Modals/MoveCopyModal';
 import { SearchResultsView } from './components/SearchResultsView';
 import type { ViewMode } from './types';
 import { vfsApi, type VfsEntry } from '../../api/client';
+import { getPublicConfig } from '../../api/config';
 import { LoadingSkeleton } from './components/LoadingSkeleton';
 import useResponsive from '../../hooks/useResponsive';
 
@@ -106,6 +107,21 @@ const FileExplorerPage = memo(function FileExplorerPage() {
     load(routePath, 1, pagination.pageSize, sortBy, sortOrder);
   }, [routePath, navKey, load, pagination.pageSize, sortBy, sortOrder]);
 
+  useEffect(() => {
+    let mounted = true;
+    getPublicConfig()
+      .then((cfg) => {
+        if (!mounted || isMobile) return;
+        setViewMode(cfg.DEFAULT_FILE_VIEW_MODE === 'list' ? 'list' : 'grid');
+      })
+      .catch(() => {
+        if (mounted && !isMobile) setViewMode('grid');
+      });
+    return () => {
+      mounted = false;
+    };
+  }, [isMobile]);
+
   useEffect(() => {
     if (isMobile && viewMode !== 'grid') {
       setViewMode('grid');
diff --git a/web/src/pages/SystemSettingsPage/components/AppSettingsTab.tsx b/web/src/pages/SystemSettingsPage/components/AppSettingsTab.tsx
index e8f0608..1ba23ad 100644
--- a/web/src/pages/SystemSettingsPage/components/AppSettingsTab.tsx
+++ b/web/src/pages/SystemSettingsPage/components/AppSettingsTab.tsx
@@ -54,6 +54,7 @@ export default function AppSettingsTab({
     return {
       ...Object.fromEntries(configKeys.map(({ key, default: def }) => [key, config[key] ?? def ?? ''])),
       APP_DEFAULT_LANGUAGE: normalizeLang(config.APP_DEFAULT_LANGUAGE, 'zh'),
+      DEFAULT_FILE_VIEW_MODE: config.DEFAULT_FILE_VIEW_MODE === 'list' ? 'list' : 'grid',
       AUTH_ALLOW_REGISTER: allowRegister,
       AUTH_DEFAULT_REGISTER_ROLE_ID: Number.isFinite(roleId) ? roleId : undefined,
     };
@@ -70,6 +71,7 @@ export default function AppSettingsTab({
         }
         const defaultLanguage = normalizeLang(vals.APP_DEFAULT_LANGUAGE, 'zh');
         payload.APP_DEFAULT_LANGUAGE = defaultLanguage;
+        payload.DEFAULT_FILE_VIEW_MODE = vals.DEFAULT_FILE_VIEW_MODE === 'list' ? 'list' : 'grid';
         const allow = !!vals.AUTH_ALLOW_REGISTER;
         payload.AUTH_ALLOW_REGISTER = allow ? 'true' : 'false';
         if (allow) {
@@ -103,6 +105,19 @@ export default function AppSettingsTab({
         />
       </Form.Item>
 
+      <Form.Item
+        name="DEFAULT_FILE_VIEW_MODE"
+        label={t('Default File View Mode')}
+      >
+        <Select
+          size="large"
+          options={[
+            { value: 'grid', label: t('Grid') },
+            { value: 'list', label: t('List') },
+          ]}
+        />
+      </Form.Item>
+
       <Divider titlePlacement="left">{t('Registration Settings')}</Divider>
 
       <Alert