feat: hide subfolder snippets (#371)

Author: antonreshetov

src/main/menu/main.ts

@@ -333,6 +333,16 @@ const viewMenu: MenuItemConstructorOptions[] = [
         }
       }
     ]
+  },
+  {
+    label: i18n.t('menu:view.hideSubfolderSnippets'),
+    type: 'checkbox',
+    checked: store.app.get('hideSubfolderSnippets'),
+    click: () => {
+      BrowserWindow.getFocusedWindow()?.webContents.send(
+        'main-menu:hide-subfolder-snippets'
+      )
+    }
   }
 ]
 

src/main/services/i18n/locales/en/menu.json

@@ -49,7 +49,8 @@
       "dateModified": "Date Modified",
       "dateCreated": "Date Created",
       "name": "Name"
-    }
+    },
+    "hideSubfolderSnippets": "Hide Subfolder Snippets"
   },
   "edit": {
     "label": "Edit",

src/main/services/i18n/locales/ru/menu.json

@@ -49,7 +49,8 @@
       "dateModified": "Дате модификации",
       "dateCreated": "Дате создания",
       "name": "Имени"
-    }
+    },
+    "hideSubfolderSnippets": "Скрыть сниппеты в подпапках"
   },
   "edit": {
     "label": "Изменить",

src/main/store/module/app.ts

@@ -9,6 +9,7 @@ export default new Store<AppStore>({
     bounds: {},
     sidebarWidth: 180,
     snippetListWidth: 250,
-    sort: 'updatedAt'
+    sort: 'updatedAt',
+    hideSubfolderSnippets: false
   }
 })

src/renderer/App.vue

@@ -85,6 +85,7 @@ const init = async () => {
   }
 
   snippetStore.sort = store.app.get('sort')
+  snippetStore.hideSubfolderSnippets = store.app.get('hideSubfolderSnippets')
 
   if (theme) {
     appStore.setTheme(theme)
@@ -228,6 +229,11 @@ ipc.on('main-menu:sort-snippets', (event, sort) => {
   snippetStore.setSort(sort)
 })
 
+ipc.on('main-menu:hide-subfolder-snippets', () => {
+  snippetStore.hideSubfolderSnippets = !snippetStore.hideSubfolderSnippets
+  store.app.set('hideSubfolderSnippets', snippetStore.hideSubfolderSnippets)
+})
+
 ipc.on('main-menu:add-description', async () => {
   await onAddDescription()
 })

src/renderer/components/snippets/SnippetList.vue

@@ -12,7 +12,7 @@
     >
       <PerfectScrollbar>
         <SnippetListItem
-          v-for="(i, index) in snippetStore.snippets"
+          v-for="(i, index) in snippetStore.snippetsByFilter"
           :id="i.id"
           :key="i.id"
           :data-id="i.id"

src/renderer/store/snippets.ts

@@ -27,13 +27,29 @@ export const useSnippetStore = defineStore('snippets', {
     fragment: 0,
     searchQuery: undefined,
     sort: 'updatedAt',
+    hideSubfolderSnippets: false,
     isContextState: false,
     isMarkdownPreview: false,
     isScreenshotPreview: false,
     isCodePreview: false
   }),
 
   getters: {
+    snippetsByFilter: state => {
+      const folderStore = useFolderStore()
+
+      if (folderStore.selectedAlias) {
+        return state.snippets
+      }
+
+      if (state.hideSubfolderSnippets) {
+        return state.snippets.filter(
+          i => i.folderId === folderStore.selectedId
+        )
+      }
+
+      return state.snippets
+    },
     selectedId: state => state.selected?.id,
     selectedIds: state => state.selectedMultiple.map(i => i.id),
     selectedIndex: state =>

src/shared/types/main/index.d.ts

@@ -45,6 +45,7 @@ type MainMenuAction =
   | 'preview-markdown'
   | 'search'
   | 'sort-snippets'
+  | 'hide-subfolder-snippets'
   | 'font-size-increase'
   | 'font-size-decrease'
   | 'font-size-reset'

src/shared/types/main/store.d.ts

@@ -13,6 +13,7 @@ export interface AppStore {
   sidebarWidth: number
   snippetListWidth: number
   sort: SnippetsSort
+  hideSubfolderSnippets?: boolean
   version?: string
 }
 

src/shared/types/renderer/store/snippets.d.ts

@@ -12,6 +12,7 @@ export interface State {
   fragment: number
   searchQuery?: string
   sort: SnippetsSort
+  hideSubfolderSnippets: boolean
   isContextState: boolean
   isMarkdownPreview: boolean
   isScreenshotPreview: boolean