WIP: QuickNav notification badges

- Cleanup of unused mockups
- Minor tweaks

.cursor/rules/development/development_guide.mdc

@@ -2,8 +2,9 @@
 globs: **/src/**/*
 alwaysApply: false
 ---
-✅ use system date command to timestamp all documentation with accurate date and
+✅ use system date command to timestamp all interactions with accurate date and
   time
+✅ python script files must always have a blank line at their end
 ✅ remove whitespace at the end of lines
 ✅ use npm run lint-fix to check for warnings
 ✅ do not use npm run dev let me handle running and supplying feedback
@@ -21,10 +22,12 @@ alwaysApply: false
 
 - [ ] **Timestamp Usage**: Include accurate timestamps in all interactions
 - [ ] **Code Quality**: Use npm run lint-fix to check for warnings
+- [ ] **File Standards**: Ensure Python files have blank line at end
 - [ ] **Whitespace**: Remove trailing whitespace from all lines
 
 ### After Development
 
 - [ ] **Linting Check**: Run npm run lint-fix to verify code quality
+- [ ] **File Validation**: Confirm Python files end with blank line
 - [ ] **Whitespace Review**: Verify no trailing whitespace remains
 - [ ] **Documentation**: Update relevant documentation with changes

.husky/pre-commit

@@ -9,10 +9,6 @@ echo "🔍 Running pre-commit hooks..."
 
 # Run lint-fix first
 echo "📝 Running lint-fix..."
-
-# Capture git status before lint-fix to detect changes
-git_status_before=$(git status --porcelain)
-
 npm run lint-fix || {
     echo
     echo "❌ Linting failed. Please fix the issues and try again."
@@ -22,36 +18,6 @@ npm run lint-fix || {
     exit 1
 }
 
-# Check if lint-fix made any changes
-git_status_after=$(git status --porcelain)
-
-if [ "$git_status_before" != "$git_status_after" ]; then
-    echo
-    echo "⚠️  lint-fix made changes to your files!"
-    echo "📋 Changes detected:"
-    git diff --name-only
-    echo
-    echo "❓ What would you like to do?"
-    echo "   [c] Continue commit without the new changes"
-    echo "   [a] Abort commit (recommended - review and stage the changes)"
-    echo
-    printf "Choose [c/a]: "
-    # The `< /dev/tty` is necessary to make read work in git's non-interactive shell
-    read choice < /dev/tty
-    
-    case $choice in
-        [Cc]* )
-            echo "✅ Continuing commit without lint-fix changes..."
-            sleep 3
-            ;;
-        [Aa]* | * )
-            echo "🛑 Commit aborted. Please review the changes made by lint-fix."
-            echo "💡 You can stage the changes with 'git add .' and commit again."
-            exit 1
-            ;;
-    esac
-fi
-
 # Then run Build Architecture Guard
 
 #echo "🏗️  Running Build Architecture Guard..."

BUILDING.md

@@ -1151,28 +1151,28 @@ If you need to build manually or want to understand the individual steps:
 
 - ... and you may have to fix these, especially with pkgx:
 
-```bash
-gem_path=$(which gem)
-shortened_path="${gem_path:h:h}"
-export GEM_HOME=$shortened_path
-export GEM_PATH=$shortened_path
-```
+   ```bash
+   gem_path=$(which gem)
+   shortened_path="${gem_path:h:h}"
+   export GEM_HOME=$shortened_path
+   export GEM_PATH=$shortened_path
+   ```
 
-##### 1. Bump the version in package.json for `MARKETING_VERSION`, then `grep CURRENT_PROJECT_VERSION ios/App/App.xcodeproj/project.pbxproj` and add 1 for the numbered version;
+##### 1. Bump the version in package.json, then here
 
-```bash
-cd ios/App && xcrun agvtool new-version 48 && perl -p -i -e "s/MARKETING_VERSION = .*;/MARKETING_VERSION = 1.1.3;/g" App.xcodeproj/project.pbxproj && cd -
-# Unfortunately this edits Info.plist directly.
-#xcrun agvtool new-marketing-version 0.4.5
-```
+   ```bash
+   cd ios/App && xcrun agvtool new-version 40 && perl -p -i -e "s/MARKETING_VERSION = .*;/MARKETING_VERSION = 1.0.7;/g" App.xcodeproj/project.pbxproj && cd -
+   # Unfortunately this edits Info.plist directly.
+   #xcrun agvtool new-marketing-version 0.4.5
+   ```
 
 ##### 2. Build
 
-Here's prod. Also available: test, dev
+  Here's prod. Also available: test, dev
 
-```bash
-npm run build:ios:prod
-```
+  ```bash
+  npm run build:ios:prod
+  ```
 
 3.1. Use Xcode to build and run on simulator or device.
 
@@ -1197,8 +1197,7 @@ npm run build:ios:prod
   - It can take 15 minutes for the build to show up in the list of builds.
   - You'll probably have to "Manage" something about encryption, disallowed in France.
   - Then "Save" and "Add to Review" and "Resubmit to App Review".
-- Eventually it'll be "Ready for Distribution" which means it's live
-- When finished, bump package.json version
+- Eventually it'll be "Ready for Distribution" which means
 
 ### Android Build
 
@@ -1304,8 +1303,8 @@ The recommended way to build for Android is using the automated build script:
 # Standard build and open Android Studio
 ./scripts/build-android.sh
 
-# Build with specific version numbers -- doesn't change source files
-#./scripts/build-android.sh --version 1.1.3 --build-number 48
+# Build with specific version numbers
+./scripts/build-android.sh --version 1.0.3 --build-number 35
 
 # Build without opening Android Studio (for CI/CD)
 ./scripts/build-android.sh --no-studio
@@ -1316,26 +1315,26 @@ The recommended way to build for Android is using the automated build script:
 
 #### Android Manual Build Process
 
-##### 1. Bump the version in package.json, then update these versions & run:
+##### 1. Bump the version in package.json, then here: android/app/build.gradle
 
-```bash
-perl -p -i -e 's/versionCode .*/versionCode 48/g' android/app/build.gradle
-perl -p -i -e 's/versionName .*/versionName "1.1.3"/g' android/app/build.gradle
-```
+  ```bash
+  perl -p -i -e 's/versionCode .*/versionCode 40/g' android/app/build.gradle
+  perl -p -i -e 's/versionName .*/versionName "1.0.7"/g' android/app/build.gradle
+  ```
 
 ##### 2. Build
 
   Here's prod. Also available: test, dev
 
-```bash
-npm run build:android:prod
-```
+  ```bash
+  npm run build:android:prod
+  ```
 
 ##### 3. Open the project in Android Studio
 
-```bash
-npx cap open android
-```
+   ```bash
+   npx cap open android
+   ```
 
 ##### 4. Use Android Studio to build and run on emulator or device
 
@@ -1380,8 +1379,6 @@ At play.google.com/console:
 - Note that if you add testers, you have to go to "Publishing Overview" and send
   those changes or your (closed) testers won't see it.
 
-- When finished, bump package.json version
-
 ### Capacitor Operations
 
 ```bash

CHANGELOG.md

@@ -5,30 +5,6 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-
-## [1.1.3] - 2025.11.19
-### Changed
-- Project selection in dialogs now reaches out to server when filtering
-- Project selection during onboarding meeting is a search (not an input box)
-- Improve the switching of agent when agent edits a project
-### Fixed
-- Reassignment of "you" as recipient when changing giver project
-- Bad counts for project-change notification on front page
-
-
-## [1.1.2] - 2025.11.06
-### Fixed
-- Bad page when user follows prompt to backup seed
-
-
-## [1.1.1] - 2025.11.03
-
-### Added
-- Meeting onboarding via prompts
-- Emojis on gift feed
-- Starred projects with notification
-
-
 ## [1.0.7] - 2025.08.18
 
 ### Fixed

android/app/build.gradle

@@ -31,8 +31,8 @@ android {
         applicationId "app.timesafari.app"
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
-        versionCode 48
-        versionName "1.1.3"
+        versionCode 41
+        versionName "1.0.8"
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
         aaptOptions {
              // Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps.

doc/ios-share-extension-git-commit-guide.md

@@ -1,139 +0,0 @@
-# iOS Share Extension - Git Commit Guide
-
-**Date:** 2025-01-27  
-**Purpose:** Clarify which Xcode manual changes should be committed to the repository
-
-## Quick Answer
-
-**YES, most manual Xcode changes SHOULD be committed.** The only exceptions are user-specific settings that are already gitignored.
-
-## What Gets Modified (and Should Be Committed)
-
-When you create the Share Extension target and configure App Groups in Xcode, the following files are modified:
-
-### 1. `ios/App/App.xcodeproj/project.pbxproj` ✅ **COMMIT THIS**
-
-This is the main Xcode project file that tracks:
-- **New targets** (Share Extension target)
-- **File references** (which files belong to which targets)
-- **Build settings** (compiler flags, deployment targets, etc.)
-- **Build phases** (compile sources, link frameworks, etc.)
-- **Capabilities** (App Groups configuration)
-- **Target dependencies**
-
-**This file IS tracked in git** (not in `.gitignore`), so changes should be committed.
-
-### 2. Entitlements Files ✅ **COMMIT THESE**
-
-When you enable App Groups capability, Xcode creates/modifies:
-- `ios/App/App/App.entitlements` (for main app)
-- `ios/App/TimeSafariShareExtension/TimeSafariShareExtension.entitlements` (for extension)
-
-These files contain the App Group identifiers and should be committed.
-
-### 3. Share Extension Source Files ✅ **ALREADY COMMITTED**
-
-The following files are already in the repo:
-- `ios/App/TimeSafariShareExtension/ShareViewController.swift`
-- `ios/App/TimeSafariShareExtension/Info.plist`
-- `ios/App/App/ShareImageBridge.swift`
-
-These should already be committed (they were created as part of the implementation).
-
-## What Should NOT Be Committed
-
-### 1. User-Specific Settings ❌ **ALREADY GITIGNORED**
-
-These are in `ios/.gitignore`:
-- `xcuserdata/` - User-specific scheme selections, breakpoints, etc.
-- `*.xcuserstate` - User's current Xcode state
-
-### 2. Signing Identities ❌ **USER-SPECIFIC**
-
-While the **App Groups capability** should be committed (it's in `project.pbxproj` and entitlements), your **personal signing identity/team** is user-specific and Xcode handles this automatically per developer.
-
-## What Happens When You Commit
-
-When you commit the changes:
-
-1. **Other developers** who pull the changes will:
-   - ✅ Get the new Share Extension target automatically
-   - ✅ Get the App Groups capability configuration
-   - ✅ Get file references and build settings
-   - ✅ See the Share Extension in their Xcode project
-
-2. **They will still need to:**
-   - Configure their own signing team/identity (Xcode prompts for this)
-   - Build the project (which may trigger CocoaPods updates)
-   - But they **won't** need to manually create the target or configure App Groups
-
-## Step-by-Step: What to Commit
-
-After completing the Xcode setup steps:
-
-```bash
-# Check what changed
-git status
-
-# You should see:
-# - ios/App/App.xcodeproj/project.pbxproj (modified)
-# - ios/App/App/App.entitlements (new or modified)
-# - ios/App/TimeSafariShareExtension/TimeSafariShareExtension.entitlements (new)
-# - Possibly other project-related files
-
-# Review the changes
-git diff ios/App/App.xcodeproj/project.pbxproj
-
-# Commit the changes
-git add ios/App/App.xcodeproj/project.pbxproj
-git add ios/App/App/App.entitlements
-git add ios/App/TimeSafariShareExtension/TimeSafariShareExtension.entitlements
-git commit -m "Add iOS Share Extension target and App Groups configuration"
-```
-
-## Important Notes
-
-### Merge Conflicts in project.pbxproj
-
-The `project.pbxproj` file can have merge conflicts because:
-- It's auto-generated by Xcode
-- Multiple developers might modify it
-- It uses UUIDs that can conflict
-
-**If you get merge conflicts:**
-1. Open the project in Xcode
-2. Xcode will often auto-resolve conflicts
-3. Or manually resolve by keeping both sets of changes
-4. Test that the project builds
-
-### Team/Developer IDs
-
-The `DEVELOPMENT_TEAM` setting in `project.pbxproj` might be user-specific:
-- Some teams commit this (if everyone uses the same team)
-- Some teams use `.xcconfig` files to override per developer
-- Check with your team's practices
-
-If you see `DEVELOPMENT_TEAM = GM3FS5JQPH;` in the project file, this is already committed, so your team likely commits team IDs.
-
-## Verification
-
-After committing, verify that:
-1. The Share Extension target appears in Xcode for other developers
-2. App Groups capability is configured
-3. The project builds successfully
-4. No user-specific files were accidentally committed
-
-## Summary
-
-| Change Type | Commit? | Reason |
-|------------|---------|--------|
-| New target creation | ✅ Yes | Modifies `project.pbxproj` |
-| App Groups capability | ✅ Yes | Creates/modifies entitlements files |
-| File target membership | ✅ Yes | Modifies `project.pbxproj` |
-| Build settings | ✅ Yes | Modifies `project.pbxproj` |
-| Source files (Swift, plist) | ✅ Yes | Already in repo |
-| User scheme selections | ❌ No | In `xcuserdata/` (gitignored) |
-| Personal signing identity | ⚠️ Maybe | Depends on team practice |
-
-**Bottom line:** Commit all the Xcode project configuration changes. Other developers will get the Share Extension target automatically when they pull, and they'll only need to configure their personal signing settings.
-

doc/ios-share-extension-setup.md

@@ -1,140 +0,0 @@
-# iOS Share Extension Setup Instructions
-
-**Date:** 2025-01-27  
-**Purpose:** Step-by-step instructions for setting up the iOS Share Extension in Xcode
-
-## Prerequisites
-
-- Xcode installed
-- iOS project already set up with Capacitor
-- Access to Apple Developer account (for App Groups)
-
-## Step 1: Create Share Extension Target
-
-1. Open `ios/App/App.xcodeproj` in Xcode
-2. In the Project Navigator, select the **App** project (top-level item)
-3. Click the **+** button at the bottom of the Targets list
-4. Select **iOS** → **Share Extension**
-5. Click **Next**
-6. Configure:
-   - **Product Name:** `TimeSafariShareExtension`
-   - **Bundle Identifier:** `app.timesafari.shareextension` (must match main app's bundle ID with `.shareextension` suffix)
-   - **Language:** Swift
-7. Click **Finish**
-
-## Step 2: Configure Share Extension Files
-
-The following files have been created in `ios/App/TimeSafariShareExtension/`:
-
-- `ShareViewController.swift` - Main extension logic
-- `Info.plist` - Extension configuration
-
-**Verify these files exist and are added to the Share Extension target.**
-
-## Step 3: Configure App Groups
-
-App Groups allow the Share Extension and main app to share data.
-
-### For Main App Target:
-
-1. Select the **App** target in Xcode
-2. Go to **Signing & Capabilities** tab
-3. Click **+ Capability**
-4. Select **App Groups**
-5. Click **+** to add a new group
-6. Enter: `group.app.timesafari`
-7. Ensure it's checked/enabled
-
-### For Share Extension Target:
-
-1. Select the **TimeSafariShareExtension** target
-2. Go to **Signing & Capabilities** tab
-3. Click **+ Capability**
-4. Select **App Groups**
-5. Click **+** to add a new group
-6. Enter: `group.app.timesafari` (same as main app)
-7. Ensure it's checked/enabled
-
-**Important:** Both targets must use the **exact same** App Group identifier.
-
-## Step 4: Configure Share Extension Info.plist
-
-The `Info.plist` file should already be configured, but verify:
-
-1. Select `TimeSafariShareExtension/Info.plist` in Xcode
-2. Ensure it contains:
-   - `NSExtensionPointIdentifier` = `com.apple.share-services`
-   - `NSExtensionPrincipalClass` = `$(PRODUCT_MODULE_NAME).ShareViewController`
-   - `NSExtensionActivationSupportsImageWithMaxCount` = `1`
-
-## Step 5: Add ShareImageBridge to Main App
-
-1. The file `ios/App/App/ShareImageBridge.swift` has been created
-2. Ensure it's added to the **App** target (not the Share Extension target)
-3. In Xcode, select the file and check the **Target Membership** in the File Inspector
-
-## Step 6: Build and Test
-
-1. Select the **App** scheme (not the Share Extension scheme)
-2. Build and run on a device or simulator
-3. Open Photos app
-4. Select an image
-5. Tap **Share** button
-6. Look for **TimeSafari Share** in the share sheet
-7. Select it
-8. The app should open and navigate to the shared photo view
-
-## Step 7: Troubleshooting
-
-### Share Extension doesn't appear in share sheet
-
-- Verify the Share Extension target builds successfully
-- Check that `Info.plist` is correctly configured
-- Ensure the extension's bundle identifier follows the pattern: `{main-app-bundle-id}.shareextension`
-- Clean build folder (Product → Clean Build Folder)
-
-### App Group access fails
-
-- Verify both targets have the same App Group identifier
-- Check that App Groups capability is enabled for both targets
-- Ensure you're signed in with a valid Apple Developer account
-- For development, you may need to enable App Groups in your Apple Developer account
-
-### Shared image not appearing
-
-- Check Xcode console for errors
-- Verify `ShareViewController.swift` is correctly implemented
-- Ensure the deep link `timesafari://shared-photo` is being handled
-- Check that the native bridge method is being called
-
-### Build errors
-
-- Ensure Swift version matches between targets
-- Check that all required frameworks are linked
-- Verify deployment targets match between main app and extension
-
-## Step 8: Native Bridge Implementation (TODO)
-
-Currently, the JavaScript code needs a way to call the native `getSharedImageData()` method. This requires one of:
-
-1. **Option A:** Create a minimal Capacitor plugin
-2. **Option B:** Use Capacitor's existing bridge mechanisms
-3. **Option C:** Expose the method via a custom URL scheme parameter
-
-The current implementation in `main.capacitor.ts` has a placeholder that needs to be completed.
-
-## Next Steps
-
-After the Share Extension is set up and working:
-
-1. Complete the native bridge implementation to read from App Group
-2. Test end-to-end flow: Share image → Extension stores → App reads → Displays
-3. Implement Android version
-4. Add error handling and edge cases
-
-## References
-
-- [Apple Share Extensions Documentation](https://developer.apple.com/documentation/social)
-- [App Groups Documentation](https://developer.apple.com/documentation/xcode/configuring-app-groups)
-- [Capacitor Native Bridge](https://capacitorjs.com/docs/guides/building-plugins)
-

doc/ios-share-implementation-status.md

@@ -1,93 +0,0 @@
-# iOS Share Extension Implementation Status
-
-**Date:** 2025-01-27  
-**Status:** In Progress - Native Code Complete, Bridge Pending
-
-## Completed
-
-✅ **Share Extension Files Created:**
-- `ios/App/TimeSafariShareExtension/ShareViewController.swift` - Handles image sharing
-- `ios/App/TimeSafariShareExtension/Info.plist` - Extension configuration
-
-✅ **Native Bridge Created:**
-- `ios/App/App/ShareImageBridge.swift` - Native method to read from App Group
-
-✅ **JavaScript Integration Started:**
-- `src/services/nativeShareHandler.ts` - Service to handle native shared images
-- `src/main.capacitor.ts` - Updated to check for native shared images on deep link
-
-✅ **Documentation:**
-- `doc/native-share-target-implementation.md` - Complete implementation guide
-- `doc/ios-share-extension-setup.md` - Xcode setup instructions
-
-## Pending
-
-⚠️ **Xcode Configuration (Manual Steps Required):**
-1. Create Share Extension target in Xcode
-2. Configure App Groups for both main app and extension
-3. Add ShareImageBridge.swift to App target
-4. Build and test
-
-⚠️ **JavaScript-Native Bridge:**
-The current implementation has a placeholder for calling the native `ShareImageBridge.getSharedImageData()` method from JavaScript. This needs to be completed using one of:
-
-**Option A: Minimal Capacitor Plugin** (Recommended for Option 1)
-- Create a small plugin that exposes the method
-- Clean and maintainable
-- Follows Capacitor patterns
-
-**Option B: Direct Bridge Call**
-- Use Capacitor's executePlugin or similar mechanism
-- Requires understanding Capacitor's internal bridge
-- Less maintainable
-
-**Option C: AppDelegate Integration**
-- Have AppDelegate check on launch and expose via a different mechanism
-- Workaround approach
-- Less clean but functional
-
-## Next Steps
-
-1. **Complete Xcode Setup:**
-   - Follow `doc/ios-share-extension-setup.md`
-   - Create Share Extension target
-   - Configure App Groups
-   - Build and verify extension appears in share sheet
-
-2. **Implement JavaScript-Native Bridge:**
-   - Choose one of the options above
-   - Complete the `checkAndStoreNativeSharedImage()` function in `main.capacitor.ts`
-   - Test end-to-end flow
-
-3. **Testing:**
-   - Share image from Photos app
-   - Verify Share Extension appears
-   - Verify app opens and displays shared image
-   - Test "Record Gift" and "Save as Profile" flows
-
-## Current Flow
-
-1. ✅ User shares image → Share Extension receives
-2. ✅ Share Extension converts to base64
-3. ✅ Share Extension stores in App Group UserDefaults
-4. ✅ Share Extension opens app with `timesafari://shared-photo?fileName=...`
-5. ⚠️ App receives deep link (handled)
-6. ⚠️ App checks App Group UserDefaults (bridge needed)
-7. ⚠️ App stores in temp database (pending bridge)
-8. ✅ SharedPhotoView reads from temp database (already works)
-
-## Code Locations
-
-- **Share Extension:** `ios/App/TimeSafariShareExtension/`
-- **Native Bridge:** `ios/App/App/ShareImageBridge.swift`
-- **JavaScript Handler:** `src/services/nativeShareHandler.ts`
-- **Deep Link Integration:** `src/main.capacitor.ts`
-- **View Component:** `src/views/SharedPhotoView.vue` (already complete)
-
-## Notes
-
-- The Share Extension code is complete and ready to use
-- The main missing piece is the JavaScript-to-native bridge
-- Once the bridge is complete, the entire flow should work end-to-end
-- The existing `SharedPhotoView.vue` doesn't need changes - it already handles images from temp storage
-

doc/native-share-target-implementation.md

@@ -1,507 +0,0 @@
-# Native Share Target Implementation Guide
-
-**Date:** 2025-01-27  
-**Purpose:** Enable TimeSafari native iOS and Android apps to receive shared images from other apps
-
-## Current State
-
-The app currently supports **PWA/web share target** functionality:
-- Service worker intercepts POST to `/share-target`
-- Images stored in temp database as base64
-- `SharedPhotoView.vue` processes and displays shared images
-
-**This does NOT work for native iOS/Android builds** because:
-- Service workers don't run in native app contexts
-- Native platforms use different sharing mechanisms (Share Extensions on iOS, Intent Filters on Android)
-
-## Required Changes
-
-### 1. iOS Implementation
-
-#### 1.1 Create Share Extension Target
-
-1. Open `ios/App/App.xcodeproj` in Xcode
-2. File → New → Target
-3. Select "Share Extension" template
-4. Name it "TimeSafariShareExtension"
-5. Bundle Identifier: `app.timesafari.shareextension`
-6. Language: Swift
-
-#### 1.2 Configure Share Extension Info.plist
-
-Add to `ios/App/TimeSafariShareExtension/Info.plist`:
-
-```xml
-<key>NSExtension</key>
-<dict>
-    <key>NSExtensionPointIdentifier</key>
-    <string>com.apple.share-services</string>
-    <key>NSExtensionPrincipalClass</key>
-    <string>$(PRODUCT_MODULE_NAME).ShareViewController</string>
-    <key>NSExtensionActivationRule</key>
-    <dict>
-        <key>NSExtensionActivationSupportsImageWithMaxCount</key>
-        <integer>1</integer>
-        <key>NSExtensionActivationSupportsFileWithMaxCount</key>
-        <integer>1</integer>
-    </dict>
-</dict>
-```
-
-#### 1.3 Implement ShareViewController
-
-Create `ios/App/TimeSafariShareExtension/ShareViewController.swift`:
-
-```swift
-import UIKit
-import Social
-import MobileCoreServices
-import Capacitor
-
-class ShareViewController: SLComposeServiceViewController {
-    
-    override func viewDidLoad() {
-        super.viewDidLoad()
-        self.title = "Share to TimeSafari"
-    }
-    
-    override func isContentValid() -> Bool {
-        return true
-    }
-    
-    override func didSelectPost() {
-        guard let extensionItem = extensionContext?.inputItems.first as? NSExtensionItem,
-              let itemProvider = extensionItem.attachments?.first else {
-            self.extensionContext?.completeRequest(returningItems: nil, completionHandler: nil)
-            return
-        }
-        
-        // Handle image sharing
-        if itemProvider.hasItemConformingToTypeIdentifier(kUTTypeImage as String) {
-            itemProvider.loadItem(forTypeIdentifier: kUTTypeImage as String, options: nil) { [weak self] (item, error) in
-                guard let self = self else { return }
-                
-                if let url = item as? URL {
-                    // Handle file URL
-                    self.handleSharedImage(url: url)
-                } else if let image = item as? UIImage {
-                    // Handle UIImage directly
-                    self.handleSharedImage(image: image)
-                } else if let data = item as? Data {
-                    // Handle image data
-                    self.handleSharedImage(data: data)
-                }
-            }
-        }
-    }
-    
-    private func handleSharedImage(url: URL? = nil, image: UIImage? = nil, data: Data? = nil) {
-        var imageData: Data?
-        var fileName: String?
-        
-        if let url = url {
-            imageData = try? Data(contentsOf: url)
-            fileName = url.lastPathComponent
-        } else if let image = image {
-            imageData = image.jpegData(compressionQuality: 0.8)
-            fileName = "shared-image.jpg"
-        } else if let data = data {
-            imageData = data
-            fileName = "shared-image.jpg"
-        }
-        
-        guard let imageData = imageData else {
-            self.extensionContext?.completeRequest(returningItems: nil, completionHandler: nil)
-            return
-        }
-        
-        // Convert to base64
-        let base64String = imageData.base64EncodedString()
-        
-        // Store in shared UserDefaults (accessible by main app)
-        let userDefaults = UserDefaults(suiteName: "group.app.timesafari")
-        userDefaults?.set(base64String, forKey: "sharedPhotoBase64")
-        userDefaults?.set(fileName ?? "shared-image.jpg", forKey: "sharedPhotoFileName")
-        userDefaults?.synchronize()
-        
-        // Open main app with deep link
-        let url = URL(string: "timesafari://shared-photo?fileName=\(fileName?.addingPercentEncoding(withAllowedCharacters: .urlQueryAllowed) ?? "shared-image.jpg")")!
-        var responder = self as UIResponder?
-        while responder != nil {
-            if let application = responder as? UIApplication {
-                application.open(url, options: [:], completionHandler: nil)
-                break
-            }
-            responder = responder?.next
-        }
-        
-        // Close share extension
-        self.extensionContext?.completeRequest(returningItems: nil, completionHandler: nil)
-    }
-    
-    override func configurationItems() -> [Any]! {
-        return []
-    }
-}
-```
-
-#### 1.4 Configure App Groups
-
-1. In Xcode, select main app target → Signing & Capabilities
-2. Add "App Groups" capability
-3. Create group: `group.app.timesafari`
-4. Repeat for Share Extension target with same group name
-
-#### 1.5 Update Main App to Read from App Group
-
-The main app needs to check for shared images on launch. This should be added to `AppDelegate.swift` or handled in JavaScript.
-
-### 2. Android Implementation
-
-#### 2.1 Update AndroidManifest.xml
-
-Add intent filter to `MainActivity` in `android/app/src/main/AndroidManifest.xml`:
-
-```xml
-<activity
-    android:name=".MainActivity"
-    ... existing attributes ...>
-    
-    ... existing intent filters ...
-    
-    <!-- Share Target Intent Filter -->
-    <intent-filter>
-        <action android:name="android.intent.action.SEND" />
-        <category android:name="android.intent.category.DEFAULT" />
-        <data android:mimeType="image/*" />
-    </intent-filter>
-    
-    <!-- Multiple images support (optional) -->
-    <intent-filter>
-        <action android:name="android.intent.action.SEND_MULTIPLE" />
-        <category android:name="android.intent.category.DEFAULT" />
-        <data android:mimeType="image/*" />
-    </intent-filter>
-</activity>
-```
-
-#### 2.2 Handle Intent in MainActivity
-
-Update `android/app/src/main/java/app/timesafari/MainActivity.java`:
-
-```java
-package app.timesafari;
-
-import android.content.Intent;
-import android.net.Uri;
-import android.os.Bundle;
-import android.util.Base64;
-import android.util.Log;
-import com.getcapacitor.BridgeActivity;
-import com.getcapacitor.Plugin;
-import java.io.InputStream;
-import java.io.ByteArrayOutputStream;
-
-public class MainActivity extends BridgeActivity {
-    private static final String TAG = "MainActivity";
-    
-    @Override
-    protected void onCreate(Bundle savedInstanceState) {
-        super.onCreate(savedInstanceState);
-        handleShareIntent(getIntent());
-    }
-    
-    @Override
-    protected void onNewIntent(Intent intent) {
-        super.onNewIntent(intent);
-        setIntent(intent);
-        handleShareIntent(intent);
-    }
-    
-    private void handleShareIntent(Intent intent) {
-        if (intent == null) return;
-        
-        String action = intent.getAction();
-        String type = intent.getType();
-        
-        if (Intent.ACTION_SEND.equals(action) && type != null && type.startsWith("image/")) {
-            Uri imageUri = intent.getParcelableExtra(Intent.EXTRA_STREAM);
-            if (imageUri != null) {
-                handleSharedImage(imageUri, intent.getStringExtra(Intent.EXTRA_TEXT));
-            }
-        } else if (Intent.ACTION_SEND_MULTIPLE.equals(action) && type != null && type.startsWith("image/")) {
-            // Handle multiple images (optional - for now just take first)
-            java.util.ArrayList<Uri> imageUris = intent.getParcelableArrayListExtra(Intent.EXTRA_STREAM);
-            if (imageUris != null && !imageUris.isEmpty()) {
-                handleSharedImage(imageUris.get(0), null);
-            }
-        }
-    }
-    
-    private void handleSharedImage(Uri imageUri, String fileName) {
-        try {
-            // Read image data
-            InputStream inputStream = getContentResolver().openInputStream(imageUri);
-            if (inputStream == null) {
-                Log.e(TAG, "Failed to open input stream for shared image");
-                return;
-            }
-            
-            ByteArrayOutputStream buffer = new ByteArrayOutputStream();
-            byte[] data = new byte[8192];
-            int nRead;
-            while ((nRead = inputStream.read(data, 0, data.length)) != -1) {
-                buffer.write(data, 0, nRead);
-            }
-            buffer.flush();
-            byte[] imageBytes = buffer.toByteArray();
-            
-            // Convert to base64
-            String base64String = Base64.encodeToString(imageBytes, Base64.NO_WRAP);
-            
-            // Extract filename from URI or use default
-            String actualFileName = fileName;
-            if (actualFileName == null || actualFileName.isEmpty()) {
-                String path = imageUri.getPath();
-                if (path != null) {
-                    int lastSlash = path.lastIndexOf('/');
-                    if (lastSlash >= 0 && lastSlash < path.length() - 1) {
-                        actualFileName = path.substring(lastSlash + 1);
-                    }
-                }
-                if (actualFileName == null || actualFileName.isEmpty()) {
-                    actualFileName = "shared-image.jpg";
-                }
-            }
-            
-            // Store in SharedPreferences (accessible by JavaScript via Capacitor)
-            android.content.SharedPreferences prefs = getSharedPreferences("TimeSafariShared", MODE_PRIVATE);
-            android.content.SharedPreferences.Editor editor = prefs.edit();
-            editor.putString("sharedPhotoBase64", base64String);
-            editor.putString("sharedPhotoFileName", actualFileName);
-            editor.apply();
-            
-            // Trigger JavaScript event or navigate to shared-photo route
-            // This will be handled by JavaScript checking for shared data on app launch
-            Log.d(TAG, "Shared image stored, filename: " + actualFileName);
-            
-        } catch (Exception e) {
-            Log.e(TAG, "Error handling shared image", e);
-        }
-    }
-}
-```
-
-#### 2.3 Add Required Permissions
-
-Ensure `AndroidManifest.xml` has:
-
-```xml
-<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
-<uses-permission android:name="android.permission.READ_MEDIA_IMAGES" /> <!-- Android 13+ -->
-```
-
-### 3. JavaScript Layer Updates
-
-#### 3.1 Create Native Share Handler
-
-Create `src/services/nativeShareHandler.ts`:
-
-```typescript
-/**
- * Native Share Handler
- * Handles shared images from native iOS and Android platforms
- */
-
-import { Capacitor } from "@capacitor/core";
-import { App } from "@capacitor/app";
-import { Filesystem, Directory, Encoding } from "@capacitor/filesystem";
-import { logger } from "../utils/logger";
-import { SHARED_PHOTO_BASE64_KEY } from "../libs/util";
-import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
-
-/**
- * Check for shared images from native platforms and store in temp database
- */
-export async function checkForNativeSharedImage(
-  platformService: InstanceType<typeof PlatformServiceMixin>
-): Promise<boolean> {
-  if (!Capacitor.isNativePlatform()) {
-    return false;
-  }
-
-  try {
-    if (Capacitor.getPlatform() === "ios") {
-      return await checkIOSSharedImage(platformService);
-    } else if (Capacitor.getPlatform() === "android") {
-      return await checkAndroidSharedImage(platformService);
-    }
-  } catch (error) {
-    logger.error("Error checking for native shared image:", error);
-  }
-
-  return false;
-}
-
-/**
- * Check for shared image on iOS (from App Group UserDefaults)
- */
-async function checkIOSSharedImage(
-  platformService: InstanceType<typeof PlatformServiceMixin>
-): Promise<boolean> {
-  // iOS uses App Groups to share data between extension and main app
-  // We need to use a Capacitor plugin or native code to read from App Group
-  // For now, this is a placeholder - requires native plugin implementation
-  
-  // Option 1: Use Capacitor plugin to read from App Group
-  // Option 2: Use native code bridge
-  
-  logger.debug("Checking for iOS shared image (not yet implemented)");
-  return false;
-}
-
-/**
- * Check for shared image on Android (from SharedPreferences)
- */
-async function checkAndroidSharedImage(
-  platformService: InstanceType<typeof PlatformServiceMixin>
-): Promise<boolean> {
-  // Android stores in SharedPreferences
-  // We need a Capacitor plugin to read from SharedPreferences
-  // For now, this is a placeholder - requires native plugin implementation
-  
-  logger.debug("Checking for Android shared image (not yet implemented)");
-  return false;
-}
-
-/**
- * Store shared image in temp database
- */
-async function storeSharedImage(
-  base64Data: string,
-  fileName: string,
-  platformService: InstanceType<typeof PlatformServiceMixin>
-): Promise<void> {
-  try {
-    const existing = await platformService.$getTemp(SHARED_PHOTO_BASE64_KEY);
-    
-    if (existing) {
-      await platformService.$updateEntity(
-        "temp",
-        { blobB64: base64Data },
-        "id = ?",
-        [SHARED_PHOTO_BASE64_KEY]
-      );
-    } else {
-      await platformService.$insertEntity(
-        "temp",
-        { id: SHARED_PHOTO_BASE64_KEY, blobB64: base64Data },
-        ["id", "blobB64"]
-      );
-    }
-    
-    logger.debug("Stored shared image in temp database");
-  } catch (error) {
-    logger.error("Error storing shared image:", error);
-    throw error;
-  }
-}
-```
-
-#### 3.2 Update main.capacitor.ts
-
-Add check for shared images on app launch:
-
-```typescript
-// In main.capacitor.ts, after app mount:
-
-import { checkForNativeSharedImage } from "./services/nativeShareHandler";
-
-// Check for shared images when app becomes active
-App.addListener("appStateChange", async (state) => {
-  if (state.isActive) {
-    // Check for native shared images
-    const hasSharedImage = await checkForNativeSharedImage(/* platformService */);
-    if (hasSharedImage) {
-      // Navigate to shared-photo view
-      await router.push({
-        name: "shared-photo",
-        query: { source: "native" }
-      });
-    }
-  }
-});
-
-// Also check on initial launch
-App.getLaunchUrl().then((result) => {
-  if (result?.url) {
-    // Handle deep link
-  } else {
-    // Check for shared image
-    checkForNativeSharedImage(/* platformService */).then((hasShared) => {
-      if (hasShared) {
-        router.push({ name: "shared-photo", query: { source: "native" } });
-      }
-    });
-  }
-});
-```
-
-#### 3.3 Update SharedPhotoView.vue
-
-The existing `SharedPhotoView.vue` should work as-is, but we may want to add detection for native vs web sources.
-
-### 4. Alternative Approach: Capacitor Plugin
-
-Instead of implementing native code directly, consider creating a Capacitor plugin:
-
-1. **Create plugin**: `@capacitor-community/share-target` or custom plugin
-2. **Plugin methods**:
-   - `checkForSharedImage()`: Returns shared image data if available
-   - `clearSharedImage()`: Clears shared image data after processing
-
-This would be cleaner and more maintainable.
-
-### 5. Testing Checklist
-
-- [ ] Test sharing image from Photos app on iOS
-- [ ] Test sharing image from Gallery app on Android
-- [ ] Test sharing from other apps (Safari, Chrome, etc.)
-- [ ] Verify image appears in SharedPhotoView
-- [ ] Test "Record Gift" flow with shared image
-- [ ] Test "Save as Profile" flow with shared image
-- [ ] Test cancel flow
-- [ ] Verify temp storage cleanup
-- [ ] Test app launch with shared image pending
-- [ ] Test app already running when image is shared
-
-### 6. Implementation Priority
-
-**Phase 1: Android (Simpler)**
-1. Update AndroidManifest.xml
-2. Implement MainActivity intent handling
-3. Create JavaScript handler
-4. Test end-to-end
-
-**Phase 2: iOS (More Complex)**
-1. Create Share Extension target
-2. Implement ShareViewController
-3. Configure App Groups
-4. Create JavaScript handler
-5. Test end-to-end
-
-### 7. Notes
-
-- **App Groups (iOS)**: Required for sharing data between Share Extension and main app
-- **SharedPreferences (Android)**: Standard way to share data between app components
-- **Base64 Encoding**: Both platforms convert images to base64 for JavaScript compatibility
-- **File Size Limits**: Consider large image handling and memory management
-- **Permissions**: Android 13+ requires `READ_MEDIA_IMAGES` instead of `READ_EXTERNAL_STORAGE`
-
-### 8. References
-
-- [iOS Share Extensions](https://developer.apple.com/documentation/social)
-- [Android Share Targets](https://developer.android.com/training/sharing/receive)
-- [Capacitor App Plugin](https://capacitorjs.com/docs/apis/app)
-- [Capacitor Native Bridge](https://capacitorjs.com/docs/guides/building-plugins)
-

doc/xcode-26-cocoapods-workaround.md

@@ -1,76 +0,0 @@
-# Xcode 26 / CocoaPods Compatibility Workaround
-
-**Date:** 2025-01-27  
-**Issue:** CocoaPods `xcodeproj` gem (1.27.0) doesn't support Xcode 26's project format version 70
-
-## The Problem
-
-Xcode 26.1.1 uses project format version 70, but the `xcodeproj` gem (1.27.0) only supports up to version 56. This causes CocoaPods to fail with:
-
-```
-ArgumentError - [Xcodeproj] Unable to find compatibility version string for object version `70`.
-```
-
-## Solutions
-
-### Option 1: Temporarily Downgrade Project Format (Recommended for Now)
-
-**Before running `pod install` or `npm run build:ios`:**
-
-1. Edit `ios/App/App.xcodeproj/project.pbxproj`
-2. Change line 6 from: `objectVersion = 70;` to: `objectVersion = 56;`
-3. Run your build/sync command
-4. Change it back to: `objectVersion = 70;` (Xcode will likely change it back automatically)
-
-**Warning:** Xcode may automatically upgrade the format back to 70 when you open the project. This is okay - just repeat the process when needed.
-
-### Option 2: Wait for xcodeproj Update
-
-The `xcodeproj` gem maintainers will eventually release a version that supports format 70. You can:
-- Check for updates: `bundle update xcodeproj`
-- Monitor: https://github.com/CocoaPods/Xcodeproj/issues
-
-### Option 3: Use Xcode Directly (Bypass CocoaPods for Now)
-
-Since the Share Extension is already set up:
-1. Open the project in Xcode
-2. Build directly from Xcode (Product → Build)
-3. Skip `npm run build:ios` for now
-4. Test the Share Extension functionality
-
-### Option 4: Automated Workaround (Integrated into Build Script) ✅
-
-The workaround is now **automatically integrated** into `scripts/build-ios.sh`. When you run:
-
-```bash
-npm run build:ios
-```
-
-The build script will:
-1. Automatically detect if the project format is version 70
-2. Temporarily downgrade to version 56
-3. Run `pod install`
-4. Restore to version 70
-5. Continue with the build
-
-**No manual steps required!** The workaround is transparent and only applies when needed.
-
-To remove the workaround in the future:
-1. Check if `xcodeproj` gem supports format 70: `bundle exec gem list xcodeproj`
-2. Test if `pod install` works without the workaround
-3. If it works, remove the `run_pod_install_with_workaround()` function from `scripts/build-ios.sh`
-4. Replace it with a simple `pod install` call
-
-## Current Status
-
-- ✅ Share Extension target exists
-- ✅ Share Extension files are in place
-- ✅ Workaround integrated into build script
-- ✅ `npm run build:ios` works automatically
-
-## Recommendation
-
-**Use `npm run build:ios`** - the workaround is handled automatically. No manual intervention needed.
-
-Once `xcodeproj` is updated to support format 70, the workaround can be removed from the build script.
-

index.html

@@ -3,7 +3,7 @@
   <head>
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover, user-scalable=no, interactive-widget=overlays-content" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
     
     <!-- CORS headers removed to allow images from any domain -->
     
@@ -13,4 +13,4 @@
     <div id="app"></div>
     <script type="module" src="/src/main.ts"></script>
   </body>
-</html>
+</html>

ios/App/App.xcodeproj/project.pbxproj

@@ -3,7 +3,7 @@
 	archiveVersion = 1;
 	classes = {
 	};
-	objectVersion = 70;
+	objectVersion = 54;
 	objects = {
 
 /* Begin PBXBuildFile section */
@@ -15,35 +15,8 @@
 		504EC3121FED79650016851F /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 504EC3101FED79650016851F /* LaunchScreen.storyboard */; };
 		50B271D11FEDC1A000F3C39B /* public in Resources */ = {isa = PBXBuildFile; fileRef = 50B271D01FEDC1A000F3C39B /* public */; };
 		97EF2DC6FD76C3643D680B8D /* Pods_App.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 90DCAFB4D8948F7A50C13800 /* Pods_App.framework */; };
-		C86585DF2ED456DE00824752 /* TimeSafariShareExtension.appex in Embed Foundation Extensions */ = {isa = PBXBuildFile; fileRef = C86585D52ED456DE00824752 /* TimeSafariShareExtension.appex */; settings = {ATTRIBUTES = (RemoveHeadersOnCopy, ); }; };
-		C86585E82ED45A3E00824752 /* ShareImageBridge.swift in Sources */ = {isa = PBXBuildFile; fileRef = C86585E72ED45A3D00824752 /* ShareImageBridge.swift */; };
-		C8D7E2CC2ED46A3B00DD738D /* ShareImagePlugin.swift in Sources */ = {isa = PBXBuildFile; fileRef = C8D7E2CB2ED46A3B00DD738D /* ShareImagePlugin.swift */; };
 /* End PBXBuildFile section */
 
-/* Begin PBXContainerItemProxy section */
-		C86585DD2ED456DE00824752 /* PBXContainerItemProxy */ = {
-			isa = PBXContainerItemProxy;
-			containerPortal = 504EC2FC1FED79650016851F /* Project object */;
-			proxyType = 1;
-			remoteGlobalIDString = C86585D42ED456DE00824752;
-			remoteInfo = TimeSafariShareExtension;
-		};
-/* End PBXContainerItemProxy section */
-
-/* Begin PBXCopyFilesBuildPhase section */
-		C86585E02ED456DE00824752 /* Embed Foundation Extensions */ = {
-			isa = PBXCopyFilesBuildPhase;
-			buildActionMask = 2147483647;
-			dstPath = "";
-			dstSubfolderSpec = 13;
-			files = (
-				C86585DF2ED456DE00824752 /* TimeSafariShareExtension.appex in Embed Foundation Extensions */,
-			);
-			name = "Embed Foundation Extensions";
-			runOnlyForDeploymentPostprocessing = 0;
-		};
-/* End PBXCopyFilesBuildPhase section */
-
 /* Begin PBXFileReference section */
 		2FAD9762203C412B000D30F8 /* config.xml */ = {isa = PBXFileReference; lastKnownFileType = text.xml; path = config.xml; sourceTree = "<group>"; };
 		50379B222058CBB4000EE86E /* capacitor.config.json */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.json; path = capacitor.config.json; sourceTree = "<group>"; };
@@ -55,28 +28,10 @@
 		504EC3131FED79650016851F /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		50B271D01FEDC1A000F3C39B /* public */ = {isa = PBXFileReference; lastKnownFileType = folder; path = public; sourceTree = "<group>"; };
 		90DCAFB4D8948F7A50C13800 /* Pods_App.framework */ = {isa = PBXFileReference; explicitFileType = wrapper.framework; includeInIndex = 0; path = Pods_App.framework; sourceTree = BUILT_PRODUCTS_DIR; };
-		C86585D52ED456DE00824752 /* TimeSafariShareExtension.appex */ = {isa = PBXFileReference; explicitFileType = "wrapper.app-extension"; includeInIndex = 0; path = TimeSafariShareExtension.appex; sourceTree = BUILT_PRODUCTS_DIR; };
-		C86585E52ED4577F00824752 /* App.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = App.entitlements; sourceTree = "<group>"; };
-		C86585E72ED45A3D00824752 /* ShareImageBridge.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ShareImageBridge.swift; sourceTree = "<group>"; };
-		C8D7E2CB2ED46A3B00DD738D /* ShareImagePlugin.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ShareImagePlugin.swift; sourceTree = "<group>"; };
 		E2E9297D5D02C549106C77F9 /* Pods-App.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-App.release.xcconfig"; path = "Target Support Files/Pods-App/Pods-App.release.xcconfig"; sourceTree = "<group>"; };
 		EAEC6436E595F7CD3A1C9E96 /* Pods-App.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-App.debug.xcconfig"; path = "Target Support Files/Pods-App/Pods-App.debug.xcconfig"; sourceTree = "<group>"; };
 /* End PBXFileReference section */
 
-/* Begin PBXFileSystemSynchronizedBuildFileExceptionSet section */
-		C86585E32ED456DE00824752 /* PBXFileSystemSynchronizedBuildFileExceptionSet */ = {
-			isa = PBXFileSystemSynchronizedBuildFileExceptionSet;
-			membershipExceptions = (
-				Info.plist,
-			);
-			target = C86585D42ED456DE00824752 /* TimeSafariShareExtension */;
-		};
-/* End PBXFileSystemSynchronizedBuildFileExceptionSet section */
-
-/* Begin PBXFileSystemSynchronizedRootGroup section */
-		C86585D62ED456DE00824752 /* TimeSafariShareExtension */ = {isa = PBXFileSystemSynchronizedRootGroup; exceptions = (C86585E32ED456DE00824752 /* PBXFileSystemSynchronizedBuildFileExceptionSet */, ); explicitFileTypes = {}; explicitFolders = (); path = TimeSafariShareExtension; sourceTree = "<group>"; };
-/* End PBXFileSystemSynchronizedRootGroup section */
-
 /* Begin PBXFrameworksBuildPhase section */
 		504EC3011FED79650016851F /* Frameworks */ = {
 			isa = PBXFrameworksBuildPhase;
@@ -86,13 +41,6 @@
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
-		C86585D22ED456DE00824752 /* Frameworks */ = {
-			isa = PBXFrameworksBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-		};
 /* End PBXFrameworksBuildPhase section */
 
 /* Begin PBXGroup section */
@@ -108,7 +56,6 @@
 			isa = PBXGroup;
 			children = (
 				504EC3061FED79650016851F /* App */,
-				C86585D62ED456DE00824752 /* TimeSafariShareExtension */,
 				504EC3051FED79650016851F /* Products */,
 				BA325FFCDCE8D334E5C7AEBE /* Pods */,
 				4B546315E668C7A13939F417 /* Frameworks */,
@@ -119,7 +66,6 @@
 			isa = PBXGroup;
 			children = (
 				504EC3041FED79650016851F /* App.app */,
-				C86585D52ED456DE00824752 /* TimeSafariShareExtension.appex */,
 			);
 			name = Products;
 			sourceTree = "<group>";
@@ -127,9 +73,6 @@
 		504EC3061FED79650016851F /* App */ = {
 			isa = PBXGroup;
 			children = (
-				C8D7E2CB2ED46A3B00DD738D /* ShareImagePlugin.swift */,
-				C86585E72ED45A3D00824752 /* ShareImageBridge.swift */,
-				C86585E52ED4577F00824752 /* App.entitlements */,
 				50379B222058CBB4000EE86E /* capacitor.config.json */,
 				504EC3071FED79650016851F /* AppDelegate.swift */,
 				504EC30B1FED79650016851F /* Main.storyboard */,
@@ -165,40 +108,16 @@
 				012076E8FFE4BF260A79B034 /* Fix Privacy Manifest */,
 				3525031ED1C96EF4CF6E9959 /* [CP] Embed Pods Frameworks */,
 				96A7EF592DF3366D00084D51 /* Fix Privacy Manifest */,
-				C86585E02ED456DE00824752 /* Embed Foundation Extensions */,
 			);
 			buildRules = (
 			);
 			dependencies = (
-				C86585DE2ED456DE00824752 /* PBXTargetDependency */,
 			);
 			name = App;
 			productName = App;
 			productReference = 504EC3041FED79650016851F /* App.app */;
 			productType = "com.apple.product-type.application";
 		};
-		C86585D42ED456DE00824752 /* TimeSafariShareExtension */ = {
-			isa = PBXNativeTarget;
-			buildConfigurationList = C86585E42ED456DE00824752 /* Build configuration list for PBXNativeTarget "TimeSafariShareExtension" */;
-			buildPhases = (
-				C86585D12ED456DE00824752 /* Sources */,
-				C86585D22ED456DE00824752 /* Frameworks */,
-				C86585D32ED456DE00824752 /* Resources */,
-			);
-			buildRules = (
-			);
-			dependencies = (
-			);
-			fileSystemSynchronizedGroups = (
-				C86585D62ED456DE00824752 /* TimeSafariShareExtension */,
-			);
-			name = TimeSafariShareExtension;
-			packageProductDependencies = (
-			);
-			productName = TimeSafariShareExtension;
-			productReference = C86585D52ED456DE00824752 /* TimeSafariShareExtension.appex */;
-			productType = "com.apple.product-type.app-extension";
-		};
 /* End PBXNativeTarget section */
 
 /* Begin PBXProject section */
@@ -206,7 +125,7 @@
 			isa = PBXProject;
 			attributes = {
 				BuildIndependentTargetsInParallel = YES;
-				LastSwiftUpdateCheck = 2610;
+				LastSwiftUpdateCheck = 920;
 				LastUpgradeCheck = 1630;
 				TargetAttributes = {
 					504EC3031FED79650016851F = {
@@ -214,9 +133,6 @@
 						LastSwiftMigration = 1100;
 						ProvisioningStyle = Automatic;
 					};
-					C86585D42ED456DE00824752 = {
-						CreatedOnToolsVersion = 26.1.1;
-					};
 				};
 			};
 			buildConfigurationList = 504EC2FF1FED79650016851F /* Build configuration list for PBXProject "App" */;
@@ -233,7 +149,6 @@
 			projectRoot = "";
 			targets = (
 				504EC3031FED79650016851F /* App */,
-				C86585D42ED456DE00824752 /* TimeSafariShareExtension */,
 			);
 		};
 /* End PBXProject section */
@@ -252,13 +167,6 @@
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
-		C86585D32ED456DE00824752 /* Resources */ = {
-			isa = PBXResourcesBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-		};
 /* End PBXResourcesBuildPhase section */
 
 /* Begin PBXShellScriptBuildPhase section */
@@ -345,29 +253,12 @@
 			isa = PBXSourcesBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
-				C8D7E2CC2ED46A3B00DD738D /* ShareImagePlugin.swift in Sources */,
-				C86585E82ED45A3E00824752 /* ShareImageBridge.swift in Sources */,
 				504EC3081FED79650016851F /* AppDelegate.swift in Sources */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
-		C86585D12ED456DE00824752 /* Sources */ = {
-			isa = PBXSourcesBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-		};
 /* End PBXSourcesBuildPhase section */
 
-/* Begin PBXTargetDependency section */
-		C86585DE2ED456DE00824752 /* PBXTargetDependency */ = {
-			isa = PBXTargetDependency;
-			target = C86585D42ED456DE00824752 /* TimeSafariShareExtension */;
-			targetProxy = C86585DD2ED456DE00824752 /* PBXContainerItemProxy */;
-		};
-/* End PBXTargetDependency section */
-
 /* Begin PBXVariantGroup section */
 		504EC30B1FED79650016851F /* Main.storyboard */ = {
 			isa = PBXVariantGroup;
@@ -511,9 +402,8 @@
 			baseConfigurationReference = EAEC6436E595F7CD3A1C9E96 /* Pods-App.debug.xcconfig */;
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
-				CODE_SIGN_ENTITLEMENTS = App/App.entitlements;
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 48;
+				CURRENT_PROJECT_VERSION = 41;
 				DEVELOPMENT_TEAM = GM3FS5JQPH;
 				ENABLE_APP_SANDBOX = NO;
 				ENABLE_USER_SCRIPT_SANDBOXING = NO;
@@ -523,7 +413,7 @@
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 1.1.3;
+				MARKETING_VERSION = 1.0.8;
 				OTHER_SWIFT_FLAGS = "$(inherited) \"-D\" \"COCOAPODS\" \"-DDEBUG\"";
 				PRODUCT_BUNDLE_IDENTIFIER = app.timesafari;
 				PRODUCT_NAME = "$(TARGET_NAME)";
@@ -539,9 +429,8 @@
 			baseConfigurationReference = E2E9297D5D02C549106C77F9 /* Pods-App.release.xcconfig */;
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
-				CODE_SIGN_ENTITLEMENTS = App/App.entitlements;
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 48;
+				CURRENT_PROJECT_VERSION = 41;
 				DEVELOPMENT_TEAM = GM3FS5JQPH;
 				ENABLE_APP_SANDBOX = NO;
 				ENABLE_USER_SCRIPT_SANDBOXING = NO;
@@ -551,7 +440,7 @@
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 1.1.3;
+				MARKETING_VERSION = 1.0.8;
 				PRODUCT_BUNDLE_IDENTIFIER = app.timesafari;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = "";
@@ -561,80 +450,6 @@
 			};
 			name = Release;
 		};
-		C86585E12ED456DE00824752 /* Debug */ = {
-			isa = XCBuildConfiguration;
-			buildSettings = {
-				ASSETCATALOG_COMPILER_GENERATE_SWIFT_ASSET_SYMBOL_EXTENSIONS = YES;
-				CLANG_CXX_LANGUAGE_STANDARD = "gnu++20";
-				CLANG_ENABLE_OBJC_WEAK = YES;
-				CODE_SIGN_ENTITLEMENTS = TimeSafariShareExtension/TimeSafariShareExtension.entitlements;
-				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 1;
-				DEVELOPMENT_TEAM = GM3FS5JQPH;
-				GCC_C_LANGUAGE_STANDARD = gnu17;
-				GENERATE_INFOPLIST_FILE = YES;
-				INFOPLIST_FILE = TimeSafariShareExtension/Info.plist;
-				INFOPLIST_KEY_CFBundleDisplayName = TimeSafariShareExtension;
-				INFOPLIST_KEY_NSHumanReadableCopyright = "";
-				IPHONEOS_DEPLOYMENT_TARGET = 26.1;
-				LD_RUNPATH_SEARCH_PATHS = (
-					"$(inherited)",
-					"@executable_path/Frameworks",
-					"@executable_path/../../Frameworks",
-				);
-				LOCALIZATION_PREFERS_STRING_CATALOGS = YES;
-				MARKETING_VERSION = 1.0;
-				MTL_ENABLE_DEBUG_INFO = INCLUDE_SOURCE;
-				MTL_FAST_MATH = YES;
-				PRODUCT_BUNDLE_IDENTIFIER = app.timesafari.TimeSafariShareExtension;
-				PRODUCT_NAME = "$(TARGET_NAME)";
-				SKIP_INSTALL = YES;
-				STRING_CATALOG_GENERATE_SYMBOLS = YES;
-				SWIFT_ACTIVE_COMPILATION_CONDITIONS = "DEBUG $(inherited)";
-				SWIFT_APPROACHABLE_CONCURRENCY = YES;
-				SWIFT_EMIT_LOC_STRINGS = YES;
-				SWIFT_UPCOMING_FEATURE_MEMBER_IMPORT_VISIBILITY = YES;
-				SWIFT_VERSION = 5.0;
-				TARGETED_DEVICE_FAMILY = "1,2";
-			};
-			name = Debug;
-		};
-		C86585E22ED456DE00824752 /* Release */ = {
-			isa = XCBuildConfiguration;
-			buildSettings = {
-				ASSETCATALOG_COMPILER_GENERATE_SWIFT_ASSET_SYMBOL_EXTENSIONS = YES;
-				CLANG_CXX_LANGUAGE_STANDARD = "gnu++20";
-				CLANG_ENABLE_OBJC_WEAK = YES;
-				CODE_SIGN_ENTITLEMENTS = TimeSafariShareExtension/TimeSafariShareExtension.entitlements;
-				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 1;
-				DEVELOPMENT_TEAM = GM3FS5JQPH;
-				GCC_C_LANGUAGE_STANDARD = gnu17;
-				GENERATE_INFOPLIST_FILE = YES;
-				INFOPLIST_FILE = TimeSafariShareExtension/Info.plist;
-				INFOPLIST_KEY_CFBundleDisplayName = TimeSafariShareExtension;
-				INFOPLIST_KEY_NSHumanReadableCopyright = "";
-				IPHONEOS_DEPLOYMENT_TARGET = 26.1;
-				LD_RUNPATH_SEARCH_PATHS = (
-					"$(inherited)",
-					"@executable_path/Frameworks",
-					"@executable_path/../../Frameworks",
-				);
-				LOCALIZATION_PREFERS_STRING_CATALOGS = YES;
-				MARKETING_VERSION = 1.0;
-				MTL_FAST_MATH = YES;
-				PRODUCT_BUNDLE_IDENTIFIER = app.timesafari.TimeSafariShareExtension;
-				PRODUCT_NAME = "$(TARGET_NAME)";
-				SKIP_INSTALL = YES;
-				STRING_CATALOG_GENERATE_SYMBOLS = YES;
-				SWIFT_APPROACHABLE_CONCURRENCY = YES;
-				SWIFT_EMIT_LOC_STRINGS = YES;
-				SWIFT_UPCOMING_FEATURE_MEMBER_IMPORT_VISIBILITY = YES;
-				SWIFT_VERSION = 5.0;
-				TARGETED_DEVICE_FAMILY = "1,2";
-			};
-			name = Release;
-		};
 /* End XCBuildConfiguration section */
 
 /* Begin XCConfigurationList section */
@@ -656,15 +471,6 @@
 			defaultConfigurationIsVisible = 0;
 			defaultConfigurationName = Release;
 		};
-		C86585E42ED456DE00824752 /* Build configuration list for PBXNativeTarget "TimeSafariShareExtension" */ = {
-			isa = XCConfigurationList;
-			buildConfigurations = (
-				C86585E12ED456DE00824752 /* Debug */,
-				C86585E22ED456DE00824752 /* Release */,
-			);
-			defaultConfigurationIsVisible = 0;
-			defaultConfigurationName = Release;
-		};
 /* End XCConfigurationList section */
 	};
 	rootObject = 504EC2FC1FED79650016851F /* Project object */;

ios/App/App.xcodeproj/xcshareddata/xcschemes/App.xcscheme

@@ -1,77 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<Scheme
-   LastUpgradeVersion = "1630"
-   version = "1.7">
-   <BuildAction
-      parallelizeBuildables = "YES"
-      buildImplicitDependencies = "YES">
-      <BuildActionEntries>
-         <BuildActionEntry
-            buildForTesting = "YES"
-            buildForRunning = "YES"
-            buildForProfiling = "YES"
-            buildForArchiving = "YES"
-            buildForAnalyzing = "YES">
-            <BuildableReference
-               BuildableIdentifier = "primary"
-               BlueprintIdentifier = "504EC3031FED79650016851F"
-               BuildableName = "App.app"
-               BlueprintName = "App"
-               ReferencedContainer = "container:App.xcodeproj">
-            </BuildableReference>
-         </BuildActionEntry>
-      </BuildActionEntries>
-   </BuildAction>
-   <TestAction
-      buildConfiguration = "Debug"
-      selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
-      selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
-      shouldUseLaunchSchemeArgsEnv = "YES"
-      shouldAutocreateTestPlan = "YES">
-   </TestAction>
-   <LaunchAction
-      buildConfiguration = "Debug"
-      selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
-      selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
-      launchStyle = "0"
-      useCustomWorkingDirectory = "NO"
-      ignoresPersistentStateOnLaunch = "NO"
-      debugDocumentVersioning = "YES"
-      debugServiceExtension = "internal"
-      allowLocationSimulation = "YES">
-      <BuildableProductRunnable
-         runnableDebuggingMode = "0">
-         <BuildableReference
-            BuildableIdentifier = "primary"
-            BlueprintIdentifier = "504EC3031FED79650016851F"
-            BuildableName = "App.app"
-            BlueprintName = "App"
-            ReferencedContainer = "container:App.xcodeproj">
-         </BuildableReference>
-      </BuildableProductRunnable>
-   </LaunchAction>
-   <ProfileAction
-      buildConfiguration = "Release"
-      shouldUseLaunchSchemeArgsEnv = "YES"
-      savedToolIdentifier = ""
-      useCustomWorkingDirectory = "NO"
-      debugDocumentVersioning = "YES">
-      <BuildableProductRunnable
-         runnableDebuggingMode = "0">
-         <BuildableReference
-            BuildableIdentifier = "primary"
-            BlueprintIdentifier = "504EC3031FED79650016851F"
-            BuildableName = "App.app"
-            BlueprintName = "App"
-            ReferencedContainer = "container:App.xcodeproj">
-         </BuildableReference>
-      </BuildableProductRunnable>
-   </ProfileAction>
-   <AnalyzeAction
-      buildConfiguration = "Debug">
-   </AnalyzeAction>
-   <ArchiveAction
-      buildConfiguration = "Release"
-      revealArchiveInOrganizer = "YES">
-   </ArchiveAction>
-</Scheme>

ios/App/App/App.entitlements

@@ -1,10 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
-<plist version="1.0">
-<dict>
-	<key>com.apple.security.application-groups</key>
-	<array>
-		<string>group.app.timesafari</string>
-	</array>
-</dict>
-</plist>

ios/App/App/AppDelegate.swift

@@ -39,33 +39,6 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
     }
 
     func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] = [:]) -> Bool {
-        // Check if this is a shared-photo deep link and store image data in a way JS can access
-        if url.scheme == "timesafari" && url.host == "shared-photo" {
-            // Try to get shared image from App Group and store it in a temp file that JS can read
-            // This is a workaround until the plugin is properly registered
-            if let sharedData = getSharedImageData() {
-                // Write to a temp file in the app's Documents directory that JavaScript can read via Filesystem plugin
-                let fileManager = FileManager.default
-                if let documentsDir = fileManager.urls(for: .documentDirectory, in: .userDomainMask).first {
-                    let tempFileURL = documentsDir.appendingPathComponent("timesafari_shared_photo.json")
-                    
-                    // Create JSON data
-                    let jsonData: [String: String] = [
-                        "base64": sharedData["base64"] ?? "",
-                        "fileName": sharedData["fileName"] ?? ""
-                    ]
-                    
-                    if let json = try? JSONSerialization.data(withJSONObject: jsonData, options: []) {
-                        do {
-                            try json.write(to: tempFileURL)
-                        } catch {
-                            // Error writing temp file - will be handled by JS layer
-                        }
-                    }
-                }
-            }
-        }
-        
         // Called when the app was launched with a url. Feel free to add additional processing here,
         // but if you want the App API to support tracking app url opens, make sure to keep this call
         return ApplicationDelegateProxy.shared.application(app, open: url, options: options)
@@ -77,30 +50,5 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
         // tracking app url opens, make sure to keep this call
         return ApplicationDelegateProxy.shared.application(application, continue: userActivity, restorationHandler: restorationHandler)
     }
-    
-    /**
-     * Check for shared image from Share Extension
-     * Reads from App Group UserDefaults and returns shared image data if available
-     *
-     * @returns Dictionary with "base64" and "fileName" keys, or nil if no shared image
-     */
-    func getSharedImageData() -> [String: String]? {
-        let appGroupIdentifier = "group.app.timesafari"
-        guard let userDefaults = UserDefaults(suiteName: appGroupIdentifier) else {
-            return nil
-        }
-        
-        guard let base64 = userDefaults.string(forKey: "sharedPhotoBase64"),
-              let fileName = userDefaults.string(forKey: "sharedPhotoFileName") else {
-            return nil
-        }
-        
-        // Clear the shared data after reading
-        userDefaults.removeObject(forKey: "sharedPhotoBase64")
-        userDefaults.removeObject(forKey: "sharedPhotoFileName")
-        userDefaults.synchronize()
-        
-        return ["base64": base64, "fileName": fileName]
-    }
 
 }

ios/App/App/ShareImageBridge.swift

@@ -1,48 +0,0 @@
-import Foundation
-
-/**
- * Share Image Bridge
- *
- * Provides a bridge between JavaScript and native iOS code to access
- * shared images stored in App Group UserDefaults by the Share Extension.
- *
- * This bridge allows the JavaScript layer to read shared image data
- * that was stored by the Share Extension.
- *
- * Note: This class doesn't need Capacitor - it's a simple Swift utility
- * that reads from App Group UserDefaults. The JavaScript bridge will be
- * implemented separately.
- */
-@objc(ShareImageBridge)
-public class ShareImageBridge: NSObject {
-    
-    private static let appGroupIdentifier = "group.app.timesafari"
-    private static let sharedPhotoBase64Key = "sharedPhotoBase64"
-    private static let sharedPhotoFileNameKey = "sharedPhotoFileName"
-    
-    /**
-     * Get shared image data from App Group UserDefaults
-     * Called from JavaScript via Capacitor bridge
-     *
-     * @returns Dictionary with "base64" and "fileName" keys, or nil if no shared image
-     */
-    @objc public static func getSharedImageData() -> [String: String]? {
-        guard let userDefaults = UserDefaults(suiteName: appGroupIdentifier) else {
-            print("ShareImageBridge: Failed to access App Group UserDefaults")
-            return nil
-        }
-        
-        guard let base64 = userDefaults.string(forKey: sharedPhotoBase64Key),
-              let fileName = userDefaults.string(forKey: sharedPhotoFileNameKey) else {
-            return nil
-        }
-        
-        // Clear the shared data after reading
-        userDefaults.removeObject(forKey: sharedPhotoBase64Key)
-        userDefaults.removeObject(forKey: sharedPhotoFileNameKey)
-        userDefaults.synchronize()
-        
-        return ["base64": base64, "fileName": fileName]
-    }
-}
-

ios/App/App/ShareImagePlugin.swift

@@ -1,28 +0,0 @@
-import Foundation
-import Capacitor
-
-/**
- * Share Image Plugin
- *
- * Capacitor plugin that exposes ShareImageBridge functionality to JavaScript.
- * Allows JavaScript to retrieve shared images from App Group UserDefaults.
- */
-@objc(ShareImagePlugin)
-public class ShareImagePlugin: CAPPlugin {
-    
-    @objc func getSharedImageData(_ call: CAPPluginCall) {
-        guard let sharedData = ShareImageBridge.getSharedImageData() else {
-            call.resolve(["success": false, "data": NSNull()])
-            return
-        }
-        
-        call.resolve([
-            "success": true,
-            "data": [
-                "base64": sharedData["base64"] ?? "",
-                "fileName": sharedData["fileName"] ?? ""
-            ]
-        ])
-    }
-}
-

ios/App/TimeSafariShareExtension/Info.plist

@@ -1,21 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
-<plist version="1.0">
-<dict>
-	<key>NSExtension</key>
-	<dict>
-		<key>NSExtensionAttributes</key>
-		<dict>
-			<key>NSExtensionActivationRule</key>
-			<dict>
-				<key>NSExtensionActivationSupportsImageWithMaxCount</key>
-				<integer>1</integer>
-			</dict>
-		</dict>
-		<key>NSExtensionPointIdentifier</key>
-		<string>com.apple.share-services</string>
-		<key>NSExtensionPrincipalClass</key>
-		<string>$(PRODUCT_MODULE_NAME).ShareViewController</string>
-	</dict>
-</dict>
-</plist>

ios/App/TimeSafariShareExtension/ShareViewController.swift

@@ -1,170 +0,0 @@
-//
-//  ShareViewController.swift
-//  TimeSafariShareExtension
-//
-//  Created by Aardimus on 11/24/25.
-//
-
-import UIKit
-import Social
-import UniformTypeIdentifiers
-
-class ShareViewController: SLComposeServiceViewController {
-    
-    private let appGroupIdentifier = "group.app.timesafari"
-    private let sharedPhotoBase64Key = "sharedPhotoBase64"
-    private let sharedPhotoFileNameKey = "sharedPhotoFileName"
-    
-    override func viewDidLoad() {
-        super.viewDidLoad()
-        
-        // Set placeholder text (required for SLComposeServiceViewController)
-        self.placeholder = "Share image to TimeSafari"
-        
-        // Validate content on load
-        self.validateContent()
-    }
-    
-    override func isContentValid() -> Bool {
-        // Validate that we have image attachments
-        guard let extensionContext = extensionContext else {
-            return false
-        }
-        
-        guard let inputItems = extensionContext.inputItems as? [NSExtensionItem] else {
-            return false
-        }
-        
-        for item in inputItems {
-            if let attachments = item.attachments {
-                for attachment in attachments {
-                    if attachment.hasItemConformingToTypeIdentifier(UTType.image.identifier) {
-                        return true
-                    }
-                }
-            }
-        }
-        
-        return false
-    }
-
-    override func didSelectPost() {
-        // Extract and process the shared image
-        guard let extensionContext = extensionContext else {
-            return
-        }
-        
-        guard let inputItems = extensionContext.inputItems as? [NSExtensionItem] else {
-            extensionContext.completeRequest(returningItems: [], completionHandler: nil)
-            return
-        }
-        
-        // Process the first image found
-        processSharedImage(from: inputItems) { [weak self] success in
-            guard let self = self else {
-                extensionContext.completeRequest(returningItems: [], completionHandler: nil)
-                return
-            }
-            
-            if success {
-                // Open the main app via deep link
-                self.openMainApp()
-            }
-            
-            // Complete the extension context
-            extensionContext.completeRequest(returningItems: [], completionHandler: nil)
-        }
-    }
-    
-    private func processSharedImage(from items: [NSExtensionItem], completion: @escaping (Bool) -> Void) {
-        // Find the first image attachment
-        for item in items {
-            guard let attachments = item.attachments else {
-                continue
-            }
-            
-            for attachment in attachments {
-                if attachment.hasItemConformingToTypeIdentifier(UTType.image.identifier) {
-                    attachment.loadItem(forTypeIdentifier: UTType.image.identifier, options: nil) { [weak self] (data, error) in
-                        guard let self = self else {
-                            completion(false)
-                            return
-                        }
-                        
-                        if let error = error {
-                            completion(false)
-                            return
-                        }
-                        
-                        // Handle different image data types
-                        var imageData: Data?
-                        var fileName: String = "shared-image.jpg"
-                        
-                        if let url = data as? URL {
-                            // Image provided as file URL
-                            imageData = try? Data(contentsOf: url)
-                            fileName = url.lastPathComponent
-                        } else if let image = data as? UIImage {
-                            // Image provided as UIImage
-                            imageData = image.jpegData(compressionQuality: 0.9)
-                            fileName = "shared-image.jpg"
-                        } else if let data = data as? Data {
-                            // Image provided as raw Data
-                            imageData = data
-                            fileName = "shared-image.jpg"
-                        }
-                        
-                        guard let finalImageData = imageData else {
-                            completion(false)
-                            return
-                        }
-                        
-                        // Convert to base64
-                        let base64String = finalImageData.base64EncodedString()
-                        
-                        // Store in App Group UserDefaults
-                        guard let userDefaults = UserDefaults(suiteName: self.appGroupIdentifier) else {
-                            completion(false)
-                            return
-                        }
-                        
-                        userDefaults.set(base64String, forKey: self.sharedPhotoBase64Key)
-                        userDefaults.set(fileName, forKey: self.sharedPhotoFileNameKey)
-                        userDefaults.synchronize()
-                        
-                        completion(true)
-                    }
-                    return // Process only the first image
-                }
-            }
-        }
-        
-        // No image found
-        completion(false)
-    }
-    
-    private func openMainApp() {
-        // Open the main app via deep link
-        guard let url = URL(string: "timesafari://shared-photo") else {
-            return
-        }
-        
-        var responder: UIResponder? = self
-        while responder != nil {
-            if let application = responder as? UIApplication {
-                application.open(url, options: [:], completionHandler: nil)
-                return
-            }
-            responder = responder?.next
-        }
-        
-        // Fallback: use extension context
-        extensionContext?.open(url, completionHandler: nil)
-    }
-
-    override func configurationItems() -> [Any]! {
-        // No additional configuration options needed
-        return []
-    }
-
-}

ios/App/TimeSafariShareExtension/TimeSafariShareExtension.entitlements

@@ -1,10 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
-<plist version="1.0">
-<dict>
-	<key>com.apple.security.application-groups</key>
-	<array>
-		<string>group.app.timesafari</string>
-	</array>
-</dict>
-</plist>

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "timesafari",
-  "version": "1.1.4-beta",
+  "version": "1.1.0-beta",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "timesafari",
-      "version": "1.1.4-beta",
+      "version": "1.1.0-beta",
       "dependencies": {
         "@capacitor-community/electron": "^5.0.1",
         "@capacitor-community/sqlite": "6.0.2",
@@ -27,8 +27,6 @@
         "@ethersproject/hdnode": "^5.7.0",
         "@ethersproject/wallet": "^5.8.0",
         "@fortawesome/fontawesome-svg-core": "^6.5.1",
-        "@fortawesome/free-brands-svg-icons": "^7.1.0",
-        "@fortawesome/free-regular-svg-icons": "^6.7.2",
         "@fortawesome/free-solid-svg-icons": "^6.5.1",
         "@fortawesome/vue-fontawesome": "^3.0.6",
         "@jlongster/sql.js": "^1.6.7",
@@ -92,7 +90,6 @@
         "vue": "3.5.13",
         "vue-axios": "^3.5.2",
         "vue-facing-decorator": "3.0.4",
-        "vue-markdown-render": "^2.2.1",
         "vue-picture-cropper": "^0.7.0",
         "vue-qrcode-reader": "^5.5.3",
         "vue-router": "^4.5.0",
@@ -109,7 +106,6 @@
         "@types/js-yaml": "^4.0.9",
         "@types/leaflet": "^1.9.8",
         "@types/luxon": "^3.4.2",
-        "@types/markdown-it": "^14.1.2",
         "@types/node": "^20.14.11",
         "@types/node-fetch": "^2.6.12",
         "@types/ramda": "^0.29.11",
@@ -6790,36 +6786,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/@fortawesome/free-brands-svg-icons": {
-      "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-7.1.0.tgz",
-      "integrity": "sha512-9byUd9bgNfthsZAjBl6GxOu1VPHgBuRUP9juI7ZoM98h8xNPTCTagfwUFyYscdZq4Hr7gD1azMfM9s5tIWKZZA==",
-      "dependencies": {
-        "@fortawesome/fontawesome-common-types": "7.1.0"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/@fortawesome/free-brands-svg-icons/node_modules/@fortawesome/fontawesome-common-types": {
-      "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-7.1.0.tgz",
-      "integrity": "sha512-l/BQM7fYntsCI//du+6sEnHOP6a74UixFyOYUyz2DLMXKx+6DEhfR3F2NYGE45XH1JJuIamacb4IZs9S0ZOWLA==",
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/@fortawesome/free-regular-svg-icons": {
-      "version": "6.7.2",
-      "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.7.2.tgz",
-      "integrity": "sha512-7Z/ur0gvCMW8G93dXIQOkQqHo2M5HLhYrRVC0//fakJXxcF1VmMPsxnG6Ee8qEylA8b8Q3peQXWMNZ62lYF28g==",
-      "dependencies": {
-        "@fortawesome/fontawesome-common-types": "6.7.2"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/@fortawesome/free-solid-svg-icons": {
       "version": "6.7.2",
       "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.7.2.tgz",
@@ -10181,12 +10147,6 @@
         "@types/geojson": "*"
       }
     },
-    "node_modules/@types/linkify-it": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-5.0.0.tgz",
-      "integrity": "sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==",
-      "dev": true
-    },
     "node_modules/@types/luxon": {
       "version": "3.7.1",
       "resolved": "https://registry.npmjs.org/@types/luxon/-/luxon-3.7.1.tgz",
@@ -10194,22 +10154,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/@types/markdown-it": {
-      "version": "14.1.2",
-      "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-14.1.2.tgz",
-      "integrity": "sha512-promo4eFwuiW+TfGxhi+0x3czqTYJkG8qB17ZUJiVF10Xm7NLVRSLUsfRTU/6h1e24VvRnXCx+hG7li58lkzog==",
-      "dev": true,
-      "dependencies": {
-        "@types/linkify-it": "^5",
-        "@types/mdurl": "^2"
-      }
-    },
-    "node_modules/@types/mdurl": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/@types/mdurl/-/mdurl-2.0.0.tgz",
-      "integrity": "sha512-RGdgjQUZba5p6QEFAVx2OGb8rQDL/cPRG7GiedRzMcJ1tYnUANBncjbSB1NRGwbvjcPeikRABz2nshyPk1bhWg==",
-      "dev": true
-    },
     "node_modules/@types/minimist": {
       "version": "1.2.5",
       "resolved": "https://registry.npmjs.org/@types/minimist/-/minimist-1.2.5.tgz",
@@ -32939,61 +32883,6 @@
         "vue": "^3.0.0"
       }
     },
-    "node_modules/vue-markdown-render": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/vue-markdown-render/-/vue-markdown-render-2.2.1.tgz",
-      "integrity": "sha512-XkYnC0PMdbs6Vy6j/gZXSvCuOS0787Se5COwXlepRqiqPiunyCIeTPQAO2XnB4Yl04EOHXwLx5y6IuszMWSgyQ==",
-      "dependencies": {
-        "markdown-it": "^13.0.2"
-      },
-      "peerDependencies": {
-        "vue": "^3.3.4"
-      }
-    },
-    "node_modules/vue-markdown-render/node_modules/entities": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-3.0.1.tgz",
-      "integrity": "sha512-WiyBqoomrwMdFG1e0kqvASYfnlb0lp8M5o5Fw2OFq1hNZxxcNk8Ik0Xm7LxzBhuidnZB/UtBqVCgUz3kBOP51Q==",
-      "engines": {
-        "node": ">=0.12"
-      },
-      "funding": {
-        "url": "https://github.com/fb55/entities?sponsor=1"
-      }
-    },
-    "node_modules/vue-markdown-render/node_modules/linkify-it": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-4.0.1.tgz",
-      "integrity": "sha512-C7bfi1UZmoj8+PQx22XyeXCuBlokoyWQL5pWSP+EI6nzRylyThouddufc2c1NDIcP9k5agmN9fLpA7VNJfIiqw==",
-      "dependencies": {
-        "uc.micro": "^1.0.1"
-      }
-    },
-    "node_modules/vue-markdown-render/node_modules/markdown-it": {
-      "version": "13.0.2",
-      "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-13.0.2.tgz",
-      "integrity": "sha512-FtwnEuuK+2yVU7goGn/MJ0WBZMM9ZPgU9spqlFs7/A/pDIUNSOQZhUgOqYCficIuR2QaFnrt8LHqBWsbTAoI5w==",
-      "dependencies": {
-        "argparse": "^2.0.1",
-        "entities": "~3.0.1",
-        "linkify-it": "^4.0.1",
-        "mdurl": "^1.0.1",
-        "uc.micro": "^1.0.5"
-      },
-      "bin": {
-        "markdown-it": "bin/markdown-it.js"
-      }
-    },
-    "node_modules/vue-markdown-render/node_modules/mdurl": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-1.0.1.tgz",
-      "integrity": "sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g=="
-    },
-    "node_modules/vue-markdown-render/node_modules/uc.micro": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.6.tgz",
-      "integrity": "sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA=="
-    },
     "node_modules/vue-picture-cropper": {
       "version": "0.7.0",
       "resolved": "https://registry.npmjs.org/vue-picture-cropper/-/vue-picture-cropper-0.7.0.tgz",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "timesafari",
-  "version": "1.1.4-beta",
+  "version": "1.1.0-beta",
   "description": "Time Safari Application",
   "author": {
     "name": "Time Safari Team"
@@ -106,7 +106,7 @@
     "guard": "bash ./scripts/build-arch-guard.sh",
     "guard:test": "bash ./scripts/build-arch-guard.sh --staged",
     "guard:setup": "npm run prepare && echo '✅ Build Architecture Guard is now active!'",
-    "clean:android": "./scripts/uninstall-android.sh",
+    "clean:android": "./scripts/clean-android.sh",
     "clean:ios": "rm -rf ios/App/build ios/App/Pods ios/App/output ios/App/App/public ios/DerivedData ios/capacitor-cordova-ios-plugins ios/App/App/capacitor.config.json ios/App/App/config.xml || true",
     "clean:electron": "./scripts/build-electron.sh --clean",
     "clean:all": "npm run clean:ios && npm run clean:android && npm run clean:electron",
@@ -136,6 +136,7 @@
     "*.{js,ts,vue,css,json,yml,yaml}": "eslint --fix || true",
     "*.{md,markdown,mdc}": "markdownlint-cli2 --fix"
   },
+
   "dependencies": {
     "@capacitor-community/electron": "^5.0.1",
     "@capacitor-community/sqlite": "6.0.2",
@@ -156,8 +157,6 @@
     "@ethersproject/hdnode": "^5.7.0",
     "@ethersproject/wallet": "^5.8.0",
     "@fortawesome/fontawesome-svg-core": "^6.5.1",
-    "@fortawesome/free-brands-svg-icons": "^7.1.0",
-    "@fortawesome/free-regular-svg-icons": "^6.7.2",
     "@fortawesome/free-solid-svg-icons": "^6.5.1",
     "@fortawesome/vue-fontawesome": "^3.0.6",
     "@jlongster/sql.js": "^1.6.7",
@@ -221,7 +220,6 @@
     "vue": "3.5.13",
     "vue-axios": "^3.5.2",
     "vue-facing-decorator": "3.0.4",
-    "vue-markdown-render": "^2.2.1",
     "vue-picture-cropper": "^0.7.0",
     "vue-qrcode-reader": "^5.5.3",
     "vue-router": "^4.5.0",
@@ -238,7 +236,6 @@
     "@types/js-yaml": "^4.0.9",
     "@types/leaflet": "^1.9.8",
     "@types/luxon": "^3.4.2",
-    "@types/markdown-it": "^14.1.2",
     "@types/node": "^20.14.11",
     "@types/node-fetch": "^2.6.12",
     "@types/ramda": "^0.29.11",

scripts/build-android.sh

@@ -22,7 +22,6 @@
 #   --sync                  Sync Capacitor only
 #   --assets                Generate assets only
 #   --deploy                Deploy APK to connected device
-#   --uninstall             Uninstall app from connected device
 #   -h, --help             Show this help message
 #   -v, --verbose          Enable verbose logging
 #
@@ -197,7 +196,6 @@ SYNC_ONLY=false
 ASSETS_ONLY=false
 DEPLOY_APP=false
 AUTO_RUN=false
-UNINSTALL=false
 CUSTOM_API_IP=""
 
 # Function to parse Android-specific arguments
@@ -248,9 +246,6 @@ parse_android_args() {
             --auto-run)
                 AUTO_RUN=true
                 ;;
-            --uninstall)
-                UNINSTALL=true
-                ;;
             --api-ip)
                 if [ $((i + 1)) -lt ${#args[@]} ]; then
                     CUSTOM_API_IP="${args[$((i + 1))]}"
@@ -296,7 +291,6 @@ print_android_usage() {
     echo "  --assets                Generate assets only"
     echo "  --deploy                Deploy APK to connected device"
     echo "  --auto-run              Auto-run app after build"
-    echo "  --uninstall             Uninstall app from connected device"
     echo "  --api-ip <ip>          Custom IP address for claim API (defaults to 10.0.2.2)"
     echo ""
     echo "Common Options:"
@@ -311,7 +305,6 @@ print_android_usage() {
     echo "  $0 --clean             # Clean only"
     echo "  $0 --sync              # Sync only"
     echo "  $0 --deploy            # Build and deploy to device"
-    echo "  $0 --uninstall         # Uninstall app from device"
     echo "  $0 --dev                    # Dev build with default 10.0.2.2"
     echo "  $0 --dev --api-ip 192.168.1.100  # Dev build with custom API IP"
     echo ""
@@ -358,18 +351,8 @@ fi
 # Setup application directories
 setup_app_directories
 
-# Load environment-specific .env file if it exists
-env_file=".env.$BUILD_MODE"
-if [ -f "$env_file" ]; then
-    load_env_file "$env_file"
-else
-    log_debug "No $env_file file found, using default environment"
-fi
-
-# Load .env file if it exists (fallback)
-if [ -f ".env" ]; then
-    load_env_file ".env"
-fi
+# Load environment from .env file if it exists
+load_env_file ".env"
 
 # Handle clean-only mode
 if [ "$CLEAN_ONLY" = true ]; then
@@ -424,33 +407,14 @@ safe_execute "Validating asset configuration" "npm run assets:validate" || {
     log_info "If you encounter build failures, please run 'npm install' first to ensure all dependencies are available."
 }
 
-# Step 2: Uninstall Android app
-if [ "$UNINSTALL" = true ]; then
-    log_info "Uninstall: uninstalling app from device"
-    safe_execute "Uninstalling Android app" "./scripts/uninstall-android.sh" || exit 1
-    log_success "Uninstall completed successfully!"
-    exit 0
-fi
+# Step 2: Clean Android app
+safe_execute "Cleaning Android app" "npm run clean:android" || exit 1
 
 # Step 3: Clean dist directory
 log_info "Cleaning dist directory..."
 clean_build_artifacts "dist"
 
-# Step 4: Run TypeScript type checking for test and production builds
-if [ "$BUILD_MODE" = "production" ] || [ "$BUILD_MODE" = "test" ]; then
-    log_info "Running TypeScript type checking for $BUILD_MODE mode..."
-    
-    if ! measure_time npm run type-check; then
-        log_error "TypeScript type checking failed for $BUILD_MODE mode!"
-        exit 2
-    fi
-    
-    log_success "TypeScript type checking completed for $BUILD_MODE mode"
-else
-    log_debug "Skipping TypeScript type checking for development mode"
-fi
-
-# Step 5: Build Capacitor version with mode
+# Step 4: Build Capacitor version with mode
 if [ "$BUILD_MODE" = "development" ]; then
     safe_execute "Building Capacitor version (development)" "npm run build:capacitor" || exit 3
 elif [ "$BUILD_MODE" = "test" ]; then
@@ -459,23 +423,23 @@ elif [ "$BUILD_MODE" = "production" ]; then
     safe_execute "Building Capacitor version (production)" "npm run build:capacitor -- --mode production" || exit 3
 fi
 
-# Step 6: Clean Gradle build
+# Step 5: Clean Gradle build
 safe_execute "Cleaning Gradle build" "cd android && ./gradlew clean && cd .." || exit 4
 
-# Step 7: Build based on type
+# Step 6: Build based on type
 if [ "$BUILD_TYPE" = "debug" ]; then
     safe_execute "Assembling debug build" "cd android && ./gradlew assembleDebug && cd .." || exit 5
 elif [ "$BUILD_TYPE" = "release" ]; then
     safe_execute "Assembling release build" "cd android && ./gradlew assembleRelease && cd .." || exit 5
 fi
 
-# Step 8: Sync with Capacitor
+# Step 7: Sync with Capacitor
 safe_execute "Syncing with Capacitor" "npx cap sync android" || exit 6
 
-# Step 9: Generate assets
+# Step 8: Generate assets
 safe_execute "Generating assets" "npx capacitor-assets generate --android" || exit 7
 
-# Step 10: Build APK/AAB if requested
+# Step 9: Build APK/AAB if requested
 if [ "$BUILD_APK" = true ]; then
     if [ "$BUILD_TYPE" = "debug" ]; then
         safe_execute "Building debug APK" "cd android && ./gradlew assembleDebug && cd .." || exit 5
@@ -488,7 +452,7 @@ if [ "$BUILD_AAB" = true ]; then
     safe_execute "Building AAB" "cd android && ./gradlew bundleRelease && cd .." || exit 5
 fi
 
-# Step 11: Auto-run app if requested
+# Step 10: Auto-run app if requested
 if [ "$AUTO_RUN" = true ]; then
     log_step "Auto-running Android app..."
     safe_execute "Launching app" "npx cap run android" || {
@@ -499,7 +463,7 @@ if [ "$AUTO_RUN" = true ]; then
     log_success "Android app launched successfully!"
 fi
 
-# Step 12: Open Android Studio if requested
+# Step 11: Open Android Studio if requested
 if [ "$OPEN_STUDIO" = true ]; then
     safe_execute "Opening Android Studio" "npx cap open android" || exit 8
 fi

scripts/build-electron.sh

@@ -341,19 +341,7 @@ main_electron_build() {
     # Setup environment
     setup_build_env "electron" "$BUILD_MODE"
     setup_app_directories
-    
-    # Load environment-specific .env file if it exists
-    env_file=".env.$BUILD_MODE"
-    if [ -f "$env_file" ]; then
-        load_env_file "$env_file"
-    else
-        log_debug "No $env_file file found, using default environment"
-    fi
-    
-    # Load .env file if it exists (fallback)
-    if [ -f ".env" ]; then
-        load_env_file ".env"
-    fi
+    load_env_file ".env"
     
     # Step 1: Clean Electron build artifacts
     clean_electron_artifacts

scripts/build-ios.sh

@@ -324,18 +324,8 @@ fi
 # Setup application directories
 setup_app_directories
 
-# Load environment-specific .env file if it exists
-env_file=".env.$BUILD_MODE"
-if [ -f "$env_file" ]; then
-    load_env_file "$env_file"
-else
-    log_debug "No $env_file file found, using default environment"
-fi
-
-# Load .env file if it exists (fallback)
-if [ -f ".env" ]; then
-    load_env_file ".env"
-fi
+# Load environment from .env file if it exists
+load_env_file ".env"
 
 # Validate iOS environment
 validate_ios_environment
@@ -381,21 +371,7 @@ safe_execute "Cleaning iOS build" "clean_ios_build" || exit 1
 log_info "Cleaning dist directory..."
 clean_build_artifacts "dist"
 
-# Step 4: Run TypeScript type checking for test and production builds
-if [ "$BUILD_MODE" = "production" ] || [ "$BUILD_MODE" = "test" ]; then
-    log_info "Running TypeScript type checking for $BUILD_MODE mode..."
-    
-    if ! measure_time npm run type-check; then
-        log_error "TypeScript type checking failed for $BUILD_MODE mode!"
-        exit 2
-    fi
-    
-    log_success "TypeScript type checking completed for $BUILD_MODE mode"
-else
-    log_debug "Skipping TypeScript type checking for development mode"
-fi
-
-# Step 5: Build Capacitor version with mode
+# Step 4: Build Capacitor version with mode
 if [ "$BUILD_MODE" = "development" ]; then
     safe_execute "Building Capacitor version (development)" "npm run build:capacitor" || exit 3
 elif [ "$BUILD_MODE" = "test" ]; then
@@ -404,149 +380,16 @@ elif [ "$BUILD_MODE" = "production" ]; then
     safe_execute "Building Capacitor version (production)" "npm run build:capacitor -- --mode production" || exit 3
 fi
 
-# Step 6: Install CocoaPods dependencies (with Xcode 26 workaround)
-# ===================================================================
-# WORKAROUND: Xcode 26 / CocoaPods Compatibility Issue
-# ===================================================================
-# Xcode 26 uses project format version 70, but CocoaPods' xcodeproj gem
-# (1.27.0) only supports up to version 56. This causes pod install to fail.
-#
-# This workaround temporarily downgrades the project format to 56, runs
-# pod install, then restores it to 70. Xcode will automatically upgrade
-# it back to 70 when opened, which is fine.
-#
-# NOTE: Both explicit pod install AND Capacitor sync (which runs pod install
-# internally) need this workaround. See run_pod_install_with_workaround()
-# and run_cap_sync_with_workaround() functions below.
-#
-# TO REMOVE THIS WORKAROUND IN THE FUTURE:
-# 1. Check if xcodeproj gem has been updated: bundle exec gem list xcodeproj
-# 2. Test if pod install works without the workaround
-# 3. If it works, remove both workaround functions below
-# 4. Replace with:
-#    - safe_execute "Installing CocoaPods dependencies" "cd ios/App && bundle exec pod install && cd ../.." || exit 6
-#    - safe_execute "Syncing with Capacitor" "npx cap sync ios" || exit 6
-# 5. Update this comment to indicate the workaround has been removed
-# ===================================================================
-run_pod_install_with_workaround() {
-    local PROJECT_FILE="ios/App/App.xcodeproj/project.pbxproj"
-    
-    log_info "Installing CocoaPods dependencies (with Xcode 26 workaround)..."
-    
-    # Check if project file exists
-    if [ ! -f "$PROJECT_FILE" ]; then
-        log_error "Project file not found: $PROJECT_FILE"
-        return 1
-    fi
-    
-    # Check current format version
-    local current_version=$(grep "objectVersion" "$PROJECT_FILE" | head -1 | grep -o "[0-9]\+" || echo "")
-    
-    if [ -z "$current_version" ]; then
-        log_error "Could not determine project format version"
-        return 1
-    fi
-    
-    log_debug "Current project format version: $current_version"
-    
-    # Only apply workaround if format is 70
-    if [ "$current_version" = "70" ]; then
-        log_debug "Applying Xcode 26 workaround: temporarily downgrading to format 56"
-        
-        # Downgrade to format 56 (supported by CocoaPods)
-        if ! sed -i '' 's/objectVersion = 70;/objectVersion = 56;/' "$PROJECT_FILE"; then
-            log_error "Failed to downgrade project format"
-            return 1
-        fi
-        
-        # Run pod install
-        log_info "Running pod install..."
-        if ! (cd ios/App && bundle exec pod install && cd ../..); then
-            log_error "pod install failed"
-            # Try to restore format even on failure
-            sed -i '' 's/objectVersion = 56;/objectVersion = 70;/' "$PROJECT_FILE" || true
-            return 1
-        fi
-        
-        # Restore to format 70
-        log_debug "Restoring project format to 70..."
-        if ! sed -i '' 's/objectVersion = 56;/objectVersion = 70;/' "$PROJECT_FILE"; then
-            log_warn "Failed to restore project format to 70 (Xcode will upgrade it automatically)"
-        fi
-        
-        log_success "CocoaPods dependencies installed successfully"
-    else
-        # Format is not 70, run pod install normally
-        log_debug "Project format is $current_version, running pod install normally"
-        if ! (cd ios/App && bundle exec pod install && cd ../..); then
-            log_error "pod install failed"
-            return 1
-        fi
-        log_success "CocoaPods dependencies installed successfully"
-    fi
-}
+# Step 5: Sync with Capacitor
+safe_execute "Syncing with Capacitor" "npx cap sync ios" || exit 6
 
-safe_execute "Installing CocoaPods dependencies" "run_pod_install_with_workaround" || exit 6
-
-# Step 6.5: Sync with Capacitor (also needs workaround since it runs pod install internally)
-# Capacitor sync internally runs pod install, so we need to apply the workaround here too
-run_cap_sync_with_workaround() {
-    local PROJECT_FILE="ios/App/App.xcodeproj/project.pbxproj"
-    
-    # Check current format version
-    local current_version=$(grep "objectVersion" "$PROJECT_FILE" | head -1 | grep -o "[0-9]\+" || echo "")
-    
-    if [ -z "$current_version" ]; then
-        log_error "Could not determine project format version for Capacitor sync"
-        return 1
-    fi
-    
-    # Only apply workaround if format is 70
-    if [ "$current_version" = "70" ]; then
-        log_debug "Applying Xcode 26 workaround for Capacitor sync: temporarily downgrading to format 56"
-        
-        # Downgrade to format 56 (supported by CocoaPods)
-        if ! sed -i '' 's/objectVersion = 70;/objectVersion = 56;/' "$PROJECT_FILE"; then
-            log_error "Failed to downgrade project format for Capacitor sync"
-            return 1
-        fi
-        
-        # Run Capacitor sync (which will run pod install internally)
-        log_info "Running Capacitor sync..."
-        if ! npx cap sync ios; then
-            log_error "Capacitor sync failed"
-            # Try to restore format even on failure
-            sed -i '' 's/objectVersion = 56;/objectVersion = 70;/' "$PROJECT_FILE" || true
-            return 1
-        fi
-        
-        # Restore to format 70
-        log_debug "Restoring project format to 70 after Capacitor sync..."
-        if ! sed -i '' 's/objectVersion = 56;/objectVersion = 70;/' "$PROJECT_FILE"; then
-            log_warn "Failed to restore project format to 70 (Xcode will upgrade it automatically)"
-        fi
-        
-        log_success "Capacitor sync completed successfully"
-    else
-        # Format is not 70, run sync normally
-        log_debug "Project format is $current_version, running Capacitor sync normally"
-        if ! npx cap sync ios; then
-            log_error "Capacitor sync failed"
-            return 1
-        fi
-        log_success "Capacitor sync completed successfully"
-    fi
-}
-
-safe_execute "Syncing with Capacitor" "run_cap_sync_with_workaround" || exit 6
-
-# Step 7: Generate assets
+# Step 6: Generate assets
 safe_execute "Generating assets" "npx capacitor-assets generate --ios" || exit 7
 
-# Step 8: Build iOS app
+# Step 7: Build iOS app
 safe_execute "Building iOS app" "build_ios_app" || exit 5
 
-# Step 9: Build IPA/App if requested
+# Step 8: Build IPA/App if requested
 if [ "$BUILD_IPA" = true ]; then
     log_info "Building IPA package..."
     cd ios/App
@@ -573,12 +416,12 @@ if [ "$BUILD_APP" = true ]; then
     log_success "App bundle built successfully"
 fi
 
-# Step 10: Auto-run app if requested
+# Step 9: Auto-run app if requested
 if [ "$AUTO_RUN" = true ]; then
     safe_execute "Auto-running iOS app" "auto_run_ios_app" || exit 9
 fi
 
-# Step 11: Open Xcode if requested
+# Step 10: Open Xcode if requested
 if [ "$OPEN_STUDIO" = true ]; then
     safe_execute "Opening Xcode" "npx cap open ios" || exit 8
 fi

scripts/clean-android.sh

@@ -1,8 +1,8 @@
 #!/bin/bash
-# uninstall-android.sh
+# clean-android.sh
 # Author: Matthew Raymer
 # Date: 2025-08-19
-# Description: Uninstall Android app with timeout protection to prevent hanging
+# Description: Clean Android app with timeout protection to prevent hanging
 # This script safely uninstalls the TimeSafari app from connected Android devices
 # with a 30-second timeout to prevent indefinite hanging.
 

src/assets/styles/tailwind.css

@@ -7,24 +7,6 @@
     html {
         font-family: 'Work Sans', ui-sans-serif, system-ui, sans-serif !important;
     }
-    
-    /* Fix iOS viewport height changes when keyboard appears/disappears */
-    html, body {
-        height: 100%;
-        height: 100vh;
-        height: 100dvh; /* Dynamic viewport height for better mobile support */
-        overflow: hidden; /* Disable all scrolling on html and body */
-        position: fixed; /* Force fixed positioning to prevent viewport changes */
-        width: 100%;
-        top: 0;
-        left: 0;
-    }
-    
-    #app {
-        height: 100vh;
-        height: 100dvh;
-        overflow-y: auto;
-    }
 }
 
 @layer components {
@@ -38,26 +20,6 @@
 	}
 
 	.dialog {
-		@apply bg-white px-4 py-6 rounded-lg w-full max-w-lg max-h-[calc(100vh-3rem)] overflow-y-auto;
-	}
-
-	/* Markdown content styling to restore list elements */
-	.markdown-content ul {
-		@apply list-disc list-inside ml-4;
-	}
-
-	.markdown-content ol {
-		@apply list-decimal list-inside ml-4;
-	}
-
-	.markdown-content li {
-		@apply mb-1;
-	}
-
-	.markdown-content ul ul,
-	.markdown-content ol ol,
-	.markdown-content ul ol,
-	.markdown-content ol ul {
-		@apply ml-4 mt-1;
+		@apply bg-white p-4 rounded-lg w-full max-w-lg;
 	}
 }

src/components/ActivityListItem.vue

@@ -77,95 +77,15 @@
         </a>
       </div>
 
-      <!-- Emoji Section -->
-      <div
-        v-if="hasEmojis || isRegistered"
-        class="float-right ml-3 mb-1 bg-white rounded border border-slate-300 px-1.5 py-0.5 max-w-[240px]"
-      >
-        <div class="flex items-center justify-between gap-1">
-          <!-- Existing Emojis Display -->
-          <div v-if="hasEmojis" class="flex flex-wrap gap-1">
-            <button
-              v-for="(count, emoji) in record.emojiCount"
-              :key="emoji"
-              class="inline-flex items-center gap-0.5 px-1 py-0.5 text-xs bg-slate-50 hover:bg-slate-100 rounded border border-slate-200 transition-colors cursor-pointer"
-              :class="{
-                'bg-blue-50 border-blue-200': isUserEmojiWithoutLoading(emoji),
-                'opacity-75 cursor-wait': loadingEmojis,
-              }"
-              :title="
-                loadingEmojis
-                  ? 'Loading...'
-                  : !emojisOnActivity?.isResolved
-                    ? 'Click to load your emojis'
-                    : isUserEmojiWithoutLoading(emoji)
-                      ? 'Click to remove your emoji'
-                      : 'Click to add this emoji'
-              "
-              :disabled="!isRegistered"
-              @click="toggleThisEmoji(emoji)"
-            >
-              <!-- Show spinner when loading -->
-              <div v-if="loadingEmojis" class="animate-spin text-xs">
-                <font-awesome icon="spinner" class="fa-spin" />
-              </div>
-              <span v-else class="text-sm leading-none">{{ emoji }}</span>
-              <span class="text-xs text-slate-600 font-medium leading-none">{{
-                count
-              }}</span>
-            </button>
-          </div>
-
-          <!-- Add Emoji Button -->
-          <button
-            v-if="isRegistered"
-            class="inline-flex px-1 py-0.5 text-xs bg-slate-100 hover:bg-slate-200 rounded border border-slate-300 transition-colors items-center justify-center ml-2 ml-auto"
-            :title="showEmojiPicker ? 'Close emoji picker' : 'Add emoji'"
-            @click="toggleEmojiPicker"
-          >
-            <span class="px-2 text-sm leading-none">{{
-              showEmojiPicker ? "x" : "😊"
-            }}</span>
-          </button>
-        </div>
-
-        <!-- Emoji Picker (placeholder for now) -->
-        <div
-          v-if="showEmojiPicker"
-          class="mt-1 p-1.5 bg-slate-50 rounded border border-slate-300"
-        >
-          <!-- Temporary emoji buttons for testing -->
-          <div class="flex flex-wrap gap-3 mt-1">
-            <button
-              v-for="emoji in QUICK_EMOJIS"
-              :key="emoji"
-              class="p-0.5 hover:bg-slate-200 rounded text-base transition-opacity"
-              :class="{
-                'opacity-75 cursor-wait': loadingEmojis,
-              }"
-              :disabled="loadingEmojis"
-              @click="toggleThisEmoji(emoji)"
-            >
-              <!-- Show spinner when loading -->
-              <div v-if="loadingEmojis" class="animate-spin text-sm">⟳</div>
-              <span v-else>{{ emoji }}</span>
-            </button>
-          </div>
-        </div>
-      </div>
-
       <!-- Description -->
       <p class="font-medium">
-        <a class="block cursor-pointer" @click="emitLoadClaim(record.jwtId)">
-          <vue-markdown
-            :source="truncatedDescription"
-            class="markdown-content"
-          />
+        <a class="cursor-pointer" @click="emitLoadClaim(record.jwtId)">
+          {{ description }}
         </a>
       </p>
 
       <div
-        class="clear-right relative flex justify-between gap-4 max-w-[40rem] mx-auto mt-4"
+        class="relative flex justify-between gap-4 max-w-[40rem] mx-auto mt-4"
       >
         <!-- Source -->
         <div
@@ -328,51 +248,33 @@
 
 <script lang="ts">
 import { Component, Prop, Vue, Emit } from "vue-facing-decorator";
-import VueMarkdown from "vue-markdown-render";
-
-import { logger } from "../utils/logger";
-import {
-  createAndSubmitClaim,
-  getHeaders,
-  isHiddenDid,
-} from "../libs/endorserServer";
+import { GiveRecordWithContactInfo } from "@/interfaces/give";
 import EntityIcon from "./EntityIcon.vue";
+import { isHiddenDid } from "../libs/endorserServer";
 import ProjectIcon from "./ProjectIcon.vue";
-import { createNotifyHelpers, NotifyFunction, TIMEOUTS } from "@/utils/notify";
+import { createNotifyHelpers, NotifyFunction } from "@/utils/notify";
 import {
   NOTIFY_PERSON_HIDDEN,
   NOTIFY_UNKNOWN_PERSON,
 } from "@/constants/notifications";
-import { EmojiSummaryRecord, GenericVerifiableCredential } from "@/interfaces";
-import { GiveRecordWithContactInfo } from "@/interfaces/give";
-import { PromiseTracker } from "@/libs/util";
+import { TIMEOUTS } from "@/utils/notify";
 
 @Component({
   components: {
     EntityIcon,
     ProjectIcon,
-    VueMarkdown,
   },
 })
 export default class ActivityListItem extends Vue {
-  readonly QUICK_EMOJIS = ["👍", "👏", "❤️", "🎉", "😊", "😆", "🔥"];
-
   @Prop() record!: GiveRecordWithContactInfo;
   @Prop() lastViewedClaimId?: string;
   @Prop() isRegistered!: boolean;
   @Prop() activeDid!: string;
-  @Prop() apiServer!: string;
 
   isHiddenDid = isHiddenDid;
   notify!: ReturnType<typeof createNotifyHelpers>;
   $notify!: NotifyFunction;
 
-  // Emoji-related data
-  showEmojiPicker = false;
-  loadingEmojis = false; // Track if emojis are currently loading
-
-  emojisOnActivity: PromiseTracker<EmojiSummaryRecord[]> | null = null; // load this only when needed
-
   created() {
     this.notify = createNotifyHelpers(this.$notify);
   }
@@ -401,14 +303,6 @@ export default class ActivityListItem extends Vue {
     return `${claim?.description || ""}`;
   }
 
-  get truncatedDescription(): string {
-    const desc = this.description;
-    if (desc.length <= 300) {
-      return desc;
-    }
-    return desc.substring(0, 300) + "...";
-  }
-
   private displayAmount(code: string, amt: number) {
     return `${amt} ${this.currencyShortWordForCode(code, amt === 1)}`;
   }
@@ -436,186 +330,5 @@ export default class ActivityListItem extends Vue {
       day: "numeric",
     });
   }
-
-  // Emoji-related computed properties and methods
-  get hasEmojis(): boolean {
-    return Object.keys(this.record.emojiCount).length > 0;
-  }
-
-  triggerUserEmojiLoad(): PromiseTracker<EmojiSummaryRecord[]> {
-    if (!this.emojisOnActivity) {
-      const promise = new Promise<EmojiSummaryRecord[]>((resolve) => {
-        (async () => {
-          this.axios
-            .get(
-              `${this.apiServer}/api/v2/report/emoji?parentHandleId=${encodeURIComponent(this.record.handleId)}`,
-              { headers: await getHeaders(this.activeDid) },
-            )
-            .then((response) => {
-              const userEmojiRecords = response.data.data.filter(
-                (e: EmojiSummaryRecord) => e.issuerDid === this.activeDid,
-              );
-              resolve(userEmojiRecords);
-            })
-            .catch((error) => {
-              logger.error("Error loading user emojis:", error);
-              resolve([]);
-            });
-        })();
-      });
-
-      this.emojisOnActivity = new PromiseTracker(promise);
-    }
-    return this.emojisOnActivity;
-  }
-
-  /**
-   *
-   * @param emoji - The emoji to check.
-   * @returns True if the emoji is in the user's emojis, false otherwise.
-   *
-   * @note This method is quick and synchronous, and can check resolved emojis
-   * without triggering a server request. Returns false if emojis haven't been loaded yet.
-   */
-  isUserEmojiWithoutLoading(emoji: string): boolean {
-    if (this.emojisOnActivity?.isResolved && this.emojisOnActivity.value) {
-      return this.emojisOnActivity.value.some(
-        (record) => record.text === emoji,
-      );
-    }
-    return false;
-  }
-
-  async toggleEmojiPicker() {
-    this.triggerUserEmojiLoad(); // trigger it, but don't wait for it to complete
-    this.showEmojiPicker = !this.showEmojiPicker;
-  }
-
-  async toggleThisEmoji(emoji: string) {
-    // Start loading indicator
-    this.loadingEmojis = true;
-    this.showEmojiPicker = false; // always close the picker when an emoji is clicked
-
-    try {
-      this.triggerUserEmojiLoad(); // trigger just in case
-
-      const userEmojiList = await this.emojisOnActivity!.promise; // must wait now that they've chosen
-
-      const userHasEmoji: boolean = userEmojiList.some(
-        (record) => record.text === emoji,
-      );
-
-      if (userHasEmoji) {
-        this.$notify(
-          {
-            group: "modal",
-            type: "confirm",
-            title: "Remove Emoji",
-            text: `Do you want to remove your ${emoji} ?`,
-            yesText: "Remove",
-            onYes: async () => {
-              await this.removeEmoji(emoji);
-            },
-          },
-          TIMEOUTS.MODAL,
-        );
-      } else {
-        // User doesn't have this emoji, add it
-        await this.submitEmoji(emoji);
-      }
-    } finally {
-      // Remove loading indicator
-      this.loadingEmojis = false;
-    }
-  }
-
-  async submitEmoji(emoji: string) {
-    try {
-      // Create an Emoji claim and send to the server
-      const emojiClaim: GenericVerifiableCredential = {
-        "@context": "https://endorser.ch",
-        "@type": "Emoji",
-        text: emoji,
-        parentItem: { lastClaimId: this.record.jwtId },
-      };
-      const claim = await createAndSubmitClaim(
-        emojiClaim,
-        this.activeDid,
-        this.apiServer,
-        this.axios,
-      );
-      if (claim.success && !claim.embeddedRecordError) {
-        // Update emoji count
-        this.record.emojiCount[emoji] =
-          (this.record.emojiCount[emoji] || 0) + 1;
-
-        // Create a new emoji record (we'll get the actual jwtId from the server response later)
-        const newEmojiRecord: EmojiSummaryRecord = {
-          issuerDid: this.activeDid,
-          jwtId: claim.claimId || "",
-          text: emoji,
-          parentHandleId: this.record.jwtId,
-        };
-
-        // Update user emojis list by creating a new promise with the updated data
-        // (Trigger shouldn't be necessary since all calls should come through a toggle, but just in case someone calls this directly)
-        this.triggerUserEmojiLoad();
-        const currentEmojis = await this.emojisOnActivity!.promise; // must wait now that they've clicked one
-        this.emojisOnActivity = new PromiseTracker(
-          Promise.resolve([...currentEmojis, newEmojiRecord]),
-        );
-      } else {
-        this.notify.error("Failed to add emoji.", TIMEOUTS.STANDARD);
-      }
-    } catch (error) {
-      logger.error("Error submitting emoji:", error);
-      this.notify.error("Got error adding emoji.", TIMEOUTS.STANDARD);
-    }
-  }
-
-  async removeEmoji(emoji: string) {
-    try {
-      // Create an Emoji claim and send to the server
-      const emojiClaim: GenericVerifiableCredential = {
-        "@context": "https://endorser.ch",
-        "@type": "Emoji",
-        text: emoji,
-        parentItem: { lastClaimId: this.record.jwtId },
-      };
-      const claim = await createAndSubmitClaim(
-        emojiClaim,
-        this.activeDid,
-        this.apiServer,
-        this.axios,
-      );
-      if (claim.success && !claim.embeddedRecordError) {
-        // Update emoji count
-        const newCount = Math.max(0, (this.record.emojiCount[emoji] || 0) - 1);
-        if (newCount === 0) {
-          delete this.record.emojiCount[emoji];
-        } else {
-          this.record.emojiCount[emoji] = newCount;
-        }
-
-        // Update user emojis list by creating a new promise with the updated data
-        // (Trigger shouldn't be necessary since all calls should come through a toggle, but just in case someone calls this directly)
-        this.triggerUserEmojiLoad();
-        const currentEmojis = await this.emojisOnActivity!.promise; // must wait now that they've clicked one
-        this.emojisOnActivity = new PromiseTracker(
-          Promise.resolve(
-            currentEmojis.filter(
-              (record) =>
-                record.issuerDid === this.activeDid && record.text !== emoji,
-            ),
-          ),
-        );
-      } else {
-        this.notify.error("Failed to remove emoji.", TIMEOUTS.STANDARD);
-      }
-    } catch (error) {
-      logger.error("Error removing emoji:", error);
-      this.notify.error("Got error removing emoji.", TIMEOUTS.STANDARD);
-    }
-  }
 }
 </script>

src/components/BulkMembersDialog.vue

@@ -1,465 +0,0 @@
-<template>
-  <div v-if="visible" class="dialog-overlay">
-    <div class="dialog">
-      <div class="text-slate-900 text-center">
-        <h3 class="text-lg font-semibold leading-[1.25] mb-2">
-          {{ title }}
-        </h3>
-        <p class="text-sm mb-4">
-          {{ description }}
-        </p>
-
-        <!-- Member Selection Table -->
-        <div class="mb-4">
-          <table
-            class="w-full border-collapse border border-slate-300 text-sm text-start"
-          >
-            <!-- Select All Header -->
-            <thead v-if="membersData && membersData.length > 0">
-              <tr class="bg-slate-100 font-medium">
-                <th class="border border-slate-300 px-3 py-2">
-                  <label class="flex items-center gap-2">
-                    <input
-                      type="checkbox"
-                      :checked="isAllSelected"
-                      :indeterminate="isIndeterminate"
-                      @change="toggleSelectAll"
-                    />
-                    Select All
-                  </label>
-                </th>
-              </tr>
-            </thead>
-            <tbody>
-              <!-- Empty State -->
-              <tr v-if="!membersData || membersData.length === 0">
-                <td
-                  class="border border-slate-300 px-3 py-2 text-center italic text-gray-500"
-                >
-                  {{ emptyStateText }}
-                </td>
-              </tr>
-              <!-- Member Rows -->
-              <tr
-                v-for="member in membersData || []"
-                :key="member.member.memberId"
-              >
-                <td class="border border-slate-300 px-3 py-2">
-                  <div class="flex items-center justify-between gap-2">
-                    <label class="flex items-center gap-2">
-                      <input
-                        type="checkbox"
-                        :checked="isMemberSelected(member.did)"
-                        @change="toggleMemberSelection(member.did)"
-                      />
-                      <div class="">
-                        <div class="text-sm font-semibold">
-                          {{ member.name || SOMEONE_UNNAMED }}
-                        </div>
-                        <div
-                          class="flex items-center gap-0.5 text-xs text-slate-500"
-                        >
-                          <span class="font-semibold sm:hidden">DID:</span>
-                          <span
-                            class="w-[35vw] sm:w-auto truncate text-left"
-                            style="direction: rtl"
-                            >{{ member.did }}</span
-                          >
-                        </div>
-                      </div>
-                    </label>
-
-                    <!-- Contact indicator - only show if they are already a contact -->
-                    <font-awesome
-                      v-if="member.isContact"
-                      icon="user-circle"
-                      class="fa-fw ms-auto text-slate-400 cursor-pointer hover:text-slate-600"
-                      @click="showContactInfo"
-                    />
-                  </div>
-                </td>
-              </tr>
-            </tbody>
-            <!-- Select All Footer -->
-            <tfoot v-if="membersData && membersData.length > 0">
-              <tr class="bg-slate-100 font-medium">
-                <th class="border border-slate-300 px-3 py-2">
-                  <label class="flex items-center gap-2">
-                    <input
-                      type="checkbox"
-                      :checked="isAllSelected"
-                      :indeterminate="isIndeterminate"
-                      @change="toggleSelectAll"
-                    />
-                    Select All
-                  </label>
-                </th>
-              </tr>
-            </tfoot>
-          </table>
-        </div>
-
-        <!-- Action Buttons -->
-        <div class="space-y-2">
-          <!-- Main Action Button -->
-          <button
-            v-if="membersData && membersData.length > 0"
-            :disabled="!hasSelectedMembers"
-            :class="[
-              'block w-full text-center text-md font-bold uppercase px-2 py-2 rounded-md',
-              hasSelectedMembers
-                ? 'bg-blue-600 text-white cursor-pointer'
-                : 'bg-slate-400 text-slate-200 cursor-not-allowed',
-            ]"
-            @click="processSelectedMembers"
-          >
-            {{ buttonText }}
-          </button>
-          <!-- Cancel Button -->
-          <button
-            class="block w-full text-center text-md font-bold uppercase bg-slate-600 text-white px-2 py-2 rounded-md"
-            @click="cancel"
-          >
-            Maybe Later
-          </button>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts">
-import { Vue, Component, Prop } from "vue-facing-decorator";
-
-import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
-import { SOMEONE_UNNAMED } from "@/constants/entities";
-import { MemberData } from "@/interfaces";
-import { setVisibilityUtil, getHeaders, register } from "@/libs/endorserServer";
-import { createNotifyHelpers } from "@/utils/notify";
-import { Contact } from "@/db/tables/contacts";
-
-@Component({
-  mixins: [PlatformServiceMixin],
-  emits: ["close"],
-})
-export default class BulkMembersDialog extends Vue {
-  @Prop({ default: "" }) activeDid!: string;
-  @Prop({ default: "" }) apiServer!: string;
-  // isOrganizer: true = organizer mode (admit members), false = member mode (set visibility)
-  @Prop({ required: true }) isOrganizer!: boolean;
-
-  // Vue notification system
-  $notify!: (
-    notification: { group: string; type: string; title: string; text: string },
-    timeout?: number,
-  ) => void;
-
-  // Notification system
-  notify!: ReturnType<typeof createNotifyHelpers>;
-
-  // Component state
-  membersData: MemberData[] = [];
-  selectedMembers: string[] = [];
-  visible = false;
-
-  // Constants
-  // In Vue templates, imported constants need to be explicitly made available to the template
-  readonly SOMEONE_UNNAMED = SOMEONE_UNNAMED;
-
-  get hasSelectedMembers() {
-    return this.selectedMembers.length > 0;
-  }
-
-  get isAllSelected() {
-    if (!this.membersData || this.membersData.length === 0) return false;
-    return this.membersData.every((member) =>
-      this.selectedMembers.includes(member.did),
-    );
-  }
-
-  get isIndeterminate() {
-    if (!this.membersData || this.membersData.length === 0) return false;
-    const selectedCount = this.membersData.filter((member) =>
-      this.selectedMembers.includes(member.did),
-    ).length;
-    return selectedCount > 0 && selectedCount < this.membersData.length;
-  }
-
-  get title() {
-    return this.isOrganizer
-      ? "Admit Pending Members"
-      : "Add Members to Contacts";
-  }
-
-  get description() {
-    return this.isOrganizer
-      ? "Would you like to admit these members to the meeting and add them to your contacts?"
-      : "Would you like to add these members to your contacts?";
-  }
-
-  get buttonText() {
-    return this.isOrganizer ? "Admit + Add to Contacts" : "Add to Contacts";
-  }
-
-  get emptyStateText() {
-    return this.isOrganizer
-      ? "No pending members to admit"
-      : "No members are not in your contacts";
-  }
-
-  created() {
-    this.notify = createNotifyHelpers(this.$notify);
-  }
-
-  open(members: MemberData[]) {
-    this.visible = true;
-    this.membersData = members;
-    // Select all by default
-    this.selectedMembers = this.membersData.map((member) => member.did);
-  }
-
-  close(notSelectedMemberDids: string[]) {
-    this.visible = false;
-    this.$emit("close", { notSelectedMemberDids: notSelectedMemberDids });
-  }
-
-  cancel() {
-    this.close(this.membersData.map((member) => member.did));
-  }
-
-  toggleSelectAll() {
-    if (!this.membersData || this.membersData.length === 0) return;
-
-    if (this.isAllSelected) {
-      // Deselect all
-      this.selectedMembers = [];
-    } else {
-      // Select all
-      this.selectedMembers = this.membersData.map((member) => member.did);
-    }
-  }
-
-  toggleMemberSelection(memberDid: string) {
-    const index = this.selectedMembers.indexOf(memberDid);
-    if (index > -1) {
-      this.selectedMembers.splice(index, 1);
-    } else {
-      this.selectedMembers.push(memberDid);
-    }
-  }
-
-  isMemberSelected(memberDid: string) {
-    return this.selectedMembers.includes(memberDid);
-  }
-
-  async processSelectedMembers() {
-    try {
-      const selectedMembers: MemberData[] = this.membersData.filter((member) =>
-        this.selectedMembers.includes(member.did),
-      );
-      const notSelectedMembers: MemberData[] = this.membersData.filter(
-        (member) => !this.selectedMembers.includes(member.did),
-      );
-
-      let admittedCount = 0;
-      let contactAddedCount = 0;
-      let errors = 0;
-
-      for (const member of selectedMembers) {
-        try {
-          // Organizer mode: admit and register the member first
-          if (this.isOrganizer) {
-            await this.admitMember(member);
-            await this.registerMember(member);
-            admittedCount++;
-          }
-
-          // If they're not a contact yet, add them as a contact
-          if (!member.isContact) {
-            // Organizer mode: set isRegistered to true, member mode: undefined
-            await this.addAsContact(
-              member,
-              this.isOrganizer ? true : undefined,
-            );
-            contactAddedCount++;
-          }
-
-          // Set their seesMe to true
-          await this.updateContactVisibility(member.did, true);
-        } catch (error) {
-          // eslint-disable-next-line no-console
-          console.error(`Error processing member ${member.did}:`, error);
-          // Continue with other members even if one fails
-          errors++;
-        }
-      }
-
-      // Show success notification
-      if (this.isOrganizer) {
-        if (admittedCount > 0) {
-          this.$notify(
-            {
-              group: "alert",
-              type: "success",
-              title: "Members Admitted Successfully",
-              text: `${admittedCount} member${admittedCount === 1 ? "" : "s"} admitted and registered${contactAddedCount === 0 ? "" : admittedCount === contactAddedCount ? " and" : `, ${contactAddedCount}`}${contactAddedCount === 0 ? "" : ` added as contact${contactAddedCount === 1 ? "" : "s"}`}.`,
-            },
-            5000,
-          );
-        }
-        if (errors > 0) {
-          this.$notify(
-            {
-              group: "alert",
-              type: "danger",
-              title: "Error",
-              text: "Failed to fully admit some members. Work with them individually below.",
-            },
-            5000,
-          );
-        }
-      } else {
-        // Member mode: show contacts added notification
-        if (contactAddedCount > 0) {
-          this.$notify(
-            {
-              group: "alert",
-              type: "success",
-              title: "Contacts Added Successfully",
-              text: `${contactAddedCount} member${contactAddedCount === 1 ? "" : "s"} added as contact${contactAddedCount === 1 ? "" : "s"}.`,
-            },
-            5000,
-          );
-        }
-      }
-
-      this.close(notSelectedMembers.map((member) => member.did));
-    } catch (error) {
-      // eslint-disable-next-line no-console
-      console.error(
-        `Error ${this.isOrganizer ? "admitting members" : "adding contacts"}:`,
-        error,
-      );
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "Some errors occurred. Work with members individually below.",
-        },
-        5000,
-      );
-    }
-  }
-
-  async admitMember(member: {
-    did: string;
-    name: string;
-    member: { memberId: string };
-  }) {
-    try {
-      const headers = await getHeaders(this.activeDid);
-      await this.axios.put(
-        `${this.apiServer}/api/partner/groupOnboardMember/${member.member.memberId}`,
-        { admitted: true },
-        { headers },
-      );
-    } catch (err) {
-      // eslint-disable-next-line no-console
-      console.error("Error admitting member:", err);
-      throw err;
-    }
-  }
-
-  async registerMember(member: MemberData) {
-    try {
-      const contact: Contact = { did: member.did };
-      const result = await register(
-        this.activeDid,
-        this.apiServer,
-        this.axios,
-        contact,
-      );
-      if (result.success) {
-        if (result.embeddedRecordError) {
-          throw new Error(result.embeddedRecordError);
-        }
-        await this.$updateContact(member.did, { registered: true });
-      } else {
-        throw result;
-      }
-    } catch (err) {
-      // eslint-disable-next-line no-console
-      console.error("Error registering member:", err);
-      throw err;
-    }
-  }
-
-  async addAsContact(
-    member: { did: string; name: string },
-    isRegistered?: boolean,
-  ) {
-    try {
-      const newContact: Contact = {
-        did: member.did,
-        name: member.name,
-        registered: isRegistered,
-      };
-
-      await this.$insertContact(newContact);
-    } catch (err) {
-      // eslint-disable-next-line no-console
-      console.error("Error adding contact:", err);
-      if (err instanceof Error && err.message?.indexOf("already exists") > -1) {
-        // Contact already exists, continue
-      } else {
-        throw err; // Re-throw if it's not a duplicate error
-      }
-    }
-  }
-
-  async updateContactVisibility(did: string, seesMe: boolean) {
-    try {
-      // Get the contact object
-      const contact = await this.$getContact(did);
-      if (!contact) {
-        throw new Error(`Contact not found for DID: ${did}`);
-      }
-
-      // Use the proper API to set visibility on the server
-      const result = await setVisibilityUtil(
-        this.activeDid,
-        this.apiServer,
-        this.axios,
-        contact,
-        seesMe,
-      );
-
-      if (!result.success) {
-        throw new Error(result.error || "Failed to set visibility");
-      }
-    } catch (err) {
-      // eslint-disable-next-line no-console
-      console.error("Error updating contact visibility:", err);
-      throw err;
-    }
-  }
-
-  showContactInfo() {
-    // isOrganizer: true = admit mode, false = visibility mode
-    const message = this.isOrganizer
-      ? "This user is already your contact, but they are not yet admitted to the meeting."
-      : "This user is already your contact, but your activities are not visible to them yet.";
-
-    this.$notify(
-      {
-        group: "alert",
-        type: "info",
-        title: "Contact Info",
-        text: message,
-      },
-      5000,
-    );
-  }
-}
-</script>

src/components/ContactListItem.vue

@@ -46,7 +46,7 @@
 
             <span class="text-xs truncate">{{ contact.did }}</span>
           </div>
-          <div class="text-sm truncate">
+          <div class="text-sm">
             {{ contact.notes }}
           </div>
         </div>

src/components/DataExportSection.vue

@@ -10,7 +10,7 @@ messages * - Conditional UI based on platform capabilities * * @component *
 
 <template>
   <div id="sectionDataExport" :class="containerClasses">
-    <div :class="titleClasses">Data Management</div>
+    <div :class="titleClasses">Data Export</div>
     <router-link
       v-if="activeDid"
       :to="{ name: 'seed-backup' }"
@@ -18,7 +18,7 @@ messages * - Conditional UI based on platform capabilities * * @component *
     >
       <!-- Notification dot - show while the user has not yet backed up their seed phrase -->
       <font-awesome
-        v-if="showRedNotificationDot"
+        v-if="!hasBackedUpSeed"
         icon="circle"
         class="absolute -right-[8px] -top-[8px] text-rose-500 text-[14px] border border-white rounded-full"
       ></font-awesome>
@@ -30,7 +30,7 @@ messages * - Conditional UI based on platform capabilities * * @component *
       :class="exportButtonClasses"
       @click="exportDatabase()"
     >
-      {{ isExporting ? "Exporting..." : "Export Contacts" }}
+      {{ isExporting ? "Exporting..." : "Download Contacts" }}
     </button>
 
     <div
@@ -55,54 +55,11 @@ messages * - Conditional UI based on platform capabilities * * @component *
         </li>
       </ul>
     </div>
-
-    <!-- Import Contacts -->
-    <div id="sectionImportContactsSettings" class="mt-4">
-      <h2 class="text-slate-500 text-sm font-bold">Import Contacts</h2>
-
-      <div class="mt-2">
-        <input
-          type="file"
-          class="w-full bg-white rounded-md pe-2 file:border-0 file:bg-gradient-to-b file:from-blue-400 file:to-blue-700 file:shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] file:text-white file:px-3 file:py-2 file:me-2 file:rounded-s-md"
-          @change="uploadImportFile"
-        />
-        <transition
-          enter-active-class="transform ease-out duration-300 transition"
-          enter-from-class="translate-y-2 opacity-0 sm:translate-y-4"
-          enter-to-class="translate-y-0 opacity-100 sm:translate-y-0"
-          leave-active-class="transition ease-in duration-500"
-          leave-from-class="opacity-100"
-          leave-to-class="opacity-0"
-        >
-          <div v-if="showContactImport()" class="mt-2">
-            <!-- Bulk import has an error
-            <div class="flex justify-center">
-              <button
-                class="block text-center text-md 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.5 py-2 rounded-md mb-6"
-                @click="confirmSubmitImportFile()"
-              >
-                Overwrite Settings & Contacts
-                <br />
-                (which doesn't include Identifier Data)
-              </button>
-            </div>
-            -->
-            <button
-              class="block w-full text-center text-md 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.5 py-2 rounded-md"
-              @click="checkContactImports()"
-            >
-              Import Contacts
-            </button>
-          </div>
-        </transition>
-      </div>
-    </div>
   </div>
 </template>
 
 <script lang="ts">
 import { Component, Prop, Vue } from "vue-facing-decorator";
-import { Router } from "vue-router";
 import * as R from "ramda";
 
 import { AppString, NotificationIface } from "../constants/app";
@@ -110,10 +67,8 @@ import { Contact } from "../db/tables/contacts";
 
 import { logger } from "../utils/logger";
 import { contactsToExportJson } from "../libs/util";
-import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
+import { createNotifyHelpers } from "@/utils/notify";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
-import { ACCOUNT_VIEW_CONSTANTS } from "@/constants/accountView";
-import { ImportContent } from "@/interfaces/accountView";
 
 /**
  * @vue-component
@@ -136,12 +91,6 @@ export default class DataExportSection extends Vue {
    */
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
-  /**
-   * Router instance injected by Vue
-   * Used for navigation
-   */
-  $router!: Router;
-
   /**
    * Active DID (Decentralized Identifier) of the user
    * Controls visibility of seed backup option
@@ -159,13 +108,7 @@ export default class DataExportSection extends Vue {
    * Flag indicating if the user has backed up their seed phrase
    * Used to control the visibility of the notification dot
    */
-  showRedNotificationDot = false;
-
-  /**
-   * Reference to the selected import file
-   * Used to store the file selected by the user for import
-   */
-  private inputImportFileName: Blob | undefined;
+  hasBackedUpSeed = false;
 
   /**
    * Notification helper for consistent notification patterns
@@ -257,30 +200,12 @@ export default class DataExportSection extends Vue {
         // first remove the contactMethods field, mostly to cast to a clear type (that will end up with JSON objects)
         const exContact: Contact = R.omit(["contactMethods"], contact);
         // now add contactMethods as a true array of ContactMethod objects
-        // $contacts() returns normalized contacts where contactMethods is already an array,
-        // but we handle both array and string cases for robustness
-        if (contact.contactMethods) {
-          if (Array.isArray(contact.contactMethods)) {
-            // Already an array, use it directly
-            exContact.contactMethods = contact.contactMethods;
-          } else {
-            // Check if it's a string that needs parsing (shouldn't happen with normalized contacts, but handle for robustness)
-            const contactMethodsValue = contact.contactMethods as unknown;
-            if (
-              typeof contactMethodsValue === "string" &&
-              contactMethodsValue.trim() !== ""
-            ) {
-              // String that needs parsing
-              exContact.contactMethods = JSON.parse(contactMethodsValue);
-            } else {
-              // Invalid data, use empty array
-              exContact.contactMethods = [];
-            }
-          }
-        } else {
-          // No contactMethods, use empty array
-          exContact.contactMethods = [];
-        }
+        exContact.contactMethods = contact.contactMethods
+          ? typeof contact.contactMethods === "string" &&
+            contact.contactMethods.trim() !== ""
+            ? JSON.parse(contact.contactMethods)
+            : []
+          : [];
         return exContact;
       });
 
@@ -315,66 +240,12 @@ export default class DataExportSection extends Vue {
   private async loadSeedBackupStatus(): Promise<void> {
     try {
       const settings = await this.$accountSettings();
-      this.showRedNotificationDot =
-        !!settings.isRegistered && !settings.hasBackedUpSeed;
+      this.hasBackedUpSeed = !!settings.hasBackedUpSeed;
     } catch (err: unknown) {
       logger.error("Failed to load seed backup status:", err);
       // Default to false (show notification dot) if we can't load the setting
-      this.showRedNotificationDot = false;
+      this.hasBackedUpSeed = false;
     }
   }
-
-  /**
-   * Handles file selection for contact import
-   * Stores the selected file for later processing
-   */
-  async uploadImportFile(event: Event): Promise<void> {
-    this.inputImportFileName = (event.target as HTMLInputElement).files?.[0];
-  }
-
-  /**
-   * Checks if a contact import file has been selected
-   * Used to conditionally show the import button
-   */
-  showContactImport(): boolean {
-    return !!this.inputImportFileName;
-  }
-
-  /**
-   * Processes the selected import file and navigates to the contact import view
-   * Parses the JSON file and extracts contact data for import
-   */
-  async checkContactImports(): Promise<void> {
-    if (!this.inputImportFileName) {
-      return;
-    }
-
-    const reader = new FileReader();
-    reader.onload = (event) => {
-      const fileContent: string = (event.target?.result as string) || "{}";
-      try {
-        const contents: ImportContent = JSON.parse(fileContent);
-        const contactTableRows: Array<Contact> = (
-          contents.data?.data as [{ tableName: string; rows: Array<Contact> }]
-        )?.find((table) => table.tableName === "contacts")
-          ?.rows as Array<Contact>;
-        const contactRows = contactTableRows.map(
-          // @ts-expect-error for omitting this field that is found in the Dexie format
-          (contact) => R.omit(["$types"], contact) as Contact,
-        );
-        this.$router.push({
-          name: "contact-import",
-          query: { contacts: JSON.stringify(contactRows) },
-        });
-      } catch (error) {
-        logger.error("Error checking contact imports:", error);
-        this.notify.error(
-          ACCOUNT_VIEW_CONSTANTS.ERRORS.IMPORT_ERROR,
-          TIMEOUTS.STANDARD,
-        );
-      }
-    };
-    reader.readAsText(this.inputImportFileName);
-  }
 }
 </script>

src/components/EntityGrid.vue

@@ -2,55 +2,12 @@
 GiftedDialog.vue to provide a reusable grid layout * for displaying people,
 projects, and special entities with selection. * * @author Matthew Raymer */
 <template>
-  <!-- Quick Search -->
-  <div id="QuickSearch" class="mb-4 flex items-center text-sm">
-    <input
-      v-model="searchTerm"
-      type="text"
-      placeholder="Search…"
-      class="block w-full rounded-l border border-r-0 border-slate-400 px-3 py-1.5 placeholder:italic placeholder:text-slate-400 focus:outline-none"
-      @input="handleSearchInput"
-      @keydown.enter="performSearch"
-    />
-    <div
-      v-show="isSearching && searchTerm"
-      class="border-y border-slate-400 ps-2 py-1.5 text-center text-slate-400"
-    >
-      <font-awesome
-        icon="spinner"
-        class="fa-spin-pulse leading-[1.1]"
-      ></font-awesome>
-    </div>
-    <button
-      :disabled="!searchTerm"
-      class="px-2 py-1.5 rounded-r bg-white border border-l-0 border-slate-400 text-slate-400 disabled:cursor-not-allowed"
-      @click="clearSearch"
-    >
-      <font-awesome
-        :icon="searchTerm ? 'times' : 'magnifying-glass'"
-        class="fa-fw"
-      ></font-awesome>
-    </button>
-  </div>
-
-  <div
-    v-if="searchTerm && !isSearching && filteredEntities.length === 0"
-    class="mb-4 text-sm italic text-slate-500 text-center"
-  >
-    “{{ searchTerm }}” doesn't match any
-    {{ entityType === "people" ? "people" : "projects" }}. Try a different
-    search.
-  </div>
-
-  <ul
-    ref="scrollContainer"
-    class="border-t border-slate-300 mb-4 max-h-[60vh] overflow-y-auto"
-  >
+  <ul :class="gridClasses">
     <!-- Special entities (You, Unnamed) for people grids -->
     <template v-if="entityType === 'people'">
       <!-- "You" entity -->
       <SpecialEntityCard
-        v-if="showYouEntity && !searchTerm.trim()"
+        v-if="showYouEntity"
         entity-type="you"
         label="You"
         icon="hand"
@@ -64,7 +21,6 @@ projects, and special entities with selection. * * @author Matthew Raymer */
 
       <!-- "Unnamed" entity -->
       <SpecialEntityCard
-        v-if="showUnnamedEntity && !searchTerm.trim()"
         entity-type="unnamed"
         :label="unnamedEntityName"
         icon="circle-question"
@@ -76,66 +32,22 @@ projects, and special entities with selection. * * @author Matthew Raymer */
     </template>
 
     <!-- Empty state message -->
-    <li v-if="hasNoEntities" :class="emptyStateClasses">
+    <li v-if="entities.length === 0" :class="emptyStateClasses">
       {{ emptyStateMessage }}
     </li>
 
     <!-- Entity cards (people or projects) -->
     <template v-if="entityType === 'people'">
-      <!-- When showing contacts without search: split into recent and alphabetical -->
-      <template v-if="!searchTerm.trim()">
-        <!-- Recently Added Section -->
-        <template v-if="recentContacts.length > 0">
-          <li
-            class="text-xs font-semibold text-slate-500 uppercase pt-5 pb-1.5 px-2 border-b border-slate-300"
-          >
-            Recently Added
-          </li>
-          <PersonCard
-            v-for="person in recentContacts"
-            :key="person.did"
-            :person="person"
-            :conflicted="isPersonConflicted(person.did)"
-            :show-time-icon="true"
-            :notify="notify"
-            :conflict-context="conflictContext"
-            @person-selected="handlePersonSelected"
-          />
-        </template>
-
-        <!-- Alphabetical Section -->
-        <template v-if="alphabeticalContacts.length > 0">
-          <li
-            class="text-xs font-semibold text-slate-500 uppercase pt-5 pb-1.5 px-2 border-b border-slate-300"
-          >
-            Everyone
-          </li>
-          <PersonCard
-            v-for="person in alphabeticalContacts"
-            :key="person.did"
-            :person="person"
-            :conflicted="isPersonConflicted(person.did)"
-            :show-time-icon="true"
-            :notify="notify"
-            :conflict-context="conflictContext"
-            @person-selected="handlePersonSelected"
-          />
-        </template>
-      </template>
-
-      <!-- When searching: show filtered results normally -->
-      <template v-else>
-        <PersonCard
-          v-for="person in displayedEntities as Contact[]"
-          :key="person.did"
-          :person="person"
-          :conflicted="isPersonConflicted(person.did)"
-          :show-time-icon="true"
-          :notify="notify"
-          :conflict-context="conflictContext"
-          @person-selected="handlePersonSelected"
-        />
-      </template>
+      <PersonCard
+        v-for="person in displayedEntities as Contact[]"
+        :key="person.did"
+        :person="person"
+        :conflicted="isPersonConflicted(person.did)"
+        :show-time-icon="true"
+        :notify="notify"
+        :conflict-context="conflictContext"
+        @person-selected="handlePersonSelected"
+      />
     </template>
 
     <template v-else-if="entityType === 'projects'">
@@ -151,30 +63,27 @@ projects, and special entities with selection. * * @author Matthew Raymer */
         @project-selected="handleProjectSelected"
       />
     </template>
+
+    <!-- Show All navigation -->
+    <ShowAllCard
+      v-if="shouldShowAll"
+      :entity-type="entityType"
+      :route-name="showAllRoute"
+      :query-params="showAllQueryParams"
+    />
   </ul>
 </template>
 
 <script lang="ts">
-import { Component, Prop, Vue, Emit, Watch } from "vue-facing-decorator";
-import { useInfiniteScroll } from "@vueuse/core";
+import { Component, Prop, Vue, Emit } from "vue-facing-decorator";
 import PersonCard from "./PersonCard.vue";
 import ProjectCard from "./ProjectCard.vue";
 import SpecialEntityCard from "./SpecialEntityCard.vue";
+import ShowAllCard from "./ShowAllCard.vue";
 import { Contact } from "../db/tables/contacts";
 import { PlanData } from "../interfaces/records";
 import { NotificationIface } from "../constants/app";
 import { UNNAMED_ENTITY_NAME } from "@/constants/entities";
-import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
-import { getHeaders } from "../libs/endorserServer";
-import { logger } from "../utils/logger";
-import { TIMEOUTS } from "@/utils/notify";
-
-/**
- * Constants for infinite scroll configuration
- */
-const INITIAL_BATCH_SIZE = 20;
-const INCREMENT_SIZE = 20;
-const RECENT_CONTACTS_COUNT = 3;
 
 /**
  * EntityGrid - Unified grid layout for displaying people or projects
@@ -184,6 +93,7 @@ const RECENT_CONTACTS_COUNT = 3;
  * - Special entity integration (You, Unnamed)
  * - Conflict detection integration
  * - Empty state messaging
+ * - Show All navigation
  * - Event delegation for entity selection
  * - Warning notifications for conflicted entities
  * - Template streamlined with computed CSS properties
@@ -194,49 +104,21 @@ const RECENT_CONTACTS_COUNT = 3;
     PersonCard,
     ProjectCard,
     SpecialEntityCard,
+    ShowAllCard,
   },
-  mixins: [PlatformServiceMixin],
 })
 export default class EntityGrid extends Vue {
   /** Type of entities to display */
   @Prop({ required: true })
   entityType!: "people" | "projects";
 
-  // Search state
-  searchTerm = "";
-  isSearching = false;
-  searchTimeout: NodeJS.Timeout | null = null;
-  filteredEntities: Contact[] | PlanData[] = [];
-  searchBeforeId: string | undefined = undefined;
-  isLoadingSearchMore = false;
+  /** Array of entities to display */
+  @Prop({ required: true })
+  entities!: Contact[] | PlanData[];
 
-  // API server for project searches
-  apiServer = "";
-
-  // Internal project state (when entities prop not provided for projects)
-  allProjects: PlanData[] = [];
-  loadBeforeId: string | undefined = undefined;
-  isLoadingProjects = false;
-
-  // Infinite scroll state
-  displayedCount = INITIAL_BATCH_SIZE;
-  infiniteScrollReset?: () => void;
-  scrollContainer?: HTMLElement;
-
-  /**
-   * Array of entities to display
-   *
-   * For contacts (entityType === 'people'): REQUIRED - Must be a COMPLETE list from local database.
-   * Use $contactsByDateAdded() to ensure all contacts are included.
-   * Client-side filtering assumes the complete list is available.
-   * IMPORTANT: When passing Contact[] arrays, they must be sorted by date added
-   * (newest first) for the "Recently Added" section to display correctly.
-   *
-   * For projects (entityType === 'projects'): OPTIONAL - If not provided, EntityGrid loads
-   * projects internally from the API server. If provided, uses the provided list.
-   */
-  @Prop({ required: false })
-  entities?: Contact[] | PlanData[];
+  /** Maximum number of entities to display */
+  @Prop({ default: 10 })
+  maxItems!: number;
 
   /** Active user's DID */
   @Prop({ required: true })
@@ -258,14 +140,18 @@ export default class EntityGrid extends Vue {
   @Prop({ default: true })
   showYouEntity!: boolean;
 
-  /** Whether to show the "Unnamed" entity for people grids */
-  @Prop({ default: true })
-  showUnnamedEntity!: boolean;
-
   /** Whether the "You" entity is selectable */
   @Prop({ default: true })
   youSelectable!: boolean;
 
+  /** Route name for "Show All" navigation */
+  @Prop({ default: "" })
+  showAllRoute!: string;
+
+  /** Query parameters for "Show All" navigation */
+  @Prop({ default: () => ({}) })
+  showAllQueryParams!: Record<string, string>;
+
   /** Notification function from parent component */
   @Prop()
   notify?: (notification: NotificationIface, timeout?: number) => void;
@@ -274,31 +160,42 @@ export default class EntityGrid extends Vue {
   @Prop({ default: "other party" })
   conflictContext!: string;
 
+  /** Whether to hide the "Show All" navigation */
+  @Prop({ default: false })
+  hideShowAll!: boolean;
+
   /**
    * Function to determine which entities to display (allows parent control)
    *
    * This function prop allows parent components to customize which entities
-   * are displayed in the grid, enabling advanced filtering and sorting.
-   * Note: Infinite scroll is disabled when this prop is provided.
+   * are displayed in the grid, enabling advanced filtering, sorting, and
+   * display logic beyond the default simple slice behavior.
    *
    * @param entities - The full array of entities (Contact[] or PlanData[])
    * @param entityType - The type of entities being displayed ("people" or "projects")
+   * @param maxItems - The maximum number of items to display (from maxItems prop)
    * @returns Filtered/sorted array of entities to display
    *
    * @example
    * // Custom filtering: only show contacts with profile images
-   * :display-entities-function="(entities, type) =>
-   *   entities.filter(e => e.profileImageUrl)"
+   * :display-entities-function="(entities, type, max) =>
+   *   entities.filter(e => e.profileImageUrl).slice(0, max)"
    *
    * @example
    * // Custom sorting: sort projects by name
-   * :display-entities-function="(entities, type) =>
-   *   entities.sort((a, b) => a.name.localeCompare(b.name))"
+   * :display-entities-function="(entities, type, max) =>
+   *   entities.sort((a, b) => a.name.localeCompare(b.name)).slice(0, max)"
+   *
+   * @example
+   * // Advanced logic: different limits for different entity types
+   * :display-entities-function="(entities, type, max) =>
+   *   type === 'projects' ? entities.slice(0, 5) : entities.slice(0, max)"
    */
   @Prop({ default: null })
   displayEntitiesFunction?: (
     entities: Contact[] | PlanData[],
     entityType: "people" | "projects",
+    maxItems: number,
   ) => Contact[] | PlanData[];
 
   /**
@@ -309,98 +206,33 @@ export default class EntityGrid extends Vue {
   }
 
   /**
-   * Check if there are no entities to display
+   * Computed CSS classes for the grid layout
    */
-  get hasNoEntities(): boolean {
+  get gridClasses(): string {
+    const baseClasses = "grid gap-x-2 gap-y-4 text-center mb-4";
+
     if (this.entityType === "projects") {
-      // For projects: check internal state if no entities prop, otherwise check prop
-      const projectsToCheck = this.entities || this.allProjects;
-      return projectsToCheck.length === 0;
+      return `${baseClasses} grid-cols-3 md:grid-cols-4`;
     } else {
-      // For people: entities prop is required
-      return !this.entities || this.entities.length === 0;
+      return `${baseClasses} grid-cols-4 sm:grid-cols-5 md:grid-cols-6`;
     }
   }
 
   /**
-   * Get the entities array to use (prop or internal state)
-   */
-  get entitiesToUse(): Contact[] | PlanData[] {
-    if (this.entityType === "projects") {
-      // For projects: use prop if provided, otherwise use internal state
-      return this.entities || this.allProjects;
-    } else {
-      // For people: entities prop is required
-      return this.entities || [];
-    }
-  }
-
-  /**
-   * Computed entities to display - uses function prop if provided, otherwise uses infinite scroll
-   * When searching, returns filtered results with infinite scroll applied
+   * Computed entities to display - uses function prop if provided, otherwise defaults
    */
   get displayedEntities(): Contact[] | PlanData[] {
-    // If searching, return filtered results with infinite scroll
-    if (this.searchTerm.trim()) {
-      return this.filteredEntities.slice(0, this.displayedCount);
-    }
-
-    // If custom function provided, use it (disables infinite scroll)
     if (this.displayEntitiesFunction) {
-      return this.displayEntitiesFunction(this.entitiesToUse, this.entityType);
+      return this.displayEntitiesFunction(
+        this.entities,
+        this.entityType,
+        this.maxItems,
+      );
     }
 
-    // Default: projects use infinite scroll
-    if (this.entityType === "projects") {
-      return (this.entitiesToUse as PlanData[]).slice(0, this.displayedCount);
-    }
-
-    // People: handled by recentContacts + alphabeticalContacts (both use displayedCount)
-    return [];
-  }
-
-  /**
-   * Get the most recently added contacts (when showing contacts and not searching)
-   *
-   * NOTE: This assumes entities are already sorted by date added (newest first).
-   * See the entities prop documentation for details on using $contactsByDateAdded().
-   */
-  get recentContacts(): Contact[] {
-    if (
-      this.entityType !== "people" ||
-      this.searchTerm.trim() ||
-      !this.entities
-    ) {
-      return [];
-    }
-    // Entities are already sorted by date added (newest first)
-    return (this.entities as Contact[]).slice(0, RECENT_CONTACTS_COUNT);
-  }
-
-  /**
-   * Get the remaining contacts sorted alphabetically (when showing contacts and not searching)
-   * Uses infinite scroll to control how many are displayed
-   */
-  get alphabeticalContacts(): Contact[] {
-    if (
-      this.entityType !== "people" ||
-      this.searchTerm.trim() ||
-      !this.entities
-    ) {
-      return [];
-    }
-    // Skip the first few (recent contacts) and sort the rest alphabetically
-    // Create a copy to avoid mutating the original array
-    const remaining = this.entities as Contact[];
-    const sorted = [...remaining].sort((a: Contact, b: Contact) => {
-      // Sort alphabetically by name, falling back to DID if name is missing
-      const nameA = (a.name || a.did).toLowerCase();
-      const nameB = (b.name || b.did).toLowerCase();
-      return nameA.localeCompare(nameB);
-    });
-    // Apply infinite scroll: show based on displayedCount (minus the recent contacts)
-    const toShow = Math.max(0, this.displayedCount - RECENT_CONTACTS_COUNT);
-    return sorted.slice(0, toShow);
+    // Default implementation for backward compatibility
+    const maxDisplay = this.entityType === "projects" ? 7 : this.maxItems;
+    return this.entities.slice(0, maxDisplay);
   }
 
   /**
@@ -414,6 +246,15 @@ export default class EntityGrid extends Vue {
     }
   }
 
+  /**
+   * Whether to show the "Show All" navigation
+   */
+  get shouldShowAll(): boolean {
+    return (
+      !this.hideShowAll && this.entities.length > 0 && this.showAllRoute !== ""
+    );
+  }
+
   /**
    * Whether the "You" entity is conflicted
    */
@@ -487,440 +328,6 @@ export default class EntityGrid extends Vue {
     });
   }
 
-  /**
-   * Handle search input with debouncing
-   */
-  handleSearchInput(): void {
-    // Show spinner immediately when user types
-    this.isSearching = true;
-
-    // Clear existing timeout
-    if (this.searchTimeout) {
-      clearTimeout(this.searchTimeout);
-    }
-
-    // Set new timeout for 500ms delay
-    this.searchTimeout = setTimeout(() => {
-      this.performSearch();
-    }, 500);
-  }
-
-  /**
-   * Perform the actual search
-   * Routes to server-side search for projects or client-side filtering for contacts
-   */
-  async performSearch(): Promise<void> {
-    if (!this.searchTerm.trim()) {
-      this.filteredEntities = [];
-      this.displayedCount = INITIAL_BATCH_SIZE;
-      this.searchBeforeId = undefined;
-      this.infiniteScrollReset?.();
-      return;
-    }
-
-    this.isSearching = true;
-    this.searchBeforeId = undefined; // Reset pagination for new search
-
-    try {
-      if (this.entityType === "projects") {
-        // Server-side search for projects (initial load, no beforeId)
-        const searchLower = this.searchTerm.toLowerCase().trim();
-        await this.fetchProjects(undefined, searchLower);
-      } else {
-        // Client-side filtering for contacts (complete list)
-        await this.performContactSearch();
-      }
-
-      // Reset displayed count when search completes
-      this.displayedCount = INITIAL_BATCH_SIZE;
-      this.infiniteScrollReset?.();
-    } finally {
-      this.isSearching = false;
-    }
-  }
-
-  /**
-   * Fetch projects from API server
-   * Unified method for both loading all projects and searching projects.
-   * If claimContents is provided, performs search and updates filteredEntities.
-   * If claimContents is not provided, loads all projects and updates allProjects.
-   *
-   * @param beforeId - Optional rowId for pagination (loads projects before this ID)
-   * @param claimContents - Optional search term (if provided, performs search; if not, loads all)
-   */
-  async fetchProjects(
-    beforeId?: string,
-    claimContents?: string,
-  ): Promise<void> {
-    if (!this.apiServer) {
-      if (claimContents) {
-        this.filteredEntities = [];
-      } else {
-        this.allProjects = [];
-      }
-      if (this.notify) {
-        this.notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text: "API server not configured",
-          },
-          TIMEOUTS.SHORT,
-        );
-      }
-      return;
-    }
-
-    const isSearch = !!claimContents;
-    let url = `${this.apiServer}/api/v2/report/plans`;
-
-    // Build query parameters
-    const params: string[] = [];
-    if (claimContents) {
-      params.push(
-        `claimContents=${encodeURIComponent(claimContents.toLowerCase().trim())}`,
-      );
-    }
-    if (beforeId) {
-      params.push(`beforeId=${encodeURIComponent(beforeId)}`);
-    }
-    if (params.length > 0) {
-      url += `?${params.join("&")}`;
-    }
-
-    try {
-      const response = await fetch(url, {
-        method: "GET",
-        headers: await getHeaders(this.activeDid),
-      });
-
-      if (response.status !== 200) {
-        throw new Error(
-          isSearch ? "Failed to search projects" : "Failed to load projects",
-        );
-      }
-
-      const results = await response.json();
-      if (results.data) {
-        const newProjects = results.data.map(
-          (plan: PlanData & { rowId?: string }) => ({
-            ...plan,
-            rowId: plan.rowId,
-          }),
-        );
-
-        if (isSearch) {
-          // Search mode: update filteredEntities
-          if (beforeId) {
-            // Pagination: append new projects to existing search results
-            this.filteredEntities.push(...newProjects);
-          } else {
-            // Initial search: replace array
-            this.filteredEntities = newProjects;
-          }
-
-          // Update searchBeforeId for next pagination
-          if (newProjects.length > 0) {
-            const lastProject = newProjects[newProjects.length - 1];
-            this.searchBeforeId = lastProject.rowId || undefined;
-          } else {
-            this.searchBeforeId = undefined; // No more results
-          }
-        } else {
-          // Load mode: update allProjects
-          if (beforeId) {
-            // Pagination: append new projects
-            this.allProjects.push(...newProjects);
-          } else {
-            // Initial load: replace array
-            this.allProjects = newProjects;
-          }
-
-          // Update loadBeforeId for next pagination
-          if (newProjects.length > 0) {
-            const lastProject = newProjects[newProjects.length - 1];
-            this.loadBeforeId = lastProject.rowId || undefined;
-          } else {
-            this.loadBeforeId = undefined; // No more results
-          }
-        }
-      } else {
-        // No data in response
-        if (isSearch) {
-          if (!beforeId) {
-            // Only clear on initial search, not pagination
-            this.filteredEntities = [];
-          }
-          this.searchBeforeId = undefined;
-        } else {
-          if (!beforeId) {
-            // Only clear on initial load, not pagination
-            this.allProjects = [];
-          }
-          this.loadBeforeId = undefined;
-        }
-      }
-    } catch (error) {
-      logger.error(
-        `Error ${isSearch ? "searching" : "loading"} projects:`,
-        error,
-      );
-      if (isSearch) {
-        if (!beforeId) {
-          // Only clear on initial search error, not pagination error
-          this.filteredEntities = [];
-        }
-        this.searchBeforeId = undefined;
-      } else {
-        if (!beforeId) {
-          // Only clear on initial load error, not pagination error
-          this.allProjects = [];
-        }
-        this.loadBeforeId = undefined;
-      }
-      if (this.notify) {
-        this.notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text: isSearch
-              ? "Failed to search projects. Please try again."
-              : "Failed to load projects. Please try again.",
-          },
-          TIMEOUTS.STANDARD,
-        );
-      }
-    }
-  }
-
-  /**
-   * Client-side contact search
-   * Assumes entities prop contains complete contact list from local database
-   */
-  async performContactSearch(): Promise<void> {
-    if (!this.entities) {
-      this.filteredEntities = [];
-      return;
-    }
-
-    // Simulate async (for consistency with project search)
-    await new Promise((resolve) => setTimeout(resolve, 100));
-
-    const searchLower = this.searchTerm.toLowerCase().trim();
-
-    this.filteredEntities = (this.entities as Contact[])
-      .filter((contact: Contact) => {
-        const name = contact.name?.toLowerCase() || "";
-        const did = contact.did.toLowerCase();
-        return name.includes(searchLower) || did.includes(searchLower);
-      })
-      .sort((a: Contact, b: Contact) => {
-        // Sort alphabetically by name, falling back to DID if name is missing
-        const nameA = (a.name || a.did).toLowerCase();
-        const nameB = (b.name || b.did).toLowerCase();
-        return nameA.localeCompare(nameB);
-      });
-
-    // Contacts don't need pagination (complete list)
-    this.searchBeforeId = undefined;
-  }
-
-  /**
-   * Clear the search
-   */
-  clearSearch(): void {
-    this.searchTerm = "";
-    this.filteredEntities = [];
-    this.isSearching = false;
-    this.displayedCount = INITIAL_BATCH_SIZE;
-    this.searchBeforeId = undefined;
-    this.infiniteScrollReset?.();
-
-    // Clear any pending timeout
-    if (this.searchTimeout) {
-      clearTimeout(this.searchTimeout);
-      this.searchTimeout = null;
-    }
-  }
-
-  /**
-   * Determine if more entities can be loaded
-   */
-  canLoadMore(): boolean {
-    if (this.displayEntitiesFunction) {
-      // Custom function disables infinite scroll
-      return false;
-    }
-
-    if (this.searchTerm.trim()) {
-      // Search mode: check if more results available
-      if (this.entityType === "projects") {
-        // Projects: can load more if:
-        // 1. We have more already-loaded results to show, OR
-        // 2. We've shown all loaded results AND there's a searchBeforeId to load more
-        const hasMoreLoaded =
-          this.displayedCount < this.filteredEntities.length;
-        const canLoadMoreFromServer =
-          this.displayedCount >= this.filteredEntities.length &&
-          !!this.searchBeforeId &&
-          !this.isLoadingSearchMore;
-        return hasMoreLoaded || canLoadMoreFromServer;
-      } else {
-        // Contacts: client-side filtering returns all results at once
-        return this.displayedCount < this.filteredEntities.length;
-      }
-    }
-
-    // Non-search mode
-    if (this.entityType === "projects") {
-      // Projects: check internal state or prop
-      const projectsToCheck = this.entities || this.allProjects;
-      const beforeId = this.entities ? undefined : this.loadBeforeId;
-
-      // Can load more if:
-      // 1. We have more already-loaded results to show, OR
-      // 2. We've shown all loaded results AND there's a beforeId to load more (and not using entities prop)
-      const hasMoreLoaded = this.displayedCount < projectsToCheck.length;
-      const canLoadMoreFromServer =
-        !this.entities &&
-        this.displayedCount >= projectsToCheck.length &&
-        !!beforeId &&
-        !this.isLoadingProjects;
-
-      return hasMoreLoaded || canLoadMoreFromServer;
-    }
-
-    // People: check if more alphabetical contacts available
-    // Total available = recent + all alphabetical
-    if (!this.entities) {
-      return false;
-    }
-    const totalAvailable = RECENT_CONTACTS_COUNT + this.entities.length;
-    return this.displayedCount < totalAvailable;
-  }
-
-  /**
-   * Initialize infinite scroll on mount
-   */
-  async mounted(): Promise<void> {
-    // Load apiServer for project searches/loads
-    if (this.entityType === "projects") {
-      const settings = await this.$accountSettings();
-      this.apiServer = settings.apiServer || "";
-
-      // Load projects on mount if entities prop not provided
-      if (!this.entities && this.apiServer) {
-        this.isLoadingProjects = true;
-        try {
-          await this.fetchProjects();
-        } catch (error) {
-          logger.error("Error loading projects on mount:", error);
-        } finally {
-          this.isLoadingProjects = false;
-        }
-      }
-    }
-
-    // Validate entities prop for people
-    if (this.entityType === "people" && !this.entities) {
-      logger.error(
-        "EntityGrid: entities prop is required when entityType is 'people'",
-      );
-      if (this.notify) {
-        this.notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text: "Contacts data is required but not provided.",
-          },
-          TIMEOUTS.SHORT,
-        );
-      }
-    }
-
-    this.$nextTick(() => {
-      const container = this.$refs.scrollContainer as HTMLElement;
-
-      if (container) {
-        const { reset } = useInfiniteScroll(
-          container,
-          async () => {
-            // Search mode: handle search pagination
-            if (this.searchTerm.trim()) {
-              if (this.entityType === "projects") {
-                // Projects: load more search results if available
-                if (
-                  this.displayedCount >= this.filteredEntities.length &&
-                  this.searchBeforeId &&
-                  !this.isLoadingSearchMore
-                ) {
-                  this.isLoadingSearchMore = true;
-                  try {
-                    const searchLower = this.searchTerm.toLowerCase().trim();
-                    await this.fetchProjects(this.searchBeforeId, searchLower);
-                    // After loading more, reset scroll state to allow further loading
-                    this.infiniteScrollReset?.();
-                  } catch (error) {
-                    logger.error("Error loading more search results:", error);
-                    // Error already handled in fetchProjects
-                  } finally {
-                    this.isLoadingSearchMore = false;
-                  }
-                } else {
-                  // Show more from already-loaded search results
-                  this.displayedCount += INCREMENT_SIZE;
-                }
-              } else {
-                // Contacts: show more from already-filtered results
-                this.displayedCount += INCREMENT_SIZE;
-              }
-            } else {
-              // Non-search mode
-              if (this.entityType === "projects") {
-                const projectsToCheck = this.entities || this.allProjects;
-                const beforeId = this.entities ? undefined : this.loadBeforeId;
-
-                // If using internal state and need to load more from server
-                if (
-                  !this.entities &&
-                  this.displayedCount >= projectsToCheck.length &&
-                  beforeId &&
-                  !this.isLoadingProjects
-                ) {
-                  this.isLoadingProjects = true;
-                  try {
-                    await this.fetchProjects(beforeId);
-                    // After loading more, reset scroll state to allow further loading
-                    this.infiniteScrollReset?.();
-                  } catch (error) {
-                    logger.error("Error loading more projects:", error);
-                    // Error already handled in fetchProjects
-                  } finally {
-                    this.isLoadingProjects = false;
-                  }
-                } else {
-                  // Normal case: increment displayedCount to show more from memory
-                  this.displayedCount += INCREMENT_SIZE;
-                }
-              } else {
-                // People: increment displayedCount to show more from memory
-                this.displayedCount += INCREMENT_SIZE;
-              }
-            }
-          },
-          {
-            distance: 50, // pixels from bottom
-            canLoadMore: () => this.canLoadMore(),
-          },
-        );
-        this.infiniteScrollReset = reset;
-      }
-    });
-  }
-
   // Emit methods using @Emit decorator
 
   @Emit("entity-selected")
@@ -933,47 +340,6 @@ export default class EntityGrid extends Vue {
   } {
     return data;
   }
-
-  /**
-   * Watch for changes in search term to reset displayed count and pagination
-   */
-  @Watch("searchTerm")
-  onSearchTermChange(): void {
-    // Reset displayed count and pagination when search term changes
-    this.displayedCount = INITIAL_BATCH_SIZE;
-    this.searchBeforeId = undefined;
-    this.infiniteScrollReset?.();
-  }
-
-  /**
-   * Watch for changes in entities prop to clear search and reset displayed count
-   */
-  @Watch("entities")
-  onEntitiesChange(): void {
-    // Clear search when entities change (fresh dialog open)
-    if (this.searchTerm) {
-      this.searchTerm = "";
-      this.filteredEntities = [];
-      this.searchBeforeId = undefined;
-    }
-    this.displayedCount = INITIAL_BATCH_SIZE;
-    this.infiniteScrollReset?.();
-
-    // For projects: if entities prop is provided, clear internal state
-    if (this.entityType === "projects" && this.entities) {
-      this.allProjects = [];
-      this.loadBeforeId = undefined;
-    }
-  }
-
-  /**
-   * Cleanup timeouts when component is destroyed
-   */
-  beforeUnmount(): void {
-    if (this.searchTimeout) {
-      clearTimeout(this.searchTimeout);
-    }
-  }
 }
 </script>
 

src/components/EntitySelectionStep.vue

@@ -3,9 +3,10 @@ from GiftedDialog.vue to handle the complete step 1 * entity selection interface
 with dynamic labeling and grid display. * * Features: * - Dynamic step labeling
 based on context * - EntityGrid integration for unified entity display * -
 Conflict detection and prevention * - Special entity handling (You, Unnamed) * -
-Cancel functionality * - Event delegation for entity selection * - Warning
-notifications for conflicted entities * - Template streamlined with computed CSS
-properties * * @author Matthew Raymer */
+Show All navigation with context preservation * - Cancel functionality * - Event
+delegation for entity selection * - Warning notifications for conflicted
+entities * - Template streamlined with computed CSS properties * * @author
+Matthew Raymer */
 <template>
   <div id="sectionGiftedGiver">
     <label class="block font-bold mb-4">
@@ -14,15 +15,19 @@ properties * * @author Matthew Raymer */
 
     <EntityGrid
       :entity-type="shouldShowProjects ? 'projects' : 'people'"
-      :entities="shouldShowProjects ? projects || undefined : allContacts"
+      :entities="shouldShowProjects ? projects : allContacts"
+      :max-items="10"
       :active-did="activeDid"
       :all-my-dids="allMyDids"
       :all-contacts="allContacts"
       :conflict-checker="conflictChecker"
       :show-you-entity="shouldShowYouEntity"
       :you-selectable="youSelectable"
+      :show-all-route="showAllRoute"
+      :show-all-query-params="showAllQueryParams"
       :notify="notify"
       :conflict-context="conflictContext"
+      :hide-show-all="hideShowAll"
       @entity-selected="handleEntitySelected"
     />
 
@@ -63,6 +68,7 @@ interface EntitySelectionEvent {
  * - EntityGrid integration for unified entity display
  * - Conflict detection and prevention
  * - Special entity handling (You, Unnamed)
+ * - Show All navigation with context preservation
  * - Cancel functionality
  * - Event delegation for entity selection
  * - Warning notifications for conflicted entities
@@ -94,9 +100,9 @@ export default class EntitySelectionStep extends Vue {
   @Prop({ default: false })
   isFromProjectView!: boolean;
 
-  /** Array of available projects (optional - EntityGrid loads internally if not provided) */
-  @Prop({ required: false })
-  projects?: PlanData[];
+  /** Array of available projects */
+  @Prop({ required: true })
+  projects!: PlanData[];
 
   /** Array of available contacts */
   @Prop({ required: true })
@@ -148,6 +154,10 @@ export default class EntitySelectionStep extends Vue {
   @Prop()
   notify?: (notification: NotificationIface, timeout?: number) => void;
 
+  /** Whether to hide the "Show All" navigation */
+  @Prop({ default: false })
+  hideShowAll!: boolean;
+
   /**
    * CSS classes for the cancel button
    */
@@ -212,6 +222,59 @@ export default class EntitySelectionStep extends Vue {
     return !this.conflictChecker(this.activeDid);
   }
 
+  /**
+   * Route name for "Show All" navigation
+   */
+  get showAllRoute(): string {
+    if (this.shouldShowProjects) {
+      return "discover";
+    } else if (this.allContacts.length > 0) {
+      return "contact-gift";
+    }
+    return "";
+  }
+
+  /**
+   * Query parameters for "Show All" navigation
+   */
+  get showAllQueryParams(): Record<string, string> {
+    const baseParams = {
+      stepType: this.stepType,
+      giverEntityType: this.giverEntityType,
+      recipientEntityType: this.recipientEntityType,
+      // Form field values to preserve
+      description: this.description,
+      amountInput: this.amountInput,
+      unitCode: this.unitCode,
+      offerId: this.offerId,
+      fromProjectId: this.fromProjectId,
+      toProjectId: this.toProjectId,
+      showProjects: this.showProjects.toString(),
+      isFromProjectView: this.isFromProjectView.toString(),
+    };
+
+    if (this.shouldShowProjects) {
+      // For project contexts, still pass entity type information
+      return baseParams;
+    }
+
+    return {
+      ...baseParams,
+      // Always pass both giver and recipient info for context preservation
+      giverProjectId: this.fromProjectId || "",
+      giverProjectName: this.giver?.name || "",
+      giverProjectImage: this.giver?.image || "",
+      giverProjectHandleId: this.giver?.handleId || "",
+      giverDid: this.giverEntityType === "person" ? this.giver?.did || "" : "",
+      recipientProjectId: this.toProjectId || "",
+      recipientProjectName: this.receiver?.name || "",
+      recipientProjectImage: this.receiver?.image || "",
+      recipientProjectHandleId: this.receiver?.handleId || "",
+      recipientDid:
+        this.recipientEntityType === "person" ? this.receiver?.did || "" : "",
+    };
+  }
+
   /**
    * Handle entity selection from EntityGrid
    */

src/components/FeedFilters.vue

@@ -211,6 +211,8 @@ export default class FeedFilters extends Vue {
 }
 </script>
 
-<style scoped>
-/* Component-specific styles if needed */
+<style>
+#dialogFeedFilters.dialog-overlay {
+  overflow: scroll;
+}
 </style>

src/components/GiftedDialog.vue

@@ -15,6 +15,7 @@
           giverEntityType === 'project' || recipientEntityType === 'project'
         "
         :is-from-project-view="isFromProjectView"
+        :projects="projects"
         :all-contacts="allContacts"
         :active-did="activeDid"
         :all-my-dids="allMyDids"
@@ -28,6 +29,7 @@
         :unit-code="unitCode"
         :offer-id="offerId"
         :notify="$notify"
+        :hide-show-all="hideShowAll"
         @entity-selected="handleEntitySelected"
         @cancel="cancel"
       />
@@ -67,6 +69,7 @@ import {
   createAndSubmitGive,
   didInfo,
   serverMessageForUser,
+  getHeaders,
 } from "../libs/endorserServer";
 import * as libsUtil from "../libs/util";
 import { Contact } from "../db/tables/contacts";
@@ -114,6 +117,7 @@ export default class GiftedDialog extends Vue {
   @Prop() fromProjectId = "";
   @Prop() toProjectId = "";
   @Prop() isFromProjectView = false;
+  @Prop() hideShowAll = false;
   @Prop({ default: "person" }) giverEntityType = "person" as
     | "person"
     | "project";
@@ -132,6 +136,7 @@ export default class GiftedDialog extends Vue {
   firstStep = true; // true = Step 1 (giver/recipient selection), false = Step 2 (amount/description)
   giver?: libsUtil.GiverReceiverInputInfo; // undefined means no identified giver agent
   offerId = "";
+  projects: PlanData[] = [];
   prompt = "";
   receiver?: libsUtil.GiverReceiverInputInfo;
   stepType = "giver";
@@ -228,9 +233,19 @@ export default class GiftedDialog extends Vue {
         apiServer: this.apiServer,
       });
 
-      this.allContacts = await this.$contactsByDateAdded();
+      this.allContacts = await this.$contacts();
 
       this.allMyDids = await retrieveAccountDids();
+
+      if (
+        this.giverEntityType === "project" ||
+        this.recipientEntityType === "project"
+      ) {
+        await this.loadProjects();
+      } else {
+        // Clear projects array when not needed
+        this.projects = [];
+      }
     } catch (err: unknown) {
       logger.error("Error retrieving settings from database:", err);
       this.safeNotify.error(
@@ -476,6 +491,27 @@ export default class GiftedDialog extends Vue {
     this.firstStep = false;
   }
 
+  async loadProjects() {
+    try {
+      const response = await fetch(this.apiServer + "/api/v2/report/plans", {
+        method: "GET",
+        headers: await getHeaders(this.activeDid),
+      });
+
+      if (response.status !== 200) {
+        throw new Error("Failed to load projects");
+      }
+
+      const results = await response.json();
+      if (results.data) {
+        this.projects = results.data;
+      }
+    } catch (error) {
+      logger.error("Error loading projects:", error);
+      this.safeNotify.error("Failed to load projects", TIMEOUTS.STANDARD);
+    }
+  }
+
   selectProject(project: PlanData) {
     this.giver = {
       did: project.handleId,
@@ -483,13 +519,10 @@ export default class GiftedDialog extends Vue {
       image: project.image,
       handleId: project.handleId,
     };
-    // Only set receiver to "You" if no receiver has been selected yet
-    if (!this.receiver || !this.receiver.did) {
-      this.receiver = {
-        did: this.activeDid,
-        name: "You",
-      };
-    }
+    this.receiver = {
+      did: this.activeDid,
+      name: "You",
+    };
     this.firstStep = false;
   }
 

src/components/ImageMethodDialog.vue

@@ -293,7 +293,7 @@ const inputImageFileNameRef = ref<Blob>();
 export default class ImageMethodDialog extends Vue {
   $notify!: NotifyFunction;
   $router!: Router;
-  notify!: ReturnType<typeof createNotifyHelpers>;
+  notify = createNotifyHelpers(this.$notify);
 
   /** Active DID for user authentication */
   activeDid = "";
@@ -498,9 +498,6 @@ export default class ImageMethodDialog extends Vue {
    * @throws {Error} When settings retrieval fails
    */
   async mounted() {
-    // Initialize notification helpers
-    this.notify = createNotifyHelpers(this.$notify);
-
     try {
       // Get activeDid from active_identity table (single source of truth)
       // eslint-disable-next-line @typescript-eslint/no-explicit-any

src/components/MeetingProjectDialog.vue

@@ -1,130 +0,0 @@
-<template>
-  <div v-if="visible" class="dialog-overlay">
-    <div class="dialog">
-      <!-- Header -->
-      <h2 class="text-lg font-semibold leading-[1.25] mb-4">Select Project</h2>
-
-      <!-- EntityGrid for projects -->
-      <EntityGrid
-        :entity-type="'projects'"
-        :active-did="activeDid"
-        :all-my-dids="allMyDids"
-        :all-contacts="allContacts"
-        :conflict-checker="() => false"
-        :show-you-entity="false"
-        :show-unnamed-entity="false"
-        :notify="notify"
-        :conflict-context="'project'"
-        @entity-selected="handleEntitySelected"
-      />
-
-      <!-- Cancel Button -->
-      <div class="flex gap-2 mt-4">
-        <button
-          class="block w-full text-center text-md uppercase 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-2 rounded-md"
-          @click="handleCancel"
-        >
-          Cancel
-        </button>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Prop, Vue, Emit } from "vue-facing-decorator";
-import EntityGrid from "./EntityGrid.vue";
-import { Contact } from "../db/tables/contacts";
-import { PlanData } from "../interfaces/records";
-import { NotificationIface } from "../constants/app";
-
-/**
- * MeetingProjectDialog - Dialog for selecting a project link for a meeting
- *
- * Features:
- * - EntityGrid integration for project selection
- * - No special entities (You, Unnamed)
- * - Immediate assignment on project selection
- * - Cancel button to close without selection
- */
-@Component({
-  components: {
-    EntityGrid,
-  },
-})
-export default class MeetingProjectDialog extends Vue {
-  /** Whether the dialog is visible */
-  visible = false;
-
-  /** Active user's DID */
-  @Prop({ required: true })
-  activeDid!: string;
-
-  /** All user's DIDs */
-  @Prop({ required: true })
-  allMyDids!: string[];
-
-  /** All contacts */
-  @Prop({ required: true })
-  allContacts!: Contact[];
-
-  /** Notification function from parent component */
-  @Prop()
-  notify?: (notification: NotificationIface, timeout?: number) => void;
-
-  /**
-   * Handle entity selection from EntityGrid
-   * Immediately assigns the selected project and closes the dialog
-   */
-  handleEntitySelected(event: {
-    type: "person" | "project";
-    data: Contact | PlanData;
-  }) {
-    const project = event.data as PlanData;
-    this.emitAssign(project);
-    this.close();
-  }
-
-  /**
-   * Handle cancel button click
-   */
-  handleCancel(): void {
-    this.close();
-  }
-
-  /**
-   * Open the dialog
-   */
-  open(): void {
-    this.visible = true;
-    this.emitOpen();
-  }
-
-  /**
-   * Close the dialog
-   */
-  close(): void {
-    this.visible = false;
-    this.emitClose();
-  }
-
-  // Emit methods using @Emit decorator
-
-  @Emit("assign")
-  emitAssign(project: PlanData): PlanData {
-    return project;
-  }
-
-  @Emit("open")
-  emitOpen(): void {
-    // Emit when dialog opens
-  }
-
-  @Emit("close")
-  emitClose(): void {
-    // Emit when dialog closes
-  }
-}
-</script>
-
-<style scoped></style>

src/components/MembersList.vue

@@ -1,255 +1,183 @@
 <template>
-  <div>
-    <div class="space-y-4">
-      <!-- Loading State -->
-      <div
-        v-if="isLoading"
-        class="mt-16 text-center text-4xl bg-slate-400 text-white w-14 py-2.5 rounded-full mx-auto"
-      >
-        <font-awesome icon="spinner" class="fa-spin-pulse" />
-      </div>
-
-      <!-- Members List -->
-
-      <div v-else>
-        <div class="text-center text-red-600 my-4">
-          {{ decryptionErrorMessage() }}
-        </div>
-
-        <div v-if="missingMyself" class="py-4 text-red-600">
-          You are not currently admitted by the organizer.
-        </div>
-        <div v-if="!firstName" class="py-4 text-red-600">
-          Your name is not set, so others may not recognize you. Reload this
-          page to set it.
-        </div>
-
-        <ul class="list-disc text-sm ps-4 space-y-2 mb-4">
-          <li
-            v-if="
-              membersToShow().length > 0 && showOrganizerTools && isOrganizer
-            "
-          >
-            Click
-            <font-awesome icon="circle-plus" class="text-blue-500 text-sm" />
-            /
-            <font-awesome icon="circle-minus" class="text-rose-500 text-sm" />
-            to add/remove them to/from the meeting.
-          </li>
-          <li
-            v-if="
-              membersToShow().length > 0 && getNonContactMembers().length > 0
-            "
-          >
-            Click
-            <font-awesome icon="circle-user" class="text-green-600 text-sm" />
-            to add them to your contacts.
-          </li>
-        </ul>
-
-        <div class="flex justify-between">
-          <!-- 
-        always have at least one refresh button even without members in case the organizer 
-         changes the password 
-         -->
-          <button
-            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-3 py-1.5 rounded-md"
-            title="Refresh members list now"
-            @click="refreshData(false)"
-          >
-            <font-awesome icon="rotate" :class="{ 'fa-spin': isLoading }" />
-            Refresh
-            <span class="text-xs">({{ countdownTimer }}s)</span>
-          </button>
-        </div>
-        <ul
-          v-if="membersToShow().length > 0"
-          class="border-t border-slate-300 my-2"
-        >
-          <li
-            v-for="member in membersToShow()"
-            :key="member.member.memberId"
-            :class="[
-              'border-b px-2 sm:px-3 py-1.5',
-              {
-                'bg-blue-50 border-t border-blue-300 -mt-[1px]':
-                  !member.member.admitted &&
-                  (isOrganizer || member.did === activeDid),
-              },
-              { 'border-slate-300': member.member.admitted },
-            ]"
-          >
-            <div class="flex items-center gap-2 justify-between">
-              <div class="flex items-center gap-1 overflow-hidden">
-                <h3
-                  :class="[
-                    'font-semibold truncate',
-                    {
-                      'text-slate-500':
-                        !member.member.admitted &&
-                        (isOrganizer || member.did === activeDid),
-                    },
-                  ]"
-                >
-                  <font-awesome
-                    v-if="member.member.memberId === members[0]?.memberId"
-                    icon="crown"
-                    class="fa-fw text-amber-400"
-                  />
-                  <font-awesome
-                    v-if="member.did === activeDid"
-                    icon="hand"
-                    class="fa-fw text-slate-500"
-                  />
-                  <font-awesome
-                    v-if="
-                      !member.member.admitted &&
-                      (isOrganizer || member.did === activeDid)
-                    "
-                    icon="hourglass-half"
-                    class="fa-fw text-slate-400"
-                  />
-                  {{ member.name || unnamedMember }}
-                </h3>
-                <div
-                  v-if="!getContactFor(member.did) && member.did !== activeDid"
-                  class="flex items-center gap-1.5 ml-2 ms-1"
-                >
-                  <button
-                    class="btn-add-contact ml-2"
-                    title="Add as contact"
-                    @click="addAsContact(member)"
-                  >
-                    <font-awesome icon="circle-user" />
-                  </button>
-
-                  <button
-                    class="btn-info-contact ml-2"
-                    title="Contact Info"
-                    @click="
-                      informAboutAddingContact(
-                        getContactFor(member.did) !== undefined,
-                      )
-                    "
-                  >
-                    <font-awesome icon="circle-info" />
-                  </button>
-                </div>
-                <div
-                  v-if="getContactFor(member.did) && member.did !== activeDid"
-                  class="flex items-center gap-1.5 ms-1"
-                >
-                  <router-link
-                    :to="{ name: 'contact-edit', params: { did: member.did } }"
-                  >
-                    <font-awesome
-                      icon="pen"
-                      class="text-sm text-blue-500 ml-2 mb-1"
-                    />
-                  </router-link>
-                  <router-link
-                    :to="{ name: 'did', params: { did: member.did } }"
-                  >
-                    <font-awesome
-                      icon="arrow-up-right-from-square"
-                      class="text-sm text-blue-500 ml-2 mb-1"
-                    />
-                  </router-link>
-                </div>
-              </div>
-              <span
-                v-if="
-                  showOrganizerTools && isOrganizer && member.did !== activeDid
-                "
-                class="flex items-center gap-1.5"
-              >
-                <button
-                  :class="
-                    member.member.admitted
-                      ? 'btn-admission-remove'
-                      : 'btn-admission-add'
-                  "
-                  :title="
-                    member.member.admitted ? 'Remove member' : 'Admit member'
-                  "
-                  @click="checkWhetherContactBeforeAdmitting(member)"
-                >
-                  <font-awesome
-                    :icon="
-                      member.member.admitted ? 'circle-minus' : 'circle-plus'
-                    "
-                  />
-                </button>
-
-                <button
-                  class="btn-info-admission"
-                  title="Admission Info"
-                  @click="informAboutAdmission()"
-                >
-                  <font-awesome icon="circle-info" />
-                </button>
-              </span>
-            </div>
-            <p class="text-xs text-gray-600 truncate">
-              {{ member.did }}
-            </p>
-          </li>
-        </ul>
-
-        <div v-if="membersToShow().length > 0" class="flex justify-between">
-          <!-- 
-        always have at least one refresh button even without members in case the organizer 
-         changes the password 
-         -->
-          <button
-            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-3 py-1.5 rounded-md"
-            title="Refresh members list now"
-            @click="refreshData(false)"
-          >
-            <font-awesome icon="rotate" :class="{ 'fa-spin': isLoading }" />
-            Refresh
-            <span class="text-xs">({{ countdownTimer }}s)</span>
-          </button>
-        </div>
-
-        <p v-if="members.length === 0" class="text-gray-500 py-4">
-          No members have joined this meeting yet
-        </p>
-      </div>
+  <div class="space-y-4">
+    <!-- Loading State -->
+    <div
+      v-if="isLoading"
+      class="mt-16 text-center text-4xl bg-slate-400 text-white w-14 py-2.5 rounded-full mx-auto"
+    >
+      <font-awesome icon="spinner" class="fa-spin-pulse" />
     </div>
 
-    <!-- Bulk Members Dialog for both admitting and setting visibility -->
-    <BulkMembersDialog
-      ref="bulkMembersDialog"
-      :active-did="activeDid"
-      :api-server="apiServer"
-      :is-organizer="isOrganizer"
-      @close="closeBulkMembersDialogCallback"
-    />
+    <!-- Members List -->
+
+    <div v-else>
+      <div class="text-center text-red-600 py-4">
+        {{ decryptionErrorMessage() }}
+      </div>
+
+      <div v-if="missingMyself" class="py-4 text-red-600">
+        You are not currently admitted by the organizer.
+      </div>
+      <div v-if="!firstName" class="py-4 text-red-600">
+        Your name is not set, so others may not recognize you. Reload this page
+        to set it.
+      </div>
+
+      <div>
+        <span
+          v-if="membersToShow().length > 0 && showOrganizerTools && isOrganizer"
+          class="inline-flex items-center flex-wrap"
+        >
+          <span class="inline-flex items-center">
+            &bull; Click
+            <span
+              class="mx-2 min-w-[24px] min-h-[24px] w-6 h-6 flex items-center justify-center rounded-full bg-blue-100 text-blue-600"
+            >
+              <font-awesome icon="plus" class="text-sm" />
+            </span>
+            /
+            <span
+              class="mx-2 min-w-[24px] min-h-[24px] w-6 h-6 flex items-center justify-center rounded-full bg-blue-100 text-blue-600"
+            >
+              <font-awesome icon="minus" class="text-sm" />
+            </span>
+            to add/remove them to/from the meeting.
+          </span>
+        </span>
+      </div>
+      <div>
+        <span
+          v-if="membersToShow().length > 0"
+          class="inline-flex items-center"
+        >
+          &bull; Click
+          <span
+            class="mx-2 w-8 h-8 flex items-center justify-center rounded-full bg-green-100 text-green-600"
+          >
+            <font-awesome icon="circle-user" class="text-xl" />
+          </span>
+          to add them to your contacts.
+        </span>
+      </div>
+
+      <div class="flex justify-center">
+        <!-- 
+        always have at least one refresh button even without members in case the organizer 
+         changes the password 
+         -->
+        <button
+          class="btn-action-refresh"
+          title="Refresh members list"
+          @click="fetchMembers"
+        >
+          <font-awesome icon="rotate" :class="{ 'fa-spin': isLoading }" />
+        </button>
+      </div>
+      <div
+        v-for="member in membersToShow()"
+        :key="member.member.memberId"
+        class="mt-2 p-4 bg-gray-50 rounded-lg"
+      >
+        <div class="flex items-center justify-between">
+          <div class="flex items-center">
+            <h3 class="text-lg font-medium">
+              {{ member.name || unnamedMember }}
+            </h3>
+            <div
+              v-if="!getContactFor(member.did) && member.did !== activeDid"
+              class="flex justify-end"
+            >
+              <button
+                class="btn-add-contact"
+                title="Add as contact"
+                @click="addAsContact(member)"
+              >
+                <font-awesome icon="circle-user" class="text-xl" />
+              </button>
+            </div>
+            <button
+              v-if="member.did !== activeDid"
+              class="btn-info-contact"
+              title="Contact info"
+              @click="
+                informAboutAddingContact(
+                  getContactFor(member.did) !== undefined,
+                )
+              "
+            >
+              <font-awesome icon="circle-info" class="text-base" />
+            </button>
+          </div>
+          <div class="flex">
+            <span
+              v-if="
+                showOrganizerTools && isOrganizer && member.did !== activeDid
+              "
+              class="flex items-center"
+            >
+              <button
+                class="btn-admission"
+                :title="
+                  member.member.admitted ? 'Remove member' : 'Admit member'
+                "
+                @click="checkWhetherContactBeforeAdmitting(member)"
+              >
+                <font-awesome
+                  :icon="member.member.admitted ? 'minus' : 'plus'"
+                  class="text-sm"
+                />
+              </button>
+              <button
+                class="btn-info-admission"
+                title="Admission info"
+                @click="informAboutAdmission()"
+              >
+                <font-awesome icon="circle-info" class="text-base" />
+              </button>
+            </span>
+          </div>
+        </div>
+        <p class="text-sm text-gray-600 truncate">
+          {{ member.did }}
+        </p>
+      </div>
+      <div v-if="membersToShow().length > 0" class="flex justify-center mt-4">
+        <button
+          class="btn-action-refresh"
+          title="Refresh members list"
+          @click="fetchMembers"
+        >
+          <font-awesome icon="rotate" :class="{ 'fa-spin': isLoading }" />
+        </button>
+      </div>
+
+      <p v-if="members.length === 0" class="text-gray-500 py-4">
+        No members have joined this meeting yet
+      </p>
+    </div>
   </div>
 </template>
 
 <script lang="ts">
 import { Component, Vue, Prop, Emit } from "vue-facing-decorator";
 
-import { NotificationIface } from "@/constants/app";
-import {
-  NOTIFY_ADD_CONTACT_FIRST,
-  NOTIFY_CONTINUE_WITHOUT_ADDING,
-} from "@/constants/notifications";
-import { SOMEONE_UNNAMED } from "@/constants/entities";
 import {
   errorStringForLog,
   getHeaders,
   register,
   serverMessageForUser,
-} from "@/libs/endorserServer";
-import { decryptMessage } from "@/libs/crypto";
-import { Contact } from "@/db/tables/contacts";
-import { MemberData } from "@/interfaces";
+} from "../libs/endorserServer";
+import { decryptMessage } from "../libs/crypto";
+import { Contact } from "../db/tables/contacts";
+import * as libsUtil from "../libs/util";
+import { NotificationIface } from "../constants/app";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
-import BulkMembersDialog from "./BulkMembersDialog.vue";
+import {
+  NOTIFY_ADD_CONTACT_FIRST,
+  NOTIFY_CONTINUE_WITHOUT_ADDING,
+} from "@/constants/notifications";
+import { SOMEONE_UNNAMED } from "@/constants/entities";
 
 interface Member {
   admitted: boolean;
@@ -265,15 +193,13 @@ interface DecryptedMember {
 }
 
 @Component({
-  components: {
-    BulkMembersDialog,
-  },
   mixins: [PlatformServiceMixin],
 })
 export default class MembersList extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
   notify!: ReturnType<typeof createNotifyHelpers>;
+  libsUtil = libsUtil;
 
   @Prop({ required: true }) password!: string;
   @Prop({ default: false }) showOrganizerTools!: boolean;
@@ -284,7 +210,6 @@ export default class MembersList extends Vue {
     return message;
   }
 
-  contacts: Array<Contact> = [];
   decryptedMembers: DecryptedMember[] = [];
   firstName = "";
   isLoading = true;
@@ -294,12 +219,7 @@ export default class MembersList extends Vue {
   missingMyself = false;
   activeDid = "";
   apiServer = "";
-
-  // Auto-refresh functionality
-  countdownTimer = 10;
-  autoRefreshInterval: NodeJS.Timeout | null = null;
-  lastRefreshTime = 0;
-  previousMemberDidsIgnored: string[] = [];
+  contacts: Array<Contact> = [];
 
   /**
    * Get the unnamed member constant
@@ -320,8 +240,8 @@ export default class MembersList extends Vue {
 
     this.apiServer = settings.apiServer || "";
     this.firstName = settings.firstName || "";
-
-    this.refreshData();
+    await this.fetchMembers();
+    await this.loadContacts();
   }
 
   async fetchMembers() {
@@ -367,10 +287,7 @@ export default class MembersList extends Vue {
         const content = JSON.parse(decryptedContent);
 
         this.decryptedMembers.push({
-          member: {
-            ...member,
-            admitted: member.admitted !== undefined ? member.admitted : true, // Default to true for non-organizers
-          },
+          member: member,
           name: content.name,
           did: content.did,
           isRegistered: !!content.isRegistered,
@@ -412,81 +329,22 @@ export default class MembersList extends Vue {
   }
 
   membersToShow(): DecryptedMember[] {
-    let members: DecryptedMember[] = [];
-
     if (this.isOrganizer) {
       if (this.showOrganizerTools) {
-        members = this.decryptedMembers;
+        return this.decryptedMembers;
       } else {
-        members = this.decryptedMembers.filter(
+        return this.decryptedMembers.filter(
           (member: DecryptedMember) => member.member.admitted,
         );
       }
-    } else {
-      // non-organizers only get visible members from server, plus themselves
-
-      // Check if current user is already in the decrypted members list
-      if (
-        !this.decryptedMembers.find((member) => member.did === this.activeDid)
-      ) {
-        // this is a stub for this user just in case they are waiting to get in
-        // which is especially useful so they can see their own DID
-        const currentUser: DecryptedMember = {
-          member: {
-            admitted: false,
-            content: "{}",
-            memberId: -1,
-          },
-          name: this.firstName,
-          did: this.activeDid,
-          isRegistered: false,
-        };
-        members = [currentUser, ...this.decryptedMembers];
-      } else {
-        members = this.decryptedMembers;
-      }
     }
-
-    // Sort members according to priority:
-    // 1. Organizer at the top
-    // 2. Current user next
-    // 3. Non-admitted members next
-    // 4. Everyone else after
-    return members.sort((a, b) => {
-      // Check if either member is the organizer (first member in original list)
-      const aIsOrganizer = a.member.memberId === this.members[0]?.memberId;
-      const bIsOrganizer = b.member.memberId === this.members[0]?.memberId;
-
-      // Check if either member is the current user
-      const aIsCurrentUser = a.did === this.activeDid;
-      const bIsCurrentUser = b.did === this.activeDid;
-
-      // Organizer always comes first
-      if (aIsOrganizer && !bIsOrganizer) return -1;
-      if (!aIsOrganizer && bIsOrganizer) return 1;
-
-      // If both are organizers, maintain original order
-      if (aIsOrganizer && bIsOrganizer) return 0;
-
-      // Current user comes second (after organizer)
-      if (aIsCurrentUser && !bIsCurrentUser && !bIsOrganizer) return -1;
-      if (!aIsCurrentUser && bIsCurrentUser && !aIsOrganizer) return 1;
-
-      // If both are current users, maintain original order
-      if (aIsCurrentUser && bIsCurrentUser) return 0;
-
-      // Non-admitted members come before admitted members
-      if (!a.member.admitted && b.member.admitted) return -1;
-      if (a.member.admitted && !b.member.admitted) return 1;
-
-      // If admission status is the same, maintain original order
-      return 0;
-    });
+    // non-organizers only get visible members from server
+    return this.decryptedMembers;
   }
 
   informAboutAdmission() {
     this.notify.info(
-      "This is to register people in Time Safari and to admit them to the meeting. A (+) symbol means they are not yet admitted and you can register and admit them. A (-) symbol means you can remove them, but they will stay registered.",
+      "This is to register people in Time Safari and to admit them to the meeting. A '+' symbol means they are not yet admitted and you can register and admit them. A '-' means you can remove them, but they will stay registered.",
       TIMEOUTS.VERY_LONG,
     );
   }
@@ -505,85 +363,18 @@ export default class MembersList extends Vue {
     }
   }
 
+  async loadContacts() {
+    this.contacts = await this.$getAllContacts();
+  }
+
   getContactFor(did: string): Contact | undefined {
     return this.contacts.find((contact) => contact.did === did);
   }
 
-  getPendingMembersToAdmit(): MemberData[] {
-    return this.decryptedMembers
-      .filter(
-        (member) => member.did !== this.activeDid && !member.member.admitted,
-      )
-      .map(this.convertDecryptedMemberToMemberData);
-  }
-
-  getNonContactMembers(): MemberData[] {
-    return this.decryptedMembers
-      .filter(
-        (member) =>
-          member.did !== this.activeDid && !this.getContactFor(member.did),
-      )
-      .map(this.convertDecryptedMemberToMemberData);
-  }
-
-  convertDecryptedMemberToMemberData(
-    decryptedMember: DecryptedMember,
-  ): MemberData {
-    return {
-      did: decryptedMember.did,
-      name: decryptedMember.name,
-      isContact: !!this.getContactFor(decryptedMember.did),
-      member: {
-        memberId: decryptedMember.member.memberId.toString(),
-      },
-    };
-  }
-
-  /**
-   * Show the bulk members dialog if conditions are met
-   * (admit pending members for organizers, add to contacts for non-organizers)
-   */
-  async refreshData(bypassPromptIfAllWereIgnored = true) {
-    // Force refresh both contacts and members
-    this.contacts = await this.$getAllContacts();
-    await this.fetchMembers();
-
-    const pendingMembers = this.isOrganizer
-      ? this.getPendingMembersToAdmit()
-      : this.getNonContactMembers();
-    if (pendingMembers.length === 0) {
-      this.startAutoRefresh();
-      return;
-    }
-    if (bypassPromptIfAllWereIgnored) {
-      // only show if there are members that have not been ignored
-      const pendingMembersNotIgnored = pendingMembers.filter(
-        (member) => !this.previousMemberDidsIgnored.includes(member.did),
-      );
-      if (pendingMembersNotIgnored.length === 0) {
-        this.startAutoRefresh();
-        // everyone waiting has been ignored
-        return;
-      }
-    }
-    this.stopAutoRefresh();
-    (this.$refs.bulkMembersDialog as BulkMembersDialog).open(pendingMembers);
-  }
-
-  // Bulk Members Dialog methods
-  async closeBulkMembersDialogCallback(
-    result: { notSelectedMemberDids: string[] } | undefined,
-  ) {
-    this.previousMemberDidsIgnored = result?.notSelectedMemberDids || [];
-
-    await this.refreshData();
-  }
-
   checkWhetherContactBeforeAdmitting(decrMember: DecryptedMember) {
     const contact = this.getContactFor(decrMember.did);
     if (!decrMember.member.admitted && !contact) {
-      // If not a contact, stop auto-refresh and show confirmation dialog
-      this.stopAutoRefresh();
+      // If not a contact, show confirmation dialog
       this.$notify(
         {
           group: "modal",
@@ -596,7 +387,6 @@ export default class MembersList extends Vue {
             await this.addAsContact(decrMember);
             // After adding as contact, proceed with admission
             await this.toggleAdmission(decrMember);
-            this.startAutoRefresh();
           },
           onNo: async () => {
             // If they choose not to add as contact, show second confirmation
@@ -609,19 +399,14 @@ export default class MembersList extends Vue {
                 yesText: NOTIFY_CONTINUE_WITHOUT_ADDING.yesText,
                 onYes: async () => {
                   await this.toggleAdmission(decrMember);
-                  this.startAutoRefresh();
                 },
                 onCancel: async () => {
                   // Do nothing, effectively canceling the operation
-                  this.startAutoRefresh();
                 },
               },
               TIMEOUTS.MODAL,
             );
           },
-          onCancel: async () => {
-            this.startAutoRefresh();
-          },
         },
         TIMEOUTS.MODAL,
       );
@@ -723,41 +508,6 @@ export default class MembersList extends Vue {
       this.notify.error(message, TIMEOUTS.LONG);
     }
   }
-
-  startAutoRefresh() {
-    this.stopAutoRefresh();
-    this.lastRefreshTime = Date.now();
-    this.countdownTimer = 10;
-
-    this.autoRefreshInterval = setInterval(() => {
-      const now = Date.now();
-      const timeSinceLastRefresh = (now - this.lastRefreshTime) / 1000;
-
-      if (timeSinceLastRefresh >= 10) {
-        // Time to refresh
-        this.refreshData();
-        this.lastRefreshTime = now;
-        this.countdownTimer = 10;
-      } else {
-        // Update countdown
-        this.countdownTimer = Math.max(
-          0,
-          Math.round(10 - timeSinceLastRefresh),
-        );
-      }
-    }, 1000); // Update every second
-  }
-
-  stopAutoRefresh() {
-    if (this.autoRefreshInterval) {
-      clearInterval(this.autoRefreshInterval);
-      this.autoRefreshInterval = null;
-    }
-  }
-
-  beforeDestroy() {
-    this.stopAutoRefresh();
-  }
 }
 </script>
 
@@ -772,26 +522,29 @@ export default class MembersList extends Vue {
 
 .btn-add-contact {
   /* stylelint-disable-next-line at-rule-no-unknown */
-  @apply text-lg text-green-600 hover:text-green-800 
+  @apply ml-2 w-8 h-8 flex items-center justify-center rounded-full 
+    bg-green-100 text-green-600 hover:bg-green-200 hover:text-green-800 
+    transition-colors;
+}
+
+.btn-info-contact {
+  /* stylelint-disable-next-line at-rule-no-unknown */
+  @apply ml-2 mb-2 w-6 h-6 flex items-center justify-center rounded-full 
+    bg-slate-100 text-slate-500 hover:bg-slate-200 hover:text-slate-800 
+    transition-colors;
+}
+
+.btn-admission {
+  /* stylelint-disable-next-line at-rule-no-unknown */
+  @apply mr-2 w-6 h-6 flex items-center justify-center rounded-full 
+    bg-blue-100 text-blue-600 hover:bg-blue-200 hover:text-blue-800 
     transition-colors;
 }
 
-.btn-info-contact,
 .btn-info-admission {
   /* stylelint-disable-next-line at-rule-no-unknown */
-  @apply text-slate-400 hover:text-slate-600 
-    transition-colors;
-}
-
-.btn-admission-add {
-  /* stylelint-disable-next-line at-rule-no-unknown */
-  @apply text-lg text-blue-500 hover:text-blue-700 
-    transition-colors;
-}
-
-.btn-admission-remove {
-  /* stylelint-disable-next-line at-rule-no-unknown */
-  @apply text-lg text-rose-500 hover:text-rose-700 
+  @apply mr-2 mb-2 w-6 h-6 flex items-center justify-center rounded-full 
+    bg-slate-100 text-slate-500 hover:bg-slate-200 hover:text-slate-800 
     transition-colors;
 }
 </style>

src/components/PersonCard.vue

@@ -3,25 +3,30 @@ GiftedDialog.vue to handle person entity display * with selection states and
 conflict detection. * * @author Matthew Raymer */
 <template>
   <li :class="cardClasses" @click="handleClick">
-    <div>
+    <div class="relative w-fit mx-auto">
       <EntityIcon
         v-if="person.did"
         :contact="person"
-        class="!size-[2rem] shrink-0 border border-slate-300 bg-white overflow-hidden rounded-full"
+        class="!size-[3rem] mx-auto border border-slate-300 bg-white overflow-hidden rounded-full mb-1"
       />
       <font-awesome
         v-else
         icon="circle-question"
-        class="text-slate-400 text-5xl mb-1 shrink-0"
+        class="text-slate-400 text-5xl mb-1"
       />
+
+      <!-- Time icon overlay for contacts -->
+      <div
+        v-if="person.did && showTimeIcon"
+        class="rounded-full bg-slate-400 absolute bottom-0 right-0 p-1 translate-x-1/3"
+      >
+        <font-awesome icon="clock" class="block text-white text-xs w-[1em]" />
+      </div>
     </div>
 
-    <div class="overflow-hidden">
-      <h3 :class="nameClasses">
-        {{ displayName }}
-      </h3>
-      <p class="text-xs text-slate-500 truncate">{{ person.did }}</p>
-    </div>
+    <h3 :class="nameClasses">
+      {{ displayName }}
+    </h3>
   </li>
 </template>
 
@@ -76,32 +81,29 @@ export default class PersonCard extends Vue {
    * Computed CSS classes for the card
    */
   get cardClasses(): string {
-    const baseCardClasses =
-      "flex items-center gap-2 px-2 py-1.5 border-b border-slate-300";
-
     if (!this.selectable || this.conflicted) {
-      return `${baseCardClasses} *:opacity-50 cursor-not-allowed`;
+      return "opacity-50 cursor-not-allowed";
     }
-
-    return `${baseCardClasses} cursor-pointer hover:bg-slate-50`;
+    return "cursor-pointer hover:bg-slate-50";
   }
 
   /**
    * Computed CSS classes for the person name
    */
   get nameClasses(): string {
-    const baseNameClasses = "text-sm font-semibold truncate";
+    const baseClasses =
+      "text-xs font-medium text-ellipsis whitespace-nowrap overflow-hidden";
 
     if (this.conflicted) {
-      return `${baseNameClasses} text-slate-500`;
+      return `${baseClasses} text-slate-400`;
     }
 
     // Add italic styling for entities without set names
     if (!this.person.name) {
-      return `${baseNameClasses} italic text-slate-500`;
+      return `${baseClasses} italic text-slate-500`;
     }
 
-    return baseNameClasses;
+    return baseClasses;
   }
 
   /**

src/components/ProjectCard.vue

@@ -2,26 +2,25 @@
 GiftedDialog.vue to handle project entity display * with selection states and
 issuer information. * * @author Matthew Raymer */
 <template>
-  <li
-    class="flex items-center gap-2 px-2 py-1.5 border-b border-slate-300 hover:bg-slate-50 cursor-pointer"
-    @click="handleClick"
-  >
-    <ProjectIcon
-      :entity-id="project.handleId"
-      :icon-size="30"
-      :image-url="project.image"
-      class="!size-[2rem] shrink-0 border border-slate-300 bg-white overflow-hidden rounded-full"
-    />
+  <li class="cursor-pointer" @click="handleClick">
+    <div class="relative w-fit mx-auto">
+      <ProjectIcon
+        :entity-id="project.handleId"
+        :icon-size="48"
+        :image-url="project.image"
+        class="!size-[3rem] mx-auto border border-slate-300 bg-white overflow-hidden rounded-full mb-1"
+      />
+    </div>
 
-    <div class="overflow-hidden">
-      <h3 class="text-sm font-semibold truncate">
-        {{ project.name || unnamedProject }}
-      </h3>
+    <h3
+      class="text-xs font-medium text-ellipsis whitespace-nowrap overflow-hidden"
+    >
+      {{ project.name || unnamedProject }}
+    </h3>
 
-      <div class="text-xs text-slate-500 truncate">
-        <font-awesome icon="user" class="text-slate-400" />
-        {{ issuerDisplayName }}
-      </div>
+    <div class="text-xs text-slate-500 truncate">
+      <font-awesome icon="user" class="fa-fw text-slate-400" />
+      {{ issuerDisplayName }}
     </div>
   </li>
 </template>

src/components/ProjectRepresentativeDialog.vue

@@ -1,117 +0,0 @@
-<template>
-  <div v-if="visible" class="dialog-overlay">
-    <div class="dialog">
-      <!-- Header -->
-      <h2 class="text-lg font-semibold leading-[1.25] mb-4">
-        Select Representative
-      </h2>
-
-      <!-- EntityGrid for contacts -->
-      <EntityGrid
-        :entity-type="'people'"
-        :entities="allContacts"
-        :active-did="activeDid"
-        :all-my-dids="allMyDids"
-        :all-contacts="allContacts"
-        :conflict-checker="() => false"
-        :show-you-entity="false"
-        :show-unnamed-entity="false"
-        :notify="notify"
-        :conflict-context="'representative'"
-        @entity-selected="handleEntitySelected"
-      />
-
-      <!-- Cancel Button -->
-      <div class="flex gap-2 mt-4">
-        <button
-          class="block w-full text-center text-md uppercase 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-2 rounded-md"
-          @click="handleCancel"
-        >
-          Cancel
-        </button>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Prop, Vue, Emit } from "vue-facing-decorator";
-import EntityGrid from "./EntityGrid.vue";
-import { Contact } from "../db/tables/contacts";
-import { NotificationIface } from "../constants/app";
-
-/**
- * ProjectRepresentativeDialog - Dialog for selecting an authorized representative
- *
- * Features:
- * - EntityGrid integration for contact selection
- * - No special entities (You, Unnamed)
- * - Immediate assignment on contact selection
- * - Cancel button to close without selection
- */
-@Component({
-  components: {
-    EntityGrid,
-  },
-})
-export default class ProjectRepresentativeDialog extends Vue {
-  /** Whether the dialog is visible */
-  visible = false;
-
-  /** Array of available contacts */
-  @Prop({ required: true })
-  allContacts!: Contact[];
-
-  /** Active user's DID */
-  @Prop({ required: true })
-  activeDid!: string;
-
-  /** All user's DIDs */
-  @Prop({ required: true })
-  allMyDids!: string[];
-
-  /** Notification function from parent component */
-  @Prop()
-  notify?: (notification: NotificationIface, timeout?: number) => void;
-
-  /**
-   * Handle entity selection from EntityGrid
-   * Immediately assigns the selected contact and closes the dialog
-   */
-  handleEntitySelected(event: { type: "person" | "project"; data: Contact }) {
-    const contact = event.data as Contact;
-    this.emitAssign(contact);
-    this.close();
-  }
-
-  /**
-   * Handle cancel button click
-   */
-  handleCancel(): void {
-    this.close();
-  }
-
-  /**
-   * Open the dialog
-   */
-  open(): void {
-    this.visible = true;
-  }
-
-  /**
-   * Close the dialog
-   */
-  close(): void {
-    this.visible = false;
-  }
-
-  // Emit methods using @Emit decorator
-
-  @Emit("assign")
-  emitAssign(contact: Contact): Contact {
-    return contact;
-  }
-}
-</script>
-
-<style scoped></style>

src/components/QuickNav.vue

@@ -14,11 +14,20 @@
           'text-slate-500': selected !== 'Home',
         }"
       >
-        <router-link :to="{ name: 'home' }" class="block text-center py-2 px-1">
+        <router-link
+          :to="{ name: 'home' }"
+          class="relative block text-center py-2 px-1"
+        >
           <div class="flex flex-col items-center">
             <font-awesome icon="house-chimney" class="fa-fw" />
             <span class="text-xs mt-1">feed</span>
           </div>
+
+          <!-- Notification dot - show while the user has unread notifications -->
+          <font-awesome
+            icon="circle"
+            class="absolute left-1/2 top-1 translate-x-2 text-rose-500 text-[10px] border border-white rounded-full"
+          ></font-awesome>
         </router-link>
       </li>
       <!-- Search -->
@@ -89,7 +98,7 @@
       >
         <router-link
           :to="{ name: 'account' }"
-          class="block text-center py-2 px-1"
+          class="relative block text-center py-2 px-1"
         >
           <div class="flex flex-col items-center">
             <font-awesome icon="circle-user" class="fa-fw" />
@@ -102,6 +111,12 @@
             -->
             <span class="text-xs mt-1">profile</span>
           </div>
+
+          <!-- Notification dot - show while the user has not yet backed up their seed phrase -->
+          <font-awesome
+            icon="circle"
+            class="absolute left-1/2 top-1 translate-x-2 text-rose-500 text-[10px] border border-white rounded-full"
+          ></font-awesome>
         </router-link>
       </li>
     </ul>

src/components/ShowAllCard.vue

@@ -0,0 +1,66 @@
+/** * ShowAllCard.vue - Show All navigation card component * * Extracted from
+GiftedDialog.vue to handle "Show All" navigation * for both people and projects
+entity types. * * @author Matthew Raymer */
+<template>
+  <li class="cursor-pointer">
+    <router-link :to="navigationRoute" class="block text-center">
+      <font-awesome icon="circle-right" class="text-blue-500 text-5xl mb-1" />
+      <h3
+        class="text-xs text-slate-500 font-medium italic text-ellipsis whitespace-nowrap overflow-hidden"
+      >
+        Show All
+      </h3>
+    </router-link>
+  </li>
+</template>
+
+<script lang="ts">
+import { Component, Prop, Vue } from "vue-facing-decorator";
+import { RouteLocationRaw } from "vue-router";
+
+/**
+ * ShowAllCard - Displays "Show All" navigation for entity grids
+ *
+ * Features:
+ * - Provides navigation to full entity listings
+ * - Supports different routes based on entity type
+ * - Maintains context through query parameters
+ * - Consistent visual styling with other cards
+ */
+@Component({ name: "ShowAllCard" })
+export default class ShowAllCard extends Vue {
+  /** Type of entities being shown */
+  @Prop({ required: true })
+  entityType!: "people" | "projects";
+
+  /** Route name to navigate to */
+  @Prop({ required: true })
+  routeName!: string;
+
+  /** Query parameters to pass to the route */
+  @Prop({ default: () => ({}) })
+  queryParams!: Record<string, string>;
+
+  /**
+   * Computed navigation route with query parameters
+   */
+  get navigationRoute(): RouteLocationRaw {
+    return {
+      name: this.routeName,
+      query: this.queryParams,
+    };
+  }
+}
+</script>
+
+<style scoped>
+/* Ensure router-link styling is consistent */
+a {
+  text-decoration: none;
+}
+
+a:hover .fa-circle-right {
+  transform: scale(1.1);
+  transition: transform 0.2s ease;
+}
+</style>

src/components/SpecialEntityCard.vue

@@ -63,24 +63,23 @@ export default class SpecialEntityCard extends Vue {
   conflictContext!: string;
 
   /**
-   * Computed CSS classes for the card
+   * Computed CSS classes for the card container
    */
   get cardClasses(): string {
-    const baseCardClasses =
-      "flex items-center gap-2 px-2 py-1.5 border-b border-slate-300";
+    const baseClasses = "block";
 
     if (!this.selectable || this.conflicted) {
-      return `${baseCardClasses} *:opacity-50 cursor-not-allowed`;
+      return `${baseClasses} cursor-not-allowed opacity-50`;
     }
 
-    return `${baseCardClasses} cursor-pointer hover:bg-slate-50`;
+    return `${baseClasses} cursor-pointer`;
   }
 
   /**
    * Computed CSS classes for the icon
    */
   get iconClasses(): string {
-    const baseClasses = "text-[2rem]";
+    const baseClasses = "text-5xl mb-1";
 
     if (this.conflicted) {
       return `${baseClasses} text-slate-400`;
@@ -102,7 +101,7 @@ export default class SpecialEntityCard extends Vue {
    */
   get nameClasses(): string {
     const baseClasses =
-      "text-sm font-semibold text-ellipsis whitespace-nowrap overflow-hidden";
+      "text-xs font-medium text-ellipsis whitespace-nowrap overflow-hidden";
 
     if (this.conflicted) {
       return `${baseClasses} text-slate-400`;

src/components/TopMessage.vue

@@ -1,9 +1,16 @@
 <template>
   <div
-    v-if="message"
-    class="-mt-6 bg-rose-100 border border-t-0 border-dashed border-rose-600 text-rose-900 text-sm text-center font-semibold rounded-b-md px-3 py-2 mb-3"
+    class="absolute right-5 top-[max(0.75rem,env(safe-area-inset-top),var(--safe-area-inset-top,0px))]"
   >
-    {{ message }}
+    <span class="align-center text-red-500 mr-2">{{ message }}</span>
+    <span class="ml-2">
+      <router-link
+        :to="{ name: 'help' }"
+        class="text-xs uppercase 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.5 py-1 rounded-md ml-1"
+      >
+        Help
+      </router-link>
+    </span>
   </div>
 </template>
 
@@ -20,8 +27,8 @@ import { logger } from "../utils/logger";
 })
 export default class TopMessage extends Vue {
   // Enhanced PlatformServiceMixin v4.0 provides:
-  // - Cached database operations: this.$contacts(), this.$accountSettings()
-  // - Settings shortcuts: this.$saveSettings()
+  // - Cached database operations: this.$contacts(), this.$settings(), this.$accountSettings()
+  // - Settings shortcuts: this.$saveSettings(), this.$saveMySettings()
   // - Cache management: this.$refreshSettings(), this.$clearAllCaches()
   // - Ultra-concise database methods: this.$db(), this.$exec(), this.$query()
   // - All methods use smart caching with TTL for massive performance gains

src/components/UsageLimitsSection.vue

@@ -8,7 +8,7 @@
     <!-- show spinner if loading limits -->
     <div
       v-if="loadingLimits"
-      class="text-slate-500 text-center italic mb-4"
+      class="text-center"
       role="status"
       aria-live="polite"
     >
@@ -19,10 +19,7 @@
         aria-hidden="true"
       ></font-awesome>
     </div>
-    <div
-      v-if="limitsMessage"
-      class="bg-amber-200 text-amber-900 border-amber-500 border-dashed border text-center rounded-md overflow-hidden px-4 py-3 mb-4"
-    >
+    <div class="mb-4 text-center">
       {{ limitsMessage }}
     </div>
     <div v-if="endorserLimits">

src/constants/accountView.ts

@@ -86,7 +86,7 @@ export const ACCOUNT_VIEW_CONSTANTS = {
     CANNOT_UPLOAD_IMAGES: "You cannot upload images.",
     BAD_SERVER_RESPONSE: "Bad server response.",
     ERROR_RETRIEVING_LIMITS:
-      "No limits were found, so no actions are allowed. You need to get registered.",
+      "No limits were found, so no actions are allowed. You will need to get registered.",
   },
 
   // Project assignment errors

src/constants/app.ts

@@ -59,7 +59,7 @@ export const PASSKEYS_ENABLED =
 export interface NotificationIface {
   group: string; // "alert" | "modal"
   type: string; // "toast" | "info" | "success" | "warning" | "danger"
-  title?: string;
+  title: string;
   text?: string;
   callback?: (success: boolean) => Promise<void>; // if this triggered an action
   noText?: string;
@@ -68,11 +68,4 @@ export interface NotificationIface {
   onYes?: () => Promise<void>;
   promptToStopAsking?: boolean;
   yesText?: string;
-  membersData?: Array<{
-    member: { admitted: boolean; content: string; memberId: number };
-    name: string;
-    did: string;
-    isContact: boolean;
-    contact?: { did: string; name?: string; seesMe?: boolean };
-  }>; // For passing member data to visibility dialog
 }

src/constants/contacts.ts

@@ -1,29 +0,0 @@
-/**
- * Constants for contact-related functionality
- * Created: 2025-11-16
- */
-
-/**
- * Contact method types with user-friendly labels
- * Used in: ContactEditView.vue, DIDView.vue
- */
-export const CONTACT_METHOD_TYPES = [
-  { value: "CELL", label: "Mobile" },
-  { value: "EMAIL", label: "Email" },
-  { value: "WHATSAPP", label: "WhatsApp" },
-] as const;
-
-/**
- * Type for contact method type values
- */
-export type ContactMethodType = (typeof CONTACT_METHOD_TYPES)[number]["value"];
-
-/**
- * Helper function to get label for a contact method type
- * @param type - The contact method type value (e.g., "CELL", "EMAIL")
- * @returns The user-friendly label or the original type if not found
- */
-export function getContactMethodLabel(type: string): string {
-  const methodType = CONTACT_METHOD_TYPES.find((m) => m.value === type);
-  return methodType ? methodType.label : type;
-}

src/constants/notifications.ts

@@ -510,6 +510,14 @@ export const NOTIFY_REGISTER_CONTACT = {
   text: "Do you want to register them?",
 };
 
+// Used in: ContactsView.vue (showOnboardMeetingDialog method - complex modal for onboarding meeting)
+export const NOTIFY_ONBOARDING_MEETING = {
+  title: "Onboarding Meeting",
+  text: "Would you like to start a new meeting?",
+  yesText: "Start New Meeting",
+  noText: "Join Existing Meeting",
+};
+
 // TestView.vue specific constants
 // Used in: TestView.vue (executeSql method - SQL error handling)
 export const NOTIFY_SQL_ERROR = {

src/db-sql/migration.ts

@@ -68,21 +68,13 @@ const MIG_004_SQL = `
   WHERE id = 1 
   AND EXISTS (SELECT 1 FROM settings WHERE id = 1 AND activeDid IS NOT NULL AND activeDid != '');
   
-  -- Copy important settings that were set in the MASTER_SETTINGS_KEY to the main identity.
-  -- (We're not doing them all because some were already identity-specific and others aren't as critical.)
-  UPDATE settings
-  SET lastViewedClaimId = (SELECT lastViewedClaimId FROM settings WHERE id = 1),
-      profileImageUrl = (SELECT profileImageUrl FROM settings WHERE id = 1),
-      showShortcutBvc = (SELECT showShortcutBvc FROM settings WHERE id = 1),
-      warnIfProdServer = (SELECT warnIfProdServer FROM settings WHERE id = 1),
-      warnIfTestServer = (SELECT warnIfTestServer FROM settings WHERE id = 1)
-  WHERE id = 2;
-
   -- CLEANUP: Remove orphaned settings records and clear legacy activeDid values
-  -- which usually simply deletes the MASTER_SETTINGS_KEY record.
   -- This completes the migration from settings-based to table-based active identity
-  DELETE FROM settings WHERE accountDid IS NULL;
-  UPDATE settings SET activeDid = NULL;
+  -- Use guarded operations to prevent accidental data loss
+  DELETE FROM settings WHERE accountDid IS NULL AND id != 1;
+  UPDATE settings SET activeDid = NULL WHERE id = 1 AND EXISTS (
+    SELECT 1 FROM active_identity WHERE id = 1 AND activeDid IS NOT NULL
+  );
 `;
 
 // Each migration can include multiple SQL statements (with semicolons)
@@ -192,13 +184,6 @@ const MIGRATIONS = [
     name: "004_active_identity_management",
     sql: MIG_004_SQL,
   },
-  {
-    name: "005_add_starredPlanHandleIds_to_settings",
-    sql: `
-      ALTER TABLE settings ADD COLUMN starredPlanHandleIds TEXT DEFAULT '[]'; -- JSON string
-      ALTER TABLE settings ADD COLUMN lastAckedStarredPlanChangesJwtId TEXT;
-    `,
-  },
 ];
 
 /**
@@ -234,20 +219,32 @@ export async function runMigrations<T>(
   sqlQuery: (sql: string, params?: unknown[]) => Promise<T>,
   extractMigrationNames: (result: T) => Set<string>,
 ): Promise<void> {
-  logger.debug("[Migration] Starting database migrations");
+  // Only log migration start in development
+  const isDevelopment = process.env.VITE_PLATFORM === "development";
+  if (isDevelopment) {
+    logger.debug("[Migration] Starting database migrations");
+  }
 
   for (const migration of MIGRATIONS) {
-    logger.debug("[Migration] Registering migration:", migration.name);
+    if (isDevelopment) {
+      logger.debug("[Migration] Registering migration:", migration.name);
+    }
     registerMigration(migration);
   }
 
-  logger.debug("[Migration] Running migration service");
+  if (isDevelopment) {
+    logger.debug("[Migration] Running migration service");
+  }
   await runMigrationsService(sqlExec, sqlQuery, extractMigrationNames);
 
-  logger.debug("[Migration] Database migrations completed");
+  if (isDevelopment) {
+    logger.debug("[Migration] Database migrations completed");
+  }
 
   // Bootstrapping: Ensure active account is selected after migrations
-  logger.debug("[Migration] Running bootstrapping hooks");
+  if (isDevelopment) {
+    logger.debug("[Migration] Running bootstrapping hooks");
+  }
   try {
     // Check if we have accounts but no active selection
     const accountsResult = await sqlQuery("SELECT COUNT(*) FROM accounts");
@@ -262,14 +259,18 @@ export async function runMigrations<T>(
       activeDid = (extractSingleValue(activeResult) as string) || null;
     } catch (error) {
       // Table doesn't exist - migration 004 may not have run yet
-      logger.debug(
-        "[Migration] active_identity table not found - migration may not have run",
-      );
+      if (isDevelopment) {
+        logger.debug(
+          "[Migration] active_identity table not found - migration may not have run",
+        );
+      }
       activeDid = null;
     }
 
     if (accountsCount > 0 && (!activeDid || activeDid === "")) {
-      logger.debug("[Migration] Auto-selecting first account as active");
+      if (isDevelopment) {
+        logger.debug("[Migration] Auto-selecting first account as active");
+      }
       const firstAccountResult = await sqlQuery(
         "SELECT did FROM accounts ORDER BY dateCreated, did LIMIT 1",
       );

src/db/databaseUtil.ts

@@ -9,6 +9,34 @@ import { logger } from "@/utils/logger";
 import { DEFAULT_ENDORSER_API_SERVER } from "@/constants/app";
 import { QueryExecResult } from "@/interfaces/database";
 
+export async function updateDefaultSettings(
+  settingsChanges: Settings,
+): Promise<boolean> {
+  delete settingsChanges.accountDid; // just in case
+  // ensure there is no "id" that would override the key
+  delete settingsChanges.id;
+  try {
+    const platformService = PlatformServiceFactory.getInstance();
+    const { sql, params } = generateUpdateStatement(
+      settingsChanges,
+      "settings",
+      "id = ?",
+      [MASTER_SETTINGS_KEY],
+    );
+    const result = await platformService.dbExec(sql, params);
+    return result.changes === 1;
+  } catch (error) {
+    logger.error("Error updating default settings:", error);
+    if (error instanceof Error) {
+      throw error; // Re-throw if it's already an Error with a message
+    } else {
+      throw new Error(
+        `Failed to update settings. We recommend you try again or restart the app.`,
+      );
+    }
+  }
+}
+
 export async function insertDidSpecificSettings(
   did: string,
   settings: Partial<Settings> = {},
@@ -63,7 +91,6 @@ export async function updateDidSpecificSettings(
     ? mapColumnsToValues(postUpdateResult.columns, postUpdateResult.values)[0]
     : null;
 
-  // Note that we want to eliminate this check (and fix the above if it doesn't work).
   // Check if any of the target fields were actually changed
   let actuallyUpdated = false;
   if (currentRecord && updatedRecord) {
@@ -130,11 +157,10 @@ export async function retrieveSettingsForDefaultAccount(): Promise<Settings> {
       result.columns,
       result.values,
     )[0] as Settings;
-    settings.searchBoxes = parseJsonField(settings.searchBoxes, []);
-    settings.starredPlanHandleIds = parseJsonField(
-      settings.starredPlanHandleIds,
-      [],
-    );
+    if (settings.searchBoxes) {
+      // @ts-expect-error - the searchBoxes field is a string in the DB
+      settings.searchBoxes = JSON.parse(settings.searchBoxes);
+    }
     return settings;
   }
 }
@@ -200,11 +226,10 @@ export async function retrieveSettingsForActiveAccount(): Promise<Settings> {
         );
       }
 
-      settings.searchBoxes = parseJsonField(settings.searchBoxes, []);
-      settings.starredPlanHandleIds = parseJsonField(
-        settings.starredPlanHandleIds,
-        [],
-      );
+      // Handle searchBoxes parsing
+      if (settings.searchBoxes) {
+        settings.searchBoxes = parseJsonField(settings.searchBoxes, []);
+      }
 
       return settings;
     } catch (error) {

src/db/tables/settings.ts

@@ -43,7 +43,6 @@ export type Settings = {
 
   lastAckedOfferToUserJwtId?: string; // the last JWT ID for offer-to-user that they've acknowledged seeing
   lastAckedOfferToUserProjectsJwtId?: string; // the last JWT ID for offers-to-user's-projects that they've acknowledged seeing
-  lastAckedStarredPlanChangesJwtId?: string; // the last JWT ID for starred plan changes that they've acknowledged seeing
 
   // The claim list has a most recent one used in notifications that's separate from the last viewed
   lastNotifiedClaimId?: string;
@@ -68,18 +67,15 @@ export type Settings = {
   showContactGivesInline?: boolean; // Display contact inline or not
   showGeneralAdvanced?: boolean; // Show advanced features which don't have their own flag
   showShortcutBvc?: boolean; // Show shortcut for Bountiful Voluntaryist Community actions
-
-  starredPlanHandleIds?: string[]; // Array of starred plan handle IDs
   vapid?: string; // VAPID (Voluntary Application Server Identification) field for web push
   warnIfProdServer?: boolean; // Warn if using a production server
   warnIfTestServer?: boolean; // Warn if using a testing server
   webPushServer?: string; // Web Push server URL
 };
 
-// type of settings where the values are JSON strings instead of objects
+// type of settings where the searchBoxes are JSON strings instead of objects
 export type SettingsWithJsonStrings = Settings & {
   searchBoxes: string;
-  starredPlanHandleIds: string;
 };
 
 export function checkIsAnyFeedFilterOn(settings: Settings): boolean {
@@ -96,11 +92,6 @@ export const SettingsSchema = {
 /**
  * Constants.
  */
-
-/**
- * This is deprecated.
- * It only remains for those with a PWA who have not migrated, but we'll soon remove it.
- */
 export const MASTER_SETTINGS_KEY = "1";
 
 export const DEFAULT_PASSKEY_EXPIRATION_MINUTES = 15;

src/interfaces/claims.ts

@@ -14,13 +14,6 @@ export interface AgreeActionClaim extends ClaimObject {
   object: Record<string, unknown>;
 }
 
-export interface EmojiClaim extends ClaimObject {
-  // default context is "https://endorser.ch"
-  "@type": "Emoji";
-  text: string;
-  parentItem: { lastClaimId: string };
-}
-
 // Note that previous VCs may have additional fields.
 // https://endorser.ch/doc/html/transactions.html#id4
 export interface GiveActionClaim extends ClaimObject {
@@ -79,15 +72,11 @@ export interface PlanActionClaim extends ClaimObject {
   name: string;
   agent?: { identifier: string };
   description?: string;
-  endTime?: string;
   identifier?: string;
-  image?: string;
   lastClaimId?: string;
   location?: {
     geo: { "@type": "GeoCoordinates"; latitude: number; longitude: number };
   };
-  startTime?: string;
-  url?: string;
 }
 
 // AKA Registration & RegisterAction

src/interfaces/common.ts

@@ -70,11 +70,18 @@ export interface AxiosErrorResponse {
   [key: string]: unknown;
 }
 
+export interface UserInfo {
+  did: string;
+  name: string;
+  publicEncKey: string;
+  registered: boolean;
+  profileImageUrl?: string;
+  nextPublicEncKeyHash?: string;
+}
+
 export interface CreateAndSubmitClaimResult {
   success: boolean;
-  embeddedRecordError?: string;
   error?: string;
-  claimId?: string;
   handleId?: string;
 }
 

src/interfaces/deepLinks.ts

@@ -68,7 +68,6 @@ export const deepLinkPathSchemas = {
   "user-profile": z.object({
     id: z.string(),
   }),
-  "shared-photo": z.object({}),
 };
 
 export const deepLinkQuerySchemas = {

src/interfaces/index.ts

@@ -1,7 +1,36 @@
-export * from "./claims";
-export * from "./claims-result";
-export * from "./common";
-export * from "./deepLinks";
+export type {
+  // From common.ts
+  CreateAndSubmitClaimResult,
+  GenericCredWrapper,
+  GenericVerifiableCredential,
+  KeyMeta,
+  // Exclude types that are also exported from other files
+  // GiveVerifiableCredential,
+  // OfferVerifiableCredential,
+  // RegisterVerifiableCredential,
+  // PlanSummaryRecord,
+  // UserInfo,
+} from "./common";
+
+export type {
+  // From claims.ts
+  GiveActionClaim,
+  OfferClaim,
+  RegisterActionClaim,
+} from "./claims";
+
+export type {
+  // From records.ts
+  PlanSummaryRecord,
+} from "./records";
+
+export type {
+  // From user.ts
+  UserInfo,
+} from "./user";
+
 export * from "./limits";
+export * from "./deepLinks";
+export * from "./common";
+export * from "./claims-result";
 export * from "./records";
-export * from "./user";

src/interfaces/records.ts

@@ -1,26 +1,13 @@
-import { GiveActionClaim, OfferClaim, PlanActionClaim } from "./claims";
-import { GenericCredWrapper } from "./common";
-
-export interface EmojiSummaryRecord {
-  issuerDid: string;
-  jwtId: string;
-  text: string;
-  parentHandleId: string;
-}
+import { GiveActionClaim, OfferClaim } from "./claims";
 
 // a summary record; the VC is found the fullClaim field
 export interface GiveSummaryRecord {
-  [x: string]:
-    | PropertyKey
-    | undefined
-    | GiveActionClaim
-    | Record<string, number>;
+  [x: string]: PropertyKey | undefined | GiveActionClaim;
   type?: string;
   agentDid: string;
   amount: number;
   amountConfirmed: number;
   description: string;
-  emojiCount: Record<string, number>; // Map of emoji character to count
   fullClaim: GiveActionClaim;
   fulfillsHandleId: string;
   fulfillsPlanHandleId?: string;
@@ -57,12 +44,7 @@ export interface OfferToPlanSummaryRecord extends OfferSummaryRecord {
   planName: string;
 }
 
-/**
- * A summary record
- * The VC is not currently part of this record.
- *
- * If you change this, you may want to update NewActivityView.vue to handle differences correctly.
- */
+// a summary record; the VC is not currently part of this record
 export interface PlanSummaryRecord {
   agentDid?: string;
   description: string;
@@ -79,13 +61,6 @@ export interface PlanSummaryRecord {
   jwtId?: string;
 }
 
-export interface PlanSummaryAndPreviousClaim {
-  plan: PlanSummaryRecord;
-  // This can be undefined, eg. if a project is starred after the stored last-seen-change-jwt ID.
-  // The endorser-ch test code shows some cases.
-  wrappedClaimBefore?: GenericCredWrapper<PlanActionClaim>;
-}
-
 /**
  * Represents data about a project
  *
@@ -112,10 +87,7 @@ export interface PlanData {
   name: string;
   /**
    * The identifier of the project record -- different from jwtId
-   *
-   * This has been used to iterate through plan records, because jwtId ordering doesn't match
-   * chronological create ordering, though it does match most recent edit order (in reverse order).
-   * (It may be worthwhile to order by jwtId instead. It is an indexed field.)
+   * (Maybe we should use the jwtId to iterate through the records instead.)
    **/
   rowId?: string;
 }

src/interfaces/user.ts

@@ -6,12 +6,3 @@ export interface UserInfo {
   profileImageUrl?: string;
   nextPublicEncKeyHash?: string;
 }
-
-export interface MemberData {
-  did: string;
-  name: string;
-  isContact: boolean;
-  member: {
-    memberId: string;
-  };
-}

src/libs/endorserServer.ts

@@ -42,6 +42,9 @@ import {
   PlanActionClaim,
   RegisterActionClaim,
   TenureClaim,
+} from "../interfaces/claims";
+
+import {
   GenericCredWrapper,
   GenericVerifiableCredential,
   AxiosErrorResponse,
@@ -52,12 +55,9 @@ import {
   QuantitativeValue,
   KeyMetaWithPrivate,
   KeyMetaMaybeWithPrivate,
-  OfferSummaryRecord,
-  OfferToPlanSummaryRecord,
-  PlanSummaryAndPreviousClaim,
-  PlanSummaryRecord,
-} from "../interfaces";
-import { logger, safeStringify } from "../utils/logger";
+} from "../interfaces/common";
+import { PlanSummaryRecord } from "../interfaces/records";
+import { logger } from "../utils/logger";
 import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
 import { APP_SERVER } from "@/constants/app";
 import { SOMEONE_UNNAMED } from "@/constants/entities";
@@ -362,22 +362,6 @@ export function didInfo(
   return didInfoForContact(did, activeDid, contact, allMyDids).displayName;
 }
 
-/**
- * In some contexts (eg. agent), a blank really is nobody.
- */
-export function didInfoOrNobody(
-  did: string | undefined,
-  activeDid: string | undefined,
-  allMyDids: string[],
-  contacts: Contact[],
-): string {
-  if (did == null) {
-    return "Nobody";
-  } else {
-    return didInfo(did, activeDid, allMyDids, contacts);
-  }
-}
-
 /**
  * return text description without any references to "you" as user
  */
@@ -625,7 +609,11 @@ async function performPlanRequest(
 
       return cred;
     } else {
-      logger.debug(
+      // Use debug level for development to reduce console noise
+      const isDevelopment = process.env.VITE_PLATFORM === "development";
+      const log = isDevelopment ? logger.debug : logger.log;
+
+      log(
         "[Plan Loading] ⚠️ Plan cache is empty for handle",
         handleId,
         " Got data:",
@@ -697,7 +685,7 @@ export function serverMessageForUser(error: unknown): string | undefined {
 export function errorStringForLog(error: unknown) {
   let stringifiedError = "" + error;
   try {
-    stringifiedError = safeStringify(error);
+    stringifiedError = JSON.stringify(error);
   } catch (e) {
     // can happen with Dexie, eg:
     // TypeError: Converting circular structure to JSON
@@ -709,7 +697,7 @@ export function errorStringForLog(error: unknown) {
 
   if (error && typeof error === "object" && "response" in error) {
     const err = error as AxiosErrorResponse;
-    const errorResponseText = safeStringify(err.response);
+    const errorResponseText = JSON.stringify(err.response);
     // for some reason, error.response is not included in stringify result (eg. for 400 errors on invite redemptions)
     if (!R.empty(errorResponseText) && !fullError.includes(errorResponseText)) {
       // add error.response stuff
@@ -719,7 +707,7 @@ export function errorStringForLog(error: unknown) {
         R.equals(err.config, err.response.config)
       ) {
         // but exclude "config" because it's already in there
-        const newErrorResponseText = safeStringify(
+        const newErrorResponseText = JSON.stringify(
           R.omit(["config"] as never[], err.response),
         );
         fullError +=
@@ -742,7 +730,7 @@ export async function getNewOffersToUser(
   activeDid: string,
   afterOfferJwtId?: string,
   beforeOfferJwtId?: string,
-): Promise<{ data: Array<OfferSummaryRecord>; hitLimit: boolean }> {
+) {
   let url = `${apiServer}/api/v2/report/offers?recipientDid=${activeDid}`;
   if (afterOfferJwtId) {
     url += "&afterId=" + afterOfferJwtId;
@@ -764,7 +752,7 @@ export async function getNewOffersToUserProjects(
   activeDid: string,
   afterOfferJwtId?: string,
   beforeOfferJwtId?: string,
-): Promise<{ data: Array<OfferToPlanSummaryRecord>; hitLimit: boolean }> {
+) {
   let url = `${apiServer}/api/v2/report/offersToPlansOwnedByMe`;
   if (afterOfferJwtId) {
     url += "?afterId=" + afterOfferJwtId;
@@ -778,46 +766,6 @@ export async function getNewOffersToUserProjects(
   return response.data;
 }
 
-/**
- * Get starred projects that have been updated since the last check
- *
- * @param axios - axios instance
- * @param apiServer - endorser API server URL
- * @param activeDid - user's DID for authentication
- * @param starredPlanHandleIds - array of starred project handle IDs
- * @param afterId - JWT ID to check for changes after (from lastAckedStarredPlanChangesJwtId)
- * @returns { data: Array<PlanSummaryAndPreviousClaim>, hitLimit: boolean }
- */
-export async function getStarredProjectsWithChanges(
-  axios: Axios,
-  apiServer: string,
-  activeDid: string,
-  starredPlanHandleIds: string[],
-  afterId?: string,
-): Promise<{ data: Array<PlanSummaryAndPreviousClaim>; hitLimit: boolean }> {
-  if (!starredPlanHandleIds || starredPlanHandleIds.length === 0) {
-    return { data: [], hitLimit: false };
-  }
-
-  if (!afterId) {
-    // This doesn't make sense: there should always be some previous one they've seen.
-    // We'll just return blank.
-    return { data: [], hitLimit: false };
-  }
-
-  // Use POST method for larger lists of project IDs
-  const url = `${apiServer}/api/v2/report/plansLastUpdatedBetween`;
-  const headers = await getHeaders(activeDid);
-
-  const requestBody = {
-    planIds: starredPlanHandleIds,
-    afterId: afterId,
-  };
-
-  const response = await axios.post(url, requestBody, { headers });
-  return response.data;
-}
-
 /**
  * Construct GiveAction VC for submission to server
  *
@@ -1217,12 +1165,7 @@ export async function createAndSubmitClaim(
       timestamp: new Date().toISOString(),
     });
 
-    return {
-      success: true,
-      claimId: response.data?.claimId,
-      handleId: response.data?.handleId,
-      embeddedRecordError: response.data?.embeddedRecordError,
-    };
+    return { success: true, handleId: response.data?.handleId };
   } catch (error: unknown) {
     // Enhanced error logging with comprehensive context
     const requestId = `claim_error_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
@@ -1657,39 +1600,31 @@ export async function register(
       message?: string;
     }>(url, { jwtEncoded: vcJwt });
 
-    if (resp.data?.success?.embeddedRecordError) {
+    if (resp.data?.success?.handleId) {
+      return { success: true };
+    } else if (resp.data?.success?.embeddedRecordError) {
       let message =
         "There was some problem with the registration and so it may not be complete.";
       if (typeof resp.data.success.embeddedRecordError === "string") {
         message += " " + resp.data.success.embeddedRecordError;
       }
       return { error: message };
-    } else if (resp.data?.success?.handleId) {
-      return { success: true };
     } else {
-      logger.error("Registration non-thrown error:", JSON.stringify(resp.data));
-      return {
-        error:
-          (resp.data?.error as { message?: string })?.message ||
-          (resp.data?.error as string) ||
-          "Got a server error when registering.",
-      };
+      logger.error("Registration error:", JSON.stringify(resp.data));
+      return { error: "Got a server error when registering." };
     }
   } catch (error: unknown) {
     if (error && typeof error === "object") {
       const err = error as AxiosErrorResponse;
       const errorMessage =
-        err.response?.data?.error?.message ||
-        err.response?.data?.error ||
-        err.message;
-      logger.error(
-        "Registration thrown error:",
-        errorMessage || JSON.stringify(err),
-      );
-      return {
-        error:
-          (errorMessage as string) || "Got a server error when registering.",
-      };
+        err.message ||
+        (err.response?.data &&
+        typeof err.response.data === "object" &&
+        "message" in err.response.data
+          ? (err.response.data as { message: string }).message
+          : undefined);
+      logger.error("Registration error:", errorMessage || JSON.stringify(err));
+      return { error: errorMessage || "Got a server error when registering." };
     }
     return { error: "Got a server error when registering." };
   }
@@ -1762,19 +1697,49 @@ export async function fetchEndorserRateLimits(
     timestamp: new Date().toISOString(),
   });
 
-  // not wrapped in a 'try' because the error returned is self-explanatory
-  const response = await axios.get(url, { headers } as AxiosRequestConfig);
+  try {
+    const response = await axios.get(url, { headers } as AxiosRequestConfig);
 
-  // Log successful registration check
-  logger.debug("[User Registration] User registration check successful:", {
-    did: issuerDid,
-    server: apiServer,
-    status: response.status,
-    isRegistered: true,
-    timestamp: new Date().toISOString(),
-  });
+    // Log successful registration check
+    logger.debug("[User Registration] User registration check successful:", {
+      did: issuerDid,
+      server: apiServer,
+      status: response.status,
+      isRegistered: true,
+      timestamp: new Date().toISOString(),
+    });
 
-  return response;
+    return response;
+  } catch (error) {
+    // Enhanced error logging with user registration context
+    const axiosError = error as {
+      response?: {
+        data?: { error?: { code?: string; message?: string } };
+        status?: number;
+      };
+    };
+    const errorCode = axiosError.response?.data?.error?.code;
+    const errorMessage = axiosError.response?.data?.error?.message;
+    const httpStatus = axiosError.response?.status;
+
+    logger.warn("[User Registration] User not registered on server:", {
+      did: issuerDid,
+      server: apiServer,
+      errorCode: errorCode,
+      errorMessage: errorMessage,
+      httpStatus: httpStatus,
+      needsRegistration: true,
+      timestamp: new Date().toISOString(),
+    });
+
+    // Log the original error for debugging
+    logger.error(
+      `[fetchEndorserRateLimits] Error for DID ${issuerDid}:`,
+      errorStringForLog(error),
+    );
+
+    throw error;
+  }
 }
 
 /**
@@ -1823,17 +1788,14 @@ export async function fetchImageRateLimits(
       };
     };
 
-    logger.warn(
-      "[Image Server] Image rate limits check failed, which is expected for users not registered on test server (eg. when only registered on local server).",
-      {
-        did: issuerDid,
-        server: server,
-        errorCode: axiosError.response?.data?.error?.code,
-        errorMessage: axiosError.response?.data?.error?.message,
-        httpStatus: axiosError.response?.status,
-        timestamp: new Date().toISOString(),
-      },
-    );
+    logger.error("[Image Server] Image rate limits check failed:", {
+      did: issuerDid,
+      server: server,
+      errorCode: axiosError.response?.data?.error?.code,
+      errorMessage: axiosError.response?.data?.error?.message,
+      httpStatus: axiosError.response?.status,
+      timestamp: new Date().toISOString(),
+    });
     return null;
   }
 }

src/libs/fontawesome.ts

@@ -29,7 +29,6 @@ import {
   faCircle,
   faCircleCheck,
   faCircleInfo,
-  faCircleMinus,
   faCirclePlus,
   faCircleQuestion,
   faCircleRight,
@@ -38,12 +37,10 @@ import {
   faCoins,
   faComment,
   faCopy,
-  faCrown,
   faDollar,
   faDownload,
   faEllipsis,
   faEllipsisVertical,
-  faEnvelope,
   faEnvelopeOpenText,
   faEraser,
   faEye,
@@ -61,7 +58,6 @@ import {
   faHand,
   faHandHoldingDollar,
   faHandHoldingHeart,
-  faHourglassHalf,
   faHouseChimney,
   faImage,
   faImagePortrait,
@@ -84,13 +80,13 @@ import {
   faQuestion,
   faRightFromBracket,
   faRotate,
+  faScroll,
   faShareNodes,
   faSpinner,
   faSquare,
   faSquareCaretDown,
   faSquareCaretUp,
   faSquarePlus,
-  faStar,
   faThumbtack,
   faTrashCan,
   faTriangleExclamation,
@@ -99,12 +95,6 @@ import {
   faXmark,
 } from "@fortawesome/free-solid-svg-icons";
 
-// these are referenced differently, eg. ":icon='['far', 'star']'" as in ProjectViewView.vue
-import { faStar as faStarRegular } from "@fortawesome/free-regular-svg-icons";
-
-// Brand icons
-import { faWhatsapp } from "@fortawesome/free-brands-svg-icons";
-
 // Initialize Font Awesome library with all required icons
 library.add(
   faArrowDown,
@@ -130,7 +120,6 @@ library.add(
   faCircle,
   faCircleCheck,
   faCircleInfo,
-  faCircleMinus,
   faCirclePlus,
   faCircleQuestion,
   faCircleRight,
@@ -139,12 +128,10 @@ library.add(
   faCoins,
   faComment,
   faCopy,
-  faCrown,
   faDollar,
   faDownload,
   faEllipsis,
   faEllipsisVertical,
-  faEnvelope,
   faEnvelopeOpenText,
   faEraser,
   faEye,
@@ -162,7 +149,6 @@ library.add(
   faHand,
   faHandHoldingDollar,
   faHandHoldingHeart,
-  faHourglassHalf,
   faHouseChimney,
   faImage,
   faImagePortrait,
@@ -183,22 +169,20 @@ library.add(
   faPlus,
   faQrcode,
   faQuestion,
-  faRightFromBracket,
   faRotate,
+  faScroll,
+  faRightFromBracket,
   faShareNodes,
   faSpinner,
   faSquare,
   faSquareCaretDown,
   faSquareCaretUp,
   faSquarePlus,
-  faStar,
-  faStarRegular,
   faThumbtack,
   faTrashCan,
   faTriangleExclamation,
   faUser,
   faUsers,
-  faWhatsapp,
   faXmark,
 );
 

src/libs/util.ts

@@ -988,6 +988,11 @@ export async function importFromMnemonic(
 ): Promise<void> {
   const mne: string = mnemonic.trim().toLowerCase();
 
+  // Check if this is Test User #0
+  const TEST_USER_0_MNEMONIC =
+    "rigid shrug mobile smart veteran half all pond toilet brave review universe ship congress found yard skate elite apology jar uniform subway slender luggage";
+  const isTestUser0 = mne === TEST_USER_0_MNEMONIC;
+
   // Derive address and keys from mnemonic
   const [address, privateHex, publicHex] = deriveAddress(mne, derivationPath);
 
@@ -1002,6 +1007,90 @@ export async function importFromMnemonic(
 
   // Save the new identity
   await saveNewIdentity(newId, mne, derivationPath);
+
+  // Set up Test User #0 specific settings
+  if (isTestUser0) {
+    // Set up Test User #0 specific settings with enhanced error handling
+    const platformService = await getPlatformService();
+
+    try {
+      // First, ensure the DID-specific settings record exists
+      await platformService.insertNewDidIntoSettings(newId.did);
+
+      // Then update with Test User #0 specific settings
+      await platformService.updateDidSpecificSettings(newId.did, {
+        firstName: "User Zero",
+        isRegistered: true,
+      });
+
+      // Verify the settings were saved correctly
+      const verificationResult = await platformService.dbQuery(
+        "SELECT firstName, isRegistered FROM settings WHERE accountDid = ?",
+        [newId.did],
+      );
+
+      if (verificationResult?.values?.length) {
+        const settings = verificationResult.values[0];
+        const firstName = settings[0];
+        const isRegistered = settings[1];
+
+        logger.debug(
+          "[importFromMnemonic] Test User #0 settings verification",
+          {
+            did: newId.did,
+            firstName,
+            isRegistered,
+            expectedFirstName: "User Zero",
+            expectedIsRegistered: true,
+          },
+        );
+
+        // If settings weren't saved correctly, try individual updates
+        if (firstName !== "User Zero" || isRegistered !== 1) {
+          logger.warn(
+            "[importFromMnemonic] Test User #0 settings not saved correctly, retrying with individual updates",
+          );
+
+          await platformService.dbExec(
+            "UPDATE settings SET firstName = ? WHERE accountDid = ?",
+            ["User Zero", newId.did],
+          );
+
+          await platformService.dbExec(
+            "UPDATE settings SET isRegistered = ? WHERE accountDid = ?",
+            [1, newId.did],
+          );
+
+          // Verify again
+          const retryResult = await platformService.dbQuery(
+            "SELECT firstName, isRegistered FROM settings WHERE accountDid = ?",
+            [newId.did],
+          );
+
+          if (retryResult?.values?.length) {
+            const retrySettings = retryResult.values[0];
+            logger.debug(
+              "[importFromMnemonic] Test User #0 settings after retry",
+              {
+                firstName: retrySettings[0],
+                isRegistered: retrySettings[1],
+              },
+            );
+          }
+        }
+      } else {
+        logger.error(
+          "[importFromMnemonic] Failed to verify Test User #0 settings - no record found",
+        );
+      }
+    } catch (error) {
+      logger.error(
+        "[importFromMnemonic] Error setting up Test User #0 settings:",
+        error,
+      );
+      // Don't throw - allow the import to continue even if settings fail
+    }
+  }
 }
 
 /**
@@ -1058,29 +1147,3 @@ export async function checkForDuplicateAccount(
 
   return (existingAccount?.values?.length ?? 0) > 0;
 }
-
-export class PromiseTracker<T> {
-  private _promise: Promise<T>;
-  private _resolved = false;
-  private _value: T | undefined;
-
-  constructor(promise: Promise<T>) {
-    this._promise = promise.then((value) => {
-      this._resolved = true;
-      this._value = value;
-      return value;
-    });
-  }
-
-  get isResolved(): boolean {
-    return this._resolved;
-  }
-
-  get value(): T | undefined {
-    return this._value;
-  }
-
-  get promise(): Promise<T> {
-    return this._promise;
-  }
-}

src/main.capacitor.ts

@@ -30,15 +30,11 @@
 
 import { initializeApp } from "./main.common";
 import { App as CapacitorApp } from "@capacitor/app";
-import { Capacitor } from "@capacitor/core";
-import { Filesystem, Directory, Encoding } from "@capacitor/filesystem";
 import router from "./router";
 import { handleApiError } from "./services/api";
 import { AxiosError } from "axios";
 import { DeepLinkHandler } from "./services/deepLinks";
 import { logger, safeStringify } from "./utils/logger";
-import { PlatformServiceFactory } from "./services/PlatformServiceFactory";
-import { SHARED_PHOTO_BASE64_KEY } from "./libs/util";
 import "./utils/safeAreaInset";
 
 logger.log("[Capacitor] 🚀 Starting initialization");
@@ -71,220 +67,11 @@ const deepLinkHandler = new DeepLinkHandler(router);
  *
  * @throws {Error} If URL format is invalid
  */
-/**
- * Check for native shared image from iOS App Group UserDefaults
- * and store in temp database before routing to shared-photo view
- */
-async function checkAndStoreNativeSharedImage(): Promise<{
-  success: boolean;
-  fileName?: string;
-}> {
-  if (!Capacitor.isNativePlatform() || Capacitor.getPlatform() !== "ios") {
-    return { success: false };
-  }
-
-  try {
-    logger.debug("[Main] Checking for iOS shared image from App Group");
-
-    // Use Capacitor's native bridge to call the ShareImagePlugin
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const capacitor = (window as any).Capacitor;
-
-    if (!capacitor || !capacitor.Plugins) {
-      logger.debug("[Main] Capacitor plugins not available");
-      return { success: false };
-    }
-
-    // WORKAROUND: Since the plugin isn't being auto-discovered, use a temp file bridge
-    // AppDelegate writes the shared image data to a temp file, and we read it here
-    try {
-      const tempFilePath = "timesafari_shared_photo.json";
-      const fileContent = await Filesystem.readFile({
-        path: tempFilePath,
-        directory: Directory.Documents,
-        encoding: Encoding.UTF8,
-      });
-
-      if (fileContent.data) {
-        const sharedData = JSON.parse(fileContent.data as string);
-        const base64 = sharedData.base64;
-        const fileName = sharedData.fileName || "shared-image.jpg";
-
-        if (base64) {
-          // Store in temp database using dbExec directly
-          logger.info(
-            "[Main] Native shared image found (via temp file), storing in temp DB",
-          );
-          const platformService = PlatformServiceFactory.getInstance();
-
-          // Convert raw base64 to data URL format that base64ToBlob expects
-          // base64ToBlob expects format: "data:image/jpeg;base64,/9j/4AAQ..."
-          // Try to detect image type from base64 or default to jpeg
-          let mimeType = "image/jpeg"; // default
-          if (base64.startsWith("/9j/") || base64.startsWith("iVBORw0KGgo")) {
-            // JPEG or PNG
-            mimeType = base64.startsWith("/9j/") ? "image/jpeg" : "image/png";
-          }
-          const dataUrl = `data:${mimeType};base64,${base64}`;
-
-          // Use INSERT OR REPLACE to handle existing records
-          await platformService.dbExec(
-            "INSERT OR REPLACE INTO temp (id, blobB64) VALUES (?, ?)",
-            [SHARED_PHOTO_BASE64_KEY, dataUrl],
-          );
-
-          // Delete the temp file
-          try {
-            await Filesystem.deleteFile({
-              path: tempFilePath,
-              directory: Directory.Documents,
-            });
-          } catch (deleteError) {
-            logger.error("[Main] Failed to delete temp file:", deleteError);
-          }
-
-          logger.info(`[Main] Stored shared image: ${fileName}`);
-          return { success: true, fileName };
-        }
-      }
-    } catch (fileError: unknown) {
-      // File doesn't exist or can't be read - that's okay, try plugin method
-      logger.debug(
-        "[Main] Temp file not found or unreadable (this is normal if plugin works)",
-      );
-    }
-
-    // NOTE: Plugin registration issue - ShareImage plugin is not being auto-discovered
-    // This is a known issue that needs to be resolved. For now, we use the temp file workaround above.
-
-    // Try multiple methods to call the plugin (fallback if temp file method fails)
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const plugins = (capacitor as any).Plugins;
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const shareImagePlugin = (plugins as any)?.ShareImage;
-
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    let result: any = null;
-
-    if (
-      shareImagePlugin &&
-      typeof shareImagePlugin.getSharedImageData === "function"
-    ) {
-      logger.debug("[Main] Using direct plugin method");
-      try {
-        result = await shareImagePlugin.getSharedImageData();
-      } catch (pluginError) {
-        logger.error("[Main] Plugin call failed:", pluginError);
-        return { success: false };
-      }
-    } else {
-      // Method 2: Use Capacitor's execute method
-      logger.debug(
-        "[Main] Plugin not found directly, trying Capacitor.execute",
-      );
-      try {
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        const bridge = (capacitor as any).getBridge?.();
-        if (bridge) {
-          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-          result = await bridge.execute({
-            pluginId: "ShareImage",
-            methodName: "getSharedImageData",
-            options: {},
-          });
-        } else {
-          // Method 3: Try execute on Plugins object
-          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-          if ((plugins as any)?.execute) {
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            result = await (plugins as any).execute(
-              "ShareImage",
-              "getSharedImageData",
-              {},
-            );
-          }
-        }
-      } catch (executeError) {
-        logger.error("[Main] Execute method failed:", executeError);
-        return { success: false };
-      }
-    }
-
-    if (!result || !result.success || !result.data) {
-      logger.debug("[Main] No shared image data found in result");
-      return { success: false };
-    }
-
-    const { base64, fileName } = result.data;
-
-    if (!base64) {
-      logger.debug("[Main] Shared image data missing base64");
-      return { success: false };
-    }
-
-    logger.info("[Main] Native shared image found, storing in temp DB");
-
-    // Store in temp database (similar to web flow)
-    const platformService = PlatformServiceFactory.getInstance();
-    // $insertEntity is available via PlatformServiceMixin
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    await (platformService as any).$insertEntity(
-      "temp",
-      { id: SHARED_PHOTO_BASE64_KEY, blobB64: base64 },
-      ["id", "blobB64"],
-    );
-
-    logger.info(`[Main] Stored shared image: ${fileName || "unknown"}`);
-    return { success: true, fileName: fileName || "shared-image.jpg" };
-  } catch (error) {
-    logger.error("[Main] Error checking for native shared image:", error);
-    return { success: false };
-  }
-}
-
 const handleDeepLink = async (data: { url: string }) => {
   const { url } = data;
   logger.debug(`[Main] 🌐 Deeplink received from Capacitor: ${url}`);
 
   try {
-    // Check if this is a shared-photo deep link from native share
-    const isSharedPhotoLink = url.includes("timesafari://shared-photo");
-
-    if (
-      isSharedPhotoLink &&
-      Capacitor.isNativePlatform() &&
-      Capacitor.getPlatform() === "ios"
-    ) {
-      logger.debug(
-        "[Main] 📸 Shared photo deep link detected, checking for native shared image",
-      );
-
-      // Try to get shared image from App Group and store in temp database
-      try {
-        const imageResult = await checkAndStoreNativeSharedImage();
-
-        if (imageResult.success) {
-          logger.info("[Main] ✅ Native shared image stored in temp database");
-
-          // Add fileName to the URL as a query parameter if we have it
-          if (imageResult.fileName) {
-            const urlObj = new URL(url);
-            urlObj.searchParams.set("fileName", imageResult.fileName);
-            const modifiedUrl = urlObj.toString();
-            data.url = modifiedUrl;
-            logger.debug(`[Main] Added fileName to URL: ${modifiedUrl}`);
-          }
-        } else {
-          logger.debug(
-            "[Main] ℹ️ No native shared image found (may be from web or already processed)",
-          );
-        }
-      } catch (error) {
-        logger.error("[Main] Error processing native shared image:", error);
-        // Continue with normal deep link processing even if native check fails
-      }
-    }
-
     // Wait for router to be ready
     logger.debug(`[Main] ⏳ Waiting for router to be ready...`);
     await router.isReady();

src/router/index.ts

@@ -285,16 +285,6 @@ const routes: Array<RouteRecordRaw> = [
     name: "user-profile",
     component: () => import("../views/UserProfileView.vue"),
   },
-  // Catch-all route for 404 errors - must be last
-  {
-    path: "/:pathMatch(.*)*",
-    name: "not-found",
-    component: () => import("../views/NotFoundView.vue"),
-    meta: {
-      title: "Page Not Found",
-      requiresAuth: false,
-    },
-  },
 ];
 
 const isElectron = window.location.protocol === "file:";

src/services/api.ts

@@ -19,6 +19,7 @@ import { logger, safeStringify } from "../utils/logger";
  * @remarks
  * Special handling includes:
  * - Enhanced logging for Capacitor platform
+ * - Rate limit detection and handling
  * - Detailed error information logging including:
  *   - Error message
  *   - HTTP status
@@ -49,5 +50,11 @@ export const handleApiError = (error: AxiosError, endpoint: string) => {
     });
   }
 
+  // Specific handling for rate limits
+  if (error.response?.status === 400) {
+    logger.warn(`[Rate Limit] ${endpoint}`);
+    return null;
+  }
+
   throw error;
 };

src/services/migrationService.ts

@@ -799,7 +799,7 @@ export async function runMigrations<T>(
     }
 
     // Only show completion message in development
-    logger.log(
+    logger.debug(
       `🎉 [Migration] Migration process complete! Summary: ${appliedCount} applied, ${skippedCount} skipped`,
     );
   } catch (error) {

src/services/platforms/BaseDatabaseService.ts

@@ -1,297 +0,0 @@
-/**
- * @fileoverview Base Database Service for Platform Services
- * @author Matthew Raymer
- *
- * This abstract base class provides common database operations that are
- * identical across all platform implementations. It eliminates code
- * duplication and ensures consistency in database operations.
- *
- * Key Features:
- * - Common database utility methods
- * - Consistent settings management
- * - Active identity management
- * - Abstract methods for platform-specific database operations
- *
- * Architecture:
- * - Abstract base class with common implementations
- * - Platform services extend this class
- * - Platform-specific database operations remain abstract
- *
- * @since 1.1.1-beta
- */
-
-import { logger } from "../../utils/logger";
-import { QueryExecResult } from "@/interfaces/database";
-
-/**
- * Abstract base class for platform-specific database services.
- *
- * This class provides common database operations that are identical
- * across all platform implementations (Web, Capacitor, Electron).
- * Platform-specific services extend this class and implement the
- * abstract database operation methods.
- *
- * Common Operations:
- * - Settings management (update, retrieve, insert)
- * - Active identity management
- * - Database utility methods
- *
- * @abstract
- * @example
- * ```typescript
- * export class WebPlatformService extends BaseDatabaseService {
- *   async dbQuery(sql: string, params?: unknown[]): Promise<QueryExecResult> {
- *     // Web-specific implementation
- *   }
- * }
- * ```
- */
-export abstract class BaseDatabaseService {
-  /**
-   * Generate an INSERT statement for a model object.
-   *
-   * Creates a parameterized INSERT statement with placeholders for
-   * all properties in the model object. This ensures safe SQL
-   * execution and prevents SQL injection.
-   *
-   * @param model - Object containing the data to insert
-   * @param tableName - Name of the target table
-   * @returns Object containing the SQL statement and parameters
-   *
-   * @example
-   * ```typescript
-   * const { sql, params } = this.generateInsertStatement(
-   *   { name: 'John', age: 30 },
-   *   'users'
-   * );
-   * // sql: "INSERT INTO users (name, age) VALUES (?, ?)"
-   * // params: ['John', 30]
-   * ```
-   */
-  generateInsertStatement(
-    model: Record<string, unknown>,
-    tableName: string,
-  ): { sql: string; params: unknown[] } {
-    const keys = Object.keys(model);
-    const placeholders = keys.map(() => "?").join(", ");
-    const sql = `INSERT INTO ${tableName} (${keys.join(", ")}) VALUES (${placeholders})`;
-    const params = keys.map((key) => model[key]);
-    return { sql, params };
-  }
-
-  /**
-   * Update default settings for the currently active account.
-   *
-   * Retrieves the active DID from the active_identity table and updates
-   * the corresponding settings record. This ensures settings are always
-   * updated for the correct account.
-   *
-   * @param settings - Object containing the settings to update
-   * @returns Promise that resolves when settings are updated
-   *
-   * @throws {Error} If no active DID is found or database operation fails
-   *
-   * @example
-   * ```typescript
-   * await this.updateDefaultSettings({
-   *   theme: 'dark',
-   *   notifications: true
-   * });
-   * ```
-   */
-  async updateDefaultSettings(
-    settings: Record<string, unknown>,
-  ): Promise<void> {
-    // Get current active DID and update that identity's settings
-    const activeIdentity = await this.getActiveIdentity();
-    const activeDid = activeIdentity.activeDid;
-
-    if (!activeDid) {
-      logger.warn(
-        "[BaseDatabaseService] No active DID found, cannot update default settings",
-      );
-      return;
-    }
-
-    const keys = Object.keys(settings);
-    const setClause = keys.map((key) => `${key} = ?`).join(", ");
-    const sql = `UPDATE settings SET ${setClause} WHERE accountDid = ?`;
-    const params = [...keys.map((key) => settings[key]), activeDid];
-    await this.dbExec(sql, params);
-  }
-
-  /**
-   * Update the active DID in the active_identity table.
-   *
-   * Sets the active DID and updates the lastUpdated timestamp.
-   * This is used when switching between different accounts/identities.
-   *
-   * @param did - The DID to set as active
-   * @returns Promise that resolves when the update is complete
-   *
-   * @example
-   * ```typescript
-   * await this.updateActiveDid('did:example:123');
-   * ```
-   */
-  async updateActiveDid(did: string): Promise<void> {
-    await this.dbExec(
-      "UPDATE active_identity SET activeDid = ?, lastUpdated = datetime('now') WHERE id = 1",
-      [did],
-    );
-  }
-
-  /**
-   * Get the currently active DID from the active_identity table.
-   *
-   * Retrieves the active DID that represents the currently selected
-   * account/identity. This is used throughout the application to
-   * ensure operations are performed on the correct account.
-   *
-   * @returns Promise resolving to object containing the active DID
-   *
-   * @example
-   * ```typescript
-   * const { activeDid } = await this.getActiveIdentity();
-   * console.log('Current active DID:', activeDid);
-   * ```
-   */
-  async getActiveIdentity(): Promise<{ activeDid: string }> {
-    const result = (await this.dbQuery(
-      "SELECT activeDid FROM active_identity WHERE id = 1",
-    )) as QueryExecResult;
-    return {
-      activeDid: (result?.values?.[0]?.[0] as string) || "",
-    };
-  }
-
-  /**
-   * Insert a new DID into the settings table with default values.
-   *
-   * Creates a new settings record for a DID with default configuration
-   * values. Uses INSERT OR REPLACE to handle cases where settings
-   * already exist for the DID.
-   *
-   * @param did - The DID to create settings for
-   * @returns Promise that resolves when settings are created
-   *
-   * @example
-   * ```typescript
-   * await this.insertNewDidIntoSettings('did:example:123');
-   * ```
-   */
-  async insertNewDidIntoSettings(did: string): Promise<void> {
-    // Import constants dynamically to avoid circular dependencies
-    const { DEFAULT_ENDORSER_API_SERVER, DEFAULT_PARTNER_API_SERVER } =
-      await import("@/constants/app");
-
-    // Use INSERT OR REPLACE to handle case where settings already exist for this DID
-    // This prevents duplicate accountDid entries and ensures data integrity
-    await this.dbExec(
-      "INSERT OR REPLACE INTO settings (accountDid, finishedOnboarding, apiServer, partnerApiServer) VALUES (?, ?, ?, ?)",
-      [did, false, DEFAULT_ENDORSER_API_SERVER, DEFAULT_PARTNER_API_SERVER],
-    );
-  }
-
-  /**
-   * Update settings for a specific DID.
-   *
-   * Updates settings for a particular DID rather than the active one.
-   * This is useful for bulk operations or when managing multiple accounts.
-   *
-   * @param did - The DID to update settings for
-   * @param settings - Object containing the settings to update
-   * @returns Promise that resolves when settings are updated
-   *
-   * @example
-   * ```typescript
-   * await this.updateDidSpecificSettings('did:example:123', {
-   *   theme: 'light',
-   *   notifications: false
-   * });
-   * ```
-   */
-  async updateDidSpecificSettings(
-    did: string,
-    settings: Record<string, unknown>,
-  ): Promise<void> {
-    const keys = Object.keys(settings);
-    const setClause = keys.map((key) => `${key} = ?`).join(", ");
-    const sql = `UPDATE settings SET ${setClause} WHERE accountDid = ?`;
-    const params = [...keys.map((key) => settings[key]), did];
-    await this.dbExec(sql, params);
-  }
-
-  /**
-   * Retrieve settings for the currently active account.
-   *
-   * Gets the active DID and retrieves all settings for that account.
-   * Excludes the 'id' column from the returned settings object.
-   *
-   * @returns Promise resolving to settings object or null if no active DID
-   *
-   * @example
-   * ```typescript
-   * const settings = await this.retrieveSettingsForActiveAccount();
-   * if (settings) {
-   *   console.log('Theme:', settings.theme);
-   *   console.log('Notifications:', settings.notifications);
-   * }
-   * ```
-   */
-  async retrieveSettingsForActiveAccount(): Promise<Record<
-    string,
-    unknown
-  > | null> {
-    // Get current active DID from active_identity table
-    const activeIdentity = await this.getActiveIdentity();
-    const activeDid = activeIdentity.activeDid;
-
-    if (!activeDid) {
-      return null;
-    }
-
-    const result = (await this.dbQuery(
-      "SELECT * FROM settings WHERE accountDid = ?",
-      [activeDid],
-    )) as QueryExecResult;
-    if (result?.values?.[0]) {
-      // Convert the row to an object
-      const row = result.values[0];
-      const columns = result.columns || [];
-      const settings: Record<string, unknown> = {};
-
-      columns.forEach((column: string, index: number) => {
-        if (column !== "id") {
-          // Exclude the id column
-          settings[column] = row[index];
-        }
-      });
-
-      return settings;
-    }
-    return null;
-  }
-
-  // Abstract methods that must be implemented by platform-specific services
-
-  /**
-   * Execute a database query (SELECT operations).
-   *
-   * @abstract
-   * @param sql - SQL query string
-   * @param params - Optional parameters for prepared statements
-   * @returns Promise resolving to query results
-   */
-  abstract dbQuery(sql: string, params?: unknown[]): Promise<unknown>;
-
-  /**
-   * Execute a database statement (INSERT, UPDATE, DELETE operations).
-   *
-   * @abstract
-   * @param sql - SQL statement string
-   * @param params - Optional parameters for prepared statements
-   * @returns Promise resolving to execution results
-   */
-  abstract dbExec(sql: string, params?: unknown[]): Promise<unknown>;
-}

src/services/platforms/CapacitorPlatformService.ts

@@ -22,7 +22,6 @@ import {
   PlatformCapabilities,
 } from "../PlatformService";
 import { logger } from "../../utils/logger";
-import { BaseDatabaseService } from "./BaseDatabaseService";
 
 interface QueuedOperation {
   type: "run" | "query" | "rawQuery";
@@ -40,10 +39,7 @@ interface QueuedOperation {
  * - Platform-specific features
  * - SQLite database operations
  */
-export class CapacitorPlatformService
-  extends BaseDatabaseService
-  implements PlatformService
-{
+export class CapacitorPlatformService implements PlatformService {
   /** Current camera direction */
   private currentDirection: CameraDirection = CameraDirection.Rear;
 
@@ -56,7 +52,6 @@ export class CapacitorPlatformService
   private isProcessingQueue: boolean = false;
 
   constructor() {
-    super();
     this.sqlite = new SQLiteConnection(CapacitorSQLite);
   }
 
@@ -91,92 +86,16 @@ export class CapacitorPlatformService
     }
 
     try {
-      // Try to create/Open database connection
-      try {
-        this.db = await this.sqlite.createConnection(
-          this.dbName,
-          false,
-          "no-encryption",
-          1,
-          false,
-        );
-      } catch (createError: unknown) {
-        // If connection already exists, try to retrieve it or handle gracefully
-        const errorMessage =
-          createError instanceof Error
-            ? createError.message
-            : String(createError);
-        const errorObj =
-          typeof createError === "object" && createError !== null
-            ? (createError as { errorMessage?: string; message?: string })
-            : {};
+      // Create/Open database
+      this.db = await this.sqlite.createConnection(
+        this.dbName,
+        false,
+        "no-encryption",
+        1,
+        false,
+      );
 
-        const fullErrorMessage =
-          errorObj.errorMessage || errorObj.message || errorMessage;
-
-        if (fullErrorMessage.includes("already exists")) {
-          logger.debug(
-            "[CapacitorPlatformService] Connection already exists on native side, attempting to retrieve",
-          );
-          // Check if connection exists in JavaScript Map
-          const isConnResult = await this.sqlite.isConnection(
-            this.dbName,
-            false,
-          );
-          if (isConnResult.result) {
-            // Connection exists in Map, retrieve it
-            this.db = await this.sqlite.retrieveConnection(this.dbName, false);
-            logger.debug(
-              "[CapacitorPlatformService] Successfully retrieved existing connection from Map",
-            );
-          } else {
-            // Connection exists on native side but not in JavaScript Map
-            // This can happen when the app is restarted but native connections persist
-            // Try to close the native connection first, then create a new one
-            logger.debug(
-              "[CapacitorPlatformService] Connection exists natively but not in Map, closing and recreating",
-            );
-            try {
-              await this.sqlite.closeConnection(this.dbName, false);
-            } catch (closeError) {
-              // Ignore close errors - connection might not be properly tracked
-              logger.debug(
-                "[CapacitorPlatformService] Error closing connection (may be expected):",
-                closeError,
-              );
-            }
-            // Now try to create the connection again
-            this.db = await this.sqlite.createConnection(
-              this.dbName,
-              false,
-              "no-encryption",
-              1,
-              false,
-            );
-            logger.debug(
-              "[CapacitorPlatformService] Successfully created connection after cleanup",
-            );
-          }
-        } else {
-          // Re-throw if it's a different error
-          throw createError;
-        }
-      }
-
-      // Open the connection if it's not already open
-      try {
-        await this.db.open();
-      } catch (openError: unknown) {
-        const openErrorMessage =
-          openError instanceof Error ? openError.message : String(openError);
-        // If already open, that's fine - continue
-        if (!openErrorMessage.includes("already open")) {
-          throw openError;
-        }
-        logger.debug(
-          "[CapacitorPlatformService] Database connection already open",
-        );
-      }
+      await this.db.open();
 
       // Set journal mode to WAL for better performance
       // await this.db.execute("PRAGMA journal_mode=WAL;");
@@ -1409,8 +1328,79 @@ export class CapacitorPlatformService
   // --- PWA/Web-only methods (no-op for Capacitor) ---
   public registerServiceWorker(): void {}
 
-  // Database utility methods - inherited from BaseDatabaseService
-  // generateInsertStatement, updateDefaultSettings, updateActiveDid,
-  // getActiveIdentity, insertNewDidIntoSettings, updateDidSpecificSettings,
-  // retrieveSettingsForActiveAccount are all inherited from BaseDatabaseService
+  // Database utility methods
+  generateInsertStatement(
+    model: Record<string, unknown>,
+    tableName: string,
+  ): { sql: string; params: unknown[] } {
+    const keys = Object.keys(model);
+    const placeholders = keys.map(() => "?").join(", ");
+    const sql = `INSERT INTO ${tableName} (${keys.join(", ")}) VALUES (${placeholders})`;
+    const params = keys.map((key) => model[key]);
+    return { sql, params };
+  }
+
+  async updateDefaultSettings(
+    settings: Record<string, unknown>,
+  ): Promise<void> {
+    const keys = Object.keys(settings);
+    const setClause = keys.map((key) => `${key} = ?`).join(", ");
+    const sql = `UPDATE settings SET ${setClause} WHERE id = 1`;
+    const params = keys.map((key) => settings[key]);
+    await this.dbExec(sql, params);
+  }
+
+  async updateActiveDid(did: string): Promise<void> {
+    await this.dbExec(
+      "UPDATE active_identity SET activeDid = ?, lastUpdated = datetime('now') WHERE id = 1",
+      [did],
+    );
+  }
+
+  async insertNewDidIntoSettings(did: string): Promise<void> {
+    // Import constants dynamically to avoid circular dependencies
+    const { DEFAULT_ENDORSER_API_SERVER, DEFAULT_PARTNER_API_SERVER } =
+      await import("@/constants/app");
+
+    // Use INSERT OR REPLACE to handle case where settings already exist for this DID
+    // This prevents duplicate accountDid entries and ensures data integrity
+    await this.dbExec(
+      "INSERT OR REPLACE INTO settings (accountDid, finishedOnboarding, apiServer, partnerApiServer) VALUES (?, ?, ?, ?)",
+      [did, false, DEFAULT_ENDORSER_API_SERVER, DEFAULT_PARTNER_API_SERVER],
+    );
+  }
+
+  async updateDidSpecificSettings(
+    did: string,
+    settings: Record<string, unknown>,
+  ): Promise<void> {
+    const keys = Object.keys(settings);
+    const setClause = keys.map((key) => `${key} = ?`).join(", ");
+    const sql = `UPDATE settings SET ${setClause} WHERE accountDid = ?`;
+    const params = [...keys.map((key) => settings[key]), did];
+    await this.dbExec(sql, params);
+  }
+
+  async retrieveSettingsForActiveAccount(): Promise<Record<
+    string,
+    unknown
+  > | null> {
+    const result = await this.dbQuery("SELECT * FROM settings WHERE id = 1");
+    if (result?.values?.[0]) {
+      // Convert the row to an object
+      const row = result.values[0];
+      const columns = result.columns || [];
+      const settings: Record<string, unknown> = {};
+
+      columns.forEach((column, index) => {
+        if (column !== "id") {
+          // Exclude the id column
+          settings[column] = row[index];
+        }
+      });
+
+      return settings;
+    }
+    return null;
+  }
 }

src/services/platforms/WebPlatformService.ts

@@ -5,7 +5,6 @@ import {
 } from "../PlatformService";
 import { logger } from "../../utils/logger";
 import { QueryExecResult } from "@/interfaces/database";
-import { BaseDatabaseService } from "./BaseDatabaseService";
 // Dynamic import of initBackend to prevent worker context errors
 import type {
   WorkerRequest,
@@ -30,10 +29,7 @@ import type {
  * Note: File system operations are not available in the web platform
  * due to browser security restrictions. These methods throw appropriate errors.
  */
-export class WebPlatformService
-  extends BaseDatabaseService
-  implements PlatformService
-{
+export class WebPlatformService implements PlatformService {
   private static instanceCount = 0; // Debug counter
   private worker: Worker | null = null;
   private workerReady = false;
@@ -50,16 +46,17 @@ export class WebPlatformService
   private readonly messageTimeout = 30000; // 30 seconds
 
   constructor() {
-    super();
     WebPlatformService.instanceCount++;
 
-    logger.debug("[WebPlatformService] Initializing web platform service");
+    // Use debug level logging for development mode to reduce console noise
+    const isDevelopment = process.env.VITE_PLATFORM === "development";
+    const log = isDevelopment ? logger.debug : logger.log;
+
+    log("[WebPlatformService] Initializing web platform service");
 
     // Only initialize SharedArrayBuffer setup for web platforms
     if (this.isWorker()) {
-      logger.debug(
-        "[WebPlatformService] Skipping initBackend call in worker context",
-      );
+      log("[WebPlatformService] Skipping initBackend call in worker context");
       return;
     }
 
@@ -673,8 +670,105 @@ export class WebPlatformService
     // SharedArrayBuffer initialization is handled by initBackend call in initializeWorker
   }
 
-  // Database utility methods - inherited from BaseDatabaseService
-  // generateInsertStatement, updateDefaultSettings, updateActiveDid,
-  // getActiveIdentity, insertNewDidIntoSettings, updateDidSpecificSettings,
-  // retrieveSettingsForActiveAccount are all inherited from BaseDatabaseService
+  // Database utility methods
+  generateInsertStatement(
+    model: Record<string, unknown>,
+    tableName: string,
+  ): { sql: string; params: unknown[] } {
+    const keys = Object.keys(model);
+    const placeholders = keys.map(() => "?").join(", ");
+    const sql = `INSERT INTO ${tableName} (${keys.join(", ")}) VALUES (${placeholders})`;
+    const params = keys.map((key) => model[key]);
+    return { sql, params };
+  }
+
+  async updateDefaultSettings(
+    settings: Record<string, unknown>,
+  ): Promise<void> {
+    // Get current active DID and update that identity's settings
+    const activeIdentity = await this.getActiveIdentity();
+    const activeDid = activeIdentity.activeDid;
+
+    if (!activeDid) {
+      logger.warn(
+        "[WebPlatformService] No active DID found, cannot update default settings",
+      );
+      return;
+    }
+
+    const keys = Object.keys(settings);
+    const setClause = keys.map((key) => `${key} = ?`).join(", ");
+    const sql = `UPDATE settings SET ${setClause} WHERE accountDid = ?`;
+    const params = [...keys.map((key) => settings[key]), activeDid];
+    await this.dbExec(sql, params);
+  }
+
+  async updateActiveDid(did: string): Promise<void> {
+    await this.dbExec(
+      "INSERT OR REPLACE INTO active_identity (id, activeDid, lastUpdated) VALUES (1, ?, ?)",
+      [did, new Date().toISOString()],
+    );
+  }
+
+  async getActiveIdentity(): Promise<{ activeDid: string }> {
+    const result = await this.dbQuery(
+      "SELECT activeDid FROM active_identity WHERE id = 1",
+    );
+    return {
+      activeDid: (result?.values?.[0]?.[0] as string) || "",
+    };
+  }
+
+  async insertNewDidIntoSettings(did: string): Promise<void> {
+    // Import constants dynamically to avoid circular dependencies
+    const { DEFAULT_ENDORSER_API_SERVER, DEFAULT_PARTNER_API_SERVER } =
+      await import("@/constants/app");
+
+    // Use INSERT OR REPLACE to handle case where settings already exist for this DID
+    // This prevents duplicate accountDid entries and ensures data integrity
+    await this.dbExec(
+      "INSERT OR REPLACE INTO settings (accountDid, finishedOnboarding, apiServer, partnerApiServer) VALUES (?, ?, ?, ?)",
+      [did, false, DEFAULT_ENDORSER_API_SERVER, DEFAULT_PARTNER_API_SERVER],
+    );
+  }
+
+  async updateDidSpecificSettings(
+    did: string,
+    settings: Record<string, unknown>,
+  ): Promise<void> {
+    const keys = Object.keys(settings);
+    const setClause = keys.map((key) => `${key} = ?`).join(", ");
+    const sql = `UPDATE settings SET ${setClause} WHERE accountDid = ?`;
+    const params = [...keys.map((key) => settings[key]), did];
+    // Log update operation for debugging
+    logger.debug(
+      "[WebPlatformService] updateDidSpecificSettings",
+      sql,
+      JSON.stringify(params, null, 2),
+    );
+    await this.dbExec(sql, params);
+  }
+
+  async retrieveSettingsForActiveAccount(): Promise<Record<
+    string,
+    unknown
+  > | null> {
+    const result = await this.dbQuery("SELECT * FROM settings WHERE id = 1");
+    if (result?.values?.[0]) {
+      // Convert the row to an object
+      const row = result.values[0];
+      const columns = result.columns || [];
+      const settings: Record<string, unknown> = {};
+
+      columns.forEach((column, index) => {
+        if (column !== "id") {
+          // Exclude the id column
+          settings[column] = row[index];
+        }
+      });
+
+      return settings;
+    }
+    return null;
+  }
 }

src/test/EntityGridFunctionPropTest.vue

@@ -19,6 +19,7 @@
       <EntityGrid
         entity-type="people"
         :entities="people"
+        :max-items="5"
         :active-did="activeDid"
         :all-my-dids="allMyDids"
         :all-contacts="people"
@@ -38,6 +39,7 @@
       <EntityGrid
         entity-type="projects"
         :entities="projects"
+        :max-items="3"
         :active-did="activeDid"
         :all-my-dids="allMyDids"
         :all-contacts="people"
@@ -150,8 +152,11 @@ export default class EntityGridFunctionPropTest extends Vue {
   customPeopleFunction = (
     entities: Contact[],
     _entityType: string,
+    maxItems: number,
   ): Contact[] => {
-    return entities.filter((person) => person.profileImageUrl);
+    return entities
+      .filter((person) => person.profileImageUrl)
+      .slice(0, maxItems);
   };
 
   /**
@@ -160,6 +165,7 @@ export default class EntityGridFunctionPropTest extends Vue {
   customProjectsFunction = (
     entities: PlanData[],
     _entityType: string,
+    _maxItems: number,
   ): PlanData[] => {
     return entities.sort((a, b) => a.name.localeCompare(b.name)).slice(0, 3);
   };
@@ -194,16 +200,16 @@ export default class EntityGridFunctionPropTest extends Vue {
    */
   get displayedPeopleCount(): number {
     if (this.useCustomFunction) {
-      return this.customPeopleFunction(this.people, "people").length;
+      return this.customPeopleFunction(this.people, "people", 5).length;
     }
-    return Math.min(10, this.people.length); // Initial batch size for infinite scroll
+    return Math.min(5, this.people.length);
   }
 
   get displayedProjectsCount(): number {
     if (this.useCustomFunction) {
-      return this.customProjectsFunction(this.projects, "projects").length;
+      return this.customProjectsFunction(this.projects, "projects", 3).length;
     }
-    return Math.min(10, this.projects.length); // Initial batch size for infinite scroll
+    return Math.min(7, this.projects.length);
   }
 }
 </script>

src/test/PlatformServiceMixinTest.vue

@@ -85,6 +85,7 @@
 <script lang="ts">
 import { Component, Vue } from "vue-facing-decorator";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 
 @Component({
   mixins: [PlatformServiceMixin],
@@ -196,10 +197,10 @@ This tests the helper method only - no database interaction`;
       const success = await this.$saveSettings(testSettings);
 
       if (success) {
-        // Now query the raw database to see how it's actually stored.
-        // Note that new users probably have settings with ID of 1 but old migrated users might skip to 2.
+        // Now query the raw database to see how it's actually stored
         const rawResult = await this.$dbQuery(
-          "SELECT searchBoxes FROM settings limit 1",
+          "SELECT searchBoxes FROM settings WHERE id = ?",
+          [MASTER_SETTINGS_KEY],
         );
 
         if (rawResult?.values?.length) {

src/utils/PlatformServiceMixin.ts

@@ -301,11 +301,7 @@ export const PlatformServiceMixin = {
           }
 
           // Convert SQLite JSON strings to objects/arrays
-          if (
-            column === "contactMethods" ||
-            column === "searchBoxes" ||
-            column === "starredPlanHandleIds"
-          ) {
+          if (column === "contactMethods" || column === "searchBoxes") {
             value = this._parseJsonField(value, []);
           }
 
@@ -353,14 +349,6 @@ export const PlatformServiceMixin = {
           ? JSON.stringify(settings.searchBoxes)
           : String(settings.searchBoxes);
       }
-      if (settings.starredPlanHandleIds !== undefined) {
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        (converted as any).starredPlanHandleIds = Array.isArray(
-          settings.starredPlanHandleIds,
-        )
-          ? JSON.stringify(settings.starredPlanHandleIds)
-          : String(settings.starredPlanHandleIds);
-      }
 
       return converted;
     },
@@ -526,7 +514,7 @@ export const PlatformServiceMixin = {
      * Utility method for retrieving master settings
      * Common pattern used across many components
      */
-    async _getMasterSettings(
+    async $getMasterSettings(
       fallback: Settings | null = null,
     ): Promise<Settings | null> {
       try {
@@ -563,12 +551,6 @@ export const PlatformServiceMixin = {
         if (settings.searchBoxes) {
           settings.searchBoxes = this._parseJsonField(settings.searchBoxes, []);
         }
-        if (settings.starredPlanHandleIds) {
-          settings.starredPlanHandleIds = this._parseJsonField(
-            settings.starredPlanHandleIds,
-            [],
-          );
-        }
 
         return settings;
       } catch (error) {
@@ -589,7 +571,7 @@ export const PlatformServiceMixin = {
     ): Promise<Settings> {
       try {
         // Get default settings
-        const defaultSettings = await this._getMasterSettings(defaultFallback);
+        const defaultSettings = await this.$getMasterSettings(defaultFallback);
 
         // If no account DID, return defaults
         if (!accountDid) {
@@ -635,12 +617,6 @@ export const PlatformServiceMixin = {
             [],
           );
         }
-        if (mergedSettings.starredPlanHandleIds) {
-          mergedSettings.starredPlanHandleIds = this._parseJsonField(
-            mergedSettings.starredPlanHandleIds,
-            [],
-          );
-        }
 
         return mergedSettings;
       } catch (error) {
@@ -970,20 +946,6 @@ export const PlatformServiceMixin = {
       return this.$normalizeContacts(rawContacts);
     },
 
-    /**
-     * Load all contacts sorted by when they were added (by ID)
-     * Always fetches fresh data from database for consistency
-     * Handles JSON string/object duality for contactMethods field
-     * @returns Promise<Contact[]> Array of normalized contact objects sorted by addition date (newest first)
-     */
-    async $contactsByDateAdded(): Promise<Contact[]> {
-      const rawContacts = (await this.$query(
-        "SELECT * FROM contacts ORDER BY id DESC",
-      )) as ContactMaybeWithJsonStrings[];
-
-      return this.$normalizeContacts(rawContacts);
-    },
-
     /**
      * Ultra-concise shortcut for getting number of contacts
      * @returns Promise<number> Total number of contacts
@@ -1008,7 +970,7 @@ export const PlatformServiceMixin = {
      * @returns Fresh settings object from database
      */
     async $settings(defaults: Settings = {}): Promise<Settings> {
-      const settings = await this._getMasterSettings(defaults);
+      const settings = await this.$getMasterSettings(defaults);
 
       if (!settings) {
         return defaults;
@@ -1041,7 +1003,7 @@ export const PlatformServiceMixin = {
     ): Promise<Settings> {
       try {
         // Get default settings first
-        const defaultSettings = await this._getMasterSettings(defaults);
+        const defaultSettings = await this.$getMasterSettings(defaults);
 
         if (!defaultSettings) {
           return defaults;
@@ -1250,11 +1212,6 @@ export const PlatformServiceMixin = {
      * @param changes Settings changes to save
      * @returns Promise<boolean> Success status
      */
-    /**
-     * Since this is unused, and since it relies on this.activeDid which isn't guaranteed to exist,
-     * let's take this out for the sake of safety.
-     * Totally remove after start of 2026 (since it would be obvious by then that it's not used).
-     *
     async $saveMySettings(changes: Partial<Settings>): Promise<boolean> {
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       const currentDid = (this as any).activeDid;
@@ -1264,7 +1221,6 @@ export const PlatformServiceMixin = {
       }
       return await this.$saveUserSettings(currentDid, changes);
     },
-    **/
 
     // =================================================
     // CACHE MANAGEMENT METHODS
@@ -1367,9 +1323,6 @@ export const PlatformServiceMixin = {
             contact.profileImageUrl !== undefined
               ? contact.profileImageUrl
               : null,
-          notes: contact.notes !== undefined ? contact.notes : null,
-          iViewContent:
-            contact.iViewContent !== undefined ? contact.iViewContent : null,
           contactMethods:
             contact.contactMethods !== undefined
               ? Array.isArray(contact.contactMethods)
@@ -1380,8 +1333,8 @@ export const PlatformServiceMixin = {
 
         await this.$dbExec(
           `INSERT OR REPLACE INTO contacts 
-           (did, name, publicKeyBase64, seesMe, registered, nextPubKeyHashB64, profileImageUrl, notes, iViewContent, contactMethods) 
-           VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`,
+           (did, name, publicKeyBase64, seesMe, registered, nextPubKeyHashB64, profileImageUrl, contactMethods) 
+           VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,
           [
             safeContact.did,
             safeContact.name,
@@ -1390,8 +1343,6 @@ export const PlatformServiceMixin = {
             safeContact.registered,
             safeContact.nextPubKeyHashB64,
             safeContact.profileImageUrl,
-            safeContact.notes,
-            safeContact.iViewContent,
             safeContact.contactMethods,
           ],
         );
@@ -1891,7 +1842,7 @@ export const PlatformServiceMixin = {
     async $debugMergedSettings(did: string): Promise<void> {
       try {
         // Get default settings
-        const defaultSettings = await this._getMasterSettings({});
+        const defaultSettings = await this.$getMasterSettings({});
         logger.debug(
           `[PlatformServiceMixin] Default settings:`,
           defaultSettings,
@@ -1941,6 +1892,7 @@ export interface IPlatformServiceMixin {
     params?: unknown[],
   ): Promise<SqlValue[] | undefined>;
   $dbRawQuery(sql: string, params?: unknown[]): Promise<unknown | undefined>;
+  $getMasterSettings(fallback?: Settings | null): Promise<Settings | null>;
   $getMergedSettings(
     defaultKey: string,
     accountDid?: string,
@@ -2065,6 +2017,7 @@ declare module "@vue/runtime-core" {
       params?: unknown[],
     ): Promise<unknown[] | undefined>;
     $dbRawQuery(sql: string, params?: unknown[]): Promise<unknown | undefined>;
+    $getMasterSettings(defaults?: Settings | null): Promise<Settings | null>;
     $getMergedSettings(
       key: string,
       did?: string,
@@ -2076,7 +2029,6 @@ declare module "@vue/runtime-core" {
 
     // Specialized shortcuts - contacts cached, settings fresh
     $contacts(): Promise<Contact[]>;
-    $contactsByDateAdded(): Promise<Contact[]>;
     $contactCount(): Promise<number>;
     $settings(defaults?: Settings): Promise<Settings>;
     $accountSettings(did?: string, defaults?: Settings): Promise<Settings>;
@@ -2088,8 +2040,7 @@ declare module "@vue/runtime-core" {
       did: string,
       changes: Partial<Settings>,
     ): Promise<boolean>;
-    // @deprecated; see implementation note above
-    // $saveMySettings(changes: Partial<Settings>): Promise<boolean>;
+    $saveMySettings(changes: Partial<Settings>): Promise<boolean>;
 
     // Cache management methods
     $refreshSettings(): Promise<Settings>;

src/utils/logger.ts

@@ -24,28 +24,10 @@ export function getMemoryLogs(): string[] {
   return [..._memoryLogs];
 }
 
-/**
- * Stringify an object with proper handling of circular references and functions
- *
- * Don't use for arrays; map with this over the array.
- *
- * @param obj - The object to stringify
- * @returns The stringified object, plus 'message' and 'stack' for Error objects
- */
 export function safeStringify(obj: unknown) {
   const seen = new WeakSet();
 
-  // since 'message' & 'stack' are not enumerable for errors, let's add those
-  let objToStringify = obj;
-  if (obj instanceof Error) {
-    objToStringify = {
-      ...obj,
-      message: obj.message,
-      stack: obj.stack,
-    };
-  }
-
-  return JSON.stringify(objToStringify, (_key, value) => {
+  return JSON.stringify(obj, (_key, value) => {
     if (typeof value === "object" && value !== null) {
       if (seen.has(value)) {
         return "[Circular]";
@@ -196,8 +178,7 @@ export const logger = {
     }
 
     // Database logging
-    const argsString =
-      args.length > 0 ? " - " + args.map(safeStringify).join(", ") : "";
+    const argsString = args.length > 0 ? " - " + safeStringify(args) : "";
     logToDatabase(message + argsString, "info");
   },
 
@@ -208,8 +189,7 @@ export const logger = {
     }
 
     // Database logging
-    const argsString =
-      args.length > 0 ? " - " + args.map(safeStringify).join(", ") : "";
+    const argsString = args.length > 0 ? " - " + safeStringify(args) : "";
     logToDatabase(message + argsString, "info");
   },
 
@@ -220,8 +200,7 @@ export const logger = {
     }
 
     // Database logging
-    const argsString =
-      args.length > 0 ? " - " + args.map(safeStringify).join(", ") : "";
+    const argsString = args.length > 0 ? " - " + safeStringify(args) : "";
     logToDatabase(message + argsString, "warn");
   },
 
@@ -232,9 +211,9 @@ export const logger = {
     }
 
     // Database logging
-    const argsString =
-      args.length > 0 ? " - " + args.map(safeStringify).join(", ") : "";
-    logToDatabase(message + argsString, "error");
+    const messageString = safeStringify(message);
+    const argsString = args.length > 0 ? safeStringify(args) : "";
+    logToDatabase(messageString + argsString, "error");
   },
 
   // New database-focused methods (self-contained)

src/views/AccountViewView.vue

@@ -1,5 +1,6 @@
 <template>
   <QuickNav selected="Profile" />
+  <TopMessage />
 
   <!-- CONTENT -->
   <main
@@ -8,22 +9,10 @@
     role="main"
     aria-label="Account Profile"
   >
-    <TopMessage />
-
-    <!-- Main View Heading -->
-    <div class="flex gap-4 items-center mb-8">
-      <h1 id="ViewHeading" class="text-2xl font-bold leading-none">
-        Your Identity
-      </h1>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
-    </div>
+    <!-- Heading -->
+    <h1 id="ViewHeading" class="text-4xl text-center font-light">
+      Your Identity
+    </h1>
 
     <!-- ID notice -->
     <div
@@ -161,6 +150,8 @@
     </section>
     <PushNotificationPermission ref="pushNotificationPermission" />
 
+    <LocationSearchSection :search-box="searchBox" />
+
     <!-- User Profile -->
     <section
       v-if="isRegistered"
@@ -253,8 +244,6 @@
       <div v-else>Saving...</div>
     </section>
 
-    <LocationSearchSection :search-box="searchBox" />
-
     <UsageLimitsSection
       v-if="activeDid"
       :loading-limits="loadingLimits"
@@ -375,6 +364,45 @@
         Switch Identifier
       </router-link>
 
+      <div id="sectionImportContactsSettings" class="mt-4">
+        <h2 class="text-slate-500 text-sm font-bold">Import Contacts</h2>
+
+        <div class="ml-4 mt-2">
+          <input type="file" class="ml-2" @change="uploadImportFile" />
+          <transition
+            enter-active-class="transform ease-out duration-300 transition"
+            enter-from-class="translate-y-2 opacity-0 sm:translate-y-4"
+            enter-to-class="translate-y-0 opacity-100 sm:translate-y-0"
+            leave-active-class="transition ease-in duration-500"
+            leave-from-class="opacity-100"
+            leave-to-class="opacity-0"
+          >
+            <div v-if="showContactImport()" class="mt-4">
+              <!-- Bulk import has an error
+              <div class="flex justify-center">
+                <button
+                  class="block text-center text-md 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.5 py-2 rounded-md mb-6"
+                  @click="confirmSubmitImportFile()"
+                >
+                  Overwrite Settings & Contacts
+                  <br />
+                  (which doesn't include Identifier Data)
+                </button>
+              </div>
+              -->
+              <div class="flex justify-center">
+                <button
+                  class="block text-center text-md 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.5 py-2 rounded-md mb-6"
+                  @click="checkContactImports()"
+                >
+                  Import Contacts
+                </button>
+              </div>
+            </div>
+          </transition>
+        </div>
+      </div>
+
       <label
         for="toggleShowAmounts"
         class="flex items-center justify-between cursor-pointer my-4"
@@ -731,7 +759,9 @@ import "dexie-export-import";
 import { ImportProgress } from "dexie-export-import";
 import { LeafletMouseEvent } from "leaflet";
 import * as L from "leaflet";
+import * as R from "ramda";
 import { IIdentifier } from "@veramo/core";
+import { ref } from "vue";
 import { Component, Vue } from "vue-facing-decorator";
 import { RouteLocationNormalizedLoaded, Router } from "vue-router";
 import { copyToClipboard } from "../services/ClipboardService";
@@ -758,6 +788,7 @@ import {
   NotificationIface,
   PASSKEYS_ENABLED,
 } from "../constants/app";
+import { Contact } from "../db/tables/contacts";
 import {
   DEFAULT_PASSKEY_EXPIRATION_MINUTES,
   BoundingBox,
@@ -781,7 +812,11 @@ import { PlatformServiceMixin } from "../utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
 import { ACCOUNT_VIEW_CONSTANTS } from "@/constants/accountView";
 import { showSeedPhraseReminder } from "@/utils/seedPhraseReminder";
-import { AccountSettings, isApiError } from "@/interfaces/accountView";
+import {
+  AccountSettings,
+  isApiError,
+  ImportContent,
+} from "@/interfaces/accountView";
 // Profile data interface (inlined from ProfileService)
 interface ProfileData {
   description: string;
@@ -790,6 +825,8 @@ interface ProfileData {
   includeLocation: boolean;
 }
 
+const inputImportFileNameRef = ref<Blob>();
+
 interface UserNameDialogRef {
   open: (cb: (name?: string) => void) => void;
 }
@@ -1027,8 +1064,8 @@ export default class AccountViewView extends Vue {
     this.hideRegisterPromptOnNewContact =
       !!settings.hideRegisterPromptOnNewContact;
     this.isRegistered = !!settings?.isRegistered;
-    this.isSearchAreasSet =
-      !!settings.searchBoxes && settings.searchBoxes.length > 0;
+    this.isSearchAreasSet = !!settings.searchBoxes;
+    this.searchBox = settings.searchBoxes?.[0] || null;
     this.notifyingNewActivity = !!settings.notifyingNewActivityTime;
     this.notifyingNewActivityTime = settings.notifyingNewActivityTime || "";
     this.notifyingReminder = !!settings.notifyingReminderTime;
@@ -1042,7 +1079,6 @@ export default class AccountViewView extends Vue {
     this.passkeyExpirationMinutes =
       settings.passkeyExpirationMinutes ?? DEFAULT_PASSKEY_EXPIRATION_MINUTES;
     this.previousPasskeyExpirationMinutes = this.passkeyExpirationMinutes;
-    this.searchBox = settings.searchBoxes?.[0] || null;
     this.showGeneralAdvanced = !!settings.showGeneralAdvanced;
     this.showShortcutBvc = !!settings.showShortcutBvc;
     this.warnIfProdServer = !!settings.warnIfProdServer;
@@ -1321,6 +1357,65 @@ export default class AccountViewView extends Vue {
     );
   }
 
+  async uploadImportFile(event: Event): Promise<void> {
+    inputImportFileNameRef.value = (
+      event.target as HTMLInputElement
+    ).files?.[0];
+  }
+
+  showContactImport(): boolean {
+    return !!inputImportFileNameRef.value;
+  }
+
+  confirmSubmitImportFile(): void {
+    if (inputImportFileNameRef.value != null) {
+      this.notify.confirm(
+        ACCOUNT_VIEW_CONSTANTS.WARNINGS.IMPORT_REPLACE_WARNING,
+        this.submitImportFile,
+      );
+    }
+  }
+
+  /**
+   * Asynchronously imports the database from a downloadable JSON file.
+   *
+   * @throws Will notify the user if there is an export error.
+   */
+  async submitImportFile(): Promise<void> {
+    if (inputImportFileNameRef.value != null) {
+      // TODO: implement this for SQLite
+    }
+  }
+
+  async checkContactImports(): Promise<void> {
+    const reader = new FileReader();
+    reader.onload = (event) => {
+      const fileContent: string = (event.target?.result as string) || "{}";
+      try {
+        const contents: ImportContent = JSON.parse(fileContent);
+        const contactTableRows: Array<Contact> = (
+          contents.data?.data as [{ tableName: string; rows: Array<Contact> }]
+        )?.find((table) => table.tableName === "contacts")
+          ?.rows as Array<Contact>;
+        const contactRows = contactTableRows.map(
+          // @ts-expect-error for omitting this field that is found in the Dexie format
+          (contact) => R.omit(["$types"], contact) as Contact,
+        );
+        (this.$router as Router).push({
+          name: "contact-import",
+          query: { contacts: JSON.stringify(contactRows) },
+        });
+      } catch (error) {
+        logger.error("Error checking contact imports:", error);
+        this.notify.error(
+          ACCOUNT_VIEW_CONSTANTS.ERRORS.IMPORT_ERROR,
+          TIMEOUTS.STANDARD,
+        );
+      }
+    };
+    reader.readAsText(inputImportFileNameRef.value as Blob);
+  }
+
   private progressCallback(progress: ImportProgress): boolean {
     logger.log(
       `Import progress: ${progress.completedRows} of ${progress.totalRows} rows completed.`,
@@ -1359,6 +1454,7 @@ export default class AccountViewView extends Vue {
         this.imageLimits = imageResp.data;
       } else {
         this.limitsMessage = ACCOUNT_VIEW_CONSTANTS.LIMITS.NO_IMAGE_ACCESS;
+        this.notify.warning(ACCOUNT_VIEW_CONSTANTS.LIMITS.CANNOT_UPLOAD_IMAGES);
       }
 
       const endorserResp = await fetchEndorserRateLimits(
@@ -1369,6 +1465,9 @@ export default class AccountViewView extends Vue {
 
       if (endorserResp.status === 200) {
         this.endorserLimits = endorserResp.data;
+      } else {
+        this.limitsMessage = ACCOUNT_VIEW_CONSTANTS.LIMITS.NO_LIMITS_FOUND;
+        this.notify.warning(ACCOUNT_VIEW_CONSTANTS.LIMITS.BAD_SERVER_RESPONSE);
       }
     } catch (error) {
       this.limitsMessage =
@@ -1381,21 +1480,18 @@ export default class AccountViewView extends Vue {
           status?: number;
         };
       };
-      logger.warn(
-        "[Server Limits] Error retrieving limits, expected for unregistered users:",
-        {
-          error: error instanceof Error ? error.message : String(error),
-          did: did,
-          apiServer: this.apiServer,
-          imageServer: this.DEFAULT_IMAGE_API_SERVER,
-          partnerApiServer: this.partnerApiServer,
-          errorCode: axiosError?.response?.data?.error?.code,
-          errorMessage: axiosError?.response?.data?.error?.message,
-          httpStatus: axiosError?.response?.status,
-          needsUserMigration: true,
-          timestamp: new Date().toISOString(),
-        },
-      );
+      logger.error("[Server Limits] Error retrieving limits:", {
+        error: error instanceof Error ? error.message : String(error),
+        did: did,
+        apiServer: this.apiServer,
+        imageServer: this.DEFAULT_IMAGE_API_SERVER,
+        partnerApiServer: this.partnerApiServer,
+        errorCode: axiosError?.response?.data?.error?.code,
+        errorMessage: axiosError?.response?.data?.error?.message,
+        httpStatus: axiosError?.response?.status,
+        needsUserMigration: true,
+        timestamp: new Date().toISOString(),
+      });
 
       // this.notify.error(this.limitsMessage, TIMEOUTS.STANDARD);
     } finally {

src/views/ClaimAddRawView.vue

@@ -1,27 +1,19 @@
 <template>
+  <QuickNav />
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Breadcrumb -->
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 class="text-lg text-center font-light relative px-7">
+        <!-- Back -->
+        <button
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="$router.back()"
+        >
+          <font-awesome icon="chevron-left" class="fa-fw" />
+        </button>
         Raw Claim
       </h1>
-
-      <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="$router.go(-1)"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
     <div class="flex">

src/views/ClaimView.vue

@@ -2,27 +2,19 @@
   <QuickNav />
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Breadcrumb -->
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 class="text-lg text-center font-light relative px-7">
+        <!-- Back -->
+        <button
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          aria-label="Go back"
+          @click="$router.go(-1)"
+        >
+          <font-awesome icon="chevron-left" class="fa-fw" />
+        </button>
         Verifiable Claim Details
       </h1>
-
-      <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="$router.go(-1)"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
     <!-- Details -->
@@ -88,25 +80,16 @@
               </button>
             </div>
           </div>
-          <div class="text-sm overflow-hidden">
-            <div
-              data-testId="description"
-              class="flex items-start gap-2 overflow-hidden"
-            >
-              <font-awesome
-                icon="message"
-                class="fa-fw text-slate-400 flex-shrink-0 mt-1"
-              />
-              <vue-markdown
-                :source="claimDescription"
-                class="markdown-content flex-1 min-w-0"
-              />
+          <div class="text-sm">
+            <div data-testId="description">
+              <font-awesome icon="message" class="fa-fw text-slate-400" />
+              {{ claimDescription }}
             </div>
-            <div class="overflow-hidden text-ellipsis">
+            <div>
               <font-awesome icon="user" class="fa-fw text-slate-400" />
               {{ didInfo(veriClaim.issuer) }}
             </div>
-            <div class="overflow-hidden text-ellipsis">
+            <div>
               <font-awesome icon="calendar" class="fa-fw text-slate-400" />
               Recorded
               {{ formattedIssueDate }}
@@ -550,11 +533,9 @@ import { AxiosError } from "axios";
 import * as yaml from "js-yaml";
 import * as R from "ramda";
 import { Component, Vue } from "vue-facing-decorator";
-import VueMarkdown from "vue-markdown-render";
 import { Router, RouteLocationNormalizedLoaded } from "vue-router";
 import { copyToClipboard } from "../services/ClipboardService";
-
-import { EmojiClaim, GenericVerifiableCredential } from "../interfaces";
+import { GenericVerifiableCredential } from "../interfaces";
 import GiftedDialog from "../components/GiftedDialog.vue";
 import QuickNav from "../components/QuickNav.vue";
 import { NotificationIface } from "../constants/app";
@@ -572,7 +553,7 @@ import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
 import { APP_SERVER } from "@/constants/app";
 
 @Component({
-  components: { GiftedDialog, QuickNav, VueMarkdown },
+  components: { GiftedDialog, QuickNav },
   mixins: [PlatformServiceMixin],
 })
 export default class ClaimView extends Vue {
@@ -670,10 +651,6 @@ export default class ClaimView extends Vue {
       return giveClaim.description || "";
     }
 
-    if (this.veriClaim.claimType === "Emoji") {
-      return (claim as EmojiClaim).text || "";
-    }
-
     // Fallback for other claim types
     return (claim as { description?: string })?.description || "";
   }

src/views/ConfirmContactView.vue

@@ -1,27 +1,18 @@
 <template>
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Breadcrumb -->
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 class="text-lg text-center font-light relative px-7">
+        <!-- Cancel -->
+        <router-link
+          :to="{ name: 'account' }"
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          ><font-awesome icon="chevron-left" class="fa-fw"></font-awesome>
+        </router-link>
+
         Confirm Contact
       </h1>
-
-      <!-- Back -->
-      <router-link
-        class="order-first text-lg text-center leading-none p-1"
-        :to="{ name: 'account' }"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </router-link>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
     <p class="text-center text-xl mb-4 font-light">

src/views/ConfirmGiftView.vue

@@ -1,11 +1,18 @@
 <template>
+  <QuickNav />
+  <TopMessage />
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <TopMessage />
-
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Breadcrumb -->
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 class="text-lg text-center font-light relative px-7">
+        <!-- Back -->
+        <button
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="$router.go(-1)"
+        >
+          <font-awesome icon="chevron-left" class="fa-fw" />
+        </button>
         <span
           v-if="
             libsUtil.isGiveRecordTheUserCanConfirm(
@@ -18,24 +25,8 @@
         >
           Do you agree?
         </span>
-        <span v-else>Confirmation Details</span>
+        <span v-else> Confirmation Details </span>
       </h1>
-
-      <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="$router.go(-1)"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
     <div v-if="giveDetails && !isLoading">

src/views/ContactAmountsView.vue

@@ -2,27 +2,18 @@
   <QuickNav selected="Contacts" />
 
   <section class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Header -->
+    <div class="mb-8">
+      <router-link
+        :to="{ name: 'contacts' }"
+        class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+      >
+        <font-awesome icon="chevron-left" class="fa-fw" />
+      </router-link>
+
+      <h1 class="text-4xl text-center font-light pt-4">
         Transferred with {{ contact?.name }}
       </h1>
-
-      <!-- Back -->
-      <router-link
-        class="order-first text-lg text-center leading-none p-1"
-        :to="{ name: 'contacts' }"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </router-link>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
     <!-- Info Messages -->
@@ -232,7 +223,7 @@ export default class ContactAmountssView extends Vue {
       const contact = await this.$getContact(contactDid);
       this.contact = contact;
 
-      const settings = await this.$accountSettings();
+      const settings = await this.$getMasterSettings();
 
       // Get activeDid from active_identity table (single source of truth)
       // eslint-disable-next-line @typescript-eslint/no-explicit-any

src/views/ContactEditView.vue

@@ -1,28 +1,19 @@
 <template>
-  <section id="ContactEdit" class="p-6 max-w-3xl mx-auto">
-    <TopMessage />
+  <QuickNav selected="Contacts" />
+  <TopMessage />
 
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+  <section id="ContactEdit" class="p-6 max-w-3xl mx-auto">
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 class="text-4xl text-center font-light relative px-7">
+        <!-- Back -->
+        <button
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="$router.go(-1)"
+        >
+          <font-awesome icon="chevron-left" class="fa-fw" />
+        </button>
         {{ contact?.name || AppString.NO_CONTACT_NAME }}
       </h1>
-
-      <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="$router.go(-1)"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
     <!-- Contact Name -->
@@ -55,70 +46,66 @@
 
     <!-- Contact Methods -->
     <div class="mt-4">
-      <div v-for="(method, index) in contactMethods" :key="index" class="mt-4">
-        <!-- Type and Value Row -->
-        <div class="flex gap-2">
-          <div class="flex-none w-32">
-            <label class="block text-xs font-medium text-gray-700 mb-1">
-              Type
-            </label>
-            <select
-              v-model="method.type"
-              class="block w-full border border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
-            >
-              <option value="">—</option>
-              <option
-                v-for="methodType in contactMethodTypes"
-                :key="methodType.value"
-                :value="methodType.value"
-              >
-                {{ methodType.label }}
-              </option>
-            </select>
-          </div>
-          <div class="flex-1">
-            <label class="block text-xs font-medium text-gray-700 mb-1">
-              Value
-            </label>
-            <input
-              v-model="method.value"
-              type="text"
-              class="block w-full border border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
-              placeholder="Number, email, etc."
-            />
-          </div>
+      <h2 class="text-lg font-medium text-gray-700">Contact Methods</h2>
+      <div
+        v-for="(method, index) in contactMethods"
+        :key="index"
+        class="flex mt-2"
+      >
+        <input
+          v-model="method.label"
+          type="text"
+          class="block w-1/4 border border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
+          placeholder="Label"
+        />
+        <input
+          v-model="method.type"
+          type="text"
+          class="block ml-2 w-1/4 border border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
+          placeholder="Type"
+        />
+        <div class="relative">
           <button
-            class="self-end pb-0.5 text-red-500"
-            @click="removeContactMethod(index)"
+            class="px-2 py-1 bg-gray-200 rounded-md"
+            @click="toggleDropdown(index)"
           >
-            <font-awesome icon="trash-can" class="fa-fw" />
+            <font-awesome icon="caret-down" class="fa-fw" />
           </button>
-        </div>
-
-        <!-- WhatsApp Help Text -->
-        <div
-          v-if="method.type === 'WHATSAPP'"
-          class="mt-1 ml-[calc(8rem+0.5rem)] text-xs text-gray-600 italic"
-        >
-          Must include country code and only numbers (e.g., 12225551234)
-        </div>
-
-        <!-- Label Row -->
-        <div class="mt-2 flex justify-end">
-          <div class="flex-1 ml-[calc(8rem+0.5rem)]">
-            <label class="block text-xs font-medium text-gray-700 mb-1">
-            </label>
-            <input
-              v-model="method.label"
-              type="text"
-              class="block w-full border border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
-              placeholder="Label / Note"
-            />
+          <div
+            v-if="dropdownIndex === index"
+            class="absolute bg-white border border-gray-300 rounded-md mt-1"
+          >
+            <div
+              class="px-4 py-2 hover:bg-gray-100 cursor-pointer"
+              @click="setMethodType(index, 'CELL')"
+            >
+              CELL
+            </div>
+            <div
+              class="px-4 py-2 hover:bg-gray-100 cursor-pointer"
+              @click="setMethodType(index, 'EMAIL')"
+            >
+              EMAIL
+            </div>
+            <div
+              class="px-4 py-2 hover:bg-gray-100 cursor-pointer"
+              @click="setMethodType(index, 'WHATSAPP')"
+            >
+              WHATSAPP
+            </div>
           </div>
-          <div class="w-[2.5rem]"></div>
         </div>
+        <input
+          v-model="method.value"
+          type="text"
+          class="block ml-2 w-1/2 border border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
+          placeholder="Number, email, etc."
+        />
+        <button class="ml-2 text-red-500" @click="removeContactMethod(index)">
+          <font-awesome icon="trash-can" class="fa-fw" />
+        </button>
       </div>
-      <button class="mt-4" @click="addContactMethod">
+      <button class="mt-2" @click="addContactMethod">
         <font-awesome
           icon="plus"
           class="fa-fw px-2 py-2.5 bg-green-500 text-green-100 rounded-full"
@@ -161,7 +148,6 @@ import {
 } from "../constants/notifications";
 import { Contact, ContactMethod } from "../db/tables/contacts";
 import { AppString } from "../constants/app";
-import { CONTACT_METHOD_TYPES } from "../constants/contacts";
 
 /**
  * Contact Edit View Component
@@ -224,11 +210,11 @@ export default class ContactEditView extends Vue {
   contactNotes = "";
   /** Array of editable contact methods */
   contactMethods: Array<ContactMethod> = [];
+  /** Currently open dropdown index, null if none open */
+  dropdownIndex: number | null = null;
 
   /** App string constants */
   AppString = AppString;
-  /** Contact method types for datalist suggestions */
-  contactMethodTypes = CONTACT_METHOD_TYPES;
 
   /**
    * Component lifecycle hook that initializes the contact edit form
@@ -285,6 +271,29 @@ export default class ContactEditView extends Vue {
     this.contactMethods.splice(index, 1);
   }
 
+  /**
+   * Toggles the type selection dropdown for a contact method
+   *
+   * If the clicked dropdown is already open, closes it.
+   * If another dropdown is open, closes it and opens the clicked one.
+   *
+   * @param index The array index of the method whose dropdown to toggle
+   */
+  toggleDropdown(index: number) {
+    this.dropdownIndex = this.dropdownIndex === index ? null : index;
+  }
+
+  /**
+   * Sets the type for a contact method and closes the dropdown
+   *
+   * @param index The array index of the method to update
+   * @param type The new type value (CELL, EMAIL, WHATSAPP)
+   */
+  setMethodType(index: number, type: string) {
+    this.contactMethods[index].type = type;
+    this.dropdownIndex = null;
+  }
+
   /**
    * Saves the edited contact information to the database
    *
@@ -320,16 +329,17 @@ export default class ContactEditView extends Vue {
     }
 
     // Save to database via PlatformServiceMixin
-    // Normalize empty strings to null to preserve database consistency
     await this.$updateContact(this.contact?.did || "", {
-      name: this.contactName?.trim() || null,
-      notes: this.contactNotes?.trim() || null,
+      name: this.contactName,
+      notes: this.contactNotes,
       contactMethods: contactMethods,
     });
 
     // Notify success and redirect
     this.notify.success(NOTIFY_CONTACT_SAVED.message, TIMEOUTS.STANDARD);
-    this.$router.back();
+    (this.$router as Router).push({
+      path: "/did/" + encodeURIComponent(this.contact?.did || ""),
+    });
   }
 }
 </script>

src/views/ContactGiftingView.vue

@@ -2,27 +2,17 @@
   <QuickNav selected="Home"></QuickNav>
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Breadcrumb -->
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 class="text-2xl text-center font-semibold relative px-7">
+        <!-- Back -->
+        <router-link
+          :to="{ name: 'home' }"
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          ><font-awesome icon="chevron-left" class="fa-fw"></font-awesome>
+        </router-link>
         {{ stepType === "giver" ? "Given by..." : "Given to..." }}
       </h1>
-
-      <!-- Back -->
-      <router-link
-        class="order-first text-lg text-center leading-none p-1"
-        :to="{ name: 'home' }"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </router-link>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
     <!-- Results List -->

src/views/ContactImportView.vue

@@ -1,29 +1,21 @@
 <template>
   <QuickNav selected="Contacts"></QuickNav>
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
-        Contact Import
+    <!-- Back -->
+    <div class="text-lg text-center font-light relative px-7">
+      <h1
+        class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+        @click="$router.back()"
+      >
+        <font-awesome icon="chevron-left" class="fa-fw"></font-awesome>
       </h1>
-
-      <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="$router.go(-1)"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
+    <!-- Heading -->
+    <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
+      Contact Import
+    </h1>
+
     <div v-if="checkingImports" class="text-center">
       <font-awesome icon="spinner" class="animate-spin" />
     </div>

src/views/ContactQRScanFullView.vue

@@ -2,27 +2,26 @@
   <!-- CONTENT -->
   <section id="Content" class="relative w-[100vw] h-[100vh]">
     <div :class="mainContentClasses">
-      <!-- Sub View Heading -->
-      <div id="SubViewHeading" class="flex gap-4 items-start mb-4">
-        <h1 class="grow text-xl text-center font-semibold leading-tight">
+      <div class="mb-4">
+        <h1 class="text-xl text-center font-semibold relative">
+          <!-- Back -->
+          <a
+            class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+            @click="handleBack"
+          >
+            <font-awesome icon="chevron-left" class="fa-fw" />
+          </a>
+
+          <!-- Quick Help -->
+          <a
+            class="text-xl text-center text-blue-500 px-2 py-1 absolute -right-2 -top-1"
+            @click="toastQRCodeHelp()"
+          >
+            <font-awesome icon="circle-question" class="fa-fw" />
+          </a>
+
           Share Contact Info
         </h1>
-
-        <!-- Back -->
-        <a
-          class="order-first text-lg text-center leading-none p-1"
-          @click="handleBack"
-        >
-          <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-        </a>
-
-        <!-- Quick Help -->
-        <a
-          class="block text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-          @click="toastQRCodeHelp()"
-        >
-          <font-awesome icon="question" class="block text-center w-[1em]" />
-        </a>
       </div>
 
       <div
@@ -236,7 +235,7 @@ export default class ContactQRScanFull extends Vue {
    * Computed property for main content container CSS classes
    */
   get mainContentClasses(): string {
-    return "p-4 bg-white w-full max-w-[calc((100vh-max(env(safe-area-inset-top),var(--safe-area-inset-top,0px))-max(env(safe-area-inset-bottom),var(--safe-area-inset-bottom,0px)))*0.4)] mx-auto";
+    return "p-6 bg-white w-full max-w-[calc((100vh-max(env(safe-area-inset-top),var(--safe-area-inset-top,0px))-max(env(safe-area-inset-bottom),var(--safe-area-inset-bottom,0px)))*0.4)] mx-auto";
   }
 
   /**

src/views/ContactQRScanShowView.vue

@@ -1,27 +1,26 @@
 <template>
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <div class="mb-2">
+      <h1 class="text-2xl text-center font-semibold relative px-7">
+        <!-- Back -->
+        <a
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="handleBack"
+        >
+          <font-awesome icon="chevron-left" class="fa-fw" />
+        </a>
+
+        <!-- Quick Help -->
+        <a
+          class="text-2xl text-center text-blue-500 px-2 py-1 absolute -right-2 -top-1"
+          @click="toastQRCodeHelp()"
+        >
+          <font-awesome icon="circle-question" class="fa-fw" />
+        </a>
+
         Share Contact Info
       </h1>
-
-      <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="handleBack"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
-
-      <!-- Quick Help -->
-      <a
-        class="block text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-        @click="toastQRCodeHelp()"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </a>
     </div>
 
     <div v-if="!givenName" :class="nameWarningClasses">

src/views/ContactsView.vue

@@ -1,25 +1,14 @@
 <template>
   <QuickNav selected="Contacts" />
+  <TopMessage />
 
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <TopMessage />
+    <!-- Heading -->
+    <h1 id="ViewHeading" class="text-4xl text-center font-light">
+      Your Contacts
+    </h1>
 
-    <!-- Main View Heading -->
-    <div class="flex gap-4 items-center mb-4">
-      <h1 id="ViewHeading" class="text-2xl font-bold leading-none">
-        Your Contacts
-      </h1>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
-    </div>
-
-    <div class="flex justify-between py-2 mt-4">
+    <div class="flex justify-between py-2 mt-8">
       <span />
       <span>
         <a
@@ -171,11 +160,9 @@ import {
   CONTACT_IMPORT_ONE_URL_PATH_TIME_SAFARI,
   CONTACT_URL_PATH_ENDORSER_CH_OLD,
 } from "../libs/endorserServer";
-import {
-  GiveSummaryRecord,
-  UserInfo,
-  VerifiableCredential,
-} from "@/interfaces";
+import { GiveSummaryRecord } from "@/interfaces/records";
+import { UserInfo } from "@/interfaces/common";
+import { VerifiableCredential } from "@/interfaces/claims-result";
 import * as libsUtil from "../libs/util";
 import {
   generateSaveAndActivateIdentity,

src/views/DIDView.vue

@@ -1,31 +1,22 @@
 <template>
   <QuickNav selected="Contacts" />
+  <TopMessage />
 
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <TopMessage />
-
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Breadcrumb -->
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 id="ViewHeading" class="text-lg text-center font-light relative px-7">
+        <!-- Go to 'contacts' instead of just 'back' because they could get here from an edit page 
+             (and going back there is annoying). -->
+        <router-link
+          :to="{ name: 'contacts' }"
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+        >
+          <font-awesome icon="chevron-left" class="fa-fw"></font-awesome>
+        </router-link>
         Identifier Details
       </h1>
-
-      <!-- Back -->
-      <button
-        class="order-first text-lg text-center leading-none p-1"
-        @click="goBack()"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </button>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
     <!-- Identity Details -->
@@ -34,7 +25,7 @@
       class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4"
     >
       <div>
-        <h2 class="text-xl font-semibold overflow-hidden text-ellipsis">
+        <h2 class="text-xl font-semibold">
           {{ contactFromDid?.name || "(no name)" }}
           <router-link
             :to="{ name: 'contact-edit', params: { did: contactFromDid?.did } }"
@@ -42,58 +33,6 @@
             <font-awesome icon="pen" class="text-sm text-blue-500 ml-2 mb-1" />
           </router-link>
         </h2>
-
-        <!-- Notes -->
-        <div v-if="contactFromDid.notes" class="mt-3">
-          <p class="text-sm text-slate-700 whitespace-pre-wrap">
-            {{ contactFromDid.notes }}
-          </p>
-        </div>
-
-        <!-- Contact Methods -->
-        <div v-if="contactFromDid.contactMethods?.length" class="mt-3">
-          <div class="flex flex-col gap-2">
-            <div
-              v-for="(method, index) in contactFromDid.contactMethods"
-              :key="index"
-              class="flex items-center gap-2 text-sm"
-            >
-              <span class="font-semibold text-slate-600"
-                >{{
-                  getContactMethodLabel(method.type) || "(unspecified)"
-                }}:</span
-              >
-              <span class="text-slate-700">{{ method.label }}</span>
-              <span class="text-slate-600">{{ method.value }}</span>
-              <a
-                v-if="method.type === 'CELL'"
-                :href="`sms:${method.value}`"
-                class="ml-2 text-blue-500 hover:text-blue-700"
-                title="Send text message"
-              >
-                <font-awesome icon="message" class="text-base" />
-              </a>
-              <a
-                v-if="method.type === 'EMAIL'"
-                :href="`mailto:${method.value}`"
-                class="ml-2 text-blue-500 hover:text-blue-700"
-                title="Send email"
-              >
-                <font-awesome icon="envelope" class="text-base" />
-              </a>
-              <a
-                v-if="method.type === 'WHATSAPP'"
-                :href="`https://wa.me/${method.value.replace(/\D/g, '')}`"
-                target="_blank"
-                class="ml-2 text-blue-700"
-                title="Send WhatsApp message"
-              >
-                <font-awesome :icon="['fab', 'whatsapp']" class="text-base" />
-              </a>
-            </div>
-          </div>
-        </div>
-
         <button class="ml-2 mr-2 mt-4" @click="toggleDidDetails">
           Details
           <font-awesome
@@ -354,7 +293,6 @@ import {
   NOTIFY_CONTACT_INVALID_DID,
 } from "@/constants/notifications";
 import { THAT_UNNAMED_PERSON } from "@/constants/entities";
-import { getContactMethodLabel } from "@/constants/contacts";
 
 /**
  * DIDView Component
@@ -405,7 +343,6 @@ export default class DIDView extends Vue {
   capitalizeAndInsertSpacesBeforeCaps = capitalizeAndInsertSpacesBeforeCaps;
   didInfoForContact = didInfoForContact;
   displayAmount = displayAmount;
-  getContactMethodLabel = getContactMethodLabel;
 
   /**
    * Initializes notification helpers
@@ -530,7 +467,7 @@ export default class DIDView extends Vue {
    * Navigation helper methods
    */
   goBack() {
-    this.$router.back();
+    this.$router.go(-1);
   }
 
   /**

src/views/DeepLinkErrorView.vue

@@ -1,15 +1,7 @@
 <template>
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1
-        class="grow text-rose-500 text-xl text-center font-semibold leading-tight"
-      >
-        Invalid Deep Link
-      </h1>
-    </div>
-
+    <h1>Invalid Deep Link</h1>
     <div class="error-details">
       <div class="error-message">
         <h3>Error Details</h3>
@@ -122,6 +114,11 @@ onMounted(() => {
 </script>
 
 <style scoped>
+h1 {
+  color: #ff4444;
+  margin-bottom: 24px;
+}
+
 h2,
 h3 {
   color: #333;

src/views/DeepLinkRedirectView.vue

@@ -2,12 +2,9 @@
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <div class="mb-4">
-      <!-- Sub View Heading -->
-      <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-        <h1 class="grow text-xl text-center font-semibold leading-tight">
-          Redirecting to Time Safari
-        </h1>
-      </div>
+      <h1 class="text-2xl text-center font-semibold relative px-7">
+        Redirecting to Time Safari
+      </h1>
 
       <div v-if="destinationUrl" class="space-y-4">
         <!-- Platform-specific messaging -->

src/views/DiscoverView.vue

@@ -1,22 +1,13 @@
 <template>
   <QuickNav selected="Discover" />
+  <TopMessage />
 
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <TopMessage />
-
-    <!-- Main View Heading -->
-    <div class="flex gap-4 items-center mb-4">
-      <h1 id="ViewHeading" class="text-2xl font-bold leading-none">Discover</h1>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
-    </div>
+    <!-- Heading -->
+    <h1 id="ViewHeading" class="text-4xl text-center font-light">
+      Discover Projects & People
+    </h1>
 
     <OnboardingDialog ref="onboardingDialog" />
 
@@ -60,33 +51,6 @@
     <!-- Secondary Tabs -->
     <div class="text-center text-slate-500 border-b border-slate-300">
       <ul class="flex flex-wrap justify-center gap-4 -mb-px">
-        <li v-if="isProjectsActive">
-          <a
-            href="#"
-            :class="computedStarredTabStyleClassNames()"
-            @click="
-              projects = [];
-              userProfiles = [];
-              isStarredActive = true;
-              isLocalActive = false;
-              isMappedActive = false;
-              isAnywhereActive = false;
-              isSearchVisible = false;
-              tempSearchBox = null;
-              searchStarred();
-            "
-          >
-            Starred
-            <!-- restore when the links don't jump around for different numbers
-            <span
-              class="font-semibold text-sm bg-slate-200 px-1.5 py-0.5 rounded-md"
-              v-if="isLocalActive"
-            >
-              {{ localCount > -1 ? localCount : "?" }}
-            </span>
-            -->
-          </a>
-        </li>
         <li>
           <a
             href="#"
@@ -94,11 +58,9 @@
             @click="
               projects = [];
               userProfiles = [];
-              isStarredActive = false;
               isLocalActive = true;
               isMappedActive = false;
               isAnywhereActive = false;
-              isStarredActive = false;
               isSearchVisible = true;
               tempSearchBox = null;
               searchLocal();
@@ -122,11 +84,9 @@
             @click="
               projects = [];
               userProfiles = [];
-              isStarredActive = false;
               isLocalActive = false;
               isMappedActive = true;
               isAnywhereActive = false;
-              isStarredActive = false;
               isSearchVisible = false;
               searchTerms = '';
               tempSearchBox = null;
@@ -143,11 +103,9 @@
             @click="
               projects = [];
               userProfiles = [];
-              isStarredActive = false;
               isLocalActive = false;
               isMappedActive = false;
               isAnywhereActive = true;
-              isStarredActive = false;
               isSearchVisible = true;
               tempSearchBox = null;
               searchAll();
@@ -243,15 +201,6 @@
           >No {{ isProjectsActive ? "projects" : "people" }} were found with
           that search.</span
         >
-        <span v-else-if="isStarredActive">
-          <p>
-            You have no starred projects. Star some projects to see them here.
-          </p>
-          <p class="mt-4">
-            When you star projects, you will get a notice on the front page when
-            they change.
-          </p>
-        </span>
       </p>
     </div>
 
@@ -282,8 +231,8 @@
                 />
               </div>
 
-              <div class="grow overflow-hidden">
-                <h2 class="text-base font-semibold truncate">
+              <div class="grow">
+                <h2 class="text-base font-semibold">
                   {{ project.name || unnamedProject }}
                 </h2>
                 <div class="text-sm">
@@ -434,12 +383,9 @@ export default class DiscoverView extends Vue {
   allMyDids: Array<string> = [];
   apiServer = "";
   isLoading = false;
-
   isLocalActive = false;
   isMappedActive = false;
   isAnywhereActive = true;
-  isStarredActive = false;
-
   isProjectsActive = true;
   isPeopleActive = false;
   isSearchVisible = true;
@@ -528,8 +474,6 @@ export default class DiscoverView extends Vue {
         leafletObject: L.Map;
       };
       this.requestTiles(mapRef.leafletObject); // not ideal because I found this from experimentation, not documentation
-    } else if (this.isStarredActive) {
-      await this.searchStarred();
     } else {
       await this.searchAll();
     }
@@ -600,60 +544,6 @@ export default class DiscoverView extends Vue {
     }
   }
 
-  public async searchStarred() {
-    this.resetCounts();
-
-    // Clear any previous results
-    this.projects = [];
-    this.userProfiles = [];
-
-    try {
-      this.isLoading = true;
-
-      // Get starred project IDs from settings
-      const settings = await this.$accountSettings();
-
-      const starredIds = settings.starredPlanHandleIds || [];
-      if (starredIds.length === 0) {
-        // No starred projects
-        return;
-      }
-
-      // This could be optimized to only pull those not already in the cache (endorserServer.ts)
-
-      const planHandleIdsJson = JSON.stringify(starredIds);
-      const endpoint =
-        this.apiServer +
-        "/api/v2/report/plans?planHandleIds=" +
-        encodeURIComponent(planHandleIdsJson);
-      const response = await this.axios.get(endpoint, {
-        headers: await getHeaders(this.activeDid),
-      });
-      if (response.status !== 200) {
-        this.notify.error("Failed to load starred projects", TIMEOUTS.SHORT);
-        return;
-      }
-      const starredPlans: PlanData[] = response.data.data;
-      if (response.data.hitLimit) {
-        // someday we'll have to let them incrementally load the rest
-        this.notify.warning(
-          "Beware: you have so many starred projects that we cannot load them all.",
-          TIMEOUTS.SHORT,
-        );
-      }
-
-      this.projects = starredPlans;
-    } catch (error: unknown) {
-      logger.error("Error loading starred projects:", error);
-      this.notify.error(
-        "Failed to load starred projects. Please try again.",
-        TIMEOUTS.LONG,
-      );
-    } finally {
-      this.isLoading = false;
-    }
-  }
-
   public async searchLocal(beforeId?: string) {
     this.resetCounts();
 
@@ -747,12 +637,9 @@ export default class DiscoverView extends Vue {
         const latestProject = this.projects[this.projects.length - 1];
         if (this.isLocalActive || this.isMappedActive) {
           this.searchLocal(latestProject.rowId);
-        } else if (this.isStarredActive) {
-          this.searchStarred();
         } else if (this.isAnywhereActive) {
           this.searchAll(latestProject.rowId);
         }
-        // Note: Starred tab doesn't support pagination since we load all starred projects at once
       } else if (this.isPeopleActive && this.userProfiles.length > 0) {
         const latestProfile = this.userProfiles[this.userProfiles.length - 1];
         if (this.isLocalActive || this.isMappedActive) {
@@ -892,28 +779,10 @@ export default class DiscoverView extends Vue {
     this.$router.push(route);
   }
 
-  public computedStarredTabStyleClassNames() {
-    return {
-      "inline-block": true,
-      "py-3": true,
-      "rounded-t-lg": true,
-      "border-b-2": true,
-
-      active: this.isStarredActive,
-      "text-black": this.isStarredActive,
-      "border-black": this.isStarredActive,
-      "font-semibold": this.isStarredActive,
-
-      "text-blue-600": !this.isStarredActive,
-      "border-transparent": !this.isStarredActive,
-      "hover:border-slate-400": !this.isStarredActive,
-    };
-  }
-
   public computedLocalTabStyleClassNames() {
     return {
       "inline-block": true,
-      "py-2": true,
+      "py-3": true,
       "rounded-t-lg": true,
       "border-b-2": true,
 
@@ -931,7 +800,7 @@ export default class DiscoverView extends Vue {
   public computedMappedTabStyleClassNames() {
     return {
       "inline-block": true,
-      "py-2": true,
+      "py-3": true,
       "rounded-t-lg": true,
       "border-b-2": true,
 
@@ -949,7 +818,7 @@ export default class DiscoverView extends Vue {
   public computedRemoteTabStyleClassNames() {
     return {
       "inline-block": true,
-      "py-2": true,
+      "py-3": true,
       "rounded-t-lg": true,
       "border-b-2": true,
 
@@ -967,7 +836,7 @@ export default class DiscoverView extends Vue {
   public computedProjectsTabStyleClassNames() {
     return {
       "inline-block": true,
-      "py-2": true,
+      "py-3": true,
       "rounded-t-lg": true,
       "border-b-2": true,
 
@@ -985,7 +854,7 @@ export default class DiscoverView extends Vue {
   public computedPeopleTabStyleClassNames() {
     return {
       "inline-block": true,
-      "py-2": true,
+      "py-3": true,
       "rounded-t-lg": true,
       "border-b-2": true,
 

src/views/GiftedDetailsView.vue

@@ -1,33 +1,24 @@
 <template>
+  <QuickNav />
+  <TopMessage />
+
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <TopMessage />
-
-    <div class="mb-8">
-      <!-- Sub View Heading -->
-      <div id="SubViewHeading" class="flex gap-4 items-start mb-4">
-        <h1 class="grow text-xl text-center font-semibold leading-tight">
-          What Was Given
-        </h1>
-
+    <!-- Breadcrumb -->
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 class="text-2xl text-center font-semibold relative px-7 mb-2">
         <!-- Back -->
-        <a
-          class="order-first text-lg text-center leading-none p-1"
+        <div
+          v-if="!hideBackButton"
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
           @click="cancelBack()"
         >
-          <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-        </a>
+          <font-awesome icon="chevron-left" class="fa-fw" />
+        </div>
+        What Was Given
+      </h1>
 
-        <!-- Help button -->
-        <router-link
-          :to="{ name: 'help' }"
-          class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-        >
-          <font-awesome icon="question" class="block text-center w-[1em]" />
-        </router-link>
-      </div>
-
-      <h2 class="text-lg font-normal leading-tight text-center overflow-hidden">
+      <h2 class="text-lg font-normal text-center overflow-hidden">
         <div class="truncate">
           From
           {{

src/views/HelpNotificationTypesView.vue

@@ -3,27 +3,22 @@
 
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Breadcrumb -->
+    <div class="mb-8">
+      <!-- Back -->
+      <div class="text-lg text-center font-light relative px-7">
+        <h1
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="$router.back()"
+        >
+          <font-awesome icon="chevron-left" class="fa-fw"></font-awesome>
+        </h1>
+      </div>
+
+      <!-- Heading -->
+      <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
         Notification Types
       </h1>
-
-      <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="$router.go(-1)"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
     <!-- eslint-disable prettier/prettier -->

src/views/HelpNotificationsView.vue

@@ -34,27 +34,22 @@
 
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Breadcrumb -->
+    <div class="mb-8">
+      <!-- Back -->
+      <div class="text-lg text-center font-light relative px-7">
+        <h1
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="goBack()"
+        >
+          <font-awesome icon="chevron-left" class="fa-fw"></font-awesome>
+        </h1>
+      </div>
+
+      <!-- Heading -->
+      <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
         Notification Help
       </h1>
-
-      <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="goBack()"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
     <!-- eslint-disable prettier/prettier -->
@@ -399,7 +394,7 @@ export default class HelpNotificationsView extends Vue {
   notifyingReminderTime = "";
 
   // Notification helper system
-  notify!: ReturnType<typeof createNotifyHelpers>;
+  notify = createNotifyHelpers(this.$notify);
 
   /**
    * Computed property for consistent button styling
@@ -435,9 +430,6 @@ export default class HelpNotificationsView extends Vue {
    * Handles errors gracefully with proper logging without exposing sensitive data.
    */
   async mounted() {
-    // Initialize notification helpers
-    this.notify = createNotifyHelpers(this.$notify);
-
     try {
       const registration = await navigator.serviceWorker?.ready;
       const fullSub = await registration?.pushManager.getSubscription();

src/views/HelpOnboardingView.vue

@@ -3,9 +3,11 @@
 
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Breadcrumb -->
+    <div class="mb-8">
+      <!-- Don't include 'back' button since this is shown in a different window. -->
+      <!-- Heading -->
+      <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
         Time Safari Onboarding Instructions
       </h1>
     </div>

src/views/HelpView.vue

@@ -3,25 +3,23 @@
 
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
-        Help
-        <span class="text-xs font-medium text-slate-500 uppercase">{{
-          package.version
-        }}</span>
-      </h1>
-
+    <!-- Breadcrumb -->
+    <div class="mb-8">
       <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="$router.go(-1)"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
+      <div class="text-lg text-center font-light relative px-7">
+        <h1
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="$router.back()"
+        >
+          <font-awesome icon="chevron-left" class="fa-fw" />
+        </h1>
+      </div>
 
-      <!-- Spacer (no Help button) -->
-      <div class="p-3 pe-3.5 pb-3.5"></div>
+      <!-- Heading -->
+      <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
+        Help
+        <span class="text-xs text-gray-500">{{ package.version }}</span>
+      </h1>
     </div>
 
     <!-- eslint-disable prettier/prettier max-len -->

src/views/HomeView.vue

@@ -6,6 +6,7 @@ Raymer * @version 1.0.0 */
 
 <template>
   <QuickNav selected="Home" />
+  <TopMessage />
 
   <!-- CONTENT -->
   <section
@@ -13,25 +14,10 @@ Raymer * @version 1.0.0 */
     class="p-6 pb-24 max-w-3xl mx-auto"
     :data-active-did="activeDid"
   >
-    <TopMessage />
-
-    <!-- Main View Heading -->
-    <div class="flex gap-4 items-center mb-4">
-      <h1 id="ViewHeading" class="text-2xl font-bold leading-none">
-        {{ AppString.APP_NAME }}
-        <span class="text-xs font-medium text-slate-500 uppercase">{{
-          package.version
-        }}</span>
-      </h1>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
-    </div>
+    <h1 id="ViewHeading" class="text-4xl text-center font-light mb-8">
+      {{ AppString.APP_NAME }}
+      <span class="text-xs text-gray-500">{{ package.version }}</span>
+    </h1>
 
     <OnboardingDialog ref="onboardingDialog" />
 
@@ -94,53 +80,51 @@ Raymer * @version 1.0.0 */
       </router-link>
     </div>
 
-    <div class="mb-8">
-      <!-- 
-      They should have an identifier, even if it's an auto-generated one that they'll never use.
-      Identity creation is now handled by router navigation guard.
-      -->
-      <div class="mb-4">
-        <RegistrationNotice
-          v-if="!isUserRegistered"
-          :passkeys-enabled="PASSKEYS_ENABLED"
-          :given-name="givenName"
-          message="To share, someone must register you."
-        />
+    <!-- 
+    They should have an identifier, even if it's an auto-generated one that they'll never use.
+    Identity creation is now handled by router navigation guard.
+    -->
+    <div class="mb-6">
+      <RegistrationNotice
+        v-if="!isUserRegistered"
+        :passkeys-enabled="PASSKEYS_ENABLED"
+        :given-name="givenName"
+        message="To share, someone must register you."
+      />
 
-        <div v-if="isUserRegistered" id="sectionRecordSomethingGiven">
-          <!-- Record Quick-Action -->
-          <div class="mb-6">
-            <div class="flex gap-2 items-center mb-2">
-              <h2 class="font-bold">Record something given by:</h2>
-              <button
-                class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-                @click="openGiftedPrompts()"
-              >
-                <font-awesome
-                  icon="lightbulb"
-                  class="block text-center w-[1em]"
-                />
-              </button>
-            </div>
+      <div v-if="isUserRegistered" id="sectionRecordSomethingGiven">
+        <!-- Record Quick-Action -->
+        <div class="bg-slate-200 rounded-lg overflow-hidden p-3 pt-2.5">
+          <div class="flex gap-2 items-center mb-2">
+            <h2 class="font-bold">Record something given by:</h2>
+            <button
+              class="block ms-auto text-center text-white bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
+              @click="openGiftedPrompts()"
+            >
+              <font-awesome
+                icon="lightbulb"
+                class="block text-center text-sm w-[1em]"
+              />
+            </button>
+          </div>
 
-            <div class="grid grid-cols-2 gap-2">
-              <button
-                type="button"
-                class="text-center text-base uppercase 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-2 rounded-lg"
-                @click="openPersonDialog()"
-              >
-                <font-awesome icon="user" />
-                Person
-              </button>
-              <button
-                type="button"
-                class="text-center text-base uppercase 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-2 rounded-lg"
-                @click="openProjectDialog()"
-              >
-                <font-awesome icon="folder-open" />
-                Project
-              </button>
-            </div>
+          <div class="grid grid-cols-2 gap-2">
+            <button
+              type="button"
+              class="text-center text-base uppercase 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-2 rounded-md"
+              @click="openPersonDialog()"
+            >
+              <font-awesome icon="user" />
+              Person
+            </button>
+            <button
+              type="button"
+              class="text-center text-base uppercase 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-2 rounded-md"
+              @click="openProjectDialog()"
+            >
+              <font-awesome icon="folder-open" />
+              Project
+            </button>
           </div>
         </div>
       </div>
@@ -152,90 +136,90 @@ Raymer * @version 1.0.0 */
       :recipient-entity-type="'person'"
     />
     <GiftedPrompts ref="giftedPrompts" />
-    <FeedFilters ref="feedFilters" />
 
     <!-- Results List -->
     <div class="mt-4 mb-4">
-      <div class="flex gap-2 items-center mb-3">
-        <h2 class="font-bold">Latest Activity</h2>
+      <!-- ALTERNATIVE UI: Feed + Notification Tabs -->
+      <div
+        class="sticky top-0 z-50 grid grid-cols-5 text-xl sm:text-2xl pt-4 pb-1 px-1 -mt-3 -mx-1 mb-4 bg-white rounded-b-[10px]"
+      >
         <button
-          v-if="resultsAreFiltered()"
-          class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-          @click="openFeedFilters()"
+          class="relative text-center bg-slate-400 text-white px-1 pt-3 pb-2 first:rounded-s-md last:rounded-e-md border-r border-slate-300 last:border-r-0 leading-none"
         >
-          <font-awesome
-            icon="filter"
-            class="block text-center w-[1em] translate-y-[0.05em]"
-          />
+          <font-awesome icon="scroll" />
+          <div class="text-xs sm:text-sm mt-1">activity</div>
         </button>
         <button
-          v-else
-          class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-          @click="openFeedFilters()"
+          class="relative text-center bg-slate-200 text-slate-500 px-1 pt-3 pb-2 first:rounded-s-md last:rounded-e-md border-r border-slate-300 last:border-r-0 leading-none"
         >
-          <font-awesome
-            icon="filter"
-            class="block text-center w-[1em] translate-y-[0.05em]"
-          />
+          <font-awesome icon="hand-holding-heart" />
+          <div class="text-xs sm:text-sm mt-1">offers</div>
+
+          <!-- Unread count -->
+          <span
+            class="absolute -top-2 -translate-x-1/2 bg-rose-500 text-white border border-white text-xs font-semibold leading-none rounded-full px-[0.4em] py-[0.15em]"
+            >2</span
+          >
+        </button>
+        <button
+          class="relative text-center bg-slate-200 text-slate-500 px-1 pt-3 pb-2 first:rounded-s-md last:rounded-e-md border-r border-slate-300 last:border-r-0 leading-none"
+        >
+          <font-awesome icon="folder-open" />
+          <div class="text-xs sm:text-sm mt-1">projects</div>
+
+          <!-- Unread count -->
+          <span
+            class="absolute -top-2 -translate-x-1/2 bg-rose-500 text-white border border-white text-xs font-semibold leading-none rounded-full px-[0.4em] py-[0.15em]"
+            >50+</span
+          >
+        </button>
+        <button
+          class="relative text-center bg-slate-200 text-slate-500 px-1 pt-3 pb-2 first:rounded-s-md last:rounded-e-md border-r border-slate-300 last:border-r-0 leading-none"
+        >
+          <font-awesome icon="users" />
+          <div class="text-xs sm:text-sm mt-1">people</div>
+
+          <!-- Unread count -->
+          <span
+            class="absolute -top-2 -translate-x-1/2 bg-rose-500 text-white border border-white text-xs font-semibold leading-none rounded-full px-[0.4em] py-[0.15em]"
+            >4</span
+          >
+        </button>
+        <button
+          class="relative text-center bg-slate-200 text-slate-500 px-1 pt-3 pb-2 first:rounded-s-md last:rounded-e-md border-r border-slate-300 last:border-r-0 leading-none"
+        >
+          <font-awesome icon="image" />
+          <div class="text-xs sm:text-sm mt-1">items</div>
+
+          <!-- Unread count -->
+          <span
+            class="absolute -top-2 -translate-x-1/2 bg-rose-500 text-white border border-white text-xs font-semibold leading-none rounded-full px-[0.4em] py-[0.15em]"
+            >7</span
+          >
         </button>
       </div>
 
-      <div
-        class="border-t p-2 border-slate-300"
-        @click="goToActivityToUserPage()"
-      >
-        <div class="flex justify-center gap-2">
-          <div
-            v-if="numNewOffersToUser"
-            class="bg-gradient-to-b from-green-400 to-green-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] flex-1 px-4 py-4 rounded-md text-white cursor-pointer"
-          >
-            <span
-              class="block text-center text-6xl"
-              data-testId="newDirectOffersActivityNumber"
-            >
-              {{ numNewOffersToUser }}{{ newOffersToUserHitLimit ? "+" : "" }}
-            </span>
-            <p class="text-center">
-              new offer{{ numNewOffersToUser === 1 ? "" : "s" }} to you
-            </p>
-          </div>
-          <div
-            v-if="numNewOffersToUserProjects"
-            class="bg-gradient-to-b from-green-400 to-green-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] flex-1 px-4 py-4 rounded-md text-white cursor-pointer"
-          >
-            <span
-              class="block text-center text-6xl"
-              data-testId="newOffersToUserProjectsActivityNumber"
-            >
-              {{ numNewOffersToUserProjects
-              }}{{ newOffersToUserProjectsHitLimit ? "+" : "" }}
-            </span>
-            <p class="text-center">
-              new offer{{ numNewOffersToUserProjects === 1 ? "" : "s" }} to your
-              projects
-            </p>
-          </div>
-          <div
-            v-if="numNewStarredProjectChanges"
-            class="bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] flex-1 px-4 py-4 rounded-md text-white cursor-pointer"
-          >
-            <span
-              class="block text-center text-6xl"
-              data-testId="newStarredProjectChangesActivityNumber"
-            >
-              {{ numNewStarredProjectChanges
-              }}{{ newStarredProjectChangesHitLimit ? "+" : "" }}
-            </span>
-            <p class="text-center">
-              starred project{{ numNewStarredProjectChanges === 1 ? "" : "s" }}
-              with changes
-            </p>
-          </div>
-        </div>
-        <div class="flex justify-end mt-2">
-          <button class="text-blue-500">View All New Activity For You</button>
-        </div>
+      <div class="flex gap-2 items-center justify-between mb-2 text-sm">
+        <h2 class="text-base font-bold">Latest Activity</h2>
+        <button
+          v-if="resultsAreFiltered()"
+          class="flex items-center justify-end gap-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 px-2 py-1 rounded"
+          @click="openFeedFilters()"
+        >
+          Filter
+          <font-awesome icon="filter"></font-awesome>
+        </button>
+        <button
+          v-else
+          class="flex items-center justify-end gap-2 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 rounded"
+          @click="openFeedFilters()"
+        >
+          Filter
+          <font-awesome icon="filter"></font-awesome>
+        </button>
       </div>
+      <FeedFilters ref="feedFilters" />
+
       <InfiniteScroll @reached-bottom="loadMoreGives">
         <ul id="listLatestActivity" class="space-y-4">
           <ActivityListItem
@@ -245,7 +229,6 @@ Raymer * @version 1.0.0 */
             :last-viewed-claim-id="feedLastViewedClaimId"
             :is-registered="isRegistered"
             :active-did="activeDid"
-            :api-server="apiServer"
             @load-claim="onClickLoadClaim"
             @view-image="openImageViewer"
           />
@@ -299,7 +282,6 @@ import {
   getHeaders,
   getNewOffersToUser,
   getNewOffersToUserProjects,
-  getStarredProjectsWithChanges,
   getPlanFromCache,
 } from "../libs/endorserServer";
 import {
@@ -316,7 +298,6 @@ import { NOTIFY_CONTACT_LOADING_ISSUE } from "@/constants/notifications";
 import * as Package from "../../package.json";
 import { UNNAMED_ENTITY_NAME } from "@/constants/entities";
 import { errorStringForLog } from "../libs/endorserServer";
-import * as databaseUtil from "../db/databaseUtil";
 
 // consolidate this with GiveActionClaim in src/interfaces/claims.ts
 interface Claim {
@@ -429,25 +410,11 @@ export default class HomeView extends Vue {
   isRegistered = false;
   lastAckedOfferToUserJwtId?: string; // the last JWT ID for offer-to-user that they've acknowledged seeing
   lastAckedOfferToUserProjectsJwtId?: string; // the last JWT ID for offers-to-user's-projects that they've acknowledged seeing
-  lastAckedStarredPlanChangesJwtId?: string; // the last JWT ID for starred project changes that they've acknowledged seeing
   newOffersToUserHitLimit: boolean = false;
   newOffersToUserProjectsHitLimit: boolean = false;
-  newStarredProjectChangesHitLimit: boolean = false;
   numNewOffersToUser: number = 0; // number of new offers-to-user
   numNewOffersToUserProjects: number = 0; // number of new offers-to-user's-projects
 
-  numNewStarredProjectChanges: number = 0; // number of new starred project changes
-  starredPlanHandleIds: Array<string> = []; // list of starred project IDs
-  searchBoxes: Array<{
-    name: string;
-    bbox: BoundingBox;
-  }> = [];
-  showShortcutBvc = false;
-  userAgentInfo = new UAParser(); // see https://docs.uaparser.js.org/v2/api/ua-parser-js/get-os.html
-  selectedImage = "";
-  isImageViewerOpen = false;
-  showProjectsDialog = false;
-
   /**
    * CRITICAL VUE REACTIVITY BUG WORKAROUND
    *
@@ -485,6 +452,16 @@ export default class HomeView extends Vue {
   //   return shouldShow;
   // }
 
+  searchBoxes: Array<{
+    name: string;
+    bbox: BoundingBox;
+  }> = [];
+  showShortcutBvc = false;
+  userAgentInfo = new UAParser(); // see https://docs.uaparser.js.org/v2/api/ua-parser-js/get-os.html
+  selectedImage = "";
+  isImageViewerOpen = false;
+  showProjectsDialog = false;
+
   /**
    * Initializes notification helpers
    */
@@ -535,7 +512,6 @@ export default class HomeView extends Vue {
           this.numNewOffersToUser + this.numNewOffersToUserProjects > 0,
       });
 
-      await this.loadNewStarredProjectChanges();
       await this.checkOnboarding();
 
       logger.debug("[HomeView] mounted() - component lifecycle completed", {
@@ -661,14 +637,8 @@ export default class HomeView extends Vue {
       this.lastAckedOfferToUserJwtId = settings.lastAckedOfferToUserJwtId;
       this.lastAckedOfferToUserProjectsJwtId =
         settings.lastAckedOfferToUserProjectsJwtId;
-      this.lastAckedStarredPlanChangesJwtId =
-        settings.lastAckedStarredPlanChangesJwtId;
       this.searchBoxes = settings.searchBoxes || [];
       this.showShortcutBvc = !!settings.showShortcutBvc;
-      this.starredPlanHandleIds = databaseUtil.parseJsonField(
-        settings.starredPlanHandleIds,
-        [],
-      );
       this.isAnyFeedFilterOn = checkIsAnyFeedFilterOn(settings);
 
       // Check onboarding status
@@ -689,9 +659,7 @@ export default class HomeView extends Vue {
 
           if (resp.status === 200) {
             // Ultra-concise settings update with automatic cache invalidation!
-            await this.$saveUserSettings(this.activeDid, {
-              isRegistered: true,
-            });
+            await this.$saveMySettings({ isRegistered: true });
             this.isRegistered = true;
           }
         } catch (error) {
@@ -706,7 +674,7 @@ export default class HomeView extends Vue {
           };
 
           logger.warn(
-            "[HomeView Settings Trace] ⚠️ Registration check failed, expected for unregistered users.",
+            "[HomeView Settings Trace] ⚠️ Registration check failed",
             {
               error: errorMessage,
               did: this.activeDid,
@@ -749,7 +717,7 @@ export default class HomeView extends Vue {
    * Used for displaying contact info in feed and actions
    *
    * @internal
-   * Called by initializeIdentity()
+   * Called by mounted() and initializeIdentity()
    */
   private async loadContacts() {
     this.allContacts = await this.$contacts();
@@ -763,6 +731,7 @@ export default class HomeView extends Vue {
    * Triggers updateAllFeed() to populate activity feed
    *
    * @internal
+   * Called by mounted()
    */
   private async loadFeedData() {
     await this.updateAllFeed();
@@ -776,6 +745,7 @@ export default class HomeView extends Vue {
    * - Rate limit status for both
    *
    * @internal
+   * Called by mounted() and initializeIdentity()
    * @requires Active DID
    */
   private async loadNewOffers() {
@@ -879,48 +849,6 @@ export default class HomeView extends Vue {
     }
   }
 
-  /**
-   * Loads new changes for starred projects
-   * Updates:
-   * - Number of new starred project changes
-   * - Rate limit status for starred project changes
-   *
-   * @internal
-   * @requires Active DID
-   */
-  private async loadNewStarredProjectChanges() {
-    if (this.activeDid && this.starredPlanHandleIds.length > 0) {
-      try {
-        const starredProjectChanges = await getStarredProjectsWithChanges(
-          this.axios,
-          this.apiServer,
-          this.activeDid,
-          this.starredPlanHandleIds,
-          this.lastAckedStarredPlanChangesJwtId,
-        );
-        // filter out any data elements where there is no wrappedClaimBefore
-        const filteredNewStarredProjectChanges =
-          starredProjectChanges.data.filter(
-            (change) => change.wrappedClaimBefore !== undefined,
-          );
-        this.numNewStarredProjectChanges =
-          filteredNewStarredProjectChanges.length;
-        this.newStarredProjectChangesHitLimit = starredProjectChanges.hitLimit;
-      } catch (error) {
-        // Don't show errors for starred project changes as it's a secondary feature
-        logger.warn(
-          "[HomeView] Failed to load starred project changes:",
-          error,
-        );
-        this.numNewStarredProjectChanges = 0;
-        this.newStarredProjectChangesHitLimit = false;
-      }
-    } else {
-      this.numNewStarredProjectChanges = 0;
-      this.newStarredProjectChangesHitLimit = false;
-    }
-  }
-
   /**
    * Checks if user needs onboarding using ultra-concise mixin utilities
    * Opens onboarding dialog if not completed
@@ -1271,7 +1199,6 @@ export default class HomeView extends Vue {
       provider,
       fulfillsPlan,
       providedByPlan,
-      record.emojiCount,
     );
   }
 
@@ -1495,14 +1422,12 @@ export default class HomeView extends Vue {
     provider: Provider | undefined,
     fulfillsPlan?: FulfillsPlan,
     providedByPlan?: ProvidedByPlan,
-    emojiCount?: Record<string, number>,
   ): GiveRecordWithContactInfo {
     return {
       ...record,
       jwtId: record.jwtId,
       fullClaim: record.fullClaim,
       description: record.description || "",
-      emojiCount: emojiCount || {},
       handleId: record.handleId,
       issuerDid: record.issuerDid,
       fulfillsPlanHandleId: record.fulfillsPlanHandleId,

src/views/IdentitySwitcherView.vue

@@ -1,27 +1,18 @@
 <template>
   <QuickNav selected="Profile"></QuickNav>
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Breadcrumb -->
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 class="text-lg text-center font-light relative px-7">
+        <!-- Cancel -->
+        <router-link
+          :to="{ name: 'account' }"
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          ><font-awesome icon="chevron-left" class="fa-fw"></font-awesome>
+        </router-link>
+
         Switch Identity
       </h1>
-
-      <!-- Back -->
-      <router-link
-        class="order-first text-lg text-center leading-none p-1"
-        :to="{ name: 'account' }"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </router-link>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
     <!-- Identity List -->
@@ -315,9 +306,6 @@ export default class IdentitySwitcherView extends Vue {
       }
 
       await this.$exec("DELETE FROM accounts WHERE id = ?", [id]);
-      await this.$exec("DELETE FROM settings WHERE accountDid = ?", [
-        accountDid,
-      ]);
     });
 
     // Update UI

src/views/ImportAccountView.vue

@@ -1,26 +1,17 @@
 <template>
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Breadcrumb -->
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 class="text-lg text-center font-light relative px-7">
+        <!-- Cancel -->
+        <button
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="$router.go(-1)"
+        >
+          <font-awesome icon="chevron-left"></font-awesome>
+        </button>
         Import Existing Identifier
       </h1>
-
-      <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="$router.go(-1)"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
     <!-- Import Account Form -->
     <p class="text-center text-xl mb-4 font-light">

src/views/ImportDerivedAccountView.vue

@@ -1,29 +1,20 @@
 <template>
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
+    <!-- Breadcrumb -->
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 class="text-lg text-center font-light relative px-7">
+        <!-- Cancel -->
+        <button
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="$router.go(-1)"
+        >
+          <font-awesome icon="chevron-left"></font-awesome>
+        </button>
         Derive from Existing Identity
       </h1>
-
-      <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="$router.go(-1)"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
-
     <!-- Import Account Form -->
+
     <div>
       <p class="text-center text-xl mb-4 font-light">
         Will increment the maximum known derivation path from the existing seed.

src/views/InviteOneView.vue

@@ -1,32 +1,21 @@
 <template>
-  <QuickNav selected="Contacts" />
+  <QuickNav selected="Invite" />
+  <TopMessage />
 
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <TopMessage />
-
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">
-        Invitations
+    <!-- Back -->
+    <div class="text-lg text-center font-light relative px-7">
+      <h1
+        class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+        @click="$router.back()"
+      >
+        <font-awesome icon="chevron-left" class="fa-fw"></font-awesome>
       </h1>
-
-      <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="$router.go(-1)"
-      >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
     </div>
 
+    <!-- Heading -->
+    <h1 class="text-4xl text-center font-light">Invitations</h1>
+
     <ul class="ml-8 mt-4 list-outside list-disc w-5/6">
       <li>
         Note when sending

src/views/LogView.vue

@@ -1,32 +1,23 @@
 <!-- This is useful in an environment where the download doesn't work. -->
 <template>
   <QuickNav selected="" />
+  <TopMessage />
 
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <TopMessage />
-
-    <!-- Sub View Heading -->
-    <div id="SubViewHeading" class="flex gap-4 items-start mb-8">
-      <h1 class="grow text-xl text-center font-semibold leading-tight">Logs</h1>
-
-      <!-- Back -->
-      <a
-        class="order-first text-lg text-center leading-none p-1"
-        @click="$router.go(-1)"
+    <!-- Back Button -->
+    <div class="relative px-7">
+      <h1
+        class="text-lg text-center font-light px-2 py-1 absolute -left-2 -top-1"
+        @click="$router.back()"
       >
-        <font-awesome icon="chevron-left" class="block text-center w-[1em]" />
-      </a>
-
-      <!-- Help button -->
-      <router-link
-        :to="{ name: 'help' }"
-        class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
-      >
-        <font-awesome icon="question" class="block text-center w-[1em]" />
-      </router-link>
+        <font-awesome icon="chevron-left" class="mr-2" />
+      </h1>
     </div>
 
+    <!-- Heading -->
+    <h1 id="ViewHeading" class="text-4xl text-center font-light mb-6">Logs</h1>
+
     <!-- Error Message -->
     <div
       v-if="error"