some fixes to the gifted-dialog logic

- Truncate very long texts (such as dids)
- Stacked layout in mobile, row layout in wider screens
- Minor design adjustments

.gitignore

@@ -55,3 +55,4 @@ build_logs/
 icons
 
 
+android/app/src/main/res/

BUILDING.md

@@ -41,6 +41,7 @@ Install dependencies:
 1. Run the production build:
 
    ```bash
+   rm -rf dist
    npm run build:web
    ```
 
@@ -62,16 +63,18 @@ Install dependencies:
 
 * Update the ClickUp tasks & CHANGELOG.md & the version in package.json, run `npm install`.
 
+* Run a build to make sure package-lock version is updated, linting works, etc: `npm install && npm run build`
+
 * Commit everything (since the commit hash is used the app).
 
-* Put the commit hash in the changelog (which will help you remember to bump the version later).
+* Put the commit hash in the changelog (which will help you remember to bump the version in the step later).
 
-* Tag with the new version, [online](https://gitea.anomalistdesign.com/trent_larson/crowd-funder-for-time-pwa/releases) or `git tag 0.3.55 && git push origin 0.3.55`.
+* Tag with the new version, [online](https://gitea.anomalistdesign.com/trent_larson/crowd-funder-for-time-pwa/releases) or `git tag 1.0.2 && git push origin 1.0.2`.
 
 * For test, build the app (because test server is not yet set up to build):
 
 ```bash
-TIME_SAFARI_APP_TITLE="TimeSafari_Test" VITE_APP_SERVER=https://test.timesafari.app VITE_BVC_MEETUPS_PROJECT_CLAIM_ID=https://endorser.ch/entity/01HWE8FWHQ1YGP7GFZYYPS272F VITE_DEFAULT_ENDORSER_API_SERVER=https://test-api.endorser.ch VITE_DEFAULT_IMAGE_API_SERVER=https://test-image-api.timesafari.app VITE_DEFAULT_PARTNER_API_SERVER=https://test-partner-api.endorser.ch VITE_DEFAULT_PUSH_SERVER=https://test.timesafari.app VITE_PASSKEYS_ENABLED=true npm run build
+TIME_SAFARI_APP_TITLE="TimeSafari_Test" VITE_APP_SERVER=https://test.timesafari.app VITE_BVC_MEETUPS_PROJECT_CLAIM_ID=https://endorser.ch/entity/01HWE8FWHQ1YGP7GFZYYPS272F VITE_DEFAULT_ENDORSER_API_SERVER=https://test-api.endorser.ch VITE_DEFAULT_IMAGE_API_SERVER=https://test-image-api.timesafari.app VITE_DEFAULT_PARTNER_API_SERVER=https://test-partner-api.endorser.ch VITE_DEFAULT_PUSH_SERVER=https://test.timesafari.app VITE_PASSKEYS_ENABLED=true npm run build:web
 ```
 
    ... and transfer to the test server:
@@ -90,13 +93,13 @@ TIME_SAFARI_APP_TITLE="TimeSafari_Test" VITE_APP_SERVER=https://test.timesafari.
 
   * `pkgx +npm sh`
 
-  * `cd crowd-funder-for-time-pwa && git checkout master && git pull && git checkout 0.3.55 && npm install && npm run build && cd -`
+  * `cd crowd-funder-for-time-pwa && git checkout master && git pull && git checkout 1.0.2 && npm install && npm run build:web && cd -`
 
-  (The plain `npm run build` uses the .env.production file.)
+  (The plain `npm run build:web` uses the .env.production file.)
 
-* Back up the time-safari/dist folder & deploy: `mv time-safari/dist time-safari-dist-prev.0 && mv crowd-funder-for-time-pwa/dist time-safari/`
+* Back up the time-safari/dist folder & deploy: `mv time-safari/dist time-safari-dist-prev-2 && mv crowd-funder-for-time-pwa/dist time-safari/`
 
-* Record the new hash in the changelog. Edit package.json to increment version & add "-beta", `npm install`, and commit. Also record what version is on production.
+* Record the new hash in the changelog. Edit package.json to increment version & add "-beta", `npm install`, commit, and push. Also record what version is on production.
 
 ## Docker Deployment
 
@@ -321,11 +324,11 @@ Prerequisites: macOS with Xcode installed
 
 #### Each Release
 
-0. First time (or if XCode dependencies change):
+0. First time (or if dependencies change):
 
   - `pkgx +rubygems.org sh`
 
-  - ... and you may have to fix these, especially with pkgx
+  - ... and you may have to fix these, especially with pkgx:
 
    ```bash
    gem_path=$(which gem)
@@ -334,23 +337,12 @@ Prerequisites: macOS with Xcode installed
    export GEM_PATH=$shortened_path
    ```
 
-   ```bash
-   cd ios/App
-   pod install
-   ```
-
-1. Build the web assets:
+1. Build the web assets & update ios:
 
    ```bash
    rm -rf dist
    npm run build:web
    npm run build:capacitor
-   ```
-
-
-2. Update iOS project with latest build:
-
-   ```bash
    npx cap sync ios
    ```
 
@@ -367,16 +359,12 @@ Prerequisites: macOS with Xcode installed
    npx capacitor-assets generate --ios
    ```
 
-4. Bump the version to match Android:
+4. Bump the version to match Android & package.json:
 
    ```
-   cd ios/App
-   xcrun agvtool new-version 25
+   cd ios/App && xcrun agvtool new-version 35 && perl -p -i -e "s/MARKETING_VERSION = .*;/MARKETING_VERSION = 1.0.2;/g" App.xcodeproj/project.pbxproj && cd -
    # Unfortunately this edits Info.plist directly.
    #xcrun agvtool new-marketing-version 0.4.5
-   cat App.xcodeproj/project.pbxproj | sed "s/MARKETING_VERSION = .*;/MARKETING_VERSION = 0.5.0;/g" > temp
-   mv temp App.xcodeproj/project.pbxproj
-   cd -
    ```
 
 5. Open the project in Xcode:
@@ -427,7 +415,7 @@ Prerequisites: Android Studio with Java SDK installed
    npx capacitor-assets generate --android
    ```
 
-4. Bump version to match iOS: android/app/build.gradle
+4. Bump version to match iOS & package.json: android/app/build.gradle
 
 5. Open the project in Android Studio:
 
@@ -444,7 +432,6 @@ Prerequisites: Android Studio with Java SDK installed
    ./gradlew clean
    ./gradlew build -Dlint.baselines.continue=true
    cd -
-   npx cap run android
    ```
 
 ... or, to create the `aab` file, `bundle` instead of `build`:
@@ -478,7 +465,7 @@ 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.
 
 
-## First-time Android Configuration for deep links
+## Android Configuration for deep links
 
 You must add the following intent filter to the `android/app/src/main/AndroidManifest.xml` file:
 
@@ -489,4 +476,6 @@ You must add the following intent filter to the `android/app/src/main/AndroidMan
                   <category android:name="android.intent.category.BROWSABLE" />
                   <data android:scheme="timesafari" />
                </intent-filter>
-   ```
+   ```
+
+... though when we tried that most recently it failed to 'build' the APK with: http(s) scheme and host attribute are missing, but are required for Android App Links [AppLinkUrlError]

CHANGELOG.md

@@ -6,6 +6,28 @@ 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.0.2] - 2025.06.20 - 276e0a741bc327de3380c4e508cccb7fee58c06d
+### Added
+- Version on feed title
+
+
+## [1.0.1] - 2025.06.20
+### Added
+- Allow a user to block someone else's content from view
+
+
+## [1.0.0] - 2025.06.20 - 5aa693de6337e5dbb278bfddc6bd39094bc14f73
+### Added
+- Web-oriented migration from IndexedDB to SQLite
+
+
+## [0.5.8]
+### Added
+- /deep-link/ path for URLs that are shared with people
+### Changed
+- External links now go to /deep-link/...
+- Feed visuals now have arrow imagery from giver to receiver
+
 
 ## [0.4.7]
 ### Fixed

README.md

@@ -3,6 +3,32 @@
 [Time Safari](https://timesafari.org/) allows people to ease into collaboration: start with expressions of gratitude
 and expand to crowd-fund with time & money, then record and see the impact of contributions.
 
+## Database Migration Status
+
+**Current Status**: The application is undergoing a migration from Dexie (IndexedDB) to SQLite using absurd-sql. This migration is in **Phase 2** with a well-defined migration fence in place.
+
+### Migration Progress
+- ✅ **SQLite Database Service**: Fully implemented with absurd-sql
+- ✅ **Platform Service Layer**: Unified database interface across platforms
+- ✅ **Settings Migration**: Core user settings transferred
+- ✅ **Account Migration**: Identity and key management
+- 🔄 **Contact Migration**: User contact data (via import interface)
+- 📋 **Code Cleanup**: Remove unused Dexie imports
+
+### Migration Fence
+The migration is controlled by a **migration fence** that separates legacy Dexie code from the new SQLite implementation. See [Migration Fence Definition](doc/migration-fence-definition.md) for complete details.
+
+**Key Points**:
+- Legacy Dexie database is disabled by default (`USE_DEXIE_DB = false`)
+- All database operations go through `PlatformService`
+- Migration tools provide controlled access to both databases
+- Clear separation between legacy and new code
+
+### Migration Documentation
+- [Migration Guide](doc/migration-to-wa-sqlite.md) - Complete migration process
+- [Migration Fence Definition](doc/migration-fence-definition.md) - Fence boundaries and rules
+- [Database Migration Guide](doc/database-migration-guide.md) - User-facing migration tools
+
 ## Roadmap
 
 See [project.task.yaml](project.task.yaml) for current priorities.
@@ -21,16 +47,10 @@ npm run dev
 
 See [BUILDING.md](BUILDING.md) for more details.
 
-
-
-
 ## Tests
 
 See [TESTING.md](test-playwright/TESTING.md) for detailed test instructions.
 
-
-
-
 ## Icons
 
 Application icons are in the `assets` directory, processed by the `capacitor-assets` command.
@@ -66,6 +86,21 @@ Key principles:
 - Common interfaces are shared through `common.ts`
 - Type definitions are generated from Zod schemas where possible
 
+### Database Architecture
+
+The application uses a platform-agnostic database layer:
+
+* `src/services/PlatformService.ts` - Database interface definition
+* `src/services/PlatformServiceFactory.ts` - Platform-specific service factory
+* `src/services/AbsurdSqlDatabaseService.ts` - SQLite implementation
+* `src/db/` - Legacy Dexie database (migration in progress)
+
+**Development Guidelines**:
+- Always use `PlatformService` for database operations
+- Never import Dexie directly in application code
+- Test with `USE_DEXIE_DB = false` for new features
+- Use migration tools for data transfer between systems
+
 ### Kudos
 
 Gifts make the world go 'round!

android/app/build.gradle

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

doc/DEEP_LINKS.md

@@ -100,6 +100,7 @@ try {
 - `src/interfaces/deepLinks.ts`: Type definitions and validation schemas
 - `src/services/deepLinks.ts`: Deep link processing service
 - `src/main.capacitor.ts`: Capacitor integration
+- `src/views/DeepLinkRedirectView.vue`: Page to handle links to both mobile and web
 
 ## Type Safety Examples
 

doc/database-migration-guide.md

@@ -0,0 +1,295 @@
+# Database Migration Guide
+
+## Overview
+
+The Database Migration feature allows you to compare and migrate data between Dexie (IndexedDB) and SQLite databases in the TimeSafari application. This is particularly useful during the transition from the old Dexie-based storage system to the new SQLite-based system.
+
+## Features
+
+### 1. Database Comparison
+
+- Compare data between Dexie and SQLite databases
+- View detailed differences in contacts and settings
+- Identify added, modified, and missing records
+- Export comparison results for analysis
+
+### 2. Data Migration
+
+- Migrate contacts from Dexie to SQLite
+- Migrate settings from Dexie to SQLite
+- Option to overwrite existing records or skip them
+- Comprehensive error handling and reporting
+
+### 3. User Interface
+
+- Modern, responsive UI built with Tailwind CSS
+- Real-time loading states and progress indicators
+- Clear success and error messaging
+- Export functionality for comparison data
+
+## Prerequisites
+
+### Enable Dexie Database
+
+Before using the migration features, you must enable the Dexie database by setting:
+
+```typescript
+// In constants/app.ts
+export const USE_DEXIE_DB = true;
+```
+
+**Note**: This should only be enabled temporarily during migration. Remember to set it back to `false` after migration is complete.
+
+## Accessing the Migration Interface
+
+1. Navigate to the **Account** page in the TimeSafari app
+2. Scroll down to find the **Database Migration** link
+3. Click the link to open the migration interface
+
+## Using the Migration Interface
+
+### Step 1: Compare Databases
+
+1. Click the **"Compare Databases"** button
+2. The system will retrieve data from both Dexie and SQLite databases
+3. Review the comparison results showing:
+   - Summary counts for each database
+   - Detailed differences (added, modified, missing records)
+   - Specific records that need attention
+
+### Step 2: Review Differences
+
+The comparison results are displayed in several sections:
+
+#### Summary Cards
+
+- **Dexie Contacts**: Number of contacts in Dexie database
+- **SQLite Contacts**: Number of contacts in SQLite database
+- **Dexie Settings**: Number of settings in Dexie database
+- **SQLite Settings**: Number of settings in SQLite database
+
+#### Contact Differences
+
+- **Added**: Contacts in Dexie but not in SQLite
+- **Modified**: Contacts that differ between databases
+- **Missing**: Contacts in SQLite but not in Dexie
+
+#### Settings Differences
+
+- **Added**: Settings in Dexie but not in SQLite
+- **Modified**: Settings that differ between databases
+- **Missing**: Settings in SQLite but not in Dexie
+
+### Step 3: Configure Migration Options
+
+Before migrating data, configure the migration options:
+
+- **Overwrite existing records**: When enabled, existing records in SQLite will be updated with data from Dexie. When disabled, existing records will be skipped.
+
+### Step 4: Migrate Data
+
+#### Migrate Contacts
+
+1. Click the **"Migrate Contacts"** button
+2. The system will transfer contacts from Dexie to SQLite
+3. Review the migration results showing:
+   - Number of contacts successfully migrated
+   - Any warnings or errors encountered
+
+#### Migrate Settings
+
+1. Click the **"Migrate Settings"** button
+2. The system will transfer settings from Dexie to SQLite
+3. Review the migration results showing:
+   - Number of settings successfully migrated
+   - Any warnings or errors encountered
+
+### Step 5: Export Comparison (Optional)
+
+1. Click the **"Export Comparison"** button
+2. A JSON file will be downloaded containing the complete comparison data
+3. This file can be used for analysis or backup purposes
+
+## Migration Process Details
+
+### Contact Migration
+
+The contact migration process:
+
+1. **Retrieves** all contacts from Dexie database
+2. **Checks** for existing contacts in SQLite by DID
+3. **Inserts** new contacts or **updates** existing ones (if overwrite is enabled)
+4. **Handles** complex fields like `contactMethods` (JSON arrays)
+5. **Reports** success/failure for each contact
+
+### Settings Migration
+
+The settings migration process:
+
+1. **Retrieves** all settings from Dexie database
+2. **Focuses** on key user-facing settings:
+   - `firstName`
+   - `isRegistered`
+   - `profileImageUrl`
+   - `showShortcutBvc`
+   - `searchBoxes`
+3. **Preserves** other settings in SQLite
+4. **Reports** success/failure for each setting
+
+## Error Handling
+
+### Common Issues
+
+#### Dexie Database Not Enabled
+
+**Error**: "Dexie database is not enabled"
+**Solution**: Set `USE_DEXIE_DB = true` in `constants/app.ts`
+
+#### Database Connection Issues
+
+**Error**: "Failed to retrieve Dexie contacts"
+**Solution**: Check that the Dexie database is properly initialized and accessible
+
+#### SQLite Query Errors
+
+**Error**: "Failed to retrieve SQLite contacts"
+**Solution**: Verify that the SQLite database is properly set up and the platform service is working
+
+#### Migration Failures
+
+**Error**: "Migration failed: [specific error]"
+**Solution**: Review the error details and check data integrity in both databases
+
+### Error Recovery
+
+1. **Review** the error messages carefully
+2. **Check** the browser console for additional details
+3. **Verify** database connectivity and permissions
+4. **Retry** the operation if appropriate
+5. **Export** comparison data for manual review if needed
+
+## Best Practices
+
+### Before Migration
+
+1. **Backup** your data if possible
+2. **Test** the migration on a small dataset first
+3. **Verify** that both databases are accessible
+4. **Review** the comparison results before migrating
+
+### During Migration
+
+1. **Don't** interrupt the migration process
+2. **Monitor** the progress and error messages
+3. **Note** any warnings or skipped records
+4. **Export** comparison data for reference
+
+### After Migration
+
+1. **Verify** that data was migrated correctly
+2. **Test** the application functionality
+3. **Disable** Dexie database (`USE_DEXIE_DB = false`)
+4. **Clean up** any temporary files or exports
+
+## Technical Details
+
+### Database Schema
+
+The migration handles the following data structures:
+
+#### Contacts Table
+
+```typescript
+interface Contact {
+  did: string;                    // Decentralized Identifier
+  name: string;                   // Contact name
+  contactMethods: ContactMethod[]; // Array of contact methods
+  nextPubKeyHashB64: string;      // Next public key hash
+  notes: string;                  // Contact notes
+  profileImageUrl: string;        // Profile image URL
+  publicKeyBase64: string;        // Public key in base64
+  seesMe: boolean;                // Visibility flag
+  registered: boolean;            // Registration status
+}
+```
+
+#### Settings Table
+
+```typescript
+interface Settings {
+  id: number;                     // Settings ID
+  accountDid: string;             // Account DID
+  activeDid: string;              // Active DID
+  firstName: string;              // User's first name
+  isRegistered: boolean;          // Registration status
+  profileImageUrl: string;        // Profile image URL
+  showShortcutBvc: boolean;       // UI preference
+  searchBoxes: any[];             // Search configuration
+  // ... other fields
+}
+```
+
+### Migration Logic
+
+The migration service uses sophisticated comparison logic:
+
+1. **Primary Key Matching**: Uses DID for contacts, ID for settings
+2. **Deep Comparison**: Compares all fields including complex objects
+3. **JSON Handling**: Properly handles JSON fields like `contactMethods` and `searchBoxes`
+4. **Conflict Resolution**: Provides options for handling existing records
+
+### Performance Considerations
+
+- **Batch Processing**: Processes records one by one for reliability
+- **Error Isolation**: Individual record failures don't stop the entire migration
+- **Memory Management**: Handles large datasets efficiently
+- **Progress Reporting**: Provides real-time feedback during migration
+
+## Troubleshooting
+
+### Migration Stuck
+
+If the migration appears to be stuck:
+
+1. **Check** the browser console for errors
+2. **Refresh** the page and try again
+3. **Verify** database connectivity
+4. **Check** for large datasets that might take time
+
+### Incomplete Migration
+
+If migration doesn't complete:
+
+1. **Review** error messages
+2. **Check** data integrity in both databases
+3. **Export** comparison data for manual review
+4. **Consider** migrating in smaller batches
+
+### Data Inconsistencies
+
+If you notice data inconsistencies:
+
+1. **Export** comparison data
+2. **Review** the differences carefully
+3. **Manually** verify critical records
+4. **Consider** selective migration of specific records
+
+## Support
+
+For issues with the Database Migration feature:
+
+1. **Check** this documentation first
+2. **Review** the browser console for error details
+3. **Export** comparison data for analysis
+4. **Contact** the development team with specific error details
+
+## Security Considerations
+
+- **Data Privacy**: Migration data is processed locally and not sent to external servers
+- **Access Control**: Only users with access to the account can perform migration
+- **Data Integrity**: Migration preserves data integrity and handles conflicts gracefully
+- **Audit Trail**: Export functionality provides an audit trail of migration operations
+
+---
+
+**Note**: This migration tool is designed for the transition period between database systems. Once migration is complete and verified, the Dexie database should be disabled to avoid confusion and potential data conflicts.

doc/dexie-to-sqlite-mapping.md

@@ -3,6 +3,7 @@
 ## Schema Mapping
 
 ### Current Dexie Schema
+
 ```typescript
 // Current Dexie schema
 const db = new Dexie('TimeSafariDB');
@@ -15,6 +16,7 @@ db.version(1).stores({
 ```
 
 ### New SQLite Schema
+
 ```sql
 -- New SQLite schema
 CREATE TABLE accounts (
@@ -50,6 +52,7 @@ CREATE INDEX idx_settings_updated_at ON settings(updated_at);
 ### 1. Account Operations
 
 #### Get Account by DID
+
 ```typescript
 // Dexie
 const account = await db.accounts.get(did);
@@ -62,6 +65,7 @@ const account = result[0]?.values[0];
 ```
 
 #### Get All Accounts
+
 ```typescript
 // Dexie
 const accounts = await db.accounts.toArray();
@@ -74,6 +78,7 @@ const accounts = result[0]?.values || [];
 ```
 
 #### Add Account
+
 ```typescript
 // Dexie
 await db.accounts.add({
@@ -91,6 +96,7 @@ await db.run(`
 ```
 
 #### Update Account
+
 ```typescript
 // Dexie
 await db.accounts.update(did, {
@@ -100,7 +106,7 @@ await db.accounts.update(did, {
 
 // absurd-sql
 await db.run(`
-  UPDATE accounts 
+  UPDATE accounts
   SET public_key_hex = ?, updated_at = ?
   WHERE did = ?
 `, [publicKeyHex, Date.now(), did]);
@@ -109,6 +115,7 @@ await db.run(`
 ### 2. Settings Operations
 
 #### Get Setting
+
 ```typescript
 // Dexie
 const setting = await db.settings.get(key);
@@ -121,6 +128,7 @@ const setting = result[0]?.values[0];
 ```
 
 #### Set Setting
+
 ```typescript
 // Dexie
 await db.settings.put({
@@ -142,6 +150,7 @@ await db.run(`
 ### 3. Contact Operations
 
 #### Get Contacts by Account
+
 ```typescript
 // Dexie
 const contacts = await db.contacts
@@ -151,7 +160,7 @@ const contacts = await db.contacts
 
 // absurd-sql
 const result = await db.exec(`
-  SELECT * FROM contacts 
+  SELECT * FROM contacts
   WHERE did = ?
   ORDER BY created_at DESC
 `, [accountDid]);
@@ -159,6 +168,7 @@ const contacts = result[0]?.values || [];
 ```
 
 #### Add Contact
+
 ```typescript
 // Dexie
 await db.contacts.add({
@@ -179,6 +189,7 @@ await db.run(`
 ## Transaction Mapping
 
 ### Batch Operations
+
 ```typescript
 // Dexie
 await db.transaction('rw', [db.accounts, db.contacts], async () => {
@@ -210,10 +221,11 @@ try {
 ## Migration Helper Functions
 
 ### 1. Data Export (Dexie to JSON)
+
 ```typescript
 async function exportDexieData(): Promise<MigrationData> {
   const db = new Dexie('TimeSafariDB');
-  
+
   return {
     accounts: await db.accounts.toArray(),
     settings: await db.settings.toArray(),
@@ -228,6 +240,7 @@ async function exportDexieData(): Promise<MigrationData> {
 ```
 
 ### 2. Data Import (JSON to absurd-sql)
+
 ```typescript
 async function importToAbsurdSql(data: MigrationData): Promise<void> {
   await db.exec('BEGIN TRANSACTION;');
@@ -239,7 +252,7 @@ async function importToAbsurdSql(data: MigrationData): Promise<void> {
         VALUES (?, ?, ?, ?)
       `, [account.did, account.publicKeyHex, account.createdAt, account.updatedAt]);
     }
-    
+
     // Import settings
     for (const setting of data.settings) {
       await db.run(`
@@ -247,7 +260,7 @@ async function importToAbsurdSql(data: MigrationData): Promise<void> {
         VALUES (?, ?, ?)
       `, [setting.key, setting.value, setting.updatedAt]);
     }
-    
+
     // Import contacts
     for (const contact of data.contacts) {
       await db.run(`
@@ -264,6 +277,7 @@ async function importToAbsurdSql(data: MigrationData): Promise<void> {
 ```
 
 ### 3. Verification
+
 ```typescript
 async function verifyMigration(dexieData: MigrationData): Promise<boolean> {
   // Verify account count
@@ -272,21 +286,21 @@ async function verifyMigration(dexieData: MigrationData): Promise<boolean> {
   if (accountCount !== dexieData.accounts.length) {
     return false;
   }
-  
+
   // Verify settings count
   const settingsResult = await db.exec('SELECT COUNT(*) as count FROM settings');
   const settingsCount = settingsResult[0].values[0][0];
   if (settingsCount !== dexieData.settings.length) {
     return false;
   }
-  
+
   // Verify contacts count
   const contactsResult = await db.exec('SELECT COUNT(*) as count FROM contacts');
   const contactsCount = contactsResult[0].values[0][0];
   if (contactsCount !== dexieData.contacts.length) {
     return false;
   }
-  
+
   // Verify data integrity
   for (const account of dexieData.accounts) {
     const result = await db.exec(
@@ -294,12 +308,12 @@ async function verifyMigration(dexieData: MigrationData): Promise<boolean> {
       [account.did]
     );
     const migratedAccount = result[0]?.values[0];
-    if (!migratedAccount || 
+    if (!migratedAccount ||
         migratedAccount[1] !== account.publicKeyHex) { // public_key_hex is second column
       return false;
     }
   }
-  
+
   return true;
 }
 ```
@@ -307,18 +321,21 @@ async function verifyMigration(dexieData: MigrationData): Promise<boolean> {
 ## Performance Considerations
 
 ### 1. Indexing
+
 - Dexie automatically creates indexes based on the schema
 - absurd-sql requires explicit index creation
 - Added indexes for frequently queried fields
 - Use `PRAGMA journal_mode=MEMORY;` for better performance
 
 ### 2. Batch Operations
+
 - Dexie has built-in bulk operations
 - absurd-sql uses transactions for batch operations
 - Consider chunking large datasets
 - Use prepared statements for repeated queries
 
 ### 3. Query Optimization
+
 - Dexie uses IndexedDB's native indexing
 - absurd-sql requires explicit query optimization
 - Use prepared statements for repeated queries
@@ -327,6 +344,7 @@ async function verifyMigration(dexieData: MigrationData): Promise<boolean> {
 ## Error Handling
 
 ### 1. Common Errors
+
 ```typescript
 // Dexie errors
 try {
@@ -351,6 +369,7 @@ try {
 ```
 
 ### 2. Transaction Recovery
+
 ```typescript
 // Dexie transaction
 try {
@@ -396,4 +415,4 @@ try {
    - Remove Dexie database
    - Clear IndexedDB storage
    - Update application code
-   - Remove old dependencies 
+   - Remove old dependencies

doc/migration-fence-definition.md

@@ -0,0 +1,272 @@
+# Migration Fence Definition: Dexie to SQLite
+
+## Overview
+
+This document defines the **migration fence** - the boundary between the legacy Dexie (IndexedDB) storage system and the new SQLite-based storage system in TimeSafari. The fence ensures controlled migration while maintaining data integrity and application stability.
+
+## Current Migration Status
+
+### ✅ Completed Components
+- **SQLite Database Service**: Fully implemented with absurd-sql
+- **Platform Service Layer**: Unified database interface across platforms
+- **Migration Tools**: Data comparison and transfer utilities
+- **Schema Migration**: Complete table structure migration
+- **Data Export/Import**: Backup and restore functionality
+
+### 🔄 Active Migration Components
+- **Settings Migration**: Core user settings transferred
+- **Account Migration**: Identity and key management
+- **Contact Migration**: User contact data (via import interface)
+
+### ❌ Legacy Components (Fence Boundary)
+- **Dexie Database**: Legacy IndexedDB storage (disabled by default)
+- **Dexie-Specific Code**: Direct database access patterns
+- **Legacy Migration Paths**: Old data transfer methods
+
+## Migration Fence Definition
+
+### 1. Configuration Boundary
+
+```typescript
+// src/constants/app.ts
+export const USE_DEXIE_DB = false; // FENCE: Controls legacy database access
+```
+
+**Fence Rule**: When `USE_DEXIE_DB = false`:
+- All new data operations use SQLite
+- Legacy Dexie database is not initialized
+- Migration tools are the only path to legacy data
+
+**Fence Rule**: When `USE_DEXIE_DB = true`:
+- Legacy database is available for migration
+- Dual-write operations may be enabled
+- Migration tools can access both databases
+
+### 2. Service Layer Boundary
+
+```typescript
+// src/services/PlatformServiceFactory.ts
+export class PlatformServiceFactory {
+  public static getInstance(): PlatformService {
+    // FENCE: All database operations go through platform service
+    // No direct Dexie access outside migration tools
+  }
+}
+```
+
+**Fence Rule**: All database operations must use:
+- `PlatformService.dbQuery()` for read operations
+- `PlatformService.dbExec()` for write operations
+- No direct `db.` or `accountsDBPromise` access in application code
+
+### 3. Data Access Patterns
+
+#### ✅ Allowed (Inside Fence)
+```typescript
+// Use platform service for all database operations
+const platformService = PlatformServiceFactory.getInstance();
+const contacts = await platformService.dbQuery(
+  "SELECT * FROM contacts WHERE did = ?",
+  [accountDid]
+);
+```
+
+#### ❌ Forbidden (Outside Fence)
+```typescript
+// Direct Dexie access (legacy pattern)
+const contacts = await db.contacts.where('did').equals(accountDid).toArray();
+
+// Direct database reference
+const result = await accountsDBPromise;
+```
+
+### 4. Migration Tool Boundary
+
+```typescript
+// src/services/indexedDBMigrationService.ts
+// FENCE: Only migration tools can access both databases
+export async function compareDatabases(): Promise<DataComparison> {
+  // This is the ONLY place where both databases are accessed
+}
+```
+
+**Fence Rule**: Migration tools are the exclusive interface between:
+- Legacy Dexie database
+- New SQLite database
+- Data comparison and transfer operations
+
+## Migration Fence Guidelines
+
+### 1. Code Development Rules
+
+#### New Feature Development
+- **Always** use `PlatformService` for database operations
+- **Never** import or reference Dexie directly
+- **Always** test with `USE_DEXIE_DB = false`
+
+#### Legacy Code Maintenance
+- **Only** modify Dexie code for migration purposes
+- **Always** add migration tests for schema changes
+- **Never** add new Dexie-specific features
+
+### 2. Data Integrity Rules
+
+#### Migration Safety
+- **Always** create backups before migration
+- **Always** verify data integrity after migration
+- **Never** delete legacy data until verified
+
+#### Rollback Strategy
+- **Always** maintain ability to rollback to Dexie
+- **Always** preserve migration logs
+- **Never** assume migration is irreversible
+
+### 3. Testing Requirements
+
+#### Migration Testing
+```typescript
+// Required test pattern for migration
+describe('Database Migration', () => {
+  it('should migrate data without loss', async () => {
+    // 1. Enable Dexie
+    // 2. Create test data
+    // 3. Run migration
+    // 4. Verify data integrity
+    // 5. Disable Dexie
+  });
+});
+```
+
+#### Application Testing
+```typescript
+// Required test pattern for application features
+describe('Feature with Database', () => {
+  it('should work with SQLite only', async () => {
+    // Test with USE_DEXIE_DB = false
+    // Verify all operations use PlatformService
+  });
+});
+```
+
+## Migration Fence Enforcement
+
+### 1. Static Analysis
+
+#### ESLint Rules
+```json
+{
+  "rules": {
+    "no-restricted-imports": [
+      "error",
+      {
+        "patterns": [
+          {
+            "group": ["../db/index"],
+            "message": "Use PlatformService instead of direct Dexie access"
+          }
+        ]
+      }
+    ]
+  }
+}
+```
+
+#### TypeScript Rules
+```json
+{
+  "compilerOptions": {
+    "strict": true,
+    "noImplicitAny": true
+  }
+}
+```
+
+### 2. Runtime Checks
+
+#### Development Mode Validation
+```typescript
+// Development-only fence validation
+if (import.meta.env.DEV && USE_DEXIE_DB) {
+  console.warn('⚠️ Dexie is enabled - migration mode active');
+}
+```
+
+#### Production Safety
+```typescript
+// Production fence enforcement
+if (import.meta.env.PROD && USE_DEXIE_DB) {
+  throw new Error('Dexie cannot be enabled in production');
+}
+```
+
+## Migration Fence Timeline
+
+### Phase 1: Fence Establishment ✅
+- [x] Define migration fence boundaries
+- [x] Implement PlatformService layer
+- [x] Create migration tools
+- [x] Set `USE_DEXIE_DB = false` by default
+
+### Phase 2: Data Migration 🔄
+- [x] Migrate core settings
+- [x] Migrate account data
+- [ ] Complete contact migration
+- [ ] Verify all data integrity
+
+### Phase 3: Code Cleanup 📋
+- [ ] Remove unused Dexie imports
+- [ ] Clean up legacy database code
+- [ ] Update all documentation
+- [ ] Remove migration tools
+
+### Phase 4: Fence Removal 🎯
+- [ ] Remove `USE_DEXIE_DB` constant
+- [ ] Remove Dexie dependencies
+- [ ] Remove migration service
+- [ ] Finalize SQLite-only architecture
+
+## Security Considerations
+
+### 1. Data Protection
+- **Encryption**: Maintain encryption standards across migration
+- **Access Control**: Preserve user privacy during migration
+- **Audit Trail**: Log all migration operations
+
+### 2. Error Handling
+- **Graceful Degradation**: Handle migration failures gracefully
+- **User Communication**: Clear messaging about migration status
+- **Recovery Options**: Provide rollback mechanisms
+
+## Performance Considerations
+
+### 1. Migration Performance
+- **Batch Operations**: Use transactions for bulk data transfer
+- **Progress Indicators**: Show migration progress to users
+- **Background Processing**: Non-blocking migration operations
+
+### 2. Application Performance
+- **Query Optimization**: Optimize SQLite queries for performance
+- **Indexing Strategy**: Maintain proper database indexes
+- **Memory Management**: Efficient memory usage during migration
+
+## Documentation Requirements
+
+### 1. Code Documentation
+- **Migration Fence Comments**: Document fence boundaries in code
+- **API Documentation**: Update all database API documentation
+- **Migration Guides**: Comprehensive migration documentation
+
+### 2. User Documentation
+- **Migration Instructions**: Clear user migration steps
+- **Troubleshooting**: Common migration issues and solutions
+- **Rollback Instructions**: How to revert if needed
+
+## Conclusion
+
+The migration fence provides a controlled boundary between legacy and new database systems, ensuring:
+- **Data Integrity**: No data loss during migration
+- **Application Stability**: Consistent behavior across platforms
+- **Development Clarity**: Clear guidelines for code development
+- **Migration Safety**: Controlled and reversible migration process
+
+This fence will remain in place until all data is successfully migrated and verified, at which point the legacy system can be safely removed. 

doc/migration-security-checklist.md

@@ -0,0 +1,355 @@
+# Database Migration Security Audit Checklist
+
+## Overview
+
+This document provides a comprehensive security audit checklist for the Dexie to SQLite migration in TimeSafari. The checklist ensures that data protection, privacy, and security are maintained throughout the migration process.
+
+## Pre-Migration Security Assessment
+
+### 1. Data Classification and Sensitivity
+
+- [ ] **Data Inventory**
+  - [ ] Identify all sensitive data types (DIDs, private keys, personal information)
+  - [ ] Document data retention requirements
+  - [ ] Map data relationships and dependencies
+  - [ ] Assess data sensitivity levels (public, internal, confidential, restricted)
+
+- [ ] **Encryption Assessment**
+  - [ ] Verify current encryption methods for sensitive data
+  - [ ] Document encryption keys and their management
+  - [ ] Assess encryption strength and compliance
+  - [ ] Plan encryption migration strategy
+
+### 2. Access Control Review
+
+- [ ] **User Access Rights**
+  - [ ] Audit current user permissions and roles
+  - [ ] Document access control mechanisms
+  - [ ] Verify principle of least privilege
+  - [ ] Plan access control migration
+
+- [ ] **System Access**
+  - [ ] Review database access patterns
+  - [ ] Document authentication mechanisms
+  - [ ] Assess session management
+  - [ ] Plan authentication migration
+
+### 3. Compliance Requirements
+
+- [ ] **Regulatory Compliance**
+  - [ ] Identify applicable regulations (GDPR, CCPA, etc.)
+  - [ ] Document data processing requirements
+  - [ ] Assess privacy impact
+  - [ ] Plan compliance verification
+
+- [ ] **Industry Standards**
+  - [ ] Review security standards compliance
+  - [ ] Document security controls
+  - [ ] Assess audit requirements
+  - [ ] Plan standards compliance
+
+## Migration Security Controls
+
+### 1. Data Protection During Migration
+
+- [ ] **Encryption in Transit**
+  - [ ] Verify all data transfers are encrypted
+  - [ ] Use secure communication protocols (TLS 1.3+)
+  - [ ] Implement secure API endpoints
+  - [ ] Monitor encryption status
+
+- [ ] **Encryption at Rest**
+  - [ ] Maintain encryption for stored data
+  - [ ] Verify encryption key management
+  - [ ] Test encryption/decryption processes
+  - [ ] Document encryption procedures
+
+### 2. Access Control During Migration
+
+- [ ] **Authentication**
+  - [ ] Maintain user authentication during migration
+  - [ ] Verify session management
+  - [ ] Implement secure token handling
+  - [ ] Monitor authentication events
+
+- [ ] **Authorization**
+  - [ ] Preserve user permissions during migration
+  - [ ] Verify role-based access control
+  - [ ] Implement audit logging
+  - [ ] Monitor access patterns
+
+### 3. Data Integrity
+
+- [ ] **Data Validation**
+  - [ ] Implement input validation for all data
+  - [ ] Verify data format consistency
+  - [ ] Test data transformation processes
+  - [ ] Document validation rules
+
+- [ ] **Data Verification**
+  - [ ] Implement checksums for data integrity
+  - [ ] Verify data completeness after migration
+  - [ ] Test data consistency checks
+  - [ ] Document verification procedures
+
+## Migration Process Security
+
+### 1. Backup Security
+
+- [ ] **Backup Creation**
+  - [ ] Create encrypted backups before migration
+  - [ ] Verify backup integrity
+  - [ ] Store backups securely
+  - [ ] Test backup restoration
+
+- [ ] **Backup Access**
+  - [ ] Limit backup access to authorized personnel
+  - [ ] Implement backup access logging
+  - [ ] Verify backup encryption
+  - [ ] Document backup procedures
+
+### 2. Migration Tool Security
+
+- [ ] **Tool Authentication**
+  - [ ] Implement secure authentication for migration tools
+  - [ ] Verify tool access controls
+  - [ ] Monitor tool usage
+  - [ ] Document tool security
+
+- [ ] **Tool Validation**
+  - [ ] Verify migration tool integrity
+  - [ ] Test tool security features
+  - [ ] Validate tool outputs
+  - [ ] Document tool validation
+
+### 3. Error Handling
+
+- [ ] **Error Security**
+  - [ ] Implement secure error handling
+  - [ ] Avoid information disclosure in errors
+  - [ ] Log security-relevant errors
+  - [ ] Document error procedures
+
+- [ ] **Recovery Security**
+  - [ ] Implement secure recovery procedures
+  - [ ] Verify recovery data protection
+  - [ ] Test recovery processes
+  - [ ] Document recovery security
+
+## Post-Migration Security
+
+### 1. Data Verification
+
+- [ ] **Data Completeness**
+  - [ ] Verify all data was migrated successfully
+  - [ ] Check for data corruption
+  - [ ] Validate data relationships
+  - [ ] Document verification results
+
+- [ ] **Data Accuracy**
+  - [ ] Verify data accuracy after migration
+  - [ ] Test data consistency
+  - [ ] Validate data integrity
+  - [ ] Document accuracy checks
+
+### 2. Access Control Verification
+
+- [ ] **User Access**
+  - [ ] Verify user access rights after migration
+  - [ ] Test authentication mechanisms
+  - [ ] Validate authorization rules
+  - [ ] Document access verification
+
+- [ ] **System Access**
+  - [ ] Verify system access controls
+  - [ ] Test API security
+  - [ ] Validate session management
+  - [ ] Document system security
+
+### 3. Security Testing
+
+- [ ] **Penetration Testing**
+  - [ ] Conduct security penetration testing
+  - [ ] Test for common vulnerabilities
+  - [ ] Verify security controls
+  - [ ] Document test results
+
+- [ ] **Vulnerability Assessment**
+  - [ ] Scan for security vulnerabilities
+  - [ ] Assess security posture
+  - [ ] Identify security gaps
+  - [ ] Document assessment results
+
+## Monitoring and Logging
+
+### 1. Security Monitoring
+
+- [ ] **Access Monitoring**
+  - [ ] Monitor database access patterns
+  - [ ] Track user authentication events
+  - [ ] Monitor system access
+  - [ ] Document monitoring procedures
+
+- [ ] **Data Monitoring**
+  - [ ] Monitor data access patterns
+  - [ ] Track data modification events
+  - [ ] Monitor data integrity
+  - [ ] Document data monitoring
+
+### 2. Security Logging
+
+- [ ] **Audit Logging**
+  - [ ] Implement comprehensive audit logging
+  - [ ] Log all security-relevant events
+  - [ ] Secure log storage and access
+  - [ ] Document logging procedures
+
+- [ ] **Log Analysis**
+  - [ ] Implement log analysis tools
+  - [ ] Monitor for security incidents
+  - [ ] Analyze security trends
+  - [ ] Document analysis procedures
+
+## Incident Response
+
+### 1. Security Incident Planning
+
+- [ ] **Incident Response Plan**
+  - [ ] Develop security incident response plan
+  - [ ] Define incident response procedures
+  - [ ] Train incident response team
+  - [ ] Document response procedures
+
+- [ ] **Incident Detection**
+  - [ ] Implement incident detection mechanisms
+  - [ ] Monitor for security incidents
+  - [ ] Establish incident reporting procedures
+  - [ ] Document detection procedures
+
+### 2. Recovery Procedures
+
+- [ ] **Data Recovery**
+  - [ ] Develop data recovery procedures
+  - [ ] Test recovery processes
+  - [ ] Verify recovery data integrity
+  - [ ] Document recovery procedures
+
+- [ ] **System Recovery**
+  - [ ] Develop system recovery procedures
+  - [ ] Test system recovery
+  - [ ] Verify system security after recovery
+  - [ ] Document recovery procedures
+
+## Compliance Verification
+
+### 1. Regulatory Compliance
+
+- [ ] **Privacy Compliance**
+  - [ ] Verify GDPR compliance
+  - [ ] Check CCPA compliance
+  - [ ] Assess other privacy regulations
+  - [ ] Document compliance status
+
+- [ ] **Security Compliance**
+  - [ ] Verify security standard compliance
+  - [ ] Check industry requirements
+  - [ ] Assess security certifications
+  - [ ] Document compliance status
+
+### 2. Audit Requirements
+
+- [ ] **Audit Trail**
+  - [ ] Maintain comprehensive audit trail
+  - [ ] Verify audit log integrity
+  - [ ] Test audit log accessibility
+  - [ ] Document audit procedures
+
+- [ ] **Audit Reporting**
+  - [ ] Generate audit reports
+  - [ ] Verify report accuracy
+  - [ ] Distribute reports securely
+  - [ ] Document reporting procedures
+
+## Documentation and Training
+
+### 1. Security Documentation
+
+- [ ] **Security Procedures**
+  - [ ] Document security procedures
+  - [ ] Update security policies
+  - [ ] Create security guidelines
+  - [ ] Maintain documentation
+
+- [ ] **Security Training**
+  - [ ] Develop security training materials
+  - [ ] Train staff on security procedures
+  - [ ] Verify training effectiveness
+  - [ ] Document training procedures
+
+### 2. Ongoing Security
+
+- [ ] **Security Maintenance**
+  - [ ] Establish security maintenance procedures
+  - [ ] Schedule security updates
+  - [ ] Monitor security trends
+  - [ ] Document maintenance procedures
+
+- [ ] **Security Review**
+  - [ ] Conduct regular security reviews
+  - [ ] Update security controls
+  - [ ] Assess security effectiveness
+  - [ ] Document review procedures
+
+## Risk Assessment
+
+### 1. Risk Identification
+
+- [ ] **Security Risks**
+  - [ ] Identify potential security risks
+  - [ ] Assess risk likelihood and impact
+  - [ ] Prioritize security risks
+  - [ ] Document risk assessment
+
+- [ ] **Mitigation Strategies**
+  - [ ] Develop risk mitigation strategies
+  - [ ] Implement risk controls
+  - [ ] Monitor risk status
+  - [ ] Document mitigation procedures
+
+### 2. Risk Monitoring
+
+- [ ] **Risk Tracking**
+  - [ ] Track identified risks
+  - [ ] Monitor risk status
+  - [ ] Update risk assessments
+  - [ ] Document risk tracking
+
+- [ ] **Risk Reporting**
+  - [ ] Generate risk reports
+  - [ ] Distribute risk information
+  - [ ] Update risk documentation
+  - [ ] Document reporting procedures
+
+## Conclusion
+
+This security audit checklist ensures that the database migration maintains the highest standards of data protection, privacy, and security. Regular review and updates of this checklist are essential to maintain security throughout the migration process and beyond.
+
+### Security Checklist Summary
+
+- [ ] **Pre-Migration Assessment**: Complete
+- [ ] **Migration Controls**: Complete
+- [ ] **Process Security**: Complete
+- [ ] **Post-Migration Verification**: Complete
+- [ ] **Monitoring and Logging**: Complete
+- [ ] **Incident Response**: Complete
+- [ ] **Compliance Verification**: Complete
+- [ ] **Documentation and Training**: Complete
+- [ ] **Risk Assessment**: Complete
+
+**Overall Security Status**: [ ] Secure [ ] Needs Attention [ ] Critical Issues
+
+**Next Review Date**: _______________
+
+**Reviewed By**: _______________
+
+**Approved By**: _______________ 

doc/migration-to-wa-sqlite.md

@@ -4,610 +4,223 @@
 
 This document outlines the migration process from Dexie.js to absurd-sql for the TimeSafari app's storage implementation. The migration aims to provide a consistent SQLite-based storage solution across all platforms while maintaining data integrity and ensuring a smooth transition for users.
 
+**Current Status**: The migration is in **Phase 2** with a well-defined migration fence in place. Core settings and account data have been migrated, with contact migration in progress. **ActiveDid migration has been implemented** to ensure user identity continuity.
+
 ## Migration Goals
 
 1. **Data Integrity**
    - Preserve all existing data
    - Maintain data relationships
    - Ensure data consistency
+   - **Preserve user's active identity**
 
 2. **Performance**
    - Improve query performance
    - Reduce storage overhead
-   - Optimize for platform-specific features
+   - Optimize for platform-specific capabilities
 
-3. **Security**
-   - Maintain or improve encryption
-   - Preserve access controls
-   - Enhance data protection
+3. **User Experience**
+   - Seamless transition with no data loss
+   - Maintain user's active identity and preferences
+   - Preserve application state
 
-4. **User Experience**
-   - Zero data loss
-   - Minimal downtime
-   - Automatic migration where possible
+## Migration Architecture
 
-## Prerequisites
+### Migration Fence
+The migration fence is defined by the `USE_DEXIE_DB` constant in `src/constants/app.ts`:
+- `USE_DEXIE_DB = false` (default): Uses SQLite database
+- `USE_DEXIE_DB = true`: Uses Dexie database (for migration purposes)
 
-1. **Backup Requirements**
-   ```typescript
-   interface MigrationBackup {
-     timestamp: number;
-     accounts: Account[];
-     settings: Setting[];
-     contacts: Contact[];
-     metadata: {
-       version: string;
-       platform: string;
-       dexieVersion: string;
-     };
-   }
-   ```
+### Migration Order
+The migration follows a specific order to maintain data integrity:
 
-2. **Dependencies**
-   ```json
-   {
-     "@jlongster/sql.js": "^1.8.0",
-     "absurd-sql": "^1.8.0"
-   }
-   ```
+1. **Accounts** (foundational - contains DIDs)
+2. **Settings** (references accountDid, activeDid)
+3. **ActiveDid** (depends on accounts and settings) ⭐ **NEW**
+4. **Contacts** (independent, but migrated after accounts for consistency)
 
-3. **Storage Requirements**
-   - Sufficient IndexedDB quota
-   - Available disk space for SQLite
-   - Backup storage space
+## ActiveDid Migration ⭐ **NEW FEATURE**
 
-4. **Platform Support**
-   - Web: Modern browser with IndexedDB support
-   - iOS: iOS 13+ with SQLite support
-   - Android: Android 5+ with SQLite support
-   - Electron: Latest version with SQLite support
+### Problem Solved
+Previously, the `activeDid` setting was not migrated from Dexie to SQLite, causing users to lose their active identity after migration.
+
+### Solution Implemented
+The migration now includes a dedicated step for migrating the `activeDid`:
+
+1. **Detection**: Identifies the `activeDid` from Dexie master settings
+2. **Validation**: Verifies the `activeDid` exists in SQLite accounts
+3. **Migration**: Updates SQLite master settings with the `activeDid`
+4. **Error Handling**: Graceful handling of missing accounts
+
+### Implementation Details
+
+#### New Function: `migrateActiveDid()`
+```typescript
+export async function migrateActiveDid(): Promise<MigrationResult> {
+  // 1. Get Dexie settings to find the activeDid
+  const dexieSettings = await getDexieSettings();
+  const masterSettings = dexieSettings.find(setting => !setting.accountDid);
+  
+  // 2. Verify the activeDid exists in SQLite accounts
+  const accountExists = await platformService.dbQuery(
+    "SELECT did FROM accounts WHERE did = ?",
+    [dexieActiveDid],
+  );
+  
+  // 3. Update SQLite master settings
+  await updateDefaultSettings({ activeDid: dexieActiveDid });
+}
+```
+
+#### Enhanced `migrateSettings()` Function
+The settings migration now includes activeDid handling:
+- Extracts `activeDid` from Dexie master settings
+- Validates account existence in SQLite
+- Updates SQLite master settings with the `activeDid`
+
+#### Updated `migrateAll()` Function
+The complete migration now includes a dedicated step for activeDid:
+```typescript
+// Step 3: Migrate ActiveDid (depends on accounts and settings)
+logger.info("[MigrationService] Step 3: Migrating activeDid...");
+const activeDidResult = await migrateActiveDid();
+```
+
+### Benefits
+- ✅ **User Identity Preservation**: Users maintain their active identity
+- ✅ **Seamless Experience**: No need to manually select identity after migration
+- ✅ **Data Consistency**: Ensures all identity-related settings are preserved
+- ✅ **Error Resilience**: Graceful handling of edge cases
 
 ## Migration Process
 
-### 1. Preparation
+### Phase 1: Preparation ✅
+- [x] Enable Dexie database access
+- [x] Implement data comparison tools
+- [x] Create migration service structure
 
+### Phase 2: Core Migration ✅
+- [x] Account migration with `importFromMnemonic`
+- [x] Settings migration (excluding activeDid)
+- [x] **ActiveDid migration** ⭐ **COMPLETED**
+- [x] Contact migration framework
+
+### Phase 3: Validation and Cleanup 🔄
+- [ ] Comprehensive data validation
+- [ ] Performance testing
+- [ ] User acceptance testing
+- [ ] Dexie removal
+
+## Usage
+
+### Manual Migration
 ```typescript
-// src/services/storage/migration/MigrationService.ts
-import initSqlJs from '@jlongster/sql.js';
-import { SQLiteFS } from 'absurd-sql';
-import IndexedDBBackend from 'absurd-sql/dist/indexeddb-backend';
+import { migrateAll, migrateActiveDid } from '../services/indexedDBMigrationService';
 
-export class MigrationService {
-  private static instance: MigrationService;
-  private backup: MigrationBackup | null = null;
-  private sql: any = null;
-  private db: any = null;
+// Complete migration
+const result = await migrateAll();
 
-  async prepare(): Promise<void> {
-    try {
-      // 1. Check prerequisites
-      await this.checkPrerequisites();
-      
-      // 2. Create backup
-      this.backup = await this.createBackup();
-      
-      // 3. Verify backup integrity
-      await this.verifyBackup();
-      
-      // 4. Initialize absurd-sql
-      await this.initializeAbsurdSql();
-    } catch (error) {
-      throw new StorageError(
-        'Migration preparation failed',
-        StorageErrorCodes.MIGRATION_FAILED,
-        error
-      );
-    }
-  }
-
-  private async initializeAbsurdSql(): Promise<void> {
-    // Initialize SQL.js
-    this.sql = await initSqlJs({
-      locateFile: (file: string) => {
-        return new URL(`/node_modules/@jlongster/sql.js/dist/${file}`, import.meta.url).href;
-      }
-    });
-
-    // Setup SQLiteFS with IndexedDB backend
-    const sqlFS = new SQLiteFS(this.sql.FS, new IndexedDBBackend());
-    this.sql.register_for_idb(sqlFS);
-
-    // Create and mount filesystem
-    this.sql.FS.mkdir('/sql');
-    this.sql.FS.mount(sqlFS, {}, '/sql');
-
-    // Open database
-    const path = '/sql/db.sqlite';
-    if (typeof SharedArrayBuffer === 'undefined') {
-      let stream = this.sql.FS.open(path, 'a+');
-      await stream.node.contents.readIfFallback();
-      this.sql.FS.close(stream);
-    }
-
-    this.db = new this.sql.Database(path, { filename: true });
-    if (!this.db) {
-      throw new StorageError(
-        'Database initialization failed',
-        StorageErrorCodes.INITIALIZATION_FAILED
-      );
-    }
-
-    // Configure database
-    await this.db.exec(`PRAGMA journal_mode=MEMORY;`);
-  }
-
-  private async checkPrerequisites(): Promise<void> {
-    // Check IndexedDB availability
-    if (!window.indexedDB) {
-      throw new StorageError(
-        'IndexedDB not available',
-        StorageErrorCodes.INITIALIZATION_FAILED
-      );
-    }
-
-    // Check storage quota
-    const quota = await navigator.storage.estimate();
-    if (quota.quota && quota.usage && quota.usage > quota.quota * 0.9) {
-      throw new StorageError(
-        'Insufficient storage space',
-        StorageErrorCodes.STORAGE_FULL
-      );
-    }
-
-    // Check platform support
-    const capabilities = await PlatformDetection.getCapabilities();
-    if (!capabilities.hasFileSystem) {
-      throw new StorageError(
-        'Platform does not support required features',
-        StorageErrorCodes.INITIALIZATION_FAILED
-      );
-    }
-  }
-
-  private async createBackup(): Promise<MigrationBackup> {
-    const dexieDB = new Dexie('TimeSafariDB');
-    
-    return {
-      timestamp: Date.now(),
-      accounts: await dexieDB.accounts.toArray(),
-      settings: await dexieDB.settings.toArray(),
-      contacts: await dexieDB.contacts.toArray(),
-      metadata: {
-        version: '1.0.0',
-        platform: await PlatformDetection.getPlatform(),
-        dexieVersion: Dexie.version
-      }
-    };
-  }
-}
+// Or migrate just the activeDid
+const activeDidResult = await migrateActiveDid();
 ```
 
-### 2. Data Migration
-
+### Migration Verification
 ```typescript
-// src/services/storage/migration/DataMigration.ts
-export class DataMigration {
-  async migrate(backup: MigrationBackup): Promise<void> {
-    try {
-      // 1. Create new database schema
-      await this.createSchema();
-      
-      // 2. Migrate accounts
-      await this.migrateAccounts(backup.accounts);
-      
-      // 3. Migrate settings
-      await this.migrateSettings(backup.settings);
-      
-      // 4. Migrate contacts
-      await this.migrateContacts(backup.contacts);
-      
-      // 5. Verify migration
-      await this.verifyMigration(backup);
-    } catch (error) {
-      // 6. Handle failure
-      await this.handleMigrationFailure(error, backup);
-    }
-  }
+import { compareDatabases } from '../services/indexedDBMigrationService';
 
-  private async migrateAccounts(accounts: Account[]): Promise<void> {
-    // Use transaction for atomicity
-    await this.db.exec('BEGIN TRANSACTION;');
-    try {
-      for (const account of accounts) {
-        await this.db.run(`
-          INSERT INTO accounts (did, public_key_hex, created_at, updated_at)
-          VALUES (?, ?, ?, ?)
-        `, [
-          account.did,
-          account.publicKeyHex,
-          account.createdAt,
-          account.updatedAt
-        ]);
-      }
-      await this.db.exec('COMMIT;');
-    } catch (error) {
-      await this.db.exec('ROLLBACK;');
-      throw error;
-    }
-  }
-
-  private async verifyMigration(backup: MigrationBackup): Promise<void> {
-    // Verify account count
-    const result = await this.db.exec('SELECT COUNT(*) as count FROM accounts');
-    const accountCount = result[0].values[0][0];
-    
-    if (accountCount !== backup.accounts.length) {
-      throw new StorageError(
-        'Account count mismatch',
-        StorageErrorCodes.VERIFICATION_FAILED
-      );
-    }
-
-    // Verify data integrity
-    await this.verifyDataIntegrity(backup);
-  }
-}
+const comparison = await compareDatabases();
+console.log('Migration differences:', comparison.differences);
 ```
 
-### 3. Rollback Strategy
+## Error Handling
 
+### ActiveDid Migration Errors
+- **Missing Account**: If the `activeDid` from Dexie doesn't exist in SQLite accounts
+- **Database Errors**: Connection or query failures
+- **Settings Update Failures**: Issues updating SQLite master settings
+
+### Recovery Strategies
+1. **Automatic Recovery**: Migration continues even if activeDid migration fails
+2. **Manual Recovery**: Users can manually select their identity after migration
+3. **Fallback**: System creates new identity if none exists
+
+## Security Considerations
+
+### Data Protection
+- All sensitive data (mnemonics, private keys) are encrypted
+- Migration preserves encryption standards
+- No plaintext data exposure during migration
+
+### Identity Verification
+- ActiveDid migration validates account existence
+- Prevents setting non-existent identities as active
+- Maintains cryptographic integrity
+
+## Testing
+
+### Migration Testing
+```bash
+# Enable Dexie for testing
+# Set USE_DEXIE_DB = true in constants/app.ts
+
+# Run migration
+npm run migrate
+
+# Verify results
+npm run test:migration
+```
+
+### ActiveDid Testing
 ```typescript
-// src/services/storage/migration/RollbackService.ts
-export class RollbackService {
-  async rollback(backup: MigrationBackup): Promise<void> {
-    try {
-      // 1. Stop all database operations
-      await this.stopDatabaseOperations();
-      
-      // 2. Restore from backup
-      await this.restoreFromBackup(backup);
-      
-      // 3. Verify restoration
-      await this.verifyRestoration(backup);
-      
-      // 4. Clean up absurd-sql
-      await this.cleanupAbsurdSql();
-    } catch (error) {
-      throw new StorageError(
-        'Rollback failed',
-        StorageErrorCodes.ROLLBACK_FAILED,
-        error
-      );
-    }
-  }
-
-  private async restoreFromBackup(backup: MigrationBackup): Promise<void> {
-    const dexieDB = new Dexie('TimeSafariDB');
-    
-    // Restore accounts
-    await dexieDB.accounts.bulkPut(backup.accounts);
-    
-    // Restore settings
-    await dexieDB.settings.bulkPut(backup.settings);
-    
-    // Restore contacts
-    await dexieDB.contacts.bulkPut(backup.contacts);
-  }
-}
+// Test activeDid migration specifically
+const result = await migrateActiveDid();
+expect(result.success).toBe(true);
+expect(result.warnings).toContain('Successfully migrated activeDid');
 ```
 
-## Migration UI
+## Troubleshooting
 
-```vue
-<!-- src/components/MigrationProgress.vue -->
-<template>
-  <div class="migration-progress">
-    <h2>Database Migration</h2>
-    
-    <div class="progress-container">
-      <div class="progress-bar" :style="{ width: `${progress}%` }" />
-      <div class="progress-text">{{ progress }}%</div>
-    </div>
-    
-    <div class="status-message">{{ statusMessage }}</div>
-    
-    <div v-if="error" class="error-message">
-      {{ error }}
-      <button @click="retryMigration">Retry</button>
-    </div>
-  </div>
-</template>
+### Common Issues
 
-<script setup lang="ts">
-import { ref, onMounted } from 'vue';
-import { MigrationService } from '@/services/storage/migration/MigrationService';
+1. **ActiveDid Not Found**
+   - Ensure accounts were migrated before activeDid migration
+   - Check that the Dexie activeDid exists in SQLite accounts
 
-const progress = ref(0);
-const statusMessage = ref('Preparing migration...');
-const error = ref<string | null>(null);
+2. **Migration Failures**
+   - Verify Dexie database is accessible
+   - Check SQLite database permissions
+   - Review migration logs for specific errors
 
-const migrationService = MigrationService.getInstance();
+3. **Data Inconsistencies**
+   - Use `compareDatabases()` to identify differences
+   - Re-run migration if necessary
+   - Check for duplicate or conflicting records
 
-async function startMigration() {
-  try {
-    // 1. Preparation
-    statusMessage.value = 'Creating backup...';
-    await migrationService.prepare();
-    progress.value = 20;
-    
-    // 2. Data migration
-    statusMessage.value = 'Migrating data...';
-    await migrationService.migrate();
-    progress.value = 80;
-    
-    // 3. Verification
-    statusMessage.value = 'Verifying migration...';
-    await migrationService.verify();
-    progress.value = 100;
-    
-    statusMessage.value = 'Migration completed successfully!';
-  } catch (err) {
-    error.value = err instanceof Error ? err.message : 'Migration failed';
-    statusMessage.value = 'Migration failed';
-  }
-}
+### Debugging
+```typescript
+// Enable detailed logging
+logger.setLevel('debug');
 
-async function retryMigration() {
-  error.value = null;
-  progress.value = 0;
-  await startMigration();
-}
-
-onMounted(() => {
-  startMigration();
-});
-</script>
-
-<style scoped>
-.migration-progress {
-  padding: 2rem;
-  max-width: 600px;
-  margin: 0 auto;
-}
-
-.progress-container {
-  position: relative;
-  height: 20px;
-  background: #eee;
-  border-radius: 10px;
-  overflow: hidden;
-  margin: 1rem 0;
-}
-
-.progress-bar {
-  position: absolute;
-  height: 100%;
-  background: #4CAF50;
-  transition: width 0.3s ease;
-}
-
-.progress-text {
-  position: absolute;
-  width: 100%;
-  text-align: center;
-  line-height: 20px;
-  color: #000;
-}
-
-.status-message {
-  text-align: center;
-  margin: 1rem 0;
-}
-
-.error-message {
-  color: #f44336;
-  text-align: center;
-  margin: 1rem 0;
-}
-
-button {
-  margin-top: 1rem;
-  padding: 0.5rem 1rem;
-  background: #2196F3;
-  color: white;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-}
-
-button:hover {
-  background: #1976D2;
-}
-</style>
+// Check migration status
+const comparison = await compareDatabases();
+console.log('Settings differences:', comparison.differences.settings);
 ```
 
-## Testing Strategy
+## Future Enhancements
 
-1. **Unit Tests**
-   ```typescript
-   // src/services/storage/migration/__tests__/MigrationService.spec.ts
-   describe('MigrationService', () => {
-     it('should initialize absurd-sql correctly', async () => {
-       const service = MigrationService.getInstance();
-       await service.initializeAbsurdSql();
-       
-       expect(service.isInitialized()).toBe(true);
-       expect(service.getDatabase()).toBeDefined();
-     });
+### Planned Improvements
+1. **Batch Processing**: Optimize for large datasets
+2. **Incremental Migration**: Support partial migrations
+3. **Rollback Capability**: Ability to revert migration
+4. **Progress Tracking**: Real-time migration progress
 
-     it('should create valid backup', async () => {
-       const service = MigrationService.getInstance();
-       const backup = await service.createBackup();
-       
-       expect(backup).toBeDefined();
-       expect(backup.accounts).toBeInstanceOf(Array);
-       expect(backup.settings).toBeInstanceOf(Array);
-       expect(backup.contacts).toBeInstanceOf(Array);
-     });
+### Performance Optimizations
+1. **Parallel Processing**: Migrate independent data concurrently
+2. **Memory Management**: Optimize for large datasets
+3. **Transaction Batching**: Reduce database round trips
 
-     it('should migrate data correctly', async () => {
-       const service = MigrationService.getInstance();
-       const backup = await service.createBackup();
-       
-       await service.migrate(backup);
-       
-       // Verify migration
-       const accounts = await service.getMigratedAccounts();
-       expect(accounts).toHaveLength(backup.accounts.length);
-     });
+## Conclusion
 
-     it('should handle rollback correctly', async () => {
-       const service = MigrationService.getInstance();
-       const backup = await service.createBackup();
-       
-       // Simulate failed migration
-       await service.migrate(backup);
-       await service.simulateFailure();
-       
-       // Perform rollback
-       await service.rollback(backup);
-       
-       // Verify rollback
-       const accounts = await service.getOriginalAccounts();
-       expect(accounts).toHaveLength(backup.accounts.length);
-     });
-   });
-   ```
+The Dexie to SQLite migration provides a robust, secure, and user-friendly transition path. The addition of activeDid migration ensures that users maintain their identity continuity throughout the migration process, significantly improving the user experience.
 
-2. **Integration Tests**
-   ```typescript
-   // src/services/storage/migration/__tests__/integration/Migration.spec.ts
-   describe('Migration Integration', () => {
-     it('should handle concurrent access during migration', async () => {
-       const service = MigrationService.getInstance();
-       
-       // Start migration
-       const migrationPromise = service.migrate();
-       
-       // Simulate concurrent access
-       const accessPromises = Array(5).fill(null).map(() =>
-         service.getAccount('did:test:123')
-       );
-       
-       // Wait for all operations
-       const [migrationResult, ...accessResults] = await Promise.allSettled([
-         migrationPromise,
-         ...accessPromises
-       ]);
-       
-       // Verify results
-       expect(migrationResult.status).toBe('fulfilled');
-       expect(accessResults.some(r => r.status === 'rejected')).toBe(true);
-     });
-
-     it('should maintain data integrity during platform transition', async () => {
-       const service = MigrationService.getInstance();
-       
-       // Simulate platform change
-       await service.simulatePlatformChange();
-       
-       // Verify data
-       const accounts = await service.getAllAccounts();
-       const settings = await service.getAllSettings();
-       const contacts = await service.getAllContacts();
-       
-       expect(accounts).toBeDefined();
-       expect(settings).toBeDefined();
-       expect(contacts).toBeDefined();
-     });
-   });
-   ```
-
-## Success Criteria
-
-1. **Data Integrity**
-   - [ ] All accounts migrated successfully
-   - [ ] All settings preserved
-   - [ ] All contacts transferred
-   - [ ] No data corruption
-
-2. **Performance**
-   - [ ] Migration completes within acceptable time
-   - [ ] No significant performance degradation
-   - [ ] Efficient storage usage
-   - [ ] Smooth user experience
-
-3. **Security**
-   - [ ] Encrypted data remains secure
-   - [ ] Access controls maintained
-   - [ ] No sensitive data exposure
-   - [ ] Secure backup process
-
-4. **User Experience**
-   - [ ] Clear migration progress
-   - [ ] Informative error messages
-   - [ ] Automatic recovery from failures
-   - [ ] No data loss
-
-## Rollback Plan
-
-1. **Automatic Rollback**
-   - Triggered by migration failure
-   - Restores from verified backup
-   - Maintains data consistency
-   - Logs rollback reason
-
-2. **Manual Rollback**
-   - Available through settings
-   - Requires user confirmation
-   - Preserves backup data
-   - Provides rollback status
-
-3. **Emergency Recovery**
-   - Manual backup restoration
-   - Database repair tools
-   - Data recovery procedures
-   - Support contact information
-
-## Post-Migration
-
-1. **Verification**
-   - Data integrity checks
-   - Performance monitoring
-   - Error rate tracking
-   - User feedback collection
-
-2. **Cleanup**
-   - Remove old database
-   - Clear migration artifacts
-   - Update application state
-   - Archive backup data
-
-3. **Monitoring**
-   - Track migration success rate
-   - Monitor performance metrics
-   - Collect error reports
-   - Gather user feedback
-
-## Support
-
-For assistance with migration:
-1. Check the troubleshooting guide
-2. Review error logs
-3. Contact support team
-4. Submit issue report
-
-## Timeline
-
-1. **Preparation Phase** (1 week)
-   - Backup system implementation
-   - Migration service development
-   - Testing framework setup
-
-2. **Testing Phase** (2 weeks)
-   - Unit testing
-   - Integration testing
-   - Performance testing
-   - Security testing
-
-3. **Deployment Phase** (1 week)
-   - Staged rollout
-   - Monitoring
-   - Support preparation
-   - Documentation updates
-
-4. **Post-Deployment** (2 weeks)
-   - Monitoring
-   - Bug fixes
-   - Performance optimization
-   - User feedback collection 
+The migration fence architecture allows for controlled, reversible migration while maintaining application stability and data integrity. 

ios/App/App.xcodeproj/project.pbxproj

@@ -403,7 +403,7 @@
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 25;
+				CURRENT_PROJECT_VERSION = 35;
 				DEVELOPMENT_TEAM = GM3FS5JQPH;
 				ENABLE_APP_SANDBOX = NO;
 				ENABLE_USER_SCRIPT_SANDBOXING = NO;
@@ -413,7 +413,7 @@
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 0.5.0;
+				MARKETING_VERSION = 1.0.2;
 				OTHER_SWIFT_FLAGS = "$(inherited) \"-D\" \"COCOAPODS\" \"-DDEBUG\"";
 				PRODUCT_BUNDLE_IDENTIFIER = app.timesafari;
 				PRODUCT_NAME = "$(TARGET_NAME)";
@@ -430,7 +430,7 @@
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 25;
+				CURRENT_PROJECT_VERSION = 35;
 				DEVELOPMENT_TEAM = GM3FS5JQPH;
 				ENABLE_APP_SANDBOX = NO;
 				ENABLE_USER_SCRIPT_SANDBOXING = NO;
@@ -440,7 +440,7 @@
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 0.5.0;
+				MARKETING_VERSION = 1.0.2;
 				PRODUCT_BUNDLE_IDENTIFIER = app.timesafari;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = "";

ios/App/App/Info.plist

@@ -49,5 +49,16 @@
 	</array>
 	<key>UIViewControllerBasedStatusBarAppearance</key>
 	<true/>
+	<key>CFBundleURLTypes</key>
+	<array>
+		<dict>
+			<key>CFBundleURLName</key>
+			<string>app.timesafari</string>
+			<key>CFBundleURLSchemes</key>
+			<array>
+				<string>timesafari</string>
+			</array>
+		</dict>
+	</array>
 </dict>
 </plist>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "timesafari",
-  "version": "0.4.8",
+  "version": "1.0.3-beta",
   "description": "Time Safari Application",
   "author": {
     "name": "Time Safari Team"

src/assets/icons.json

@@ -0,0 +1,75 @@
+{
+  "warning": {
+    "fillRule": "evenodd",
+    "d": "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z",
+    "clipRule": "evenodd"
+  },
+  "spinner": {
+    "d": "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+  },
+  "chart": {
+    "strokeLinecap": "round",
+    "strokeLinejoin": "round",
+    "strokeWidth": "2",
+    "d": "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"
+  },
+  "plus": {
+    "strokeLinecap": "round",
+    "strokeLinejoin": "round",
+    "strokeWidth": "2",
+    "d": "M12 4v16m8-8H4"
+  },
+  "settings": {
+    "strokeLinecap": "round",
+    "strokeLinejoin": "round",
+    "strokeWidth": "2",
+    "d": "M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"
+  },
+  "settingsDot": {
+    "strokeLinecap": "round",
+    "strokeLinejoin": "round",
+    "strokeWidth": "2",
+    "d": "M15 12a3 3 0 11-6 0 3 3 0 016 0z"
+  },
+  "lock": {
+    "strokeLinecap": "round",
+    "strokeLinejoin": "round",
+    "strokeWidth": "2",
+    "d": "M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"
+  },
+  "download": {
+    "strokeLinecap": "round",
+    "strokeLinejoin": "round",
+    "strokeWidth": "2",
+    "d": "M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
+  },
+  "check": {
+    "strokeLinecap": "round",
+    "strokeLinejoin": "round",
+    "strokeWidth": "2",
+    "d": "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"
+  },
+  "edit": {
+    "strokeLinecap": "round",
+    "strokeLinejoin": "round",
+    "strokeWidth": "2",
+    "d": "M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
+  },
+  "trash": {
+    "strokeLinecap": "round",
+    "strokeLinejoin": "round",
+    "strokeWidth": "2",
+    "d": "M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
+  },
+  "plusCircle": {
+    "strokeLinecap": "round",
+    "strokeLinejoin": "round",
+    "strokeWidth": "2",
+    "d": "M12 6v6m0 0v6m0-6h6m-6 0H6"
+  },
+  "info": {
+    "fillRule": "evenodd",
+    "d": "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z",
+    "clipRule": "evenodd"
+  }
+} 

src/components/FeedFilters.vue

@@ -104,7 +104,6 @@ import { USE_DEXIE_DB } from "@/constants/app";
 import * as databaseUtil from "../db/databaseUtil";
 import { MASTER_SETTINGS_KEY } from "../db/tables/settings";
 import { db, retrieveSettingsForActiveAccount } from "../db/index";
-import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
 
 @Component({
   components: {
@@ -143,19 +142,23 @@ export default class FeedFilters extends Vue {
   async toggleHasVisibleDid() {
     this.settingChanged = true;
     this.hasVisibleDid = !this.hasVisibleDid;
-    await db.settings.update(MASTER_SETTINGS_KEY, {
+    await databaseUtil.updateDefaultSettings({
       filterFeedByVisible: this.hasVisibleDid,
     });
+
+    if (USE_DEXIE_DB) {
+      await db.settings.update(MASTER_SETTINGS_KEY, {
+        filterFeedByVisible: this.hasVisibleDid,
+      });
+    }
   }
 
   async toggleNearby() {
     this.settingChanged = true;
     this.isNearby = !this.isNearby;
-    const platformService = PlatformServiceFactory.getInstance();
-    await platformService.dbExec(
-      `UPDATE settings SET filterFeedByNearby = ? WHERE id = ?`,
-      [this.isNearby, MASTER_SETTINGS_KEY],
-    );
+    await databaseUtil.updateDefaultSettings({
+      filterFeedByNearby: this.isNearby,
+    });
 
     if (USE_DEXIE_DB) {
       await db.settings.update(MASTER_SETTINGS_KEY, {
@@ -169,11 +172,10 @@ export default class FeedFilters extends Vue {
       this.settingChanged = true;
     }
 
-    const platformService = PlatformServiceFactory.getInstance();
-    await platformService.dbExec(
-      `UPDATE settings SET filterFeedByNearby = ? AND filterFeedByVisible = ? WHERE id = ?`,
-      [false, false, MASTER_SETTINGS_KEY],
-    );
+    await databaseUtil.updateDefaultSettings({
+      filterFeedByNearby: false,
+      filterFeedByVisible: false,
+    });
 
     if (USE_DEXIE_DB) {
       await db.settings.update(MASTER_SETTINGS_KEY, {
@@ -191,11 +193,10 @@ export default class FeedFilters extends Vue {
       this.settingChanged = true;
     }
 
-    const platformService = PlatformServiceFactory.getInstance();
-    await platformService.dbExec(
-      `UPDATE settings SET filterFeedByNearby = ? AND filterFeedByVisible = ? WHERE id = ?`,
-      [true, true, MASTER_SETTINGS_KEY],
-    );
+    await databaseUtil.updateDefaultSettings({
+      filterFeedByNearby: true,
+      filterFeedByVisible: true,
+    });
 
     if (USE_DEXIE_DB) {
       await db.settings.update(MASTER_SETTINGS_KEY, {

src/components/GiftedDialog.vue

@@ -1,99 +1,534 @@
 <template>
   <div v-if="visible" class="dialog-overlay">
     <div class="dialog">
-      <h1 class="text-xl font-bold text-center mb-4">
-        {{ customTitle }}
-      </h1>
-      <input
-        v-model="description"
-        type="text"
-        class="block w-full rounded border border-slate-400 mb-2 px-3 py-2"
-        :placeholder="prompt || 'What was given?'"
-      />
-      <div class="flex flex-row justify-center">
-        <span
-          class="rounded-l border border-r-0 border-slate-400 bg-slate-200 text-center text-blue-500 px-2 py-2 w-20"
-          @click="changeUnitCode()"
+      <!-- Step 1: Giver -->
+      <div v-show="firstStep" id="sectionGiftedGiver">
+        <label class="block font-bold mb-4">
+          {{
+            stepType === "recipient"
+              ? "Choose who received the gift:"
+              : showProjects
+                ? "Choose a project benefitted from:"
+                : "Choose a person received from:"
+          }}
+        </label>
+
+        <!-- Unified Quick-pick grid for People and Projects -->
+        <ul
+          :class="
+            shouldShowProjects
+              ? 'grid grid-cols-3 md:grid-cols-4 gap-x-2 gap-y-4 text-center mb-4'
+              : 'grid grid-cols-4 sm:grid-cols-5 md:grid-cols-6 gap-x-2 gap-y-4 text-center mb-4'
+          "
         >
-          {{ libsUtil.UNIT_SHORT[unitCode] || unitCode }}
-        </span>
-        <div
-          class="border border-r-0 border-slate-400 bg-slate-200 px-4 py-2"
-          @click="amountInput === '0' ? null : decrement()"
-        >
-          <font-awesome icon="chevron-left" />
-        </div>
-        <input
-          id="inputGivenAmount"
-          v-model="amountInput"
-          type="number"
-          class="border border-r-0 border-slate-400 px-2 py-2 text-center w-20"
-        />
-        <div
-          class="rounded-r border border-slate-400 bg-slate-200 px-4 py-2"
-          @click="increment()"
-        >
-          <font-awesome icon="chevron-right" />
-        </div>
-      </div>
-      <div class="mt-4 flex justify-center">
-        <span>
-          <router-link
-            :to="{
-              name: 'gifted-details',
-              query: {
-                amountInput,
-                description,
-                giverDid: giver?.did,
-                giverName: giver?.name,
-                offerId,
-                fulfillsProjectId: toProjectId,
-                providerProjectId: fromProjectId,
-                recipientDid: receiver?.did,
-                recipientName: receiver?.name,
-                unitCode,
-              },
-            }"
-            class="text-blue-500"
-          >
-            Photo & more options ...
-          </router-link>
-        </span>
-      </div>
-      <p class="text-center mb-2 mt-6 italic">
-        Sign & Send to publish to the world
-        <font-awesome
-          icon="circle-info"
-          class="pl-2 text-blue-500 cursor-pointer"
-          @click="explainData()"
-        />
-      </p>
-      <div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
+          <template v-if="shouldShowProjects">
+            <!-- show projects -->
+            <li
+              v-for="project in projects.slice(0, 7)"
+              :key="project.handleId"
+              class="cursor-pointer"
+              @click="
+                stepType === 'recipient'
+                  ? selectRecipientProject(project)
+                  : selectProject(project)
+              "
+            >
+              <div class="relative w-fit mx-auto mb-1">
+                <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"
+                />
+              </div>
+              <h3
+                class="text-xs font-medium text-ellipsis whitespace-nowrap overflow-hidden"
+              >
+                {{ project.name }}
+              </h3>
+              <div class="text-xs text-slate-500 truncate">
+                <font-awesome icon="user" class="fa-fw text-slate-400" />
+                {{
+                  didInfo(project.issuerDid, activeDid, allMyDids, allContacts)
+                }}
+              </div>
+            </li>
+            <li
+              v-if="projects.length === 0"
+              class="text-xs text-slate-500 italic col-span-full"
+            >
+              (No projects found.)
+            </li>
+            <li v-if="projects.length > 0">
+              <router-link :to="{ name: 'discover' }" class="cursor-pointer">
+                <font-awesome
+                  icon="circle-right"
+                  class="text-blue-500 text-5xl mb-1"
+                />
+                <h3
+                  class="text-xs text-slate-400 font-medium italic text-ellipsis whitespace-nowrap overflow-hidden"
+                >
+                  Show All
+                </h3>
+              </router-link>
+            </li>
+          </template>
+          <template v-else>
+            <!-- show people (contacts) -->
+            <li
+              v-if="
+                stepType === 'recipient' ||
+                (stepType === 'giver' && isFromProjectView)
+              "
+              :class="{
+                'cursor-pointer': !wouldCreateConflict(activeDid),
+                'cursor-not-allowed opacity-50': wouldCreateConflict(activeDid)
+              }"
+              @click="
+                !wouldCreateConflict(activeDid) &&
+                (stepType === 'recipient'
+                  ? selectRecipient({ did: activeDid, name: 'You' })
+                  : selectGiver({ did: activeDid, name: 'You' }))
+              "
+            >
+              <font-awesome 
+                :class="{
+                  'text-blue-500 text-5xl mb-1': !wouldCreateConflict(activeDid),
+                  'text-slate-400 text-5xl mb-1': wouldCreateConflict(activeDid)
+                }" 
+                icon="hand" 
+              />
+              <h3
+                :class="{
+                  'text-xs text-blue-500 font-medium text-ellipsis whitespace-nowrap overflow-hidden': !wouldCreateConflict(activeDid),
+                  'text-xs text-slate-400 font-medium text-ellipsis whitespace-nowrap overflow-hidden': wouldCreateConflict(activeDid)
+                }"
+              >
+                You
+              </h3>
+            </li>
+            <li
+              class="cursor-pointer"
+              @click="
+                stepType === 'recipient' ? selectRecipient() : selectGiver()
+              "
+            >
+              <font-awesome
+                icon="circle-question"
+                class="text-slate-400 text-5xl mb-1"
+              />
+              <h3
+                class="text-xs text-slate-400 font-medium italic text-ellipsis whitespace-nowrap overflow-hidden"
+              >
+                (Unnamed)
+              </h3>
+            </li>
+            <li
+              v-if="allContacts.length === 0"
+              class="text-xs text-slate-500 italic col-span-full"
+            >
+              (Add friends to see more people worthy of recognition.)
+            </li>
+            <li
+              v-for="contact in allContacts.slice(0, 10)"
+              :key="contact.did"
+              :class="{
+                'cursor-pointer': !wouldCreateConflict(contact.did),
+                'cursor-not-allowed opacity-50': wouldCreateConflict(contact.did)
+              }"
+              @click="
+                !wouldCreateConflict(contact.did) &&
+                (stepType === 'recipient'
+                  ? selectRecipient(contact)
+                  : selectGiver(contact))
+              "
+            >
+              <div class="relative w-fit mx-auto mb-1">
+                <EntityIcon
+                  :contact="contact"
+                  class="!size-[3rem] mx-auto border border-slate-300 bg-white overflow-hidden rounded-full"
+                />
+                <div
+                  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>
+              <h3
+                :class="{
+                  'text-xs font-medium text-ellipsis whitespace-nowrap overflow-hidden': !wouldCreateConflict(contact.did) && contact.name,
+                  'text-xs font-medium text-ellipsis whitespace-nowrap overflow-hidden text-slate-400 italic': !contact.name,
+                  'text-xs font-medium text-ellipsis whitespace-nowrap overflow-hidden text-slate-400': wouldCreateConflict(contact.did) && contact.name
+                }"
+              >
+                {{ contact.name || "(No name)" }}
+              </h3>
+            </li>
+            <li v-if="allContacts.length > 0" class="cursor-pointer">
+              <router-link
+                :to="{
+                  name: 'contact-gift',
+                  query: {
+                    stepType: stepType,
+                    giverEntityType: giverEntityType,
+                    recipientEntityType: recipientEntityType,
+                    ...(stepType === 'giver'
+                      ? {
+                          recipientProjectId: toProjectId,
+                          recipientProjectName: receiver?.name,
+                          recipientProjectImage: receiver?.image,
+                          recipientProjectHandleId: receiver?.handleId,
+                          recipientDid: receiver?.did,
+                        }
+                      : {
+                          giverProjectId: fromProjectId,
+                          giverProjectName: giver?.name,
+                          giverProjectImage: giver?.image,
+                          giverProjectHandleId: giver?.handleId,
+                          giverDid: giver?.did,
+                        }),
+                    fromProjectId: fromProjectId,
+                    toProjectId: toProjectId,
+                    showProjects: (showProjects || false).toString(),
+                    isFromProjectView: (isFromProjectView || false).toString(),
+                  },
+                }"
+              >
+                <font-awesome
+                  icon="circle-right"
+                  class="text-blue-500 text-5xl mb-1"
+                />
+                <h3
+                  class="text-xs text-slate-400 font-medium italic text-ellipsis whitespace-nowrap overflow-hidden"
+                >
+                  Show All
+                </h3>
+              </router-link>
+            </li>
+          </template>
+        </ul>
+
         <button
-          class="block w-full text-center text-lg font-bold 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-2 py-3 rounded-md"
-          @click="confirm"
-        >
-          Sign &amp; Send
-        </button>
-        <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-1.5 py-2 rounded-md"
+          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-1.5 py-2 rounded-lg"
           @click="cancel"
         >
           Cancel
         </button>
       </div>
+
+      <!-- Step 2: Gift -->
+      <div v-show="!firstStep" id="sectionGiftedGift">
+        <div class="grid grid-cols-2 gap-2 mb-4">
+          <!-- Giver Button -->
+          <button
+            v-if="
+              (giverEntityType === 'person' || giverEntityType === 'project') &&
+              !(isFromProjectView && giverEntityType === 'project')
+            "
+            class="flex-1 flex items-center gap-2 bg-slate-100 border border-slate-300 rounded-md p-2"
+            @click="goBackToStep1('giver')"
+          >
+            <div>
+              <template v-if="giverEntityType === 'project'">
+                <ProjectIcon
+                  v-if="giver?.handleId"
+                  :entity-id="giver.handleId"
+                  :icon-size="32"
+                  :image-url="giver.image"
+                  class="rounded-full bg-white overflow-hidden !size-[2rem] object-cover"
+                />
+              </template>
+              <template v-else>
+                <EntityIcon
+                  v-if="giver?.did"
+                  :contact="giver"
+                  class="rounded-full bg-white overflow-hidden !size-[2rem] object-cover"
+                />
+                <font-awesome
+                  v-else
+                  icon="circle-question"
+                  class="text-slate-400 text-3xl"
+                />
+              </template>
+            </div>
+
+            <div class="text-start min-w-0">
+              <p class="text-xs text-slate-500 leading-1 -mb-1 uppercase">
+                {{
+                  giverEntityType === "project"
+                    ? "Benefited from:"
+                    : "Received from:"
+                }}
+              </p>
+              <h3 
+                v-if="giver?.name && giver.name !== giver.did" 
+                class="font-semibold truncate"
+              >
+                {{ giver.name }}
+              </h3>
+              <h3 
+                v-if="giver?.name && giver.name === giver.did" 
+                class="font-semibold truncate text-slate-400 italic"
+              >
+                (No name)
+              </h3>
+              <h3 
+                v-else-if="!giver?.name" 
+                class="font-semibold truncate text-slate-400 italic"
+              >
+                (Unnamed)
+              </h3>
+            </div>
+
+            <p class="ms-auto text-sm text-blue-500 pe-1">
+              <font-awesome icon="pen" title="Change" />
+            </p>
+          </button>
+          <div
+            v-else
+            class="flex-1 flex items-center gap-2 bg-slate-100 border border-slate-300 rounded-md p-2"
+          >
+            <div>
+              <template v-if="giverEntityType === 'project'">
+                <ProjectIcon
+                  v-if="giver?.handleId"
+                  :entity-id="giver.handleId"
+                  :icon-size="32"
+                  :image-url="giver.image"
+                  class="rounded-full bg-white overflow-hidden !size-[2rem] object-cover"
+                />
+              </template>
+              <template v-else>
+                <EntityIcon
+                  v-if="giver?.did"
+                  :contact="giver"
+                  class="rounded-full bg-white overflow-hidden !size-[2rem] object-cover"
+                />
+                <font-awesome
+                  v-else
+                  icon="circle-question"
+                  class="text-slate-400 text-3xl"
+                />
+              </template>
+            </div>
+
+            <div class="text-start min-w-0">
+              <p class="text-xs text-slate-500 leading-1 -mb-1 uppercase">
+                {{
+                  giverEntityType === "project"
+                    ? "Benefited from:"
+                    : "Received from:"
+                }}
+              </p>
+              <h3 
+                v-if="giver?.name && giver.name !== giver.did" 
+                class="font-semibold truncate"
+              >
+                {{ giver.name }}
+              </h3>
+              <h3 
+                v-if="giver?.name && giver.name === giver.did" 
+                class="font-semibold truncate text-slate-400 italic"
+              >
+                (No name)
+              </h3>
+              <h3 
+                v-else-if="!giver?.name" 
+                class="font-semibold truncate text-slate-400 italic"
+              >
+                (Unnamed)
+              </h3>
+            </div>
+
+            <p class="ms-auto text-sm text-slate-400 pe-1">
+              <font-awesome icon="lock" title="Can't be changed" />
+            </p>
+          </div>
+
+          <!-- Recipient Button -->
+          <button
+            v-if="recipientEntityType === 'person'"
+            class="flex-1 flex items-center gap-2 bg-slate-100 border border-slate-300 rounded-md p-2"
+            @click="goBackToStep1('recipient')"
+          >
+            <div>
+              <EntityIcon
+                v-if="receiver?.did"
+                :contact="receiver"
+                class="rounded-full bg-white overflow-hidden !size-[2rem] object-cover"
+              />
+              <font-awesome
+                v-else
+                icon="circle-question"
+                class="text-slate-400 text-3xl"
+              />
+            </div>
+
+            <div class="text-start min-w-0">
+              <p class="text-xs text-slate-500 leading-1 -mb-1 uppercase">
+                Given to:
+              </p>
+              <h3 
+                v-if="receiver?.name && receiver.name !== receiver.did" 
+                class="font-semibold truncate"
+              >
+                {{ receiver.name }}
+              </h3>
+              <h3 
+                v-if="receiver?.name && receiver.name === receiver.did" 
+                class="font-semibold truncate text-slate-400 italic"
+              >
+                (No name)
+              </h3>
+              <h3 
+                v-else-if="!receiver?.name" 
+                class="font-semibold truncate text-slate-400 italic"
+              >
+                (Unnamed)
+              </h3>
+            </div>
+
+            <p class="ms-auto text-sm text-blue-500 pe-1">
+              <font-awesome icon="pen" title="Change" />
+            </p>
+          </button>
+          <div
+            v-else-if="recipientEntityType === 'project'"
+            class="flex-1 flex items-center gap-2 bg-slate-100 border border-slate-300 rounded-md p-2"
+          >
+            <div>
+              <ProjectIcon
+                v-if="receiver?.handleId"
+                :entity-id="receiver.handleId"
+                :icon-size="32"
+                :image-url="receiver.image"
+                class="rounded-full bg-white overflow-hidden !size-[2rem] object-cover"
+              />
+            </div>
+
+            <div class="text-start min-w-0">
+              <p class="text-xs text-slate-500 leading-1 -mb-1 uppercase">
+                Given to project:
+              </p>
+              <h3 
+                v-if="receiver?.name" 
+                class="font-semibold truncate"
+              >
+                {{ receiver.name }}
+              </h3>
+              <h3 
+                v-else 
+                class="font-semibold truncate text-slate-400 italic"
+              >
+                (Unnamed)
+              </h3>
+            </div>
+
+            <p class="ms-auto text-sm text-slate-400 pe-1">
+              <font-awesome icon="lock" title="Can't be changed" />
+            </p>
+          </div>
+        </div>
+        <input
+          v-model="description"
+          type="text"
+          class="block w-full rounded border border-slate-400 px-3 py-2 mb-4 placeholder:italic"
+          :placeholder="prompt || 'What was given?'"
+        />
+        <div class="flex mb-4">
+          <button
+            class="rounded-s border border-e-0 border-slate-400 bg-slate-200 px-4 py-2"
+            @click="amountInput === '0' ? null : decrement()"
+          >
+            <font-awesome icon="chevron-left" />
+          </button>
+          <input
+            id="inputGivenAmount"
+            v-model="amountInput"
+            type="number"
+            class="flex-1 border border-e-0 border-slate-400 px-2 py-2 text-center w-[1px]"
+          />
+          <button
+            class="rounded-e border border-slate-400 bg-slate-200 px-4 py-2"
+            @click="increment()"
+          >
+            <font-awesome icon="chevron-right" />
+          </button>
+
+          <select
+            v-model="unitCode"
+            class="flex-1 rounded border border-slate-400 ms-2 px-3 py-2"
+          >
+            <option
+              v-for="(displayName, code) in unitOptions"
+              :key="code"
+              :value="code"
+            >
+              {{ displayName }}
+            </option>
+          </select>
+        </div>
+        <router-link
+          :to="{
+            name: 'gifted-details',
+            query: giftedDetailsQuery,
+          }"
+          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-1.5 py-2 rounded-lg mb-4"
+        >
+          Photo &amp; more options&hellip;
+        </router-link>
+        <p class="text-center text-sm mb-4">
+          <b class="font-medium">Sign &amp; Send</b> to publish to the world
+          <font-awesome
+            icon="circle-info"
+            class="fa-fw text-blue-500 text-base cursor-pointer"
+            @click="explainData()"
+          />
+        </p>
+        
+        <!-- Conflict warning -->
+        <div v-if="hasPersonConflict" class="mb-4 p-3 bg-red-50 border border-red-200 rounded-md">
+          <p class="text-red-700 text-sm text-center">
+            <font-awesome icon="exclamation-triangle" class="fa-fw mr-1" />
+            Cannot record: Same person selected as both giver and recipient
+          </p>
+        </div>
+        
+        <div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
+          <button
+            :disabled="hasPersonConflict"
+            :class="{
+              'block w-full text-center text-md uppercase font-bold 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-lg': !hasPersonConflict,
+              'block w-full text-center text-md uppercase font-bold bg-gradient-to-b from-slate-300 to-slate-500 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-slate-400 px-1.5 py-2 rounded-lg cursor-not-allowed': hasPersonConflict
+            }"
+            @click="confirm"
+          >
+            Sign &amp; Send
+          </button>
+          <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-1.5 py-2 rounded-lg"
+            @click="cancel"
+          >
+            Cancel
+          </button>
+        </div>
+      </div>
     </div>
   </div>
 </template>
 
 <script lang="ts">
-import { Vue, Component, Prop } from "vue-facing-decorator";
+import { Vue, Component, Prop, Watch } from "vue-facing-decorator";
 
 import { NotificationIface, USE_DEXIE_DB } from "../constants/app";
 import {
   createAndSubmitGive,
   didInfo,
   serverMessageForUser,
+  getHeaders,
 } from "../libs/endorserServer";
 import * as libsUtil from "../libs/util";
 import { db, retrieveSettingsForActiveAccount } from "../db/index";
@@ -102,13 +537,38 @@ import * as databaseUtil from "../db/databaseUtil";
 import { retrieveAccountDids } from "../libs/util";
 import { logger } from "../utils/logger";
 import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
+import EntityIcon from "../components/EntityIcon.vue";
+import ProjectIcon from "../components/ProjectIcon.vue";
+import { PlanData } from "../interfaces/records";
 
-@Component
+@Component({
+  components: {
+    EntityIcon,
+    ProjectIcon,
+  },
+})
 export default class GiftedDialog extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
   @Prop() fromProjectId = "";
   @Prop() toProjectId = "";
+  @Prop({ default: false }) showProjects = false;
+  @Prop() isFromProjectView = false;
+
+  @Watch("showProjects")
+  onShowProjectsChange() {
+    this.updateEntityTypes();
+  }
+
+  @Watch("fromProjectId")
+  onFromProjectIdChange() {
+    this.updateEntityTypes();
+  }
+
+  @Watch("toProjectId")
+  onToProjectIdChange() {
+    this.updateEntityTypes();
+  }
 
   activeDid = "";
   allContacts: Array<Contact> = [];
@@ -119,6 +579,7 @@ export default class GiftedDialog extends Vue {
   callbackOnSuccess?: (amount: number) => void = () => {};
   customTitle?: string;
   description = "";
+  firstStep = true; // true = Step 1 (giver/recipient selection), false = Step 2 (amount/description)
   giver?: libsUtil.GiverReceiverInputInfo; // undefined means no identified giver agent
   offerId = "";
   prompt = "";
@@ -128,6 +589,80 @@ export default class GiftedDialog extends Vue {
 
   libsUtil = libsUtil;
 
+  projects: PlanData[] = [];
+
+  didInfo = didInfo;
+
+  // Computed property to help debug template logic
+  get shouldShowProjects() {
+    const result =
+      (this.stepType === "giver" && this.giverEntityType === "project") ||
+      (this.stepType === "recipient" && this.recipientEntityType === "project");
+    return result;
+  }
+
+  // Computed property to check if current selection would create a conflict
+  get hasPersonConflict() {
+    // Only check for conflicts when both entities are persons
+    if (this.giverEntityType !== "person" || this.recipientEntityType !== "person") {
+      return false;
+    }
+    
+    // Check if giver and recipient are the same person
+    if (this.giver?.did && this.receiver?.did && this.giver.did === this.receiver.did) {
+      return true;
+    }
+    
+    return false;
+  }
+
+  // Computed property to check if a contact would create a conflict when selected
+  wouldCreateConflict(contactDid: string) {
+    // Only check for conflicts when both entities are persons
+    if (this.giverEntityType !== "person" || this.recipientEntityType !== "person") {
+      return false;
+    }
+    
+    if (this.stepType === "giver") {
+      // If selecting as giver, check if it conflicts with current recipient
+      return this.receiver?.did === contactDid;
+    } else if (this.stepType === "recipient") {
+      // If selecting as recipient, check if it conflicts with current giver
+      return this.giver?.did === contactDid;
+    }
+    
+    return false;
+  }
+
+  stepType = "giver";
+  giverEntityType = "person" as "person" | "project";
+  recipientEntityType = "person" as "person" | "project";
+
+  updateEntityTypes() {
+    // Reset and set entity types based on current context
+    this.giverEntityType = "person";
+    this.recipientEntityType = "person";
+
+    // Determine entity types based on current context
+    if (this.showProjects) {
+      // HomeView "Project" button or ProjectViewView "Given by This"
+      this.giverEntityType = "project";
+      this.recipientEntityType = "person";
+    } else if (this.fromProjectId) {
+      // ProjectViewView "Given by This" button (project is giver)
+      this.giverEntityType = "project";
+      this.recipientEntityType = "person";
+    } else if (this.toProjectId) {
+      // ProjectViewView "Given to This" button (project is recipient)
+      this.giverEntityType = "person";
+      this.recipientEntityType = "project";
+    } else {
+      // HomeView "Person" button
+      this.giverEntityType = "person";
+      this.recipientEntityType = "person";
+    }
+  }
+
   async open(
     giver?: libsUtil.GiverReceiverInputInfo,
     receiver?: libsUtil.GiverReceiverInputInfo,
@@ -140,10 +675,14 @@ export default class GiftedDialog extends Vue {
     this.giver = giver;
     this.prompt = prompt || "";
     this.receiver = receiver;
-    // if we show "given to user" selection, default checkbox to true
     this.amountInput = "0";
     this.callbackOnSuccess = callbackOnSuccess;
     this.offerId = offerId || "";
+    this.firstStep = !giver;
+    this.stepType = "giver";
+
+    // Update entity types based on current props
+    this.updateEntityTypes();
 
     try {
       let settings = await databaseUtil.retrieveSettingsForActiveAccount();
@@ -174,7 +713,16 @@ export default class GiftedDialog extends Vue {
           this.allContacts,
         );
       }
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+      if (
+        this.giverEntityType === "project" ||
+        this.recipientEntityType === "project"
+      ) {
+        await this.loadProjects();
+      } else {
+        // Clear projects array when not needed
+        this.projects = [];
+      }
     } catch (err: any) {
       logger.error("Error retrieving settings from database:", err);
       this.$notify(
@@ -224,6 +772,7 @@ export default class GiftedDialog extends Vue {
     this.amountInput = "0";
     this.prompt = "";
     this.unitCode = "HUR";
+    this.firstStep = true;
   }
 
   async confirm() {
@@ -265,6 +814,20 @@ export default class GiftedDialog extends Vue {
       );
       return;
     }
+    
+    // Check for person conflict
+    if (this.hasPersonConflict) {
+      this.$notify(
+        {
+          group: "alert",
+          type: "danger",
+          title: "Error",
+          text: "You cannot select the same person as both giver and recipient.",
+        },
+        3000,
+      );
+      return;
+    }
 
     this.close();
     this.$notify(
@@ -304,24 +867,56 @@ export default class GiftedDialog extends Vue {
     unitCode: string = "HUR",
   ) {
     try {
+      // Determine the correct parameters based on entity types
+      let fromDid: string | undefined;
+      let toDid: string | undefined;
+      let fulfillsProjectHandleId: string | undefined;
+      let providerPlanHandleId: string | undefined;
+
+      if (this.giverEntityType === "project" && this.recipientEntityType === "person") {
+        // Project-to-person gift
+        fromDid = undefined; // No person giver
+        toDid = recipientDid as string; // Person recipient
+        fulfillsProjectHandleId = undefined; // No project recipient
+        providerPlanHandleId = this.giver?.handleId; // Project giver
+      } else if (this.giverEntityType === "person" && this.recipientEntityType === "project") {
+        // Person-to-project gift
+        fromDid = giverDid as string; // Person giver
+        toDid = undefined; // No person recipient
+        fulfillsProjectHandleId = this.toProjectId; // Project recipient
+        providerPlanHandleId = undefined; // No project giver
+      } else if (this.giverEntityType === "project" && this.recipientEntityType === "project") {
+        // Project-to-project gift
+        fromDid = undefined; // No person giver
+        toDid = undefined; // No person recipient
+        fulfillsProjectHandleId = this.toProjectId; // Project recipient
+        providerPlanHandleId = this.giver?.handleId; // Project giver
+      } else {
+        // Person-to-person gift
+        fromDid = giverDid as string;
+        toDid = recipientDid as string;
+        fulfillsProjectHandleId = undefined;
+        providerPlanHandleId = undefined;
+      }
+
       const result = await createAndSubmitGive(
         this.axios,
         this.apiServer,
         this.activeDid,
-        giverDid as string,
-        recipientDid as string,
+        fromDid,
+        toDid,
         description,
         amount,
         unitCode,
-        this.toProjectId,
+        fulfillsProjectHandleId,
         this.offerId,
         false,
         undefined,
-        this.fromProjectId,
+        providerPlanHandleId,
       );
 
       if (!result.success) {
-        const errorMessage = this.getGiveCreationErrorMessage(result);
+        const errorMessage = result.error;
         logger.error("Error with give creation result:", result);
         this.$notify(
           {
@@ -367,19 +962,6 @@ export default class GiftedDialog extends Vue {
 
   // Helper functions for readability
 
-  /**
-   * @param result direct response eg. ErrorResult or SuccessResult (potentially with embedded "data")
-   * @returns best guess at an error message
-   */
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  getGiveCreationErrorMessage(result: any) {
-    return (
-      result.error?.userMessage ||
-      result.error?.error ||
-      result.response?.data?.error?.message
-    );
-  }
-
   explainData() {
     this.$notify(
       {
@@ -391,6 +973,118 @@ export default class GiftedDialog extends Vue {
       -1,
     );
   }
+
+  selectGiver(contact?: Contact) {
+    if (contact) {
+      this.giver = {
+        did: contact.did,
+        name: contact.name || contact.did,
+      };
+    } else {
+      this.giver = {
+        did: "",
+        name: "",
+      };
+    }
+    this.firstStep = false;
+  }
+
+  goBackToStep1(step: string) {
+    this.stepType = step;
+    this.firstStep = true;
+  }
+
+  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.$notify(
+        {
+          group: "alert",
+          type: "danger",
+          title: "Error",
+          text: "Failed to load projects",
+        },
+        3000,
+      );
+    }
+  }
+
+  selectProject(project: PlanData) {
+    this.giver = {
+      name: project.name,
+      image: project.image,
+      handleId: project.handleId,
+    };
+    this.receiver = {
+      did: this.activeDid,
+      name: "You",
+    };
+    this.firstStep = false;
+  }
+
+  selectRecipient(contact?: Contact) {
+    if (contact) {
+      this.receiver = {
+        did: contact.did,
+        name: contact.name || contact.did,
+      };
+    } else {
+      this.receiver = {
+        did: "",
+        name: "",
+      };
+    }
+    this.firstStep = false;
+  }
+
+  selectRecipientProject(project: PlanData) {
+    this.receiver = {
+      // no did, because it's a project
+      name: project.name,
+      image: project.image,
+      handleId: project.handleId,
+    };
+    this.firstStep = false;
+  }
+
+  // Computed property for the query parameters
+  get giftedDetailsQuery() {
+    return {
+      amountInput: this.amountInput,
+      description: this.description,
+      giverDid: this.giverEntityType === "person" ? this.giver?.did : undefined,
+      giverName: this.giver?.name,
+      offerId: this.offerId,
+      fulfillsProjectId: this.giverEntityType === "person" && this.recipientEntityType === "project"
+        ? this.toProjectId
+        : undefined,
+      providerProjectId: this.giverEntityType === "project" && this.recipientEntityType === "person"
+        ? this.giver?.handleId
+        : this.fromProjectId,
+      recipientDid: this.receiver?.did,
+      recipientName: this.receiver?.name,
+      unitCode: this.unitCode,
+    };
+  }
+
+  // Computed property to get unit options
+  get unitOptions() {
+    return this.libsUtil.UNIT_SHORT;
+  }
 }
 </script>
 

src/components/GiftedPrompts.vue

@@ -227,6 +227,7 @@ export default class GivenPrompts extends Vue {
 
     let someContactDbIndex = Math.floor(Math.random() * this.numContacts);
     let count = 0;
+
     // as long as the index has an entry, loop
     while (
       this.shownContactDbIndices[someContactDbIndex] != null &&
@@ -245,9 +246,8 @@ export default class GivenPrompts extends Vue {
         [someContactDbIndex],
       );
       if (result) {
-        this.currentContact = databaseUtil.mapQueryResultToValues(result)[
-          someContactDbIndex
-        ] as unknown as Contact;
+        const mappedContacts = databaseUtil.mapQueryResultToValues(result);
+        this.currentContact = mappedContacts[0] as unknown as Contact;
       }
       if (USE_DEXIE_DB) {
         await db.open();

src/components/HiddenDidDialog.vue

@@ -48,12 +48,15 @@
                   <span>
                     {{ didInfo(visDid) }}
                     <span v-if="!serverUtil.isEmptyOrHiddenDid(visDid)">
-                      <a :href="`/did/${visDid}`" class="text-blue-500">
+                      <router-link
+                        :to="{ path: '/did/' + encodeURIComponent(visDid) }"
+                        class="text-blue-500"
+                      >
                         <font-awesome
                           icon="arrow-up-right-from-square"
                           class="fa-fw"
                         />
-                      </a>
+                      </router-link>
                     </span>
                   </span>
                 </div>
@@ -74,7 +77,7 @@
             If you'd like an introduction,
             <a
               class="text-blue-500"
-              @click="copyToClipboard('A link to this page', windowLocation)"
+              @click="copyToClipboard('A link to this page', deepLinkUrl)"
               >click here to copy this page, paste it into a message, and ask if
               they'll tell you more about the {{ roleName }}.</a
             >
@@ -101,7 +104,7 @@ import * as R from "ramda";
 import { useClipboard } from "@vueuse/core";
 import { Contact } from "../db/tables/contacts";
 import * as serverUtil from "../libs/endorserServer";
-import { NotificationIface } from "../constants/app";
+import { APP_SERVER, NotificationIface } from "../constants/app";
 
 @Component
 export default class HiddenDidDialog extends Vue {
@@ -114,7 +117,8 @@ export default class HiddenDidDialog extends Vue {
   activeDid = "";
   allMyDids: Array<string> = [];
   canShare = false;
-  windowLocation = window.location.href;
+  deepLinkPathSuffix = "";
+  deepLinkUrl = window.location.href; // this is changed to a deep link in the setup
 
   R = R;
   serverUtil = serverUtil;
@@ -126,17 +130,21 @@ export default class HiddenDidDialog extends Vue {
   }
 
   open(
+    deepLinkPathSuffix: string,
     roleName: string,
     visibleToDids: string[],
     allContacts: Array<Contact>,
     activeDid: string,
     allMyDids: Array<string>,
   ) {
+    this.deepLinkPathSuffix = deepLinkPathSuffix;
     this.roleName = roleName;
     this.visibleToDids = visibleToDids;
     this.allContacts = allContacts;
     this.activeDid = activeDid;
     this.allMyDids = allMyDids;
+
+    this.deepLinkUrl = APP_SERVER + "/deep-link/" + this.deepLinkPathSuffix;
     this.isOpen = true;
   }
 
@@ -170,11 +178,11 @@ export default class HiddenDidDialog extends Vue {
   }
 
   onClickShareClaim() {
-    this.copyToClipboard("A link to this page", this.windowLocation);
+    this.copyToClipboard("A link to this page", this.deepLinkUrl);
     window.navigator.share({
       title: "Help Connect Me",
       text: "I'm trying to find the people who recorded this. Can you help me?",
-      url: this.windowLocation,
+      url: this.deepLinkUrl,
     });
   }
 }

src/components/IconRenderer.vue

@@ -0,0 +1,90 @@
+<template>
+  <svg
+    v-if="iconData"
+    :class="svgClass"
+    :fill="fill"
+    :stroke="stroke"
+    :viewBox="viewBox"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path v-for="(path, index) in iconData.paths" :key="index" v-bind="path" />
+  </svg>
+</template>
+
+<script lang="ts">
+import { Component, Prop, Vue } from "vue-facing-decorator";
+import icons from "../assets/icons.json";
+import { logger } from "../utils/logger";
+
+/**
+ * Icon path interface
+ */
+interface IconPath {
+  d: string;
+  fillRule?: string;
+  clipRule?: string;
+  strokeLinecap?: string;
+  strokeLinejoin?: string;
+  strokeWidth?: string | number;
+  fill?: string;
+  stroke?: string;
+}
+
+/**
+ * Icon data interface
+ */
+interface IconData {
+  paths: IconPath[];
+}
+
+/**
+ * Icons JSON structure
+ */
+interface IconsJson {
+  [key: string]: IconPath | IconData;
+}
+
+/**
+ * Icon Renderer Component
+ *
+ * This component loads SVG icon definitions from a JSON file and renders them
+ * as SVG elements. It provides a clean way to use icons without cluttering
+ * templates with long SVG path definitions.
+ *
+ * @author Matthew Raymer
+ * @version 1.0.0
+ * @since 2024
+ */
+@Component({
+  name: "IconRenderer",
+})
+export default class IconRenderer extends Vue {
+  @Prop({ required: true }) readonly iconName!: string;
+  @Prop({ default: "h-5 w-5" }) readonly svgClass!: string;
+  @Prop({ default: "none" }) readonly fill!: string;
+  @Prop({ default: "currentColor" }) readonly stroke!: string;
+  @Prop({ default: "0 0 24 24" }) readonly viewBox!: string;
+
+  /**
+   * Get the icon data for the specified icon name
+   *
+   * @returns {IconData | null} The icon data object or null if not found
+   */
+  get iconData(): IconData | null {
+    const icon = (icons as IconsJson)[this.iconName];
+    if (!icon) {
+      logger.warn(`Icon "${this.iconName}" not found in icons.json`);
+      return null;
+    }
+
+    // Convert single path to array format for consistency
+    if ("d" in icon) {
+      return {
+        paths: [icon as IconPath],
+      };
+    }
+
+    return icon as IconData;
+  }
+}
+</script>

src/components/OfferDialog.vue

@@ -83,10 +83,7 @@
 import { Vue, Component, Prop } from "vue-facing-decorator";
 
 import { NotificationIface, USE_DEXIE_DB } from "../constants/app";
-import {
-  createAndSubmitOffer,
-  serverMessageForUser,
-} from "../libs/endorserServer";
+import { createAndSubmitOffer } from "../libs/endorserServer";
 import * as libsUtil from "../libs/util";
 import * as databaseUtil from "../db/databaseUtil";
 import { retrieveSettingsForActiveAccount } from "../db/index";
@@ -250,7 +247,7 @@ export default class OfferDialog extends Vue {
       );
 
       if (!result.success) {
-        const errorMessage = this.getOfferCreationErrorMessage(result);
+        const errorMessage = result.error;
         logger.error("Error with offer creation result:", result);
         this.$notify(
           {
@@ -290,21 +287,6 @@ export default class OfferDialog extends Vue {
       );
     }
   }
-
-  // Helper functions for readability
-
-  /**
-   * @param result direct response eg. ErrorResult or SuccessResult (potentially with embedded "data")
-   * @returns best guess at an error message
-   */
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  getOfferCreationErrorMessage(result: any) {
-    return (
-      serverMessageForUser(result) ||
-      result.error?.userMessage ||
-      result.error?.error
-    );
-  }
 }
 </script>
 

src/components/OnboardingDialog.vue

@@ -259,7 +259,7 @@ export default class OnboardingDialog extends Vue {
     this.visible = true;
     if (this.page === OnboardPage.Create) {
       // we'll assume that they've been through all the other pages
-      await databaseUtil.updateAccountSettings(this.activeDid, {
+      await databaseUtil.updateDidSpecificSettings(this.activeDid, {
         finishedOnboarding: true,
       });
       if (USE_DEXIE_DB) {
@@ -273,7 +273,7 @@ export default class OnboardingDialog extends Vue {
   async onClickClose(done?: boolean, goHome?: boolean) {
     this.visible = false;
     if (done) {
-      await databaseUtil.updateAccountSettings(this.activeDid, {
+      await databaseUtil.updateDidSpecificSettings(this.activeDid, {
         finishedOnboarding: true,
       });
       if (USE_DEXIE_DB) {

src/components/TopMessage.vue

@@ -38,14 +38,13 @@ export default class TopMessage extends Vue {
         settings.apiServer !== AppString.PROD_ENDORSER_API_SERVER
       ) {
         const didPrefix = settings.activeDid?.slice(11, 15);
-        this.message = "You're linked to a non-prod server, user " + didPrefix;
+        this.message = "You're not using prod, user " + didPrefix;
       } else if (
         settings.warnIfProdServer &&
         settings.apiServer === AppString.PROD_ENDORSER_API_SERVER
       ) {
         const didPrefix = settings.activeDid?.slice(11, 15);
-        this.message =
-          "You're linked to the production server, user " + didPrefix;
+        this.message = "You are using prod, user " + didPrefix;
       }
     } catch (err: unknown) {
       this.$notify(

src/db-sql/migration.ts

@@ -1,4 +1,7 @@
-import migrationService from "../services/migrationService";
+import {
+  registerMigration,
+  runMigrations as runMigrationsService,
+} from "../services/migrationService";
 import { DEFAULT_ENDORSER_API_SERVER } from "@/constants/app";
 import { arrayBufferToBase64 } from "@/libs/crypto";
 
@@ -31,7 +34,6 @@ const secretBase64 = arrayBufferToBase64(randomBytes);
 const MIGRATIONS = [
   {
     name: "001_initial",
-    // see ../db/tables files for explanations of the fields
     sql: `
       CREATE TABLE IF NOT EXISTS accounts (
         id INTEGER PRIMARY KEY AUTOINCREMENT,
@@ -116,6 +118,12 @@ const MIGRATIONS = [
       );
       `,
   },
+  {
+    name: "002_add_iViewContent_to_contacts",
+    sql: `
+      ALTER TABLE contacts ADD COLUMN iViewContent BOOLEAN DEFAULT TRUE;
+    `,
+  },
 ];
 
 /**
@@ -123,16 +131,12 @@ const MIGRATIONS = [
  * @param extractMigrationNames - A function that extracts the names (string array) from "select name from migrations"
  */
 export async function runMigrations<T>(
-  sqlExec: (sql: string) => Promise<unknown>,
-  sqlQuery: (sql: string) => Promise<T>,
+  sqlExec: (sql: string, params?: unknown[]) => Promise<unknown>,
+  sqlQuery: (sql: string, params?: unknown[]) => Promise<T>,
   extractMigrationNames: (result: T) => Set<string>,
 ): Promise<void> {
   for (const migration of MIGRATIONS) {
-    migrationService.registerMigration(migration);
+    registerMigration(migration);
   }
-  await migrationService.runMigrations(
-    sqlExec,
-    sqlQuery,
-    extractMigrationNames,
-  );
+  await runMigrationsService(sqlExec, sqlQuery, extractMigrationNames);
 }

src/db/databaseUtil.ts

@@ -37,7 +37,20 @@ export async function updateDefaultSettings(
   }
 }
 
-export async function updateAccountSettings(
+export async function insertDidSpecificSettings(
+  did: string,
+  settings: Partial<Settings> = {},
+): Promise<boolean> {
+  const platform = PlatformServiceFactory.getInstance();
+  const { sql, params } = generateInsertStatement(
+    { ...settings, accountDid: did }, // make sure accountDid is set to the given value
+    "settings",
+  );
+  const result = await platform.dbExec(sql, params);
+  return result.changes === 1;
+}
+
+export async function updateDidSpecificSettings(
   accountDid: string,
   settingsChanges: Settings,
 ): Promise<boolean> {
@@ -96,9 +109,6 @@ export async function retrieveSettingsForActiveAccount(): Promise<Settings> {
     const defaultSettings = await retrieveSettingsForDefaultAccount();
     // If no active DID, return defaults
     if (!defaultSettings.activeDid) {
-      logConsoleAndDb(
-        "[databaseUtil] No active DID found, returning default settings",
-      );
       return defaultSettings;
     }
 
@@ -111,9 +121,7 @@ export async function retrieveSettingsForActiveAccount(): Promise<Settings> {
       );
 
       if (!result?.values?.length) {
-        logConsoleAndDb(
-          `[databaseUtil] No account-specific settings found for ${defaultSettings.activeDid}`,
-        );
+        // we created DID-specific settings when generated or imported, so this shouldn't happen
         return defaultSettings;
       }
 
@@ -122,6 +130,7 @@ export async function retrieveSettingsForActiveAccount(): Promise<Settings> {
         result.columns,
         result.values,
       )[0] as Settings;
+
       const overrideSettingsFiltered = Object.fromEntries(
         Object.entries(overrideSettings).filter(([_, v]) => v !== null),
       );
@@ -131,17 +140,7 @@ export async function retrieveSettingsForActiveAccount(): Promise<Settings> {
 
       // Handle searchBoxes parsing
       if (settings.searchBoxes) {
-        try {
-          // @ts-expect-error - the searchBoxes field is a string in the DB
-          settings.searchBoxes = JSON.parse(settings.searchBoxes);
-        } catch (error) {
-          logConsoleAndDb(
-            `[databaseUtil] Failed to parse searchBoxes for ${defaultSettings.activeDid}: ${error}`,
-            true,
-          );
-          // Reset to empty array on parse failure
-          settings.searchBoxes = [];
-        }
+        settings.searchBoxes = parseJsonField(settings.searchBoxes, []);
       }
 
       return settings;
@@ -220,18 +219,36 @@ export async function logConsoleAndDb(
   isError = false,
 ): Promise<void> {
   if (isError) {
-    logger.error(`${new Date().toISOString()} ${message}`);
+    logger.error(`${new Date().toISOString()}`, message);
   } else {
-    logger.log(`${new Date().toISOString()} ${message}`);
+    logger.log(`${new Date().toISOString()}`, message);
   }
   await logToDb(message);
 }
 
 /**
- * Generates an SQL INSERT statement and parameters from a model object.
- * @param model The model object containing fields to update
- * @param tableName The name of the table to update
- * @returns Object containing the SQL statement and parameters array
+ * Generates SQL INSERT statement and parameters from a model object
+ *
+ * This helper function creates a parameterized SQL INSERT statement
+ * from a JavaScript object. It filters out undefined values and
+ * creates the appropriate SQL syntax with placeholders.
+ *
+ * The function is used internally by the migration functions to
+ * safely insert data into the SQLite database.
+ *
+ * @function generateInsertStatement
+ * @param {Record<string, unknown>} model - The model object containing fields to insert
+ * @param {string} tableName - The name of the table to insert into
+ * @returns {Object} Object containing the SQL statement and parameters array
+ * @returns {string} returns.sql - The SQL INSERT statement
+ * @returns {unknown[]} returns.params - Array of parameter values
+ * @example
+ * ```typescript
+ * const contact = { did: 'did:example:123', name: 'John Doe' };
+ * const { sql, params } = generateInsertStatement(contact, 'contacts');
+ * // sql: "INSERT INTO contacts (did, name) VALUES (?, ?)"
+ * // params: ['did:example:123', 'John Doe']
+ * ```
  */
 export function generateInsertStatement(
   model: Record<string, unknown>,
@@ -241,6 +258,7 @@ export function generateInsertStatement(
   const values = Object.values(model).filter((value) => value !== undefined);
   const placeholders = values.map(() => "?").join(", ");
   const insertSql = `INSERT INTO ${tableName} (${columns.join(", ")}) VALUES (${placeholders})`;
+
   return {
     sql: insertSql,
     params: values,
@@ -248,12 +266,30 @@ export function generateInsertStatement(
 }
 
 /**
- * Generates an SQL UPDATE statement and parameters from a model object.
- * @param model The model object containing fields to update
- * @param tableName The name of the table to update
- * @param whereClause The WHERE clause for the update (e.g. "id = ?")
- * @param whereParams Parameters for the WHERE clause
- * @returns Object containing the SQL statement and parameters array
+ * Generates SQL UPDATE statement and parameters from a model object
+ *
+ * This helper function creates a parameterized SQL UPDATE statement
+ * from a JavaScript object. It filters out undefined values and
+ * creates the appropriate SQL syntax with placeholders.
+ *
+ * The function is used internally by the migration functions to
+ * safely update data in the SQLite database.
+ *
+ * @function generateUpdateStatement
+ * @param {Record<string, unknown>} model - The model object containing fields to update
+ * @param {string} tableName - The name of the table to update
+ * @param {string} whereClause - The WHERE clause for the update (e.g. "id = ?")
+ * @param {unknown[]} [whereParams=[]] - Parameters for the WHERE clause
+ * @returns {Object} Object containing the SQL statement and parameters array
+ * @returns {string} returns.sql - The SQL UPDATE statement
+ * @returns {unknown[]} returns.params - Array of parameter values
+ * @example
+ * ```typescript
+ * const contact = { name: 'Jane Doe' };
+ * const { sql, params } = generateUpdateStatement(contact, 'contacts', 'did = ?', ['did:example:123']);
+ * // sql: "UPDATE contacts SET name = ? WHERE did = ?"
+ * // params: ['Jane Doe', 'did:example:123']
+ * ```
  */
 export function generateUpdateStatement(
   model: Record<string, unknown>,
@@ -312,3 +348,115 @@ export function mapColumnsToValues(
     return obj;
   });
 }
+
+/**
+ * Debug function to inspect raw settings data in the database
+ * This helps diagnose issues with data corruption or malformed JSON
+ * @param did Optional DID to inspect specific account settings
+ * @author Matthew Raymer
+ */
+export async function debugSettingsData(did?: string): Promise<void> {
+  try {
+    const platform = PlatformServiceFactory.getInstance();
+
+    // Get all settings records
+    const allSettings = await platform.dbQuery("SELECT * FROM settings");
+
+    logConsoleAndDb(
+      `[DEBUG] Total settings records: ${allSettings?.values?.length || 0}`,
+      false,
+    );
+
+    if (allSettings?.values?.length) {
+      allSettings.values.forEach((row, index) => {
+        const settings = mapColumnsToValues(allSettings.columns, [row])[0];
+        logConsoleAndDb(`[DEBUG] Settings record ${index + 1}:`, false);
+        logConsoleAndDb(`[DEBUG] - ID: ${settings.id}`, false);
+        logConsoleAndDb(`[DEBUG] - accountDid: ${settings.accountDid}`, false);
+        logConsoleAndDb(`[DEBUG] - activeDid: ${settings.activeDid}`, false);
+
+        if (settings.searchBoxes) {
+          logConsoleAndDb(
+            `[DEBUG] - searchBoxes type: ${typeof settings.searchBoxes}`,
+            false,
+          );
+          logConsoleAndDb(
+            `[DEBUG] - searchBoxes value: ${String(settings.searchBoxes)}`,
+            false,
+          );
+
+          // Try to parse it
+          try {
+            const parsed = JSON.parse(String(settings.searchBoxes));
+            logConsoleAndDb(
+              `[DEBUG] - searchBoxes parsed successfully: ${JSON.stringify(parsed)}`,
+              false,
+            );
+          } catch (parseError) {
+            logConsoleAndDb(
+              `[DEBUG] - searchBoxes parse error: ${parseError}`,
+              true,
+            );
+          }
+        }
+
+        logConsoleAndDb(
+          `[DEBUG] - Full record: ${JSON.stringify(settings, null, 2)}`,
+          false,
+        );
+      });
+    }
+
+    // If specific DID provided, also check accounts table
+    if (did) {
+      const account = await platform.dbQuery(
+        "SELECT * FROM accounts WHERE did = ?",
+        [did],
+      );
+      logConsoleAndDb(
+        `[DEBUG] Account for ${did}: ${JSON.stringify(account, null, 2)}`,
+        false,
+      );
+    }
+  } catch (error) {
+    logConsoleAndDb(`[DEBUG] Error inspecting settings data: ${error}`, true);
+  }
+}
+
+/**
+ * Platform-agnostic JSON parsing utility
+ * Handles different SQLite implementations:
+ * - Web SQLite (wa-sqlite/absurd-sql): Auto-parses JSON strings to objects
+ * - Capacitor SQLite: Returns raw strings that need manual parsing
+ *
+ * @param value The value to parse (could be string or already parsed object)
+ * @param defaultValue Default value if parsing fails
+ * @returns Parsed object or default value
+ * @author Matthew Raymer
+ */
+export function parseJsonField<T>(value: unknown, defaultValue: T): T {
+  try {
+    // If already an object (web SQLite auto-parsed), return as-is
+    if (typeof value === "object" && value !== null) {
+      return value as T;
+    }
+
+    // If it's a string (Capacitor SQLite or fallback), parse it
+    if (typeof value === "string") {
+      return JSON.parse(value) as T;
+    }
+
+    // If it's null/undefined, return default
+    if (value === null || value === undefined) {
+      return defaultValue;
+    }
+
+    return defaultValue;
+  } catch (error) {
+    logConsoleAndDb(
+      `[databaseUtil] Failed to parse JSON field: ${error}`,
+      true,
+    );
+    return defaultValue;
+  }
+}

src/db/tables/README.md

@@ -1 +1 @@
-Check the contact & settings export to see whether you want your new table to be included in it.
+# Check the contact & settings export to see whether you want your new table to be included in it

src/db/tables/contacts.ts

@@ -1,15 +1,16 @@
-export interface ContactMethod {
+export type ContactMethod = {
   label: string;
   type: string; // eg. "EMAIL", "SMS", "WHATSAPP", maybe someday "GOOGLE-CONTACT-API"
   value: string;
-}
+};
 
-export interface Contact {
+export type Contact = {
   //
-  // When adding a property, consider whether it should be added when exporting & sharing contacts.
+  // When adding a property, consider whether it should be added when exporting & sharing contacts, eg. DataExportSection
 
   did: string;
   contactMethods?: Array<ContactMethod>;
+  iViewContent?: boolean;
   name?: string;
   nextPubKeyHashB64?: string; // base64-encoded SHA256 hash of next public key
   notes?: string;
@@ -17,7 +18,17 @@ export interface Contact {
   publicKeyBase64?: string;
   seesMe?: boolean; // cached value of the server setting
   registered?: boolean; // cached value of the server setting
-}
+};
+
+/**
+ * This is for those cases (eg. with a DB) where every field is a primitive (and not an object).
+ *
+ * This is so that we can reuse most of the type and don't have to maintain another copy.
+ * Another approach uses typescript conditionals: https://chatgpt.com/share/6855cdc3-ab5c-8007-8525-726612016eb2
+ */
+export type ContactWithJsonStrings = Omit<Contact, "contactMethods"> & {
+  contactMethods?: string;
+};
 
 export const ContactSchema = {
   contacts: "&did, name", // no need to key by other things

src/db/tables/settings.ts

@@ -64,6 +64,11 @@ export type Settings = {
   webPushServer?: string; // Web Push server URL
 };
 
+// type of settings where the searchBoxes are JSON strings instead of objects
+export type SettingsWithJsonStrings = Settings & {
+  searchBoxes: string;
+};
+
 export function checkIsAnyFeedFilterOn(settings: Settings): boolean {
   return !!(settings?.filterFeedByNearby || settings?.filterFeedByVisible);
 }

src/interfaces/claims-result.ts

@@ -1,6 +1,4 @@
-import { AxiosResponse } from "axios";
 import { GiverReceiverInputInfo } from "../libs/util";
-import { ErrorResult, ResultWithType } from "./common";
 
 export interface GiverOutputInfo {
   action: string;
@@ -47,12 +45,3 @@ export interface ProviderInfo {
    */
   linkConfirmed: boolean;
 }
-
-// Type for createAndSubmitClaim result
-export type CreateAndSubmitClaimResult = SuccessResult | ErrorResult;
-
-// Update SuccessResult to use ClaimResult
-export interface SuccessResult extends ResultWithType {
-  type: "success";
-  response: AxiosResponse<ClaimResult>;
-}

src/interfaces/common.ts

@@ -15,10 +15,6 @@ export interface GenericCredWrapper<T extends GenericVerifiableCredential> {
   publicUrls?: Record<string, string>;
 }
 
-export interface ResultWithType {
-  type: string;
-}
-
 export interface ErrorResponse {
   error?: {
     message?: string;
@@ -30,11 +26,6 @@ export interface InternalError {
   userMessage?: string;
 }
 
-export interface ErrorResult extends ResultWithType {
-  type: "error";
-  error: InternalError;
-}
-
 export interface KeyMeta {
   did: string;
   publicKeyHex: string;

src/interfaces/deepLinks.ts

@@ -29,18 +29,17 @@ import { z } from "zod";
 
 // Add a union type of all valid route paths
 export const VALID_DEEP_LINK_ROUTES = [
-  "user-profile",
-  "project-details",
-  "onboard-meeting-setup",
-  "invite-one-accept",
-  "contact-import",
-  "confirm-gift",
+  // note that similar lists are below in deepLinkSchemas and in src/services/deepLinks.ts
   "claim",
-  "claim-cert",
   "claim-add-raw",
-  "contact-edit",
-  "contacts",
+  "claim-cert",
+  "confirm-gift",
+  "contact-import",
   "did",
+  "invite-one-accept",
+  "onboard-meeting-setup",
+  "project",
+  "user-profile",
 ] as const;
 
 // Create a type from the array
@@ -58,44 +57,39 @@ export const routeSchema = z.enum(VALID_DEEP_LINK_ROUTES);
 
 // Parameter validation schemas for each route type
 export const deepLinkSchemas = {
-  "user-profile": z.object({
-    id: z.string(),
-  }),
-  "project-details": z.object({
-    id: z.string(),
-  }),
-  "onboard-meeting-setup": z.object({
-    id: z.string(),
-  }),
-  "invite-one-accept": z.object({
-    id: z.string(),
-  }),
-  "contact-import": z.object({
-    jwt: z.string(),
-  }),
-  "confirm-gift": z.object({
-    id: z.string(),
-  }),
+  // note that similar lists are above in VALID_DEEP_LINK_ROUTES and in src/services/deepLinks.ts
   claim: z.object({
     id: z.string(),
   }),
-  "claim-cert": z.object({
-    id: z.string(),
-  }),
   "claim-add-raw": z.object({
     id: z.string(),
     claim: z.string().optional(),
     claimJwtId: z.string().optional(),
   }),
-  "contact-edit": z.object({
-    did: z.string(),
+  "claim-cert": z.object({
+    id: z.string(),
   }),
-  contacts: z.object({
-    contacts: z.string(), // JSON string of contacts array
+  "confirm-gift": z.object({
+    id: z.string(),
+  }),
+  "contact-import": z.object({
+    jwt: z.string(),
   }),
   did: z.object({
     did: z.string(),
   }),
+  "invite-one-accept": z.object({
+    jwt: z.string(),
+  }),
+  "onboard-meeting-setup": z.object({
+    id: z.string(),
+  }),
+  project: z.object({
+    id: z.string(),
+  }),
+  "user-profile": z.object({
+    id: z.string(),
+  }),
 };
 
 export type DeepLinkParams = {

src/interfaces/index.ts

@@ -1,5 +1,6 @@
 export type {
   // From common.ts
+  CreateAndSubmitClaimResult,
   GenericCredWrapper,
   GenericVerifiableCredential,
   KeyMeta,
@@ -18,11 +19,6 @@ export type {
   RegisterActionClaim,
 } from "./claims";
 
-export type {
-  // From claims-result.ts
-  CreateAndSubmitClaimResult,
-} from "./claims-result";
-
 export type {
   // From records.ts
   PlanSummaryRecord,

src/libs/endorserServer.ts

@@ -979,7 +979,7 @@ export const createAndSubmitConfirmation = async (
   handleId: string | undefined,
   apiServer: string,
   axios: Axios,
-) => {
+): Promise<CreateAndSubmitClaimResult> => {
   const goodClaim = removeSchemaContext(
     removeVisibleToDids(
       addLastClaimOrHandleAsIdIfMissing(claim, lastClaimId, handleId),
@@ -1074,7 +1074,8 @@ export async function generateEndorserJwtUrlForAccount(
 
   const vcJwt = await createEndorserJwtForDid(account.did, contactInfo);
 
-  const viewPrefix = APP_SERVER + CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI;
+  const viewPrefix =
+    APP_SERVER + "/deep-link" + CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI;
   return viewPrefix + vcJwt;
 }
 

src/libs/fontawesome.ts

@@ -10,8 +10,8 @@ import {
   faArrowLeft,
   faArrowRight,
   faArrowRotateBackward,
-  faArrowUpRightFromSquare,
   faArrowUp,
+  faArrowUpRightFromSquare,
   faBan,
   faBitcoinSign,
   faBurst,
@@ -29,6 +29,7 @@ import {
   faCircleCheck,
   faCircleInfo,
   faCircleQuestion,
+  faCircleRight,
   faCircleUser,
   faClock,
   faCoins,
@@ -60,6 +61,7 @@ import {
   faLightbulb,
   faLink,
   faLocationDot,
+  faLock,
   faLongArrowAltLeft,
   faLongArrowAltRight,
   faMagnifyingGlass,
@@ -79,6 +81,7 @@ import {
   faSquareCaretDown,
   faSquareCaretUp,
   faSquarePlus,
+  faThumbtack,
   faTrashCan,
   faTriangleExclamation,
   faUser,
@@ -92,8 +95,8 @@ library.add(
   faArrowLeft,
   faArrowRight,
   faArrowRotateBackward,
-  faArrowUpRightFromSquare,
   faArrowUp,
+  faArrowUpRightFromSquare,
   faBan,
   faBitcoinSign,
   faBurst,
@@ -111,6 +114,7 @@ library.add(
   faCircleCheck,
   faCircleInfo,
   faCircleQuestion,
+  faCircleRight,
   faCircleUser,
   faClock,
   faCoins,
@@ -142,6 +146,7 @@ library.add(
   faLightbulb,
   faLink,
   faLocationDot,
+  faLock,
   faLongArrowAltLeft,
   faLongArrowAltRight,
   faMagnifyingGlass,
@@ -161,6 +166,7 @@ library.add(
   faSquareCaretDown,
   faSquareCaretUp,
   faSquarePlus,
+  faThumbtack,
   faTrashCan,
   faTriangleExclamation,
   faUser,

src/libs/util.ts

@@ -17,7 +17,7 @@ import {
   updateDefaultSettings,
 } from "../db/index";
 import { Account, AccountEncrypted } from "../db/tables/accounts";
-import { Contact } from "../db/tables/contacts";
+import { Contact, ContactWithJsonStrings } from "../db/tables/contacts";
 import * as databaseUtil from "../db/databaseUtil";
 import { DEFAULT_PASSKEY_EXPIRATION_MINUTES } from "../db/tables/settings";
 import {
@@ -44,10 +44,14 @@ import { logger } from "../utils/logger";
 import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
 import { sha256 } from "ethereum-cryptography/sha256";
 import { IIdentifier } from "@veramo/core";
+import { insertDidSpecificSettings, parseJsonField } from "../db/databaseUtil";
+import { DEFAULT_ROOT_DERIVATION_PATH } from "./crypto";
 
 export interface GiverReceiverInputInfo {
   did?: string;
   name?: string;
+  image?: string;
+  handleId?: string;
 }
 
 export enum OnboardPage {
@@ -697,6 +701,7 @@ export async function saveNewIdentity(
     ];
     await platformService.dbExec(sql, params);
     await databaseUtil.updateDefaultSettings({ activeDid: identity.did });
+    await databaseUtil.insertDidSpecificSettings(identity.did);
 
     if (USE_DEXIE_DB) {
       // one of the few times we use accountsDBPromise directly; try to avoid more usage
@@ -710,6 +715,7 @@ export async function saveNewIdentity(
         publicKeyHex: identity.keys[0].publicKeyHex,
       });
       await updateDefaultSettings({ activeDid: identity.did });
+      await insertDidSpecificSettings(identity.did);
     }
   } catch (error) {
     logger.error("Failed to update default settings:", error);
@@ -732,7 +738,9 @@ export const generateSaveAndActivateIdentity = async (): Promise<string> => {
   const newId = newIdentifier(address, publicHex, privateHex, derivationPath);
 
   await saveNewIdentity(newId, mnemonic, derivationPath);
-  await databaseUtil.updateAccountSettings(newId.did, { isRegistered: false });
+  await databaseUtil.updateDidSpecificSettings(newId.did, {
+    isRegistered: false,
+  });
   if (USE_DEXIE_DB) {
     await updateAccountSettings(newId.did, { isRegistered: false });
   }
@@ -774,7 +782,7 @@ export const registerSaveAndActivatePasskey = async (
 ): Promise<Account> => {
   const account = await registerAndSavePasskey(keyName);
   await databaseUtil.updateDefaultSettings({ activeDid: account.did });
-  await databaseUtil.updateAccountSettings(account.did, {
+  await databaseUtil.updateDidSpecificSettings(account.did, {
     isRegistered: false,
   });
   if (USE_DEXIE_DB) {
@@ -862,7 +870,7 @@ export const contactToCsvLine = (contact: Contact): string => {
 
   // Handle contactMethods array by stringifying it
   const contactMethodsStr = contact.contactMethods
-    ? escapeField(JSON.stringify(contact.contactMethods))
+    ? escapeField(JSON.stringify(parseJsonField(contact.contactMethods, [])))
     : "";
 
   const fields = [
@@ -877,6 +885,71 @@ export const contactToCsvLine = (contact: Contact): string => {
   return fields.join(",");
 };
 
+/**
+ * Parses a CSV line into a Contact object. See contactToCsvLine for the format.
+ * @param lineRaw - The CSV line to parse
+ * @returns A Contact object
+ */
+export const csvLineToContact = (lineRaw: string): Contact => {
+  // Note that Endorser Mobile puts name first, then did, etc.
+  let line = lineRaw.trim();
+  let did, publicKeyInput, seesMe, registered;
+  let name;
+  let commaPos1 = -1;
+  if (line.startsWith('"')) {
+    let doubleDoubleQuotePos = line.lastIndexOf('""') + 2;
+    if (doubleDoubleQuotePos === -1) {
+      doubleDoubleQuotePos = 1;
+    }
+    const quote2Pos = line.indexOf('"', doubleDoubleQuotePos);
+    if (quote2Pos > -1) {
+      commaPos1 = line.indexOf(",", quote2Pos);
+      name = line.substring(1, quote2Pos).trim();
+      name = name.replace(/""/g, '"');
+    } else {
+      // something is weird with one " to start, so ignore it and start after "
+      line = line.substring(1);
+      commaPos1 = line.indexOf(",");
+      name = line.substring(0, commaPos1).trim();
+    }
+  } else {
+    commaPos1 = line.indexOf(",");
+    name = line.substring(0, commaPos1).trim();
+  }
+  if (commaPos1 > -1) {
+    did = line.substring(commaPos1 + 1).trim();
+    const commaPos2 = line.indexOf(",", commaPos1 + 1);
+    if (commaPos2 > -1) {
+      did = line.substring(commaPos1 + 1, commaPos2).trim();
+      publicKeyInput = line.substring(commaPos2 + 1).trim();
+      const commaPos3 = line.indexOf(",", commaPos2 + 1);
+      if (commaPos3 > -1) {
+        publicKeyInput = line.substring(commaPos2 + 1, commaPos3).trim();
+        seesMe = line.substring(commaPos3 + 1).trim() == "true";
+        const commaPos4 = line.indexOf(",", commaPos3 + 1);
+        if (commaPos4 > -1) {
+          seesMe = line.substring(commaPos3 + 1, commaPos4).trim() == "true";
+          registered = line.substring(commaPos4 + 1).trim() == "true";
+        }
+      }
+    }
+  }
+  // help with potential mistakes while this sharing requires copy-and-paste
+  let publicKeyBase64 = publicKeyInput;
+  if (publicKeyBase64 && /^[0-9A-Fa-f]{66}$/i.test(publicKeyBase64)) {
+    // it must be all hex (compressed public key), so convert
+    publicKeyBase64 = Buffer.from(publicKeyBase64, "hex").toString("base64");
+  }
+  const newContact: Contact = {
+    did: did || "",
+    name,
+    publicKeyBase64,
+    seesMe,
+    registered,
+  };
+  return newContact;
+};
+
 /**
  * Interface for the JSON export format of database tables
  */
@@ -903,19 +976,16 @@ export interface DatabaseExport {
  */
 export const contactsToExportJson = (contacts: Contact[]): DatabaseExport => {
   // Convert each contact to a plain object and ensure all fields are included
-  const rows = contacts.map((contact) => ({
-    did: contact.did,
-    name: contact.name || null,
-    contactMethods: contact.contactMethods
-      ? JSON.stringify(contact.contactMethods)
-      : null,
-    nextPubKeyHashB64: contact.nextPubKeyHashB64 || null,
-    notes: contact.notes || null,
-    profileImageUrl: contact.profileImageUrl || null,
-    publicKeyBase64: contact.publicKeyBase64 || null,
-    seesMe: contact.seesMe || false,
-    registered: contact.registered || false,
-  }));
+  const rows = contacts.map((contact) => {
+    const exContact: ContactWithJsonStrings = R.omit(
+      ["contactMethods"],
+      contact,
+    );
+    exContact.contactMethods = contact.contactMethods
+      ? JSON.stringify(contact.contactMethods, [])
+      : undefined;
+    return exContact;
+  });
 
   return {
     data: {
@@ -928,3 +998,38 @@ export const contactsToExportJson = (contacts: Contact[]): DatabaseExport => {
     },
   };
 };
+
+/**
+ * Imports an account from a mnemonic phrase
+ * @param mnemonic - The seed phrase to import from
+ * @param derivationPath - The derivation path to use (defaults to DEFAULT_ROOT_DERIVATION_PATH)
+ * @param shouldErase - Whether to erase existing accounts before importing
+ * @returns Promise that resolves when import is complete
+ * @throws Error if mnemonic is invalid or import fails
+ */
+export async function importFromMnemonic(
+  mnemonic: string,
+  derivationPath: string = DEFAULT_ROOT_DERIVATION_PATH,
+  shouldErase: boolean = false,
+): Promise<void> {
+  const mne: string = mnemonic.trim().toLowerCase();
+
+  // Derive address and keys from mnemonic
+  const [address, privateHex, publicHex] = deriveAddress(mne, derivationPath);
+
+  // Create new identifier
+  const newId = newIdentifier(address, publicHex, privateHex, derivationPath);
+
+  // Handle erasures
+  if (shouldErase) {
+    const platformService = PlatformServiceFactory.getInstance();
+    await platformService.dbExec("DELETE FROM accounts");
+    if (USE_DEXIE_DB) {
+      const accountsDB = await accountsDBPromise;
+      await accountsDB.accounts.clear();
+    }
+  }
+
+  // Save the new identity
+  await saveNewIdentity(newId, mne, derivationPath);
+}

src/main.capacitor.ts

@@ -34,8 +34,7 @@ import router from "./router";
 import { handleApiError } from "./services/api";
 import { AxiosError } from "axios";
 import { DeepLinkHandler } from "./services/deepLinks";
-import { logConsoleAndDb } from "./db/databaseUtil";
-import { logger } from "./utils/logger";
+import { logger, safeStringify } from "./utils/logger";
 
 logger.log("[Capacitor] Starting initialization");
 logger.log("[Capacitor] Platform:", process.env.VITE_PLATFORM);
@@ -72,10 +71,10 @@ const handleDeepLink = async (data: { url: string }) => {
     await router.isReady();
     await deepLinkHandler.handleDeepLink(data.url);
   } catch (error) {
-    logConsoleAndDb("[DeepLink] Error handling deep link: " + error, true);
+    logger.error("[DeepLink] Error handling deep link: ", error);
     handleApiError(
       {
-        message: error instanceof Error ? error.message : String(error),
+        message: error instanceof Error ? error.message : safeStringify(error),
       } as AxiosError,
       "deep-link",
     );

src/main.common.ts

@@ -10,15 +10,11 @@ import { FontAwesomeIcon } from "./libs/fontawesome";
 import Camera from "simple-vue-camera";
 import { logger } from "./utils/logger";
 
-const platform = process.env.VITE_PLATFORM;
-const pwa_enabled = process.env.VITE_PWA_ENABLED === "true";
-
-logger.log("Platform", JSON.stringify({ platform }));
-logger.log("PWA enabled", JSON.stringify({ pwa_enabled }));
+// const platform = process.env.VITE_PLATFORM;
+// const pwa_enabled = process.env.VITE_PWA_ENABLED === "true";
 
 // Global Error Handler
 function setupGlobalErrorHandler(app: VueApp) {
-  logger.log("[App Init] Setting up global error handler");
   app.config.errorHandler = (
     err: unknown,
     instance: ComponentPublicInstance | null,
@@ -38,30 +34,13 @@ function setupGlobalErrorHandler(app: VueApp) {
 
 // Function to initialize the app
 export function initializeApp() {
-  logger.log("[App Init] Starting app initialization");
-  logger.log("[App Init] Platform:", process.env.VITE_PLATFORM);
-
   const app = createApp(App);
-  logger.log("[App Init] Vue app created");
-
   app.component("FontAwesome", FontAwesomeIcon).component("camera", Camera);
-  logger.log("[App Init] Components registered");
-
   const pinia = createPinia();
   app.use(pinia);
-  logger.log("[App Init] Pinia store initialized");
-
   app.use(VueAxios, axios);
-  logger.log("[App Init] Axios initialized");
-
   app.use(router);
-  logger.log("[App Init] Router initialized");
-
   app.use(Notifications);
-  logger.log("[App Init] Notifications initialized");
-
   setupGlobalErrorHandler(app);
-  logger.log("[App Init] App initialization complete");
-
   return app;
 }

src/main.web.ts

@@ -5,9 +5,6 @@ import { logger } from "./utils/logger";
 const platform = process.env.VITE_PLATFORM;
 const pwa_enabled = process.env.VITE_PWA_ENABLED === "true";
 
-logger.info("[Web] PWA enabled", { pwa_enabled });
-logger.info("[Web] Platform", { platform });
-
 // Only import service worker for web builds
 if (platform !== "electron" && pwa_enabled) {
   import("./registerServiceWorker"); // Web PWA support
@@ -31,7 +28,7 @@ function sqlInit() {
 if (platform === "web" || platform === "development") {
   sqlInit();
 } else {
-  logger.info("[Web] SQL not initialized for platform", { platform });
+  logger.warn("[Web] SQL not initialized for platform", { platform });
 }
 
 app.mount("#app");

src/router/index.ts

@@ -83,6 +83,11 @@ const routes: Array<RouteRecordRaw> = [
     name: "discover",
     component: () => import("../views/DiscoverView.vue"),
   },
+  {
+    path: "/deep-link/:path*",
+    name: "deep-link",
+    component: () => import("../views/DeepLinkRedirectView.vue"),
+  },
   {
     path: "/gifted-details",
     name: "gifted-details",
@@ -143,6 +148,11 @@ const routes: Array<RouteRecordRaw> = [
     name: "logs",
     component: () => import("../views/LogView.vue"),
   },
+  {
+    path: "/database-migration",
+    name: "database-migration",
+    component: () => import("../views/DatabaseMigration.vue"),
+  },
   {
     path: "/new-activity",
     name: "new-activity",

src/services/api.ts

@@ -6,7 +6,7 @@
  */
 
 import { AxiosError } from "axios";
-import { logger } from "../utils/logger";
+import { logger, safeStringify } from "../utils/logger";
 
 /**
  * Handles API errors with platform-specific logging and error processing.
@@ -37,7 +37,8 @@ import { logger } from "../utils/logger";
  */
 export const handleApiError = (error: AxiosError, endpoint: string) => {
   if (process.env.VITE_PLATFORM === "capacitor") {
-    logger.error(`[Capacitor API Error] ${endpoint}:`, {
+    const endpointStr = safeStringify(endpoint); // we've seen this as an object in deep links
+    logger.error(`[Capacitor API Error] ${endpointStr}:`, {
       message: error.message,
       status: error.response?.status,
       data: error.response?.data,

src/services/deepLinks.ts

@@ -27,18 +27,16 @@
  * timesafari://<route>[/<param>][?queryParam1=value1&queryParam2=value2]
  *
  * Supported Routes:
- * - user-profile: View user profile
- * - project-details: View project details
- * - onboard-meeting-setup: Setup onboarding meeting
- * - invite-one-accept: Accept invitation
- * - contact-import: Import contacts
- * - confirm-gift: Confirm gift
  * - claim: View claim
- * - claim-cert: View claim certificate
  * - claim-add-raw: Add raw claim
- * - contact-edit: Edit contact
- * - contacts: View contacts
+ * - claim-cert: View claim certificate
+ * - confirm-gift
+ * - contact-import: Import contacts
  * - did: View DID
+ * - invite-one-accept: Accept invitation
+ * - onboard-meeting-members
+ * - project: View project details
+ * - user-profile: View user profile
  *
  * @example
  * const handler = new DeepLinkHandler(router);
@@ -81,18 +79,17 @@ export class DeepLinkHandler {
     string,
     { name: string; paramKey?: string }
   > = {
-    "user-profile": { name: "user-profile" },
-    "project-details": { name: "project-details" },
-    "onboard-meeting-setup": { name: "onboard-meeting-setup" },
-    "invite-one-accept": { name: "invite-one-accept" },
-    "contact-import": { name: "contact-import" },
-    "confirm-gift": { name: "confirm-gift" },
+    // note that similar lists are in src/interfaces/deepLinks.ts
     claim: { name: "claim" },
-    "claim-cert": { name: "claim-cert" },
     "claim-add-raw": { name: "claim-add-raw" },
-    "contact-edit": { name: "contact-edit", paramKey: "did" },
-    contacts: { name: "contacts" },
+    "claim-cert": { name: "claim-cert" },
+    "confirm-gift": { name: "confirm-gift" },
+    "contact-import": { name: "contact-import", paramKey: "jwt" },
     did: { name: "did", paramKey: "did" },
+    "invite-one-accept": { name: "invite-one-accept", paramKey: "jwt" },
+    "onboard-meeting-members": { name: "onboard-meeting-members" },
+    project: { name: "project" },
+    "user-profile": { name: "user-profile" },
   };
 
   /**
@@ -101,7 +98,7 @@ export class DeepLinkHandler {
    *
    * @param url - The deep link URL to parse (format: scheme://path[?query])
    * @throws {DeepLinkError} If URL format is invalid
-   * @returns Parsed URL components (path, params, query)
+   * @returns Parsed URL components (path: string, params: {KEY: string}, query: {KEY: string})
    */
   private parseDeepLink(url: string) {
     const parts = url.split("://");
@@ -117,7 +114,16 @@ export class DeepLinkHandler {
     });
 
     const [path, queryString] = parts[1].split("?");
-    const [routePath, param] = path.split("/");
+    const [routePath, ...pathParams] = path.split("/");
+    // logger.info(
+    //   "[DeepLink] Debug:",
+    //   "Route Path:",
+    //   routePath,
+    //   "Path Params:",
+    //   pathParams,
+    //   "Query String:",
+    //   queryString,
+    // );
 
     // Validate route exists before proceeding
     if (!this.ROUTE_MAP[routePath]) {
@@ -136,45 +142,14 @@ export class DeepLinkHandler {
     }
 
     const params: Record<string, string> = {};
-    if (param) {
+    if (pathParams) {
       // Now we know routePath exists in ROUTE_MAP
       const routeConfig = this.ROUTE_MAP[routePath];
-      params[routeConfig.paramKey ?? "id"] = param;
+      params[routeConfig.paramKey ?? "id"] = pathParams.join("/");
     }
     return { path: routePath, params, query };
   }
 
-  /**
-   * Processes incoming deep links and routes them appropriately.
-   * Handles validation, error handling, and routing to the correct view.
-   *
-   * @param url - The deep link URL to process
-   * @throws {DeepLinkError} If URL processing fails
-   */
-  async handleDeepLink(url: string): Promise<void> {
-    try {
-      logConsoleAndDb("[DeepLink] Processing URL: " + url, false);
-      const { path, params, query } = this.parseDeepLink(url);
-      // Ensure params is always a Record<string,string> by converting undefined to empty string
-      const sanitizedParams = Object.fromEntries(
-        Object.entries(params).map(([key, value]) => [key, value ?? ""]),
-      );
-      await this.validateAndRoute(path, sanitizedParams, query);
-    } catch (error) {
-      const deepLinkError = error as DeepLinkError;
-      logConsoleAndDb(
-        `[DeepLink] Error (${deepLinkError.code}): ${deepLinkError.message}`,
-        true,
-      );
-
-      throw {
-        code: deepLinkError.code || "UNKNOWN_ERROR",
-        message: deepLinkError.message,
-        details: deepLinkError.details,
-      };
-    }
-  }
-
   /**
    * Routes the deep link to appropriate view with validated parameters.
    * Validates route and parameters using Zod schemas before routing.
@@ -245,6 +220,39 @@ export class DeepLinkHandler {
         code: "INVALID_PARAMETERS",
         message: (error as Error).message,
         details: error,
+        params: params,
+        query: query,
+      };
+    }
+  }
+
+  /**
+   * Processes incoming deep links and routes them appropriately.
+   * Handles validation, error handling, and routing to the correct view.
+   *
+   * @param url - The deep link URL to process
+   * @throws {DeepLinkError} If URL processing fails
+   */
+  async handleDeepLink(url: string): Promise<void> {
+    try {
+      logConsoleAndDb("[DeepLink] Processing URL: " + url, false);
+      const { path, params, query } = this.parseDeepLink(url);
+      // Ensure params is always a Record<string,string> by converting undefined to empty string
+      const sanitizedParams = Object.fromEntries(
+        Object.entries(params).map(([key, value]) => [key, value ?? ""]),
+      );
+      await this.validateAndRoute(path, sanitizedParams, query);
+    } catch (error) {
+      const deepLinkError = error as DeepLinkError;
+      logConsoleAndDb(
+        `[DeepLink] Error (${deepLinkError.code}): ${deepLinkError.message}`,
+        true,
+      );
+
+      throw {
+        code: deepLinkError.code || "UNKNOWN_ERROR",
+        message: deepLinkError.message,
+        details: deepLinkError.details,
       };
     }
   }

src/services/migrationService.ts

@@ -1,60 +1,133 @@
+/**
+ * Manage database migrations as people upgrade their app over time
+ */
+
+import { logger } from "../utils/logger";
+
+/**
+ * Migration interface for database schema migrations
+ */
 interface Migration {
   name: string;
   sql: string;
 }
 
-export class MigrationService {
-  private static instance: MigrationService;
+/**
+ * Migration registry to store and manage database migrations
+ */
+class MigrationRegistry {
   private migrations: Migration[] = [];
 
-  private constructor() {}
-
-  static getInstance(): MigrationService {
-    if (!MigrationService.instance) {
-      MigrationService.instance = new MigrationService();
-    }
-    return MigrationService.instance;
-  }
-
-  registerMigration(migration: Migration) {
+  /**
+   * Register a migration with the registry
+   *
+   * @param migration - The migration to register
+   */
+  registerMigration(migration: Migration): void {
     this.migrations.push(migration);
   }
 
   /**
-   * @param sqlExec - A function that executes a SQL statement and returns some update result
-   * @param sqlQuery - A function that executes a SQL query and returns the result in some format
-   * @param extractMigrationNames - A function that extracts the names (string array) from a "select name from migrations" query
+   * Get all registered migrations
+   *
+   * @returns Array of registered migrations
    */
-  async runMigrations<T>(
-    // note that this does not take parameters because the Capacitor SQLite 'execute' is different
-    sqlExec: (sql: string) => Promise<unknown>,
-    sqlQuery: (sql: string) => Promise<T>,
-    extractMigrationNames: (result: T) => Set<string>,
-  ): Promise<void> {
-    // Create migrations table if it doesn't exist
-    await sqlExec(`
-      CREATE TABLE IF NOT EXISTS migrations (
-        id INTEGER PRIMARY KEY AUTOINCREMENT,
-        name TEXT NOT NULL UNIQUE,
-        executed_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
-      );
-    `);
+  getMigrations(): Migration[] {
+    return this.migrations;
+  }
 
-    // Get list of executed migrations
-    const result1: T = await sqlQuery("SELECT name FROM migrations;");
-    const executedMigrations = extractMigrationNames(result1);
-
-    // Run pending migrations in order
-    for (const migration of this.migrations) {
-      if (!executedMigrations.has(migration.name)) {
-        await sqlExec(migration.sql);
-
-        await sqlExec(
-          `INSERT INTO migrations (name) VALUES ('${migration.name}')`,
-        );
-      }
-    }
+  /**
+   * Clear all registered migrations
+   */
+  clearMigrations(): void {
+    this.migrations = [];
   }
 }
 
-export default MigrationService.getInstance();
+// Create a singleton instance of the migration registry
+const migrationRegistry = new MigrationRegistry();
+
+/**
+ * Register a migration with the migration service
+ *
+ * This function is used by the migration system to register database
+ * schema migrations that need to be applied to the database.
+ *
+ * @param migration - The migration to register
+ */
+export function registerMigration(migration: Migration): void {
+  migrationRegistry.registerMigration(migration);
+}
+
+/**
+ * Run all registered migrations against the database
+ *
+ * This function executes all registered migrations in order, checking
+ * which ones have already been applied to avoid duplicate execution.
+ * It creates a migrations table if it doesn't exist to track applied
+ * migrations.
+ *
+ * @param sqlExec - Function to execute SQL statements
+ * @param sqlQuery - Function to query SQL data
+ * @param extractMigrationNames - Function to extract migration names from query results
+ * @returns Promise that resolves when all migrations are complete
+ */
+export async function runMigrations<T>(
+  sqlExec: (sql: string, params?: unknown[]) => Promise<unknown>,
+  sqlQuery: (sql: string, params?: unknown[]) => Promise<T>,
+  extractMigrationNames: (result: T) => Set<string>,
+): Promise<void> {
+  try {
+    // Create migrations table if it doesn't exist
+    await sqlExec(`
+      CREATE TABLE IF NOT EXISTS migrations (
+        name TEXT PRIMARY KEY,
+        applied_at TEXT DEFAULT CURRENT_TIMESTAMP
+      );
+    `);
+
+    // Get list of already applied migrations
+    const appliedMigrationsResult = await sqlQuery(
+      "SELECT name FROM migrations",
+    );
+    const appliedMigrations = extractMigrationNames(appliedMigrationsResult);
+
+    // Get all registered migrations
+    const migrations = migrationRegistry.getMigrations();
+
+    if (migrations.length === 0) {
+      logger.warn("[MigrationService] No migrations registered");
+      return;
+    }
+
+    // Run each migration that hasn't been applied yet
+    for (const migration of migrations) {
+      if (appliedMigrations.has(migration.name)) {
+        continue;
+      }
+
+      try {
+        // Execute the migration SQL
+        await sqlExec(migration.sql);
+
+        // Record that the migration was applied
+        await sqlExec("INSERT INTO migrations (name) VALUES (?)", [
+          migration.name,
+        ]);
+
+        logger.info(
+          `[MigrationService] Successfully applied migration: ${migration.name}`,
+        );
+      } catch (error) {
+        logger.error(
+          `[MigrationService] Failed to apply migration ${migration.name}:`,
+          error,
+        );
+        throw new Error(`Migration ${migration.name} failed: ${error}`);
+      }
+    }
+  } catch (error) {
+    logger.error("[MigrationService] Migration process failed:", error);
+    throw error;
+  }
+}

src/services/platforms/CapacitorPlatformService.ts

@@ -5,6 +5,7 @@ import {
   CameraSource,
   CameraDirection,
 } from "@capacitor/camera";
+import { Capacitor } from "@capacitor/core";
 import { Share } from "@capacitor/share";
 import {
   SQLiteConnection,
@@ -247,7 +248,7 @@ export class CapacitorPlatformService implements PlatformService {
       hasFileSystem: true,
       hasCamera: true,
       isMobile: true,
-      isIOS: /iPad|iPhone|iPod/.test(navigator.userAgent),
+      isIOS: Capacitor.getPlatform() === "ios",
       hasFileDownload: false,
       needsFileHandlingInstructions: true,
       isNativeApp: true,

src/utils/logger.ts

@@ -1,6 +1,6 @@
 import { logToDb } from "../db/databaseUtil";
 
-function safeStringify(obj: unknown) {
+export function safeStringify(obj: unknown) {
   const seen = new WeakSet();
 
   return JSON.stringify(obj, (_key, value) => {
@@ -52,23 +52,18 @@ export const logger = {
     }
   },
   warn: (message: string, ...args: unknown[]) => {
-    if (
-      process.env.NODE_ENV !== "production" ||
-      process.env.VITE_PLATFORM === "capacitor" ||
-      process.env.VITE_PLATFORM === "electron"
-    ) {
-      // eslint-disable-next-line no-console
-      console.warn(message, ...args);
-      const argsString = args.length > 0 ? " - " + safeStringify(args) : "";
-      logToDb(message + argsString);
-    }
+    // eslint-disable-next-line no-console
+    console.warn(message, ...args);
+    const argsString = args.length > 0 ? " - " + safeStringify(args) : "";
+    logToDb(message + argsString);
   },
   error: (message: string, ...args: unknown[]) => {
     // Errors will always be logged
     // eslint-disable-next-line no-console
     console.error(message, ...args);
-    const argsString = args.length > 0 ? " - " + safeStringify(args) : "";
-    logToDb(message + argsString);
+    const messageString = safeStringify(message);
+    const argsString = args.length > 0 ? safeStringify(args) : "";
+    logToDb(messageString + argsString);
   },
 };
 

src/views/AccountViewView.vue

@@ -349,8 +349,9 @@
       </div>
       <div v-if="includeUserProfileLocation" class="mb-4 aspect-video">
         <p class="text-sm mb-2 text-slate-500">
-          For your security, choose a location nearby but not exactly at your
-          place.
+          The location you choose will be shared with the world until you remove
+          this checkbox. For your security, choose a location nearby but not
+          exactly at your true location, like at your town center.
         </p>
 
         <l-map
@@ -435,11 +436,11 @@
         <p class="text-sm">
           You have done
           <b
-            >{{ endorserLimits?.doneClaimsThisWeek || "?" }} claim{{
+            >{{ endorserLimits?.doneClaimsThisWeek ?? "?" }} claim{{
               endorserLimits?.doneClaimsThisWeek === 1 ? "" : "s"
             }}</b
           >
-          out of <b>{{ endorserLimits?.maxClaimsPerWeek || "?" }}</b> for this
+          out of <b>{{ endorserLimits?.maxClaimsPerWeek ?? "?" }}</b> for this
           week. Your claims counter resets at
           <b class="whitespace-nowrap">{{
             readableDate(endorserLimits?.nextWeekBeginDateTime)
@@ -449,14 +450,14 @@
           You have done
           <b
             >{{
-              endorserLimits?.doneRegistrationsThisMonth || "?"
+              endorserLimits?.doneRegistrationsThisMonth ?? "?"
             }}
             registration{{
               endorserLimits?.doneRegistrationsThisMonth === 1 ? "" : "s"
             }}</b
           >
           out of
-          <b>{{ endorserLimits?.maxRegistrationsPerMonth || "?" }}</b> for this
+          <b>{{ endorserLimits?.maxRegistrationsPerMonth ?? "?" }}</b> for this
           this month.
           <i>(You cannot register anyone on your first day.)</i>
           Your registration counter resets at
@@ -467,11 +468,11 @@
         <p class="mt-3 text-sm">
           You have uploaded
           <b
-            >{{ imageLimits?.doneImagesThisWeek || "?" }} image{{
+            >{{ imageLimits?.doneImagesThisWeek ?? "?" }} image{{
               imageLimits?.doneImagesThisWeek === 1 ? "" : "s"
             }}</b
           >
-          out of <b>{{ imageLimits?.maxImagesPerWeek || "?" }}</b> for this
+          out of <b>{{ imageLimits?.maxImagesPerWeek ?? "?" }}</b> for this
           week. Your image counter resets at
           <b class="whitespace-nowrap">{{
             readableDate(imageLimits?.nextWeekBeginDateTime)
@@ -1814,7 +1815,7 @@ export default class AccountViewView extends Vue {
         if (!this.isRegistered) {
           // the user was not known to be registered, but now they are (because we got no error) so let's record it
           try {
-            await databaseUtil.updateAccountSettings(did, {
+            await databaseUtil.updateDidSpecificSettings(did, {
               isRegistered: true,
             });
             if (USE_DEXIE_DB) {
@@ -2018,7 +2019,7 @@ export default class AccountViewView extends Vue {
       if ((error as any).response.status === 404) {
         logger.error("The image was already deleted:", error);
 
-        await databaseUtil.updateAccountSettings(this.activeDid, {
+        await databaseUtil.updateDidSpecificSettings(this.activeDid, {
           profileImageUrl: undefined,
         });
         if (USE_DEXIE_DB) {

src/views/ClaimAddRawView.vue

@@ -198,7 +198,7 @@ export default class ClaimAddRawView extends Vue {
       this.apiServer,
       this.axios,
     );
-    if (result.type === "success") {
+    if (result.success) {
       this.$notify(
         {
           group: "alert",

src/views/ClaimView.vue

@@ -46,23 +46,35 @@
             </h2>
             <div class="flex justify-center w-full">
               <router-link
+                v-if="veriClaim.id"
                 :to="'/claim-cert/' + encodeURIComponent(veriClaim.id)"
                 class="text-blue-500 mt-2"
-                title="Printable Certificate"
+                title="View Printable Certificate"
               >
                 <font-awesome
                   icon="square"
                   class="text-white bg-yellow-500 p-1"
                 />
               </router-link>
+              <button
+                v-if="veriClaim.id"
+                class="text-blue-500 ml-2 mt-2"
+                title="Copy Printable Certificate Link"
+                @click="
+                  copyToClipboard(
+                    'A link to the certificate page',
+                    `${APP_SERVER}/deep-link/claim-cert/${veriClaim.id}`,
+                  )
+                "
+              >
+                <font-awesome icon="link" class="text-yellow-500 p-1" />
+              </button>
             </div>
             <!-- show link icon to copy this URL to the clipboard -->
             <div class="flex justify-end w-full">
               <button
                 title="Copy Link"
-                @click="
-                  copyToClipboard('A link to this page', window.location.href)
-                "
+                @click="copyToClipboard('A link to this page', windowDeepLink)"
               >
                 <font-awesome icon="link" class="text-slate-500" />
               </button>
@@ -292,12 +304,17 @@
                   <div class="text-sm">
                     {{ didInfo(confirmerId) }}
                     <span v-if="!serverUtil.isEmptyOrHiddenDid(confirmerId)">
-                      <a :href="`/did/${confirmerId}`" class="text-blue-500">
+                      <router-link
+                        :to="{
+                          path: '/did/' + encodeURIComponent(confirmerId),
+                        }"
+                        class="text-blue-500"
+                      >
                         <font-awesome
                           icon="arrow-up-right-from-square"
                           class="fa-fw"
                         />
-                      </a>
+                      </router-link>
                     </span>
                   </div>
                 </div>
@@ -329,12 +346,17 @@
                   <div class="text-sm">
                     {{ didInfo(confsVisibleTo) }}
                     <span v-if="!serverUtil.isEmptyOrHiddenDid(confsVisibleTo)">
-                      <a :href="`/did/${confsVisibleTo}`" class="text-blue-500">
+                      <router-link
+                        :to="{
+                          path: '/did/' + encodeURIComponent(confsVisibleTo),
+                        }"
+                        class="text-blue-500"
+                      >
                         <font-awesome
                           icon="arrow-up-right-from-square"
                           class="fa-fw"
                         />
-                      </a>
+                      </router-link>
                     </span>
                   </div>
                 </div>
@@ -394,7 +416,7 @@
           contacts can see more details:
           <a
             class="text-blue-500"
-            @click="copyToClipboard('A link to this page', windowLocation)"
+            @click="copyToClipboard('A link to this page', windowDeepLink)"
             >click to copy this page info</a
           >
           and see if they can make an introduction. Someone is connected to
@@ -417,7 +439,7 @@
           If you'd like an introduction,
           <a
             class="text-blue-500"
-            @click="copyToClipboard('A link to this page', windowLocation)"
+            @click="copyToClipboard('A link to this page', windowDeepLink)"
             >share this page with them and ask if they'll tell you more about
             about the participants.</a
           >
@@ -443,12 +465,17 @@
                   <span>
                     {{ didInfo(visDid) }}
                     <span v-if="!serverUtil.isEmptyOrHiddenDid(visDid)">
-                      <a :href="`/did/${visDid}`" class="text-blue-500">
+                      <router-link
+                        :to="{
+                          path: '/did/' + encodeURIComponent(visDid),
+                        }"
+                        class="text-blue-500"
+                      >
                         <font-awesome
                           icon="arrow-up-right-from-square"
                           class="fa-fw"
                         />
-                      </a>
+                      </router-link>
                     </span>
                     <span v-if="veriClaim.publicUrls?.[visDid]"
                       >, found at&nbsp;<a
@@ -530,7 +557,7 @@ import { useClipboard } from "@vueuse/core";
 import { GenericVerifiableCredential } from "../interfaces";
 import GiftedDialog from "../components/GiftedDialog.vue";
 import QuickNav from "../components/QuickNav.vue";
-import { NotificationIface, USE_DEXIE_DB } from "../constants/app";
+import { APP_SERVER, NotificationIface, USE_DEXIE_DB } from "../constants/app";
 import * as databaseUtil from "../db/databaseUtil";
 import { db } from "../db/index";
 import { logConsoleAndDb } from "../db/databaseUtil";
@@ -577,8 +604,9 @@ export default class ClaimView extends Vue {
   veriClaim = serverUtil.BLANK_GENERIC_SERVER_RECORD;
   veriClaimDump = "";
   veriClaimDidsVisible: { [key: string]: string[] } = {};
-  windowLocation = window.location.href;
+  windowDeepLink = window.location.href; // changed in the setup for deep linking
 
+  APP_SERVER = APP_SERVER;
   R = R;
   yaml = yaml;
   libsUtil = libsUtil;
@@ -655,6 +683,7 @@ export default class ClaimView extends Vue {
         5000,
       );
     }
+    this.windowDeepLink = `${APP_SERVER}/deep-link/claim/${claimId}`;
 
     this.canShare = !!navigator.share;
   }
@@ -925,7 +954,7 @@ export default class ClaimView extends Vue {
       this.apiServer,
       this.axios,
     );
-    if (result.type === "success") {
+    if (result.success) {
       this.$notify(
         {
           group: "alert",
@@ -990,11 +1019,11 @@ export default class ClaimView extends Vue {
   }
 
   onClickShareClaim() {
-    this.copyToClipboard("A link to this page", this.windowLocation);
+    this.copyToClipboard("A link to this page", this.windowDeepLink);
     window.navigator.share({
       title: "Help Connect Me",
       text: "I'm trying to find the people who recorded this. Can you help me?",
-      url: this.windowLocation,
+      url: this.windowDeepLink,
     });
   }
 

src/views/ConfirmGiftView.vue

@@ -407,14 +407,14 @@
           </a>
         </div>
         <div class="mt-2 ml-2">
-          <a
+          <router-link
             v-if="isRegistered"
             class="text-blue-500 cursor-pointer"
-            :href="urlForNewGive"
+            :to="urlForNewGive"
           >
             <font-awesome icon="file-lines" />
             Record a Give Similar to the Original
-          </a>
+          </router-link>
         </div>
       </div>
     </div>
@@ -436,7 +436,7 @@ import { Component, Vue } from "vue-facing-decorator";
 import { useClipboard } from "@vueuse/core";
 import { RouteLocationNormalizedLoaded, Router } from "vue-router";
 import QuickNav from "../components/QuickNav.vue";
-import { NotificationIface, USE_DEXIE_DB } from "../constants/app";
+import { APP_SERVER, NotificationIface, USE_DEXIE_DB } from "../constants/app";
 import { db, retrieveSettingsForActiveAccount } from "../db/index";
 import { Contact } from "../db/tables/contacts";
 import * as databaseUtil from "../db/databaseUtil";
@@ -494,7 +494,7 @@ export default class ConfirmGiftView extends Vue {
   veriClaim = serverUtil.BLANK_GENERIC_SERVER_RECORD;
   veriClaimDump = "";
   veriClaimDidsVisible: { [key: string]: string[] } = {};
-  windowLocation = window.location.href;
+  windowLocation = window.location.href; // this is changed to a deep link in the setup
 
   R = R;
   yaml = yaml;
@@ -566,6 +566,9 @@ export default class ConfirmGiftView extends Vue {
     }
 
     const claimId = decodeURIComponent(pathParam);
+
+    this.windowLocation = APP_SERVER + "/deep-link/confirm-gift/" + claimId;
+
     await this.loadClaim(claimId, this.activeDid);
   }
 
@@ -676,12 +679,12 @@ export default class ConfirmGiftView extends Vue {
     /**
      * Add participant (giver/recipient) name & URL info
      */
+    this.giverName = this.didInfo(this.giveDetails?.agentDid);
     if (this.giveDetails?.agentDid) {
-      this.giverName = this.didInfo(this.giveDetails.agentDid);
       this.urlForNewGive += `&giverDid=${encodeURIComponent(this.giveDetails.agentDid)}&giverName=${encodeURIComponent(this.giverName)}`;
     }
+    this.recipientName = this.didInfo(this.giveDetails?.recipientDid);
     if (this.giveDetails?.recipientDid) {
-      this.recipientName = this.didInfo(this.giveDetails.recipientDid);
       this.urlForNewGive += `&recipientDid=${encodeURIComponent(this.giveDetails.recipientDid)}&recipientName=${encodeURIComponent(this.recipientName)}`;
     }
 
@@ -831,7 +834,7 @@ export default class ConfirmGiftView extends Vue {
       this.apiServer,
       this.axios,
     );
-    if (result.type === "success") {
+    if (result.success) {
       this.$notify(
         {
           group: "alert",

src/views/ContactEditView.vue

@@ -138,11 +138,13 @@ import { RouteLocationNormalizedLoaded, Router } from "vue-router";
 
 import QuickNav from "../components/QuickNav.vue";
 import TopMessage from "../components/TopMessage.vue";
-import { AppString, NotificationIface, USE_DEXIE_DB } from "../constants/app";
-import { db } from "../db/index";
-import { Contact, ContactMethod } from "../db/tables/contacts";
+import { NotificationIface, USE_DEXIE_DB } from "../constants/app";
 import * as databaseUtil from "../db/databaseUtil";
-import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
+import { parseJsonField } from "../db/databaseUtil";
+import { db } from "../db/index";
+import { PlatformServiceFactory } from "../services/PlatformServiceFactory";
+import { Contact, ContactMethod } from "../db/tables/contacts";
+import { AppString } from "../constants/app";
 
 /**
  * Contact Edit View Component
@@ -230,9 +232,7 @@ export default class ContactEditView extends Vue {
     let contact: Contact | undefined = databaseUtil.mapQueryResultToValues(
       dbContact,
     )[0] as unknown as Contact;
-    contact.contactMethods = JSON.parse(
-      (contact?.contactMethods as unknown as string) || "[]",
-    );
+    contact.contactMethods = parseJsonField(contact?.contactMethods, []);
     if (USE_DEXIE_DB) {
       await db.open();
       contact = await db.contacts.get(contactDid || "");

src/views/ContactGiftingView.vue

@@ -4,14 +4,14 @@
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
-      <h1 class="text-lg text-center font-light relative px-7">
+      <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>
-        Given by...
+        {{ stepType === "giver" ? "Given by..." : "Given to..." }}
       </h1>
     </div>
 
@@ -19,19 +19,18 @@
     <ul class="border-t border-slate-300">
       <li class="border-b border-slate-300 py-3">
         <h2 class="text-base flex gap-4 items-center">
-          <span class="grow">
-            <img
-              src="../assets/blank-square.svg"
-              width="32"
-              class="inline-block align-middle border border-slate-300 rounded-md mr-1"
+          <span class="grow flex gap-2 items-center font-medium">
+            <font-awesome
+              icon="circle-question"
+              class="text-slate-400 text-4xl"
             />
-            Unnamed/Unknown
+            <span class="italic text-slate-400">(Unnamed/Unknown)</span>
           </span>
           <span class="text-right">
             <button
               type="button"
               class="block w-full text-center text-sm 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-1.5 rounded-md"
-              @click="openDialog()"
+              @click="openDialog('Unnamed')"
             >
               <font-awesome icon="gift" class="fa-fw"></font-awesome>
             </button>
@@ -44,13 +43,14 @@
         class="border-b border-slate-300 py-3"
       >
         <h2 class="text-base flex gap-4 items-center">
-          <span class="grow font-semibold">
+          <span class="grow flex gap-2 items-center font-medium">
             <EntityIcon
               :contact="contact"
-              :icon-size="32"
-              class="inline-block align-middle border border-slate-300 rounded-md mr-1"
+              :icon-size="34"
+              class="inline-block align-middle border border-slate-300 rounded-full overflow-hidden"
             />
-            {{ contact.name || "(no name)" }}
+            <span v-if="contact.name">{{ contact.name }}</span>
+            <span v-else class="italic text-slate-400">(No name)</span>
           </span>
           <span class="text-right">
             <button
@@ -65,7 +65,13 @@
       </li>
     </ul>
 
-    <GiftedDialog ref="customDialog" :to-project-id="projectId" />
+    <GiftedDialog
+      ref="customDialog"
+      :from-project-id="fromProjectId"
+      :to-project-id="toProjectId"
+      :show-projects="showProjects"
+      :is-from-project-view="isFromProjectView"
+    />
   </section>
 </template>
 
@@ -97,6 +103,24 @@ export default class ContactGiftingView extends Vue {
   description = "";
   projectId = "";
   prompt = "";
+  recipientProjectName = "";
+  recipientProjectImage = "";
+  recipientProjectHandleId = "";
+
+  // New context parameters
+  stepType = "giver";
+  giverEntityType = "person" as "person" | "project";
+  recipientEntityType = "person" as "person" | "project";
+  giverProjectId = "";
+  giverProjectName = "";
+  giverProjectImage = "";
+  giverProjectHandleId = "";
+  giverDid = "";
+  recipientDid = "";
+  fromProjectId = "";
+  toProjectId = "";
+  showProjects = false;
+  isFromProjectView = false;
 
   async created() {
     try {
@@ -124,9 +148,41 @@ export default class ContactGiftingView extends Vue {
         );
       }
 
-      this.projectId = (this.$route.query["projectId"] as string) || "";
+      this.projectId =
+        (this.$route.query["recipientProjectId"] as string) || "";
+      this.recipientProjectName =
+        (this.$route.query["recipientProjectName"] as string) || "";
+      this.recipientProjectImage =
+        (this.$route.query["recipientProjectImage"] as string) || "";
+      this.recipientProjectHandleId =
+        (this.$route.query["recipientProjectHandleId"] as string) || "";
       this.prompt = (this.$route.query["prompt"] as string) ?? this.prompt;
 
+      // Read new context parameters
+      this.stepType = (this.$route.query["stepType"] as string) || "giver";
+      this.giverEntityType =
+        (this.$route.query["giverEntityType"] as "person" | "project") ||
+        "person";
+      this.recipientEntityType =
+        (this.$route.query["recipientEntityType"] as "person" | "project") ||
+        "person";
+      this.giverProjectId =
+        (this.$route.query["giverProjectId"] as string) || "";
+      this.giverProjectName =
+        (this.$route.query["giverProjectName"] as string) || "";
+      this.giverProjectImage =
+        (this.$route.query["giverProjectImage"] as string) || "";
+      this.giverProjectHandleId =
+        (this.$route.query["giverProjectHandleId"] as string) || "";
+      this.giverDid = (this.$route.query["giverDid"] as string) || "";
+      this.recipientDid = (this.$route.query["recipientDid"] as string) || "";
+      this.fromProjectId = (this.$route.query["fromProjectId"] as string) || "";
+      this.toProjectId = (this.$route.query["toProjectId"] as string) || "";
+      this.showProjects =
+        (this.$route.query["showProjects"] as string) === "true";
+      this.isFromProjectView =
+        (this.$route.query["isFromProjectView"] as string) === "true";
+
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (err: any) {
       logger.error("Error retrieving settings & contacts:", err);
@@ -144,17 +200,108 @@ export default class ContactGiftingView extends Vue {
     }
   }
 
-  openDialog(giver?: GiverReceiverInputInfo) {
-    const recipient = this.projectId
-      ? undefined
-      : { did: this.activeDid, name: "you" };
-    (this.$refs.customDialog as GiftedDialog).open(
-      giver,
-      recipient,
-      undefined,
-      "Given by " + (giver?.name || "someone not named"),
-      this.prompt,
-    );
+  openDialog(contact?: GiverReceiverInputInfo | "Unnamed") {
+    if (contact === "Unnamed") {
+      // Special case: Pass undefined to trigger Step 1, but with "Unnamed" pre-selected
+      let recipient: GiverReceiverInputInfo;
+      let giver: GiverReceiverInputInfo | undefined;
+
+      if (this.stepType === "giver") {
+        // We're selecting a giver, so recipient is either a project or the current user
+        if (this.recipientEntityType === "project") {
+          recipient = {
+            did: this.recipientProjectHandleId,
+            name: this.recipientProjectName,
+            image: this.recipientProjectImage,
+            handleId: this.recipientProjectHandleId,
+          };
+        } else {
+          recipient = { did: this.activeDid, name: "You" };
+        }
+        giver = undefined; // Will be set to "Unnamed" in GiftedDialog
+      } else {
+        // We're selecting a recipient, so recipient is "Unnamed" and giver is preserved from context
+        recipient = { did: "", name: "Unnamed" };
+
+        // Preserve the existing giver from the context
+        if (this.giverEntityType === "project") {
+          giver = {
+            // no did, because it's a project
+            name: this.giverProjectName,
+            image: this.giverProjectImage,
+            handleId: this.giverProjectHandleId,
+          };
+        } else if (this.giverDid) {
+          giver = {
+            did: this.giverDid,
+            name: this.giverProjectName || "Someone",
+          };
+        } else {
+          giver = { did: this.activeDid, name: "You" };
+        }
+      }
+
+      (this.$refs.customDialog as GiftedDialog).open(
+        giver,
+        recipient,
+        undefined,
+        this.stepType === "giver" ? "Given by Unnamed" : "Given to Unnamed",
+        this.prompt,
+      );
+      // Immediately select "Unnamed" and move to Step 2
+      (this.$refs.customDialog as GiftedDialog).selectGiver();
+    } else {
+      // Regular case: contact is a GiverReceiverInputInfo
+      let giver: GiverReceiverInputInfo;
+      let recipient: GiverReceiverInputInfo;
+
+      if (this.stepType === "giver") {
+        // We're selecting a giver, so the contact becomes the giver
+        giver = contact as GiverReceiverInputInfo; // Safe because we know contact is not "Unnamed" or undefined
+
+        // Recipient is either a project or the current user
+        if (this.recipientEntityType === "project") {
+          recipient = {
+            did: this.recipientProjectHandleId,
+            name: this.recipientProjectName,
+            image: this.recipientProjectImage,
+            handleId: this.recipientProjectHandleId,
+          };
+        } else {
+          recipient = { did: this.activeDid, name: "You" };
+        }
+      } else {
+        // We're selecting a recipient, so the contact becomes the recipient
+        recipient = contact as GiverReceiverInputInfo; // Safe because we know contact is not "Unnamed" or undefined
+
+        // Preserve the existing giver from the context
+        if (this.giverEntityType === "project") {
+          giver = {
+            did: this.giverProjectHandleId,
+            name: this.giverProjectName,
+            image: this.giverProjectImage,
+            handleId: this.giverProjectHandleId,
+          };
+        } else if (this.giverDid) {
+          giver = {
+            did: this.giverDid,
+            name: this.giverProjectName || "Someone",
+          };
+        } else {
+          giver = { did: this.activeDid, name: "You" };
+        }
+      }
+
+      (this.$refs.customDialog as GiftedDialog).open(
+        giver,
+        recipient,
+        undefined,
+        this.stepType === "giver"
+          ? "Given by " + (contact?.name || "someone not named")
+          : "Given to " + (contact?.name || "someone not named"),
+        this.prompt,
+      );
+    }
   }
 }
 </script>

src/views/ContactImportView.vue

@@ -213,6 +213,7 @@ import {
 } from "../db/index";
 import { Contact, ContactMethod } from "../db/tables/contacts";
 import * as databaseUtil from "../db/databaseUtil";
+import { parseJsonField } from "../db/databaseUtil";
 import * as libsUtil from "../libs/util";
 import {
   capitalizeAndInsertSpacesBeforeCaps,
@@ -289,7 +290,7 @@ function dbRecordToContact(record: ContactDbRecord): Contact {
     profileImageUrl: safeString(record.profileImageUrl),
     publicKeyBase64: safeString(record.publicKeyBase64),
     nextPubKeyHashB64: safeString(record.nextPubKeyHashB64),
-    contactMethods: JSON.parse(record.contactMethods || "[]"),
+    contactMethods: parseJsonField(record.contactMethods, []),
   };
 }
 
@@ -565,7 +566,7 @@ export default class ContactImportView extends Vue {
     this.checkingImports = true;
 
     try {
-      const jwt: string = getContactJwtFromJwtUrl(jwtInput);
+      const jwt: string = getContactJwtFromJwtUrl(jwtInput) || "";
       const payload = decodeEndorserJwt(jwt).payload;
 
       if (Array.isArray(payload.contacts)) {

src/views/ContactQRScanFullView.vue

@@ -104,6 +104,7 @@
 </template>
 
 <script lang="ts">
+import { Buffer } from "buffer/";
 import QRCodeVue3 from "qr-code-generator-vue3";
 import { Component, Vue } from "vue-facing-decorator";
 import { Router } from "vue-router";
@@ -117,13 +118,20 @@ import { db } from "../db/index";
 import { Contact } from "../db/tables/contacts";
 import { getContactJwtFromJwtUrl } from "../libs/crypto";
 import { decodeEndorserJwt, ETHR_DID_PREFIX } from "../libs/crypto/vc";
+import * as libsUtil from "../libs/util";
 import { retrieveSettingsForActiveAccount } from "../db/index";
 import * as databaseUtil from "../db/databaseUtil";
-import { setVisibilityUtil } from "../libs/endorserServer";
+import {
+  CONTACT_CSV_HEADER,
+  CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI,
+  generateEndorserJwtUrlForAccount,
+  setVisibilityUtil,
+} from "../libs/endorserServer";
 import UserNameDialog from "../components/UserNameDialog.vue";
-import { generateEndorserJwtUrlForAccount } from "../libs/endorserServer";
 import { retrieveAccountMetadata } from "../libs/util";
 import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
+import { parseJsonField } from "../db/databaseUtil";
+import { Account } from "@/db/tables/accounts";
 
 interface QRScanResult {
   rawValue?: string;
@@ -141,7 +149,7 @@ interface IUserNameDialog {
     UserNameDialog,
   },
 })
-export default class ContactQRScan extends Vue {
+export default class ContactQRScanFull extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
   $router!: Router;
 
@@ -150,6 +158,8 @@ export default class ContactQRScan extends Vue {
   activeDid = "";
   apiServer = "";
   givenName = "";
+  isRegistered = false;
+  profileImageUrl = "";
   qrValue = "";
   ETHR_DID_PREFIX = ETHR_DID_PREFIX;
 
@@ -171,19 +181,22 @@ export default class ContactQRScan extends Vue {
       this.activeDid = settings.activeDid || "";
       this.apiServer = settings.apiServer || "";
       this.givenName = settings.firstName || "";
+      this.isRegistered = !!settings.isRegistered;
+      this.profileImageUrl = settings.profileImageUrl || "";
 
       const account = await retrieveAccountMetadata(this.activeDid);
       if (account) {
         const name =
           (settings.firstName || "") +
           (settings.lastName ? ` ${settings.lastName}` : "");
-        this.qrValue = await generateEndorserJwtUrlForAccount(
-          account,
-          !!settings.isRegistered,
-          name,
-          settings.profileImageUrl || "",
-          false,
-        );
+        const publicKeyBase64 = Buffer.from(
+          account.publicKeyHex,
+          "hex",
+        ).toString("base64");
+        this.qrValue =
+          CONTACT_CSV_HEADER +
+          "\n" +
+          `"${name}",${account.did},${publicKeyBase64},false,${this.isRegistered}`;
       }
     } catch (error) {
       logger.error("Error initializing component:", {
@@ -335,57 +348,69 @@ export default class ContactQRScan extends Vue {
 
       logger.info("Processing QR code scan result:", rawValue);
 
-      // Extract JWT
-      const jwt = getContactJwtFromJwtUrl(rawValue);
-      if (!jwt) {
-        logger.warn("Invalid QR code format - no JWT found in URL");
+      let contact: Contact;
+      if (rawValue.includes(CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI)) {
+        // Extract JWT
+        const jwt = getContactJwtFromJwtUrl(rawValue);
+        if (!jwt) {
+          logger.warn("Invalid QR code format - no JWT found in URL");
+          this.$notify({
+            group: "alert",
+            type: "danger",
+            title: "Invalid QR Code",
+            text: "This QR code does not contain valid contact information. Scan a TimeSafari contact QR code.",
+          });
+          return;
+        }
+
+        // Process JWT and contact info
+        logger.info("Decoding JWT payload from QR code");
+        const decodedJwt = await decodeEndorserJwt(jwt);
+        if (!decodedJwt?.payload?.own) {
+          logger.warn("Invalid JWT payload - missing 'own' field");
+          this.$notify({
+            group: "alert",
+            type: "danger",
+            title: "Invalid Contact Info",
+            text: "The contact information is incomplete or invalid.",
+          });
+          return;
+        }
+
+        const contactInfo = decodedJwt.payload.own;
+        const did = contactInfo.did || decodedJwt.payload.iss;
+        if (!did) {
+          logger.warn("Invalid contact info - missing DID");
+          this.$notify({
+            group: "alert",
+            type: "danger",
+            title: "Invalid Contact",
+            text: "The contact DID is missing.",
+          });
+          return;
+        }
+
+        // Create contact object
+        contact = {
+          did: did,
+          name: contactInfo.name || "",
+          publicKeyBase64: contactInfo.publicKeyBase64 || "",
+          seesMe: contactInfo.seesMe || false,
+          registered: contactInfo.registered || false,
+        };
+      } else if (rawValue.startsWith(CONTACT_CSV_HEADER)) {
+        const lines = rawValue.split(/\n/);
+        contact = libsUtil.csvLineToContact(lines[1]);
+      } else {
         this.$notify({
           group: "alert",
           type: "danger",
-          title: "Invalid QR Code",
-          text: "This QR code does not contain valid contact information. Please scan a TimeSafari contact QR code.",
+          title: "Error",
+          text: "Could not determine the type of contact info. Try again, or tap the QR code to copy it and send it to them.",
         });
         return;
       }
 
-      // Process JWT and contact info
-      logger.info("Decoding JWT payload from QR code");
-      const decodedJwt = await decodeEndorserJwt(jwt);
-      if (!decodedJwt?.payload?.own) {
-        logger.warn("Invalid JWT payload - missing 'own' field");
-        this.$notify({
-          group: "alert",
-          type: "danger",
-          title: "Invalid Contact Info",
-          text: "The contact information is incomplete or invalid.",
-        });
-        return;
-      }
-
-      const contactInfo = decodedJwt.payload.own;
-      const did = contactInfo.did || decodedJwt.payload.iss;
-      if (!did) {
-        logger.warn("Invalid contact info - missing DID");
-        this.$notify({
-          group: "alert",
-          type: "danger",
-          title: "Invalid Contact",
-          text: "The contact DID is missing.",
-        });
-        return;
-      }
-
-      // Create contact object
-      const contact = {
-        did: did,
-        name: contactInfo.name || "",
-        email: contactInfo.email || "",
-        phone: contactInfo.phone || "",
-        company: contactInfo.company || "",
-        title: contactInfo.title || "",
-        notes: contactInfo.notes || "",
-      };
-
       // Add contact but keep scanning
       logger.info("Adding new contact to database:", {
         did: contact.did,
@@ -467,14 +492,16 @@ export default class ContactQRScan extends Vue {
             title: "Contact Exists",
             text: "This contact has already been added to your list.",
           },
-          3000,
+          5000,
         );
         return;
       }
 
       // Add new contact
       // @ts-expect-error because we're just using the value to store to the DB
-      contact.contactMethods = JSON.stringify(contact.contactMethods);
+      contact.contactMethods = JSON.stringify(
+        parseJsonField(contact.contactMethods, []),
+      );
       const { sql, params } = databaseUtil.generateInsertStatement(
         contact as unknown as Record<string, unknown>,
         "contacts",
@@ -565,9 +592,19 @@ export default class ContactQRScan extends Vue {
     );
   }
 
-  onCopyUrlToClipboard() {
+  async onCopyUrlToClipboard() {
+    const account = (await libsUtil.retrieveFullyDecryptedAccount(
+      this.activeDid,
+    )) as Account;
+    const jwtUrl = await generateEndorserJwtUrlForAccount(
+      account,
+      this.isRegistered,
+      this.givenName,
+      this.profileImageUrl,
+      true,
+    );
     useClipboard()
-      .copy(this.qrValue)
+      .copy(jwtUrl)
       .then(() => {
         this.$notify(
           {

src/views/ContactQRScanShowView.vue

@@ -159,6 +159,7 @@
 
 <script lang="ts">
 import { AxiosError } from "axios";
+import { Buffer } from "buffer/";
 import QRCodeVue3 from "qr-code-generator-vue3";
 import { Component, Vue } from "vue-facing-decorator";
 import { useClipboard } from "@vueuse/core";
@@ -171,19 +172,23 @@ import { db, retrieveSettingsForActiveAccount } from "../db/index";
 import { Contact } from "../db/tables/contacts";
 import { MASTER_SETTINGS_KEY } from "../db/tables/settings";
 import * as databaseUtil from "../db/databaseUtil";
+import { parseJsonField } from "../db/databaseUtil";
 import { getContactJwtFromJwtUrl } from "../libs/crypto";
 import {
+  CONTACT_CSV_HEADER,
+  CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI,
   generateEndorserJwtUrlForAccount,
   register,
   setVisibilityUtil,
 } from "../libs/endorserServer";
 import { decodeEndorserJwt, ETHR_DID_PREFIX } from "../libs/crypto/vc";
-import { retrieveAccountMetadata } from "../libs/util";
+import * as libsUtil from "../libs/util";
 import { Router } from "vue-router";
 import { logger } from "../utils/logger";
 import { QRScannerFactory } from "@/services/QRScanner/QRScannerFactory";
 import { CameraState } from "@/services/QRScanner/types";
 import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
+import { Account } from "@/db/tables/accounts";
 
 interface QRScanResult {
   rawValue?: string;
@@ -213,6 +218,7 @@ export default class ContactQRScanShow extends Vue {
   isRegistered = false;
   qrValue = "";
   isScanning = false;
+  profileImageUrl = "";
   error: string | null = null;
 
   // QR Scanner properties
@@ -250,19 +256,21 @@ export default class ContactQRScanShow extends Vue {
       this.hideRegisterPromptOnNewContact =
         !!settings.hideRegisterPromptOnNewContact;
       this.isRegistered = !!settings.isRegistered;
+      this.profileImageUrl = settings.profileImageUrl || "";
 
-      const account = await retrieveAccountMetadata(this.activeDid);
+      const account = await libsUtil.retrieveAccountMetadata(this.activeDid);
       if (account) {
         const name =
           (settings.firstName || "") +
           (settings.lastName ? ` ${settings.lastName}` : "");
-        this.qrValue = await generateEndorserJwtUrlForAccount(
-          account,
-          !!settings.isRegistered,
-          name,
-          settings.profileImageUrl || "",
-          false,
-        );
+        const publicKeyBase64 = Buffer.from(
+          account.publicKeyHex,
+          "hex",
+        ).toString("base64");
+        this.qrValue =
+          CONTACT_CSV_HEADER +
+          "\n" +
+          `"${name}",${account.did},${publicKeyBase64},false,${this.isRegistered}`;
       }
     } catch (error) {
       logger.error("Error initializing component:", {
@@ -273,7 +281,7 @@ export default class ContactQRScanShow extends Vue {
         group: "alert",
         type: "danger",
         title: "Initialization Error",
-        text: "Failed to initialize QR scanner. Please try again.",
+        text: "Failed to initialize QR renderer or scanner. Please try again.",
       });
     }
   }
@@ -460,53 +468,68 @@ export default class ContactQRScanShow extends Vue {
 
       logger.info("Processing QR code scan result:", rawValue);
 
-      // Extract JWT
-      const jwt = getContactJwtFromJwtUrl(rawValue);
-      if (!jwt) {
-        logger.warn("Invalid QR code format - no JWT found in URL");
+      let contact: Contact;
+      if (rawValue.includes(CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI)) {
+        const jwt = getContactJwtFromJwtUrl(rawValue);
+        if (!jwt) {
+          logger.warn("Invalid QR code format - no JWT found in URL");
+          this.$notify({
+            group: "alert",
+            type: "danger",
+            title: "Invalid QR Code",
+            text: "This QR code does not contain valid contact information. Scan a TimeSafari contact QR code.",
+          });
+          return;
+        }
+        logger.info("Decoding JWT payload from QR code");
+        const decodedJwt = await decodeEndorserJwt(jwt);
+
+        // Process JWT and contact info
+        if (!decodedJwt?.payload?.own) {
+          logger.warn("Invalid JWT payload - missing 'own' field");
+          this.$notify({
+            group: "alert",
+            type: "danger",
+            title: "Invalid Contact Info",
+            text: "The contact information is incomplete or invalid.",
+          });
+          return;
+        }
+
+        const contactInfo = decodedJwt.payload.own;
+        const did = contactInfo.did || decodedJwt.payload.iss;
+        if (!did) {
+          logger.warn("Invalid contact info - missing DID");
+          this.$notify({
+            group: "alert",
+            type: "danger",
+            title: "Invalid Contact",
+            text: "The contact DID is missing.",
+          });
+          return;
+        }
+
+        // Create contact object
+        contact = {
+          did: did,
+          name: contactInfo.name || "",
+          publicKeyBase64: contactInfo.publicKeyBase64 || "",
+          seesMe: contactInfo.seesMe || false,
+          registered: contactInfo.registered || false,
+        };
+      } else if (rawValue.startsWith(CONTACT_CSV_HEADER)) {
+        const lines = rawValue.split(/\n/);
+        contact = libsUtil.csvLineToContact(lines[1]);
+      } else {
         this.$notify({
           group: "alert",
           type: "danger",
-          title: "Invalid QR Code",
-          text: "This QR code does not contain valid contact information. Please scan a TimeSafari contact QR code.",
+          title: "Error",
+          text: "Could not determine the type of contact info. Try again, or tap the QR code to copy it and send it to them.",
         });
         return;
       }
 
-      // Process JWT and contact info
-      logger.info("Decoding JWT payload from QR code");
-      const decodedJwt = await decodeEndorserJwt(jwt);
-      if (!decodedJwt?.payload?.own) {
-        logger.warn("Invalid JWT payload - missing 'own' field");
-        this.$notify({
-          group: "alert",
-          type: "danger",
-          title: "Invalid Contact Info",
-          text: "The contact information is incomplete or invalid.",
-        });
-        return;
-      }
-
-      const contactInfo = decodedJwt.payload.own;
-      const did = contactInfo.did || decodedJwt.payload.iss;
-      if (!did) {
-        logger.warn("Invalid contact info - missing DID");
-        this.$notify({
-          group: "alert",
-          type: "danger",
-          title: "Invalid Contact",
-          text: "The contact DID is missing.",
-        });
-        return;
-      }
-
-      // Create contact object
-      const contact = {
-        did: did,
-        name: contactInfo.name || "",
-        notes: contactInfo.notes || "",
-      };
-
       // Add contact but keep scanning
       logger.info("Adding new contact to database:", {
         did: contact.did,
@@ -648,12 +671,20 @@ export default class ContactQRScanShow extends Vue {
     });
   }
 
-  onCopyUrlToClipboard() {
-    //this.onScanDetect([{ rawValue: this.qrValue }]); // good for testing
+  async onCopyUrlToClipboard() {
+    const account = (await libsUtil.retrieveFullyDecryptedAccount(
+      this.activeDid,
+    )) as Account;
+    const jwtUrl = await generateEndorserJwtUrlForAccount(
+      account,
+      this.isRegistered,
+      this.givenName,
+      this.profileImageUrl,
+      true,
+    );
     useClipboard()
-      .copy(this.qrValue)
+      .copy(jwtUrl)
       .then(() => {
-        // console.log("Contact URL:", this.qrValue);
         this.$notify(
           {
             group: "alert",
@@ -771,14 +802,16 @@ export default class ContactQRScanShow extends Vue {
             title: "Contact Exists",
             text: "This contact has already been added to your list.",
           },
-          3000,
+          5000,
         );
         return;
       }
 
       // Add new contact
       // @ts-expect-error because we're just using the value to store to the DB
-      contact.contactMethods = JSON.stringify(contact.contactMethods);
+      contact.contactMethods = JSON.stringify(
+        parseJsonField(contact.contactMethods, []),
+      );
       const { sql, params } = databaseUtil.generateInsertStatement(
         contact as unknown as Record<string, unknown>,
         "contacts",

src/views/ContactsView.vue

@@ -103,8 +103,12 @@
             v-if="!showGiveNumbers"
             :class="
               contactsSelected.length > 0
-                ? '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 ml-3 px-3 py-1.5 rounded-md cursor-pointer'
-                : 'text-md bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-slate-300 ml-3 px-3 py-1.5 rounded-md cursor-not-allowed'
+                ? '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 ' +
+                  'ml-3 px-3 py-1.5 rounded-md cursor-pointer'
+                : 'text-md bg-gradient-to-b from-slate-400 to-slate-700 ' +
+                  'shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-slate-300 ' +
+                  'ml-3 px-3 py-1.5 rounded-md cursor-not-allowed'
             "
             data-testId="copySelectedContactsButtonTop"
             @click="copySelectedContacts()"
@@ -112,9 +116,9 @@
             Copy
           </button>
           <font-awesome
-            @click="showCopySelectionsInfo()"
             icon="circle-info"
             class="text-2xl text-blue-500 ml-2"
+            @click="showCopySelectionsInfo()"
           />
         </div>
       </div>
@@ -122,7 +126,6 @@
       <div class="flex items-center gap-2">
         <button
           v-if="showGiveNumbers"
-          href=""
           class="text-md bg-gradient-to-b shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-3 py-1.5 rounded-md"
           :class="showGiveAmountsClassNames()"
           @click="toggleShowGiveTotals()"
@@ -138,20 +141,16 @@
         </button>
 
         <button
-          href=""
           class="text-md bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-3 py-1.5 rounded-md"
           @click="toggleShowContactAmounts()"
         >
-          {{
-            showGiveNumbers ? "Hide Actions" : "See Actions"
-          }}
+          {{ showGiveNumbers ? "Hide Actions" : "See Actions" }}
         </button>
       </div>
     </div>
     <div v-if="showGiveNumbers" class="my-3">
       <div class="w-full text-center text-sm italic text-slate-600">
-        Only the most recent hours are included. <br />To see more,
-        click
+        Only the most recent hours are included. <br />To see more, click
         <span
           class="text-sm 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-1 py-0.5 rounded"
         >
@@ -223,9 +222,7 @@
                   />
                 </router-link>
 
-                <span class="text-xs truncate">{{
-                  contact.did
-                }}</span>
+                <span class="text-xs truncate">{{ contact.did }}</span>
               </div>
               <div class="text-sm">
                 {{ contact.notes }}
@@ -237,7 +234,7 @@
             v-if="showGiveNumbers && contact.did != activeDid"
             class="flex gap-1.5 items-end"
           >
-            <div class='text-center'>
+            <div class="text-center">
               <div class="text-xs leading-none mb-1">From/To</div>
               <div class="flex items-center">
                 <button
@@ -317,8 +314,12 @@
         v-if="!showGiveNumbers"
         :class="
           contactsSelected.length > 0
-            ? '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 ml-3 px-3 py-1.5 rounded-md cursor-pointer'
-            : 'text-md bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-slate-300 ml-3 px-3 py-1.5 rounded-md cursor-not-allowed'
+            ? '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 ' +
+              'ml-3 px-3 py-1.5 rounded-md cursor-pointer'
+            : 'text-md bg-gradient-to-b from-slate-400 to-slate-700 ' +
+              'shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-slate-300 ' +
+              'ml-3 px-3 py-1.5 rounded-md cursor-not-allowed'
         "
         @click="copySelectedContacts()"
       >
@@ -490,7 +491,7 @@ export default class ContactsView extends Vue {
   private async processContactJwt() {
     // handle a contact sent via URL
     //
-    // For external links, use /contact-import/:jwt with a JWT that has an array of contacts
+    // For external links, use /deep-link/contact-import/:jwt with a JWT that has an array of contacts
     // because that will do better error checking for things like missing data on iOS platforms.
     const importedContactJwt = this.$route.query["contactJwt"] as string;
     if (importedContactJwt) {
@@ -541,7 +542,7 @@ export default class ContactsView extends Vue {
         if (response.status != 201) {
           throw { error: { response: response } };
         }
-        await databaseUtil.updateAccountSettings(this.activeDid, {
+        await databaseUtil.updateDidSpecificSettings(this.activeDid, {
           isRegistered: true,
         });
         if (USE_DEXIE_DB) {
@@ -616,7 +617,7 @@ export default class ContactsView extends Vue {
             title: "Error with Invite",
             text: message,
           },
-          5000,
+          -1,
         );
       }
       // if we're here, they haven't redirected anywhere, so we'll redirect here without a query parameter
@@ -932,45 +933,9 @@ export default class ContactsView extends Vue {
   }
 
   private async addContactFromEndorserMobileLine(
-    line: string,
+    lineRaw: string,
   ): Promise<IndexableType> {
-    // Note that Endorser Mobile puts name first, then did, etc.
-    let name = line;
-    let did = "";
-    let publicKeyInput, seesMe, registered;
-    const commaPos1 = line.indexOf(",");
-    if (commaPos1 > -1) {
-      name = line.substring(0, commaPos1).trim();
-      did = line.substring(commaPos1 + 1).trim();
-      const commaPos2 = line.indexOf(",", commaPos1 + 1);
-      if (commaPos2 > -1) {
-        did = line.substring(commaPos1 + 1, commaPos2).trim();
-        publicKeyInput = line.substring(commaPos2 + 1).trim();
-        const commaPos3 = line.indexOf(",", commaPos2 + 1);
-        if (commaPos3 > -1) {
-          publicKeyInput = line.substring(commaPos2 + 1, commaPos3).trim();
-          seesMe = line.substring(commaPos3 + 1).trim() == "true";
-          const commaPos4 = line.indexOf(",", commaPos3 + 1);
-          if (commaPos4 > -1) {
-            seesMe = line.substring(commaPos3 + 1, commaPos4).trim() == "true";
-            registered = line.substring(commaPos4 + 1).trim() == "true";
-          }
-        }
-      }
-    }
-    // help with potential mistakes while this sharing requires copy-and-paste
-    let publicKeyBase64 = publicKeyInput;
-    if (publicKeyBase64 && /^[0-9A-Fa-f]{66}$/i.test(publicKeyBase64)) {
-      // it must be all hex (compressed public key), so convert
-      publicKeyBase64 = Buffer.from(publicKeyBase64, "hex").toString("base64");
-    }
-    const newContact = {
-      did,
-      name,
-      publicKeyBase64,
-      seesMe,
-      registered,
-    };
+    const newContact = libsUtil.csvLineToContact(lineRaw);
     const platformService = PlatformServiceFactory.getInstance();
     const { sql, params } = databaseUtil.generateInsertStatement(
       newContact as unknown as Record<string, unknown>,
@@ -997,8 +962,6 @@ export default class ContactsView extends Vue {
       newContact as unknown as Record<string, unknown>,
       "contacts",
     );
-    logger.error("sql", sql);
-    logger.error("params", params);
     let contactPromise = platformService.dbExec(sql, params);
     if (USE_DEXIE_DB) {
       // @ts-expect-error since the result of this promise won't be used, and this will go away soon
@@ -1159,7 +1122,7 @@ export default class ContactsView extends Vue {
               (regResult.error as string) ||
               "Something went wrong during registration.",
           },
-          5000,
+          -1,
         );
       }
     } catch (error) {
@@ -1193,7 +1156,7 @@ export default class ContactsView extends Vue {
           title: "Registration Error",
           text: userMessage,
         },
-        5000,
+        -1,
       );
     }
   }
@@ -1214,7 +1177,6 @@ export default class ContactsView extends Vue {
     );
     if (result.success) {
       //contact.seesMe = visibility; // why doesn't it affect the UI from here?
-      //console.log("Set result & seesMe", result, contact.seesMe, contact.did);
       if (showSuccessAlert) {
         this.$notify(
           {
@@ -1430,14 +1392,11 @@ export default class ContactsView extends Vue {
       }
       return contact;
     });
-    // console.log(
-    //   "Array of selected contacts:",
-    //   JSON.stringify(selectedContacts),
-    // );
     const contactsJwt = await createEndorserJwtForDid(this.activeDid, {
       contacts: selectedContacts,
     });
-    const contactsJwtUrl = APP_SERVER + "/contact-import/" + contactsJwt;
+    const contactsJwtUrl =
+      APP_SERVER + "/deep-link/contact-import/" + contactsJwt;
     useClipboard()
       .copy(contactsJwtUrl)
       .then(() => {

src/views/DIDView.vue

@@ -77,6 +77,7 @@
                 @click="confirmSetVisibility(contactFromDid, false)"
               >
                 <font-awesome icon="eye" class="fa-fw" />
+                <font-awesome icon="arrow-up" class="fa-fw" />
               </button>
               <button
                 v-else-if="
@@ -87,6 +88,32 @@
                 @click="confirmSetVisibility(contactFromDid, true)"
               >
                 <font-awesome icon="eye-slash" class="fa-fw" />
+                <font-awesome icon="arrow-up" class="fa-fw" />
+              </button>
+
+              <button
+                v-if="
+                  contactFromDid?.iViewContent &&
+                  contactFromDid.did !== activeDid
+                "
+                class="text-sm 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 mx-0.5 my-0.5 px-2 py-1.5 rounded-md"
+                title="I view their content"
+                @click="confirmViewContent(contactFromDid, false)"
+              >
+                <font-awesome icon="eye" class="fa-fw" />
+                <font-awesome icon="arrow-down" class="fa-fw" />
+              </button>
+              <button
+                v-else-if="
+                  !contactFromDid?.iViewContent &&
+                  contactFromDid?.did !== activeDid
+                "
+                class="text-sm 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 mx-0.5 my-0.5 px-2 py-1.5 rounded-md"
+                title="I do not view their content"
+                @click="confirmViewContent(contactFromDid, true)"
+              >
+                <font-awesome icon="eye-slash" class="fa-fw" />
+                <font-awesome icon="arrow-down" class="fa-fw" />
               </button>
 
               <button
@@ -825,9 +852,9 @@ export default class DIDView extends Vue {
             title: "Visibility Refreshed",
             text:
               libsUtil.nameForContact(contact, true) +
-              " can " +
-              (visibility ? "" : "not ") +
-              "see your activity.",
+              " can" +
+              (visibility ? "" : " not") +
+              " see your activity.",
           },
           3000,
         );
@@ -857,6 +884,64 @@ export default class DIDView extends Vue {
       );
     }
   }
+
+  /**
+   * Confirm whether the user want to see/hide the other's content, then execute it
+   *
+   * @param contact Contact content to show/hide from user
+   * @param view whether user wants to view this contact
+   */
+  async confirmViewContent(contact: Contact, view: boolean) {
+    const contentVisibilityPrompt = view
+      ? "Are you sure you want to see their content?"
+      : "Are you sure you want to hide their content from you?";
+    this.$notify(
+      {
+        group: "modal",
+        type: "confirm",
+        title: "Set Content Visibility",
+        text: contentVisibilityPrompt,
+        onYes: async () => {
+          const success = await this.setViewContent(contact, view);
+          if (success) {
+            contact.iViewContent = view; // see visibility note about not working inside setVisibility
+          }
+        },
+      },
+      -1,
+    );
+  }
+
+  /**
+   * Updates contact content visibility for this device
+   *
+   * @param contact - Contact to update content visibility for
+   * @param visibility - New content visibility state
+   * @returns Boolean indicating success
+   */
+  async setViewContent(contact: Contact, visibility: boolean) {
+    const platformService = PlatformServiceFactory.getInstance();
+    await platformService.dbExec(
+      "UPDATE contacts SET iViewContent = ? WHERE did = ?",
+      [visibility, contact.did],
+    );
+    if (USE_DEXIE_DB) {
+      db.contacts.update(contact.did, { iViewContent: visibility });
+    }
+    this.$notify(
+      {
+        group: "alert",
+        type: "success",
+        title: "Visibility Set",
+        text:
+          "You will" +
+          (visibility ? "" : " not") +
+          ` see ${contact.name}'s activity.`,
+      },
+      3000,
+    );
+    return true;
+  }
 }
 </script>
 

src/views/DeepLinkErrorView.vue

@@ -66,9 +66,14 @@ const formattedPath = computed(() => {
   const path = originalPath.value.replace(/^\/+/, "");
 
   // Log for debugging
-  logger.log("Original Path:", originalPath.value);
-  logger.log("Route Params:", route.params);
-  logger.log("Route Query:", route.query);
+  logger.log(
+    "[DeepLinkError] Original Path:",
+    originalPath.value,
+    "Route Params:",
+    route.params,
+    "Route Query:",
+    route.query,
+  );
 
   return path;
 });

src/views/DeepLinkRedirectView.vue

@@ -0,0 +1,227 @@
+<template>
+  <!-- CONTENT -->
+  <section id="Content" class="relative w-[100vw] h-[100vh]">
+    <div
+      class="p-6 bg-white w-full max-w-[calc((100vh-env(safe-area-inset-top)-env(safe-area-inset-bottom))*0.4)] mx-auto"
+    >
+      <div class="mb-4">
+        <h1 class="text-xl text-center font-semibold relative mb-4">
+          Redirecting to Time Safari
+        </h1>
+
+        <div v-if="destinationUrl" class="space-y-4">
+          <!-- Platform-specific messaging -->
+          <div class="text-center text-gray-600 mb-4">
+            <p v-if="isMobile">
+              {{
+                isIOS
+                  ? "Opening Time Safari app on your iPhone..."
+                  : "Opening Time Safari app on your Android device..."
+              }}
+            </p>
+            <p v-else>Opening Time Safari app...</p>
+            <p class="text-sm mt-2">
+              <span v-if="isMobile"
+                >If the app doesn't open automatically, use one of these
+                options:</span
+              >
+              <span v-else>Choose how you'd like to open this link:</span>
+            </p>
+          </div>
+
+          <!-- Deep Link Button -->
+          <div class="text-center">
+            <a
+              :href="deepLinkUrl || '#'"
+              class="inline-block bg-blue-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-blue-700 transition-colors"
+              @click="handleDeepLinkClick"
+            >
+              <span v-if="isMobile">Open in Time Safari App</span>
+              <span v-else>Try Opening in Time Safari App</span>
+            </a>
+          </div>
+
+          <!-- Web Fallback Link -->
+          <div class="text-center">
+            <a
+              :href="webUrl || '#'"
+              target="_blank"
+              class="inline-block bg-gray-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-gray-700 transition-colors"
+              @click="handleWebFallbackClick"
+            >
+              <span v-if="isMobile">Open in Web Browser Instead</span>
+              <span v-else>Open in Web Browser</span>
+            </a>
+          </div>
+
+          <!-- Manual Instructions -->
+          <div class="text-center text-sm text-gray-500 mt-4">
+            <p v-if="isMobile">
+              Or manually open:
+              <code class="bg-gray-100 px-2 py-1 rounded">{{
+                deepLinkUrl
+              }}</code>
+            </p>
+            <p v-else>
+              If you have the Time Safari app installed, you can also copy this
+              link:
+              <code class="bg-gray-100 px-2 py-1 rounded">{{
+                deepLinkUrl
+              }}</code>
+            </p>
+          </div>
+
+          <!-- Platform info for debugging -->
+          <div
+            v-if="isDevelopment"
+            class="text-center text-xs text-gray-400 mt-4"
+          >
+            <p>
+              Platform: {{ isMobile ? (isIOS ? "iOS" : "Android") : "Desktop" }}
+            </p>
+            <p>User Agent: {{ userAgent.substring(0, 50) }}...</p>
+          </div>
+        </div>
+
+        <div v-else-if="pageError" class="text-center text-red-500 mb-4">
+          {{ pageError }}
+        </div>
+
+        <div v-else class="text-center text-gray-600">
+          <p>Processing redirect...</p>
+        </div>
+      </div>
+    </div>
+  </section>
+</template>
+
+<script lang="ts">
+import { Component, Vue } from "vue-facing-decorator";
+import { RouteLocationNormalizedLoaded, Router } from "vue-router";
+
+import { APP_SERVER } from "@/constants/app";
+import { logger } from "@/utils/logger";
+import { errorStringForLog } from "@/libs/endorserServer";
+import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
+
+@Component({})
+export default class DeepLinkRedirectView extends Vue {
+  $router!: Router;
+  $route!: RouteLocationNormalizedLoaded;
+  pageError: string | null = null;
+  destinationUrl: string | null = null; // full path after "/deep-link/"
+  deepLinkUrl: string | null = null; // mobile link starting "timesafari://"
+  webUrl: string | null = null; // web link, eg "https://timesafari.app/..."
+  isDevelopment: boolean = false;
+  userAgent: string = "";
+  private platformService = PlatformServiceFactory.getInstance();
+
+  mounted() {
+    // Get the path from the route parameter (catch-all parameter)
+    const pathParam = this.$route.params.path;
+
+    // If pathParam is an array (catch-all parameter), join it
+    const fullPath = Array.isArray(pathParam) ? pathParam.join("/") : pathParam;
+
+    // Get query parameters from the route
+    const queryParams = this.$route.query;
+
+    // Build query string if there are query parameters
+    let queryString = "";
+    if (Object.keys(queryParams).length > 0) {
+      const searchParams = new URLSearchParams();
+      Object.entries(queryParams).forEach(([key, value]) => {
+        if (value !== undefined && value !== null) {
+          const stringValue = Array.isArray(value) ? value[0] : value;
+          if (stringValue !== null && stringValue !== undefined) {
+            searchParams.append(key, stringValue);
+          }
+        }
+      });
+      queryString = "?" + searchParams.toString();
+    }
+
+    // Combine path with query parameters
+    const fullPathWithQuery = fullPath + queryString;
+
+    this.destinationUrl = fullPathWithQuery;
+    this.deepLinkUrl = `timesafari://${fullPathWithQuery}`;
+    this.webUrl = `${APP_SERVER}/${fullPathWithQuery}`;
+
+    this.isDevelopment = process.env.NODE_ENV !== "production";
+    this.userAgent = navigator.userAgent;
+
+    this.openDeepLink();
+  }
+
+  private openDeepLink() {
+    if (!this.deepLinkUrl || !this.webUrl) {
+      this.pageError =
+        "No deep link was provided. Check the URL and try again.";
+      return;
+    }
+
+    try {
+      // For mobile, try the deep link URL; for desktop, use the web URL
+      const redirectUrl = this.isMobile ? this.deepLinkUrl : this.webUrl;
+
+      // Method 1: Try window.location.href (works on most browsers)
+      window.location.href = redirectUrl;
+
+      // Method 2: Fallback - create and click a link element
+      setTimeout(() => {
+        try {
+          const link = document.createElement("a");
+          link.href = redirectUrl;
+          link.style.display = "none";
+          document.body.appendChild(link);
+          link.click();
+          document.body.removeChild(link);
+        } catch (error) {
+          logger.error(
+            "Fallback deep link failed: " + errorStringForLog(error),
+          );
+          this.pageError =
+            "Redirecting to the Time Safari app failed. Please use a manual option below.";
+        }
+      }, 100);
+    } catch (error) {
+      logger.error("Deep link redirect failed: " + errorStringForLog(error));
+      this.pageError =
+        "Unable to open the Time Safari app. Please use a manual option below.";
+    }
+  }
+
+  private handleDeepLinkClick(event: Event) {
+    if (!this.deepLinkUrl) return;
+
+    // Prevent default to handle the click manually
+    event.preventDefault();
+
+    this.openDeepLink();
+  }
+
+  private handleWebFallbackClick(event: Event) {
+    if (!this.webUrl) return;
+
+    // Get platform capabilities
+    const capabilities = this.platformService.getCapabilities();
+
+    // For mobile, try to open in a new tab/window
+    if (capabilities.isMobile) {
+      event.preventDefault();
+      window.open(this.webUrl, "_blank");
+    }
+    // For desktop, let the default behavior happen (opens in same tab)
+  }
+
+  // Computed properties for template
+  get isMobile(): boolean {
+    return this.platformService.getCapabilities().isMobile;
+  }
+
+  get isIOS(): boolean {
+    return this.platformService.getCapabilities().isIOS;
+  }
+}
+</script>

src/views/DiscoverView.vue

@@ -523,9 +523,7 @@ export default class DiscoverView extends Vue {
       }
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (e: any) {
-      logger.error("Error with search all:", e);
-      // this sometimes gives different information
-      logger.error("Error with search all (error added): " + e);
+      logger.error("Error with search all: " + errorStringForLog(e));
       this.$notify(
         {
           group: "alert",
@@ -617,7 +615,7 @@ export default class DiscoverView extends Vue {
       }
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (e: any) {
-      logger.error("Error with search local:", e);
+      logger.error("Error with search local: " + errorStringForLog(e));
       this.$notify(
         {
           group: "alert",
@@ -788,7 +786,7 @@ export default class DiscoverView extends Vue {
     const route = {
       path: this.isProjectsActive
         ? "/project/" + encodeURIComponent(id)
-        : "/userProfile/" + encodeURIComponent(id),
+        : "/user-profile/" + encodeURIComponent(id),
     };
     this.$router.push(route);
   }

src/views/GiftedDetailsView.vue

@@ -4,84 +4,91 @@
 
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Back -->
-    <div
-      v-if="!hideBackButton"
-      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="cancelBack()"
-      >
-        <font-awesome icon="chevron-left" class="fa-fw"></font-awesome>
+    <!-- Breadcrumb -->
+    <div id="ViewBreadcrumb" class="mb-8">
+      <h1 class="text-2xl text-center font-semibold relative px-7 mb-2">
+        <!-- Back -->
+        <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="fa-fw" />
+        </div>
+        What Was Given
       </h1>
+
+      <h2 class="text-lg font-normal text-center overflow-hidden">
+        <div class="truncate">
+          From
+          {{
+            providedByProject
+              ? providerProjectName
+              : providedByGiver
+                ? giverName
+                : "someone not named"
+          }}
+        </div>
+        <div class="truncate">
+          to
+          {{
+            givenToProject
+              ? fulfillsProjectName
+              : givenToRecipient
+                ? recipientName
+                : "someone not named"
+          }}
+        </div>
+      </h2>
     </div>
 
-    <!-- Heading -->
-    <h1 class="text-4xl text-center font-light px-4 mb-4">What Was Given</h1>
-
-    <h1 class="text-xl font-bold text-center mb-4">
-      <span>
-        From
-        {{
-          providedByProject
-            ? providerProjectName
-            : providedByGiver
-              ? giverName
-              : "someone not named"
-        }}
-      </span>
-      <br />
-      <span>
-        to
-        {{
-          givenToProject
-            ? fulfillsProjectName
-            : givenToRecipient
-              ? recipientName
-              : "someone not named"
-        }}</span
-      >
-    </h1>
     <textarea
       v-model="description"
       class="block w-full rounded border border-slate-400 mb-2 px-3 py-2"
       placeholder="What was received"
     />
-    <div class="flex flex-row justify-center">
-      <span
-        class="rounded-l border border-r-0 border-slate-400 bg-slate-200 text-center text-blue-500 px-2 py-2 w-20"
-        @click="changeUnitCode()"
-      >
-        {{ libsUtil.UNIT_SHORT[unitCode] || unitCode }}
-      </span>
-      <div
-        class="border border-r-0 border-slate-400 bg-slate-200 px-4 py-2"
+    <div class="flex mb-4">
+      <button
+        class="rounded-s border border-e-0 border-slate-400 bg-slate-200 px-4 py-2"
         @click="amountInput === '0' ? null : decrement()"
       >
         <font-awesome icon="chevron-left" />
-      </div>
+      </button>
       <input
+        id="inputGivenAmount"
         v-model="amountInput"
         type="number"
-        class="border border-r-0 border-slate-400 px-2 py-2 text-center w-20"
+        class="flex-1 border border-e-0 border-slate-400 px-2 py-2 text-center w-[1px]"
       />
-      <div
-        class="rounded-r border border-slate-400 bg-slate-200 px-4 py-2"
+      <button
+        class="rounded-e border border-slate-400 bg-slate-200 px-4 py-2"
         @click="increment()"
       >
         <font-awesome icon="chevron-right" />
-      </div>
+      </button>
+
+      <select
+        v-model="unitCode"
+        class="flex-1 rounded border border-slate-400 ms-2 px-3 py-2"
+      >
+        <option
+          v-for="(displayName, code) in unitOptions"
+          :key="code"
+          :value="code"
+        >
+          {{ displayName }}
+        </option>
+      </select>
     </div>
 
     <div class="flex justify-center mt-4" data-testId="imagery">
-      <span v-if="imageUrl" class="flex justify-between">
+      <span v-if="imageUrl" class="flex items-end gap-3">
         <a :href="imageUrl" target="_blank">
-          <img :src="imageUrl" class="h-24 rounded-xl" />
+          <img :src="imageUrl" class="h-36 rounded-lg" />
         </a>
         <font-awesome
           icon="trash-can"
-          class="text-red-500 fa-fw ml-8 mt-10"
+          class="text-red-500 fa-fw cursor-pointer"
           @click="confirmDeleteImage"
         />
       </span>
@@ -95,22 +102,22 @@
     </div>
     <ImageMethodDialog ref="imageDialog" default-camera-mode="environment" />
 
-    <div class="mt-4 flex justify-between gap-2">
+    <div class="mt-4 sm:flex justify-between gap-2">
       <!-- First Column for Giver -->
-      <div class="flex-grow border border-slate-400 p-2 rounded-md">
-        <div class="flex">
+      <div class="sm:flex-grow sm:w-1/2 border border-slate-400 p-2 rounded-md overflow-hidden">
+        <div class="flex items-center">
           <input
             v-if="giverDid && !providedByProject"
             v-model="providedByGiver"
             type="checkbox"
-            class="h-6 w-6 mr-2"
+            class="flex-shrink-0 h-6 w-6 mr-2"
           />
           <font-awesome
             v-else
             icon="square"
             class="mr-2 bg-white text-white h-5 w-5 px-0.5 py-0.5 rounded-sm"
           />
-          <label class="text-sm mt-1">
+          <label class="text-sm truncate">
             {{
               giverDid
                 ? "This was provided by " + giverName + "."
@@ -120,24 +127,24 @@
           <font-awesome
             v-if="!giverDid || providedByProject"
             icon="info-circle"
-            class="-mt-1 bg-white text-slate-500 h-5 w-5 px-0.5 py-0.5 rounded-sm"
+            class="text-base cursor-pointer bg-white text-slate-500 ms-1"
             @click="notifyUserOfGiver()"
           />
         </div>
 
-        <div class="flex">
+        <div class="flex items-center">
           <input
             v-if="providerProjectId && !providedByGiver"
             v-model="providedByProject"
             type="checkbox"
-            class="h-6 w-6 mr-2"
+            class="flex-shrink-0 h-6 w-6 mr-2"
           />
           <font-awesome
             v-else
             icon="square"
             class="mr-2 bg-white text-white h-5 w-5 px-0.5 py-0.5 rounded-sm"
           />
-          <label class="text-sm mt-1">
+          <label class="text-sm truncate">
             {{
               providerProjectId
                 ? "This was provided by " + providerProjectName + "."
@@ -147,31 +154,31 @@
           <font-awesome
             v-if="!providerProjectId || providedByGiver"
             icon="info-circle"
-            class="-mt-1 bg-white text-slate-500 h-5 w-5 px-0.5 py-0.5 rounded-sm"
+            class="text-base cursor-pointer bg-white text-slate-500 ms-1"
             @click="notifyUserOfProvidingProject()"
           />
         </div>
       </div>
 
-      <div class="flex-shrink flex justify-center items-center">
-        <font-awesome icon="arrow-right" class="fa-fw h-7" />
+      <div class="sm:flex-shrink flex justify-center items-center my-1 sm:my-0">
+        <font-awesome icon="arrow-right" class="fa-fw h-7 rotate-90 sm:rotate-0" />
       </div>
 
       <!-- Third Column for Recipient -->
-      <div class="flex-grow border border-slate-400 p-2 rounded-md">
-        <div class="flex">
+      <div class="sm:flex-grow sm:w-1/2 border border-slate-400 p-2 rounded-md overflow-hidden">
+        <div class="flex items-center">
           <input
             v-if="recipientDid && !givenToProject"
             v-model="givenToRecipient"
             type="checkbox"
-            class="h-6 w-6 mr-2"
+            class="flex-shrink-0 h-6 w-6 mr-2"
           />
           <font-awesome
             v-else
             icon="square"
             class="mr-2 bg-white text-white h-5 w-5 px-0.5 py-0.5 rounded-sm"
           />
-          <label class="text-sm mt-1">
+          <label class="text-sm truncate">
             {{
               recipientDid
                 ? "This was given to " + recipientName + "."
@@ -181,24 +188,24 @@
           <font-awesome
             v-if="!recipientDid || givenToProject"
             icon="info-circle"
-            class="-mt-1 bg-white text-slate-500 h-5 w-5 px-0.5 py-0.5 rounded-sm"
+            class="text-base cursor-pointer bg-white text-slate-500 ms-1"
             @click="notifyUserOfRecipient()"
           />
         </div>
 
-        <div class="flex">
+        <div class="flex items-center">
           <input
             v-if="fulfillsProjectId && !givenToRecipient"
             v-model="givenToProject"
             type="checkbox"
-            class="h-6 w-6 mr-2"
+            class="flex-shrink-0 h-6 w-6 mr-2"
           />
           <font-awesome
             v-else
             icon="square"
             class="mr-2 bg-white text-white h-5 w-5 px-0.5 py-0.5 rounded-sm"
           />
-          <label class="text-sm mt-1">
+          <label class="text-sm truncate">
             {{
               fulfillsProjectId
                 ? "This was given to " + fulfillsProjectName + ". "
@@ -208,7 +215,7 @@
           <font-awesome
             v-if="!fulfillsProjectId || givenToRecipient"
             icon="info-circle"
-            class="-mt-1 bg-white text-slate-500 h-5 w-5 px-0.5 py-0.5 rounded-sm"
+            class="text-base cursor-pointer bg-white text-slate-500 ms-1"
             @click="notifyUserFulfillsProject()"
           />
         </div>
@@ -229,11 +236,11 @@
       </router-link>
     </div>
 
-    <p class="text-center mb-2 mt-6 italic">
-      Sign & Send to publish to the world
+    <p class="text-center text-sm my-4">
+      <b class="font-medium">Sign &amp; Send</b> to publish to the world
       <font-awesome
         icon="circle-info"
-        class="pl-2 text-blue-500 cursor-pointer"
+        class="fa-fw text-blue-500 text-base cursor-pointer"
         @click="explainData()"
       />
     </p>
@@ -826,7 +833,7 @@ export default class GiftedDetails extends Vue {
       }
 
       if (!result.success) {
-        const errorMessage = this.getGiveCreationErrorMessage(result);
+        const errorMessage = result.error;
         logger.error("Error with give creation result:", result);
         this.$notify(
           {
@@ -899,19 +906,6 @@ export default class GiftedDetails extends Vue {
 
   // Helper functions for readability
 
-  /**
-   * @param result direct response eg. ErrorResult or SuccessResult (potentially with embedded "data")
-   * @returns best guess at an error message
-   */
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  getGiveCreationErrorMessage(result: any) {
-    return (
-      result.error?.userMessage ||
-      result.error?.error ||
-      result.response?.data?.error?.message
-    );
-  }
-
   explainData() {
     this.$notify(
       {
@@ -923,5 +917,10 @@ export default class GiftedDetails extends Vue {
       7000,
     );
   }
+
+  // Computed property to get unit options
+  get unitOptions() {
+    return this.libsUtil.UNIT_SHORT;
+  }
 }
 </script>

src/views/HelpView.vue

@@ -24,11 +24,11 @@
     <!-- eslint-disable prettier/prettier max-len -->
     <div>
       <p>
-        This app focuses on gifts & gratitude, using them to build cool things together with your network.
+        This app focuses on raw gratitude, using it to build cool things together with your network.
       </p>
 
       <p class="ml-4">
-        If you'd like to see the page-by-page help,
+        If you'd like to see the page-by-page help again,
         <span
           class="text-blue-500 cursor-pointer"
           @click="unsetFinishedOnboarding()"
@@ -37,14 +37,16 @@
 
       <h2 class="text-xl font-semibold">What is the idea here?</h2>
       <p>
-        We are building networks of people who want to grow good society from the ground up, using modern
-        technology that connects people peer-to-peer.
-        First of all, let's showcase gratitude: see what people have given, and recognize
-        gifts you've seen. This is done in a way that leaves a permanent record -- one that
-        came from you, and one that the recipient can prove it was for them. This can be
-        personally gratifying, but it extends to broader work: volunteers get
-        confirmation of activity, and they can selectively show off their contributions
-        and network.
+        We are building networks of people who want to grow good society from the ground up, using
+        modern technology that connects people peer-to-peer.
+        First of all, let's showcase gratitude: see what people have given, and recognize gifts
+        you've seen. This is done in a way that leaves a permanent record -- one that provably
+        came from you, and one that the recipient can prove they were mentioned.
+        This can be personally gratifying, but it extends to broader work: volunteers get
+        confirmation of activity, and they can selectively show off their contributions and
+        network.
+        This is a way to build trust and reputation. It's a way to build a network of people who
+        are willing to help each other.
       </p>
       <p class="mt-2">
         With this, you highlight giving and you also offer help --
@@ -555,9 +557,6 @@
         initiative.
       </p>
 
-      <h2 class="text-xl font-semibold">What app version is this?</h2>
-      <p>{{ package.version }} ({{ commitHash }})</p>
-
       <h2 class="text-xl font-semibold">
         I have other questions or feedback, like getting a new profile or removing my data or requesting an improvement.
       </h2>
@@ -567,6 +566,28 @@
           >info@TimeSafari.app</a
         >
       </p>
+
+      <h2 class="text-xl font-semibold">What app version is this?</h2>
+      <p>{{ package.version }} ({{ commitHash }})</p>
+
+      <div v-if="Capacitor.isNativePlatform()">
+        <h2 class="text-xl font-semibold">
+          Do I have the latest version?
+        </h2>
+        <p v-if="Capacitor.getPlatform() === 'ios'">
+          <a href="https://apps.apple.com/us/app/time-safari/id6742664907" target="_blank" class="text-blue-500">
+            Check the App Store.
+          </a>
+        </p>
+        <p v-else-if="Capacitor.getPlatform() === 'android'">
+          <a href="https://timesafari.app/app.apk" target="_blank" class="text-blue-500">
+            Download the latest APK to see.
+          </a>
+        </p>
+        <p v-else>
+          Sorry, your platform of '{{ Capacitor.getPlatform() }}' is not recognized.
+        </p>
+      </div>
     </div>
     <!-- eslint enable -->
   </section>
@@ -603,6 +624,7 @@ export default class HelpView extends Vue {
   showVerifiable = false;
 
   APP_SERVER = APP_SERVER;
+  Capacitor = Capacitor;
 
   // Ideally, we put no functionality in here, especially in the setup,
   // because we never want this page to have a chance of throwing an error.
@@ -622,7 +644,7 @@ export default class HelpView extends Vue {
     }
 
     if (settings.activeDid) {
-      await databaseUtil.updateAccountSettings(settings.activeDid, {
+      await databaseUtil.updateDidSpecificSettings(settings.activeDid, {
         finishedOnboarding: false,
       });
       if (USE_DEXIE_DB) {

src/views/HomeView.vue

@@ -12,6 +12,7 @@ Raymer * @version 1.0.0 */
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <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" />
@@ -106,112 +107,84 @@ Raymer * @version 1.0.0 */
               </button>
             </div>
             <UserNameDialog ref="userNameDialog" />
-            <div v-if="PASSKEYS_ENABLED" class="flex justify-end w-full">
+            <div class="flex justify-end w-full">
               <router-link
                 :to="{ name: 'start' }"
                 class="block text-right text-md font-bold bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white mt-2 px-2 py-3 rounded-md"
               >
-                See all your options first
+                See advanced options
               </router-link>
             </div>
           </div>
 
           <div v-else id="sectionRecordSomethingGiven">
-            <!-- !isCreatingIdentifier && isRegistered -->
+            <!-- Record Quick-Action -->
+            <div class="mb-6">
+              <div class="flex gap-2 items-center mb-2">
+                <h2 class="text-xl 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-2 rounded-full"
+                  @click="openGiftedPrompts()"
+                >
+                  <font-awesome
+                    icon="lightbulb"
+                    class="block text-center w-[1em]"
+                  />
+                </button>
+              </div>
 
-            <!-- show the actions for recognizing a give -->
-            <div class="flex">
-              <h2 class="text-xl font-bold">What have you seen someone do?</h2>
-              <button
-                class="ml-2 block text-xs text-center bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1 rounded-md"
-                @click="openGiftedPrompts()"
-              >
-                <font-awesome icon="lightbulb" class="fa-fw" />
-              </button>
+              <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="openDialogPerson()"
+                >
+                  <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>
-
-            <ul
-              class="grid grid-cols-4 sm:grid-cols-5 md:grid-cols-6 gap-x-3 gap-y-5 text-center mt-4"
-            >
-              <li @click="openDialog()">
-                <img
-                  src="../assets/blank-square.svg"
-                  class="mx-auto border border-blue-500 rounded-md mb-1 cursor-pointer"
-                />
-                <h3
-                  class="text-xs text-blue-500 italic font-medium text-ellipsis whitespace-nowrap overflow-hidden cursor-pointer"
-                >
-                  Unnamed/Unknown
-                </h3>
-              </li>
-              <li v-if="allContacts.length === 0" class="text-sm">
-                (Add friends to see more people worthy of recognition.)
-              </li>
-              <li
-                v-for="contact in allContacts.slice(0, 6)"
-                :key="contact.did"
-                @click="openDialog(contact)"
-              >
-                <EntityIcon
-                  :contact="contact"
-                  :icon-size="64"
-                  class="mx-auto border border-blue-500 rounded-md mb-1 cursor-pointer"
-                />
-                <h3
-                  class="text-xs text-blue-500 font-medium text-ellipsis whitespace-nowrap overflow-hidden cursor-pointer"
-                >
-                  {{ contact.name || contact.did }}
-                </h3>
-              </li>
-              <li>
-                <router-link
-                  v-if="allContacts.length >= 6"
-                  :to="{ name: 'contact-gift' }"
-                  class="flex align-bottom text-xs text-blue-500 mt-12 cursor-pointer"
-                >
-                  ... or someone else...
-                </router-link>
-              </li>
-            </ul>
           </div>
         </div>
       </div>
     </div>
 
-    <GiftedDialog ref="customDialog" />
+    <GiftedDialog ref="customDialog" :show-projects="showProjectsDialog" />
     <GiftedPrompts ref="giftedPrompts" />
     <FeedFilters ref="feedFilters" />
 
-    <div class="relative">
-      <button
-        v-if="isRegistered"
-        class="absolute right-6 bottom-0 transform translate-y-1/2 text-center text-4xl leading-none bg-green-600 text-white w-14 py-2.5 rounded-full"
-        @click="openDialog()"
-      >
-        <font-awesome icon="plus" class="fa-fw" />
-      </button>
-    </div>
-
     <!-- Results List -->
     <div class="mt-4 mb-4">
-      <div class="flex items-center mb-4">
-        <h2 class="text-xl font-bold flex items-center gap-4">
-          Latest Activity
-          <button
-            v-if="resultsAreFiltered()"
-            class="bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] px-3 py-1.5 rounded-md text-xs text-white"
-            @click="openFeedFilters()"
-          >
-            <font-awesome icon="filter" class="fa-fw" />
-          </button>
-          <button
-            v-else
-            class="bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] px-3 py-1.5 rounded-md text-xs text-white"
-            @click="openFeedFilters()"
-          >
-            <font-awesome icon="filter" class="fa-fw" />
-          </button>
-        </h2>
+      <div class="flex gap-2 items-center mb-3">
+        <h2 class="text-xl font-bold">Latest Activity</h2>
+        <button
+          v-if="resultsAreFiltered()"
+          class="block ms-auto 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-2 rounded-full"
+          @click="openFeedFilters()"
+        >
+          <font-awesome
+            icon="filter"
+            class="block text-center w-[1em] translate-y-[0.05em]"
+          />
+        </button>
+        <button
+          v-else
+          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-2 rounded-full"
+          @click="openFeedFilters()"
+        >
+          <font-awesome
+            icon="filter"
+            class="block text-center w-[1em] translate-y-[0.05em]"
+          />
+        </button>
       </div>
 
       <div
@@ -353,6 +326,7 @@ import * as serverUtil from "../libs/endorserServer";
 import { logger } from "../utils/logger";
 import { GiveRecordWithContactInfo } from "../interfaces/give";
 import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
+import * as Package from "../../package.json";
 
 interface Claim {
   claim?: Claim; // For nested claims in Verifiable Credentials
@@ -443,11 +417,13 @@ export default class HomeView extends Vue {
 
   AppString = AppString;
   PASSKEYS_ENABLED = PASSKEYS_ENABLED;
+  package = Package;
 
   activeDid = "";
   allContacts: Array<Contact> = [];
   allMyDids: Array<string> = [];
   apiServer = "";
+  blockedContactDids: Array<string> = [];
   feedData: GiveRecordWithContactInfo[] = [];
   feedPreviousOldestId?: string;
   feedLastViewedClaimId?: string;
@@ -474,6 +450,7 @@ export default class HomeView extends Vue {
   selectedImageData: Blob | null = null;
   isImageViewerOpen = false;
   imageCache: Map<string, Blob | null> = new Map();
+  showProjectsDialog = false;
 
   /**
    * Initializes the component on mount
@@ -519,7 +496,6 @@ export default class HomeView extends Vue {
       // Retrieve DIDs with better error handling
       try {
         this.allMyDids = await retrieveAccountDids();
-        logConsoleAndDb(`[HomeView] Retrieved ${this.allMyDids.length} DIDs`);
       } catch (error) {
         logConsoleAndDb(`[HomeView] Failed to retrieve DIDs: ${error}`, true);
         throw new Error(
@@ -552,9 +528,6 @@ export default class HomeView extends Vue {
         if (USE_DEXIE_DB) {
           settings = await retrieveSettingsForActiveAccount();
         }
-        logConsoleAndDb(
-          `[HomeView] Retrieved settings for ${settings.activeDid || "no active DID"}`,
-        );
       } catch (error) {
         logConsoleAndDb(
           `[HomeView] Failed to retrieve settings: ${error}`,
@@ -571,25 +544,14 @@ export default class HomeView extends Vue {
 
       // Load contacts with graceful fallback
       try {
-        const platformService = PlatformServiceFactory.getInstance();
-        const dbContacts = await platformService.dbQuery(
-          "SELECT * FROM contacts",
-        );
-        this.allContacts = databaseUtil.mapQueryResultToValues(
-          dbContacts,
-        ) as Contact[];
-        if (USE_DEXIE_DB) {
-          this.allContacts = await db.contacts.toArray();
-        }
-        logConsoleAndDb(
-          `[HomeView] Retrieved ${this.allContacts.length} contacts`,
-        );
+        this.loadContacts();
       } catch (error) {
         logConsoleAndDb(
           `[HomeView] Failed to retrieve contacts: ${error}`,
           true,
         );
         this.allContacts = []; // Ensure we have a valid empty array
+        this.blockedContactDids = [];
         this.$notify(
           {
             group: "alert",
@@ -630,7 +592,7 @@ export default class HomeView extends Vue {
             this.activeDid,
           );
           if (resp.status === 200) {
-            await databaseUtil.updateAccountSettings(this.activeDid, {
+            await databaseUtil.updateDidSpecificSettings(this.activeDid, {
               isRegistered: true,
               ...(await databaseUtil.retrieveSettingsForActiveAccount()),
             });
@@ -641,9 +603,6 @@ export default class HomeView extends Vue {
               });
             }
             this.isRegistered = true;
-            logConsoleAndDb(
-              `[HomeView] User ${this.activeDid} is now registered`,
-            );
           }
         } catch (error) {
           logConsoleAndDb(
@@ -685,11 +644,6 @@ export default class HomeView extends Vue {
           this.newOffersToUserHitLimit = offersToUser.hitLimit;
           this.numNewOffersToUserProjects = offersToProjects.data.length;
           this.newOffersToUserProjectsHitLimit = offersToProjects.hitLimit;
-
-          logConsoleAndDb(
-            `[HomeView] Retrieved ${this.numNewOffersToUser} user offers and ` +
-              `${this.numNewOffersToUserProjects} project offers`,
-          );
         }
       } catch (error) {
         logConsoleAndDb(
@@ -761,6 +715,9 @@ export default class HomeView extends Vue {
     if (USE_DEXIE_DB) {
       this.allContacts = await db.contacts.toArray();
     }
+    this.blockedContactDids = this.allContacts
+      .filter((c) => !c.iViewContent)
+      .map((c) => c.did);
   }
 
   /**
@@ -785,7 +742,7 @@ export default class HomeView extends Vue {
           if (USE_DEXIE_DB) {
             settings = await retrieveSettingsForActiveAccount();
           }
-          await databaseUtil.updateAccountSettings(this.activeDid, {
+          await databaseUtil.updateDidSpecificSettings(this.activeDid, {
             apiServer: this.apiServer,
             isRegistered: true,
             ...settings,
@@ -1028,6 +985,7 @@ export default class HomeView extends Vue {
       );
       if (results.data.length > 0) {
         endOfResults = false;
+        // gather any contacts that user has blocked from view
         await this.processFeedResults(results.data);
         await this.updateFeedLastViewedId(results.data);
       }
@@ -1215,7 +1173,7 @@ export default class HomeView extends Vue {
   }
 
   /**
-   * Checks if record should be included based on filters
+   * Checks if record should be included based on filters & preferences
    *
    * @internal
    * @callGraph
@@ -1241,6 +1199,10 @@ export default class HomeView extends Vue {
     record: GiveSummaryRecord,
     fulfillsPlan?: FulfillsPlan,
   ): boolean {
+    if (this.blockedContactDids.includes(record.issuerDid)) {
+      return false;
+    }
+
     if (!this.isAnyFeedFilterOn) {
       return true;
     }
@@ -1637,17 +1599,33 @@ export default class HomeView extends Vue {
    * @param giver Optional contact info for giver
    * @param description Optional gift description
    */
-  openDialog(giver?: GiverReceiverInputInfo, description?: string) {
-    (this.$refs.customDialog as GiftedDialog).open(
-      giver,
-      {
-        did: this.activeDid,
-        name: "you",
-      } as GiverReceiverInputInfo,
-      undefined,
-      "Given by " + (giver?.name || "someone not named"),
-      description,
-    );
+  openDialog(giver?: GiverReceiverInputInfo | "Unnamed", description?: string) {
+    if (giver === "Unnamed") {
+      // Special case: Pass undefined to trigger Step 1, but with "Unnamed" pre-selected
+      (this.$refs.customDialog as GiftedDialog).open(
+        undefined,
+        {
+          did: this.activeDid,
+          name: "You",
+        } as GiverReceiverInputInfo,
+        undefined,
+        "Given by Unnamed",
+        description,
+      );
+      // Immediately select "Unnamed" and move to Step 2
+      (this.$refs.customDialog as GiftedDialog).selectGiver();
+    } else {
+      (this.$refs.customDialog as GiftedDialog).open(
+        giver,
+        {
+          did: this.activeDid,
+          name: "You",
+        } as GiverReceiverInputInfo,
+        undefined,
+        "Given by " + (giver?.name || "someone not named"),
+        description,
+      );
+    }
   }
 
   /**
@@ -1843,7 +1821,7 @@ export default class HomeView extends Vue {
             this.axios,
           );
 
-          if (result.type === "success") {
+          if (result.success) {
             this.$notify(
               {
                 group: "alert",
@@ -1881,5 +1859,18 @@ export default class HomeView extends Vue {
       this.$router.push({ name: "contact-qr" });
     }
   }
+
+  openDialogPerson(
+    giver?: GiverReceiverInputInfo | "Unnamed",
+    description?: string,
+  ) {
+    this.showProjectsDialog = false;
+    this.openDialog(giver, description);
+  }
+
+  openProjectDialog() {
+    this.showProjectsDialog = true;
+    (this.$refs.customDialog as any).open();
+  }
 }
 </script>

src/views/ImportAccountView.vue

@@ -51,7 +51,7 @@
 
       <div v-if="numAccounts == 1" class="mt-4">
         <input v-model="shouldErase" type="checkbox" class="mr-2" />
-        <label>Erase the previous identifier.</label>
+        <label>Erase previous identifiers.</label>
       </div>
 
       <div v-if="isNotProdServer()" class="mt-4 text-blue-500">
@@ -88,17 +88,9 @@ import { Router } from "vue-router";
 
 import { AppString, NotificationIface, USE_DEXIE_DB } from "../constants/app";
 import * as databaseUtil from "../db/databaseUtil";
-import {
-  accountsDBPromise,
-  retrieveSettingsForActiveAccount,
-} from "../db/index";
-import {
-  DEFAULT_ROOT_DERIVATION_PATH,
-  deriveAddress,
-  newIdentifier,
-} from "../libs/crypto";
-import { retrieveAccountCount, saveNewIdentity } from "../libs/util";
-import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
+import { retrieveSettingsForActiveAccount } from "../db/index";
+import { DEFAULT_ROOT_DERIVATION_PATH } from "../libs/crypto";
+import { retrieveAccountCount, importFromMnemonic } from "../libs/util";
 import { logger } from "../utils/logger";
 
 @Component({
@@ -115,12 +107,9 @@ export default class ImportAccountView extends Vue {
   $router!: Router;
 
   apiServer = "";
-  address = "";
   derivationPath = DEFAULT_ROOT_DERIVATION_PATH;
   mnemonic = "";
   numAccounts = 0;
-  privateHex = "";
-  publicHex = "";
   showAdvanced = false;
   shouldErase = false;
 
@@ -143,33 +132,16 @@ export default class ImportAccountView extends Vue {
   }
 
   public async fromMnemonic() {
-    const mne: string = this.mnemonic.trim().toLowerCase();
     try {
-      [this.address, this.privateHex, this.publicHex] = deriveAddress(
-        mne,
+      await importFromMnemonic(
+        this.mnemonic,
         this.derivationPath,
+        this.shouldErase,
       );
-
-      const newId = newIdentifier(
-        this.address,
-        this.publicHex,
-        this.privateHex,
-        this.derivationPath,
-      );
-
-      const accountsDB = await accountsDBPromise;
-      if (this.shouldErase) {
-        const platformService = PlatformServiceFactory.getInstance();
-        await platformService.dbExec("DELETE FROM accounts");
-        if (USE_DEXIE_DB) {
-          await accountsDB.accounts.clear();
-        }
-      }
-      await saveNewIdentity(newId, mne, this.derivationPath);
       this.$router.push({ name: "account" });
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (err: any) {
-      logger.error("Error saving mnemonic & updating settings:", err);
+      logger.error("Error importing from mnemonic:", err);
       if (err == "Error: invalid mnemonic") {
         this.$notify(
           {

src/views/ImportDerivedAccountView.vue

@@ -79,7 +79,8 @@ import {
   newIdentifier,
   nextDerivationPath,
 } from "../libs/crypto";
-import { accountsDBPromise, db } from "../db/index";
+import * as databaseUtil from "../db/databaseUtil";
+import { db } from "../db/index";
 import { MASTER_SETTINGS_KEY } from "../db/tables/settings";
 import {
   retrieveAllAccountsMetadata,
@@ -164,23 +165,15 @@ export default class ImportAccountView extends Vue {
 
     try {
       await saveNewIdentity(newId, mne, newDerivPath);
-      if (USE_DEXIE_DB) {
-        const accountsDB = await accountsDBPromise;
-        await accountsDB.accounts.add({
-          dateCreated: new Date().toISOString(),
-          derivationPath: newDerivPath,
-          did: newId.did,
-          identity: JSON.stringify(newId),
-          mnemonic: mne,
-          publicKeyHex: newId.keys[0].publicKeyHex,
-        });
-      }
 
       // record that as the active DID
       const platformService = PlatformServiceFactory.getInstance();
       await platformService.dbExec("UPDATE settings SET activeDid = ?", [
         newId.did,
       ]);
+      await databaseUtil.updateDidSpecificSettings(newId.did, {
+        isRegistered: false,
+      });
       if (USE_DEXIE_DB) {
         await db.settings.update(MASTER_SETTINGS_KEY, {
           activeDid: newId.did,

src/views/InviteOneView.vue

@@ -83,7 +83,7 @@
               <span
                 v-else
                 class="text-center text-slate-500 cursor-pointer"
-                :title="inviteLink(invite.jwt)"
+                :title="invite.inviteIdentifier"
                 @click="
                   showInvite(
                     invite.inviteIdentifier,
@@ -241,7 +241,7 @@ export default class InviteOneView extends Vue {
   }
 
   inviteLink(jwt: string): string {
-    return APP_SERVER + "/invite-one-accept/" + jwt;
+    return APP_SERVER + "/deep-link/invite-one-accept/" + jwt;
   }
 
   copyInviteAndNotify(inviteId: string, jwt: string) {
@@ -324,7 +324,7 @@ export default class InviteOneView extends Vue {
           );
           await axios.post(
             this.apiServer + "/api/userUtil/invite",
-            { inviteIdentifier, inviteJwt, notes, expiresAt },
+            { inviteJwt, notes, expiresAt },
             { headers },
           );
           const newInvite = {

src/views/NewActivityView.vue

@@ -257,7 +257,7 @@ export default class NewActivityView extends Vue {
   async expandOffersToUserAndMarkRead() {
     this.showOffersDetails = !this.showOffersDetails;
     if (this.showOffersDetails) {
-      await databaseUtil.updateAccountSettings(this.activeDid, {
+      await databaseUtil.updateDidSpecificSettings(this.activeDid, {
         lastAckedOfferToUserJwtId: this.newOffersToUser[0].jwtId,
       });
       if (USE_DEXIE_DB) {
@@ -285,7 +285,7 @@ export default class NewActivityView extends Vue {
     );
     if (index !== -1 && index < this.newOffersToUser.length - 1) {
       // Set to the next offer's jwtId
-      await databaseUtil.updateAccountSettings(this.activeDid, {
+      await databaseUtil.updateDidSpecificSettings(this.activeDid, {
         lastAckedOfferToUserJwtId: this.newOffersToUser[index + 1].jwtId,
       });
       if (USE_DEXIE_DB) {
@@ -295,7 +295,7 @@ export default class NewActivityView extends Vue {
       }
     } else {
       // it's the last entry (or not found), so just keep it the same
-      await databaseUtil.updateAccountSettings(this.activeDid, {
+      await databaseUtil.updateDidSpecificSettings(this.activeDid, {
         lastAckedOfferToUserJwtId: this.lastAckedOfferToUserJwtId,
       });
       if (USE_DEXIE_DB) {
@@ -319,7 +319,7 @@ export default class NewActivityView extends Vue {
     this.showOffersToUserProjectsDetails =
       !this.showOffersToUserProjectsDetails;
     if (this.showOffersToUserProjectsDetails) {
-      await databaseUtil.updateAccountSettings(this.activeDid, {
+      await databaseUtil.updateDidSpecificSettings(this.activeDid, {
         lastAckedOfferToUserProjectsJwtId:
           this.newOffersToUserProjects[0].jwtId,
       });
@@ -349,7 +349,7 @@ export default class NewActivityView extends Vue {
     );
     if (index !== -1 && index < this.newOffersToUserProjects.length - 1) {
       // Set to the next offer's jwtId
-      await databaseUtil.updateAccountSettings(this.activeDid, {
+      await databaseUtil.updateDidSpecificSettings(this.activeDid, {
         lastAckedOfferToUserProjectsJwtId:
           this.newOffersToUserProjects[index + 1].jwtId,
       });
@@ -361,7 +361,7 @@ export default class NewActivityView extends Vue {
       }
     } else {
       // it's the last entry (or not found), so just keep it the same
-      await databaseUtil.updateAccountSettings(this.activeDid, {
+      await databaseUtil.updateDidSpecificSettings(this.activeDid, {
         lastAckedOfferToUserProjectsJwtId:
           this.lastAckedOfferToUserProjectsJwtId,
       });

src/views/OnboardMeetingSetupView.vue

@@ -720,7 +720,7 @@ export default class OnboardMeetingView extends Vue {
 
   onboardMeetingMembersLink(): string {
     if (this.currentMeeting) {
-      return `${APP_SERVER}/onboard-meeting-members/${this.currentMeeting?.groupId}?password=${encodeURIComponent(
+      return `${APP_SERVER}/deep-link/onboard-meeting-members/${this.currentMeeting?.groupId}?password=${encodeURIComponent(
         this.currentMeeting?.password || "",
       )}`;
     }

src/views/ProjectViewView.vue

@@ -27,6 +27,12 @@
           >
             <font-awesome icon="pen" class="text-sm text-blue-500 ml-2 mb-1" />
           </button>
+          <button title="Copy Link to Project" @click="onCopyLinkClick()">
+            <font-awesome
+              icon="link"
+              class="text-sm text-slate-500 ml-2 mb-1"
+            />
+          </button>
         </h2>
       </div>
     </div>
@@ -52,16 +58,28 @@
                   icon="user"
                   class="fa-fw text-slate-400"
                 ></font-awesome>
-                {{ issuerInfoObject?.displayName }}
-                <span v-if="!serverUtil.isEmptyOrHiddenDid(issuer)">
-                  <a :href="`/did/${issuer}`" class="text-blue-500">
+                <span class="truncate inline-block max-w-[calc(100%-2rem)]">
+                  {{ issuerInfoObject?.displayName }}
+                </span>
+
+                <span
+                  v-if="!serverUtil.isHiddenDid(issuer)"
+                  class="inline-flex items-center"
+                >
+                  <router-link
+                    :to="{
+                      path: '/did/' + encodeURIComponent(issuer),
+                    }"
+                    class="text-blue-500 ml-1"
+                    title="See more about this person"
+                  >
                     <font-awesome
                       icon="arrow-up-right-from-square"
                       class="fa-fw"
                     />
-                  </a>
+                  </router-link>
                 </span>
-                <span v-else-if="serverUtil.isHiddenDid(issuer)">
+                <span v-if="serverUtil.isHiddenDid(issuer)" class="ml-1">
                   <font-awesome
                     icon="info-circle"
                     class="fa-fw text-blue-500 cursor-pointer"
@@ -105,7 +123,7 @@
                   class="fa-fw text-slate-400"
                 ></font-awesome>
                 <a
-                  :href="addScheme(url)"
+                  :href="ensureScheme(url)"
                   target="_blank"
                   class="underline text-blue-500"
                 >
@@ -196,63 +214,11 @@
       </div>
     </div>
 
-    <div v-if="activeDid && isRegistered">
-      <div class="text-center">
-        <p class="mt-2 mt-4 text-center">Record a contribution from:</p>
-      </div>
-      <ul
-        class="grid grid-cols-4 sm:grid-cols-5 md:grid-cols-6 gap-x-3 gap-y-5 text-center mb-5 mt-2"
-      >
-        <li @click="openGiftDialogToProject({ name: 'you', did: activeDid })">
-          <font-awesome
-            icon="hand"
-            class="fa-fw text-blue-500 text-5xl cursor-pointer"
-          />
-          <h3
-            class="mt-5 text-xs text-blue-500 font-medium text-ellipsis whitespace-nowrap overflow-hidden cursor-pointer"
-          >
-            You
-          </h3>
-        </li>
-        <li @click="openGiftDialogToProject()">
-          <img
-            src="../assets/blank-square.svg"
-            class="mx-auto border border-blue-300 rounded-md mb-1 cursor-pointer"
-          />
-          <h3
-            class="text-xs text-blue-500 italic font-medium text-ellipsis whitespace-nowrap overflow-hidden cursor-pointer"
-          >
-            Unnamed/Unknown
-          </h3>
-        </li>
-        <li
-          v-for="contact in allContacts.slice(0, 5)"
-          :key="contact.did"
-          @click="openGiftDialogToProject(contact)"
-        >
-          <EntityIcon
-            :contact="contact"
-            :icon-size="64"
-            class="mx-auto border border-blue-300 rounded-md mb-1 cursor-pointer"
-          />
-          <h3
-            class="text-xs text-blue-500 font-medium text-ellipsis whitespace-nowrap overflow-hidden cursor-pointer"
-          >
-            {{ contact.name || "(no name)" }}
-          </h3>
-        </li>
-        <li>
-          <span
-            v-if="allContacts.length >= 5"
-            class="flex align-bottom text-xs text-blue-500 mt-12 cursor-pointer"
-            @click="onClickAllContactsGifting()"
-          >
-            ... or someone else...
-          </span>
-        </li>
-      </ul>
-    </div>
-    <GiftedDialog ref="giveDialogToThis" :to-project-id="projectId" />
+    <GiftedDialog
+      ref="giveDialogToThis"
+      :to-project-id="projectId"
+      :is-from-project-view="true"
+    />
 
     <!-- Offers & Gifts to & from this -->
     <div class="grid items-start grid-cols-1 sm:grid-cols-3 gap-4 mt-4">
@@ -518,7 +484,12 @@
             </button>
           </div>
         </div>
-        <GiftedDialog ref="giveDialogFromThis" :from-project-id="projectId" />
+        <GiftedDialog
+          ref="giveDialogFromThis"
+          :from-project-id="projectId"
+          :show-projects="true"
+          :is-from-project-view="true"
+        />
 
         <h3 class="text-lg font-bold mb-3 mt-4">
           Benefitted From This Project
@@ -624,7 +595,7 @@ import TopMessage from "../components/TopMessage.vue";
 import QuickNav from "../components/QuickNav.vue";
 import EntityIcon from "../components/EntityIcon.vue";
 import ProjectIcon from "../components/ProjectIcon.vue";
-import { NotificationIface, USE_DEXIE_DB } from "../constants/app";
+import { APP_SERVER, NotificationIface, USE_DEXIE_DB } from "../constants/app";
 import * as databaseUtil from "../db/databaseUtil";
 import {
   db,
@@ -638,6 +609,7 @@ import { retrieveAccountDids } from "../libs/util";
 import HiddenDidDialog from "../components/HiddenDidDialog.vue";
 import { logger } from "../utils/logger";
 import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
+import { useClipboard } from "@vueuse/core";
 /**
  * Project View Component
  * @author Matthew Raymer
@@ -834,6 +806,28 @@ export default class ProjectViewView extends Vue {
     });
   }
 
+  onCopyLinkClick() {
+    const shortestProjectId = this.projectId.startsWith(
+      serverUtil.ENDORSER_CH_HANDLE_PREFIX,
+    )
+      ? this.projectId.substring(serverUtil.ENDORSER_CH_HANDLE_PREFIX.length)
+      : this.projectId;
+    const deepLink = `${APP_SERVER}/deep-link/project/${shortestProjectId}`;
+    useClipboard()
+      .copy(deepLink)
+      .then(() => {
+        this.$notify(
+          {
+            group: "alert",
+            type: "toast",
+            title: "Copied",
+            text: "A link to this project was copied to the clipboard.",
+          },
+          2000,
+        );
+      });
+  }
+
   // Isn't there a better way to make this available to the template?
   expandText() {
     this.expanded = true;
@@ -1229,21 +1223,52 @@ export default class ProjectViewView extends Vue {
     );
   }
 
-  openGiftDialogToProject(contact?: libsUtil.GiverReceiverInputInfo) {
-    (this.$refs.giveDialogToThis as GiftedDialog).open(
-      contact,
-      undefined,
-      undefined,
-      (contact?.name || "Someone not named") + ` gave to this project`,
-    );
+  openGiftDialogToProject(
+    contact?: libsUtil.GiverReceiverInputInfo | "Unnamed",
+  ) {
+    if (contact === "Unnamed") {
+      // Special case: Pass undefined to trigger Step 1, but with "Unnamed" pre-selected
+      (this.$refs.giveDialogToThis as GiftedDialog).open(
+        undefined,
+        undefined,
+        undefined,
+        "Given by Unnamed to this project",
+      );
+      // Immediately select "Unnamed" and move to Step 2
+      (this.$refs.giveDialogToThis as GiftedDialog).selectGiver();
+    } else {
+      // Open straight to Step 2 with current user as giver and current project as recipient
+      (this.$refs.giveDialogToThis as GiftedDialog).open(
+        {
+          did: this.activeDid,
+          name: "You",
+        },
+        {
+          did: this.issuer,
+          name: this.name,
+          handleId: this.projectId,
+          image: this.imageUrl,
+        },
+        undefined,
+        `Given to ${this.name}`,
+      );
+    }
   }
 
   openGiftDialogFromProject() {
+    // Set the project as giver and the current user as recipient
     (this.$refs.giveDialogFromThis as GiftedDialog).open(
-      undefined,
+      {
+        did: undefined,
+        name: this.name,
+        handleId: this.projectId,
+        image: this.imageUrl,
+      },
       { did: this.activeDid, name: "You" },
       undefined,
-      `This project gave to you`,
+      `${this.name} gave to you`,
+      undefined,
+      undefined,
     );
   }
 
@@ -1296,7 +1321,7 @@ export default class ProjectViewView extends Vue {
   }
 
   // return an HTTPS URL if it's not a global URL
-  addScheme(url: string) {
+  ensureScheme(url: string) {
     if (!libsUtil.isGlobalUri(url)) {
       return "https://" + url;
     }
@@ -1425,7 +1450,7 @@ export default class ProjectViewView extends Vue {
       this.apiServer,
       this.axios,
     );
-    if (result.type === "success") {
+    if (result.success) {
       this.$notify(
         {
           group: "alert",
@@ -1457,7 +1482,13 @@ export default class ProjectViewView extends Vue {
   }
 
   openHiddenDidDialog() {
+    const shortestProjectId = this.projectId.startsWith(
+      serverUtil.ENDORSER_CH_HANDLE_PREFIX,
+    )
+      ? this.projectId.substring(serverUtil.ENDORSER_CH_HANDLE_PREFIX.length)
+      : this.projectId;
     (this.$refs.hiddenDidDialog as HiddenDidDialog).open(
+      "project/" + shortestProjectId,
       "creator",
       this.issuerVisibleToDids,
       this.allContacts,

src/views/QuickActionBvcEndView.vue

@@ -155,7 +155,7 @@ import { Contact } from "../db/tables/contacts";
 import {
   GenericCredWrapper,
   GenericVerifiableCredential,
-  ErrorResult,
+  CreateAndSubmitClaimResult,
 } from "../interfaces";
 import {
   BVC_MEETUPS_PROJECT_CLAIM_ID,
@@ -298,28 +298,29 @@ export default class QuickActionBvcBeginView extends Vue {
       }
 
       // in parallel, make a confirmation for each selected claim and send them all to the server
-      const confirmResults = await Promise.allSettled(
-        this.claimsToConfirmSelected.map(async (jwtId) => {
-          const record = this.claimsToConfirm.find(
-            (claim) => claim.id === jwtId,
-          );
-          if (!record) {
-            return { type: "error", error: "Record not found." };
-          }
-          return createAndSubmitConfirmation(
-            this.activeDid,
-            record.claim as GenericVerifiableCredential,
-            record.id,
-            record.handleId,
-            this.apiServer,
-            axios,
-          );
-        }),
-      );
+      const confirmResults: PromiseSettledResult<CreateAndSubmitClaimResult>[] =
+        await Promise.allSettled(
+          this.claimsToConfirmSelected.map(async (jwtId) => {
+            const record = this.claimsToConfirm.find(
+              (claim) => claim.id === jwtId,
+            );
+            if (!record) {
+              return { success: false, error: "Record not found." };
+            }
+            return createAndSubmitConfirmation(
+              this.activeDid,
+              record.claim as GenericVerifiableCredential,
+              record.id,
+              record.handleId,
+              this.apiServer,
+              axios,
+            );
+          }),
+        );
       // check for any rejected confirmations
       const confirmsSucceeded = confirmResults.filter(
-        (result) =>
-          result.status === "fulfilled" && result.value.type === "success",
+        // 'fulfilled' is the status in a successful PromiseFulfilledResult
+        (result) => result.status === "fulfilled" && result.value.success,
       );
       if (confirmsSucceeded.length < this.claimsToConfirmSelected.length) {
         logger.error("Error sending confirmations:", confirmResults);
@@ -353,7 +354,7 @@ export default class QuickActionBvcBeginView extends Vue {
           undefined,
           BVC_MEETUPS_PROJECT_CLAIM_ID,
         );
-        giveSucceeded = giveResult.type === "success";
+        giveSucceeded = giveResult.success;
         if (!giveSucceeded) {
           logger.error("Error sending give:", giveResult);
           this.$notify(
@@ -362,7 +363,7 @@ export default class QuickActionBvcBeginView extends Vue {
               type: "danger",
               title: "Error",
               text:
-                (giveResult as ErrorResult)?.error?.userMessage ||
+                (giveResult as CreateAndSubmitClaimResult)?.error ||
                 "There was an error sending that give.",
             },
             5000,

src/views/SearchAreaView.vue

@@ -215,7 +215,7 @@ export default class SearchAreaView extends Vue {
         if (USE_DEXIE_DB) {
           await db.open();
           await db.settings.update(MASTER_SETTINGS_KEY, {
-            searchBoxes: [newSearchBox],
+            searchBoxes: searchBoxes as unknown, // Type assertion for Dexie compatibility
           });
         }
         this.searchBox = newSearchBox;
@@ -269,7 +269,7 @@ export default class SearchAreaView extends Vue {
       if (USE_DEXIE_DB) {
         await db.open();
         await db.settings.update(MASTER_SETTINGS_KEY, {
-          searchBoxes: [],
+          searchBoxes: "[]" as unknown as string, // Type assertion for Dexie compatibility
           filterFeedByNearby: false,
         });
       }

src/views/ShareMyContactInfoView.vue

@@ -105,7 +105,7 @@ export default class ShareMyContactInfoView extends Vue {
               group: "alert",
               type: "info",
               title: "Copied",
-              text: "Your contact info was copied to the clipboard. Have them paste it in the box on their 'Contacts' screen.",
+              text: "Your contact info was copied to the clipboard. Have them click on it, or paste it in the box on their 'Contacts' screen.",
             },
             5000,
           );

src/views/StartView.vue

@@ -82,6 +82,18 @@
             Derive new address from existing seed
           </a>
         </div>
+
+        <!-- Database Migration Section -->
+        <div class="mt-8 pt-6 border-t border-gray-200">
+          <div class="flex justify-center">
+            <router-link
+              :to="{ name: 'database-migration' }"
+              class="block w-fit text-center text-md bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-4 py-2 rounded-md"
+            >
+              Migrate My Old Data
+            </router-link>
+          </div>
+        </div>
       </div>
     </div>
   </section>

src/views/TestView.vue

@@ -182,6 +182,15 @@
         >
           Accounts
         </button>
+        <button
+          class="text-sm text-blue-600 hover:text-blue-800 underline"
+          @click="
+            sqlQuery = 'SELECT * FROM contacts;';
+            executeSql();
+          "
+        >
+          Contacts
+        </button>
         <button
           class="text-sm text-blue-600 hover:text-blue-800 underline"
           @click="

src/views/UserProfileView.vue

@@ -16,6 +16,7 @@
         </button>
         Individual Profile
       </h1>
+      <div class="text-sm text-center text-slate-500"></div>
     </div>
 
     <!-- Loading Animation -->
@@ -32,6 +33,12 @@
         <div class="text-sm">
           <font-awesome icon="user" class="fa-fw text-slate-400"></font-awesome>
           {{ didInfo(profile.issuerDid, activeDid, allMyDids, allContacts) }}
+          <button title="Copy Link to Profile" @click="onCopyLinkClick()">
+            <font-awesome
+              icon="link"
+              class="text-sm text-slate-500 ml-2 mb-1"
+            />
+          </button>
         </div>
         <p v-if="profile.description" class="mt-4 text-slate-600">
           {{ profile.description }}
@@ -100,6 +107,7 @@ import { Router, RouteLocationNormalizedLoaded } from "vue-router";
 import QuickNav from "../components/QuickNav.vue";
 import TopMessage from "../components/TopMessage.vue";
 import {
+  APP_SERVER,
   DEFAULT_PARTNER_API_SERVER,
   NotificationIface,
   USE_DEXIE_DB,
@@ -113,6 +121,7 @@ import { retrieveAccountDids } from "../libs/util";
 import { logger } from "../utils/logger";
 import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
 import { Settings } from "@/db/tables/settings";
+import { useClipboard } from "@vueuse/core";
 @Component({
   components: {
     LMap,
@@ -186,6 +195,10 @@ export default class UserProfileView extends Vue {
       if (response.status === 200) {
         const result = await response.json();
         this.profile = result.data;
+        if (this.profile && this.profile.rowId !== profileId) {
+          // currently the server returns "rowid" with lowercase "i"; remove when that's fixed
+          this.profile.rowId = profileId;
+        }
       } else {
         throw new Error("Failed to load profile");
       }
@@ -204,5 +217,22 @@ export default class UserProfileView extends Vue {
       this.isLoading = false;
     }
   }
+
+  onCopyLinkClick() {
+    const deepLink = `${APP_SERVER}/deep-link/user-profile/${this.profile?.rowId}`;
+    useClipboard()
+      .copy(deepLink)
+      .then(() => {
+        this.$notify(
+          {
+            group: "alert",
+            type: "toast",
+            title: "Copied",
+            text: "A link to this profile was copied to the clipboard.",
+          },
+          2000,
+        );
+      });
+  }
 }
 </script>