Merge branch 'master' into electron_fix_20250317

fix: Improve Electron application stability and asset handling
- Completely rewrite main.js for reliable asset loading - Update preload.js with proper security context isolation - Fix file:// protocol handling for application resources - Add proper error logging and reporting in Electron context - Disable service workers in Electron environment - Fix path resolution for assets in packaged application - Add prerequisite checking for Electron builds - Update electron-builder configuration The changes resolve persistent issues with: 1. Missing assets in packaged application 2. Incorrect path resolution in production builds 3. Service worker conflicts in desktop environment 4. Security context handling in preload script 5. Electron build process reliability
2025-03-24 12:19:33 +00:00 · 2025-03-17 07:18:06 +00:00
79 changed files with 3690 additions and 7741 deletions
--- a/.env.electron
+++ b/.env.electron
@@ -1 +0,0 @@
-PLATFORM=electron 
--- a/.env.mobile
+++ b/.env.mobile
@@ -1,5 +0,0 @@
-PLATFORM=capacitor
-VITE_ENDORSER_API_URL=https://test-api.endorser.ch/api/v2/claim
-VITE_PARTNER_API_URL=https://test-api.partner.ch/api/v2
-VITE_IMAGE_API_URL=https://test-api.images.ch/api/v2
-VITE_PUSH_SERVER_URL=https://test-api.push.ch/api/v2 
--- a/.env.web
+++ b/.env.web
@@ -1 +0,0 @@
-PLATFORM=web 
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -26,10 +26,6 @@ module.exports = {
    "no-debugger": process.env.NODE_ENV === "production" ? "error" : "warn",
    "@typescript-eslint/no-explicit-any": "warn",
    "@typescript-eslint/explicit-function-return-type": "off",
-    "@typescript-eslint/no-unnecessary-type-constraint": "off",
-    "@typescript-eslint/no-unused-vars": ["error", {
-      "argsIgnorePattern": "^_",
-      "varsIgnorePattern": "^_"
-    }]
+    "@typescript-eslint/no-unnecessary-type-constraint": "off"
  },
 };
--- a/.gitignore
+++ b/.gitignore
@@ -38,6 +38,7 @@ pnpm-debug.log*
 /dist-capacitor/
 /test-playwright-results/
 playwright-tests
+test-playwright
 dist-electron-packages
 ios
 .ruby-version
--- a/android/.gradle/buildOutputCleanup/buildOutputCleanup.lock
+++ b/android/.gradle/buildOutputCleanup/buildOutputCleanup.lock
--- a/android/.gradle/buildOutputCleanup/cache.properties
+++ b/android/.gradle/buildOutputCleanup/cache.properties
@@ -1,2 +1,2 @@
-#Thu Apr 03 10:21:42 UTC 2025
-gradle.version=8.11.1
+#Fri Mar 21 07:27:50 UTC 2025
+gradle.version=8.2.1
--- a/android/.gradle/file-system.probe
+++ b/android/.gradle/file-system.probe
--- a/android/app/capacitor.build.gradle
+++ b/android/app/capacitor.build.gradle
@@ -10,8 +10,6 @@ android {
 apply from: "../capacitor-cordova-android-plugins/cordova.variables.gradle"
 dependencies {
    implementation project(':capacitor-app')
-    implementation project(':capacitor-filesystem')
-    implementation project(':capacitor-share')

 }

--- a/android/app/src/main/assets/capacitor.plugins.json
+++ b/android/app/src/main/assets/capacitor.plugins.json
@@ -2,13 +2,5 @@
 	{
 		"pkg": "@capacitor/app",
 		"classpath": "com.capacitorjs.plugins.app.AppPlugin"
-	},
-	{
-		"pkg": "@capacitor/filesystem",
-		"classpath": "com.capacitorjs.plugins.filesystem.FilesystemPlugin"
-	},
-	{
-		"pkg": "@capacitor/share",
-		"classpath": "com.capacitorjs.plugins.share.SharePlugin"
 	}
 ]
--- a/android/app/src/main/assets/public/index.html
+++ b/android/app/src/main/assets/public/index.html
@@ -6,7 +6,7 @@
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="/favicon.ico">
    <title>TimeSafari</title>
-    <script type="module" crossorigin src="/assets/index-KPivi3wg.js"></script>
+    <script type="module" crossorigin src="/assets/index-CZMUlUNO.js"></script>
  </head>
  <body>
    <noscript>
