feat: adds support to create ZIP archives (#1007)

Signed-off-by: Pedro Lamas <[email protected]>
fluidd-core · Jan 12, 2023 · 9d8d36b · 9d8d36b
1 parent 2f1a59a
commit 9d8d36b
Show file tree

Hide file tree

Showing 12 changed files with 135 additions and 12 deletions.
diff --git a/src/api/socketActions.ts b/src/api/socketActions.ts
@@ -570,6 +570,35 @@ export const SocketActions = {
     )
   },
 
+  async serverFilesCopy (source: string, dest: string) {
+    const wait = Waits.onFileSystem
+    baseEmit(
+      'server.files.copy', {
+        dispatch: 'void',
+        wait,
+        params: {
+          source,
+          dest
+        }
+      }
+    )
+  },
+
+  async serverFilesZip (dest: string, items: string[], store_only?: boolean) {
+    const wait = Waits.onFileSystem
+    baseEmit(
+      'server.files.zip', {
+        dispatch: 'void',
+        wait,
+        params: {
+          dest,
+          items,
+          store_only
+        }
+      }
+    )
+  },
+
   /**
    * Create a directory.
    * Root should be included in the path.

diff --git a/src/components/widgets/filesystem/FileSystem.vue b/src/components/widgets/filesystem/FileSystem.vue
@@ -32,6 +32,7 @@
       v-if="selected.length > 0"
       :path="visiblePath"
       @remove="handleRemove(selected)"
+      @create-zip="handleCreateZip(selected)"
     />
 
     <file-system-browser
@@ -69,6 +70,7 @@
       @preview-gcode="handlePreviewGcode"
       @view-thumbnail="handleViewThumbnail"
       @enqueue="handleEnqueue"
+      @create-zip="handleCreateZip"
     />
 
     <file-editor-dialog
@@ -882,6 +884,17 @@ export default class FileSystem extends Mixins(StateMixin, FilesMixin, ServicesM
     SocketActions.serverJobQueuePostJob([filepath])
   }
 
+  handleCreateZip (file: FileBrowserEntry | FileBrowserEntry[]) {
+    const dest = Array.isArray(file)
+      ? `${this.currentPath}/${Date.now()}.zip`
+      : `${this.currentPath}/${file.name}_${Date.now()}.zip`
+
+    const items = (Array.isArray(file) ? file : [file])
+      .map(item => `${this.currentPath}/${item.name}`)
+
+    SocketActions.serverFilesZip(dest, items)
+  }
+
   /**
    * ===========================================================================
    * Drag handling.

diff --git a/src/components/widgets/filesystem/FileSystemBrowser.vue b/src/components/widgets/filesystem/FileSystemBrowser.vue
@@ -64,7 +64,7 @@
                 :small="dense"
                 :color="(item.type === 'file') ? 'grey' : 'primary'"
               >
-                {{ (item.type === 'file' ? '$file' : item.name === '..' ? '$folderUp' : '$folder') }}
+                {{ getItemIcon(item) }}
               </v-icon>
               <img
                 v-else
@@ -383,6 +383,20 @@ export default class FileSystemBrowser extends Mixins(FilesMixin) {
     }
   }
 
+  getItemIcon (item: FileBrowserEntry) {
+    if (item.type === 'file') {
+      if (item.extension === 'zip') {
+        return '$fileZip'
+      } else {
+        return '$file'
+      }
+    } else if (item.name === '..') {
+      return '$folderUp'
+    } else {
+      return '$folder'
+    }
+  }
+
   // Determines if a row is currently in a draggable state or not.
   draggable (item: FileBrowserEntry | AppFileWithMeta) {
     return (

diff --git a/src/components/widgets/filesystem/FileSystemBulkActions.vue b/src/components/widgets/filesystem/FileSystemBulkActions.vue
@@ -10,6 +10,24 @@
 
     <v-spacer />
 
+    <v-tooltip bottom>
+      <template #activator="{ on, attrs }">
+        <v-btn
+          v-bind="attrs"
+          fab
+          small
+          text
+          v-on="on"
+          @click="$emit('create-zip')"
+        >
+          <v-icon>
+            $fileZipAdd
+          </v-icon>
+        </v-btn>
+      </template>
+      <span>{{ $t('app.general.btn.create_zip_archive') }}</span>
+    </v-tooltip>
+
     <v-tooltip bottom>
       <template #activator="{ on, attrs }">
         <v-btn

diff --git a/src/components/widgets/filesystem/FileSystemContextMenu.vue b/src/components/widgets/filesystem/FileSystemContextMenu.vue
@@ -73,24 +73,34 @@
               <v-list-item-title>{{ $t('app.general.btn.view') }}</v-list-item-title>
             </v-list-item>
             <v-list-item
-              v-if="file.type !== 'directory'"
+              v-if="canPreviewGcode"
               link
-              @click="$emit('download', file)"
+              @click="$emit('preview-gcode', file)"
             >
               <v-list-item-icon>
-                <v-icon>$download</v-icon>
+                <v-icon>$magnify</v-icon>
               </v-list-item-icon>
-              <v-list-item-title>{{ $t('app.general.btn.download') }}</v-list-item-title>
+              <v-list-item-title>{{ $t('app.general.btn.preview_gcode') }}</v-list-item-title>
             </v-list-item>
             <v-list-item
-              v-if="file.type !== 'directory' && canPreviewGcode"
+              v-if="canCreateZip"
               link
-              @click="$emit('preview-gcode', file)"
+              @click="$emit('create-zip', file)"
             >
               <v-list-item-icon>
-                <v-icon>$magnify</v-icon>
+                <v-icon>$fileZipAdd</v-icon>
               </v-list-item-icon>
-              <v-list-item-title>{{ $t('app.general.btn.preview_gcode') }}</v-list-item-title>
+              <v-list-item-title>{{ $t('app.general.btn.create_zip_archive') }}</v-list-item-title>
+            </v-list-item>
+            <v-list-item
+              v-if="file.type !== 'directory'"
+              link
+              @click="$emit('download', file)"
+            >
+              <v-list-item-icon>
+                <v-icon>$download</v-icon>
+              </v-list-item-icon>
+              <v-list-item-title>{{ $t('app.general.btn.download') }}</v-list-item-title>
             </v-list-item>
             <v-list-item
               v-if="!rootProperties.readonly"
@@ -196,6 +206,14 @@ export default class FileSystemContextMenu extends Mixins(StateMixin, FilesMixin
     )
   }
 
+  get canCreateZip () {
+    return (
+      (this.file.type !== 'file' || this.file.extension !== 'zip') &&
+      !this.rootProperties.readonly &&
+      this.$store.getters['server/getIsMinApiVersion'](1, 1)
+    )
+  }
+
   get supportsJobQueue (): boolean {
     return this.$store.getters['server/componentSupport']('job_queue')
   }

diff --git a/src/globals.ts b/src/globals.ts
@@ -131,6 +131,8 @@ import {
   mdiLayers,
   mdiLayersPlus,
   mdiFolderOpen,
+  mdiArchive,
+  mdiArchivePlus,
   mdiTrayFull,
   mdiTrayPlus
 } from '@mdi/js'
@@ -347,6 +349,8 @@ export const Icons = Object.freeze({
   extrusions: mdiPrinter3dNozzle,
   retractions: mdiSwapVertical,
   folderOpen: mdiFolderOpen,
+  fileZip: mdiArchive,
+  fileZipAdd: mdiArchivePlus,
   jobQueue: mdiTrayFull,
   enqueueJob: mdiTrayPlus
 })

diff --git a/src/locales/en.yaml b/src/locales/en.yaml
@@ -146,6 +146,7 @@ app:
       clear_profile: Clear Profile
       close: Close
       config_reference: Config Reference
+      create_zip_archive: Create ZIP Archive
       delete: Delete
       download: Download
       edit: Edit

diff --git a/src/store/server/getters.ts b/src/store/server/getters.ts
@@ -2,6 +2,7 @@ import { GetterTree } from 'vuex'
 import { ServerInfo, ServerConfig, ServerState, SystemInfo, ServerSystemStat, ServiceInfo, ServiceState } from './types'
 import { RootState } from '../types'
 import { Globals } from '@/globals'
+import numberArrayCompare from '@/util/number-array-compare'
 
 export const getters: GetterTree<ServerState, RootState> = {
   /**
@@ -11,6 +12,10 @@ export const getters: GetterTree<ServerState, RootState> = {
     return state.info
   },
 
+  getIsMinApiVersion: (state) => (...version: number[]) => {
+    return numberArrayCompare(state.info.api_version ?? [], version) <= 0
+  },
+
   /**
    * Gets the current system info
    */

