Merge pull request #2275 from s-ff/add-download-button

web: add button to download release

.github/workflows/web-deploy.yml

@@ -49,6 +49,12 @@ jobs:
       - name: Install dependencies
         run: npm ci
         working-directory: ./web/explorer
+      - name: Generate release bundle
+        run: npm run build:bundle
+        working-directory: ./web/explorer
+      - name: Zip release bundle
+        run: zip -r capa-explorer-web.zip capa-explorer-web
+        working-directory: ./web/explorer
       - name: Build
         run: npm run build
         working-directory: ./web/explorer

web/explorer/package.json

@@ -6,7 +6,7 @@
     "scripts": {
         "dev": "vite",
         "build": "vite build",
-        "build:bundle": "vite build --mode bundle",
+        "build:bundle": "vite build --mode bundle --outDir=capa-exlorer-web",
         "preview": "vite preview",
         "test": "vitest",
         "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore",

web/explorer/src/components/NavBar.vue

@@ -8,10 +8,15 @@ import Menubar from "primevue/menubar";
             <div class="flex align-items-center gap-3">
                 <a
                     v-ripple
-                    href="https://github.com/mandiant/capa"
-                    class="flex align-items-center justify-content-center text-color w-2rem"
+                    v-tooltip.right="'Download capa Explorer Web for offline usage'"
+                    href="/capa-explorer-web.zip"
+                    download="capa-explorer-web.zip"
+                    aria-label="Download capa Explorer Web release"
                 >
-                    <i id="gitsub-icon" class="pi pi-github text-2xl"></i>
+                    <i class="pi pi-download text-xl"></i>
+                </a>
+                <a v-ripple href="https://github.com/mandiant/capa" class="flex justify-content-center w-2rem">
+                    <i class="pi pi-github text-2xl"></i>
                 </a>
                 <img src="@/assets/images/icon.png" alt="Logo" class="w-2rem" />
             </div>