npm - @necrolab/dashboard - Versions diffs - 0.5.30 → 0.5.32 - Mend

@necrolab/dashboard 0.5.30 → 0.5.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (15) hide show

package/index.html +5 -6
package/package.json +5 -5
package/postinstall.js +86 -101
package/public/manifest.json +4 -4
package/scripts/build.mjs +40 -0
package/scripts/generate-sw.mjs +43 -0
package/src/components/Editors/Account/AccountView.vue +17 -1
package/src/components/Editors/Profile/ProfileView.vue +17 -1
package/src/components/Tasks/TaskView.vue +26 -10
package/src/composables/useDynamicTableHeight.js +23 -6
package/src/registerServiceWorker.js +40 -27
package/workbox-config.cjs +27 -22
/package/public/{android-chrome-192x192.png → img/pwa/android-chrome-192x192.png} +0 -0
/package/public/{android-chrome-512x512.png → img/pwa/android-chrome-512x512.png} +0 -0
/package/public/{apple-touch-icon.png → img/pwa/apple-touch-icon.png} +0 -0

package/index.html CHANGED Viewed

@@ -3,6 +3,8 @@
     <head>
         <meta charset="UTF-8" />
         <link rel="icon" href="/favicon.ico" />
+        <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
+        <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
         <meta
             name="viewport"
             content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />
@@ -97,14 +99,11 @@
         <link rel="prefetch" as="image" href="/flags/ae.svg" />
         <!-- Prefetch other logo variants -->
-        <link rel="prefetch" as="image" href="/android-chrome-192x192.png" />
+        <link rel="prefetch" as="image" href="/img/pwa/android-chrome-192x192.png" />
-        <!-- Prefetch PWA resources -->
-        <link rel="prefetch" as="script" href="/sw.js" />
-        <link rel="manifest" href="/manifest.json?v=3" crossorigin />
+        <link rel="manifest" href="/manifest.json" crossorigin />
         <meta name="theme-color" content="#1a1b1e" />
-        <link rel="apple-touch-icon" href="/apple-touch-icon.png?v=3" />
+        <link rel="apple-touch-icon" href="/img/pwa/apple-touch-icon.png" />
         <!-- Prism.js for syntax highlighting -->
         <link

package/package.json CHANGED Viewed