--- a/android/build.gradle
+++ b/android/build.gradle
@@ -7,7 +7,7 @@ buildscript {
        mavenCentral()
    }
    dependencies {
-        classpath 'com.android.tools.build:gradle:8.9.1'
+        classpath 'com.android.tools.build:gradle:8.2.1'
        classpath 'com.google.gms:google-services:4.4.0'

        // NOTE: Do not place your application dependencies here; they belong
--- a/android/capacitor.settings.gradle
+++ b/android/capacitor.settings.gradle
@@ -4,9 +4,3 @@ project(':capacitor-android').projectDir = new File('../node_modules/@capacitor/

 include ':capacitor-app'
 project(':capacitor-app').projectDir = new File('../node_modules/@capacitor/app/android')
-
-include ':capacitor-filesystem'
-project(':capacitor-filesystem').projectDir = new File('../node_modules/@capacitor/filesystem/android')
-
-include ':capacitor-share'
-project(':capacitor-share').projectDir = new File('../node_modules/@capacitor/share/android')
--- a/android/gradle/wrapper/gradle-wrapper.properties
+++ b/android/gradle/wrapper/gradle-wrapper.properties
@@ -1,6 +1,6 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.11.1-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.2.1-all.zip
 networkTimeout=10000
 validateDistributionUrl=true
 zipStoreBase=GRADLE_USER_HOME
--- a/electron-builder.json
+++ b/electron-builder.json
@@ -0,0 +1,36 @@
+{
+  "appId": "app.timesafari.app",
+  "productName": "TimeSafari",
+  "directories": {
+    "output": "dist-electron-packages",
+    "buildResources": "build"
+  },
+  "files": [
+    "dist-electron/**/*",
+    "node_modules/**/*",
+    "package.json",
+    "src/electron/electron-logger.js"
+  ],
+  "extraResources": [
+    {
+      "from": "src/utils",
+      "to": "utils",
+      "filter": ["**/*"]
+    }
+  ],
+  "extraMetadata": {
+    "main": "src/electron/main.js"
+  },
+  "linux": {
+    "target": ["AppImage"],
+    "category": "Utility",
+    "maintainer": "TimeSafari Team"
+  },
+  "mac": {
+    "target": ["dmg"],
+    "category": "public.app-category.productivity"
+  },
+  "win": {
+    "target": ["nsis"]
+  }
+} 
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -22,14 +22,14 @@
    "check:ios-device": "xcrun xctrace list devices 2>&1 | grep -w 'Booted' || (echo 'No iOS simulator running' && exit 1)",
    "clean:electron": "rimraf dist-electron",
    "build:pywebview": "vite build --config vite.config.pywebview.mts",
-    "build:electron": "npm run clean:electron && vite build --config vite.config.electron.mts && node scripts/build-electron.js",
+    "build:electron": "npm run check:electron && npm run clean:electron && vite build --config vite.config.electron.mts && node scripts/build-electron.js",
    "build:capacitor": "vite build --config vite.config.capacitor.mts",
    "build:web": "vite build --config vite.config.web.mts",
-    "electron:dev": "npm run build && electron dist-electron",
+    "electron:dev": "concurrently \"vite --config vite.config.electron.mts\" \"electron .\"",
    "electron:start": "electron dist-electron",
-    "electron:build-linux": "npm run build:electron && electron-builder --linux AppImage",
-    "electron:build-linux-deb": "npm run build:electron && electron-builder --linux deb",
-    "electron:build-linux-prod": "NODE_ENV=production npm run build:electron && electron-builder --linux AppImage",
+    "electron:build-linux": "npm run check:electron && npm run build:electron && electron-builder --linux AppImage",
+    "electron:build-linux-deb": "npm run check:electron && npm run build:electron && electron-builder --linux deb",
+    "electron:build-linux-prod": "NODE_ENV=production npm run check:electron &&npm run build:electron && electron-builder --linux AppImage",
    "build:electron-prod": "NODE_ENV=production npm run build:electron",
    "pywebview:dev": "vite build --config vite.config.pywebview.mts && .venv/bin/python src/pywebview/main.py",
    "pywebview:build": "vite build --config vite.config.pywebview.mts && .venv/bin/python src/pywebview/main.py",
@@ -39,19 +39,19 @@
    "fastlane:ios:beta": "cd ios && fastlane beta",
    "fastlane:ios:release": "cd ios && fastlane release",
    "fastlane:android:beta": "cd android && fastlane beta",
-    "fastlane:android:release": "cd android && fastlane release"
+    "fastlane:android:release": "cd android && fastlane release",
+    "check:electron": "node scripts/check-electron-prerequisites.js",
+    "electron:build": "npm run check:electron && vite build --config vite.config.electron.mts && node scripts/fix-electron-paths.js && electron-builder",
+    "postinstall": "electron-builder install-app-deps"
  },
  "dependencies": {
    "@capacitor/android": "^6.2.0",
    "@capacitor/app": "^6.0.0",
    "@capacitor/cli": "^6.2.0",
-    "@capacitor/core": "^6.2.1",
-    "@capacitor/filesystem": "^6.0.3",
+    "@capacitor/core": "^6.2.0",
    "@capacitor/ios": "^6.2.0",
-    "@capacitor/share": "^6.0.3",
    "@dicebear/collection": "^5.4.1",
    "@dicebear/core": "^5.4.1",
-    "@electron/remote": "^2.1.2",
    "@ethersproject/hdnode": "^5.7.0",
    "@ethersproject/wallet": "^5.8.0",
    "@fortawesome/fontawesome-svg-core": "^6.5.1",
@@ -101,13 +101,13 @@
    "pinia-plugin-persistedstate": "^3.2.1",
    "qr-code-generator-vue3": "^1.4.21",
    "qrcode": "^1.5.4",
-    "qrcode.vue": "^3.6.0",
    "ramda": "^0.29.1",
    "readable-stream": "^4.5.2",
    "reflect-metadata": "^0.1.14",
    "register-service-worker": "^1.7.2",
    "simple-vue-camera": "^1.1.3",
    "sqlite3": "^5.1.7",
+    "stream-browserify": "^3.0.0",
    "three": "^0.156.1",
    "ua-parser-js": "^1.0.37",
    "vue": "^3.5.13",
@@ -126,7 +126,7 @@
    "@types/js-yaml": "^4.0.9",
    "@types/leaflet": "^1.9.8",
    "@types/luxon": "^3.4.2",
-    "@types/node": "^20.17.30",
+    "@types/node": "^20.14.11",
    "@types/node-fetch": "^2.6.12",
    "@types/ramda": "^0.29.11",
    "@types/sqlite3": "^3.1.11",
@@ -136,12 +136,8 @@
    "@typescript-eslint/parser": "^6.21.0",
    "@vitejs/plugin-vue": "^5.2.1",
    "@vue/eslint-config-typescript": "^11.0.3",
-    "assert": "^2.1.0",
    "autoprefixer": "^10.4.19",
-    "browserify-fs": "^1.0.0",
-    "browserify-zlib": "^0.2.0",
    "concurrently": "^8.2.2",
-    "crypto-browserify": "^3.12.1",
    "electron": "^33.2.1",
    "electron-builder": "^25.1.8",
    "eslint": "^8.57.0",
@@ -149,21 +145,14 @@
    "eslint-plugin-prettier": "^5.2.1",
    "eslint-plugin-vue": "^9.32.0",
    "fs-extra": "^11.3.0",
-    "https-browserify": "^1.0.0",
    "markdownlint": "^0.37.4",
    "markdownlint-cli": "^0.44.0",
    "npm-check-updates": "^17.1.13",
-    "path-browserify": "^1.0.1",
    "postcss": "^8.4.38",
    "prettier": "^3.2.5",
    "rimraf": "^6.0.1",
-    "stream-browserify": "^3.0.0",
-    "stream-http": "^3.2.0",
    "tailwindcss": "^3.4.1",
-    "tty-browserify": "^0.0.1",
    "typescript": "~5.2.2",
-    "url": "^0.11.4",
-    "util": "^0.12.5",
    "vite": "^5.2.0",
    "vite-plugin-pwa": "^0.19.8"
  },
@@ -171,28 +160,31 @@
  "build": {
    "appId": "app.timesafari",
    "productName": "TimeSafari",
-    "directories": {
-      "output": "dist-electron-packages"
-    },
    "files": [
      "dist-electron/**/*",
-      "src/electron/**/*",
-      "main.js"
+      "!dist-electron/node_modules/**/*"
    ],
-    "extraResources": [
-      {
-        "from": "dist-electron",
-        "to": "."
-      }
+    "directories": {
+      "output": "dist-electron-packages",
+      "buildResources": "build-resources"
+    },
+    "extraResources": [],
+    "asar": true,
+    "asarUnpack": [
+      "dist-electron/www/assets/**/*"
    ],
    "linux": {
-      "target": [
-        "AppImage",
-        "deb"
-      ],
-      "category": "Office",
-      "icon": "build/icon.png"
+      "target": ["AppImage"],
+      "category": "Utility",
+      "executableName": "TimeSafari"
    },
-    "asar": true
+    "mac": {
+      "category": "public.app-category.productivity"
+    },
+    "win": {
+      "target": ["nsis"]
+    },
+    "artifactName": "TimeSafari-${version}-${arch}.${ext}",
+    "publish": null
  }
 }
--- a/playwright.config-local.ts
+++ b/playwright.config-local.ts
@@ -46,21 +46,21 @@ export default defineConfig({

  /* Configure projects for major browsers */
  projects: [
-    // {
-    //   name: 'chromium-serial',
-    //   testMatch: /.*\/(35-record-gift-from-image-share|40-add-contact)\.spec\.ts/,
-    //   use: {
-    //     ...devices['Desktop Chrome'],
-    //     permissions: ["clipboard-read"],
-    //   },
-    //   workers: 1, // Force serial execution for problematic tests
-    // },
-    // {
-    //   name: 'firefox-serial',
-    //   testMatch: /.*\/(35-record-gift-from-image-share|40-add-contact)\.spec\.ts/,
-    //   use: { ...devices['Desktop Firefox'] },
-    //   workers: 1,
-    // },
+    {
+      name: 'chromium-serial',
+      testMatch: /.*\/(35-record-gift-from-image-share|40-add-contact)\.spec\.ts/,
+      use: {
+        ...devices['Desktop Chrome'],
+        permissions: ["clipboard-read"],
+      },
+      workers: 1, // Force serial execution for problematic tests
+    },
+    {
+      name: 'firefox-serial',
+      testMatch: /.*\/(35-record-gift-from-image-share|40-add-contact)\.spec\.ts/,
+      use: { ...devices['Desktop Firefox'] },
+      workers: 1,
+    },
    {
      name: 'chromium',
      testMatch: /^(?!.*\/(35-record-gift-from-image-share|40-add-contact)\.spec\.ts).+\.spec\.ts$/,
@@ -69,33 +69,39 @@ export default defineConfig({
        permissions: ["clipboard-read"],
      },
    },
-    // {
-    //   name: 'firefox',
-    //   testMatch: /^(?!.*\/(35-record-gift-from-image-share|40-add-contact)\.spec\.ts).+\.spec\.ts$/,
-    //   use: { ...devices['Desktop Firefox'] },
-    // },
+    {
+      name: 'firefox',
+      testMatch: /^(?!.*\/(35-record-gift-from-image-share|40-add-contact)\.spec\.ts).+\.spec\.ts$/,
+      use: { ...devices['Desktop Firefox'] },
+    },

    /* Test against mobile viewports. */
-    // {
-    //   name: "Mobile Chrome",
-    //   use: { ...devices["Pixel 5"] },
-    // },
-    // {
-    //   name: "Mobile Safari",
-    //   use: { ...devices["iPhone 12"] },
-    // },
+
+    {
+      name: "Mobile Chrome",
+      use: { ...devices["Pixel 5"] },
+    },
+    {
+      name: "Mobile Safari",
+      use: { ...devices["iPhone 12"] },
+    },

    /* Test against branded browsers. */
+
    // {
    //   name: 'Microsoft Edge',
    //   use: { ...devices['Desktop Edge'], channel: 'msedge' },
    // },
+    {
+      name: "Google Chrome",
+      use: { ...devices["Desktop Chrome"], channel: "chrome" },
+    },
  ],

  /* Configure global timeout; default is 30000 milliseconds */
  // the image upload will often not succeed in 5 seconds
  // 33-record-gift-x10.spec.ts:90:5 > Record 9 new gifts will often not succeed in 30 seconds
-  timeout: 45000, // various tests fail at various times with 25000
+  timeout: 35000, // various tests fail at various times with 25000

  /* Run your local dev server before starting the tests */
  /**
--- a/playwright.config.ts
+++ b/playwright.config.ts
@@ -40,10 +40,10 @@ export default defineConfig({
        permissions: ["clipboard-read"],
      },
    },
-    // {
-    //   name: 'firefox',
-    //   use: { ...devices['Desktop Firefox'] },
-    // },
+    {
+      name: 'firefox',
+      use: { ...devices['Desktop Firefox'] },
+    },

 //    {
 //      name: 'webkit',
--- a/scripts/build-electron.js
+++ b/scripts/build-electron.js
@@ -88,6 +88,12 @@ async function main() {
      throw new Error('package.json not found in build directory');
    }

+    // Copy the electron-logger.js file
+    const loggerSrc = path.join(__dirname, '../src/electron/electron-logger.js');
+    const loggerDest = path.join(distElectronDir, 'electron-logger.js');
+    fs.copyFileSync(loggerSrc, loggerDest);
+    console.log(`Copying src/electron/electron-logger.js to ${loggerDest}`);
+
    console.log('Build completed successfully!');
  } catch (error) {
    console.error('Build failed:', error);
--- a/scripts/check-electron-prerequisites.js
+++ b/scripts/check-electron-prerequisites.js
@@ -0,0 +1,177 @@
+#!/usr/bin/env node
+
+/**
+ * @file check-electron-prerequisites.js
+ * @description Verifies and installs required dependencies for Electron builds
+ * 
+ * This script checks if Python's distutils module is available, which is required
+ * by node-gyp when compiling native Node.js modules during Electron packaging.
+ * Without distutils, builds will fail with "ModuleNotFoundError: No module named 'distutils'".
+ * 
+ * The script performs the following actions:
+ * 1. Checks if Python's distutils module is available
+ * 2. If missing, offers to install setuptools package which provides distutils
+ * 3. Attempts installation through pip or pip3
+ * 4. Provides manual installation instructions if automated installation fails
+ * 
+ * Usage:
+ *   - Direct execution: node scripts/check-electron-prerequisites.js
+ *   - As npm script: npm run check:electron
+ *   - Before builds: npm run check:electron && electron-builder
+ * 
+ * Exit codes:
+ *   - 0: All prerequisites are met or were successfully installed
+ *   - 1: Prerequisites are missing and weren't installed
+ * 
+ * @author [YOUR_NAME]
+ * @version 1.0.0
+ * @license MIT
+ */
+
+const { execSync } = require('child_process');
+const readline = require('readline');
+const chalk = require('chalk'); // You might need to add this to your dependencies
+
+console.log(chalk.blue('🔍 Checking Electron build prerequisites...'));
+
+/**
+ * Checks if Python's distutils module is available
+ * 
+ * This function attempts to import the distutils module in Python.
+ * If successful, it means node-gyp will be able to compile native modules.
+ * If unsuccessful, the Electron build will likely fail when compiling native dependencies.
+ * 
+ * @returns {boolean} True if distutils is available, false otherwise
+ * 
+ * @example
+ * if (checkDistutils()) {
+ *   console.log('Ready to build Electron app');
+ * }
+ */
+function checkDistutils() {
+  try {
+    // Attempt to import distutils using Python
+    // We use stdio: 'ignore' to suppress any Python output
+    execSync('python -c "import distutils"', { stdio: 'ignore' });
+    console.log(chalk.green('✅ Python distutils is available'));
+    return true;
+  } catch (e) {
+    // This error occurs if either Python is not found or if distutils is missing
+    console.log(chalk.red('❌ Python distutils is missing'));
+    return false;
+  }
+}
+
+/**
+ * Installs the setuptools package which provides distutils
+ * 
+ * This function attempts to install setuptools using pip or pip3.
+ * Setuptools is a package that provides the distutils module needed by node-gyp.
+ * In Python 3.12+, distutils was moved out of the standard library into setuptools.
+ * 
+ * The function tries multiple installation methods:
+ * 1. First attempts with pip
+ * 2. If that fails, tries with pip3
+ * 3. If both fail, provides instructions for manual installation
+ * 
+ * @returns {Promise<boolean>} True if installation succeeded, false otherwise
+ * 
+ * @example
+ * const success = await installSetuptools();
+ * if (success) {
+ *   console.log('Ready to proceed with build');
+ * } else {
+ *   console.log('Please fix prerequisites manually');
+ * }
+ */
+async function installSetuptools() {
+  console.log(chalk.yellow('📦 Attempting to install setuptools...'));
+  
+  try {
+    // First try with pip, commonly used on all platforms
+    execSync('pip install setuptools', { stdio: 'inherit' });
+    console.log(chalk.green('✅ Successfully installed setuptools'));
+    return true;
+  } catch (pipError) {
+    try {
+      // If pip fails, try with pip3 (common on Linux distributions)
+      console.log(chalk.yellow('⚠️ Trying with pip3...'));
+      execSync('pip3 install setuptools', { stdio: 'inherit' });
+      console.log(chalk.green('✅ Successfully installed setuptools using pip3'));
+      return true;
+    } catch (pip3Error) {
+      // If both methods fail, provide manual installation guidance
+      console.log(chalk.red('❌ Failed to install setuptools automatically'));
+      console.log(chalk.yellow('📝 Please install it manually with:'));
+      console.log('   pip install setuptools');
+      console.log('   or');
+      console.log('   sudo apt install python3-setuptools (on Debian/Ubuntu)');
+      console.log('   sudo pacman -S python-setuptools (on Arch Linux)');
+      console.log('   sudo dnf install python3-setuptools (on Fedora)');
+      console.log('   brew install python-setuptools (on macOS with Homebrew)');
+      return false;
+    }
+  }
+}
+
+/**
+ * Main execution function
+ * 
+ * This function orchestrates the checking and installation process:
+ * 1. Checks if distutils is already available
+ * 2. If not, informs the user and prompts for installation
+ * 3. Based on user input, attempts to install or exits
+ * 
+ * The function handles interactive user prompts and orchestrates
+ * the overall flow of the script.
+ * 
+ * @returns {Promise<void>}
+ * @throws Will exit process with code 1 if prerequisites aren't met
+ */
+async function main() {
+  // First check if distutils is already available
+  if (checkDistutils()) {
+    // All prerequisites are met, exit successfully
+    process.exit(0);
+  }
+  
+  // Inform the user about the missing prerequisite
+  console.log(chalk.yellow('⚠️ Python distutils is required for Electron builds'));
+  console.log(chalk.yellow('⚠️ This is needed to compile native modules during the build process'));
+  
+  // Set up readline interface for user interaction
+  const rl = readline.createInterface({
+    input: process.stdin,
+    output: process.stdout
+  });
+
+  // Prompt the user for installation permission
+  const answer = await new Promise(resolve => {
+    rl.question(chalk.blue('Would you like to install setuptools now? (y/n) '), resolve);
+  });
+  
+  // Clean up readline interface
+  rl.close();
+  
+  if (answer.toLowerCase() === 'y') {
+    // User agreed to installation
+    const success = await installSetuptools();
+    if (success) {
+      // Installation succeeded, exit successfully
+      process.exit(0);
+    } else {
+      // Installation failed, exit with error
+      process.exit(1);
+    }
+  } else {
+    // User declined installation
+    console.log(chalk.yellow('⚠️ Build may fail without distutils'));
+    process.exit(1);
+  }
+}
+
+// Execute the main function and handle any uncaught errors
+main().catch(error => {
+  console.error(chalk.red('Error during prerequisites check:'), error);
+  process.exit(1);
+}); 
--- a/scripts/fix-electron-paths.js
+++ b/scripts/fix-electron-paths.js
@@ -0,0 +1,61 @@
+/**
+ * Fix path resolution issues in the Electron build
+ */
+const fs = require('fs');
+const path = require('path');
+const glob = require('glob');
+
+// Fix asset paths in HTML file
+function fixHtmlPaths() {
+  const htmlFile = path.join(__dirname, '../dist-electron/index.html');
+  if (fs.existsSync(htmlFile)) {
+    let html = fs.readFileSync(htmlFile, 'utf8');
+    
+    // Convert absolute paths to relative
+    html = html.replace(/src="\//g, 'src="./');
+    html = html.replace(/href="\//g, 'href="./');
+    
+    fs.writeFileSync(htmlFile, html);
+    console.log('✅ Fixed paths in index.html');
+  }
+}
+
+// Fix asset imports in JS files
+function fixJsPaths() {
+  const jsFiles = glob.sync('dist-electron/assets/*.js');
+  
+  jsFiles.forEach(file => {
+    let content = fs.readFileSync(file, 'utf8');
+    
+    // Replace absolute imports with relative ones
+    const originalContent = content;
+    content = content.replace(/["']\/assets\//g, '"./assets/');
+    
+    if (content !== originalContent) {
+      fs.writeFileSync(file, content);
+      console.log(`✅ Fixed paths in ${path.basename(file)}`);
+    }
+  });
+}
+
+// Add base href to HTML
+function addBaseHref() {
+  const htmlFile = path.join(__dirname, '../dist-electron/index.html');
+  if (fs.existsSync(htmlFile)) {
+    let html = fs.readFileSync(htmlFile, 'utf8');
+    
+    // Add base href if not present
+    if (!html.includes('<base href=')) {
+      html = html.replace('</head>', '<base href="./">\n</head>');
+      fs.writeFileSync(htmlFile, html);
+      console.log('✅ Added base href to index.html');
+    }
+  }
+}
+
+// Run all fixes
+fixHtmlPaths();
+fixJsPaths();
+addBaseHref();
+
+console.log('🎉 Electron path fixes completed'); 
--- a/scripts/notarize.js
+++ b/scripts/notarize.js
@@ -0,0 +1,14 @@
+// This is a placeholder notarize script that does nothing for non-macOS platforms
+// Only necessary for macOS app store submissions
+
+exports.default = async function notarizing(context) {
+  // Only notarize macOS builds
+  if (context.electronPlatformName !== 'darwin') {
+    console.log('Skipping notarization for non-macOS platform');
+    return;
+  }
+  
+  // For macOS, we would implement actual notarization here
+  console.log('This is where macOS notarization would happen');
+  // We're just returning with no action for non-macOS builds
+}; 
--- a/src/components/ActivityListItem.vue
+++ b/src/components/ActivityListItem.vue
@@ -10,26 +10,18 @@
      </span>
    </div>

-    <div
-      class="flex items-center justify-between gap-2 text-lg bg-slate-200 border border-slate-300 border-b-0 rounded-t-md px-3 sm:px-4 py-1 sm:py-2"
-    >
-      <div class="flex items-center gap-2">
-        <div v-if="record.issuerDid">
-          <EntityIcon
-            :entity-id="record.issuerDid"
-            class="rounded-full bg-white overflow-hidden !size-[2rem] object-cover"
-          />
-        </div>
-        <div v-else>
-          <font-awesome
-            icon="person-circle-question"
-            class="text-slate-300 text-[2rem]"
-          />
-        </div>
+    <div class="bg-slate-100 rounded-t-md border border-slate-300 p-3 sm:p-4">
+      <div class="flex items-center gap-2 mb-6">
+        <img
+          src="https://a.fsdn.com/con/app/proj/identicons/screenshots/225506.jpg"
+          class="size-8 object-cover rounded-full"
+        />

        <div>
          <h3 class="font-semibold">
-            {{ record.issuer.known ? record.issuer.displayName : "" }}
+            {{
+              record.giver.known ? record.giver.displayName : "Anonymous Giver"
+            }}
          </h3>
          <p class="ms-auto text-xs text-slate-500 italic">
            {{ friendlyDate }}
@@ -37,16 +29,10 @@
        </div>
      </div>

-      <a class="cursor-pointer" @click="$emit('loadClaim', record.jwtId)">
-        <font-awesome icon="circle-info" class="fa-fw text-slate-500" />
-      </a>
-    </div>
-
-    <div class="bg-slate-100 rounded-b-md border border-slate-300 p-3 sm:p-4">
      <!-- Record Image -->
      <div
        v-if="record.image"
-        class="bg-cover mb-6 -mt-3 sm:-mt-4 -mx-3 sm:-mx-4"
+        class="bg-cover mb-6 -mx-3 sm:-mx-4"
        :style="`background-image: url(${record.image});`"
      >
        <a
@@ -68,41 +54,48 @@
          class="w-28 sm:w-40 text-center bg-white border border-slate-200 rounded p-2 sm:p-3"
        >
          <div class="relative w-fit mx-auto">
-            <div>
+            <template v-if="record.giver.profileImageUrl">
+              <EntityIcon
+                :profile-image-url="record.giver.profileImageUrl"
+                :class="[
+                  !record.providerPlanName
+                    ? 'rounded-full size-[3rem] sm:size-[4rem] object-cover'
+                    : 'rounded size-[3rem] sm:size-[4rem] object-cover',
+                ]"
+              />
+            </template>
+            <template v-else>
              <!-- Project Icon -->
-              <div v-if="record.providerPlanName">
+              <template v-if="record.providerPlanName">
                <ProjectIcon
                  :entity-id="record.providerPlanName"
                  :icon-size="48"
                  class="rounded size-[3rem] sm:size-[4rem] *:w-full *:h-full"
                />
-              </div>
+              </template>
              <!-- Identicon for DIDs -->
-              <div v-else-if="record.agentDid">
-                <EntityIcon
-                  :entity-id="record.agentDid"
-                  :profile-image-url="record.issuer.profileImageUrl"
-                  class="rounded-full bg-slate-100 overflow-hidden !size-[3rem] sm:!size-[4rem]"
+              <template v-else-if="record.giver.did">
+                <img
+                  :src="`https://a.fsdn.com/con/app/proj/identicons/screenshots/225506.jpg`"
+                  class="rounded-full size-[3rem] sm:size-[4rem]"
+                  alt="Identicon"
                />
-              </div>
+              </template>
              <!-- Unknown Person -->
-              <div v-else>
-                <font-awesome
+              <template v-else>
+                <fa
                  icon="person-circle-question"
                  class="text-slate-300 text-[3rem] sm:text-[4rem]"
                />
-              </div>
-            </div>
+              </template>
+            </template>
          </div>
-          <div
-            v-if="record.providerPlanName || record.giver.known"
-            class="text-xs mt-2 line-clamp-3 sm:line-clamp-2"
-          >
-            <font-awesome
-              :icon="record.providerPlanName ? 'users' : 'user'"
+          <div class="text-xs mt-2 line-clamp-3 sm:line-clamp-2">
+            <fa
+              :icon="record.providerPlanName ? 'building' : 'user'"
              class="fa-fw text-slate-400"
            />
-            {{ record.providerPlanName || record.giver.displayName }}
+            {{ record.giver.displayName }}
          </div>
        </div>

@@ -130,41 +123,48 @@
          class="w-28 sm:w-40 text-center bg-white border border-slate-200 rounded p-2 sm:p-3"
        >
          <div class="relative w-fit mx-auto">
-            <div>
+            <template v-if="record.receiver.profileImageUrl">
+              <EntityIcon
+                :profile-image-url="record.receiver.profileImageUrl"
+                :class="[
+                  !record.recipientProjectName
+                    ? 'rounded-full size-[3rem] sm:size-[4rem] object-cover'
+                    : 'rounded size-[3rem] sm:size-[4rem] object-cover',
+                ]"
+              />
+            </template>
+            <template v-else>
              <!-- Project Icon -->
-              <div v-if="record.recipientProjectName">
+              <template v-if="record.recipientProjectName">
                <ProjectIcon
                  :entity-id="record.recipientProjectName"
                  :icon-size="48"
                  class="rounded size-[3rem] sm:size-[4rem] *:w-full *:h-full"
                />
-              </div>
+              </template>
              <!-- Identicon for DIDs -->
-              <div v-else-if="record.recipientDid">
-                <EntityIcon
-                  :entity-id="record.recipientDid"
-                  :profile-image-url="record.receiver.profileImageUrl"
-                  class="rounded-full bg-slate-100 overflow-hidden !size-[3rem] sm:!size-[4rem]"
+              <template v-else-if="record.receiver.did">
+                <img
+                  :src="`https://a.fsdn.com/con/app/proj/identicons/screenshots/225506.jpg`"
+                  class="rounded-full size-[3rem] sm:size-[4rem]"
+                  alt="Identicon"
                />
-              </div>
+              </template>
              <!-- Unknown Person -->
-              <div v-else>
-                <font-awesome
+              <template v-else>
+                <fa
                  icon="person-circle-question"
                  class="text-slate-300 text-[3rem] sm:text-[4rem]"
                />
-              </div>
-            </div>
+              </template>
+            </template>
          </div>
-          <div
-            v-if="record.recipientProjectName || record.receiver.known"
-            class="text-xs mt-2 line-clamp-3 sm:line-clamp-2"
-          >
-            <font-awesome
-              :icon="record.recipientProjectName ? 'users' : 'user'"
+          <div class="text-xs mt-2 line-clamp-3 sm:line-clamp-2">
+            <fa
+              :icon="record.recipientProjectName ? 'building' : 'user'"
              class="fa-fw text-slate-400"
            />
-            {{ record.recipientProjectName || record.receiver.displayName }}
+            {{ record.receiver.displayName }}
          </div>
        </div>
      </div>
@@ -175,6 +175,15 @@
          {{ description }}
        </a>
      </p>
+      <p class="text-sm">{{ subDescription }}</p>
+    </div>
+
+    <div
+      class="flex items-center gap-2 text-lg bg-slate-300 rounded-b-md px-3 sm:px-4 py-1 sm:py-2"
+    >
+      <a class="cursor-pointer" @click="$emit('loadClaim', record.jwtId)">
+        <fa icon="circle-info" class="fa-fw text-slate-500" />
+      </a>
    </div>
  </li>
 </template>
@@ -192,7 +201,6 @@ import ProjectIcon from "./ProjectIcon.vue";
    EntityIcon,
    ProjectIcon,
  },
-  emits: ["loadClaim", "viewImage", "cacheImage", "confirmClaim"],
 })
 export default class ActivityListItem extends Vue {
  @Prop() record!: GiveRecordWithContactInfo;
@@ -212,13 +220,70 @@ export default class ActivityListItem extends Vue {
    return amount;
  }

+  private formatParticipantInfo(): string {
+    const { giver, receiver } = this.record;
+
+    // Both participants are known contacts
+    if (giver.known && receiver.known) {
+      return `${giver.displayName} gave to ${receiver.displayName}`;
+    }
+
+    // Only giver is known
+    if (giver.known) {
+      const recipient = this.record.recipientProjectName
+        ? `the project "${this.record.recipientProjectName}"`
+        : receiver.displayName;
+      return `${giver.displayName} gave to ${recipient}`;
+    }
+
+    // Only receiver is known
+    if (receiver.known) {
+      const provider = this.record.providerPlanName
+        ? `the project "${this.record.providerPlanName}"`
+        : giver.displayName;
+      return `${receiver.displayName} received from ${provider}`;
+    }
+
+    // Neither is known
+    return this.formatUnknownParticipants();
+  }
+
+  private formatUnknownParticipants(): string {
+    const { giver, receiver, providerPlanName, recipientProjectName } =
+      this.record;
+
+    if (providerPlanName || recipientProjectName) {
+      const from = providerPlanName
+        ? `the project "${providerPlanName}"`
+        : giver.displayName;
+      const to = recipientProjectName
+        ? `the project "${recipientProjectName}"`
+        : receiver.displayName;
+      return `from ${from} to ${to}`;
+    }
+
+    return giver.displayName === receiver.displayName
+      ? `between two who are ${giver.displayName}`
+      : `from ${giver.displayName} to ${receiver.displayName}`;
+  }
+
  get description(): string {
    const claim =
      (this.record.fullClaim as unknown).claim || this.record.fullClaim;

+    if (!claim.description) {
+      return "something not described";
+    }
+
    return `${claim.description}`;
  }

+  get subDescription(): string {
+    const participants = this.formatParticipantInfo();
+
+    return `${participants}`;
+  }
+
  private displayAmount(code: string, amt: number) {
    return `${amt} ${this.currencyShortWordForCode(code, amt === 1)}`;
  }
@@ -227,6 +292,11 @@ export default class ActivityListItem extends Vue {
    return unitCode === "HUR" ? (single ? "hour" : "hours") : unitCode;
  }

+  get formattedTimestamp() {
+    // Add your timestamp formatting logic here
+    return this.record.timestamp;
+  }
+
  get canConfirm(): boolean {
    if (!this.isRegistered) return false;
    if (!isGiveClaimType(this.record.fullClaim?.["@type"])) return false;
--- a/src/components/EntityIcon.vue
+++ b/src/components/EntityIcon.vue
@@ -1,101 +1,42 @@
-<!-- eslint-disable-next-line vue/no-v-html -->
 <template>
-  <div class="w-fit">
-    <img
-      v-if="hasImage"
-      :src="imageUrl"
-      class="rounded cursor-pointer"
-      :width="iconSize"
-      :height="iconSize"
-      @click="handleClick"
-    />
-    <div v-else class="cursor-pointer" @click="handleClick">
-      <img
-        v-if="!identifier"
-        :src="blankSquareUrl"
-        class="rounded"
-        :width="iconSize"
-        :height="iconSize"
-      />
-      <svg
-        v-else
-        :width="iconSize"
-        :height="iconSize"
-        viewBox="0 0 100 100"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <g v-for="(path, index) in avatarPaths" :key="index">
-          <path :d="path" />
-        </g>
-      </svg>
-    </div>
-  </div>
+  <!-- eslint-disable-next-line vue/no-v-html -->
+  <div class="w-fit" v-html="generateIcon()"></div>
 </template>
-
 <script lang="ts">
 import { createAvatar, StyleOptions } from "@dicebear/core";
 import { avataaars } from "@dicebear/collection";
 import { Vue, Component, Prop } from "vue-facing-decorator";
 import { Contact } from "../db/tables/contacts";
-import { logger } from "../utils/logger";

@Component
 export default class EntityIcon extends Vue {
-  @Prop({ required: false }) contact?: Contact;
+  @Prop contact: Contact;
  @Prop entityId = ""; // overridden by contact.did or profileImageUrl
  @Prop iconSize = 0;
  @Prop profileImageUrl = ""; // overridden by contact.profileImageUrl

-  private avatarPaths: string[] = [];
-  private blankSquareUrl =
-    import.meta.env.VITE_BASE_URL + "assets/blank-square.svg";
-
-  get imageUrl(): string {
-    return this.contact?.profileImageUrl || this.profileImageUrl;
-  }
-
-  get hasImage(): boolean {
-    return !!this.imageUrl;
-  }
-
-  get identifier(): string | undefined {
-    return this.contact?.did || this.entityId;
-  }
-
-  handleClick() {
-    try {
-      // Emit a simple event without passing the event object
-      this.$emit("click");
-    } catch (error) {
-      logger.error("Error handling click event:", error);
+  generateIcon() {
+    const imageUrl = this.contact?.profileImageUrl || this.profileImageUrl;
+    if (imageUrl) {
+      return `<img src="${imageUrl}" class="rounded" width="${this.iconSize}" height="${this.iconSize}" />`;
+    } else {
+      const identifier = this.contact?.did || this.entityId;
+      if (!identifier) {
+        return `<img src="../src/assets/blank-square.svg" class="rounded" width="${this.iconSize}" height="${this.iconSize}" />`;
+      }
+      // https://api.dicebear.com/8.x/avataaars/svg?seed=
+      // ... does not render things with the same seed as this library.
+      // "did:ethr:0x222BB77E6Ff3774d34c751f3c1260866357B677b" yields a girl with flowers in her hair and a lightning earring
+      // ... which looks similar to '' at the dicebear site but which is different.
+      const options: StyleOptions<object> = {
+        seed: (identifier as string) || "",
+        size: this.iconSize,
+      };
+      const avatar = createAvatar(avataaars, options);
+      const svgString = avatar.toString();
+      return svgString;
    }
  }
-
-  generateAvatarPaths(): string[] {
-    if (!this.identifier) return [];
-
-    const options: StyleOptions<object> = {
-      seed: this.identifier,
-      size: this.iconSize,
-    };
-    const avatar = createAvatar(avataaars, options);
-    const svgString = avatar.toString();
-
-    // Extract paths from SVG string
-    const parser = new DOMParser();
-    const doc = parser.parseFromString(svgString, "image/svg+xml");
-    const paths = Array.from(doc.querySelectorAll("path")).map(
-      (path) => path.getAttribute("d") || "",
-    );
-    return paths;
-  }
-
-  mounted() {
-    this.avatarPaths = this.generateAvatarPaths();
-    logger.log("EntityIcon mounted, profileImageUrl:", this.profileImageUrl);
-    logger.log("EntityIcon mounted, entityId:", this.entityId);
-    logger.log("EntityIcon mounted, iconSize:", this.iconSize);
-  }
 }
 </script>
 <style scoped></style>
--- a/src/components/ImageViewer.vue
+++ b/src/components/ImageViewer.vue
@@ -28,7 +28,7 @@
              :src="imageUrl"
              class="max-h-[calc(100vh-5rem)] w-full h-full object-contain"
              alt="expanded shared content"
-              @click="close"
+              @click.stop
            />
          </div>
        </div>
--- a/src/components/InfiniteScroll.vue
+++ b/src/components/InfiniteScroll.vue
@@ -1,9 +1,3 @@
-/** * @file InfiniteScroll.vue * @description A Vue component that implements
-infinite scrolling functionality using the Intersection Observer API. * This
-component emits a 'reached-bottom' event when the user scrolls near the bottom
-of the content. * It includes debouncing to prevent multiple rapid triggers and
-loading state management. * * @author Matthew Raymer * @version 1.0.0 */
-
 <template>
  <div ref="scrollContainer">
    <slot />
@@ -14,51 +8,13 @@ loading state management. * * @author Matthew Raymer * @version 1.0.0 */
 <script lang="ts">
 import { Component, Emit, Prop, Vue } from "vue-facing-decorator";

-/**
- * InfiniteScroll Component
- *
- * This component implements infinite scrolling functionality by observing when a user
- * scrolls near the bottom of the content. It uses the Intersection Observer API for
- * efficient scroll detection and includes debouncing to prevent multiple rapid triggers.
- *
- * Usage in template:
- * ```vue
- * <InfiniteScroll @reached-bottom="loadMore">
- *   <div>Content goes here</div>
- * </InfiniteScroll>
- * ```
- *
- * Props:
- * - distance: number (default: 200) - Distance in pixels from the bottom at which to trigger the event
- *
- * Events:
- * - reached-bottom: Emitted when the user scrolls near the bottom of the content
- */
@Component
 export default class InfiniteScroll extends Vue {
-  /** Distance in pixels from the bottom at which to trigger the reached-bottom event */
  @Prop({ default: 200 })
  readonly distance!: number;
-
-  /** Intersection Observer instance for detecting scroll position */
  private observer!: IntersectionObserver;
-
-  /** Flag to track initial render state */
  private isInitialRender = true;

-  /** Flag to prevent multiple simultaneous loading states */
-  private isLoading = false;
-
-  /** Timeout ID for debouncing scroll events */
-  private debounceTimeout: number | null = null;
-
-  /**
-   * Vue lifecycle hook that runs after component updates.
-   * Initializes the Intersection Observer if not already set up.
-   *
-   * @internal
-   * Used internally by Vue's lifecycle system
-   */
  updated() {
    if (!this.observer) {
      const options = {
@@ -74,50 +30,18 @@ export default class InfiniteScroll extends Vue {
    }
  }

-  /**
-   * Vue lifecycle hook that runs before component unmounting.
-   * Cleans up the Intersection Observer and any pending timeouts.
-   *
-   * @internal
-   * Used internally by Vue's lifecycle system
-   */
+  // 'beforeUnmount' hook runs before unmounting the component
  beforeUnmount() {
    if (this.observer) {
      this.observer.disconnect();
    }
-    if (this.debounceTimeout) {
-      window.clearTimeout(this.debounceTimeout);
-    }
  }

-  /**
-   * Handles intersection observer callbacks when the sentinel element becomes visible.
-   * Implements debouncing to prevent multiple rapid triggers and manages loading state.
-   *
-   * @param entries - Array of IntersectionObserverEntry objects
-   * @returns false (required by @Emit decorator)
-   *
-   * @internal
-   * Used internally by the Intersection Observer
-   * @emits reached-bottom - Emitted when the user scrolls near the bottom
-   */
  @Emit("reached-bottom")
  handleIntersection(entries: IntersectionObserverEntry[]) {
    const entry = entries[0];
-    if (entry.isIntersecting && !this.isLoading) {
-      // Debounce the intersection event
-      if (this.debounceTimeout) {
-        window.clearTimeout(this.debounceTimeout);
-      }
-
-      this.debounceTimeout = window.setTimeout(() => {
-        this.isLoading = true;
-        this.$emit("reached-bottom", true);
-        // Reset loading state after a short delay
-        setTimeout(() => {
-          this.isLoading = false;
-        }, 1000);
-      }, 300);
+    if (entry.isIntersecting) {
+      return true;
    }
    return false;
  }
--- a/src/components/OnboardingDialog.vue
+++ b/src/components/OnboardingDialog.vue
@@ -95,7 +95,7 @@
      </p>

      <p class="mt-4">
-        Search for a topic, or search around your neighborhood under "Nearby".
+        Search for a topic, or search around your neighborhod under "Nearby".
      </p>

      <p class="mt-4">
--- a/src/components/ProfileSection.vue
+++ b/src/components/ProfileSection.vue
@@ -1,257 +0,0 @@
-/** * @file ProfileSection.vue * @description Component for managing user
-profile information * @author Matthew Raymer * @version 1.0.0 */
-
-<template>
-  <div class="bg-slate-100 rounded-md overflow-hidden px-4 py-4 mt-8 mb-8">
-    <div v-if="loading" class="text-center mb-2">
-      <font-awesome
-        icon="spinner"
-        class="fa-spin text-slate-400"
-      ></font-awesome>
-      Loading profile...
-    </div>
-    <div v-else class="flex items-center mb-2">
-      <span class="font-bold">Public Profile</span>
-      <font-awesome
-        icon="circle-info"
-        class="text-slate-400 fa-fw ml-2 cursor-pointer"
-        @click="showProfileInfo"
-      />
-    </div>
-    <textarea
-      v-model="profileDesc"
-      class="w-full h-32 p-2 border border-slate-300 rounded-md"
-      placeholder="Write something about yourself for the public..."
-      :readonly="loading || saving"
-      :class="{ 'bg-slate-100': loading || saving }"
-    ></textarea>
-
-    <div class="flex items-center mb-4" @click="toggleLocation">
-      <input v-model="includeLocation" type="checkbox" class="mr-2" />
-      <label for="includeLocation">Include Location</label>
-    </div>
-    <div v-if="includeLocation" class="mb-4 aspect-video">
-      <p class="text-sm mb-2 text-slate-500">
-        For your security, choose a location nearby but not exactly at your
-        place.
-      </p>
-
-      <l-map
-        ref="profileMap"
-        class="!z-40 rounded-md"
-        @click="handleMapClick"
-        @ready="onMapReady"
-      >
-        <l-tile-layer
-          url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
-          layer-type="base"
-          name="OpenStreetMap"
-        />
-        <l-marker
-          v-if="latitude && longitude"
-          :lat-lng="[latitude, longitude]"
-          @click="confirmEraseLocation"
-        />
-      </l-map>
-    </div>
-    <div v-if="!loading && !saving">
-      <div class="flex justify-between items-center">
-        <button
-          class="mt-2 px-4 py-2 bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white rounded-md"
-          :disabled="loading || saving"
-          :class="{
-            'opacity-50 cursor-not-allowed': loading || saving,
-          }"
-          @click="saveProfile"
-        >
-          Save Profile
-        </button>
-        <button
-          class="mt-2 px-4 py-2 bg-gradient-to-b from-red-400 to-red-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white rounded-md"
-          :disabled="loading || saving"
-          :class="{
-            'opacity-50 cursor-not-allowed':
-              loading || saving || (!profileDesc && !includeLocation),
-          }"
-          @click="confirmDeleteProfile"
-        >
-          Delete Profile
-        </button>
-      </div>
-    </div>
-    <div v-else-if="loading">Loading...</div>
-    <div v-else>Saving...</div>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Vue, Prop, Emit } from "vue-facing-decorator";
-import { LMap, LMarker, LTileLayer } from "@vue-leaflet/vue-leaflet";
-import { ProfileService } from "../services/ProfileService";
-import { logger } from "../utils/logger";
-
-@Component({
-  components: {
-    LMap,
-    LMarker,
-    LTileLayer,
-  },
-})
-export default class ProfileSection extends Vue {
-  @Prop({ required: true }) activeDid!: string;
-  @Prop({ required: true }) partnerApiServer!: string;
-
-  @Emit("profile-updated") profileUpdated() {}
-
-  loading = true;
-  saving = false;
-  profileDesc = "";
-  latitude = 0;
-  longitude = 0;
-  includeLocation = false;
-  zoom = 2;
-
-  async mounted() {
-    await this.loadProfile();
-  }
-
-  async loadProfile() {
-    try {
-      const profile = await ProfileService.loadProfile(
-        this.activeDid,
-        this.partnerApiServer,
-      );
-      if (profile) {
-        this.profileDesc = profile.description || "";
-        this.latitude = profile.location?.lat || 0;
-        this.longitude = profile.location?.lng || 0;
-        this.includeLocation = !!(this.latitude && this.longitude);
-      }
-    } catch (error) {
-      logger.error("Error loading profile:", error);
-      this.$notify({
-        group: "alert",
-        type: "danger",
-        title: "Error Loading Profile",
-        text: "Your server profile is not available.",
-      });
-    } finally {
-      this.loading = false;
-    }
-  }
-
-  async saveProfile() {
-    this.saving = true;
-    try {
-      await ProfileService.saveProfile(this.activeDid, this.partnerApiServer, {
-        description: this.profileDesc,
-        location: this.includeLocation
-          ? {
-              lat: this.latitude,
-              lng: this.longitude,
-            }
-          : undefined,
-      });
-
-      this.$notify({
-        group: "alert",
-        type: "success",
-        title: "Profile Saved",
-        text: "Your profile has been updated successfully.",
-      });
-      this.profileUpdated();
-    } catch (error) {
-      logger.error("Error saving profile:", error);
-      this.$notify({
-        group: "alert",
-        type: "danger",
-        title: "Error Saving Profile",
-        text: "There was an error saving your profile.",
-      });
-    } finally {
-      this.saving = false;
-    }
-  }
-
-  toggleLocation() {
-    this.includeLocation = !this.includeLocation;
-    if (!this.includeLocation) {
-      this.latitude = 0;
-      this.longitude = 0;
-      this.zoom = 2;
-    }
-  }
-
-  handleMapClick(event: { latlng: { lat: number; lng: number } }) {
-    this.latitude = event.latlng.lat;
-    this.longitude = event.latlng.lng;
-  }
-
-  onMapReady(map: L.Map) {
-    const zoom = this.latitude && this.longitude ? 12 : 2;
-    map.setView([this.latitude, this.longitude], zoom);
-  }
-
-  confirmEraseLocation() {
-    this.$notify({
-      group: "modal",
-      type: "confirm",
-      title: "Erase Marker",
-      text: "Are you sure you don't want to mark a location? This will erase the current location.",
-      onYes: () => {
-        this.latitude = 0;
-        this.longitude = 0;
-        this.zoom = 2;
-        this.includeLocation = false;
-      },
-    });
-  }
-
-  async confirmDeleteProfile() {
-    this.$notify({
-      group: "modal",
-      type: "confirm",
-      title: "Delete Profile",
-      text: "Are you sure you want to delete your public profile? This will remove your description and location from the server, and it cannot be undone.",
-      onYes: this.deleteProfile,
-    });
-  }
-
-  async deleteProfile() {
-    this.saving = true;
-    try {
-      await ProfileService.deleteProfile(this.activeDid, this.partnerApiServer);
-      this.profileDesc = "";
-      this.latitude = 0;
-      this.longitude = 0;
-      this.includeLocation = false;
-      this.$notify({
-        group: "alert",
-        type: "success",
-        title: "Profile Deleted",
-        text: "Your profile has been deleted successfully.",
-      });
-      this.profileUpdated();
-    } catch (error) {
-      logger.error("Error deleting profile:", error);
-      this.$notify({
-        group: "alert",
-        type: "danger",
-        title: "Error Deleting Profile",
-        text: "There was an error deleting your profile.",
-      });
-    } finally {
-      this.saving = false;
-    }
-  }
-
-  showProfileInfo() {
-    this.$notify({
-      group: "alert",
-      type: "info",
-      title: "Public Profile Information",
-      text: "This data will be published for all to see, so be careful what your write. Your ID will only be shared with people who you allow to see your activity.",
-    });
-  }
-}
-</script>
--- a/src/components/QuickNav.vue
+++ b/src/components/QuickNav.vue
@@ -1,7 +1,7 @@
 <template>
  <!-- QUICK NAV -->
  <nav id="QuickNav" class="fixed bottom-0 left-0 right-0 bg-slate-200 z-50">
-    <ul class="flex text-2xl px-6 py-2 gap-1 max-w-3xl mx-auto">
+    <ul class="flex text-2xl p-2 gap-2 max-w-3xl mx-auto">
      <!-- Home Feed -->
      <li
        :class="{
@@ -52,7 +52,7 @@
        >
          <div class="flex flex-col items-center">
            <font-awesome icon="hand" class="fa-fw" />
-            <span class="text-xs mt-1">yours</span>
+            <span class="text-xs mt-1">your work</span>
          </div>
        </router-link>
      </li>
--- a/src/db/index.ts
+++ b/src/db/index.ts
@@ -1,8 +1,6 @@
 import BaseDexie, { Table } from "dexie";
 import { encrypted, Encryption } from "@pvermeer/dexie-encrypted-addon";
-import { exportDB, ExportOptions } from "dexie-export-import";
 import * as R from "ramda";
-import Dexie from "dexie";

 import { Account, AccountsSchema } from "./tables/accounts";
 import { Contact, ContactSchema } from "./tables/contacts";
@@ -28,26 +26,19 @@ type NonsensitiveTables = {
 };

 // Using 'unknown' instead of 'any' for stricter typing and to avoid TypeScript warnings
-export type SecretDexie<T extends Record<string, Dexie.Table> = SecretTable> =
-  BaseDexie & T & { export: (options?: ExportOptions) => Promise<Blob> };
-export type SensitiveDexie<
-  T extends Record<string, Dexie.Table> = SensitiveTables,
-> = BaseDexie & T & { export: (options?: ExportOptions) => Promise<Blob> };
-export type NonsensitiveDexie<
-  T extends Record<string, Dexie.Table> = NonsensitiveTables,
-> = BaseDexie & T & { export: (options?: ExportOptions) => Promise<Blob> };
+export type SecretDexie<T extends unknown = SecretTable> = BaseDexie & T;
+export type SensitiveDexie<T extends unknown = SensitiveTables> = BaseDexie & T;
+export type NonsensitiveDexie<T extends unknown = NonsensitiveTables> =
+  BaseDexie & T;

 //// Initialize the DBs, starting with the sensitive ones.

 // Initialize Dexie database for secret, which is then used to encrypt accountsDB
 export const secretDB = new BaseDexie("TimeSafariSecret") as SecretDexie;
 secretDB.version(1).stores(SecretSchema);
-secretDB.export = (options) => exportDB(secretDB, options);

 // Initialize Dexie database for accounts
 const accountsDexie = new BaseDexie("TimeSafariAccounts") as SensitiveDexie;
-accountsDexie.version(1).stores(AccountsSchema);
-accountsDexie.export = (options) => exportDB(accountsDexie, options);

 // Instead of accountsDBPromise, use libs/util retrieveAccountMetadata or retrieveFullyDecryptedAccount
 // so that it's clear whether the usage needs the private key inside.
@@ -63,15 +54,8 @@ export const accountsDBPromise = useSecretAndInitializeAccountsDB(

 //// Now initialize the other DB.

-// Initialize Dexie database for non-sensitive data
+// Initialize Dexie databases for non-sensitive data
 export const db = new BaseDexie("TimeSafari") as NonsensitiveDexie;
-db.version(1).stores({
-  contacts: ContactSchema.contacts,
-  logs: LogSchema.logs,
-  settings: SettingsSchema.settings,
-  temp: TempSchema.temp,
-});
-db.export = (options) => exportDB(db, options);

 // Only the tables with index modifications need listing. https://dexie.org/docs/Tutorial/Design#database-versioning

@@ -128,6 +112,7 @@ db.on("populate", async () => {
 // ended up throwing lots of errors to the user... and they'd end up in a state
 // where they couldn't take action because they couldn't unlock that identity.)

+// check for the secret in storage
 async function useSecretAndInitializeAccountsDB(
  secretDB: SecretDexie,
  accountsDB: SensitiveDexie,
@@ -229,22 +214,6 @@ export async function updateAccountSettings(
  }
 }

-export async function logToDb(message: string): Promise<void> {
-  await db.open();
-  const todayKey = new Date().toDateString();
-  // only keep one day's worth of logs
-  const previous = await db.logs.get(todayKey);
-  if (!previous) {
-    // when this is today's first log, clear out everything previous
-    // to avoid the log table getting too large
-    // (let's limit a different way someday)
-    await db.logs.clear();
-  }
-  const prevMessages = (previous && previous.message) || "";
-  const fullMessage = `${prevMessages}\n${new Date().toISOString()} ${message}`;
-  await db.logs.update(todayKey, { message: fullMessage });
-}
-
 // similar method is in the sw_scripts/additional-scripts.js file
 export async function logConsoleAndDb(
  message: string,
@@ -255,5 +224,16 @@ export async function logConsoleAndDb(
  } else {
    logger.log(`${new Date().toISOString()} ${message}`);
  }
-  await logToDb(message);
+
+  await db.open();
+  const todayKey = new Date().toDateString();
+  // only keep one day's worth of logs
+  const previous = await db.logs.get(todayKey);
+  if (!previous) {
+    // when this is today's first log, clear out everything previous
+    await db.logs.clear();
+  }
+  const prevMessages = (previous && previous.message) || "";
+  const fullMessage = `${prevMessages}\n${new Date().toISOString()} ${message}`;
+  await db.logs.update(todayKey, { message: fullMessage });
 }
--- a/src/electron/electron-logger.js
+++ b/src/electron/electron-logger.js
@@ -0,0 +1,37 @@
+/**
+ * Electron-specific logger implementation
+ */
+const fs = require("fs");
+const path = require("path");
+const { app } = require("electron");
+
+// Create logs directory if it doesn't exist
+const logsDir = path.join(app.getPath("userData"), "logs");
+if (!fs.existsSync(logsDir)) {
+  fs.mkdirSync(logsDir, { recursive: true });
+}
+
+const logFile = path.join(
+  logsDir,
+  `electron-${new Date().toISOString().split("T")[0]}.log`,
+);
+
+function log(level, message) {
+  const timestamp = new Date().toISOString();
+  const logMessage = `[${timestamp}] [${level}] ${message}\n`;
+
+  // Write to log file
+  fs.appendFileSync(logFile, logMessage);
+
+  // Also output to console
+  // eslint-disable-next-line no-console
+  console[level.toLowerCase()](message);
+}
+
+module.exports = {
+  info: (message) => log("INFO", message),
+  warn: (message) => log("WARN", message),
+  error: (message) => log("ERROR", message),
+  debug: (message) => log("DEBUG", message),
+  getLogPath: () => logFile,
+};
--- a/src/electron/main.js
+++ b/src/electron/main.js
@@ -1,174 +1,236 @@
-const { app, BrowserWindow } = require("electron");
+const { app, BrowserWindow, session, protocol, dialog } = require("electron");
 const path = require("path");
 const fs = require("fs");
-const logger = require("../utils/logger");

-// Check if running in dev mode
-const isDev = process.argv.includes("--inspect");
+// Global window reference
+let mainWindow = null;

-function createWindow() {
-  // Add before createWindow function
-  const preloadPath = path.join(__dirname, "preload.js");
-  logger.log("Checking preload path:", preloadPath);
-  logger.log("Preload exists:", fs.existsSync(preloadPath));
+// Debug flags
+const isDev = !app.isPackaged;

-  // Create the browser window.
-  const mainWindow = new BrowserWindow({
-    width: 1200,
-    height: 800,
-    webPreferences: {
-      nodeIntegration: false,
-      contextIsolation: true,
-      webSecurity: true,
-      allowRunningInsecureContent: false,
-      preload: path.join(__dirname, "preload.js"),
-    },
-  });
+// Helper for logging
+function logDebug(...args) {
+  // eslint-disable-next-line no-console
+  console.log("[DEBUG]", ...args);
+}

-  // Always open DevTools for now
-  mainWindow.webContents.openDevTools();
-
-  // Intercept requests to fix asset paths
-  mainWindow.webContents.session.webRequest.onBeforeRequest(
-    {
-      urls: [
-        "file://*/*/assets/*",
-        "file://*/assets/*",
-        "file:///assets/*", // Catch absolute paths
-        "<all_urls>", // Catch all URLs as a fallback
-      ],
-    },
-    (details, callback) => {
-      let url = details.url;
-
-      // Handle paths that don't start with file://
-      if (!url.startsWith("file://") && url.includes("/assets/")) {
-        url = `file://${path.join(__dirname, "www", url)}`;
-      }
-
-      // Handle absolute paths starting with /assets/
-      if (url.includes("/assets/") && !url.includes("/www/assets/")) {
-        const baseDir = url.includes("dist-electron")
-          ? url.substring(
-              0,
-              url.indexOf("/dist-electron") + "/dist-electron".length,
-            )
-          : `file://${__dirname}`;
-        const assetPath = url.split("/assets/")[1];
-        const newUrl = `${baseDir}/www/assets/${assetPath}`;
-        callback({ redirectURL: newUrl });
-        return;
-      }
-
-      callback({}); // No redirect for other URLs
-    },
-  );
-
-  if (isDev) {
-    // Debug info
-    logger.log("Debug Info:");
-    logger.log("Running in dev mode:", isDev);
-    logger.log("App is packaged:", app.isPackaged);
-    logger.log("Process resource path:", process.resourcesPath);
-    logger.log("App path:", app.getAppPath());
-    logger.log("__dirname:", __dirname);
-    logger.log("process.cwd():", process.cwd());
-  }
-
-  const indexPath = path.join(__dirname, "www", "index.html");
-
-  if (isDev) {
-    logger.log("Loading index from:", indexPath);
-    logger.log("www path:", path.join(__dirname, "www"));
-    logger.log("www assets path:", path.join(__dirname, "www", "assets"));
-  }
-
-  if (!fs.existsSync(indexPath)) {
-    logger.error(`Index file not found at: ${indexPath}`);
-    throw new Error("Index file not found");
-  }
-
-  // Add CSP headers to allow API connections
-  mainWindow.webContents.session.webRequest.onHeadersReceived(
-    (details, callback) => {
-      callback({
-        responseHeaders: {
-          ...details.responseHeaders,
-          "Content-Security-Policy": [
-            "default-src 'self';" +
-              "connect-src 'self' https://api.endorser.ch https://*.timesafari.app;" +
-              "img-src 'self' data: https: blob:;" +
-              "script-src 'self' 'unsafe-inline' 'unsafe-eval';" +
-              "style-src 'self' 'unsafe-inline';" +
-              "font-src 'self' data:;",
-          ],
-        },
-      });
-    },
-  );
-
-  // Load the index.html
-  mainWindow
-    .loadFile(indexPath)
-    .then(() => {
-      logger.log("Successfully loaded index.html");
-      if (isDev) {
-        mainWindow.webContents.openDevTools();
-        logger.log("DevTools opened - running in dev mode");
-      }
-    })
-    .catch((err) => {
-      logger.error("Failed to load index.html:", err);
-      logger.error("Attempted path:", indexPath);
-    });
-
-  // Listen for console messages from the renderer
-  mainWindow.webContents.on("console-message", (_event, level, message) => {
-    logger.log("Renderer Console:", message);
-  });
-
-  // Add right after creating the BrowserWindow
-  mainWindow.webContents.on(
-    "did-fail-load",
-    (event, errorCode, errorDescription) => {
-      logger.error("Page failed to load:", errorCode, errorDescription);
-    },
-  );
-
-  mainWindow.webContents.on("preload-error", (event, preloadPath, error) => {
-    logger.error("Preload script error:", preloadPath, error);
-  });
-
-  mainWindow.webContents.on(
-    "console-message",
-    (event, level, message, line, sourceId) => {
-      logger.log("Renderer Console:", line, sourceId, message);
-    },
-  );
-
-  // Enable remote debugging when in dev mode
-  if (isDev) {
-    mainWindow.webContents.openDevTools();
+function logError(...args) {
+  // eslint-disable-next-line no-console
+  console.error("[ERROR]", ...args);
+  if (!isDev && mainWindow) {
+    dialog.showErrorBox("TimeSafari Error", args.join(" "));
  }
 }

-// Handle app ready
-app.whenReady().then(createWindow);
+// Get the most appropriate app path
+function getAppPath() {
+  if (app.isPackaged) {
+    const possiblePaths = [
+      path.join(process.resourcesPath, "app.asar", "dist-electron"),
+      path.join(process.resourcesPath, "app.asar"),
+      path.join(process.resourcesPath, "app"),
+      app.getAppPath(),
+    ];
+
+    for (const testPath of possiblePaths) {
+      const testFile = path.join(testPath, "www", "index.html");
+      if (fs.existsSync(testFile)) {
+        logDebug(`Found valid app path: ${testPath}`);
+        return testPath;
+      }
+    }
+
+    logError("Could not find valid app path");
+    return path.join(process.resourcesPath, "app.asar"); // Default fallback
+  } else {
+    return __dirname;
+  }
+}
+
+// Create the browser window
+function createWindow() {
+  logDebug("Creating window with paths:");
+  logDebug("- process.resourcesPath:", process.resourcesPath);
+  logDebug("- app.getAppPath():", app.getAppPath());
+  logDebug("- __dirname:", __dirname);
+
+  // Create the browser window
+  mainWindow = new BrowserWindow({
+    width: 1200,
+    height: 800,
+    webPreferences: {
+      preload: path.join(__dirname, "preload.js"),
+      contextIsolation: true,
+      nodeIntegration: false,
+      webSecurity: true,
+    },
+  });
+
+  // Fix root file paths - replaces all protocol handling
+  protocol.interceptFileProtocol("file", (request, callback) => {
+    let urlPath = request.url.substr(7); // Remove 'file://' prefix
+    urlPath = decodeURIComponent(urlPath); // Handle special characters
+
+    // Debug all asset requests
+    if (
+      urlPath.includes("assets/") ||
+      urlPath.endsWith(".js") ||
+      urlPath.endsWith(".css") ||
+      urlPath.endsWith(".html")
+    ) {
+      logDebug(`Intercepted request for: ${urlPath}`);
+    }
+
+    // Fix paths for files at root like registerSW.js or manifest.webmanifest
+    if (
+      urlPath.endsWith("registerSW.js") ||
+      urlPath.endsWith("manifest.webmanifest") ||
+      urlPath.endsWith("sw.js")
+    ) {
+      const appBasePath = getAppPath();
+      const filePath = path.join(appBasePath, "www", path.basename(urlPath));
+
+      if (fs.existsSync(filePath)) {
+        logDebug(`Serving ${urlPath} from ${filePath}`);
+        return callback({ path: filePath });
+      } else {
+        // For service worker, provide empty content to avoid errors
+        if (urlPath.endsWith("registerSW.js") || urlPath.endsWith("sw.js")) {
+          logDebug(`Providing empty SW file for ${urlPath}`);
+          // Create an empty JS file content that does nothing
+          const tempFile = path.join(
+            app.getPath("temp"),
+            path.basename(urlPath),
+          );
+          fs.writeFileSync(
+            tempFile,
+            "// Service workers disabled in Electron\n",
+          );
+          return callback({ path: tempFile });
+        }
+      }
+    }
+
+    // Handle assets paths that might be requested from root
+    if (urlPath.startsWith("/assets/") || urlPath === "/assets") {
+      const appBasePath = getAppPath();
+      const filePath = path.join(appBasePath, "www", urlPath);
+      logDebug(`Redirecting ${urlPath} to ${filePath}`);
+      return callback({ path: filePath });
+    }
+
+    // Handle assets paths that are missing the www folder
+    if (urlPath.includes("/assets/")) {
+      const appBasePath = getAppPath();
+      const relativePath = urlPath.substring(urlPath.indexOf("/assets/"));
+      const filePath = path.join(appBasePath, "www", relativePath);
+      if (fs.existsSync(filePath)) {
+        logDebug(`Fixing asset path ${urlPath} to ${filePath}`);
+        return callback({ path: filePath });
+      }
+    }
+
+    // For all other paths, just pass them through
+    callback({ path: urlPath });
+  });
+
+  // Set up CSP headers - more permissive in dev mode
+  session.defaultSession.webRequest.onHeadersReceived((details, callback) => {
+    callback({
+      responseHeaders: {
+        ...details.responseHeaders,
+        "Content-Security-Policy": [
+          isDev
+            ? "default-src 'self' file:; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; font-src 'self' https://fonts.gstatic.com; img-src 'self' data: blob: https://*; connect-src 'self' https://*"
+            : "default-src 'self' file:; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; font-src 'self' https://fonts.gstatic.com; img-src 'self' data: blob: https://image.timesafari.app https://*.americancloud.com; connect-src 'self' https://api.timesafari.app https://api.endorser.ch https://test-api.endorser.ch https://fonts.googleapis.com",
+        ],
+      },
+    });
+  });
+
+  // Load the index.html with modifications
+  try {
+    const appPath = getAppPath();
+    const wwwFolder = path.join(appPath, "www");
+    const indexPath = path.join(wwwFolder, "index.html");
+
+    logDebug("Loading app from:", indexPath);
+
+    // Check if the file exists
+    if (fs.existsSync(indexPath)) {
+      // Read and modify index.html to disable service worker
+      let indexContent = fs.readFileSync(indexPath, "utf8");
+
+      // 1. Add base tag for proper path resolution
+      indexContent = indexContent.replace(
+        "<head>",
+        `<head>\n    <base href="file://${wwwFolder}/">`,
+      );
+
+      // 2. Disable service worker registration by replacing the script
+      if (indexContent.includes("registerSW.js")) {
+        indexContent = indexContent.replace(
+          /<script src="registerSW\.js"><\/script>/,
+          "<script>/* Service worker disabled in Electron */</script>",
+        );
+      }
+
+      // Create a temp file with modified content
+      const tempDir = app.getPath("temp");
+      const tempIndexPath = path.join(tempDir, "timesafari-index.html");
+      fs.writeFileSync(tempIndexPath, indexContent);
+
+      // Load the modified index.html
+      mainWindow.loadFile(tempIndexPath).catch((err) => {
+        logError("Failed to load via loadFile:", err);
+
+        // Fallback to direct URL loading
+        mainWindow.loadURL(`file://${tempIndexPath}`).catch((err2) => {
+          logError("Both loading methods failed:", err2);
+          mainWindow.loadURL(
+            "data:text/html,<h1>Error: Failed to load TimeSafari</h1><p>Please contact support.</p>",
+          );
+        });
+      });
+    } else {
+      logError(`Index file not found at: ${indexPath}`);
+      mainWindow.loadURL(
+        "data:text/html,<h1>Error: Cannot find application</h1><p>index.html not found</p>",
+      );
+    }
+  } catch (err) {
+    logError("Failed to load app:", err);
+  }
+
+  // Open DevTools in development
+  if (isDev) {
+    mainWindow.webContents.openDevTools();
+  }
+
+  mainWindow.on("closed", () => {
+    mainWindow = null;
+  });
+}
+
+// App lifecycle events
+app.whenReady().then(() => {
+  logDebug(`Starting TimeSafari v${app.getVersion()}`);
+
+  // Skip the service worker registration for file:// protocol
+  process.env.ELECTRON_DISABLE_SECURITY_WARNINGS = "true";
+
+  createWindow();
+
+  app.on("activate", () => {
+    if (BrowserWindow.getAllWindows().length === 0) createWindow();
+  });
+});

-// Handle all windows closed
 app.on("window-all-closed", () => {
-  if (process.platform !== "darwin") {
-    app.quit();
-  }
+  if (process.platform !== "darwin") app.quit();
 });

-app.on("activate", () => {
-  if (BrowserWindow.getAllWindows().length === 0) {
-    createWindow();
-  }
-});
-
-// Handle any errors
+// Handle uncaught exceptions
 process.on("uncaughtException", (error) => {
-  logger.error("Uncaught Exception:", error);
+  logError("Uncaught Exception:", error);
 });
--- a/src/electron/preload.js
+++ b/src/electron/preload.js
@@ -1,78 +1,95 @@
 const { contextBridge, ipcRenderer } = require("electron");

-const logger = {
-  log: (message, ...args) => {
-    if (process.env.NODE_ENV !== "production") {
-      /* eslint-disable no-console */
-      console.log(message, ...args);
-      /* eslint-enable no-console */
-    }
-  },
-  warn: (message, ...args) => {
-    if (process.env.NODE_ENV !== "production") {
-      /* eslint-disable no-console */
-      console.warn(message, ...args);
-      /* eslint-enable no-console */
-    }
-  },
-  error: (message, ...args) => {
-    /* eslint-disable no-console */
-    console.error(message, ...args); // Errors should always be logged
-    /* eslint-enable no-console */
-  },
-};
-
-// Use a more direct path resolution approach
-const getPath = (pathType) => {
-  switch (pathType) {
-    case "userData":
-      return (
-        process.env.APPDATA ||
-        (process.platform === "darwin"
-          ? `${process.env.HOME}/Library/Application Support`
-          : `${process.env.HOME}/.local/share`)
-      );
-    case "home":
-      return process.env.HOME;
-    case "appPath":
-      return process.resourcesPath;
-    default:
-      return "";
+// Safety wrapper for logging
+function safeLog(message) {
+  try {
+    // eslint-disable-next-line no-console
+    console.log("[Preload]", message);
+  } catch (e) {
+    // Silent fail for logging
  }
-};
+}

-logger.log("Preload script starting...");
+// Initialize
+safeLog("Preload script starting...");

 try {
-  contextBridge.exposeInMainWorld("electronAPI", {
-    // Path utilities
-    getPath,
+  // Mock service worker registration to prevent errors
+  if (window.navigator) {
+    // Override the service worker registration to return a fake promise that resolves with nothing
+    window.navigator.serviceWorker = {
+      register: () => Promise.resolve({}),
+      getRegistration: () => Promise.resolve(null),
+      ready: Promise.resolve({}),
+    };
+  }

-    // IPC functions
+  // Safely expose specific APIs to the renderer process
+  contextBridge.exposeInMainWorld("electronAPI", {
+    // Basic flags/info
+    isElectron: true,
+
+    // Disable service worker in Electron
+    disableServiceWorker: true,
+
+    // Logging
+    log: (message) => {
+      try {
+        // eslint-disable-next-line no-console
+        console.log("[Renderer]", message);
+      } catch (e) {
+        // Silence any errors from logging
+      }
+    },
+
+    // Report errors to main process
+    reportError: (error) => {
+      try {
+        ipcRenderer.send("app-error", error.toString());
+      } catch (e) {
+        // eslint-disable-next-line no-console
+        console.error("Failed to report error to main process", e);
+      }
+    },
+
+    // Safe path handling helper (no Node modules needed)
+    joinPath: (...parts) => {
+      return parts.join("/").replace(/\/\//g, "/");
+    },
+
+    // Fix asset URLs
+    resolveAssetUrl: (assetPath) => {
+      if (assetPath.startsWith("/assets/")) {
+        return assetPath; // Already properly formed
+      }
+      if (assetPath.startsWith("assets/")) {
+        return "/" + assetPath; // Add leading slash
+      }
+      return assetPath;
+    },
+
+    // Send messages to main process
    send: (channel, data) => {
-      const validChannels = ["toMain"];
+      // Whitelist channels for security
+      const validChannels = ["app-event", "log-event", "app-error"];
      if (validChannels.includes(channel)) {
        ipcRenderer.send(channel, data);
      }
    },
+
+    // Receive messages from main process
    receive: (channel, func) => {
-      const validChannels = ["fromMain"];
+      const validChannels = ["app-notification", "log-response"];
      if (validChannels.includes(channel)) {
-        ipcRenderer.on(channel, (event, ...args) => func(...args));
+        // Remove old listeners to avoid memory leaks
+        ipcRenderer.removeAllListeners(channel);
+        // Add the new listener
+        ipcRenderer.on(channel, (_, ...args) => func(...args));
      }
    },
-    // Environment info
-    env: {
-      isElectron: true,
-      isDev: process.env.NODE_ENV === "development",
-    },
-    // Path utilities
-    getBasePath: () => {
-      return process.env.NODE_ENV === "development" ? "/" : "./";
-    },
  });

-  logger.log("Preload script completed successfully");
-} catch (error) {
-  logger.error("Error in preload script:", error);
+  safeLog("Preload script completed successfully");
+} catch (err) {
+  safeLog("Error in preload script: " + err.toString());
 }
--- a/src/interfaces/common.ts
+++ b/src/interfaces/common.ts
@@ -2,9 +2,6 @@
 export interface GenericVerifiableCredential {
  "@context"?: string;
  "@type": string;
-  name?: string;
-  description?: string;
-  agent?: { identifier: string } | string;
  [key: string]: unknown;
 }

--- a/src/interfaces/identifier.ts
+++ b/src/interfaces/identifier.ts
@@ -1,34 +0,0 @@
-/**
- * Interface for a Decentralized Identifier (DID)
- * @author Matthew Raymer
- */
-
-import { KeyMeta } from "../libs/crypto/vc";
-
-export interface IKey {
-  id: string;
-  type: string;
-  controller: string;
-  ethereumAddress: string;
-  publicKeyHex: string;
-  privateKeyHex: string;
-  meta?: KeyMeta;
-}
-
-export interface IService {
-  id: string;
-  type: string;
-  serviceEndpoint: string;
-  description?: string;
-  metadata?: {
-    version?: string;
-    capabilities?: string[];
-    config?: Record<string, unknown>;
-  };
-}
-
-export interface IIdentifier {
-  did: string;
-  keys: IKey[];
-  services: IService[];
-}
--- a/src/interfaces/index.ts
+++ b/src/interfaces/index.ts
@@ -5,4 +5,3 @@ export * from "./limits";
 export * from "./records";
 export * from "./user";
 export * from "./deepLinks";
-export * from "./identifier";
--- a/src/interfaces/service.ts
+++ b/src/interfaces/service.ts
@@ -1,288 +0,0 @@
-/**
- * @file service.ts
- * @description Service interfaces for Decentralized Identifiers (DIDs)
- *
- * This module defines the service interfaces used in the TimeSafari application.
- * Services are associated with DIDs to provide additional functionality and endpoints.
- *
- * Architecture:
- * 1. Base IService interface defines common service properties
- * 2. Specialized interfaces extend IService for specific service types
- * 3. Services are stored in IIdentifier.services array
- * 4. Services are loaded and managed by PlatformServiceFactory
- *
- * Service Types:
- * - EndorserService: Handles claims and endorsements
- * - PushNotificationService: Manages web push notifications
- * - ProfileService: Handles user profiles and settings
- * - BackupService: Manages data backup and restore
- *
- * @see IIdentifier
- * @see PlatformServiceFactory
- * @see DatabaseBackupService
- */
-
-/**
- * Base interface for all DID services
- *
- * This interface defines the core properties that all services must implement.
- * It follows the W3C DID specification for service endpoints.
- *
- * @example
- * const service: IService = {
- *   id: 'endorser-service',
- *   type: 'EndorserService',
- *   serviceEndpoint: 'https://api.endorser.ch',
- *   description: 'Endorser service for claims and endorsements',
- *   metadata: {
- *     version: '1.0.0',
- *     capabilities: ['claims', 'endorsements'],
- *     config: { apiServer: 'https://api.endorser.ch' }
- *   }
- * };
- */
-export interface IService {
-  /**
-   * Unique identifier for the service
-   * @example 'endorser-service'
-   * @example 'push-notification-service'
-   */
-  id: string;
-
-  /**
-   * Type of service
-   * @example 'EndorserService'
-   * @example 'PushNotificationService'
-   */
-  type: string;
-
-  /**
-   * Endpoint URL for the service
-   * @example 'https://api.endorser.ch'
-   * @example 'https://push.timesafari.app'
-   */
-  serviceEndpoint: string;
-
-  /**
-   * Optional human-readable description of the service
-   * @example 'Service for handling claims and endorsements'
-   */
-  description?: string;
-
-  /**
-   * Optional metadata for service configuration
-   */
-  metadata?: {
-    /**
-     * Service version in semantic versioning format
-     * @example '1.0.0'
-     */
-    version?: string;
-
-    /**
-     * Array of service capabilities
-     * @example ['claims', 'endorsements']
-     * @example ['notifications', 'alerts']
-     */
-    capabilities?: string[];
-
-    /**
-     * Service-specific configuration
-     * @example { apiServer: 'https://api.endorser.ch' }
-     */
-    config?: Record<string, unknown>;
-  };
-}
-
-/**
- * Service for handling claims and endorsements
- *
- * This service provides endpoints for:
- * - Submitting claims
- * - Managing endorsements
- * - Checking rate limits
- *
- * @example
- * const endorserService: IEndorserService = {
- *   id: 'endorser-service',
- *   type: 'EndorserService',
- *   serviceEndpoint: 'https://api.endorser.ch',
- *   metadata: {
- *     version: '1.0.0',
- *     capabilities: ['claims', 'endorsements'],
- *     config: {
- *       apiServer: 'https://api.endorser.ch',
- *       rateLimits: {
- *         claimsPerDay: 100,
- *         endorsementsPerDay: 1000
- *       }
- *     }
- *   }
- * };
- */
-export interface IEndorserService extends IService {
-  /** @override */
-  type: "EndorserService";
-
-  /** @override */
-  metadata: {
-    version: string;
-    capabilities: ["claims", "endorsements"];
-    config: {
-      /**
-       * API server URL
-       * @example 'https://api.endorser.ch'
-       */
-      apiServer: string;
-
-      /**
-       * Optional rate limits
-       */
-      rateLimits?: {
-        /**
-         * Maximum claims per day
-         * @default 100
-         */
-        claimsPerDay: number;
-
-        /**
-         * Maximum endorsements per day
-         * @default 1000
-         */
-        endorsementsPerDay: number;
-      };
-    };
-  };
-}
-
-/**
- * Service for managing web push notifications
- *
- * This service provides endpoints for:
- * - Registering push subscriptions
- * - Sending push notifications
- * - Managing notification preferences
- *
- * @example
- * const pushService: IPushNotificationService = {
- *   id: 'push-service',
- *   type: 'PushNotificationService',
- *   serviceEndpoint: 'https://push.timesafari.app',
- *   metadata: {
- *     version: '1.0.0',
- *     capabilities: ['notifications'],
- *     config: {
- *       pushServer: 'https://push.timesafari.app',
- *       vapidPublicKey: '...'
- *     }
- *   }
- * };
- */
-export interface IPushNotificationService extends IService {
-  /** @override */
-  type: "PushNotificationService";
-
-  /** @override */
-  metadata: {
-    version: string;
-    capabilities: ["notifications"];
-    config: {
-      /**
-       * Push server URL
-       * @example 'https://push.timesafari.app'
-       */
-      pushServer: string;
-
-      /**
-       * Optional VAPID public key for push notifications
-       */
-      vapidPublicKey?: string;
-    };
-  };
-}
-
-/**
- * Service for managing user profiles and settings
- *
- * This service provides endpoints for:
- * - Managing user profiles
- * - Updating user settings
- * - Retrieving user preferences
- *
- * @example
- * const profileService: IProfileService = {
- *   id: 'profile-service',
- *   type: 'ProfileService',
- *   serviceEndpoint: 'https://partner-api.endorser.ch',
- *   metadata: {
- *     version: '1.0.0',
- *     capabilities: ['profile', 'settings'],
- *     config: {
- *       partnerApiServer: 'https://partner-api.endorser.ch'
- *     }
- *   }
- * };
- */
-export interface IProfileService extends IService {
-  /** @override */
-  type: "ProfileService";
-
-  /** @override */
-  metadata: {
-    version: string;
-    capabilities: ["profile", "settings"];
-    config: {
-      /**
-       * Partner API server URL
-       * @example 'https://partner-api.endorser.ch'
-       */
-      partnerApiServer: string;
-    };
-  };
-}
-
-/**
- * Service for managing data backup and restore operations
- *
- * This service provides endpoints for:
- * - Creating backups
- * - Restoring from backups
- * - Managing backup storage
- *
- * @example
- * const backupService: IBackupService = {
- *   id: 'backup-service',
- *   type: 'BackupService',
- *   serviceEndpoint: 'https://backup.timesafari.app',
- *   metadata: {
- *     version: '1.0.0',
- *     capabilities: ['backup', 'restore'],
- *     config: {
- *       storageType: 'cloud',
- *       encryptionKey: '...'
- *     }
- *   }
- * };
- */
-export interface IBackupService extends IService {
-  /** @override */
-  type: "BackupService";
-
-  /** @override */
-  metadata: {
-    version: string;
-    capabilities: ["backup", "restore"];
-    config: {
-      /**
-       * Storage type for backups
-       * @default 'local'
-       */
-      storageType: "local" | "cloud";
-
-      /**
-       * Optional encryption key for backups
-       */
-      encryptionKey?: string;
-    };
-  };
-}
--- a/src/libs/crypto/vc/index.ts
+++ b/src/libs/crypto/vc/index.ts
@@ -38,10 +38,6 @@ export interface KeyMeta {
   * The Webauthn credential ID in hex, if this is from a passkey
   */
  passkeyCredIdHex?: string;
-  /**
-   * The derivation path for the key
-   */
-  derivationPath?: string;
 }

 const ethLocalResolver = new Resolver({ ethr: didEthLocalResolver });
--- a/src/libs/endorserServer.ts
+++ b/src/libs/endorserServer.ts
@@ -50,8 +50,6 @@ import {
 } from "../interfaces";
 import { logger } from "../utils/logger";

-export type { GenericVerifiableCredential, GenericCredWrapper };
-
 /**
 * Standard context for schema.org data
 * @constant {string}
--- a/src/main.ts
+++ b/src/main.ts
@@ -87,6 +87,7 @@ import {
  faUser,
  faUsers,
  faXmark,
+  faBuilding,
 } from "@fortawesome/free-solid-svg-icons";

 library.add(
@@ -167,6 +168,7 @@ library.add(
  faUser,
  faUsers,
  faXmark,
+  faBuilding,
 );

 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
@@ -200,63 +202,14 @@ function setupGlobalErrorHandler(app: VueApp) {
  };
 }

-const app = createApp(App);
+const app = createApp(App)
+  .component("fa", FontAwesomeIcon)
+  .component("camera", Camera)
+  .use(createPinia())
+  .use(VueAxios, axios)
+  .use(router)
+  .use(Notifications);

-// Add global error handler for component registration
-app.config.errorHandler = (err, vm, info) => {
-  logger.error("Vue global error:", {
-    error:
-      err instanceof Error
-        ? {
-            name: err.name,
-            message: err.message,
-            stack: err.stack,
-          }
-        : err,
-    componentName: vm?.$options?.name || "unknown",
-    info,
-    componentData: vm
-      ? {
-          hasRouter: !!vm.$router,
-          hasNotify: !!vm.$notify,
-          hasAxios: !!vm.axios,
-        }
-      : "no vm data",
-  });
-};
+setupGlobalErrorHandler(app);

-// Register components and plugins with error handling
-try {
-  app.component("FontAwesome", FontAwesomeIcon).component("camera", Camera);
-
-  const pinia = createPinia();
-  app.use(pinia);
-  logger.log("Pinia store initialized");
-
-  app.use(VueAxios, axios);
-  logger.log("Axios initialized");
-
-  app.use(router);
-  logger.log("Router initialized");
-
-  app.use(Notifications);
-  logger.log("Notifications initialized");
-
-  setupGlobalErrorHandler(app);
-  logger.log("Global error handler setup");
-
-  // Mount the app
-  app.mount("#app");
-  logger.log("App mounted successfully");
-} catch (error) {
-  logger.error("Critical error during app initialization:", {
-    error:
-      error instanceof Error
-        ? {
-            name: error.name,
-            message: error.message,
-            stack: error.stack,
-          }
-        : error,
-  });
-}
+app.mount("#app");
--- a/src/platforms/capacitor/DatabaseBackupService.ts
+++ b/src/platforms/capacitor/DatabaseBackupService.ts
@@ -1,82 +0,0 @@
-/**
- * @file DatabaseBackupService.ts
- * @description Capacitor-specific implementation of database backup service
- *
- * This service handles database backup operations on Capacitor platforms (Android/iOS)
- * using the Filesystem and Share plugins. It creates a temporary backup file,
- * writes the backup data to it, and shares the file using the platform's share sheet.
- */
-
-import { Filesystem, Directory } from "@capacitor/filesystem";
-import { Share } from "@capacitor/share";
-import { DatabaseBackupService as BaseDatabaseBackupService } from "../../services/DatabaseBackupService";
-import { log, error } from "../../utils/logger";
-
-export class DatabaseBackupService extends BaseDatabaseBackupService {
-  /**
-   * Handles the backup process for Capacitor platforms
-   *
-   * @param base64Data - Backup data in base64 format
-   * @param arrayBuffer - Backup data as ArrayBuffer
-   * @param blob - Backup data as Blob
-   */
-  protected async handleBackup(
-    base64Data: string,
-    _arrayBuffer: ArrayBuffer,
-    _blob: Blob,
-  ): Promise<void> {
-    try {
-      log("Starting backup process for Capacitor platform");
-
-      // Create a timestamped backup file name
-      const timestamp = new Date().toISOString().replace(/[:.]/g, "-");
-      const backupFileName = `timesafari-backup-${timestamp}.json`;
-      const backupFilePath = `backups/${backupFileName}`;
-
-      log("Creating backup file:", {
-        fileName: backupFileName,
-        path: backupFilePath,
-      });
-
-      // Write the backup file
-      const writeResult = (await Filesystem.writeFile({
-        path: backupFilePath,
-        data: base64Data,
-        directory: Directory.Cache,
-        recursive: true,
-      })) as unknown as { uri: string };
-
-      if (!writeResult.uri) {
-        throw new Error("Failed to write backup file: No URI returned");
-      }
-
-      log("Backup file written successfully:", { uri: writeResult.uri });
-
-      // Share the backup file
-      log("Sharing backup file");
-      await Share.share({
-        title: "TimeSafari Backup",
-        text: "Your TimeSafari backup file",
-        url: writeResult.uri,
-        dialogTitle: "Share TimeSafari Backup",
-      });
-
-      log("Backup shared successfully");
-
-      // Clean up the temporary file
-      try {
-        await Filesystem.deleteFile({
-          path: backupFilePath,
-          directory: Directory.Cache,
-        });
-        log("Temporary backup file cleaned up");
-      } catch (cleanupError) {
-        error("Failed to clean up temporary backup file:", cleanupError);
-        // Don't throw here as the backup was successful
-      }
-    } catch (err) {
-      error("Error during backup process:", err);
-      throw err;
-    }
-  }
-}
--- a/src/registerServiceWorker.ts
+++ b/src/registerServiceWorker.ts
@@ -37,3 +37,16 @@ if (
    "Service worker registration skipped - not enabled or not in production",
  );
 }
+
+export function registerServiceWorker() {
+  // Skip service worker registration in Electron
+  if (window.electronAPI?.isElectron) {
+    console.log("Running in Electron - skipping service worker registration");
+    return;
+  }
+
+  // Regular service worker registration for web
+  if ("serviceWorker" in navigator) {
+    // ... existing code ...
+  }
+}
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -6,13 +6,8 @@ import {
  RouteLocationNormalized,
  RouteRecordRaw,
 } from "vue-router";
-import {
-  accountsDBPromise,
-  retrieveSettingsForActiveAccount,
-} from "../db/index";
+import { accountsDBPromise } from "../db/index";
 import { logger } from "../utils/logger";
-import { Component as VueComponent } from "vue-facing-decorator";
-import { defineComponent } from "vue";

 /**
 *
@@ -40,79 +35,7 @@ const routes: Array<RouteRecordRaw> = [
  {
    path: "/account",
    name: "account",
-    component: () => {
-      logger.log("Starting lazy load of AccountViewView");
-      return new Promise((resolve) => {
-        import("../views/AccountViewView.vue")
-          .then((module) => {
-            if (!module?.default) {
-              logger.error(
-                "AccountViewView module loaded but default export is missing",
-                {
-                  module: {
-                    hasDefault: !!module?.default,
-                    keys: Object.keys(module || {}),
-                  },
-                },
-              );
-              resolve(createErrorComponent());
-              return;
-            }
-
-            // Check if the component has the required dependencies
-            const component = module.default;
-            logger.log("AccountViewView loaded, checking dependencies...", {
-              componentName: component.name,
-              hasVueComponent: component instanceof VueComponent,
-              hasClass: typeof component === "function",
-              type: typeof component,
-            });
-
-            resolve(component);
-          })
-          .catch((err) => {
-            logger.error("Failed to load AccountViewView:", {
-              error:
-                err instanceof Error
-                  ? {
-                      name: err.name,
-                      message: err.message,
-                      stack: err.stack,
-                    }
-                  : err,
-              type: typeof err,
-            });
-
-            resolve(createErrorComponent());
-          });
-      });
-    },
-    beforeEnter: async (to, from, next) => {
-      try {
-        logger.log("Account route beforeEnter guard starting");
-
-        // Check if required dependencies are available
-        const settings = await retrieveSettingsForActiveAccount();
-        logger.log("Account route: settings loaded", {
-          hasActiveDid: !!settings.activeDid,
-          isRegistered: !!settings.isRegistered,
-        });
-
-        next();
-      } catch (error) {
-        logger.error("Error in account route beforeEnter:", {
-          error:
-            error instanceof Error
-              ? {
-                  name: error.name,
-                  message: error.message,
-                  stack: error.stack,
-                }
-              : error,
-        });
-        next({ name: "home" });
-      }
-    },
+    component: () => import("../views/AccountViewView.vue"),
  },
  {
    path: "/claim/:id?",
@@ -392,271 +315,25 @@ const router = createRouter({
 // Replace initial URL to start at `/` if necessary
 router.replace(initialPath || "/");

-// Add global error handler
-router.onError((error, to, from) => {
-  logger.error("Router error:", {
-    error:
-      error instanceof Error
-        ? {
-            name: error.name,
-            message: error.message,
-            stack: error.stack,
-          }
-        : error,
-    to: {
-      name: to.name,
-      path: to.path,
-    },
-    from: {
-      name: from.name,
-      path: from.path,
-    },
-  });
+const errorHandler = (
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  error: any,
+  to: RouteLocationNormalized,
+  from: RouteLocationNormalized,
+) => {
+  // Handle the error here
+  logger.error("Caught in top level error handler:", error, to, from);
+  alert("Something is very wrong. Try reloading or restarting the app.");

-  // If it's a reference error during account view import, try to handle it gracefully
-  if (error instanceof ReferenceError && to.name === "account") {
-    logger.error("Account view import error:", {
-      error:
-        error instanceof Error
-          ? {
-              name: error.name,
-              message: error.message,
-              stack: error.stack,
-            }
-          : error,
-    });
-    // Instead of redirecting, let the component's error handling take over
-    return;
-  }
-});
+  // You can also perform additional actions, such as displaying an error message or redirecting the user to a specific page
+};

-// Add navigation guard for debugging
-router.beforeEach((to, from, next) => {
-  logger.log("Navigation debug:", {
-    to: {
-      fullPath: to.fullPath,
-      path: to.path,
-      name: to.name,
-      params: to.params,
-      query: to.query,
-    },
-    from: {
-      fullPath: from.fullPath,
-      path: from.path,
-      name: from.name,
-      params: from.params,
-      query: from.query,
-    },
-  });
+router.onError(errorHandler); // Assign the error handler to the router instance

-  // For account route, try to preload the component
-  if (to.name === "account") {
-    logger.log("Preloading account component...");
-
-    // Wrap in try-catch and use Promise
-    new Promise((resolve) => {
-      logger.log("Starting dynamic import of AccountViewView");
-
-      // Add immediate try-catch to get more context
-      try {
-        const importPromise = import("../views/AccountViewView.vue");
-        logger.log("Import initiated successfully");
-
-        importPromise
-          .then((module) => {
-            try {
-              logger.log("Import completed, analyzing module:", {
-                moduleExists: !!module,
-                moduleType: typeof module,
-                moduleKeys: Object.keys(module || {}),
-                hasDefault: !!module?.default,
-                defaultType: module?.default
-                  ? typeof module.default
-                  : "undefined",
-                defaultConstructor: module?.default?.constructor?.name,
-                moduleContent: {
-                  ...Object.fromEntries(
-                    Object.entries(module).map(([key, value]) => [
-                      key,
-                      typeof value === "function"
-                        ? "function"
-                        : typeof value === "object"
-                          ? Object.keys(value || {})
-                          : typeof value,
-                    ]),
-                  ),
-                },
-              });
-
-              if (!module?.default) {
-                logger.error(
-                  "AccountViewView preload: module loaded but default export is missing",
-                  {
-                    module: {
-                      hasDefault: !!module?.default,
-                      keys: Object.keys(module || {}),
-                      moduleType: typeof module,
-                      exports: Object.keys(module || {}).map((key) => ({
-                        key,
-                        type: typeof (module as any)[key],
-                        value:
-                          typeof (module as any)[key] === "function"
-                            ? "function"
-                            : typeof (module as any)[key] === "object"
-                              ? Object.keys((module as any)[key] || {})
-                              : (module as any)[key],
-                      })),
-                    },
-                  },
-                );
-                resolve(null);
-                return;
-              }
-
-              const component = module.default;
-
-              // Try to safely inspect the component
-              const componentDetails = {
-                componentName: component.name,
-                hasVueComponent: component instanceof VueComponent,
-                hasClass: typeof component === "function",
-                type: typeof component,
-                properties: Object.keys(component),
-                decorators: Object.getOwnPropertyDescriptor(
-                  component,
-                  "__decorators",
-                ),
-                vueOptions:
-                  (component as any).__vccOpts ||
-                  (component as any).options ||
-                  null,
-                setup: typeof (component as any).setup === "function",
-                render: typeof (component as any).render === "function",
-                components: (component as any).components
-                  ? Object.keys((component as any).components)
-                  : null,
-                imports: Object.keys(module).filter((key) => key !== "default"),
-              };
-
-              logger.log("Successfully analyzed component:", componentDetails);
-              resolve(component);
-            } catch (analysisError) {
-              logger.error("Error during component analysis:", {
-                error:
-                  analysisError instanceof Error
-                    ? {
-                        name: analysisError.name,
-                        message: analysisError.message,
-                        stack: analysisError.stack,
-                        keys: Object.keys(analysisError),
-                        properties: Object.getOwnPropertyNames(analysisError),
-                      }
-                    : analysisError,
-                type: typeof analysisError,
-                phase: "analysis",
-              });
-              resolve(null);
-            }
-          })
-          .catch((err) => {
-            logger.error("Failed to preload account component:", {
-              error:
-                err instanceof Error
-                  ? {
-                      name: err.name,
-                      message: err.message,
-                      stack: err.stack,
-                      keys: Object.keys(err),
-                      properties: Object.getOwnPropertyNames(err),
-                    }
-                  : err,
-              type: typeof err,
-              context: {
-                routeName: to.name,
-                routePath: to.path,
-                fromRoute: from.name,
-              },
-              phase: "module-load",
-            });
-            resolve(null);
-          });
-      } catch (immediateError) {
-        logger.error("Immediate error during import initiation:", {
-          error:
-            immediateError instanceof Error
-              ? {
-                  name: immediateError.name,
-                  message: immediateError.message,
-                  stack: immediateError.stack,
-                  keys: Object.keys(immediateError),
-                  properties: Object.getOwnPropertyNames(immediateError),
-                }
-              : immediateError,
-          type: typeof immediateError,
-          context: {
-            routeName: to.name,
-            routePath: to.path,
-            fromRoute: from.name,
-            importPath: "../views/AccountViewView.vue",
-          },
-          phase: "import",
-        });
-        resolve(null);
-      }
-    }).catch((err) => {
-      logger.error("Critical error in account component preload:", {
-        error:
-          err instanceof Error
-            ? {
-                name: err.name,
-                message: err.message,
-                stack: err.stack,
-              }
-            : err,
-        context: {
-          routeName: to.name,
-          routePath: to.path,
-          fromRoute: from.name,
-        },
-        phase: "wrapper",
-      });
-    });
-  }
-
-  // Always call next() to continue navigation
-  next();
-});
-
-function createErrorComponent() {
-  return defineComponent({
-    name: "AccountViewError",
-    components: {
-      // Add any required components here
-    },
-    setup() {
-      const goHome = () => {
-        router.push({ name: "home" });
-      };
-
-      return {
-        goHome,
-      };
-    },
-    template: `
-      <section class="p-6 pb-24 max-w-3xl mx-auto">
-        <h1 class="text-4xl text-center font-light mb-8">Error Loading Account View</h1>
-        <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative" role="alert">
-          <strong class="font-bold">Failed to load account view.</strong>
-          <span class="block sm:inline"> Please try refreshing the page.</span>
-        </div>
-        <div class="mt-4 text-center">
-          <button @click="goHome" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
-            Return to Home
-          </button>
-        </div>
-      </section>
-    `,
-  });
-}
+// router.beforeEach((to, from, next) => {
+//   console.log("Navigating to view:", to.name);
+//   console.log("From view:", from.name);
+//   next();
+// });

 export default router;
--- a/src/services/DatabaseBackupService.ts
+++ b/src/services/DatabaseBackupService.ts
@@ -1,95 +0,0 @@
-/**
- * @file DatabaseBackupService.ts
- * @description Base service class for handling database backup operations
- *
- * This service implements the Template Method pattern to provide a common interface
- * for database backup operations across different platforms. It defines the structure
- * of backup operations while delegating platform-specific implementations to subclasses.
- *
- * Build Process Integration:
- * 1. Platform-Specific Implementation:
- *    - Each platform (web, electron, capacitor) has its own implementation
- *    - Implementations are loaded dynamically via PlatformServiceFactory
- *    - Located in ./platforms/{platform}/DatabaseBackupService.ts
- *
- * 2. Build Configuration:
- *    - Vite config files (vite.config.*.mts) set VITE_PLATFORM
- *    - PlatformServiceFactory uses this to load correct implementation
- *    - Build process creates separate chunks for each platform
- *
- * 3. Data Handling:
- *    - Supports multiple data formats (base64, ArrayBuffer, Blob)
- *    - Platform implementations handle format conversion
- *    - Ensures consistent backup format across platforms
- *
- * Usage:
- * - Create backup: DatabaseBackupService.createAndShareBackup(data)
- * - Platform-specific: new WebDatabaseBackupService().handleBackup()
- *
- * @see PlatformServiceFactory.ts
- * @see vite.config.web.mts
- * @see vite.config.electron.mts
- * @see vite.config.capacitor.mts
- */
-
-import { PlatformServiceFactory } from "./PlatformServiceFactory";
-import { log, error } from "../utils/logger";
-
-export class DatabaseBackupService {
-  /**
-   * Template method that must be implemented by platform-specific services
-   * @param base64Data - Backup data in base64 format
-   * @param arrayBuffer - Backup data as ArrayBuffer
-   * @param blob - Backup data as Blob
-   * @throws Error if not implemented by subclass
-   */
-  protected async handleBackup(
-    _base64Data: string,
-    _arrayBuffer: ArrayBuffer,
-    _blob: Blob,
-  ): Promise<void> {
-    throw new Error(
-      "handleBackup must be implemented by platform-specific service",
-    );
-  }
-
-  /**
-   * Factory method to create and share a backup
-   * Uses PlatformServiceFactory to get platform-specific implementation
-   *
-   * @param base64Data - Backup data in base64 format
-   * @param arrayBuffer - Backup data as ArrayBuffer
-   * @param blob - Backup data as Blob
-   * @returns Promise that resolves when backup is complete
-   */
-  public static async createAndShareBackup(
-    base64Data: string,
-    arrayBuffer: ArrayBuffer,
-    blob: Blob,
-  ): Promise<void> {
-    try {
-      log("Creating platform-specific backup service");
-      const backupService = await this.getPlatformSpecificBackupService();
-      log("Backup service created successfully");
-
-      log("Executing platform-specific backup");
-      await backupService.handleBackup(base64Data, arrayBuffer, blob);
-      log("Backup completed successfully");
-    } catch (err) {
-      error("Error during backup creation:", err);
-      if (err instanceof Error) {
-        error("Error details:", {
-          name: err.name,
-          message: err.message,
-          stack: err.stack,
-        });
-      }
-      throw err;
-    }
-  }
-
-  private static async getPlatformSpecificBackupService(): Promise<DatabaseBackupService> {
-    const factory = PlatformServiceFactory.getInstance();
-    return await factory.createDatabaseBackupService();
-  }
-}
--- a/src/services/PlatformServiceFactory.ts
+++ b/src/services/PlatformServiceFactory.ts
@@ -1,195 +0,0 @@
-/**
- * @file PlatformServiceFactory.ts
- * @description Factory for creating platform-specific service implementations
- * @author Matthew Raymer
- * @version 1.0.0
- *
- * This factory implements the Abstract Factory pattern to create platform-specific
- * implementations of services. It uses Vite's dynamic import feature to load the
- * appropriate implementation based on the current platform (web, electron, etc.).
- *
- * Architecture:
- * 1. Singleton Pattern:
- *    - Ensures only one factory instance exists
- *    - Manages platform-specific service instances
- *    - Maintains consistent state across the application
- *
- * 2. Dynamic Loading:
- *    - Uses Vite's dynamic import for platform-specific code
- *    - Loads services on-demand based on platform
- *    - Handles platform detection and service instantiation
- *
- * 3. Platform Detection:
- *    - Uses VITE_PLATFORM environment variable
- *    - Supports web, electron, and capacitor platforms
- *    - Falls back to 'web' if platform is not specified
- *
- * Usage:
- * ```typescript
- * // Get factory instance
- * const factory = PlatformServiceFactory.getInstance();
- *
- * // Create platform-specific service
- * const backupService = await factory.createDatabaseBackupService();
- * ```
- *
- * @see vite.config.web.mts
- * @see vite.config.electron.mts
- * @see vite.config.capacitor.mts
- * @see DatabaseBackupService
- */
-
-import { DatabaseBackupService } from "./DatabaseBackupService";
-import { DatabaseBackupService as StubDatabaseBackupService } from "./platforms/empty";
-import { logger } from "../utils/logger";
-
-/**
- * Factory class for creating platform-specific service implementations
- *
- * This class manages the creation and instantiation of platform-specific
- * service implementations. It uses the Abstract Factory pattern to provide
- * a consistent interface for creating services across different platforms.
- *
- * @example
- * ```typescript
- * // Get factory instance
- * const factory = PlatformServiceFactory.getInstance();
- *
- * // Create platform-specific service
- * const backupService = await factory.createDatabaseBackupService();
- *
- * // Use the service
- * await backupService.handleBackup(data);
- * ```
- */
-export class PlatformServiceFactory {
-  /**
-   * Singleton instance of the factory
-   * @private
-   */
-  private static instance: PlatformServiceFactory;
-
-  /**
-   * Current platform identifier
-   * @private
-   */
-  private platform: string;
-
-  /**
-   * Private constructor to enforce singleton pattern
-   *
-   * Initializes the factory with the current platform from environment variables.
-   * Falls back to 'web' if no platform is specified.
-   *
-   * @private
-   */
-  private constructor() {
-    this.platform = import.meta.env.VITE_PLATFORM || "web";
-  }
-
-  /**
-   * Gets the singleton instance of the factory
-   *
-   * Creates a new instance if one doesn't exist, otherwise returns
-   * the existing instance.
-   *
-   * @returns {PlatformServiceFactory} The singleton factory instance
-   *
-   * @example
-   * ```typescript
-   * const factory = PlatformServiceFactory.getInstance();
-   * ```
-   */
-  public static getInstance(): PlatformServiceFactory {
-    if (!PlatformServiceFactory.instance) {
-      PlatformServiceFactory.instance = new PlatformServiceFactory();
-    }
-    return PlatformServiceFactory.instance;
-  }
-
-  /**
-   * Creates a platform-specific database backup service
-   *
-   * Dynamically loads and instantiates the appropriate implementation
-   * based on the current platform. The implementation is loaded from
-   * the platforms/{platform}/DatabaseBackupService.ts file.
-   *
-   * @returns {Promise<DatabaseBackupService>} A promise that resolves to a platform-specific backup service
-   * @throws {Error} If the service fails to load or instantiate
-   *
-   * @example
-   * ```typescript
-   * const factory = PlatformServiceFactory.getInstance();
-   * try {
-   *   const backupService = await factory.createDatabaseBackupService();
-   *   await backupService.handleBackup(data);
-   * } catch (error) {
-   *   logger.error('Failed to create backup service:', error);
-   * }
-   * ```
-   */
-  public async createDatabaseBackupService(): Promise<DatabaseBackupService> {
-    // List of supported platforms for web builds
-    const webSupportedPlatforms = ["web", "capacitor", "electron"];
-
-    // Return stub implementation for unsupported platforms
-    if (!webSupportedPlatforms.includes(this.platform)) {
-      logger.log(
-        `Using stub implementation for unsupported platform: ${this.platform}`,
-      );
-      return new StubDatabaseBackupService();
-    }
-
-    try {
-      logger.log(`Loading platform-specific service for ${this.platform}`);
-      // Use dynamic import with platform-specific path
-      const module = await import(
-        /* @vite-ignore */
-        `./platforms/${this.platform}/DatabaseBackupService.ts`
-      );
-      logger.log("Platform service loaded successfully");
-      return new module.DatabaseBackupService();
-    } catch (error) {
-      logger.error(
-        `[TimeSafari] Failed to load platform-specific service for ${this.platform}:`,
-        error,
-      );
-      // Fallback to stub implementation on error
-      logger.log("Falling back to stub implementation");
-      return new StubDatabaseBackupService();
-    }
-  }
-
-  /**
-   * Gets the current platform identifier
-   *
-   * @returns {string} The current platform identifier
-   *
-   * @example
-   * ```typescript
-   * const factory = PlatformServiceFactory.getInstance();
-   * logger.log(factory.getPlatform()); // 'web', 'electron', or 'capacitor'
-   * ```
-   */
-  public getPlatform(): string {
-    return this.platform;
-  }
-
-  /**
-   * Sets the current platform identifier
-   *
-   * This method is primarily used for testing purposes to override
-   * the platform detection. Use with caution in production code.
-   *
-   * @param {string} platform - The platform identifier to set
-   *
-   * @example
-   * ```typescript
-   * const factory = PlatformServiceFactory.getInstance();
-   * factory.setPlatform('electron'); // For testing purposes only
-   * ```
-   */
-  public setPlatform(platform: string): void {
-    this.platform = platform;
-  }
-}
--- a/src/services/ProfileService.ts
+++ b/src/services/ProfileService.ts
@@ -1,105 +0,0 @@
-/**
- * @file ProfileService.ts
- * @description Service class for handling user profile operations
- * @author Matthew Raymer
- * @version 1.0.0
- */
-
-import { logger } from "../utils/logger";
-import { getHeaders } from "../libs/endorserServer";
-import type { UserProfile } from "@/types/interfaces";
-
-export class ProfileService {
-  /**
-   * Saves a user profile to the server
-   * @param activeDid - The user's active DID
-   * @param partnerApiServer - The partner API server URL
-   * @param profile - The profile data to save
-   * @returns Promise<void>
-   */
-  static async saveProfile(
-    activeDid: string,
-    partnerApiServer: string,
-    profile: Partial<UserProfile>,
-  ): Promise<void> {
-    try {
-      const headers = await getHeaders(activeDid);
-      const response = await fetch(
-        `${partnerApiServer}/api/partner/userProfile`,
-        {
-          method: "POST",
-          headers,
-          body: JSON.stringify(profile),
-        },
-      );
-
-      if (!response.ok) {
-        throw new Error(`Failed to save profile: ${response.statusText}`);
-      }
-    } catch (error) {
-      logger.error("Error saving profile:", error);
-      throw error;
-    }
-  }
-
-  /**
-   * Deletes a user profile from the server
-   * @param activeDid - The user's active DID
-   * @param partnerApiServer - The partner API server URL
-   * @returns Promise<void>
-   */
-  static async deleteProfile(
-    activeDid: string,
-    partnerApiServer: string,
-  ): Promise<void> {
-    try {
-      const headers = await getHeaders(activeDid);
-      const response = await fetch(
-        `${partnerApiServer}/api/partner/userProfile`,
-        {
-          method: "DELETE",
-          headers,
-        },
-      );
-
-      if (!response.ok) {
-        throw new Error(`Failed to delete profile: ${response.statusText}`);
-      }
-    } catch (error) {
-      logger.error("Error deleting profile:", error);
-      throw error;
-    }
-  }
-
-  /**
-   * Loads a user profile from the server
-   * @param activeDid - The user's active DID
-   * @param partnerApiServer - The partner API server URL
-   * @returns Promise<UserProfile | null>
-   */
-  static async loadProfile(
-    activeDid: string,
-    partnerApiServer: string,
-  ): Promise<UserProfile | null> {
-    try {
-      const headers = await getHeaders(activeDid);
-      const response = await fetch(
-        `${partnerApiServer}/api/partner/userProfileForIssuer/${activeDid}`,
-        { headers },
-      );
-
-      if (response.status === 404) {
-        return null;
-      }
-
-      if (!response.ok) {
-        throw new Error(`Failed to load profile: ${response.statusText}`);
-      }
-
-      return await response.json();
-    } catch (error) {
-      logger.error("Error loading profile:", error);
-      throw error;
-    }
-  }
-}
--- a/src/services/RateLimitsService.ts
+++ b/src/services/RateLimitsService.ts
@@ -1,110 +0,0 @@
-/**
- * @file RateLimitsService.ts
- * @description Service class for handling rate limit operations
- * @author Matthew Raymer
- * @version 1.0.0
- */
-
-import { logger } from "../utils/logger";
-import { getHeaders } from "../libs/endorserServer";
-import type { EndorserRateLimits, ImageRateLimits } from "../interfaces/limits";
-import axios from "axios";
-
-export class RateLimitsService {
-  /**
-   * Fetches rate limits for a given DID
-   * @param apiServer - The API server URL
-   * @param did - The user's DID
-   * @returns Promise<EndorserRateLimits>
-   */
-  static async fetchRateLimits(
-    apiServer: string,
-    did: string,
-  ): Promise<EndorserRateLimits> {
-    logger.log("Fetching rate limits for DID:", did);
-    logger.log("Using API server:", apiServer);
-
-    try {
-      const headers = await getHeaders(did);
-      const response = await axios.get(
-        `${apiServer}/api/v2/rate-limits/${did}`,
-        { headers },
-      );
-      logger.log("Rate limits response:", response.data);
-      return response.data;
-    } catch (error) {
-      if (
-        axios.isAxiosError(error) &&
-        (error.response?.status === 400 || error.response?.status === 404)
-      ) {
-        const errorData = error.response.data as {
-          error?: { message?: string; code?: string };
-        };
-        if (
-          errorData.error?.code === "UNREGISTERED_USER" ||
-          error.response?.status === 404
-        ) {
-          logger.log("User is not registered, returning default limits");
-          return {
-            doneClaimsThisWeek: "0",
-            maxClaimsPerWeek: "0",
-            nextWeekBeginDateTime: new Date().toISOString(),
-            doneRegistrationsThisMonth: "0",
-            maxRegistrationsPerMonth: "0",
-            nextMonthBeginDateTime: new Date().toISOString(),
-          };
-        }
-      }
-      logger.error("Error fetching rate limits:", error);
-      throw error;
-    }
-  }
-
-  /**
-   * Fetches image rate limits for a given DID
-   * @param apiServer - The API server URL
-   * @param activeDid - The user's active DID
-   * @returns Promise<ImageRateLimits>
-   */
-  static async fetchImageRateLimits(
-    apiServer: string,
-    activeDid: string,
-  ): Promise<ImageRateLimits> {
-    try {
-      const headers = await getHeaders(activeDid);
-      const response = await fetch(
-        `${apiServer}/api/endorser/imageRateLimits/${activeDid}`,
-        { headers },
-      );
-
-      if (!response.ok) {
-        throw new Error(
-          `Failed to fetch image rate limits: ${response.statusText}`,
-        );
-      }
-
-      return await response.json();
-    } catch (error) {
-      logger.error("Error fetching image rate limits:", error);
-      throw error;
-    }
-  }
-
-  /**
-   * Formats rate limit error messages
-   * @param error - The error object
-   * @returns string
-   */
-  static formatRateLimitError(error: unknown): string {
-    if (error instanceof Error) {
-      return error.message;
-    }
-    if (typeof error === "object" && error !== null) {
-      const err = error as {
-        response?: { data?: { error?: { message?: string } } };
-      };
-      return err.response?.data?.error?.message || "An unknown error occurred";
-    }
-    return "An unknown error occurred";
-  }
-}
--- a/src/services/platforms/capacitor/DatabaseBackupService.ts
+++ b/src/services/platforms/capacitor/DatabaseBackupService.ts
@@ -1,35 +0,0 @@
-/**
- * @file DatabaseBackupService.ts
- * @description Capacitor-specific implementation of the DatabaseBackupService
- * @author Matthew Raymer
- * @version 1.0.0
- */
-
-import { DatabaseBackupService } from "../../DatabaseBackupService";
-import { Filesystem } from "@capacitor/filesystem";
-import { Share } from "@capacitor/share";
-
-export default class CapacitorDatabaseBackupService extends DatabaseBackupService {
-  protected async handleBackup(
-    base64Data: string,
-    _arrayBuffer: ArrayBuffer,
-    _blob: Blob,
-  ): Promise<void> {
-    // Capacitor platform handling
-    const fileName = `database-backup-${new Date().toISOString()}.json`;
-    const path = `backups/${fileName}`;
-
-    await Filesystem.writeFile({
-      path,
-      data: base64Data,
-      directory: "CACHE",
-      recursive: true,
-    });
-
-    await Share.share({
-      title: "Database Backup",
-      text: "Here's your database backup",
-      url: path,
-    });
-  }
-}
--- a/src/services/platforms/electron/DatabaseBackupService.ts
+++ b/src/services/platforms/electron/DatabaseBackupService.ts
@@ -1,18 +0,0 @@
-import { DatabaseBackupService } from "../../DatabaseBackupService";
-import { dialog } from "electron";
-import * as fs from "fs";
-import * as path from "path";
-
-export default class ElectronDatabaseBackupService extends DatabaseBackupService {
-  protected async handleBackup(base64Data: string): Promise<void> {
-    const { filePath } = await dialog.showSaveDialog({
-      title: "Save Database Backup",
-      defaultPath: path.join(process.env.HOME || "", "database-backup.json"),
-      filters: [{ name: "JSON", extensions: ["json"] }],
-    });
-
-    if (filePath) {
-      fs.writeFileSync(filePath, base64Data, "base64");
-    }
-  }
-}
--- a/src/services/platforms/empty.ts
+++ b/src/services/platforms/empty.ts
@@ -1,20 +0,0 @@
-/**
- * @file empty.ts
- * @description Stub implementation for excluding platform-specific code
- * @author Matthew Raymer
- * @version 1.0.0
- */
-
-import { DatabaseBackupService } from "../DatabaseBackupService";
-
-export default class StubDatabaseBackupService extends DatabaseBackupService {
-  protected async handleBackup(
-    _base64Data: string,
-    _arrayBuffer: ArrayBuffer,
-    _blob: Blob,
-  ): Promise<void> {
-    throw new Error("This platform does not support database backups");
-  }
-}
-
-export { StubDatabaseBackupService as DatabaseBackupService };
--- a/src/services/platforms/web/DatabaseBackupService.ts
+++ b/src/services/platforms/web/DatabaseBackupService.ts
@@ -1,33 +0,0 @@
-/**
- * @file DatabaseBackupService.ts
- * @description Web-specific implementation of the DatabaseBackupService
- * @author Matthew Raymer
- * @version 1.0.0
- */
-
-import { DatabaseBackupService } from "../../DatabaseBackupService";
-import { log, error } from "../../../utils/logger";
-
-export default class WebDatabaseBackupService extends DatabaseBackupService {
-  protected async handleBackup(
-    _base64Data: string,
-    _arrayBuffer: ArrayBuffer,
-    blob: Blob,
-  ): Promise<void> {
-    try {
-      log("Starting web platform backup");
-      const url = URL.createObjectURL(blob);
-      const a = document.createElement("a");
-      a.href = url;
-      a.download = `database-backup-${new Date().toISOString()}.json`;
-      document.body.appendChild(a);
-      a.click();
-      document.body.removeChild(a);
-      URL.revokeObjectURL(url);
-      log("Web platform backup completed");
-    } catch (err) {
-      error("Error during web platform backup:", err);
-      throw err;
-    }
-  }
-}
--- a/src/types/capacitor.d.ts
+++ b/src/types/capacitor.d.ts
@@ -1,64 +0,0 @@
-/**
- * Type declarations for Capacitor modules used in the application.
- * @author Matthew Raymer
- */
-
-declare module "@capacitor/filesystem" {
-  export interface FileWriteOptions {
-    path: string;
-    data: string;
-    directory?: string;
-    encoding?: string;
-    recursive?: boolean;
-  }
-
-  export interface FileReadResult {
-    data: string;
-  }
-
-  export interface FileDeleteOptions {
-    path: string;
-    directory?: string;
-  }
-
-  export interface FilesystemDirectory {
-    Cache: "CACHE";
-    Documents: "DOCUMENTS";
-    Data: "DATA";
-    External: "EXTERNAL";
-    ExternalStorage: "EXTERNAL_STORAGE";
-  }
-
-  export interface Filesystem {
-    writeFile(options: FileWriteOptions): Promise<void>;
-    readFile(options: {
-      path: string;
-      directory?: string;
-    }): Promise<FileReadResult>;
-    deleteFile(options: FileDeleteOptions): Promise<void>;
-  }
-
-  export const Filesystem: Filesystem;
-  export const Directory: FilesystemDirectory;
-  export const Encoding: {
-    UTF8: "utf8";
-    ASCII: "ascii";
-    UTF16: "utf16";
-  };
-}
-
-declare module "@capacitor/share" {
-  export interface ShareOptions {
-    title?: string;
-    text?: string;
-    url?: string;
-    dialogTitle?: string;
-    files?: string[];
-  }
-
-  export interface Share {
-    share(options: ShareOptions): Promise<void>;
-  }
-
-  export const Share: Share;
-}
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -1,25 +1,11 @@
-/**
- * Index file for all type declarations.
- * @author Matthew Raymer
- */
-
-export * from "./interfaces";
-
-import { GiveSummaryRecord, GiveVerifiableCredential } from "interfaces";
-
-export interface GiveRecordWithContactInfo extends GiveSummaryRecord {
+export interface GiveRecordWithContactInfo {
  jwtId: string;
-  fullClaim: GiveVerifiableCredential;
+  fullClaim: unknown; // Replace with proper type
  giver: {
    known: boolean;
    displayName: string;
    profileImageUrl?: string;
  };
-  issuer: {
-    known: boolean;
-    displayName: string;
-    profileImageUrl?: string;
-  };
  receiver: {
    known: boolean;
    displayName: string;
@@ -27,6 +13,8 @@ export interface GiveRecordWithContactInfo extends GiveSummaryRecord {
  };
  providerPlanName?: string;
  recipientProjectName?: string;
-  description: string;
+  description?: string;
+  subDescription?: string;
  image?: string;
+  timestamp: string;
 }
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -1,430 +0,0 @@
-/**
- * @file interfaces.ts
- * @description Core type declarations for the TimeSafari application
- *
- * This module defines the core interfaces and types used throughout the application.
- * It serves as the central location for type definitions that are shared across
- * multiple components and services.
- *
- * Architecture:
- * 1. DID (Decentralized Identifier) Types:
- *    - IIdentifier: Core DID structure
- *    - IKey: Cryptographic key information
- *    - IService: Service endpoints and capabilities
- *
- * 2. Verifiable Credential Types:
- *    - GenericCredWrapper: Base wrapper for all credentials
- *    - GiveVerifiableCredential: Gift-related credentials
- *    - OfferVerifiableCredential: Offer-related credentials
- *    - RegisterVerifiableCredential: Registration credentials
- *
- * 3. Service Types:
- *    - EndorserService: Claims and endorsements
- *    - PushNotificationService: Web push notifications
- *    - ProfileService: User profiles
- *    - BackupService: Data backup
- *
- * @see src/interfaces/identifier.ts
- * @see src/interfaces/claims.ts
- * @see src/interfaces/limits.ts
- */
-
-import { GiveVerifiableCredential } from "../interfaces";
-
-/**
- * Interface for a Decentralized Identifier (DID)
- *
- * This interface defines the structure of a DID, which is a unique identifier
- * that can be used to look up a DID document containing information associated
- * with the DID, such as public keys and service endpoints.
- *
- * @example
- * ```typescript
- * const identifier: IIdentifier = {
- *   did: 'did:ethr:0x123...',
- *   provider: 'ethr',
- *   keys: [{
- *     kid: 'keys-1',
- *     kms: 'local',
- *     type: 'Secp256k1',
- *     publicKeyHex: '0x...',
- *     meta: { derivationPath: "m/44'/60'/0'/0/0" }
- *   }],
- *   services: [{
- *     id: 'endorser-service',
- *     type: 'EndorserService',
- *     serviceEndpoint: 'https://api.endorser.ch'
- *   }]
- * };
- * ```
- */
-export interface IIdentifier {
-  /**
-   * The DID string in the format 'did:method:identifier'
-   * @example 'did:ethr:0x123...'
-   */
-  did: string;
-
-  /**
-   * The DID method provider
-   * @example 'ethr'
-   */
-  provider: string;
-
-  /**
-   * Array of cryptographic keys associated with the DID
-   */
-  keys: Array<{
-    /**
-     * Key identifier
-     * @example 'keys-1'
-     */
-    kid: string;
-
-    /**
-     * Key management system
-     * @example 'local'
-     */
-    kms: string;
-
-    /**
-     * Key type
-     * @example 'Secp256k1'
-     */
-    type: string;
-
-    /**
-     * Public key in hexadecimal format
-     * @example '0x...'
-     */
-    publicKeyHex: string;
-
-    /**
-     * Optional metadata about the key
-     */
-    meta?: {
-      /**
-       * HD wallet derivation path
-       * @example "m/44'/60'/0'/0/0"
-       */
-      derivationPath?: string;
-
-      /**
-       * Key usage or purpose
-       * @example "signing", "encryption"
-       */
-      usage?: string;
-
-      /**
-       * Key creation timestamp
-       */
-      createdAt?: number;
-
-      /**
-       * Additional key metadata
-       */
-      [key: string]: unknown;
-    };
-  }>;
-
-  /**
-   * Array of service endpoints associated with the DID
-   */
-  services: Array<{
-    /**
-     * Service identifier
-     * @example 'endorser-service'
-     */
-    id: string;
-
-    /**
-     * Service type
-     * @example 'EndorserService'
-     */
-    type: string;
-
-    /**
-     * Service endpoint URL
-     * @example 'https://api.endorser.ch'
-     */
-    serviceEndpoint: string;
-
-    /**
-     * Optional service description
-     */
-    description?: string;
-  }>;
-
-  /**
-   * Optional metadata about the identifier
-   */
-  meta?: {
-    /**
-     * DID method-specific metadata
-     * @example { network: "mainnet", chainId: 1 } for ethr
-     */
-    method?: Record<string, unknown>;
-
-    /**
-     * Identifier creation timestamp
-     */
-    createdAt?: number;
-
-    /**
-     * Last update timestamp
-     */
-    updatedAt?: number;
-
-    /**
-     * Additional identifier metadata
-     */
-    [key: string]: unknown;
-  };
-}
-
-/**
- * Interface for a cryptographic key
- *
- * This interface defines the structure of a cryptographic key used in the
- * DID system. It includes both public and private key information, along
- * with metadata about the key's purpose and derivation.
- *
- * @example
- * ```typescript
- * const key: IKey = {
- *   id: 'did:ethr:0x123...#keys-1',
- *   type: 'Secp256k1VerificationKey2018',
- *   controller: 'did:ethr:0x123...',
- *   ethereumAddress: '0x123...',
- *   publicKeyHex: '0x...',
- *   privateKeyHex: '0x...',
- *   meta: {
- *     derivationPath: "m/44'/60'/0'/0/0"
- *   }
- * };
- * ```
- */
-export interface IKey {
-  /**
-   * Unique identifier for the key
-   * @example 'did:ethr:0x123...#keys-1'
-   */
-  id: string;
-
-  /**
-   * Key type specification
-   * @example 'Secp256k1VerificationKey2018'
-   */
-  type: string;
-
-  /**
-   * DID that controls this key
-   * @example 'did:ethr:0x123...'
-   */
-  controller: string;
-
-  /**
-   * Associated Ethereum address
-   * @example '0x123...'
-   */
-  ethereumAddress: string;
-
-  /**
-   * Public key in hexadecimal format
-   * @example '0x...'
-   */
-  publicKeyHex: string;
-
-  /**
-   * Private key in hexadecimal format
-   * @example '0x...'
-   */
-  privateKeyHex: string;
-
-  /**
-   * Optional metadata about the key
-   */
-  meta?: {
-    /**
-     * HD wallet derivation path
-     * @example "m/44'/60'/0'/0/0"
-     */
-    derivationPath?: string;
-
-    /**
-     * Key usage or purpose
-     * @example "signing", "encryption"
-     */
-    usage?: string;
-
-    /**
-     * Key creation timestamp
-     */
-    createdAt?: number;
-
-    /**
-     * Additional key metadata
-     */
-    [key: string]: unknown;
-  };
-}
-
-/**
- * Interface for a service endpoint
- *
- * This interface defines the structure of a service endpoint that can be
- * associated with a DID. Services provide additional functionality and
- * endpoints for DID operations.
- *
- * @example
- * ```typescript
- * const service: IService = {
- *   id: 'endorser-service',
- *   type: 'EndorserService',
- *   serviceEndpoint: 'https://api.endorser.ch',
- *   description: 'Service for handling claims and endorsements',
- *   metadata: {
- *     version: '1.0.0',
- *     capabilities: ['claims', 'endorsements'],
- *     config: {
- *       apiServer: 'https://api.endorser.ch'
- *     }
- *   }
- * };
- * ```
- */
-export interface IService {
-  /**
-   * Unique identifier for the service
-   * @example 'endorser-service'
-   */
-  id: string;
-
-  /**
-   * Type of service
-   * @example 'EndorserService'
-   */
-  type: string;
-
-  /**
-   * Service endpoint URL
-   * @example 'https://api.endorser.ch'
-   */
-  serviceEndpoint: string;
-
-  /**
-   * Optional human-readable description
-   */
-  description?: string;
-
-  /**
-   * Optional service metadata
-   */
-  metadata?: {
-    /**
-     * Service version
-     * @example '1.0.0'
-     */
-    version?: string;
-
-    /**
-     * Array of service capabilities
-     * @example ['claims', 'endorsements']
-     */
-    capabilities?: string[];
-
-    /**
-     * Service-specific configuration
-     */
-    config?: Record<string, unknown>;
-  };
-}
-
-export interface ExportProgress {
-  status: "preparing" | "exporting" | "complete" | "error";
-  message?: string;
-  error?: Error;
-}
-
-export interface UserProfile {
-  /** User's profile description */
-  description: string;
-  /** User's location information */
-  location?: {
-    /** Latitude coordinate */
-    lat: number;
-    /** Longitude coordinate */
-    lng: number;
-  };
-  /** User's given name */
-  givenName?: string;
-  /** User's family name */
-  familyName?: string;
-}
-
-export interface ErrorResponse {
-  error: string;
-  message: string;
-  statusCode: number;
-}
-
-export interface LeafletMouseEvent {
-  latlng: {
-    lat: number;
-    lng: number;
-  };
-}
-
-export interface GiveRecordWithContactInfo {
-  type?: string;
-  agentDid: string;
-  amount: number;
-  amountConfirmed: number;
-  description: string;
-  fullClaim: GiveVerifiableCredential;
-  fulfillsHandleId: string;
-  fulfillsPlanHandleId?: string;
-  fulfillsType?: string;
-  handleId: string;
-  issuedAt: string;
-  issuerDid: string;
-  jwtId: string;
-  providerPlanHandleId?: string;
-  recipientDid: string;
-  unit: string;
-  giver: {
-    known: boolean;
-    displayName: string;
-    profileImageUrl?: string;
-  };
-  issuer: {
-    known: boolean;
-    displayName: string;
-    profileImageUrl?: string;
-  };
-  receiver: {
-    known: boolean;
-    displayName: string;
-    profileImageUrl?: string;
-  };
-  providerPlanName?: string;
-  recipientProjectName?: string;
-  image?: string;
-}
-
-export interface TimeSafariError extends Error {
-  /**
-   * User-friendly error message
-   */
-  userMessage?: string;
-
-  /**
-   * Error code for programmatic handling
-   */
-  code?: string;
-
-  /**
-   * Additional error context
-   */
-  context?: Record<string, unknown>;
-}
--- a/src/utils/logger.ts
+++ b/src/utils/logger.ts
@@ -1,108 +1,18 @@
-import { logToDb } from "../db";
-
-function safeStringify(obj: unknown) {
-  const seen = new WeakSet();
-
-  return JSON.stringify(obj, (key, value) => {
-    // Skip Vue component instance properties
-    if (
-      value &&
-      typeof value === "object" &&
-      ("$el" in value || "$options" in value || "$parent" in value)
-    ) {
-      return "[Vue Component]";
-    }
-
-    // Handle Vue router objects
-    if (
-      value &&
-      typeof value === "object" &&
-      ("fullPath" in value || "path" in value || "name" in value)
-    ) {
-      return {
-        fullPath: value.fullPath,
-        path: value.path,
-        name: value.name,
-        params: value.params,
-        query: value.query,
-        hash: value.hash,
-      };
-    }
-
-    // Handle circular references
-    if (typeof value === "object" && value !== null) {
-      if (seen.has(value)) {
-        return "[Circular]";
-      }
-      seen.add(value);
-    }
-
-    // Handle functions
-    if (typeof value === "function") {
-      return `[Function: ${value.name || "anonymous"}]`;
-    }
-
-    return value;
-  });
-}
-
-function formatMessage(message: string, ...args: unknown[]): string {
-  const prefix = "[TimeSafari]";
-  const argsString = args.length > 0 ? " - " + safeStringify(args) : "";
-  return `${prefix} ${message}${argsString}`;
-}
-
 export const logger = {
  log: (message: string, ...args: unknown[]) => {
    if (process.env.NODE_ENV !== "production") {
-      const formattedMessage = formatMessage(message, ...args);
      // eslint-disable-next-line no-console
-      console.log(formattedMessage);
-      logToDb(message + (args.length > 0 ? " - " + safeStringify(args) : ""));
+      console.log(message, ...args);
    }
  },
  warn: (message: string, ...args: unknown[]) => {
    if (process.env.NODE_ENV !== "production") {
-      const formattedMessage = formatMessage(message, ...args);
      // eslint-disable-next-line no-console
-      console.warn(formattedMessage);
-      logToDb(message + (args.length > 0 ? " - " + safeStringify(args) : ""));
+      console.warn(message, ...args);
    }
  },
  error: (message: string, ...args: unknown[]) => {
-    const formattedMessage = formatMessage(message, ...args);
    // eslint-disable-next-line no-console
-    console.error(formattedMessage);
-    logToDb(message + (args.length > 0 ? " - " + safeStringify(args) : ""));
+    console.error(message, ...args); // Errors should always be logged
  },
 };
-
-export function log(message: string, ...args: unknown[]): void {
-  const formattedMessage = formatMessage(message, ...args);
-  // eslint-disable-next-line no-console
-  console.log(formattedMessage);
-}
-
-export function error(message: string, ...args: unknown[]): void {
-  const formattedMessage = formatMessage(message, ...args);
-  // eslint-disable-next-line no-console
-  console.error(formattedMessage);
-}
-
-export function warn(message: string, ...args: unknown[]): void {
-  const formattedMessage = formatMessage(message, ...args);
-  // eslint-disable-next-line no-console
-  console.warn(formattedMessage);
-}
-
-export function info(message: string, ...args: unknown[]): void {
-  const formattedMessage = formatMessage(message, ...args);
-  // eslint-disable-next-line no-console
-  console.info(formattedMessage);
-}
-
-export function debug(message: string, ...args: unknown[]): void {
-  const formattedMessage = formatMessage(message, ...args);
-  // eslint-disable-next-line no-console
-  console.debug(formattedMessage);
-}
--- a/src/views/AccountViewView.vue
+++ b/src/views/AccountViewView.vue
--- a/src/views/ClaimCertificateView.vue
+++ b/src/views/ClaimCertificateView.vue
@@ -5,17 +5,6 @@
        <router-link :to="'/claim/' + claimId">
          <canvas ref="claimCanvas" class="w-full block mx-auto"></canvas>
        </router-link>
-        <div class="qr-code-container">
-          <QRCodeVue
-            ref="qrCodeRef"
-            :value="qrCodeData"
-            :size="200"
-            level="H"
-            render-as="svg"
-            :margin="0"
-            :color="{ dark: '#000000', light: '#ffffff' }"
-          />
-        </div>
      </div>
    </div>
  </section>
@@ -24,17 +13,13 @@
 <script lang="ts">
 import { Component, Vue } from "vue-facing-decorator";
 import { nextTick } from "vue";
-import QRCodeVue from "qrcode.vue";
-import { NotificationIface } from "../constants/app";
+import QRCode from "qrcode";
+import { APP_SERVER, NotificationIface } from "../constants/app";
 import { db, retrieveSettingsForActiveAccount } from "../db/index";
 import * as serverUtil from "../libs/endorserServer";
 import { GenericCredWrapper, GenericVerifiableCredential } from "../interfaces";
 import { logger } from "../utils/logger";
-@Component({
-  components: {
-    QRCodeVue,
-  },
-})
+@Component
 export default class ClaimCertificateView extends Vue {
  $notify!: (notification: NotificationIface, timeout?: number) => void;

@@ -46,8 +31,6 @@ export default class ClaimCertificateView extends Vue {

  serverUtil = serverUtil;

-  private qrCodeRef: InstanceType<typeof QRCodeVue> | null = null;
-
  async created() {
    const settings = await retrieveSettingsForActiveAccount();
    this.activeDid = settings.activeDid || "";
@@ -269,23 +252,19 @@ export default class ClaimCertificateView extends Vue {
          );

          // Generate and draw QR code
-          await this.generateQRCode();
+          const qrCodeCanvas = document.createElement("canvas");
+          await QRCode.toCanvas(
+            qrCodeCanvas,
+            APP_SERVER + "/claim/" + this.claimId,
+            {
+              width: 150,
+              color: { light: "#0000" /* Transparent background */ },
+            },
+          );
+          ctx.drawImage(qrCodeCanvas, CANVAS_WIDTH * 0.6, CANVAS_HEIGHT * 0.55);
        };
      }
    }
  }
-
-  private async generateQRCode() {
-    if (!this.qrCodeRef) return;
-
-    const canvas = await this.qrCodeRef.toCanvas();
-    const ctx = canvas.getContext("2d");
-    if (!ctx) return;
-
-    // Draw the QR code on the claim canvas
-    const CANVAS_WIDTH = 1100;
-    const CANVAS_HEIGHT = 850;
-    ctx.drawImage(canvas, CANVAS_WIDTH * 0.6, CANVAS_HEIGHT * 0.55);
-  }
 }
 </script>
--- a/src/views/ClaimReportCertificateView.vue
+++ b/src/views/ClaimReportCertificateView.vue
@@ -2,17 +2,6 @@
  <section id="Content">
    <div v-if="claimData">
      <canvas ref="claimCanvas"></canvas>
-      <div class="qr-code-container">
-        <QRCodeVue
-          ref="qrCodeRef"
-          :value="qrCodeData"
-          :size="200"
-          level="H"
-          render-as="svg"
-          :margin="0"
-          :color="{ dark: '#000000', light: '#ffffff' }"
-        />
-      </div>
    </div>
  </section>
 </template>
@@ -20,19 +9,13 @@
 <script lang="ts">
 import { Component, Vue } from "vue-facing-decorator";
 import { nextTick } from "vue";
-import QRCodeVue from "qrcode.vue";
+import QRCode from "qrcode";

-import { NotificationIface } from "../constants/app";
+import { APP_SERVER, NotificationIface } from "../constants/app";
 import { db, retrieveSettingsForActiveAccount } from "../db/index";
 import * as endorserServer from "../libs/endorserServer";
-import { GenericCredWrapper, GenericVerifiableCredential } from "../interfaces";
 import { logger } from "../utils/logger";
-
-@Component({
-  components: {
-    QRCodeVue,
-  },
-})
+@Component
 export default class ClaimReportCertificateView extends Vue {
  $notify!: (notification: NotificationIface, timeout?: number) => void;

@@ -40,14 +23,10 @@ export default class ClaimReportCertificateView extends Vue {
  allMyDids: Array<string> = [];
  apiServer = "";
  claimId = "";
-  claimData: GenericCredWrapper<GenericVerifiableCredential> | null = null;
+  claimData = null;

  endorserServer = endorserServer;

-  private qrCodeRef: InstanceType<typeof QRCodeVue> | null = null;
-  private readonly CANVAS_WIDTH = 1100;
-  private readonly CANVAS_HEIGHT = 850;
-
  async created() {
    const settings = await retrieveSettingsForActiveAccount();
    this.activeDid = settings.activeDid || "";
@@ -84,12 +63,20 @@ export default class ClaimReportCertificateView extends Vue {
    }
  }

-  async drawCanvas(claimData: GenericCredWrapper<GenericVerifiableCredential>) {
+  async drawCanvas(
+    claimData: endorserServer.GenericCredWrapper<endorserServer.GenericVerifiableCredential>,
+  ) {
    await db.open();
    const allContacts = await db.contacts.toArray();

    const canvas = this.$refs.claimCanvas as HTMLCanvasElement;
    if (canvas) {
+      const CANVAS_WIDTH = 1100;
+      const CANVAS_HEIGHT = 850;
+
+      // size to approximate portrait of 8.5"x11"
+      canvas.width = CANVAS_WIDTH;
+      canvas.height = CANVAS_HEIGHT;
      const ctx = canvas.getContext("2d");
      if (ctx) {
        // Load the background image
@@ -97,13 +84,7 @@ export default class ClaimReportCertificateView extends Vue {
        backgroundImage.src = "/img/background/cert-frame-2.jpg";
        backgroundImage.onload = async () => {
          // Draw the background image
-          ctx.drawImage(
-            backgroundImage,
-            0,
-            0,
-            this.CANVAS_WIDTH,
-            this.CANVAS_HEIGHT,
-          );
+          ctx.drawImage(backgroundImage, 0, 0, CANVAS_WIDTH, CANVAS_HEIGHT);

          // Set font and styles
          ctx.fillStyle = "black";
@@ -117,8 +98,8 @@ export default class ClaimReportCertificateView extends Vue {
          const claimTypeWidth = ctx.measureText(claimTypeText).width;
          ctx.fillText(
            claimTypeText,
-            (this.CANVAS_WIDTH - claimTypeWidth) / 2, // Center horizontally
-            this.CANVAS_HEIGHT * 0.33,
+            (CANVAS_WIDTH - claimTypeWidth) / 2, // Center horizontally
+            CANVAS_HEIGHT * 0.33,
          );

          if (claimData.claim.agent) {
@@ -127,8 +108,8 @@ export default class ClaimReportCertificateView extends Vue {
            const presentedWidth = ctx.measureText(presentedText).width;
            ctx.fillText(
              presentedText,
-              (this.CANVAS_WIDTH - presentedWidth) / 2, // Center horizontally
-              this.CANVAS_HEIGHT * 0.37,
+              (CANVAS_WIDTH - presentedWidth) / 2, // Center horizontally
+              CANVAS_HEIGHT * 0.37,
            );
            const agentText = endorserServer.didInfoForCertificate(
              claimData.claim.agent,
@@ -138,8 +119,8 @@ export default class ClaimReportCertificateView extends Vue {
            const agentWidth = ctx.measureText(agentText).width;
            ctx.fillText(
              agentText,
-              (this.CANVAS_WIDTH - agentWidth) / 2, // Center horizontally
-              this.CANVAS_HEIGHT * 0.4,
+              (CANVAS_WIDTH - agentWidth) / 2, // Center horizontally
+              CANVAS_HEIGHT * 0.4,
            );
          }

@@ -154,8 +135,8 @@ export default class ClaimReportCertificateView extends Vue {
            const descriptionWidth = ctx.measureText(descriptionLine).width;
            ctx.fillText(
              descriptionLine,
-              (this.CANVAS_WIDTH - descriptionWidth) / 2,
-              this.CANVAS_HEIGHT * 0.45,
+              (CANVAS_WIDTH - descriptionWidth) / 2,
+              CANVAS_HEIGHT * 0.45,
            );
          }

@@ -168,43 +149,33 @@ export default class ClaimReportCertificateView extends Vue {
                claimData.issuer,
                allContacts,
              );
-            ctx.fillText(
-              issuerText,
-              this.CANVAS_WIDTH * 0.3,
-              this.CANVAS_HEIGHT * 0.6,
-            );
+            ctx.fillText(issuerText, CANVAS_WIDTH * 0.3, CANVAS_HEIGHT * 0.6);
          }

          // Draw claim ID
          ctx.font = "14px Arial";
-          ctx.fillText(
-            this.claimId,
-            this.CANVAS_WIDTH * 0.3,
-            this.CANVAS_HEIGHT * 0.7,
-          );
+          ctx.fillText(this.claimId, CANVAS_WIDTH * 0.3, CANVAS_HEIGHT * 0.7);
          ctx.fillText(
            "via EndorserSearch.com",
-            this.CANVAS_WIDTH * 0.3,
-            this.CANVAS_HEIGHT * 0.73,
+            CANVAS_WIDTH * 0.3,
+            CANVAS_HEIGHT * 0.73,
          );

          // Generate and draw QR code
-          await this.generateQRCode();
+          const qrCodeCanvas = document.createElement("canvas");
+          await QRCode.toCanvas(
+            qrCodeCanvas,
+            APP_SERVER + "/claim/" + this.claimId,
+            {
+              width: 150,
+              color: { light: "#0000" /* Transparent background */ },
+            },
+          );
+          ctx.drawImage(qrCodeCanvas, CANVAS_WIDTH * 0.6, CANVAS_HEIGHT * 0.55);
        };
      }
    }
  }
-
-  private async generateQRCode() {
-    if (!this.qrCodeRef) return;
-
-    const canvas = await this.qrCodeRef.toCanvas();
-    const ctx = canvas.getContext("2d");
-    if (!ctx) return;
-
-    // Draw the QR code on the report canvas
-    ctx.drawImage(canvas, this.CANVAS_WIDTH * 0.6, this.CANVAS_HEIGHT * 0.55);
-  }
 }
 </script>

@@ -215,18 +186,5 @@ canvas {
  left: 0;
  width: 100%;
  height: 100%;
-  z-index: 1;
-}
-
-.qr-code-container {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  z-index: 2;
-  display: flex;
-  justify-content: center;
-  align-items: center;
 }
 </style>
--- a/src/views/ContactGiftingView.vue
+++ b/src/views/ContactGiftingView.vue
@@ -21,7 +21,7 @@
        <h2 class="text-base flex gap-4 items-center">
          <span class="grow">
            <img
-              src="@/assets/blank-square.svg"
+              src="../assets/blank-square.svg"
              width="32"
              class="inline-block align-middle border border-slate-300 rounded-md mr-1"
            />
--- a/src/views/ContactsView.vue
+++ b/src/views/ContactsView.vue
@@ -107,7 +107,7 @@
          <button
            v-if="!showGiveNumbers"
            href=""
-            class="text-md bg-gradient-to-b shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white ml-3 px-3 py-1.5 rounded-md"
+            class="text-md bg-gradient-to-b shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white ml-2 px-1 py-1 rounded-md"
            :style="
              contactsSelected.length > 0
                ? 'background-image: linear-gradient(to bottom, #3b82f6, #1e40af);'
@@ -130,7 +130,7 @@
      <div class="w-full text-right">
        <button
          href=""
-          class="text-md bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-3 py-1.5 rounded-md"
+          class="text-md bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1 py-1 rounded-md"
          @click="toggleShowContactAmounts()"
        >
          {{
@@ -180,7 +180,14 @@
        data-testId="contactListItem"
      >
        <div class="grow overflow-hidden">
-          <div class="flex items-center gap-3">
+          <div class="flex items-center">
+            <EntityIcon
+              :contact="contact"
+              :icon-size="24"
+              class="inline-block align-text-bottom border border-slate-300 rounded cursor-pointer"
+              @click="showLargeIdenticon = contact"
+            />
+
            <input
              v-if="!showGiveNumbers"
              type="checkbox"
@@ -197,19 +204,14 @@
              "
            />

-            <EntityIcon
-              :contact="contact"
-              :icon-size="48"
-              class="inline-block align-text-bottom border border-slate-300 rounded cursor-pointer overflow-hidden"
-              @click="showLargeIdenticon = contact"
-            />
-
-            <h2 class="text-base font-semibold w-1/3 truncate flex-shrink-0">
+            <h2
+              class="text-base font-semibold ml-2 w-1/3 truncate flex-shrink-0"
+            >
              {{ contactNameNonBreakingSpace(contact.name) }}
            </h2>

            <span>
-              <div class="flex gap-2 items-center">
+              <div class="flex items-center">
                <router-link
                  :to="{
                    path: '/did/' + encodeURIComponent(contact.did),
@@ -218,79 +220,81 @@
                >
                  <font-awesome
                    icon="circle-info"
-                    class="text-xl text-blue-500"
+                    class="text-xl text-blue-500 ml-4"
                  />
                </router-link>

-                <span class="text-sm overflow-hidden">{{
+                <span class="ml-4 text-sm overflow-hidden">{{
                  libsUtil.shortDid(contact.did)
                }}</span>
              </div>
-              <div class="text-sm">
+              <div class="ml-4 text-sm">
                {{ contact.notes }}
              </div>
            </span>
          </div>
-          <div
-            v-if="showGiveNumbers && contact.did != activeDid"
-            class="ml-auto flex gap-1.5 mt-2"
-          >
-            <button
-              class="text-sm bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-1.5 rounded-l-md"
-              :title="givenToMeDescriptions[contact.did] || ''"
-              @click="confirmShowGiftedDialog(contact.did, activeDid)"
+          <div id="ContactActions" class="flex gap-1.5 mt-2">
+            <div
+              v-if="showGiveNumbers && contact.did != activeDid"
+              class="ml-auto flex gap-1.5"
            >
-              From:
-              <br />
-              {{
-                /* eslint-disable prettier/prettier */
-                showGiveTotals
-                  ? ((givenToMeConfirmed[contact.did] || 0)
-                      + (givenToMeUnconfirmed[contact.did] || 0))
-                  : showGiveConfirmed
-                      ? (givenToMeConfirmed[contact.did] || 0)
-                      : (givenToMeUnconfirmed[contact.did] || 0)
-                /* eslint-enable prettier/prettier */
-              }}
-            </button>
+              <button
+                class="text-sm bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-1.5 rounded-l-md"
+                :title="givenToMeDescriptions[contact.did] || ''"
+                @click="confirmShowGiftedDialog(contact.did, activeDid)"
+              >
+                From:
+                <br />
+                {{
+                  /* eslint-disable prettier/prettier */
+                  showGiveTotals
+                    ? ((givenToMeConfirmed[contact.did] || 0)
+                        + (givenToMeUnconfirmed[contact.did] || 0))
+                    : showGiveConfirmed
+                        ? (givenToMeConfirmed[contact.did] || 0)
+                        : (givenToMeUnconfirmed[contact.did] || 0)
+                  /* eslint-enable prettier/prettier */
+                }}
+              </button>

-            <button
-              class="text-sm bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white -ml-1.5 px-2 py-1.5 rounded-r-md border-l"
-              :title="givenByMeDescriptions[contact.did] || ''"
-              @click="confirmShowGiftedDialog(activeDid, contact.did)"
-            >
-              To:
-              <br />
-              {{
-                /* eslint-disable prettier/prettier */
-                showGiveTotals
-                  ? ((givenByMeConfirmed[contact.did] || 0)
-                    + (givenByMeUnconfirmed[contact.did] || 0))
-                  : showGiveConfirmed
-                      ? (givenByMeConfirmed[contact.did] || 0)
-                      : (givenByMeUnconfirmed[contact.did] || 0)
-                /* eslint-enable prettier/prettier */
-              }}
-            </button>
+              <button
+                class="text-sm bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white -ml-1.5 px-2 py-1.5 rounded-r-md border-l"
+                :title="givenByMeDescriptions[contact.did] || ''"
+                @click="confirmShowGiftedDialog(activeDid, contact.did)"
+              >
+                To:
+                <br />
+                {{
+                  /* eslint-disable prettier/prettier */
+                  showGiveTotals
+                    ? ((givenByMeConfirmed[contact.did] || 0)
+                      + (givenByMeUnconfirmed[contact.did] || 0))
+                    : showGiveConfirmed
+                        ? (givenByMeConfirmed[contact.did] || 0)
+                        : (givenByMeUnconfirmed[contact.did] || 0)
+                  /* eslint-enable prettier/prettier */
+                }}
+              </button>

-            <button
-              class="text-sm bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-1.5 rounded-md border border-blue-400"
-              data-testId="offerButton"
-              @click="openOfferDialog(contact.did, contact.name)"
-            >
-              Offer
-            </button>
+              <button
+                class="text-sm bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-1.5 rounded-md border border-blue-400"
+                data-testId="offerButton"
+                @click="openOfferDialog(contact.did, contact.name)"
+              >
+                Offer
+              </button>

-            <router-link
-              :to="{
-                name: 'contact-amounts',
-                query: { contactDid: contact.did },
-              }"
-              class="text-sm bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-1.5 rounded-md border border-slate-400"
-              title="See more given activity"
-            >
-              <fa icon="file-lines" class="fa-fw" />
-            </router-link>
+              <router-link
+                :to="{
+                  name: 'contact-amounts',
+                  query: { contactDid: contact.did },
+                }"
+                class="text-sm bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-1.5 rounded-md border border-slate-400"
+                title="See more given activity"
+              >
+                <font-awesome icon="file-lines" class="fa-fw" />
+              </router-link>
+            </div>
          </div>
        </div>
      </li>
@@ -313,7 +317,7 @@
      <button
        v-if="!showGiveNumbers"
        href=""
-        class="text-md bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white ml-3 px-3 py-1.5 rounded-md"
+        class="text-md bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white ml-2 px-1 py-1 rounded-md"
        :style="
          contactsSelected.length > 0
            ? 'background-image: linear-gradient(to bottom, #3b82f6, #1e40af);'
--- a/src/views/HelpView.vue
+++ b/src/views/HelpView.vue
@@ -484,13 +484,13 @@
        <a href="http://creativecommons.org/publicdomain/zero/1.0?ref=chooser-v1" target="_blank" rel="license noopener noreferrer">
          <span class="text-blue-500 mr-1">CC0 1.0</span>
          <img
-              src="@/assets/help/creative-commons-circle.svg"
+              src="../assets/help/creative-commons-circle.svg"
              alt="CC circle"
              width="20"
              class="display: inline"
          />
          <img
-              src="@/assets/help/creative-commons-zero.svg"
+              src="../assets/help/creative-commons-zero.svg"
              alt="CC zero"
              width="20"
              style="display: inline"
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
--- a/src/views/ProjectViewView.vue
+++ b/src/views/ProjectViewView.vue
@@ -220,7 +220,7 @@
        </li>
        <li @click="openGiftDialogToProject()">
          <img
-            src="@/assets/blank-square.svg"
+            src="../assets/blank-square.svg"
            class="mx-auto border border-blue-300 rounded-md mb-1 cursor-pointer"
          />
          <h3
@@ -266,7 +266,7 @@
          <div class="text-center">
            <button
              data-testId="offerButton"
-              class="block w-full bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-3 py-1.5 text-sm leading-tight rounded-md"
+              class="block w-full bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1 rounded-md"
              @click="openOfferDialog()"
            >
              Offer to this (maybe with conditions)...
@@ -353,7 +353,7 @@
        <div v-if="activeDid && isRegistered">
          <div class="text-center">
            <button
-              class="block w-full bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-3 py-1.5 text-sm leading-tight rounded-md"
+              class="block w-full bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1rounded-md"
              @click="openGiftDialogToProject()"
            >
              Given To This...
@@ -511,7 +511,7 @@
        <div v-if="activeDid && isRegistered">
          <div class="text-center">
            <button
-              class="block w-full bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-3 py-1.5 text-sm leading-tight rounded-md"
+              class="block w-full bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1 rounded-md"
              @click="openGiftDialogFromProject()"
            >
              Given By This...
--- a/src/views/ProjectsView.vue
+++ b/src/views/ProjectsView.vue
@@ -239,7 +239,7 @@
          class="border-b border-slate-300"
        >
          <a
-            class="block py-4 flex gap-4 cursor-pointer"
+            class="block py-4 flex gap-4"
            @click="onClickLoadProject(project.handleId)"
          >
            <div class="flex-none">
@@ -279,8 +279,13 @@ import ProjectIcon from "../components/ProjectIcon.vue";
 import TopMessage from "../components/TopMessage.vue";
 import UserNameDialog from "../components/UserNameDialog.vue";
 import { Contact } from "../db/tables/contacts";
-import { didInfo, getHeaders, getPlanFromCache } from "../libs/endorserServer";
-import { OfferSummaryRecord, PlanData } from "../interfaces/records";
+import {
+  didInfo,
+  getHeaders,
+  getPlanFromCache,
+  OfferSummaryRecord,
+  PlanData,
+} from "../libs/endorserServer";
 import * as libsUtil from "../libs/util";
 import { OnboardPage } from "../libs/util";
 import { logger } from "../utils/logger";
--- a/test-playwright/00-noid-tests.spec.ts
+++ b/test-playwright/00-noid-tests.spec.ts
@@ -74,30 +74,13 @@ import { deleteContact, generateAndRegisterEthrUser, importUser } from './testUt
 test('Check activity feed - check that server is running', async ({ page }) => {
  // Load app homepage
  await page.goto('./');
-  
-  // Wait for and dismiss onboarding dialog, with retry logic
-  const closeOnboarding = async () => {
-    const closeButton = page.getByTestId('closeOnboardingAndFinish');
-    if (await closeButton.isVisible()) {
-      await closeButton.click();
-      await expect(closeButton).toBeHidden();
-    }
-  };
+  await page.getByTestId('closeOnboardingAndFinish').click();

-  // Initial dismissal
-  await closeOnboarding();
-  
-  // Wait for network to be idle
-  await page.waitForLoadState('networkidle');
-  
-  // Check and dismiss onboarding again if it reappeared
-  await closeOnboarding();
-
-  // Wait for initial feed items to load
+  // Check that initial 10 activities have been loaded
  await expect(page.locator('ul#listLatestActivity li:nth-child(10)')).toBeVisible();
-  
+
  // Scroll down a bit to trigger loading additional activities
-  await page.locator('ul#listLatestActivity li:nth-child(20)').scrollIntoViewIfNeeded();
+  await page.locator('ul#listLatestActivity li:nth-child(50)').scrollIntoViewIfNeeded();
 });

 test('Check discover results', async ({ page }) => {
@@ -121,11 +104,8 @@ test('Check no-ID messaging in account', async ({ page }) => {
  // Check 'a friend needs to register you' notice
  await expect(page.locator('#noticeBeforeAnnounce')).toBeVisible();

-  // Check that there is no ID by finding the wrapper first
-  const didWrapper = page.locator('[data-testId="didWrapper"]');
-  await expect(didWrapper).toBeVisible();
-  const codeElement = didWrapper.locator('code[role="code"]');
-  await expect(codeElement).toBeEmpty();
+  // Check that there is no ID
+  await expect(page.locator('#sectionIdentityDetails code.truncate')).toBeEmpty();
 });

 test('Check ability to share contact', async ({ page }) => {
@@ -189,14 +169,7 @@ test('Check setting name & sharing info', async ({ page }) => {
 test('Confirm test API setting (may fail if you are running your own Time Safari)', async ({ page }, testInfo) => {
  // Load account view
  await page.goto('./account');
-  
-  // Wait for and click the Advanced heading
-  const advancedHeading = page.getByRole('heading', { name: 'Advanced' });
-  await advancedHeading.waitFor({ state: 'visible' });
-  await advancedHeading.click();
-
-  // Wait for the Advanced section to be fully loaded
-  await page.waitForLoadState('networkidle');
+  await page.getByRole('heading', { name: 'Advanced' }).click();

  // look into the config file: if it starts Time Safari, it might say which server it should set by default
  const webServer = testInfo.config.webServer;
@@ -205,12 +178,8 @@ test('Confirm test API setting (may fail if you are running your own Time Safari
  const endorserTerm = endorserWords?.find(word => word.startsWith(ENDORSER_ENV_NAME + '='));
  const endorserTermInConfig = endorserTerm?.substring(ENDORSER_ENV_NAME.length + 1);

-  // Find the Claim Server input field using the label's for attribute
-  const serverInput = page.locator('input[type="text"]').first();
-  await serverInput.waitFor({ state: 'visible' });
-  
-  const endorserServer = endorserTermInConfig || 'https://api.endorser.ch';
-  await expect(serverInput).toHaveValue(endorserServer);
+  const endorserServer = endorserTermInConfig || 'https://test-api.endorser.ch';
+  await expect(page.getByRole('textbox').nth(1)).toHaveValue(endorserServer);
 });

 test('Check User 0 can register a random person', async ({ page }) => {
--- a/test-playwright/30-record-gift.spec.ts
+++ b/test-playwright/30-record-gift.spec.ts
@@ -109,11 +109,7 @@ test('Record something given', async ({ page }) => {

  // Refresh home view and check gift
  await page.goto('./');
-  await page.locator('li')
-    .filter({ hasText: finalTitle })
-    .locator('a.cursor-pointer')
-    .filter({ hasText: finalTitle })
-    .click();
+  await page.locator('li').filter({ hasText: finalTitle }).locator('a').click();
  await expect(page.getByRole('heading', { name: 'Verifiable Claim Details' })).toBeVisible();
  await expect(page.getByText(finalTitle, { exact: true })).toBeVisible();
  const page1Promise = page.waitForEvent('popup');
--- a/test-playwright/33-record-gift-x10.spec.ts
+++ b/test-playwright/33-record-gift-x10.spec.ts
@@ -88,8 +88,12 @@ import { test, expect } from '@playwright/test';
 import { importUser, createUniqueStringsArray, createRandomNumbersArray  } from './testUtils';

 test('Record 9 new gifts', async ({ page }) => {
-  const giftCount = 9;
+  const giftCount = 9; // because 10 has taken us above 30 seconds
+
+  // Standard text
  const standardTitle = 'Gift ';
+
+  // Field value arrays
  const finalTitles = [];
  const finalNumbers = [];

@@ -97,19 +101,21 @@ test('Record 9 new gifts', async ({ page }) => {
  const uniqueStrings = await createUniqueStringsArray(giftCount);
  const randomNumbers = await createRandomNumbersArray(giftCount);

-  // Populate arrays
+  // Populate array with titles
  for (let i = 0; i < giftCount; i++) {
-    finalTitles.push(standardTitle + uniqueStrings[i]);
-    finalNumbers.push(randomNumbers[i]);
+    let loopTitle = standardTitle + uniqueStrings[i];
+    finalTitles.push(loopTitle);
+    let loopNumber = randomNumbers[i];
+    finalNumbers.push(loopNumber);
  }

  // Import user 00
  await importUser(page, '00');

-  // Record new gifts with optimized waiting
+  // Record new gifts
  for (let i = 0; i < giftCount; i++) {
-    // Record gift
-    await page.goto('./', { waitUntil: 'networkidle' });
+    // Record something given
+    await page.goto('./');
    if (i === 0) {
      await page.getByTestId('closeOnboardingAndFinish').click();
    }
@@ -117,16 +123,11 @@ test('Record 9 new gifts', async ({ page }) => {
    await page.getByPlaceholder('What was given').fill(finalTitles[i]);
    await page.getByRole('spinbutton').fill(finalNumbers[i].toString());
    await page.getByRole('button', { name: 'Sign & Send' }).click();
-    
-    // Wait for success and dismiss
    await expect(page.getByText('That gift was recorded.')).toBeVisible();
-    await page.locator('div[role="alert"] button > svg.fa-xmark').click();
+    await page.locator('div[role="alert"] button > svg.fa-xmark').click(); // dismiss info alert

-    // Verify gift in list with network idle wait
-    await page.goto('./', { waitUntil: 'networkidle' });
-    await expect(page.locator('ul#listLatestActivity li')
-      .filter({ hasText: finalTitles[i] })
-      .first())
-      .toBeVisible({ timeout: 10000 });
+    // Refresh home view and check gift
+    await page.goto('./');
+    await expect(page.locator('li').filter({ hasText: finalTitles[i] })).toBeVisible();
  }
 });
--- a/test-playwright/test-playwright/test-results/.last-run.json
+++ b/test-playwright/test-playwright/test-results/.last-run.json
@@ -1,4 +0,0 @@
-{
-  "status": "failed",
-  "failedTests": []
-}
--- a/test-playwright/test-results/.last-run.json
+++ b/test-playwright/test-results/.last-run.json
@@ -1,29 +0,0 @@
-{
-  "status": "failed",
-  "failedTests": [
-    "a29eb57667e0fb28c7e9-7a80e551e7f16a766d0d",
-    "a29eb57667e0fb28c7e9-1a8c76601bb6ea4f735c",
-    "a29eb57667e0fb28c7e9-0a3670fa77fcd5ac9827",
-    "a29eb57667e0fb28c7e9-90c8866cf70c7f96647d",
-    "a29eb57667e0fb28c7e9-4abc584edcf7a6a12389",
-    "a29eb57667e0fb28c7e9-3b443656a23fd8e7eb76",
-    "a29eb57667e0fb28c7e9-1f63cf7a41b756ffe01f",
-    "a29eb57667e0fb28c7e9-4eb03633761e58eac0a4",
-    "db48a48c514e3e2940e5-cef25040a0b285eed2ba",
-    "1c818805c9b0ac973736-726f18ba6163d57238c8",
-    "c52ae54d86eda05904f3-adf7525a07e75f4e3cc2",
-    "2fac21b9c9c3eb062631-9d2d2e9a199603c11b9b",
-    "64242279fe0133650483-20fbacc4e45c5561df6c",
-    "a7ff64a290be94f9d82c-e26ceb13031dafad1133",
-    "868977083268005e6ec0-c27d226d34e20ba4863d",
-    "5e149db5da4a5e319bcc-3298c84d0ebfff5e6d7c",
-    "5e149db5da4a5e319bcc-1981ba81641b6000f80b",
-    "2b5f6d3352de2040032d-bf5ed3a9483d90c396dd",
-    "2b5f6d3352de2040032d-6f52c3699c55c19ccad8",
-    "2b5f6d3352de2040032d-0f478a3208f64651daa1",
-    "2b5f6d3352de2040032d-a05f542cad739ee3b5b9",
-    "955bdfdfe05b442c0f5d-a9ec2b8bc7bd90ea0439",
-    "955bdfdfe05b442c0f5d-2c38171f673436923a8b",
-    "1a1fd29d3f0573e705e6-a3a6805908fe9a29ab11"
-  ]
-}
--- a/test-scripts/requirements.txt
+++ b/test-scripts/requirements.txt
@@ -8,4 +8,5 @@ web3>=6.0.0          # For Ethereum interaction
 eth-utils>=2.1.0     # For Ethereum utilities
 pyjwt>=2.8.0        # For JWT operations
 cryptography>=42.0.0  # For key format conversion
-jwcrypto
+jwcrypto
+setuptools
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -18,8 +18,7 @@
 			"@/db/*": ["db/*"],
 			"@/libs/*": ["libs/*"],
 			"@/constants/*": ["constants/*"],
-			"@/store/*": ["store/*"],
-			"@/types/*": ["types/*"]
+			"@/store/*": ["store/*"]
 		},
 		"lib": ["ES2020", "dom", "dom.iterable"], // Include typings for ES2020 and DOM APIs
 	},
--- a/vite.config.base.ts
+++ b/vite.config.base.ts
@@ -1,46 +0,0 @@
-import { defineConfig } from "vite";
-import vue from "@vitejs/plugin-vue";
-import path from "path";
-
-export default defineConfig({
-  plugins: [vue()],
-  resolve: {
-    alias: {
-      '@': path.resolve(__dirname, './src'),
-      'nostr-tools': path.resolve(__dirname, 'node_modules/nostr-tools'),
-      'nostr-tools/nip06': path.resolve(__dirname, 'node_modules/nostr-tools/nip06'),
-      'nostr-tools/core': path.resolve(__dirname, 'node_modules/nostr-tools/core'),
-      stream: 'stream-browserify',
-      util: 'util',
-      crypto: 'crypto-browserify'
-    },
-    mainFields: ['module', 'jsnext:main', 'jsnext', 'main'],
-  },
-  optimizeDeps: {
-    include: ['nostr-tools', 'nostr-tools/nip06', 'nostr-tools/core'],
-    esbuildOptions: {
-      define: {
-        global: 'globalThis'
-      }
-    }
-  },
-  build: {
-    sourcemap: true,
-    target: 'esnext',
-    chunkSizeWarningLimit: 1000,
-    commonjsOptions: {
-      include: [/node_modules/],
-      transformMixedEsModules: true
-    },
-    rollupOptions: {
-      external: ['stream', 'util', 'crypto'],
-      output: {
-        globals: {
-          stream: 'stream',
-          util: 'util',
-          crypto: 'crypto'
-        }
-      }
-    }
-  }
-}); 
--- a/vite.config.common.mts
+++ b/vite.config.common.mts
@@ -36,15 +36,7 @@ export async function createBuildConfig(mode: string) {
      assetsDir: 'assets',
      chunkSizeWarningLimit: 1000,
      rollupOptions: {
-        external: isCapacitor ? ['@capacitor/app'] : [],
-        output: {
-          assetFileNames: (assetInfo) => {
-            if (assetInfo.name?.endsWith('.svg')) {
-              return 'assets/[name][extname]';
-            }
-            return 'assets/[name]-[hash][extname]';
-          }
-        }
+        external: isCapacitor ? ['@capacitor/app'] : []
      }
    },
    define: {
@@ -52,8 +44,6 @@ export async function createBuildConfig(mode: string) {
      'process.env.VITE_PLATFORM': JSON.stringify(mode),
      'process.env.VITE_PWA_ENABLED': JSON.stringify(!(isElectron || isPyWebView || isCapacitor)),
      __dirname: isElectron ? JSON.stringify(process.cwd()) : '""',
-      'process.env.VITE_ASSET_URL': JSON.stringify(isCapacitor ? './assets/' : '/assets/'),
-      'process.env.VITE_BASE_URL': JSON.stringify(isCapacitor ? './' : '/')
    },
    resolve: {
      alias: {
--- a/vite.config.dev.mts.timestamp-1743747195916-245e61245d5ec.mjs
+++ b/vite.config.dev.mts.timestamp-1743747195916-245e61245d5ec.mjs
--- a/vite.config.electron.mts
+++ b/vite.config.electron.mts
@@ -24,6 +24,25 @@ export default defineConfig(async () => {
          };
        }
      }
-    }]
+    }],
+    build: {
+      outDir: 'dist-electron',
+      emptyOutDir: true,
+      rollupOptions: {
+        output: {
+          manualChunks: {
+            vendor: ['vue', 'vue-router', 'pinia']
+          }
+        }
+      },
+      assetsDir: 'assets',
+      minify: 'terser',
+      terserOptions: {
+        compress: {
+          drop_console: false,
+        },
+      },
+    },
+    base: './',
  });
 }); 
--- a/vite.config.mobile.ts
+++ b/vite.config.mobile.ts
@@ -1,28 +0,0 @@
-import { defineConfig, loadEnv } from "vite";
-import baseConfig from "./vite.config.base";
-
-export default defineConfig(({ mode }) => {
-  const env = loadEnv(mode, process.cwd(), '');
-  
-  return {
-    ...baseConfig,
-    define: {
-      'import.meta.env.VITE_PLATFORM': JSON.stringify('mobile'),
-    },
-    build: {
-      ...baseConfig.build,
-      outDir: 'dist/mobile',
-      rollupOptions: {
-        ...baseConfig.build.rollupOptions,
-        output: {
-          ...baseConfig.build.rollupOptions.output,
-          manualChunks: {
-            // Mobile-specific chunk splitting
-            vendor: ['vue', 'vue-router', 'pinia'],
-            capacitor: ['@capacitor/core', '@capacitor/filesystem', '@capacitor/share'],
-          }
-        }
-      }
-    }
-  };
-}); 
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,18 +1,46 @@
-import { defineConfig, loadEnv } from "vite";
-import baseConfig from "./vite.config.base";
+import { defineConfig } from "vite";
+import vue from "@vitejs/plugin-vue";
+import path from "path";

-// https://vitejs.dev/config/
-export default defineConfig(({ mode }) => {
-  // Load env file based on `mode` in the current working directory.
-  // Set the third parameter to '' to load all env regardless of the `VITE_` prefix.
-  const env = loadEnv(mode, process.cwd(), '');
-  const platform = env.PLATFORM || 'web';
-  
-  // Load platform-specific config
-  const platformConfig = require(`./vite.config.${platform}`).default;
-  
-  return {
-    ...baseConfig,
-    ...platformConfig,
-  };
+export default defineConfig({
+  plugins: [vue()],
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src'),
+      'nostr-tools': path.resolve(__dirname, 'node_modules/nostr-tools'),
+      'nostr-tools/nip06': path.resolve(__dirname, 'node_modules/nostr-tools/nip06'),
+      'nostr-tools/core': path.resolve(__dirname, 'node_modules/nostr-tools/core'),
+      stream: 'stream-browserify',
+      util: 'util',
+      crypto: 'crypto-browserify'
+    },
+    mainFields: ['module', 'jsnext:main', 'jsnext', 'main'],
+  },
+  optimizeDeps: {
+    include: ['nostr-tools', 'nostr-tools/nip06', 'nostr-tools/core'],
+    esbuildOptions: {
+      define: {
+        global: 'globalThis'
+      }
+    }
+  },
+  build: {
+    sourcemap: true,
+    target: 'esnext',
+    chunkSizeWarningLimit: 1000,
+    commonjsOptions: {
+      include: [/node_modules/],
+      transformMixedEsModules: true
+    },
+    rollupOptions: {
+      external: ['stream', 'util', 'crypto'],
+      output: {
+        globals: {
+          stream: 'stream',
+          util: 'util',
+          crypto: 'crypto'
+        }
+      }
+    }
+  }
 }); 
--- a/vite.config.web.mts
+++ b/vite.config.web.mts
@@ -1,92 +1,27 @@
-/**
- * @file vite.config.web.mts
- * @description Vite configuration for web platform builds
- * 
- * This configuration file defines how the application is built for web platforms.
- * It extends the base configuration with web-specific settings and optimizations.
- * 
- * Build Process Integration:
- * 1. Configuration Loading:
- *    - Loads environment variables based on build mode
- *    - Merges base configuration from vite.config.common.mts
- *    - Loads application-specific configuration
- * 
- * 2. Platform Definition:
- *    - Sets VITE_PLATFORM environment variable to 'web'
- *    - Used by PlatformServiceFactory to load web-specific implementations
- * 
- * 3. Build Output:
- *    - Outputs to 'dist/web' directory
- *    - Creates vendor chunk for Vue-related dependencies
- *    - Enables PWA features with auto-update capability
- * 
- * 4. Development vs Production:
- *    - Development: Enables source maps and development features
- *    - Production: Optimizes chunks and enables PWA features
- * 
- * Usage:
- * - Development: npm run dev
- * - Production: npm run build:web
- * 
- * @see vite.config.common.mts
- * @see vite.config.utils.mts
- * @see PlatformServiceFactory.ts
- */
+import { defineConfig, mergeConfig } from "vite";
+import { VitePWA } from "vite-plugin-pwa";
+import { createBuildConfig } from "./vite.config.common.mts";
+import { loadAppConfig } from "./vite.config.utils.mts";

-import { defineConfig } from "vite";
-import vue from "@vitejs/plugin-vue";
-import baseConfig from "./vite.config.base";
+export default defineConfig(async () => {
+  const baseConfig = await createBuildConfig('web');
+  const appConfig = await loadAppConfig();

-// Define Node.js built-in modules that need browser compatibility
-const nodeBuiltins = {
-  stream: 'stream-browserify',
-  util: 'util',
-  crypto: 'crypto-browserify',
-  http: 'stream-http',
-  https: 'https-browserify',
-  zlib: 'browserify-zlib',
-  url: 'url',
-  assert: 'assert',
-  path: 'path-browserify',
-  fs: 'browserify-fs',
-  tty: 'tty-browserify'
-};
-
-export default defineConfig({
-  ...baseConfig,
-  plugins: [vue()],
-  optimizeDeps: {
-    ...baseConfig.optimizeDeps,
-    include: [...(baseConfig.optimizeDeps?.include || []), 'qrcode.vue'],
-    exclude: Object.keys(nodeBuiltins),
-    esbuildOptions: {
-      define: {
-        global: 'globalThis'
-      }
-    }
-  },
-  resolve: {
-    ...baseConfig.resolve,
-    alias: {
-      ...baseConfig.resolve?.alias,
-      ...nodeBuiltins
-    }
-  },
-  build: {
-    ...baseConfig.build,
-    commonjsOptions: {
-      ...baseConfig.build?.commonjsOptions,
-      include: [/node_modules/],
-      exclude: [/src\/services\/platforms\/electron/],
-      transformMixedEsModules: true
-    },
-    rollupOptions: {
-      ...baseConfig.build?.rollupOptions,
-      external: Object.keys(nodeBuiltins),
-      output: {
-        ...baseConfig.build?.rollupOptions?.output,
-        globals: nodeBuiltins
-      }
-    }
-  }
+  return mergeConfig(baseConfig, {
+    plugins: [
+      VitePWA({
+        registerType: 'autoUpdate',
+        manifest: appConfig.pwaConfig?.manifest,
+        devOptions: {
+          enabled: false
+        },
+        workbox: {
+          cleanupOutdatedCaches: true,
+          skipWaiting: true,
+          clientsClaim: true,
+          sourcemap: true
+        }
+      })
+    ]
+  });
 });