feat(snippets): add multi delete

src/renderer/components/editor/Tab.vue

@@ -15,7 +15,7 @@ const { selectedSnippetContent, selectedSnippet, deleteSnippetContent }
   = useSnippets()
 const { addToUpdateContentQueue } = useSnippetUpdate()
 const {
-  highlightedSnippetId,
+  highlightedSnippetIds,
   highlightedFolderId,
   selectedSnippetContentIndex,
 } = useApp()
@@ -41,7 +41,7 @@ const name = computed({
 })
 
 function onClickContextMenu() {
-  highlightedSnippetId.value = undefined
+  highlightedSnippetIds.value.clear()
   highlightedFolderId.value = undefined
 }
 

src/renderer/components/sidebar/folders/TreeNode.vue

@@ -31,7 +31,12 @@ const {
   contextMenu,
 } = inject(treeKeys)!
 
-const { highlightedFolderId, selectedFolderId, selectedSnippetId } = useApp()
+const {
+  highlightedFolderId,
+  highlightedSnippetIds,
+  selectedFolderId,
+  selectedSnippetId,
+} = useApp()
 const { displayedSnippets, updateSnippets, selectFirstSnippet } = useSnippets()
 const { updateFolder, renameFolderId } = useFolders()
 
@@ -102,6 +107,7 @@ function onClickNode(id: string | number) {
 
 function onClickContextMenu(e: MouseEvent) {
   highlightedFolderId.value = props.node.id
+  highlightedSnippetIds.value.clear()
   contextMenu(props.node, e)
 }
 

src/renderer/components/snippet/Item.vue

@@ -14,7 +14,8 @@ const props = defineProps<Props>()
 
 const {
   selectedSnippetId,
-  highlightedSnippetId,
+  highlightedSnippetIds,
+  highlightedFolderId,
   selectedSnippetIdBeforeSearch,
   isFocusedSnippetName,
 } = useApp()
@@ -25,7 +26,10 @@ const {
   duplicateSnippet,
   selectedSnippetIds,
   updateSnippet,
+  updateSnippets,
   deleteSnippet,
+  deleteSnippets,
+  displayedSnippets,
 } = useSnippets()
 
 const isFocused = ref(false)
@@ -37,8 +41,12 @@ const isInMultiSelection = computed(
     selectedSnippetIds.value.length > 1
     && selectedSnippetIds.value.includes(props.snippet.id),
 )
-const isHighlighted = computed(
-  () => highlightedSnippetId.value === props.snippet.id,
+const isHighlighted = computed(() =>
+  highlightedSnippetIds.value.has(props.snippet.id),
+)
+
+const isDuplicateDisabled = computed(
+  () => highlightedSnippetIds.value.size > 1,
 )
 
 const folderName = computed(() => {
@@ -64,11 +72,44 @@ function onSnippetClick(id: number, event: MouseEvent) {
 }
 
 function onClickContextMenu() {
-  highlightedSnippetId.value = props.snippet.id
+  highlightedFolderId.value = undefined
+  highlightedSnippetIds.value.clear()
+  highlightedSnippetIds.value.add(props.snippet.id)
+
+  if (selectedSnippetIds.value.length > 1) {
+    selectedSnippetIds.value.forEach(id =>
+      highlightedSnippetIds.value.add(id),
+    )
+  }
 }
 
 async function onDelete() {
-  if (props.snippet.isDeleted) {
+  if (selectedSnippetIds.value.length > 1) {
+    const isAllSoftDeleted = displayedSnippets.value?.every(s => s.isDeleted)
+
+    if (isAllSoftDeleted) {
+      await deleteSnippets(selectedSnippetIds.value)
+    }
+    else {
+      // Мягкое удаление
+      const snippetsToSoftDelete = displayedSnippets.value?.filter(s =>
+        selectedSnippetIds.value.includes(s.id),
+      )
+      const snippetIds = snippetsToSoftDelete?.map(s => s.id)
+      const snippetsData = snippetsToSoftDelete?.map(s => ({
+        name: s.name,
+        folderId: s.folder?.id || null,
+        description: s.description,
+        isDeleted: 1,
+        isFavorites: s.isFavorites,
+      }))
+
+      if (snippetIds && snippetsData) {
+        await updateSnippets(snippetIds, snippetsData)
+      }
+    }
+  }
+  else if (props.snippet.isDeleted) {
     await deleteSnippet(props.snippet.id)
   }
   else {
@@ -82,7 +123,10 @@ async function onDelete() {
     })
   }
 
-  if (selectedSnippetId.value === props.snippet.id) {
+  if (
+    selectedSnippetIds.value.length > 1
+    || selectedSnippetId.value === props.snippet.id
+  ) {
     selectFirstSnippet()
   }
 }
@@ -127,7 +171,7 @@ function onDragStart(event: DragEvent) {
 
 onClickOutside(snippetRef, () => {
   isFocused.value = false
-  highlightedSnippetId.value = undefined
+  highlightedSnippetIds.value.clear()
 })
 </script>
 
@@ -166,7 +210,10 @@ onClickOutside(snippetRef, () => {
         </div>
       </ContextMenu.Trigger>
       <ContextMenu.Content>
-        <ContextMenu.Item @click="onDuplicate">
+        <ContextMenu.Item
+          :disabled="isDuplicateDisabled"
+          @click="onDuplicate"
+        >
           {{ i18n.t("duplicate") }}
         </ContextMenu.Item>
         <ContextMenu.Item @click="onDelete">

src/renderer/composables/useApp.ts

@@ -14,7 +14,7 @@ const selectedSnippetId = ref(store.app.get('selectedSnippetId'))
 const selectedSnippetIdBeforeSearch = ref(store.app.get('selectedSnippetId'))
 const selectedSnippetContentIndex = ref(0)
 const highlightedFolderId = ref<number>()
-const highlightedSnippetId = ref<number>()
+const highlightedSnippetIds = ref<Set<number>>(new Set())
 
 const isFocusedSnippetName = ref(false)
 
@@ -24,23 +24,10 @@ const snippetListWidth = useCssVar('--snippet-list-width')
 sidebarWidth.value = `${store.app.get('sidebarWidth')}px`
 snippetListWidth.value = `${store.app.get('snippetListWidth')}px`
 
-watch(
-  [highlightedFolderId, highlightedSnippetId],
-  ([newFolderId, newSnippetId], [oldFolderId, oldSnippetId]) => {
-    if (newFolderId !== oldFolderId && newFolderId !== undefined) {
-      highlightedSnippetId.value = undefined
-    }
-
-    if (newSnippetId !== oldSnippetId && newSnippetId !== undefined) {
-      highlightedFolderId.value = undefined
-    }
-  },
-)
-
 export function useApp() {
   return {
     highlightedFolderId,
-    highlightedSnippetId,
+    highlightedSnippetIds,
     selectedFolderId,
     selectedLibrary,
     selectedSnippetContentIndex,

src/renderer/composables/useSnippets.ts

@@ -197,6 +197,13 @@ async function deleteSnippet(snippetId: number) {
   await getSnippets(queryByLibraryOrFolderOrSearch.value)
 }
 
+async function deleteSnippets(snippetIds: number[]) {
+  for (const snippetId of snippetIds) {
+    await api.snippets.deleteSnippetsById(String(snippetId))
+  }
+  await getSnippets(queryByLibraryOrFolderOrSearch.value)
+}
+
 async function deleteSnippetContent(snippetId: number, contentId: number) {
   try {
     await api.snippets.deleteSnippetsByIdContentsByContentId(
@@ -292,6 +299,7 @@ export function useSnippets() {
     createSnippetContent,
     deleteSnippet,
     deleteSnippetContent,
+    deleteSnippets,
     displayedSnippets,
     duplicateSnippet,
     getSnippets,
@@ -301,12 +309,12 @@ export function useSnippets() {
     searchQuery,
     selectedSnippet,
     selectedSnippetContent,
-    selectedSnippets,
     selectedSnippetIds,
+    selectedSnippets,
     selectFirstSnippet,
     selectSnippet,
     updateSnippet,
-    updateSnippets,
     updateSnippetContent,
+    updateSnippets,
   }
 }