@@ -1,9 +1,9 @@
 {
     "name": "@necrolab/dashboard",
-    "version": "0.5.30",
+    "version": "0.5.32",
     "type": "module",
     "scripts": {
-        "build": "rm -rf dist && vite build && npx workbox-cli generateSW workbox-config.cjs",
+        "build": "node scripts/build.mjs",
         "dev": "node dev-server.js",
         "bot": "node dev-server.js",
         "expose": "node dev-server.js",
@@ -38,7 +38,8 @@
         "vue-virtual-scroller": "^2.0.0-beta.8",
         "vue3-toastify": "^0.0.4",
         "vuedraggable": "^4.1.0",
-        "websocket-heartbeat-js": "^1.1.3"
+        "websocket-heartbeat-js": "^1.1.3",
+        "workbox-build": "^7.3.0"
     },
     "main": "index.js",
     "devDependencies": {
@@ -46,8 +47,7 @@
         "@eslint/js": "^9.39.2",
         "eslint": "^9.17.0",
         "eslint-plugin-vue": "^9.32.0",
-        "globals": "^17.3.0",
-        "workbox-cli": "^7.3.0"
+        "globals": "^17.3.0"
     },
     "overrides": {
         "glob": "^11.0.0",

package/postinstall.js CHANGED Viewed

@@ -1,124 +1,109 @@
 import fs from "node:fs";
-import { execSync } from "node:child_process";
 import path from "node:path";
+import { execFileSync } from "node:child_process";
 import { fileURLToPath } from "node:url";
-const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const packageRoot = path.dirname(fileURLToPath(import.meta.url));
+const buildScriptPath = path.join(packageRoot, "scripts", "build.mjs");
-// Read package.json to get current version
-const packageJsonPath = path.join(__dirname, "package.json");
-let currentVersion = "0.0.0";
-try {
+function readPackageVersion() {
+    const packageJsonPath = path.join(packageRoot, "package.json");
     const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, "utf-8"));
-    currentVersion = packageJson.version;
-} catch (e) {
-    console.error(`Failed to read package.json version: ${e.message}`);
+    return packageJson.version || "0.0.0";
 }
-try {
-    // Detect if we're running inside the project itself or as a dependency
-    const isInsideProject = __dirname.includes("node_modules") === false;
-    let distPath, versionFilePath;
-    if (isInsideProject) {
-        // Running inside the project itself - build to ./dist
-        distPath = path.join(__dirname, "dist");
-        versionFilePath = path.join(distPath, "version.txt");
-    } else {
-        // Running as a dependency - build to parent project's dashboard/dist
-        const projectRoot = path.resolve(__dirname, "../../..");
-        const dashboardDir = path.join(projectRoot, "dashboard");
-        distPath = path.join(dashboardDir, "dist");
-        versionFilePath = path.join(distPath, "version.txt");
+function isDependencyInstall() {
+    return packageRoot.includes(`${path.sep}node_modules${path.sep}`);
+}
+function getHostProjectRoot() {
+    const marker = `${path.sep}node_modules${path.sep}`;
+    const markerIndex = packageRoot.lastIndexOf(marker);
+    if (markerIndex === -1) {
+        return packageRoot;
     }
-    // Check if we can skip logic
-    console.log(`Checking version at ${distPath}...`);
-    if (fs.existsSync(versionFilePath)) {
-        try {
-            const installedVersion = fs.readFileSync(versionFilePath, "utf-8").trim();
-            if (installedVersion === currentVersion) {
-                console.log(`Version ${currentVersion} is already installed at ${distPath}. Skipping build.`);
-                process.exit(0);
-            } else {
-                console.log(
-                    `Version mismatch (Installed: ${installedVersion}, Target: ${currentVersion}). Proceeding with build.`
-                );
-            }
-        } catch {
-            console.log("Could not read version file. Proceeding with build.");
-        }
-    } else {
-        console.log("No version file found. Proceeding with build.");
+    return packageRoot.slice(0, markerIndex);
+}
+function resolveTargetDistPath() {
+    if (!isDependencyInstall()) {
+        return path.join(packageRoot, "dist");
     }
-    console.log("Running postinstall build...");
-    // Service Worker
-    console.log("Generating service worker...");
-    try {
-        execSync(`npx workbox-cli generateSW workbox-config.cjs`, {
-            cwd: __dirname,
-            stdio: "inherit"
-        });
-    } catch (error) {
-        console.error("Failed to generate service worker.");
-        throw error;
+    return path.join(getHostProjectRoot(), "dashboard", "dist");
+}
+function readInstalledVersion(versionFilePath) {
+    if (!fs.existsSync(versionFilePath)) {
+        return null;
     }
-    // Build
-    console.log("Building with Vite...");
-    try {
-        execSync(`npx vite build`, {
-            cwd: __dirname,
-            stdio: "inherit"
-        });
-    } catch (error) {
-        console.error("Failed to build with Vite.");
-        throw error;
+    return fs.readFileSync(versionFilePath, "utf-8").trim() || null;
+}
+function runBuildPipeline() {
+    execFileSync(process.execPath, [buildScriptPath], {
+        cwd: packageRoot,
+        stdio: "inherit"
+    });
+}
+function ensureDirectory(directoryPath) {
+    if (!fs.existsSync(directoryPath)) {
+        fs.mkdirSync(directoryPath, { recursive: true });
     }
+}
-    const buildPath = path.join(__dirname, "dist");
+function copyBuiltDistToTarget(targetDistPath) {
+    const sourceDistPath = path.join(packageRoot, "dist");
+    if (!fs.existsSync(sourceDistPath)) {
+        throw new Error(`Build failed: ${sourceDistPath} does not exist.`);
+    }
-    if (!fs.existsSync(buildPath)) {
-        throw new Error(`Build failed: ${buildPath} does not exist.`);
+    if (path.resolve(sourceDistPath) === path.resolve(targetDistPath)) {
+        return;
     }
-    if (isInsideProject) {
-        // Running inside project - dist is already in the right place, just write version
-        console.log("Build artifacts already in correct location.");
-        fs.writeFileSync(versionFilePath, currentVersion);
-        console.log(`Written version ${currentVersion} to ${versionFilePath}`);
-    } else {
-        // Running as dependency - move dist to parent project
-        console.log("Moving build artifacts...");
-        // Ensure target directory exists
-        const dashboardDir = path.dirname(distPath);
-        if (!fs.existsSync(dashboardDir)) {
-            console.log(`Creating target directory: ${dashboardDir}`);
-            fs.mkdirSync(dashboardDir, { recursive: true });
-        }
-        // Clean destination
-        if (fs.existsSync(distPath)) {
-            fs.rmSync(distPath, { recursive: true, force: true });
-        }
-        // Copy
-        fs.cpSync(buildPath, distPath, { recursive: true });
-        // Write version file
-        fs.writeFileSync(versionFilePath, currentVersion);
-        console.log(`Written version ${currentVersion} to ${versionFilePath}`);
-        // Cleanup source dist
-        fs.rmSync(buildPath, { recursive: true, force: true });
+    ensureDirectory(path.dirname(targetDistPath));
+    fs.rmSync(targetDistPath, { recursive: true, force: true });
+    fs.cpSync(sourceDistPath, targetDistPath, { recursive: true });
+    if (isDependencyInstall()) {
+        fs.rmSync(sourceDistPath, { recursive: true, force: true });
     }
+}
+function writeVersionFile(versionFilePath, version) {
+    ensureDirectory(path.dirname(versionFilePath));
+    fs.writeFileSync(versionFilePath, version);
+}
+function runPostinstall() {
+    const targetDistPath = resolveTargetDistPath();
+    const versionFilePath = path.join(targetDistPath, "version.txt");
+    const currentVersion = readPackageVersion();
+    const installedVersion = readInstalledVersion(versionFilePath);
+    console.log(`[postinstall] Target dist: ${targetDistPath}`);
+    console.log(`[postinstall] Package version: ${currentVersion}`);
-    console.log("Postinstall completed successfully.");
-} catch (e) {
-    console.error(`An error occurred: ${e.message}`);
+    if (installedVersion === currentVersion) {
+        console.log("[postinstall] Dashboard bundle is already up to date. Skipping build.");
+        return;
+    }
+    runBuildPipeline();
+    copyBuiltDistToTarget(targetDistPath);
+    writeVersionFile(versionFilePath, currentVersion);
+    console.log("[postinstall] Dashboard bundle is ready.");
+}
+try {
+    runPostinstall();
+} catch (error) {
+    console.error(`[postinstall] Failed: ${error.message}`);
     process.exit(1);
 }

package/public/manifest.json CHANGED Viewed

@@ -3,24 +3,24 @@
     "name": "Necro Dashboard",
     "icons": [
         {
-            "src": "/android-chrome-192x192.png?v=3",
+            "src": "/img/pwa/android-chrome-192x192.png",
             "type": "image/png",
             "sizes": "192x192",
             "purpose": "any"
         },
         {
-            "src": "/android-chrome-512x512.png?v=3",
+            "src": "/img/pwa/android-chrome-512x512.png",
             "type": "image/png",
             "sizes": "512x512",
             "purpose": "maskable"
         },
         {
-            "src": "/android-chrome-512x512.png?v=3",
+            "src": "/img/pwa/android-chrome-512x512.png",
             "type": "image/png",
             "sizes": "512x512"
         },
         {
-            "src": "/apple-touch-icon.png?v=3",
+            "src": "/img/pwa/apple-touch-icon.png",
             "type": "image/png",
             "sizes": "180x180"
         }

package/scripts/build.mjs ADDED Viewed

@@ -0,0 +1,40 @@
+import fs from "node:fs";
+import path from "node:path";
+import { spawnSync } from "node:child_process";
+import { createRequire } from "node:module";
+import { fileURLToPath } from "node:url";
+import { generateServiceWorker } from "./generate-sw.mjs";
+const require = createRequire(import.meta.url);
+const scriptsDirectory = path.dirname(fileURLToPath(import.meta.url));
+const projectRoot = path.resolve(scriptsDirectory, "..");
+const distDirectory = path.join(projectRoot, "dist");
+function runNodeScript(scriptPath, args = []) {
+    const commandResult = spawnSync(process.execPath, [scriptPath, ...args], {
+        cwd: projectRoot,
+        stdio: "inherit"
+    });
+    if (commandResult.status !== 0) {
+        const exitCode = commandResult.status ?? 1;
+        throw new Error(`Command failed (${path.basename(scriptPath)}) with exit code ${exitCode}.`);
+    }
+}
+function runViteBuild() {
+    const vitePackageJsonPath = require.resolve("vite/package.json");
+    const viteBinPath = path.join(path.dirname(vitePackageJsonPath), "bin", "vite.js");
+    runNodeScript(viteBinPath, ["build"]);
+}
+async function runBuild() {
+    fs.rmSync(distDirectory, { recursive: true, force: true });
+    runViteBuild();
+    await generateServiceWorker(projectRoot);
+}
+runBuild().catch((error) => {
+    console.error(`[build] Failed: ${error.message}`);
+    process.exit(1);
+});

package/scripts/generate-sw.mjs ADDED Viewed

@@ -0,0 +1,43 @@
+import fs from "node:fs";
+import path from "node:path";
+import { createRequire } from "node:module";
+import { fileURLToPath } from "node:url";
+const require = createRequire(import.meta.url);
+const currentFilePath = fileURLToPath(import.meta.url);
+export async function generateServiceWorker(projectRoot) {
+    const rootPath = projectRoot ?? path.resolve(path.dirname(currentFilePath), "..");
+    const configPath = path.join(rootPath, "workbox-config.cjs");
+    if (!fs.existsSync(configPath)) {
+        throw new Error(`Missing Workbox config: ${configPath}`);
+    }
+    const baseConfig = require(configPath);
+    const { generateSW } = require("workbox-build");
+    const normalizedConfig = {
+        ...baseConfig,
+        globDirectory: path.resolve(rootPath, baseConfig.globDirectory ?? "dist"),
+        swDest: path.resolve(rootPath, baseConfig.swDest ?? "dist/sw.js")
+    };
+    const { count, size, warnings } = await generateSW(normalizedConfig);
+    if (warnings?.length) {
+        for (const warning of warnings) {
+            console.warn(`[workbox] ${warning}`);
+        }
+    }
+    const totalKilobytes = (size / 1024).toFixed(2);
+    console.log(`[workbox] Generated service worker with ${count} entries (${totalKilobytes} KiB).`);
+}
+if (process.argv[1] && path.resolve(process.argv[1]) === currentFilePath) {
+    generateServiceWorker().catch((error) => {
+        console.error(`[workbox] Failed: ${error.message}`);
+        process.exit(1);
+    });
+}

package/src/components/Editors/Account/AccountView.vue CHANGED Viewed

@@ -30,7 +30,7 @@
             </div>
         </Header>
         <RecycleScroller
-            v-if="props.accounts.length !== 0"
+            v-if="props.accounts.length !== 0 && useVirtualScroller"
             class="hidden-scrollbars touch-pan-y overflow-y-auto overflow-x-hidden transition-colors duration-150 table-scroll scrollable"
             :style="{ height: dynamicTableHeight, maxHeight: dynamicTableHeight }"
             :items="virtualAccounts"
@@ -46,6 +46,20 @@
                 </div>
             </template>
         </RecycleScroller>
+        <div
+            v-else-if="props.accounts.length !== 0"
+            class="hidden-scrollbars touch-pan-y overflow-y-auto overflow-x-hidden transition-colors duration-150 table-scroll scrollable"
+            :style="{ maxHeight: dynamicTableHeight }">
+            <div
+                v-for="(item, index) in virtualAccounts"
+                :key="item.virtualKey"
+                class="min-h-16 flex-shrink-0 hover:bg-dark-550">
+                <Account
+                    :class="getRowClass(index)"
+                    :account="item.account"
+                    :privacy="props.privacy" />
+            </div>
+        </div>
         <EmptyState v-else :icon="MailIcon" message="No accounts found" subtitle="Create accounts to get started" />
     </div>
 </template>
@@ -89,6 +103,8 @@ const virtualAccounts = computed(() =>
         virtualKey: String(account.id ?? account.email ?? "account")
     }))
 );
+const ACCOUNT_VIRTUALIZE_THRESHOLD = 80;
+const useVirtualScroller = computed(() => props.accounts.length > ACCOUNT_VIRTUALIZE_THRESHOLD);
 const handleVirtualWheel = (event) => {
     const target = event.currentTarget;

package/src/components/Editors/Profile/ProfileView.vue CHANGED Viewed

@@ -34,7 +34,7 @@
             </div>
         </Header>
         <RecycleScroller
-            v-if="props.profiles.length !== 0"
+            v-if="props.profiles.length !== 0 && useVirtualScroller"
             class="hidden-scrollbars touch-pan-y overflow-y-auto overflow-x-hidden transition-colors duration-150 table-scroll scrollable"
             :style="{ height: dynamicTableHeight, maxHeight: dynamicTableHeight }"
             :items="virtualProfiles"
@@ -50,6 +50,20 @@
                 </div>
             </template>
         </RecycleScroller>
+        <div
+            v-else-if="props.profiles.length !== 0"
+            class="hidden-scrollbars touch-pan-y overflow-y-auto overflow-x-hidden transition-colors duration-150 table-scroll scrollable"
+            :style="{ maxHeight: dynamicTableHeight }">
+            <div
+                v-for="(item, index) in virtualProfiles"
+                :key="item.virtualKey"
+                class="min-h-16 flex-shrink-0 hover:bg-dark-550">
+                <Profile
+                    :class="getRowClass(index)"
+                    :profile="item.profile"
+                    :privacy="props.privacy" />
+            </div>
+        </div>
         <EmptyState v-else :icon="ProfileIcon" message="No profiles found" subtitle="Create profiles to get started" />
     </div>
 </template>
@@ -88,6 +102,8 @@ const virtualProfiles = computed(() =>
         virtualKey: String(profile.id ?? `${profile.profileName ?? "profile"}-${profile.cardNumber ?? ""}`)
     }))
 );
+const PROFILE_VIRTUALIZE_THRESHOLD = 80;
+const useVirtualScroller = computed(() => props.profiles.length > PROFILE_VIRTUALIZE_THRESHOLD);
 const handleVirtualWheel = (event) => {
     const target = event.currentTarget;

package/src/components/Tasks/TaskView.vue CHANGED Viewed

@@ -35,9 +35,9 @@
             </div>
         </Header>
         <DynamicScroller
-            v-if="virtualTaskItems.length"
+            v-if="virtualTaskItems.length && useVirtualScroller"
             class="hidden-scrollbars touch-pan-y min-h-0 overflow-y-auto overflow-x-hidden scrollable"
-            :style="{ height: dynamicTableHeight, maxHeight: dynamicTableHeight }"
+            :style="{ height: maxTableHeight, maxHeight: maxTableHeight }"
             :items="virtualTaskItems"
             :min-item-size="virtualMinItemSize"
             :buffer="virtualBuffer"
@@ -66,10 +66,25 @@
                 </DynamicScrollerItem>
             </template>
         </DynamicScroller>
+        <div
+            v-else-if="virtualTaskItems.length"
+            class="hidden-scrollbars touch-pan-y min-h-0 overflow-y-auto overflow-x-hidden scrollable"
+            :style="{ maxHeight: maxTableHeight }">
+            <div
+                v-for="(item, index) in virtualTaskItems"
+                :key="item.taskId"
+                class="shrink-0 border-b border-dark-650 min-h-14.5 md:min-h-17.25 has-[.event-details]:min-h-18.75 mobile-portrait:min-h-12.5 transition-colors duration-150 ease-in-out hover:!bg-dark-550">
+                <Task
+                    v-if="props.tasks[item.taskId]"
+                    :task="props.tasks[item.taskId]"
+                    :preferEventName="props.preferEventName"
+                    :class="getRowClass(index)" />
+            </div>
+        </div>
         <div
             v-else
             class="empty-state flex flex-col items-center justify-center py-8 text-center bg-dark-400 text-light-500 text-sm font-medium"
-            :style="{ minHeight: dynamicTableHeight, maxHeight: dynamicTableHeight }">
+            :style="{ minHeight: emptyStateHeight }">
             <div
                 v-if="
                     !ui.queueStats.queued && !ui.queueStats.sleeping && ui.queueStats.nextQueuePasses.length === 0
@@ -237,6 +252,9 @@ onUnmounted(() => {
 const virtualMinItemSize = computed(() => (windowWidth.value <= 768 ? 58 : 69));
 const virtualBuffer = computed(() => virtualMinItemSize.value * 8);
+const TASK_VIRTUALIZE_THRESHOLD = 80;
+const useVirtualScroller = computed(() => virtualTaskItems.value.length > TASK_VIRTUALIZE_THRESHOLD);
+const emptyStateHeight = computed(() => `${virtualMinItemSize.value * 2}px`);
 const handleVirtualWheel = (event) => {
     const target = event.currentTarget;
@@ -244,7 +262,7 @@ const handleVirtualWheel = (event) => {
     target.scrollTop += event.deltaY;
 };
-const dynamicTableHeight = computed(() => {
+const maxTableHeight = computed(() => {
     // Detect PWA mode (standalone display)
     const isPWA = window.matchMedia('(display-mode: standalone)').matches;
@@ -280,12 +298,10 @@ const dynamicTableHeight = computed(() => {
     // Calculate row height based on screen size
     const rowHeight = windowWidth.value <= 768 ? 58 : 69; // Mobile vs desktop row height
-    const minRowsToShow = 2; // Always show at least 2 rows
-    const minHeight = minRowsToShow * rowHeight;
-    // Calculate how many complete rows can fit
-    const maxCompleteRows = Math.floor(Math.max(availableHeight, minHeight) / rowHeight) + 1;
-    const exactHeight = maxCompleteRows * rowHeight;
+    const safeAvailableHeight = Math.max(availableHeight, rowHeight * 2);
+    const desktopBonusRows = windowWidth.value >= 1024 ? 1 : 0;
+    const maxRowsThatFit = Math.max(1, Math.floor(safeAvailableHeight / rowHeight) + desktopBonusRows);
+    const exactHeight = maxRowsThatFit * rowHeight;
     return exactHeight + "px";
 });

package/src/composables/useDynamicTableHeight.js CHANGED Viewed

@@ -1,14 +1,15 @@
-import { computed } from "vue";
+import { computed, unref } from "vue";
 import { useWindowDimensions } from "./useWindowDimensions";
-export function useDynamicTableHeight(options = {}) {
+export function useDynamicTableHeight(options = {}, itemCount = null) {
     const { windowHeight, windowWidth } = useWindowDimensions();
     const {
         topReservedSpace = options.TOP_RESERVED_SPACE ?? 243,
         bottomBuffer = options.BOTTOM_BUFFER ?? 16,
         rowHeight = options.ROW_HEIGHT ?? 64,
-        minRowsToShow = options.MIN_ROWS_TO_SHOW ?? 2
+        minRowsToShow = options.MIN_ROWS_TO_SHOW ?? 2,
+        minRowsWhenEmpty = options.MIN_ROWS_WHEN_EMPTY ?? minRowsToShow
     } = options;
     const dynamicTableHeight = computed(() => {
@@ -22,9 +23,25 @@ export function useDynamicTableHeight(options = {}) {
         const extraBuffer = isPWA && isMobile ? (isIPhonePortrait ? 24 : 40) : 0;
         const availableHeight = windowHeight.value - topReservedSpace - bottomBuffer - extraBuffer;
-        const minHeight = minRowsToShow * rowHeight;
-        const maxCompleteRows = Math.floor(Math.max(availableHeight, minHeight) / rowHeight);
-        const exactHeight = maxCompleteRows * rowHeight;
+        const safeAvailableHeight = Math.max(availableHeight, rowHeight);
+        const maxRowsThatFit = Math.max(1, Math.floor(safeAvailableHeight / rowHeight));
+        if (itemCount === null || itemCount === undefined) {
+            const minRows = Math.max(1, minRowsToShow);
+            const exactHeight = Math.max(minRows, maxRowsThatFit) * rowHeight;
+            return exactHeight + "px";
+        }
+        const count = Number(unref(itemCount) || 0);
+        let targetRows = Math.max(1, minRowsWhenEmpty);
+        if (count > 0) {
+            targetRows = Math.max(1, Math.min(count, maxRowsThatFit));
+        } else {
+            targetRows = Math.min(maxRowsThatFit, Math.max(1, minRowsWhenEmpty));
+        }
+        const exactHeight = targetRows * rowHeight;
         return exactHeight + "px";
     });

package/src/registerServiceWorker.js CHANGED Viewed

@@ -2,31 +2,44 @@
 import { register } from "register-service-worker";
-if (process.env.NODE_ENV != "development") {
-    register(`/sw.js`, {
-        ready() {
-            console.log(
-                "App is being served from cache by a service worker.\n" +
-                    "For more details, visit https://goo.gl/AFskqB"
-            );
-        },
-        registered() {
-            console.log("Service worker has been registered.");
-        },
-        cached() {
-            console.log("Content has been cached for offline use.");
-        },
-        updatefound() {
-            console.log("New content is downloading.");
-        },
-        updated() {
-            console.log("New content is available; please refresh.");
-        },
-        offline() {
-            console.log("No internet connection found. App is running in offline mode.");
-        },
-        error(error) {
-            console.error("Error during service worker registration:", error);
-        }
-    });
+if ("serviceWorker" in navigator) {
+    if (import.meta.env.PROD) {
+        register("/sw.js", {
+            ready() {
+                console.log(
+                    "App is being served from cache by a service worker.\n" +
+                        "For more details, visit https://goo.gl/AFskqB"
+                );
+            },
+            registered() {
+                console.log("Service worker has been registered.");
+            },
+            cached() {
+                console.log("Content has been cached for offline use.");
+            },
+            updatefound() {
+                console.log("New content is downloading.");
+            },
+            updated() {
+                console.log("New content is available; please refresh.");
+            },
+            offline() {
+                console.log("No internet connection found. App is running in offline mode.");
+            },
+            error(error) {
+                console.error("Error during service worker registration:", error);
+            }
+        });
+    } else {
+        window.addEventListener("load", () => {
+            navigator.serviceWorker
+                .getRegistrations()
+                .then((registrations) => {
+                    for (const registration of registrations) {
+                        registration.unregister();
+                    }
+                })
+                .catch(() => {});
+        });
+    }
 }

package/workbox-config.cjs CHANGED Viewed

@@ -1,20 +1,25 @@
 module.exports = {
     globDirectory: "dist/",
     globPatterns: [
-        // HTML files
-        "**/*.html",
-        // All built assets (JS, CSS)
-        "assets/**/*.{js,css}",
-        // All images (including bundled ones)
-        "**/*.{png,ico,svg,jpg,jpeg,webp,gif}",
-        // Manifest and other static files
+        // App shell + bundled assets
+        "index.html",
+        "assets/**/*.{js,css,woff2,woff,ttf,eot,png,ico,svg,jpg,jpeg,webp,gif}",
+        // Public static assets
+        "img/**/*.{png,ico,svg,jpg,jpeg,webp,gif}",
+        "flags/**/*.svg",
         "manifest.json",
-        "*.{png,ico,webp}"
+        "favicon.ico",
+        "favicon-16x16.png",
+        "favicon-32x32.png",
+        "robots.txt"
     ],
+    globIgnores: ["sw.js", "workbox-*.js"],
     swDest: "dist/sw.js",
+    mode: "production",
     sourcemap: false,
     skipWaiting: true,
     clientsClaim: true,
+    navigateFallback: "/index.html",
     ignoreURLParametersMatching: [/^utm_/, /^fbclid$/],
     cleanupOutdatedCaches: true,
     // Increase max size to handle larger bundles
@@ -33,6 +38,18 @@ module.exports = {
                 }
             }
         },
+        // Country flags
+        {
+            urlPattern: /\/flags\//,
+            handler: "CacheFirst",
+            options: {
+                cacheName: "country-flags",
+                expiration: {
+                    maxEntries: 50,
+                    maxAgeSeconds: 60 * 60 * 24 * 90 // 90 days
+                }
+            }
+        },
         // Images - Cache first for best performance
         {
             urlPattern: /\.(?:png|jpg|jpeg|svg|gif|webp|ico)$/,
@@ -52,8 +69,8 @@ module.exports = {
             options: {
                 cacheName: "static-resources",
                 expiration: {
-                    maxEntries: 100, // Increased for more assets
-                    maxAgeSeconds: 60 * 60 * 24 * 30 // 30 days (longer)
+                    maxEntries: 100,
+                    maxAgeSeconds: 60 * 60 * 24 * 30
                 }
             }
         },
@@ -77,18 +94,6 @@ module.exports = {
                 }
             }
         },
-        // Country flags
-        {
-            urlPattern: /\/flags\//,
-            handler: "CacheFirst",
-            options: {
-                cacheName: "country-flags",
-                expiration: {
-                    maxEntries: 50,
-                    maxAgeSeconds: 60 * 60 * 24 * 90 // 90 days
-                }
-            }
-        },
         // Prism.js CDN resources
         {
             urlPattern: /^https:\/\/cdnjs\.cloudflare\.com\/ajax\/libs\/prism\//,

/package/public/{android-chrome-192x192.png → img/pwa/android-chrome-192x192.png} RENAMED Viewed

File without changes

/package/public/{android-chrome-512x512.png → img/pwa/android-chrome-512x512.png} RENAMED Viewed

File without changes

/package/public/{apple-touch-icon.png → img/pwa/apple-touch-icon.png} RENAMED Viewed

File without changes