feat(snippets): add separeate context menu & actions

massCodeIO · Apr 2, 2022 · 2dc81b5 · 2dc81b5
1 parent f6b0d76
commit 2dc81b5
Show file tree

Hide file tree

Showing 3 changed files with 139 additions and 22 deletions.
diff --git a/src/main/services/ipc/context-menu.ts b/src/main/services/ipc/context-menu.ts
@@ -1,5 +1,6 @@
 import { createPopupMenu } from '../../components/menu'
-import { dialog, ipcMain } from 'electron'
+import type { MenuItemConstructorOptions } from 'electron'
+import { Menu, MenuItem, dialog, ipcMain } from 'electron'
 import type {
   ContextMenuAction,
   ContextMenuPayload,
@@ -10,7 +11,7 @@ export const subscribeToContextMenu = () => {
   ipcMain.handle<ContextMenuPayload, ContextMenuResponse>(
     'context-menu:snippet-fragment',
     async (event, payload) => {
-      const { name } = payload
+      const { name, type } = payload
 
       return new Promise(resolve => {
         createPopupMenu([
@@ -19,6 +20,7 @@ export const subscribeToContextMenu = () => {
             click: () =>
               resolve({
                 action: 'rename',
+                type,
                 data: payload
               })
           },
@@ -36,6 +38,7 @@ export const subscribeToContextMenu = () => {
               if (buttonId === 0) {
                 resolve({
                   action: 'delete',
+                  type,
                   data: payload
                 })
               }
@@ -48,18 +51,22 @@ export const subscribeToContextMenu = () => {
 
   ipcMain.handle<ContextMenuPayload, ContextMenuResponse>(
     'context-menu:snippet',
-    async () => {
+    async (event, payload) => {
+      const { name, type } = payload
+
       return new Promise(resolve => {
+        const menu = createPopupMenu([])
         let action: ContextMenuAction = 'none'
 
-        const menu = createPopupMenu([
+        const defaultMenu: MenuItemConstructorOptions[] = [
           {
             label: 'Add to Favorites',
             click: () => {
               action = 'favorites'
               resolve({
                 action,
-                data: {}
+                type,
+                data: true
               })
             }
           },
@@ -70,7 +77,8 @@ export const subscribeToContextMenu = () => {
               action = 'duplicate'
               resolve({
                 action,
-                data: {}
+                type,
+                data: undefined
               })
             }
           },
@@ -80,17 +88,86 @@ export const subscribeToContextMenu = () => {
               action = 'delete'
               resolve({
                 action,
-                data: {}
+                type,
+                data: undefined
               })
             }
           }
-        ])
+        ]
+
+        const favoritesMenu: MenuItemConstructorOptions[] = [
+          {
+            label: 'Remove from Favorites',
+            click: () => {
+              action = 'favorites'
+              resolve({
+                action,
+                type,
+                data: false
+              })
+            }
+          },
+          { type: 'separator' },
+          {
+            label: 'Delete',
+            click: () => {
+              action = 'delete'
+              resolve({
+                action,
+                type,
+                data: undefined
+              })
+            }
+          }
+        ]
+
+        const trashMenu: MenuItemConstructorOptions[] = [
+          {
+            label: 'Delete now',
+            click: () => {
+              action = 'delete'
+              const buttonId = dialog.showMessageBoxSync({
+                message: `Are you sure you want to permanently delete "${name}"?`,
+                detail: 'You cannot undo this action.',
+                buttons: ['Delete', 'Cancel'],
+                defaultId: 0,
+                cancelId: 1
+              })
+              if (buttonId === 0) {
+                resolve({
+                  action: 'delete',
+                  type,
+                  data: payload
+                })
+              }
+            }
+          }
+        ]
+
+        if (type === 'folder' || type === 'all' || type === 'inbox') {
+          defaultMenu.forEach(i => {
+            menu.append(new MenuItem(i))
+          })
+        }
+
+        if (type === 'favorites') {
+          favoritesMenu.forEach(i => {
+            menu.append(new MenuItem(i))
+          })
+        }
+
+        if (type === 'trash') {
+          trashMenu.forEach(i => {
+            menu.append(new MenuItem(i))
+          })
+        }
 
         menu.on('menu-will-close', async () => {
           setImmediate(() => {
             resolve({
               action,
-              data: {}
+              type,
+              data: payload
             })
           })
         })

diff --git a/src/main/types/index.d.ts b/src/main/types/index.d.ts
@@ -10,6 +10,8 @@ type ContextMenuAction =
   | 'favorites'
   | 'none'
 
+export type ContextMenuType = 'folder' | 'inbox' | 'all' | 'trash' | 'favorites'
+
 type CombineWithChannelSubject<
   T extends ChannelSubject,
   U extends string
@@ -23,11 +25,13 @@ ChannelSubject,
 export type Channel = 'restart' | ContextMenuChannel
 export interface ContextMenuPayload {
   name?: string
+  type: ContextMenuType
 }
 
 export interface ContextMenuResponse {
   action: ContextMenuAction
-  data: ContextMenuPayload
+  type: ContextMenuType
+  data: any
 }
 
 interface StoreGet<T> {

diff --git a/src/renderer/components/snippets/SnippetListItem.vue b/src/renderer/components/snippets/SnippetListItem.vue
@@ -35,6 +35,7 @@ import { useSnippetStore } from '@/store/snippets'
 import type { ContextMenuPayload, ContextMenuResponse } from '@@/types'
 import { onClickOutside } from '@vueuse/core'
 import { computed, ref } from 'vue'
+import type { SystemFolderAlias } from '../sidebar/types'
 
 interface Props {
   id: string
@@ -61,32 +62,67 @@ onClickOutside(itemRef, () => {
 const onClickContextMenu = async () => {
   isHighlighted.value = true
 
-  const { action } = await ipc.invoke<ContextMenuResponse, ContextMenuPayload>(
-    'context-menu:snippet',
-    {
-      name: props.name
-    }
-  )
+  const { action, data, type } = await ipc.invoke<
+  ContextMenuResponse,
+  ContextMenuPayload
+  >('context-menu:snippet', {
+    name: props.name,
+    type: folderStore.selectedAlias ?? 'folder'
+  })
 
-  if (action === 'delete') {
+  const moveToTrash = async (alias?: SystemFolderAlias) => {
     snippetStore.patchSnippetsById(props.id, {
       isDeleted: true
     })
+    if (!alias) {
+      await snippetStore.getSnippetsByFolderIds(folderStore.selectedIds!)
+      snippetStore.snippet = snippetStore.snippets[0]
+    } else {
+      await snippetStore.getSnippets()
+      snippetStore.setSnippetsByAlias(alias)
+    }
+  }
 
-    await snippetStore.getSnippetsByFolderIds(folderStore.selectedIds!)
-    snippetStore.snippet = snippetStore.snippets[0]
+  if (action === 'delete') {
+    if (type === 'folder') await moveToTrash()
+
+    if (type === 'favorites' || type === 'all' || type === 'inbox') {
+      await moveToTrash(type)
+    }
+
+    if (type === 'trash') {
+      await snippetStore.deleteSnippetsById(props.id)
+      await snippetStore.getSnippets()
+      snippetStore.setSnippetsByAlias(type)
+    }
   }
 
   if (action === 'duplicate') {
     await snippetStore.duplicateSnippetById(props.id)
-    await snippetStore.getSnippetsByFolderIds(folderStore.selectedIds!)
+
+    if (type === 'folder') {
+      await snippetStore.getSnippetsByFolderIds(folderStore.selectedIds!)
+    }
+
+    if (type === 'all' || type === 'inbox') {
+      await snippetStore.getSnippets()
+      snippetStore.setSnippetsByAlias(type)
+    }
   }
 
   if (action === 'favorites') {
     snippetStore.patchSnippetsById(props.id, {
-      isFavorites: true
+      isFavorites: data
     })
-    await snippetStore.getSnippetsByFolderIds(folderStore.selectedIds!)
+
+    if (type === 'folder') {
+      await snippetStore.getSnippetsByFolderIds(folderStore.selectedIds!)
+    }
+
+    if (type === 'favorites') {
+      await snippetStore.getSnippets()
+      snippetStore.setSnippetsByAlias(type)
+    }
   }
 
   isHighlighted.value = false