feat: allow hide icon

fixes #333
2025-12-06 02:30:47 -08:00 · 2023-02-22 17:30:00 +08:00 · 2023-02-22 17:30:00 +08:00 · e2161f440f
commit e2161f440f
parent 5f1a57a14c
10 changed files with 51 additions and 24 deletions
--- a/localization/locales/en/translation.json
+++ b/localization/locales/en/translation.json
@ -255,7 +255,7 @@
    "AttachToMenuBarTip": "Make  a small TidGi popup window that pop when you click appbar mini icon. Tip: Right-click on mini app icon to access context menu.",
    "OpenLogFolder": "Open the Log folder",
    "OpenLogFolderDetail": "When reporting a problem, please open the latest .log file in the folder and send its content to the developer, or paste it to pastebin.com and then paste the URL into the Github Issue",
-    "SystemDefalutTheme": "System Defalut Theme",
+    "SystemDefaultTheme": "System Defalut Theme",
    "LightTheme": "Light Theme",
    "DarkTheme": "Dark Theme",
    "ShowSideBar": "Show SideBar",
@ -329,7 +329,8 @@
    "SyncOnlyWhenNoDraft": "Sync only when there are no drafts",
    "SyncOnlyWhenNoDraftDescription": "Check if there are drafts before synchronizing, if so, it will not be synchronized this time, preventing the drafts from being synchronized to your blog. \n(Not working for sync-before-shutdown, for you may want to bring drafts from one computer to another to continue editing)",
    "MoreWorkspaceSyncSettingsDescription": "Please right-click the workspace icon, open its workspace setting by click on \"Edit Workspace\" context menu item, and configure its independent synchronization settings in it.",