diff --git a/src/store/server/types.ts b/src/store/server/types.ts
@@ -37,6 +37,8 @@ export interface ServerInfo {
   components: string[];
   registered_directories: string[];
   warnings: string[];
+  api_version?: number[]
+  api_version_string?: string
 }
 
 export interface SystemInfo {

diff --git a/src/store/version/getters.ts b/src/store/version/getters.ts
@@ -73,9 +73,9 @@ export const getters: GetterTree<VersionState, RootState> = {
    */
   getCommitHistory: (state) => (component: string) => {
     // This is only relevant for certain types.
-    if (state.version_info[component] && isOfType<HashVersion>(state.version_info[component], 'git_messages')) {
-      const c = state.version_info[component] as HashVersion
-      const result = [...c.commits_behind]
+    const componentVersionInfo = state.version_info[component]
+    if (state.version_info[component] && isOfType<HashVersion>(componentVersionInfo, 'git_messages')) {
+      const result = [...componentVersionInfo.commits_behind]
         .reduce((groups, commitItem) => {
           const dateAndTime = new Date(+commitItem.date * 1000)
           const dateOnly = +(new Date(dateAndTime.getFullYear(), dateAndTime.getMonth(), dateAndTime.getDate()))

diff --git a/src/util/number-array-compare.ts b/src/util/number-array-compare.ts
@@ -0,0 +1,18 @@
+const numberArrayCompare = (versionA: number[], versionB: number[]) => {
+  const count = Math.max(versionA.length, versionB.length)
+
+  for (let index = 0; index < count; index++) {
+    const a = versionA[index] ?? 0
+    const b = versionB[index] ?? 0
+
+    if (a > b) {
+      return -1
+    } else if (a < b) {
+      return 1
+    }
+  }
+
+  return 0
+}
+
+export default numberArrayCompare
diff --git a/src/views/Configure.vue b/src/views/Configure.vue
@@ -13,6 +13,7 @@
           :roots="['config']"
           :max-height="816"
           name="configure"
+          bulk-actions
         />
       </collapsable-card>
     </v-col>