-    "MoreWorkspaceSyncSettings": "More Workspace Sync Settings"
+    "MoreWorkspaceSyncSettings": "More Workspace Sync Settings",
+    "HideSideBarIcon": "Hide sidebar workspace icons"
  },
  "Error": {
    "InitWikiGitError": "E-1 InitWikiGitError",
--- a/localization/locales/zh_CN/translation.json
+++ b/localization/locales/zh_CN/translation.json
@ -302,7 +302,9 @@
    "LightTheme": "亮色主题",
    "ShowSideBar": "显示侧边栏",
    "HideSideBar": "隐藏侧边栏",
-    "SystemDefalutTheme": "系统默认主题色",
+    "HideSideBarIcon": "隐藏侧边栏工作区图标",
+    "HideSideBarIconDetail": "隐藏图标只显示工作区的名字，让工作区列表更紧凑",
+    "SystemDefaultTheme": "系统默认主题色",
    "Theme": "主题色",
    "Reset": "你确定吗？所有首选项都将恢复为其原始默认值。浏览数据不会受到影响。此操作无法撤消。",
    "ResetNow": "立即重置",
--- a/src/components/WorkspaceIconAndSelector/SortableWorkspaceSelector.tsx
+++ b/src/components/WorkspaceIconAndSelector/SortableWorkspaceSelector.tsx
@ -9,13 +9,14 @@ import { getWorkspaceMenuTemplate, openWorkspaceTagTiddler } from '@services/wor
 import defaultIcon from '@/images/default-icon.png';

 export interface ISortableItemProps {
+  hideSideBarIcon: boolean;
  index: number;
  showSidebarShortcutHints: boolean;
  workspace: IWorkspace;
  workspaceCount: number;
 }

-export function SortableWorkspaceSelector({ index, workspace, showSidebarShortcutHints, workspaceCount }: ISortableItemProps): JSX.Element {
+export function SortableWorkspaceSelector({ index, workspace, showSidebarShortcutHints, workspaceCount, hideSideBarIcon }: ISortableItemProps): JSX.Element {
  const { t } = useTranslation();
  const { active, id, name, picturePath, hibernated, transparentBackground } = workspace;
  const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id });
@ -49,6 +50,7 @@ export function SortableWorkspaceSelector({ index, workspace, showSidebarShortcu
      <WorkspaceSelector
        workspaceClickedLoading={workspaceClickedLoading}
        workspaceCount={workspaceCount}
+        hideSideBarIcon={hideSideBarIcon}
        onClick={onWorkspaceClick}
        active={active}
        id={id}
--- a/src/components/WorkspaceIconAndSelector/SortableWorkspaceSelectorList.tsx
+++ b/src/components/WorkspaceIconAndSelector/SortableWorkspaceSelectorList.tsx
@ -5,11 +5,12 @@ import { IWorkspace, IWorkspaceWithMetadata } from '@services/workspaces/interfa
 import { SortableWorkspaceSelector } from './SortableWorkspaceSelector';

 export interface ISortableListProps {
+  hideSideBarIcon: boolean;
  sidebarShortcutHints: boolean;
  workspacesList: IWorkspaceWithMetadata[];
 }

-export function SortableWorkspaceSelectorList({ workspacesList, sidebarShortcutHints }: ISortableListProps): JSX.Element {
+export function SortableWorkspaceSelectorList({ workspacesList, sidebarShortcutHints, hideSideBarIcon }: ISortableListProps): JSX.Element {
  const dndSensors = useSensors(
    useSensor(PointerSensor, {
      activationConstraint: {
@ -47,6 +48,7 @@ export function SortableWorkspaceSelectorList({ workspacesList, sidebarShortcutH
              index={index}
              workspace={workspace}
              showSidebarShortcutHints={sidebarShortcutHints}
+              hideSideBarIcon={hideSideBarIcon}
              workspaceCount={workspaceIDs.length}
            />
          ))}
--- a/src/components/WorkspaceIconAndSelector/WorkspaceSelector.tsx
+++ b/src/components/WorkspaceIconAndSelector/WorkspaceSelector.tsx
@ -133,6 +133,7 @@ interface Props {
  active?: boolean;
  badgeCount?: number;
  hibernated?: boolean;
+  hideSideBarIcon: boolean;
  id: string;
  index?: number;
  onClick?: () => void;
@ -147,6 +148,7 @@ export function WorkspaceSelector({
  active = false,
  badgeCount = 0,
  hibernated = false,
+  hideSideBarIcon = false,
  id,
  index = 0,
  picturePath,
@ -172,22 +174,24 @@ export function WorkspaceSelector({
      workspaceClickedLoading={workspaceClickedLoading}
      workspaceCount={workspaceCount}>
      <Badge color="secondary" badgeContent={badgeCount} max={99}>
-        <Avatar
-          large={!showSidebarShortcutHints}
-          transparent={transparentBackground}
-          addAvatar={id === 'add'}
-          highlightAdd={index === 0}
-          id={id === 'add' || id === 'guide' ? 'add-workspace-button' : `workspace-avatar-${id}`}>
-          {id === 'add' ? (
-            '+'
-          ) : id === 'guide' ? (
-            '※'
-          ) : (
-            <AvatarPicture alt="Icon" large={!showSidebarShortcutHints} src={getAssetsFileUrl(picturePath ?? defaultIcon)} draggable={false} />
-          )}
-        </Avatar>
+        {!hideSideBarIcon && (
+          <Avatar
+            large={!showSidebarShortcutHints}
+            transparent={transparentBackground}
+            addAvatar={id === 'add'}
+            highlightAdd={index === 0}
+            id={id === 'add' || id === 'guide' ? 'add-workspace-button' : `workspace-avatar-${id}`}>
+            {id === 'add' ? (
+              '+'
+            ) : id === 'guide' ? (
+              '※'
+            ) : (
+              <AvatarPicture alt="Icon" large={!showSidebarShortcutHints} src={getAssetsFileUrl(picturePath ?? defaultIcon)} draggable={false} />
+            )}
+          </Avatar>
+        )}
      </Badge>
-      {showSidebarShortcutHints && (
+      {(showSidebarShortcutHints || hideSideBarIcon) && (
        <ShortcutText active={active}>
          {id === 'add' ? t('WorkspaceSelector.Add') : id === 'guide' ? t('WorkspaceSelector.Guide') : shortWorkspaceName}
        </ShortcutText>
--- a/src/main.ts
+++ b/src/main.ts
@ -40,7 +40,6 @@ protocol.registerSchemesAsPrivileged([
 ]);
 bindServiceAndProxy();
 const preferenceService = container.get<IPreferenceService>(serviceIdentifier.Preference);
-const wikiService = container.get<IWikiService>(serviceIdentifier.Wiki);
 const windowService = container.get<IWindowService>(serviceIdentifier.Window);
 const updaterService = container.get<IUpdaterService>(serviceIdentifier.Updater);
 const wikiGitWorkspaceService = container.get<IWikiGitWorkspaceService>(serviceIdentifier.WikiGitWorkspace);
--- a/src/pages/Main/index.tsx
+++ b/src/pages/Main/index.tsx
@ -166,7 +166,7 @@ export default function Main(): JSX.Element {
  const updaterMetaData = useUpdaterObservable();
  if (preferences === undefined) return <div>{t('Loading')}</div>;

-  const { sidebar, themeSource, sidebarShortcutHints } = preferences;
+  const { sidebar, themeSource, sidebarShortcutHints, hideSideBarIcon } = preferences;
  const hasError =
    typeof activeWorkspaceMetadata?.didFailLoadErrorMessage === 'string' &&
    activeWorkspaceMetadata?.didFailLoadErrorMessage.length > 0 &&
@ -184,10 +184,11 @@ export default function Main(): JSX.Element {
              {workspacesList === undefined ? (
                <div>{t('Loading')}</div>
              ) : (
-                <SortableWorkspaceSelectorList sidebarShortcutHints={sidebarShortcutHints} workspacesList={workspacesList} />
+                <SortableWorkspaceSelectorList sidebarShortcutHints={sidebarShortcutHints} workspacesList={workspacesList} hideSideBarIcon={hideSideBarIcon} />
              )}
              <WorkspaceSelector
                id="add"
+                hideSideBarIcon={hideSideBarIcon}
                index={workspacesList?.length ?? 0}
                showSidebarShortcutHints={sidebarShortcutHints}
                onClick={() => void window.service.window.open(WindowNames.addWorkspace)}
@ -196,6 +197,7 @@ export default function Main(): JSX.Element {
                (workspacesList.length === 0 && (
                  <WorkspaceSelector
                    id="guide"
+                    hideSideBarIcon={hideSideBarIcon}
                    index={workspacesList?.length ? workspacesList.length ?? 0 + 1 : 1}
                    active={activeWorkspace?.id === undefined}
                    showSidebarShortcutHints={sidebarShortcutHints}
--- a/src/pages/Preferences/sections/General.tsx
+++ b/src/pages/Preferences/sections/General.tsx
@ -55,7 +55,7 @@ export function General(props: Required<ISectionProps>): JSX.Element {
                  </ListItem>
                }>
                <MenuItem dense onClick={async () => await window.service.preference.set('themeSource', 'system')}>
-                  {t('Preference.SystemDefalutTheme')}
+                  {t('Preference.SystemDefaultTheme')}
                </MenuItem>
                <MenuItem dense onClick={async () => await window.service.preference.set('themeSource', 'light')}>
                  {t('Preference.LightTheme')}
@ -79,6 +79,19 @@ export function General(props: Required<ISectionProps>): JSX.Element {
                  />
                </ListItemSecondaryAction>
              </ListItem>
+              <ListItem>
+                <ListItemText primary={t('Preference.HideSideBarIcon')} secondary={t('Preference.ShowSideBarDetail')} />
+                <ListItemSecondaryAction>
+                  <Switch
+                    edge="end"
+                    color="primary"
+                    checked={preference.hideSideBarIcon}
+                    onChange={async (event) => {
+                      await window.service.preference.set('hideSideBarIcon', event.target.checked);
+                    }}
+                  />
+                </ListItemSecondaryAction>
+              </ListItem>
              <Divider />
              <ListItem>
                <ListItemText primary={t('Preference.ShowSideBarShortcut')} />
--- a/src/services/preferences/defaultPreferences.ts
+++ b/src/services/preferences/defaultPreferences.ts
@ -11,6 +11,7 @@ export const defaultPreferences: IPreferences = {
  downloadPath: getDefaultDownloadsPath(),
  hibernateUnusedWorkspacesAtLaunch: false,
  hideMenuBar: false,
+  hideSideBarIcon: false,
  ignoreCertificateErrors: false,
  language: 'zh_CN',
  menuBarAlwaysOnTop: false,
--- a/src/services/preferences/interface.ts
+++ b/src/services/preferences/interface.ts
@ -12,6 +12,7 @@ export interface IPreferences {
  downloadPath: string;
  hibernateUnusedWorkspacesAtLaunch: boolean;
  hideMenuBar: boolean;
+  hideSideBarIcon: boolean;
  ignoreCertificateErrors: boolean;
  language: string;
  menuBarAlwaysOnTop: boolean;