Merge branch 'master' into test-playwright

- Added editing to test
- Added variables for other values

.env.development

@@ -1,5 +1,3 @@
 
 # I tried and failed to set things here with vue-cli-service but
 # things may be more reliable with vite so let's try again.
-
-VITE_APP_SERVER=http://localhost:8080

.env.production

@@ -1,6 +1,4 @@
 # Only the variables that start with VITE_ are seen in the application import.meta.env in Vue.
-VITE_APP_SERVER=https://timesafari.app
 VITE_BVC_MEETUPS_PROJECT_CLAIM_ID=https://endorser.ch/entity/01GXYPFF7FA03NXKPYY142PY4H
 VITE_DEFAULT_ENDORSER_API_SERVER=https://api.endorser.ch
 VITE_DEFAULT_IMAGE_API_SERVER=https://image-api.timesafari.app
-VITE_DEFAULT_PARTNER_API_SERVER=https://partner-api.endorser.ch

.eslintrc.js

@@ -14,21 +14,8 @@ module.exports = {
   //   ecmaVersion: 2020,
   // },
   rules: {
-    "max-len": [
-      "warn",
-      {
-        code: 120,
-        ignoreComments: true, // why does this not make it allow comment of any length?
-        ignorePattern: '^\\s*class="[^"]*"$',
-        ignoreStrings: true,
-        ignoreTemplateLiterals: true,
-        ignoreTrailingComments: true,
-        ignoreUrls: true,
-      },
-    ],
     "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
     "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
-    // "prettier/prettier": ["warn", { printWidth: 120 }], // removes errors but adds thousands of warnings
     "@typescript-eslint/no-unnecessary-type-constraint": "off",
   },
 };

CHANGELOG.md

@@ -6,223 +6,9 @@ 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).
 
 
-## [0.4.1] - 2025.02.16
-### Fixed
-- nostr build issue
-- Linting
-
-
-## [0.4.0] - 2025.02.14
-### Changed
-- Images in the home feed now take up the full width of the card.
-- Clicking the image previously, would open the image in a new tab. Now, clicking the image opens the image in a lightbox view.
-
+## [0.3.21] - 2024.08.24
 ### Added
-- Clicking an image also now displays an in-app lightbox view of the image.
-- The lightbox view includes a download button for the image in mobile view.
-
-
-## [0.3.57] - 2025.02.11
-### Added
-- Automatic user creation in onboarding meetings
-
-
-## [0.3.55] - 2025.02.07
-### Added
-- End time for projects
-
-
-## [0.3.54] - 2025.02.06
-### Added
-- Group onboarding meetings
-
-
-## [0.3.53] - 2025.01.30
-### Added
-- Hints for contacting the creator of a project
-
-
-## [0.3.52] - 2025.01.22
-### Fixed
-- User profile endpoint server for map was broken.
-
-
-## [0.3.51] - 2025.01.22
-### Fixed
-- User profile map jumped on first zoom.
-
-
-## [0.3.50] - 2025.01.20 - b9fedcd3fd3e34c3fb0fc79150d1a81a76eaeb40
-### Added
-- User public profiles
-
-
-## [0.3.49] - 2025.01.09 - 36301ed238ff84df25bb11a8d44a295ee7eaf0f8
-### Changed
-- Make all external contact links direct to the contact-import page.
-- Handle all new-single-contact JWTs in the contacts page, and multiple-contact JWTs in the contacts-import page.
-
-
-## [0.3.48] - 2025.01.08 - 398f3e64a376789f7eb1c400cd886f5a2cacd588 (but app shows 07c4e58)
-### Added
-- More sanity-checks on contact-import JWT
-
-
-## [0.3.47] - 2025.01.06 - 5bf6dd1ee32ca7cc46d39bd7afca58365b422f93
-### Added
-- Notes on contacts page with new contact-edit page
-- Contact methods (only on contact-edit page and under DID details)
-- DID view with no DID shows user's info.
-### Changed
-- URL for user's contact info is now URL to this app (not endorser.ch).
-- Extended details (eg. full claim) is beneath details link on claim page.
-
-
-## [0.3.46] - 2025.01.03 - 9e7056616b5e5acc51e5a8cf7354d408029fefb3
-### Added
-- More action-oriented questions for the gift prompts
-### Fixed
-- Contact-list import set visibility for all, even if not chosen.
-
-
-## [0.3.45] - 2025.01.01 - 65402dc68ce69ccc6cb9aa8d2e7a9249bf4298e0
-### Fixed
-- Previous project links stayed when following a link.
-
-
-## [0.3.44] - 2024.12.31 - 694b22987b05482e4527c2478bbe15e6b6f3b532
-### Added
-- Project counts on a map
-
-
-## [0.3.42] - 2024.12.27 - 9751934bc24a1040415a8cfeacbae59ed91f92a5
-### Added
-- Link from certificate page to the claim
-### Changed
-- Contact data sharing is now a verified JWT.
-- Feed pictures are larger.
-
-
-## [0.3.41] - 2024.12.21 - ff6d14138f26daea6216b051562f0a04681f69fc
-### Added
-- Link from certificate page to the claim
-
-
-## [0.3.40] - 2024.12.20 - 77290d9fed3c364243793dc3e9bfe2e994a016b8
-### Added
-- Only show issuer on certificate if it's not the agent.
-
-
-## [0.3.39] - 2024.12.20 - d8819155e2acd2b57fdab523168fa5d1d09e80cc
-### Added
-- Page for a framed claim certificate
-
-
-## [0.3.38] - 2024.12.14 - f8cae5ad4fee1f114320dcce052299eab12108b2
-### Fixed
-- Error on BVC confirmation screen (from IndexedDB refactor)
-
-
-## [0.3.37] - 2024.12.13 - 4d805b43cd25eed73cdd6651f36ad1ec8c109555
-### Added
-- Record a give from a project on the project page.
-- New button on home page opens the gifted dialog.
-- On confirmation buttons on the project page gives, mark when unavailable and explain why.
-### Changed
-- Moved the secret into IndexedDB (and out of localStorage) for more reliability.
-- New "invite" destination page helps troubleshoot when JWT link doesn't come through.
-### Fixed
-- Problem showing claim issuer name
-- Problem going "back" from a project page
-
-
-## [0.3.36] - 2024.11.24 - c8d23647d165016f8a8f575e13d32583242e53ac
-### Changed
-- More friendly default reminder message
-- Blue borders around people to indicate clickability
-
-
-## [0.3.35] - 2024.11.24 - bff7d0a6320b70349185e26bfac72e3bb17f76df
-### Added
-- Daily reliable, hard-coded notification message
-- Setting to change the partner API server
-
-
-## [0.3.33] - 2024.11.07 - adb7b16ecf1343c39cba71a7d6bb0e7a973e1102
-### Fixed
-- Affirm Delivery button on offer claim page didn't work.
-- Plans were not showing by default on project page.
-
-
-## [0.3.32] - 2024.11.06 - 9a3fa38a3fd28f977e06f0265fc39e635c9c5ccd
-### Added
-- Highlight in green new offers to user & to user's projects on the front page.
-
-
-## [0.3.31] - 2024.10.25 - 07c02ab98a09d293dd90d9289a7872e7d681d296
-### Changed
-- Onboarding messages about offers
-
-
-## [0.3.30]
-### Added
-- Onboarding messages
-
-
-## [0.3.29] - 2024.10.09 - babd3832bdfe0c40eaa3869de1b41399a51713c1
-### Added
-- Invite for a contact to join immediately
-### Changed
-- Send signed data to nostr endpoints to verify public key ownership.
-- Enhanced help & help onboarding.
-### Changed in DB or environment
-- Uses Endorser.ch version 4.1.1
-
-
-## [0.3.28] - 2024.09.30 - 84720b94049d29cc0ddd99c50cef2e7176130133
-### Added
-- Posting to nostr apps Trustroots & TripHopping
-- Display of providers on claim view page
-### Changed
-- Switched BVC-meeting-ending gift to be a gift from the group.
-### Changed in DB or environment
-- Requires Endorser.ch version 4.1.0
-
-
-## [0.3.27] - 2024.09.22 - ee23e6f005e47f5bd6f04d804599f6395371b0e4
-### Fixed
-- Error loading BVC claims to confirm
-- Really allow visibility of bulk-imported contacts
-
-
-## [0.3.26] - 2024.09.16 - 8263ed2b29947b3ccc6f3133bbc9454c222bce28
-### Added
-- Separate 'isRegistered' flag for each account
-### Fixed
-- Failure to assign offers to their project
-- Alert when looking at one's own activity if not in contacts.
-
-
-## [0.3.25] - 2024.08.30 - dcbe02d877aecb4cdef2643d90e6595d246a9f82
-### Added
-- "Ideas" now jumps directly to giving prompt or contact list.
-### Fixed
-- Empty giver name on gifted-details view
-- Previously visited project would show up on the giving-details page.
-### Removed
-- All unnecessary localStorage for project IDs
-
-
-## [0.3.23] - 2024.08.30
-### Added
-- Sections in Help for different kinds of users
-- Discovery page parameters so that links with search text work
-- Message when no projects are found
-
-
-## [0.3.21] - 2024.08.24 - a7b89f4bb6da928d56daeffaae7741fa74cc80bf
-### Added
-- Send list of contacts to someone, and move individual contact actions to detail page.
+- Send list of contacts to someone.
 - Prompt for name in pop-up, and send to different contact-sharing screens.
 ### Changed
 - Moved contact actions from list onto detail page

LICENSE

@@ -1,8 +0,0 @@
-The author disclaims copyright to this source code. In place of a legal notice, here is a blessing:
-
-May you do good and not evil. 
-May you find forgiveness for yourself and forgive others.
-May you share freely, never taking more than you give.
-
-________________________________________________________________
-from https://www.sqlite.org/src/info/689401a6cfb4c234 and memorialized here https://spdx.org/licenses/blessing.html

README.md

@@ -10,7 +10,7 @@ See [project.task.yaml](project.task.yaml) for current priorities.
 
 ## Setup
 
-We like pkgx: `sh <(curl https://pkgx.sh) +vite sh`
+We like pkgx: `sh <(curl https://pkgx.sh) +npm sh`
 
 ```
 npm install
@@ -21,8 +21,6 @@ npm install
 npm run dev
 ```
 
-See the test locations for "IMAGE_API_SERVER" or "PARTNER_API_SERVER" below, or use http://localhost:3000 for local endorser.ch
-
 ### Build the test & production app
 ```
 npm run serve
@@ -33,11 +31,6 @@ npm run serve
 npm run lint
 ```
 
-### Run all UI tests
-
-Look below for the "test-all" instructions.
-
-
 ### Compile and minify for test & production
 
 * If there are DB changes: before updating the test server, open browser(s) with current version to test DB migrations.
@@ -48,36 +41,30 @@ Look below for the "test-all" instructions.
 
 * 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).
+* Record what version is currently on production.
 
-* 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`.
-
-* For test, build the app (because test server is not yet set up to build):
+* Run the correct build:
 
+  * Staging
 ```
-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_PASSKEYS_ENABLED=true npm run build
+# (Let's replace this with a .env.development or .env.staging file.)
+# The test BVC_MEETUPS_PROJECT_CLAIM_ID does not resolve as a URL because it's only in the test DB and the prod redirect won't redirect there.
+TIME_SAFARI_APP_TITLE="TimeSafari_Test" VITE_BVC_MEETUPS_PROJECT_CLAIM_ID=https://endorser.ch/entity/01HNTZYJJXTGT0EZS3VEJGX7AK VITE_DEFAULT_ENDORSER_API_SERVER=https://test-api.endorser.ch VITE_DEFAULT_IMAGE_API_SERVER=https://test-image-api.timesafari.app VITE_PASSKEYS_ENABLED=yep npm run build
 ```
 
-   ... and transfer to the test server: `rsync -azvu -e "ssh -i ~/.ssh/..." dist ubuntutest@test.timesafari.app:time-safari`
+  * Production
+```
+# This picks up values from .env.production
+npm run build
+```
 
-    (Let's replace that with a .env.development or .env.staging file.)
+* Get on the server and back up the time-safari/dist folder.
 
-    (Note: The test BVC_MEETUPS_PROJECT_CLAIM_ID does not resolve as a URL because it's only in the test DB and the prod redirect won't redirect there.)
+* `rsync -azvu -e "ssh -i ~/.ssh/..." dist ubuntutest@test.timesafari.app:time-safari`
 
-* For prod, get on the server and run the correct build:
-
-  ... and log onto the server:
-
-  * `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 -`
-
-  (The plain `npm run build` 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/`
-
-* 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.
+* Commit changes. 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.
 
+* [Tag with the new version.](https://gitea.anomalistdesign.com/trent_larson/crowd-funder-for-time-pwa/releases)
 
 
 
@@ -90,20 +77,11 @@ Use the locally running Endorser server:
 
 * Clone and set up https://github.com/trentlarson/endorser-ch and run the following in that directory:
 ```
-npm install
 test/test.sh
-cp .env.local .env
 NODE_ENV=test-local npm run dev
 ```
 
-If that fails, go to the README.md in the endorser-ch directory and follow the instructions there.
-
-* Install playwright browsers:
-```
-npx playwright install
-```
-
-* Now you can run the local tests:
+* Now run the local tests:
 ```
 npm run test-all
 ```
@@ -119,7 +97,7 @@ It's possible to use the global test Endorser (ledger) server (but currently the
 
 
 
-It's possible to run with a minimal set of data; the following starts with the bare minimum of test data:
+It's possible to run with a minimal set of data: the following starts with the bare minimum of test data (but currently the tests don't all succeed):
 ```
 rm ../endorser-ch-test-local.sqlite3
 NODE_ENV=test-local npm run flyway migrate
@@ -128,13 +106,6 @@ NODE_ENV=test-local npm run dev
 ```
 
 
-To run a single test like above with the screenshots, use the following:
-```
-npx playwright test -c playwright.config-local.ts --trace on test-playwright/40-add-contact.spec.ts
-```
-
-
-
 ### Register new user on test server
 
 On the test server, User #0 has rights to register others, so you can start

package.json

@@ -1,6 +1,6 @@
 {
   "name": "TimeSafari",
-  "version": "0.4.1",
+  "version": "0.3.21",
   "scripts": {
     "dev": "vite",
     "serve": "vite preview",
@@ -12,10 +12,6 @@
     "test-all": "npm run build && npx playwright test -c playwright.config-local.ts --trace on"
   },
   "dependencies": {
-    "@capacitor/android": "^6.1.2",
-    "@capacitor/cli": "^6.1.2",
-    "@capacitor/core": "^6.1.2",
-    "@capacitor/ios": "^6.1.2",
     "@dicebear/collection": "^5.4.1",
     "@dicebear/core": "^5.4.1",
     "@ethersproject/hdnode": "^5.7.0",
@@ -28,7 +24,6 @@
     "@simplewebauthn/browser": "^10.0.0",
     "@simplewebauthn/server": "^10.0.0",
     "@tweenjs/tween.js": "^21.1.1",
-    "@types/qrcode": "^1.5.5",
     "@veramo/core": "^5.6.0",
     "@veramo/credential-w3c": "^5.6.0",
     "@veramo/data-store": "^5.6.0",
@@ -37,7 +32,6 @@
     "@veramo/did-provider-peer": "^6.0.0",
     "@veramo/did-resolver": "^5.6.0",
     "@veramo/key-manager": "^5.6.0",
-    "@vue-leaflet/vue-leaflet": "^0.10.1",
     "@vueuse/core": "^10.9.0",
     "@zxing/text-encoding": "^0.9.0",
     "asn1-ber": "^1.2.2",
@@ -47,24 +41,20 @@
     "dexie": "^3.2.7",
     "dexie-export-import": "^4.1.1",
     "did-jwt": "^7.4.7",
-    "did-resolver": "^4.1.0",
     "ethereum-cryptography": "^2.1.3",
     "ethereumjs-util": "^7.1.5",
     "jdenticon": "^3.2.0",
     "js-generate-password": "^0.1.9",
     "js-yaml": "^4.1.0",
-    "leaflet": "^1.9.4",
     "localstorage-slim": "^2.7.0",
     "lru-cache": "^10.2.0",
     "luxon": "^3.4.4",
     "merkletreejs": "^0.3.11",
-    "nostr-tools": "^2.10.4",
     "notiwind": "^2.0.2",
     "papaparse": "^5.4.1",
     "pina": "^0.20.2204228",
     "pinia-plugin-persistedstate": "^3.2.1",
     "qr-code-generator-vue3": "^1.4.21",
-    "qrcode": "^1.5.4",
     "ramda": "^0.29.1",
     "readable-stream": "^4.5.2",
     "reflect-metadata": "^0.1.14",
@@ -93,12 +83,14 @@
     "@typescript-eslint/eslint-plugin": "^6.21.0",
     "@typescript-eslint/parser": "^6.21.0",
     "@vitejs/plugin-vue": "^5.0.4",
+    "@vue-leaflet/vue-leaflet": "^0.10.1",
     "@vue/eslint-config-typescript": "^11.0.3",
     "autoprefixer": "^10.4.19",
     "eslint": "^8.57.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-prettier": "^5.1.3",
     "eslint-plugin-vue": "^9.23.0",
+    "leaflet": "^1.9.4",
     "postcss": "^8.4.38",
     "prettier": "^3.2.5",
     "tailwindcss": "^3.4.1",

playwright.config-local.ts

@@ -1,4 +1,4 @@
-import { defineConfig, devices } from "@playwright/test";
+import { defineConfig, devices } from '@playwright/test';
 
 /**
  * Read environment variables from file.
@@ -11,7 +11,7 @@ import { defineConfig, devices } from "@playwright/test";
  * See https://playwright.dev/docs/test-configuration.
  */
 export default defineConfig({
-  testDir: "./test-playwright",
+  testDir: './test-playwright',
   /* Run tests in files in parallel */
   fullyParallel: true,
   /* Fail the build on CI if you accidentally left test.only in the source code. */
@@ -21,44 +21,44 @@ export default defineConfig({
   /* Opt out of parallel tests on CI. */
   workers: process.env.CI ? 1 : undefined,
   /* Reporter to use. See https://playwright.dev/docs/test-reporters */
-  reporter: "html",
+  reporter: 'html',
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
     /* Base URL to use in actions like `await page.goto('/')`. */
-    baseURL: "http://localhost:8081",
+    baseURL: 'http://localhost:8080',
 
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
-    trace: "on-first-retry",
+    trace: 'on-first-retry',
   },
 
   /* Configure projects for major browsers */
   projects: [
     {
-      name: "chromium",
+      name: 'chromium',
       use: {
-        ...devices["Desktop Chrome"],
+        ...devices['Desktop Chrome'],
         permissions: ["clipboard-read"],
       },
     },
 
     {
-      name: "firefox",
-      use: { ...devices["Desktop Firefox"] },
+      name: 'firefox',
+      use: { ...devices['Desktop Firefox'] },
     },
 
     {
-      name: "webkit",
-      use: { ...devices["Desktop Safari"] },
+      name: 'webkit',
+      use: { ...devices['Desktop Safari'] },
     },
 
     /* Test against mobile viewports. */
     {
-      name: "Mobile Chrome",
-      use: { ...devices["Pixel 5"] },
+      name: 'Mobile Chrome',
+      use: { ...devices['Pixel 5'] },
     },
     {
-      name: "Mobile Safari",
-      use: { ...devices["iPhone 12"] },
+      name: 'Mobile Safari',
+      use: { ...devices['iPhone 12'] },
     },
 
     /* Test against branded browsers. */
@@ -67,14 +67,14 @@ export default defineConfig({
     //   use: { ...devices['Desktop Edge'], channel: 'msedge' },
     // },
     {
-      name: "Google Chrome",
-      use: { ...devices["Desktop Chrome"], channel: "chrome" },
+      name: 'Google Chrome',
+      use: { ...devices['Desktop Chrome'], channel: 'chrome' },
     },
   ],
 
   /* Configure global timeout; default is 30000 milliseconds */
   // the image upload will often not succeed at 5 seconds
-  timeout: 30000, // various tests fail at various times with 25000
+  // timeout: 5000,
 
   /* Run your local dev server before starting the tests */
   /**
@@ -91,8 +91,8 @@ export default defineConfig({
    */
   webServer: {
     command:
-      "VITE_APP_SERVER=http://localhost:8081 VITE_DEFAULT_ENDORSER_API_SERVER=http://localhost:3000 VITE_PASSKEYS_ENABLED=true npm run dev -- --port=8081",
-    url: "http://localhost:8081",
+      "VITE_PASSKEYS_ENABLED=true VITE_DEFAULT_ENDORSER_API_SERVER=http://localhost:3000 npm run dev",
+    url: "http://localhost:8080",
     reuseExistingServer: !process.env.CI,
   },
 });

public/img/icons/safari-pinned-tab-512x512.svg

@@ -1,86 +0,0 @@
-<?xml version="1.0" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
- "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
-<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
- width="512.000000pt" height="512.000000pt" viewBox="0 0 512.000000 512.000000"
- preserveAspectRatio="xMidYMid meet">
-
-<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)"
-fill="#000000" stroke="none">
-<path d="M2480 4005 c-25 -7 -58 -20 -75 -29 -16 -9 -40 -16 -52 -16 -17 0
--24 -7 -28 -27 -3 -16 -14 -45 -24 -65 -21 -41 -13 -55 18 -38 25 13 67 13 92
--1 15 -8 35 -4 87 17 99 39 130 41 197 10 64 -29 77 -31 107 -15 20 11 20 11
--3 35 -12 13 -30 24 -38 24 -24 1 -132 38 -148 51 -8 7 -11 20 -7 32 12 37
--40 47 -126 22z"/>
-<path d="M1450 3775 c-7 -8 -18 -15 -24 -15 -7 0 -31 -14 -54 -32 -29 -22 -38
--34 -29 -40 17 -11 77 -10 77 1 0 5 16 16 35 25 60 29 220 19 290 -18 17 -9
-33 -16 37 -16 4 0 31 -15 60 -34 108 -70 224 -215 282 -353 30 -71 53 -190 42
--218 -10 -27 -23 -8 -52 75 -30 90 -88 188 -120 202 -13 6 -26 9 -29 6 -3 -2
-11 -51 30 -108 28 -83 35 -119 35 -179 0 -120 -22 -127 -54 -17 -11 37 -13 21
--18 -154 -5 -180 -8 -200 -32 -264 -51 -132 -129 -245 -199 -288 -21 -12 -79
--49 -129 -80 -161 -102 -294 -141 -473 -141 -228 0 -384 76 -535 259 -81 99
--118 174 -154 312 -31 121 -35 273 -11 437 19 127 19 125 -4 125 -23 0 -51
--34 -87 -104 -14 -28 -33 -64 -41 -81 -19 -34 -22 -253 -7 -445 9 -106 12
--119 44 -170 19 -30 42 -67 50 -81 64 -113 85 -140 130 -169 28 -18 53 -44 61
--62 8 -20 36 -45 83 -76 62 -39 80 -46 151 -54 44 -5 96 -13 115 -18 78 -20
-238 -31 282 -19 24 6 66 8 95 5 76 -9 169 24 319 114 32 19 80 56 106 82 27
-26 52 48 58 48 5 0 27 26 50 58 48 66 56 70 132 71 62 1 165 29 238 64 112 55
-177 121 239 245 37 76 39 113 10 267 -12 61 -23 131 -26 156 -5 46 -5 47 46
-87 92 73 182 70 263 -8 l51 -49 -6 -61 c-4 -34 -13 -85 -21 -113 -28 -103 -30
--161 -4 -228 16 -44 32 -67 55 -83 18 -11 39 -37 47 -58 10 -23 37 -53 73 -81
-32 -25 69 -57 82 -71 14 -14 34 -26 47 -26 12 0 37 -7 56 -15 20 -8 66 -17
-104 -20 107 -10 110 -11 150 -71 50 -75 157 -177 197 -187 18 -5 53 -24 78
--42 71 -51 176 -82 304 -89 61 -4 127 -12 147 -18 29 -9 45 -8 77 6 23 9 50
-16 60 16 31 0 163 46 216 76 28 15 75 46 105 69 30 23 69 49 85 58 17 8 46 31
-64 51 19 20 40 36 47 36 18 0 77 70 100 120 32 66 45 108 55 173 5 32 16 71
-24 87 43 84 43 376 0 549 -27 105 -43 127 -135 188 -30 21 -65 46 -77 57 -13
-11 -23 17 -23 14 0 -3 21 -46 47 -94 79 -151 85 -166 115 -263 25 -83 28 -110
-28 -226 0 -144 -17 -221 -75 -335 -39 -77 -208 -244 -304 -299 -451 -263 -975
--67 -1138 426 -23 70 -26 95 -28 254 -1 108 -7 183 -14 196 -6 12 -11 31 -11
-43 0 32 31 122 52 149 10 13 18 28 18 34 0 5 25 40 56 78 60 73 172 170 219
-190 30 12 30 13 6 17 -15 2 -29 -2 -37 -12 -6 -9 -16 -16 -22 -16 -6 0 -23
--11 -39 -24 -15 -12 -33 -25 -40 -27 -17 -6 -82 -60 -117 -97 -65 -70 -75 -82
--107 -133 -23 -34 -35 -46 -37 -35 -3 16 20 87 44 134 6 12 9 34 6 48 -4 22
--8 25 -31 19 -14 -3 -38 -15 -53 -26 -34 -24 -34 -21 -6 28 65 112 184 206
-291 227 15 3 39 9 55 12 l27 6 -24 9 c-90 35 -304 -66 -478 -225 -39 -36 -74
--66 -77 -66 -22 0 18 82 72 148 19 23 32 46 28 49 -4 4 -26 13 -49 19 -73 21
--161 54 -171 64 -6 6 -20 10 -32 10 -21 0 -21 -1 -8 -40 45 -130 8 -247 -93
--299 -25 -13 -31 0 -14 29 15 22 1 33 -22 17 -56 -36 -117 -22 -117 28 0 13
--16 47 -35 76 -22 34 -33 60 -29 73 4 16 -3 26 -26 39 -16 10 -30 21 -30 25 1
-18 54 64 87 76 l38 13 -33 5 c-30 4 -115 -18 -154 -42 -13 -7 -20 -5 -27 8 -9
-16 -12 16 -53 1 -160 -61 -258 -104 -258 -114 0 -7 10 -20 21 -31 103 -91 217
--297 249 -449 28 -135 41 -237 35 -276 -14 -91 -48 -170 -97 -220 -44 -47 -68
--60 -68 -40 0 6 4 12 8 15 5 3 24 35 42 72 l33 67 -6 141 c-4 103 -11 158 -26
-205 -12 35 -21 70 -21 77 0 7 -20 56 -45 108 -82 173 -227 322 -392 401 -67
-33 -90 39 -163 42 -108 5 -130 10 -130 28 0 20 -63 20 -80 0z"/>
-<path d="M3710 3765 c0 -20 8 -28 39 -41 22 -8 42 -22 45 -30 5 -14 42 -19 70
--8 10 4 -7 21 -58 55 -41 27 -79 49 -85 49 -6 0 -11 -11 -11 -25z"/>
-<path d="M3173 3734 c-9 -25 10 -36 35 -18 12 8 22 19 22 25 0 16 -50 10 -57
--7z"/>
-<path d="M1982 3728 c6 -16 36 -34 44 -26 3 4 4 14 1 23 -7 17 -51 21 -45 3z"/>
-<path d="M1540 3620 c0 -5 7 -10 16 -10 8 0 12 5 9 10 -3 6 -10 10 -16 10 -5
-0 -9 -4 -9 -10z"/>
-<path d="M4467 3624 c-4 -4 23 -27 60 -50 84 -56 99 -58 67 -9 -28 43 -107 79
--127 59z"/>
-<path d="M655 3552 c-11 -2 -26 -9 -33 -14 -7 -6 -27 -18 -45 -27 -36 -18 -58
--64 -39 -83 9 -9 25 1 70 43 53 48 78 78 70 84 -2 1 -12 -1 -23 -3z"/>
-<path d="M1015 3460 c-112 -24 -247 -98 -303 -165 -53 -65 -118 -214 -136
--311 -20 -113 -20 -145 -1 -231 20 -88 49 -153 102 -230 79 -113 186 -182 331
--214 108 -24 141 -24 247 1 130 30 202 72 316 181 102 100 153 227 152 384 0
-142 -58 293 -150 395 -60 67 -180 145 -261 171 -75 23 -232 34 -297 19z m340
--214 c91 -43 174 -154 175 -234 0 -18 -9 -51 -21 -73 -19 -37 -19 -42 -5 -64
-35 -54 12 -121 -48 -142 -22 -7 -47 -19 -55 -27 -9 -8 -41 -27 -71 -42 -50
--26 -64 -29 -155 -29 -111 0 -152 14 -206 68 -49 49 -63 85 -64 162 0 59 4 78
-28 118 31 52 96 105 141 114 23 5 33 17 56 68 46 103 121 130 225 81z"/>
-<path d="M3985 3464 c-44 -7 -154 -44 -200 -67 -55 -28 -138 -96 -162 -132
--10 -16 -39 -75 -64 -130 l-44 -100 0 -160 0 -160 45 -90 c53 -108 152 -214
-245 -264 59 -31 215 -71 281 -71 53 0 206 40 255 67 98 53 203 161 247 253 53
-113 74 193 74 280 -1 304 -253 564 -557 575 -49 2 -103 1 -120 -1z m311 -220
-c129 -68 202 -209 160 -309 -15 -35 -15 -42 -1 -72 26 -55 -3 -118 -59 -129
--19 -3 -43 -15 -53 -26 -26 -29 -99 -64 -165 -78 -45 -10 -69 -10 -120 -1 -74
-15 -113 37 -161 91 -110 120 -50 331 109 385 24 8 44 23 52 39 6 14 18 38 25
-53 33 72 127 93 213 47z"/>
-<path d="M487 3394 c-21 -12 -27 -21 -25 -40 2 -14 7 -26 12 -27 14 -3 48 48
-44 66 -3 14 -6 14 -31 1z"/>
-</g>
-</svg>

src/App.vue

@@ -45,7 +45,7 @@
 
             <div class="relative w-full pl-4 pr-8 py-2 text-slate-900">
               <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ truncateLongWords(notification.text) }}</p>
+              <p class="text-sm">{{ notification.text }}</p>
 
               <button
                 @click="close(notification.id)"
@@ -68,7 +68,7 @@
 
             <div class="relative w-full pl-4 pr-8 py-2 text-emerald-900">
               <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ truncateLongWords(notification.text) }}</p>
+              <p class="text-sm">{{ notification.text }}</p>
 
               <button
                 @click="close(notification.id)"
@@ -91,7 +91,7 @@
 
             <div class="relative w-full pl-4 pr-8 py-2 text-amber-900">
               <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ truncateLongWords(notification.text) }}</p>
+              <p class="text-sm">{{ notification.text }}</p>
 
               <button
                 @click="close(notification.id)"
@@ -114,7 +114,7 @@
 
             <div class="relative w-full pl-4 pr-8 py-2 text-rose-900">
               <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ truncateLongWords(notification.text) }}</p>
+              <p class="text-sm">{{ notification.text }}</p>
 
               <button
                 @click="close(notification.id)"
@@ -229,7 +229,7 @@
                       ? notification.onCancel(stopAsking)
                       : null;
                     close(notification.id);
-                    stopAsking = false; // reset value for next time they open this modal
+                    stopAsking = false; // reset value
                   "
                   class="block w-full text-center text-md font-bold uppercase bg-slate-600 text-white px-2 py-2 rounded-md"
                 >
@@ -238,7 +238,63 @@
               </div>
             </div>
           </div>
+          <div
+            v-if="notification.type === 'notification-permission'"
+            class="absolute inset-0 h-screen flex flex-col items-center justify-center bg-slate-900/50"
+          >
+            <div
+              class="flex w-11/12 max-w-sm mx-auto mb-3 overflow-hidden bg-white rounded-lg shadow-lg"
+            >
+              <div class="w-full px-6 py-6 text-slate-900 text-center">
+                <p v-if="serviceWorkerReady" class="text-lg mb-4">
+                  Would you like to be notified of new activity once a day?
+                </p>
+                <p v-else class="text-lg mb-4">
+                  Waiting for system initialization, which may take up to 10
+                  seconds...
+                  <fa icon="spinner" spin />
+                </p>
 
+                <div v-if="serviceWorkerReady">
+                  <span class="flex flex-row justify-center">
+                    <span class="mt-2">Yes, tell me at: </span>
+                    <input
+                      type="number"
+                      class="rounded-l border border-r-0 border-slate-400 ml-2 mt-2 px-2 py-2 text-center w-20"
+                      v-model="hourInput"
+                    />
+                    <span
+                      class="rounded-r border border-slate-400 bg-slate-200 text-center text-blue-500 mt-2 px-2 py-2 w-20"
+                      @click="hourAm = !hourAm"
+                    >
+                      <span v-if="hourAm"> AM <fa icon="chevron-down" /> </span>
+                      <span v-else> PM <fa icon="chevron-up" /> </span>
+                    </span>
+                  </span>
+                  <button
+                    class="block w-full text-center text-md font-bold uppercase bg-blue-600 text-white mt-2 px-2 py-2 rounded-md"
+                    @click="
+                      () => {
+                        if (checkHour()) {
+                          close(notification.id);
+                          turnOnNotifications();
+                        }
+                      }
+                    "
+                  >
+                    Turn on Daily Message
+                  </button>
+                </div>
+
+                <button
+                  @click="close(notification.id)"
+                  class="block w-full text-center text-md font-bold uppercase bg-slate-600 text-white mt-4 px-2 py-2 rounded-md"
+                >
+                  No, Not Now
+                </button>
+              </div>
+            </div>
+          </div>
           <div
             v-if="notification.type === 'notification-mute'"
             class="absolute inset-0 h-screen flex flex-col items-center justify-center bg-slate-900/50"
@@ -252,17 +308,17 @@
                 <button
                   class="block w-full text-center text-md font-bold uppercase bg-blue-600 text-white px-2 py-2 rounded-md mb-2"
                 >
-                  For 1 Day
+                  For 1 Hour
                 </button>
                 <button
                   class="block w-full text-center text-md font-bold uppercase bg-blue-600 text-white px-2 py-2 rounded-md mb-2"
                 >
-                  For 2 Days
+                  For 8 Hours
                 </button>
                 <button
                   class="block w-full text-center text-md font-bold uppercase bg-blue-600 text-white px-2 py-2 rounded-md mb-2"
                 >
-                  For 1 Week
+                  For 24 Hours
                 </button>
                 <button
                   class="block w-full text-center text-md font-bold uppercase bg-blue-600 text-white px-2 py-2 rounded-md mb-2"
@@ -278,7 +334,6 @@
               </div>
             </div>
           </div>
-
           <div
             v-if="notification.type === 'notification-off'"
             class="absolute inset-0 h-screen flex flex-col items-center justify-center bg-slate-900/50"
@@ -288,17 +343,17 @@
             >
               <div class="w-full px-6 py-6 text-slate-900 text-center">
                 <p class="text-lg mb-4">
-                  Would you like to <b>turn off</b> this notification?
+                  Would you like to <b>turn off</b> notifications for this app?
                 </p>
 
                 <button
                   @click="
                     close(notification.id);
-                    turnOffNotifications(notification);
+                    turnOffNotifications();
                   "
                   class="block w-full text-center text-md font-bold uppercase bg-rose-600 text-white px-2 py-2 rounded-md mb-2"
                 >
-                  Turn Off Notification
+                  Turn Off Notifications
                 </button>
                 <button
                   @click="close(notification.id)"
@@ -318,116 +373,420 @@
 <style></style>
 
 <script lang="ts">
+import axios from "axios";
 import { Vue, Component } from "vue-facing-decorator";
 
-import { logConsoleAndDb, retrieveSettingsForActiveAccount } from "@/db/index";
-import { NotificationIface } from "./constants/app";
+import * as libsUtil from "@/libs/util";
+
+interface ServiceWorkerMessage {
+  type: string;
+  data: string;
+}
+
+interface ServiceWorkerResponse {
+  // Define the properties and their types
+  success: boolean;
+  message?: string;
+}
+
+// Example interface for error
+interface ErrorResponse {
+  message: string;
+  // Other properties as needed
+}
+
+interface VapidResponse {
+  data: {
+    vapidKey: string;
+  };
+}
+
+interface PushSubscriptionWithTime extends PushSubscriptionJSON {
+  notifyTime: { utcHour: number };
+}
+
+import { DEFAULT_PUSH_SERVER, NotificationIface } from "@/constants/app";
+import { db } from "@/db/index";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
+import { sendTestThroughPushServer } from "@/libs/util";
 
 @Component
 export default class App extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
   stopAsking = false;
+  b64 = "";
+  hourAm = true;
+  hourInput = "8";
+  serviceWorkerReady = true;
 
-  truncateLongWords(sentence: string) {
-    return sentence
-      .split(" ")
-      .map((word) => (word.length > 30 ? word.slice(0, 30) + "..." : word))
-      .join(" ");
+  async mounted() {
+    try {
+      await db.open();
+      const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+      let pushUrl = DEFAULT_PUSH_SERVER;
+      if (settings?.webPushServer) {
+        pushUrl = settings.webPushServer;
+      }
+
+      if (pushUrl.startsWith("http://localhost")) {
+        console.log("Not checking for VAPID in this local environment.");
+      } else {
+        await axios
+          .get(pushUrl + "/web-push/vapid")
+          .then((response: VapidResponse) => {
+            this.b64 = response.data?.vapidKey || "";
+            console.log("Got vapid key:", this.b64);
+            navigator.serviceWorker.addEventListener("controllerchange", () => {
+              console.log("New service worker is now controlling the page");
+            });
+          });
+        if (!this.b64) {
+          this.$notify(
+            {
+              group: "alert",
+              type: "danger",
+              title: "Error Setting Notifications",
+              text: "Could not set notifications.",
+            },
+            -1,
+          );
+        }
+      }
+    } catch (error) {
+      if (window.location.host.startsWith("localhost")) {
+        console.log("Ignoring the error getting VAPID for local development.");
+      } else {
+        console.error("Got an error initializing notifications:", error);
+        this.$notify(
+          {
+            group: "alert",
+            type: "danger",
+            title: "Error Setting Notifications",
+            text: "Got an error setting notifications.",
+          },
+          -1,
+        );
+      }
+    }
+    // there may be a long pause here on first initialization
+    navigator.serviceWorker?.ready.then(() => {
+      this.serviceWorkerReady = true;
+    });
   }
 
-  async turnOffNotifications(notification: NotificationIface) {
-    let subscription: object | null = null;
+  private sendMessageToServiceWorker(
+    message: ServiceWorkerMessage,
+  ): Promise<unknown> {
+    return new Promise((resolve, reject) => {
+      if (navigator.serviceWorker.controller) {
+        const messageChannel = new MessageChannel();
 
-    let allGoingOff = false;
-    const settings = await retrieveSettingsForActiveAccount();
-    const notifyingNewActivity = !!settings?.notifyingNewActivityTime;
-    const notifyingReminder = !!settings?.notifyingReminderTime;
-    if (!notifyingNewActivity || !notifyingReminder) {
-      // the other notification is already off, so fully unsubscribe now
-      allGoingOff = true;
+        messageChannel.port1.onmessage = (event: MessageEvent) => {
+          if (event.data.error) {
+            reject(event.data.error as ErrorResponse);
+          } else {
+            resolve(event.data as ServiceWorkerResponse);
+          }
+        };
+
+        navigator.serviceWorker.controller.postMessage(message, [
+          messageChannel.port2,
+        ]);
+      } else {
+        reject("Service worker controller not available");
+      }
+    });
+  }
+
+  private askPermission(): Promise<NotificationPermission> {
+    console.log("Requesting permission for notifications:", navigator);
+    if (!("serviceWorker" in navigator && navigator.serviceWorker.controller)) {
+      return Promise.reject("Service worker not available.");
     }
 
-    await navigator.serviceWorker?.ready
-      .then((registration) => {
-        return registration.pushManager.getSubscription();
-      })
-      .then(async (subscript: PushSubscription | null) => {
-        if (subscript) {
-          subscription = subscript.toJSON();
-          if (allGoingOff) {
-            await subscript.unsubscribe();
-          }
-        } else {
-          logConsoleAndDb("Subscription object is not available.");
-        }
-      })
-      .catch((error) => {
-        logConsoleAndDb(
-          "Push provider server communication failed: " + JSON.stringify(error),
-          true,
-        );
-      });
+    const secret = localStorage.getItem("secret");
+    if (!secret) {
+      return Promise.reject("No secret found.");
+    }
 
-    if (!subscription) {
-      // there is no endpoint or auth for the server to compare, so we're done
+    return this.sendSecretToServiceWorker(secret)
+      .then(() => this.checkNotificationSupport())
+      .then(() => this.requestNotificationPermission())
+      .catch((error) => Promise.reject(error));
+  }
+
+  private sendSecretToServiceWorker(secret: string): Promise<void> {
+    const message: ServiceWorkerMessage = {
+      type: "SEND_LOCAL_DATA",
+      data: secret,
+    };
+
+    return this.sendMessageToServiceWorker(message).then((response) => {
+      console.log("Response from service worker:", response);
+    });
+  }
+
+  private checkNotificationSupport(): Promise<void> {
+    if (!("Notification" in window)) {
+      alert("This browser does not support notifications.");
+      return Promise.reject("This browser does not support notifications.");
+    }
+    if (Notification.permission === "granted") {
+      return Promise.resolve();
+    }
+    return Promise.resolve();
+  }
+
+  private requestNotificationPermission(): Promise<NotificationPermission> {
+    return Notification.requestPermission().then((permission) => {
+      if (permission !== "granted") {
+        alert(
+          "Allow this app permission to make notifications for personal reminders." +
+            " You can adjust them at any time in your settings.",
+        );
+        throw new Error("We weren't granted permission.");
+      }
+      return permission;
+    });
+  }
+
+  // this allows us to show an error without closing the dialog
+  checkHour() {
+    if (!libsUtil.isNumeric(this.hourInput)) {
       this.$notify(
         {
           group: "alert",
-          type: "info",
-          title: "Finished",
-          text: "Notifications are off.", // a different message so I know there are none stored
+          type: "danger",
+          title: "Not a Number",
+          text: "The time must be an hour number.",
         },
         5000,
       );
-      return true;
+      return false;
     }
+    const hourNum = libsUtil.numberOrZero(this.hourInput);
+    if (!Number.isInteger(hourNum)) {
+      this.$notify(
+        {
+          group: "alert",
+          type: "danger",
+          title: "Not a Whole Number",
+          text: "The time must be a whole hour number.",
+        },
+        5000,
+      );
+      return false;
+    }
+    if (hourNum < 1 || 12 < hourNum) {
+      this.$notify(
+        {
+          group: "alert",
+          type: "danger",
+          title: "Not a Whole Number",
+          text: "The time must be an hour between 1 and 12.",
+        },
+        5000,
+      );
+      return false;
+    }
+    return true;
+  }
 
-    // clone in order to get only the properties and allow stringify to work
-    const serverSubscription = {
-      ...subscription,
-    };
-    if (!allGoingOff) {
-      serverSubscription["notifyType"] = notification.title;
+  public async turnOnNotifications() {
+    return this.askPermission()
+      .then((permission) => {
+        console.log("Permission granted:", permission);
+
+        // Call the function and handle promises
+        this.subscribeToPush()
+          .then(() => {
+            console.log("Subscribed successfully.");
+            return navigator.serviceWorker?.ready;
+          })
+          .then((registration) => {
+            return registration.pushManager.getSubscription();
+          })
+          .then(async (subscription) => {
+            if (subscription) {
+              await this.$notify(
+                {
+                  group: "alert",
+                  type: "info",
+                  title: "Notification Setup Underway",
+                  text: "Setting up notifications for interesting activity, which takes about 10 seconds. If you don't see a final confirmation, check the 'Troubleshoot' page.",
+                },
+                -1,
+              );
+              // we already checked that this is a valid hour number
+              const rawHourNum = libsUtil.numberOrZero(this.hourInput);
+              const adjHourNum = rawHourNum + (this.hourAm ? 0 : 12);
+              const hourNum = adjHourNum % 24;
+              const utcHour =
+                hourNum + Math.round(new Date().getTimezoneOffset() / 60);
+              const finalUtcHour = (utcHour + (utcHour < 0 ? 24 : 0)) % 24;
+
+              const subscriptionWithTime: PushSubscriptionWithTime = {
+                notifyTime: { utcHour: finalUtcHour },
+                ...subscription.toJSON(),
+              };
+              await this.sendSubscriptionToServer(subscriptionWithTime);
+              return subscriptionWithTime;
+            } else {
+              throw new Error("Subscription object is not available.");
+            }
+          })
+          .then(async (subscription: PushSubscriptionWithTime) => {
+            console.log(
+              "Subscription data sent to server and all finished successfully.",
+            );
+            await sendTestThroughPushServer(subscription, true);
+            this.$notify(
+              {
+                group: "alert",
+                type: "success",
+                title: "Notifications Turned On",
+                text: "Notifications are on. You should see at least one on your device; if not, check the 'Troubleshoot' page.",
+              },
+              -1,
+            );
+          })
+          .catch((error) => {
+            console.error(
+              "Subscription or server communication failed:",
+              error,
+            );
+            alert(
+              "Subscription or server communication failed. Try again in a while.",
+            );
+          });
+      })
+      .catch((error) => {
+        console.error(
+          "An error occurred setting notification permissions:",
+          error,
+        );
+        alert("Some error occurred setting notification permissions.");
+      });
+  }
+
+  private urlBase64ToUint8Array(base64String: string): Uint8Array {
+    const padding = "=".repeat((4 - (base64String.length % 4)) % 4);
+    const base64 = (base64String + padding)
+      .replace(/-/g, "+")
+      .replace(/_/g, "/");
+    const rawData = window.atob(base64);
+    const outputArray = new Uint8Array(rawData.length);
+
+    for (let i = 0; i < rawData.length; ++i) {
+      outputArray[i] = rawData.charCodeAt(i);
     }
+    return outputArray;
+  }
+
+  private subscribeToPush(): Promise<void> {
+    return new Promise<void>((resolve, reject) => {
+      if (!("serviceWorker" in navigator && "PushManager" in window)) {
+        const errorMsg = "Push messaging is not supported";
+        console.warn(errorMsg);
+        return reject(new Error(errorMsg));
+      }
+
+      if (Notification.permission !== "granted") {
+        const errorMsg = "Notification permission not granted";
+        console.warn(errorMsg);
+        return reject(new Error(errorMsg));
+      }
+
+      const applicationServerKey = this.urlBase64ToUint8Array(this.b64);
+      const options: PushSubscriptionOptions = {
+        userVisibleOnly: true,
+        applicationServerKey: applicationServerKey,
+      };
+
+      navigator.serviceWorker.ready
+        .then((registration) => {
+          return registration.pushManager.subscribe(options);
+        })
+        .then((subscription) => {
+          console.log("Push subscription successful:", subscription);
+          resolve();
+        })
+        .catch((error) => {
+          console.error("Push subscription failed:", error, options);
+
+          // Inform the user about the issue
+          alert(
+            "We encountered an issue setting up push notifications. " +
+              "If you wish to revoke notification permissions, please do so in your browser settings.",
+          );
+
+          reject(error);
+        });
+    });
+  }
+
+  private sendSubscriptionToServer(
+    subscription: PushSubscriptionWithTime,
+  ): Promise<void> {
+    console.log("About to send subscription...", subscription);
+    return fetch("/web-push/subscribe", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify(subscription),
+    }).then((response) => {
+      if (!response.ok) {
+        throw new Error("Failed to send subscription to server");
+      }
+      console.log("Subscription sent to server successfully.");
+    });
+  }
+
+  async turnOffNotifications() {
+    let subscription;
+    const pushProviderSuccess = await navigator.serviceWorker?.ready
+      .then((registration) => {
+        return registration.pushManager.getSubscription();
+      })
+      .then((subscript) => {
+        subscription = subscript;
+        if (subscription) {
+          return subscription.unsubscribe();
+        } else {
+          console.log("Subscription object is not available.");
+          return false;
+        }
+      })
+      .catch((error) => {
+        console.error("Push provider server communication failed:", error);
+        return false;
+      });
+
     const pushServerSuccess = await fetch("/web-push/unsubscribe", {
       method: "POST",
       headers: {
         "Content-Type": "application/json",
       },
-      body: JSON.stringify(serverSubscription),
+      body: JSON.stringify(subscription),
     })
       .then((response) => {
         return response.ok;
       })
       .catch((error) => {
-        logConsoleAndDb(
-          "Push server communication failed: " + JSON.stringify(error),
-          true,
-        );
+        console.error("Push server communication failed:", error);
         return false;
       });
 
-    let message;
-    if (pushServerSuccess) {
-      message = "Notification is off.";
-    } else {
-      message = "Notification is still on. Try to turn it off again.";
-    }
-    this.$notify(
-      {
-        group: "alert",
-        type: "info",
-        title: "Finished",
-        text: message,
-      },
-      5000,
+    alert(
+      "Notifications are off. Push provider unsubscribe " +
+        (pushProviderSuccess ? "succeeded" : "failed") +
+        (pushProviderSuccess === pushServerSuccess ? " and" : " but") +
+        " push server unsubscribe " +
+        (pushServerSuccess ? "succeeded" : "failed") +
+        ".",
     );
-
-    if (notification.callback) {
-      // it's OK if the local notifications are still on (especially if the other notification is on)
-      notification.callback(pushServerSuccess);
-    }
   }
 }
 </script>

src/components/ChoiceButtonDialog.vue

@@ -1,152 +0,0 @@
-<template>
-  <NotificationGroup group="customModal">
-    <div class="fixed z-[100] top-0 inset-x-0 w-full">
-      <Notification
-        v-slot="{ notifications, close }"
-        enter="transform ease-out duration-300 transition"
-        enter-from="translate-y-2 opacity-0 sm:translate-y-4"
-        enter-to="translate-y-0 opacity-100 sm:translate-y-0"
-        leave="transition ease-in duration-500"
-        leave-from="opacity-100"
-        leave-to="opacity-0"
-        move="transition duration-500"
-        move-delay="delay-300"
-      >
-        <div
-          v-for="notification in notifications"
-          :key="notification.id"
-          class="w-full"
-          role="alert"
-        >
-          <div
-            class="absolute inset-0 h-screen flex flex-col items-center justify-center bg-slate-900/50"
-          >
-            <div
-              class="flex w-11/12 max-w-sm mx-auto mb-3 overflow-hidden bg-white rounded-lg shadow-lg"
-            >
-              <div class="w-full px-6 py-6 text-slate-900 text-center">
-                <span class="font-semibold text-lg">{{ title }}</span>
-                <p class="text-sm mb-2">{{ text }}</p>
-
-                <button
-                  @click="handleOption1(close)"
-                  class="block w-full text-center text-md font-bold capitalize bg-blue-800 text-white px-2 py-2 rounded-md mb-2"
-                >
-                  {{ option1Text }}
-                </button>
-
-                <button
-                  @click="handleOption2(close)"
-                  class="block w-full text-center text-md font-bold capitalize bg-blue-700 text-white px-2 py-2 rounded-md mb-2"
-                >
-                  {{ option2Text }}
-                </button>
-
-                <button
-                  @click="handleOption3(close)"
-                  class="block w-full text-center text-md font-bold capitalize bg-blue-600 text-white px-2 py-2 rounded-md mb-2"
-                >
-                  {{ option3Text }}
-                </button>
-
-                <button
-                  @click="handleCancel(close)"
-                  class="block w-full text-center text-md font-bold capitalize bg-slate-600 text-white px-2 py-2 rounded-md"
-                >
-                  Cancel
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
-      </Notification>
-    </div>
-  </NotificationGroup>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-import { NotificationIface } from "@/constants/app";
-
-@Component
-export default class PromptDialog extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  title = "";
-  text = "";
-  option1Text = "";
-  option2Text = "";
-  option3Text = "";
-  onOption1?: () => void;
-  onOption2?: () => void;
-  onOption3?: () => void;
-  onCancel?: () => Promise<void>;
-
-  open(options: {
-    title: string;
-    text: string;
-    option1Text?: string;
-    option2Text?: string;
-    option3Text?: string;
-    onOption1?: () => void;
-    onOption2?: () => void;
-    onOption3?: () => void;
-    onCancel?: () => Promise<void>;
-  }) {
-    this.title = options.title;
-    this.text = options.text;
-    this.option1Text = options.option1Text || "";
-    this.option2Text = options.option2Text || "";
-    this.option3Text = options.option3Text || "";
-    this.onOption1 = options.onOption1;
-    this.onOption2 = options.onOption2;
-    this.onOption3 = options.onOption3;
-    this.onCancel = options.onCancel;
-
-    this.$notify(
-      {
-        group: "customModal",
-        type: "confirm",
-        title: this.title,
-        text: this.text,
-        option1Text: this.option1Text,
-        option2Text: this.option2Text,
-        option3Text: this.option3Text,
-        onOption1: this.onOption1,
-        onOption2: this.onOption2,
-        onOption3: this.onOption3,
-        onCancel: this.onCancel,
-      } as NotificationIface,
-      -1,
-    );
-  }
-
-  handleOption1(close: (id: string) => void) {
-    if (this.onOption1) {
-      this.onOption1();
-    }
-    close("string that does not matter");
-  }
-
-  handleOption2(close: (id: string) => void) {
-    if (this.onOption2) {
-      this.onOption2();
-    }
-    close("string that does not matter");
-  }
-
-  handleOption3(close: (id: string) => void) {
-    if (this.onOption3) {
-      this.onOption3();
-    }
-    close("string that does not matter");
-  }
-
-  handleCancel(close: (id: string) => void) {
-    if (this.onCancel) {
-      this.onCancel();
-    }
-    close("string that does not matter");
-  }
-}
-</script>

src/components/ContactNameDialog.vue

@@ -1,102 +0,0 @@
-<!-- similar to UserNameDialog -->
-<template>
-  <div v-if="visible" class="dialog-overlay">
-    <div class="dialog">
-      <h1 class="text-xl font-bold text-center mb-4">{{ title }}</h1>
-      {{ message }}
-      Note that their name is only stored on this device.
-      <input
-        type="text"
-        placeholder="Name"
-        class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
-        v-model="newText"
-      />
-
-      <div class="mt-8">
-        <div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
-          <button
-            type="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 mb-2"
-            @click="onClickSaveChanges()"
-          >
-            Save
-          </button>
-          <button
-            type="button"
-            class="block w-full text-center text-md uppercase bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md mb-2"
-            @click="onClickCancel()"
-          >
-            Cancel
-          </button>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts">
-import { Vue, Component } from "vue-facing-decorator";
-
-@Component
-export default class ContactNameDialog extends Vue {
-  cancelCallback: () => void = () => {};
-  saveCallback: (name?: string) => void = () => {};
-  message = "";
-  newText = "";
-  title = "Contact Name";
-  visible = false;
-
-  async open(
-    title?: string,
-    message?: string,
-    saveCallback?: (name?: string) => void,
-    cancelCallback?: () => void,
-    defaultName?: string,
-  ) {
-    this.cancelCallback = cancelCallback || this.cancelCallback;
-    this.saveCallback = saveCallback || this.saveCallback;
-    this.message = message ?? this.message;
-    this.newText = defaultName ?? "";
-    this.title = title ?? this.title;
-    this.visible = true;
-  }
-
-  async onClickSaveChanges() {
-    this.visible = false;
-    if (this.saveCallback) {
-      this.saveCallback(this.newText);
-    }
-  }
-
-  onClickCancel() {
-    this.visible = false;
-    if (this.cancelCallback) {
-      this.cancelCallback();
-    }
-  }
-}
-</script>
-
-<style>
-.dialog-overlay {
-  z-index: 50;
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background-color: rgba(0, 0, 0, 0.5);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  padding: 1.5rem;
-}
-
-.dialog {
-  background-color: white;
-  padding: 1rem;
-  border-radius: 0.5rem;
-  width: 100%;
-  max-width: 500px;
-}
-</style>

src/components/FeedFilters.vue

@@ -100,7 +100,7 @@ import {
 } from "@vue-leaflet/vue-leaflet";
 
 import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
+import { db } from "@/db/index";
 
 @Component({
   components: {
@@ -121,10 +121,11 @@ export default class FeedFilters extends Vue {
   async open(onCloseIfChanged: () => void) {
     this.onCloseIfChanged = onCloseIfChanged;
 
-    const settings = await retrieveSettingsForActiveAccount();
-    this.hasVisibleDid = !!settings.filterFeedByVisible;
-    this.isNearby = !!settings.filterFeedByNearby;
-    if (settings.searchBoxes && settings.searchBoxes.length > 0) {
+    await db.open();
+    const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+    this.hasVisibleDid = !!settings?.filterFeedByVisible;
+    this.isNearby = !!settings?.filterFeedByNearby;
+    if (settings?.searchBoxes && settings.searchBoxes.length > 0) {
       this.hasSearchBox = true;
     }
 
@@ -191,7 +192,6 @@ export default class FeedFilters extends Vue {
 
 <style>
 .dialog-overlay {
-  z-index: 50;
   position: fixed;
   top: 0;
   left: 0;
@@ -205,7 +205,7 @@ export default class FeedFilters extends Vue {
 }
 
 #dialogFeedFilters.dialog-overlay {
-  z-index: 100;
+  z-index: 99999;
   overflow: scroll;
 }
 

src/components/GiftedDialog.vue

@@ -7,7 +7,7 @@
       <input
         type="text"
         class="block w-full rounded border border-slate-400 mb-2 px-3 py-2"
-        :placeholder="prompt || 'What was given?'"
+        placeholder="What was given"
         v-model="description"
       />
       <div class="flex flex-row justify-center">
@@ -47,8 +47,7 @@
                 giverDid: giver?.did,
                 giverName: giver?.name,
                 offerId,
-                fulfillsProjectId: toProjectId,
-                providerProjectId: fromProjectId,
+                projectId,
                 recipientDid: receiver?.did,
                 recipientName: receiver?.name,
                 unitCode,
@@ -93,19 +92,18 @@ import { NotificationIface } from "@/constants/app";
 import {
   createAndSubmitGive,
   didInfo,
-  serverMessageForUser,
+  GiverReceiverInputInfo,
 } from "@/libs/endorserServer";
 import * as libsUtil from "@/libs/util";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
+import { accountsDB, db } from "@/db/index";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
 import { Contact } from "@/db/tables/contacts";
-import { retrieveAccountDids } from "@/libs/util";
 
 @Component
 export default class GiftedDialog extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
-  @Prop fromProjectId = "";
-  @Prop toProjectId = "";
+  @Prop projectId = "";
 
   activeDid = "";
   allContacts: Array<Contact> = [];
@@ -116,27 +114,25 @@ export default class GiftedDialog extends Vue {
   callbackOnSuccess?: (amount: number) => void = () => {};
   customTitle?: string;
   description = "";
-  giver?: libsUtil.GiverReceiverInputInfo; // undefined means no identified giver agent
+  giver?: GiverReceiverInputInfo; // undefined means no identified giver agent
   isTrade = false;
   offerId = "";
-  prompt = "";
-  receiver?: libsUtil.GiverReceiverInputInfo;
+  receiver?: GiverReceiverInputInfo;
   unitCode = "HUR";
   visible = false;
 
   libsUtil = libsUtil;
 
   async open(
-    giver?: libsUtil.GiverReceiverInputInfo,
-    receiver?: libsUtil.GiverReceiverInputInfo,
+    giver?: GiverReceiverInputInfo,
+    receiver?: GiverReceiverInputInfo,
     offerId?: string,
     customTitle?: string,
-    prompt?: string,
     callbackOnSuccess?: (amount: number) => void,
   ) {
     this.customTitle = customTitle;
+    this.description = "";
     this.giver = giver;
-    this.prompt = prompt || "";
     this.receiver = receiver;
     // if we show "given to user" selection, default checkbox to true
     this.amountInput = "0";
@@ -144,13 +140,16 @@ export default class GiftedDialog extends Vue {
     this.offerId = offerId || "";
 
     try {
-      const settings = await retrieveSettingsForActiveAccount();
-      this.apiServer = settings.apiServer || "";
-      this.activeDid = settings.activeDid || "";
+      await db.open();
+      const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+      this.apiServer = settings?.apiServer || "";
+      this.activeDid = settings?.activeDid || "";
 
       this.allContacts = await db.contacts.toArray();
 
-      this.allMyDids = await retrieveAccountDids();
+      await accountsDB.open();
+      const allAccounts = await accountsDB.accounts.toArray();
+      this.allMyDids = allAccounts.map((acc) => acc.did);
 
       if (this.giver && !this.giver.name) {
         this.giver.name = didInfo(
@@ -208,7 +207,6 @@ export default class GiftedDialog extends Vue {
     this.description = "";
     this.giver = undefined;
     this.amountInput = "0";
-    this.prompt = "";
     this.unitCode = "HUR";
   }
 
@@ -299,11 +297,9 @@ export default class GiftedDialog extends Vue {
         description,
         amount,
         unitCode,
-        this.toProjectId,
+        this.projectId,
         this.offerId,
         this.isTrade,
-        undefined,
-        this.fromProjectId,
       );
 
       if (
@@ -340,7 +336,7 @@ export default class GiftedDialog extends Vue {
       console.error("Error with give recordation caught:", error);
       const errorMessage =
         error.userMessage ||
-        serverMessageForUser(error) ||
+        error.response?.data?.error?.message ||
         "There was an error recording the give.";
       this.$notify(
         {
@@ -394,7 +390,6 @@ export default class GiftedDialog extends Vue {
 
 <style>
 .dialog-overlay {
-  z-index: 50;
   position: fixed;
   top: 0;
   left: 0;

src/components/GiftedPrompts.vue

@@ -1,7 +1,7 @@
 <template>
   <div v-if="visible" class="dialog-overlay">
     <div class="dialog">
-      <h1 class="text-xl font-bold text-center relative">
+      <h1 class="text-xl font-bold text-center mb-4 relative">
         Here's one:
         <div
           class="text-lg text-center p-2 leading-none absolute right-0 -top-1"
@@ -10,9 +10,8 @@
           <fa icon="xmark" class="w-[1em]"></fa>
         </div>
       </h1>
-      <span class="mt-2 flex justify-between">
+      <span class="flex justify-between">
         <span
-          v-if="currentCategory === CATEGORY_IDEAS"
           class="rounded-l border border-slate-400 bg-slate-200 px-4 py-2 flex"
           @click="prevIdea()"
         >
@@ -20,21 +19,21 @@
         </span>
 
         <div class="m-2">
-          <span v-if="currentCategory === CATEGORY_IDEAS">
-            <p class="text-center text-lg">
+          <span v-if="currentIdeaIndex < IDEAS.length">
+            <p class="text-center text-lg font-bold">
               {{ IDEAS[currentIdeaIndex] }}
             </p>
           </span>
-          <div v-if="currentCategory === CATEGORY_CONTACTS">
+          <div v-if="currentIdeaIndex == IDEAS.length + 0">
             <p class="text-center">
               <span
                 v-if="currentContact == null"
-                class="text-orange-500 text-lg"
+                class="text-orange-500 text-lg font-bold"
               >
                 That's all your contacts.
               </span>
               <span v-else>
-                <span class="text-lg">
+                <span class="text-lg font-bold">
                   Did {{ currentContact.name || AppString.NO_CONTACT_NAME }}
                   <br />
                   or someone near them do anything &ndash; maybe a while ago?
@@ -62,7 +61,7 @@
       </span>
       <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 mt-4"
-        @click="proceed"
+        @click="cancel"
       >
         That's it!
       </button>
@@ -72,175 +71,155 @@
 
 <script lang="ts">
 import { Vue, Component } from "vue-facing-decorator";
-import { Router } from "vue-router";
 
 import { AppString, NotificationIface } from "@/constants/app";
 import { db } from "@/db/index";
 import { Contact } from "@/db/tables/contacts";
-import { GiverReceiverInputInfo } from "@/libs/util";
 
 @Component
 export default class GivenPrompts extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
-  CATEGORY_CONTACTS = 1;
-  CATEGORY_IDEAS = 0;
   IDEAS = [
-    "What food did someone make? (How did it free up your time for something? Was something doable because it eased your stress?)",
-    "What did a family member do? (How did you take better action because it made you feel loved?)",
-    "What compliment did someone give you? (What task could you tackle because it boosted your confidence?)",
-    "Who is someone you can always rely on, and how did they demonstrate that? (What project tasks were enabled because you could depend on them?)",
-    "What did you see someone give to someone else? (What is the effect of the positivity you gained from seeing that?)",
-    "What is a way that someone helped you even though you have never met? (What different action did you take due to that newfound perspective or inspiration?)",
-    "How did a musician or author or artist inspire you? (What were you motivated to do more creatively because of that?)",
-    "What inspiration did you get from someone who handled tragedy well? (What could you accomplish with better grace or resilience after seeing their example?)",
-    "What is something worth respect that an organization gave you? (How did their contribution improve the situation or enable new activities?)",
-    "Who last gave you a good laugh? (What kind of bond or revitalization did that bring to a situation?)",
-    "What do you recall someone giving you while you were young? (How did it bring excitement or teach a skill or ignite a passion that resulted in improvements in your life?)",
-    "Who forgave you or overlooked a mistake? (How did that free you or build trust that enabled better relationships?)",
-    "What is a way an ancestor contributed to your life? (What in your life is now possible because of their efforts? What challenges are you undertaking knowing of their lives?)",
-    "What kind of help did someone at work give you? (How did that help with team progress? How did that lift your professional growth?)",
-    "How did a teacher or mentor or great example help you? (How did their guidance enhance your attitude or actions?)",
-    "What is a surprise gift you received? (What extra possibilities did it give you?)",
+    "Did anyone fix food for you?",
+    "Did a family member do something for you?",
+    "Did anyone give you a compliment?",
+    "Who is someone you can always rely on, and how did they demonstrate that?",
+    "Did you see anyone give to someone else?",
+    "Is there someone who you have never met who has helped you somehow?",
+    "How did an artist or musician or author inspire you?",
+    "What inspiration did you get from someone who handled tragedy well?",
+    "Did some organization give something worth respect?",
+    "Who last gave you a good laugh?",
+    "Do you recall anything that was given to you while you were young?",
+    "Did someone forgive you or overlook a mistake?",
+    "Do you know of a way an ancestor contributed to your life?",
+    "Did anyone give you help at work?",
+    "How did a teacher or mentor or great example help you?",
   ];
+  OTHER_PROMPTS = 1;
+  CONTACT_PROMPT_INDEX = this.IDEAS.length; // expected after other prompts
 
-  callbackOnFullGiftInfo?: (
-    contactInfo?: GiverReceiverInputInfo,
-    description?: string,
-  ) => void;
-  currentCategory = this.CATEGORY_IDEAS; // 0 = IDEAS, 1 = CONTACTS
   currentContact: Contact | undefined = undefined;
   currentIdeaIndex = 0;
   numContacts = 0;
-  shownContactDbIndices: Array<boolean> = [];
+  shownContactDbIndices: number[] = [];
   visible = false;
 
   AppString = AppString;
 
-  async open(
-    callbackOnFullGiftInfo?: (
-      contactInfo?: GiverReceiverInputInfo,
-      description?: string,
-    ) => void,
-  ) {
+  async open() {
     this.visible = true;
-    this.callbackOnFullGiftInfo = callbackOnFullGiftInfo;
 
     await db.open();
     this.numContacts = await db.contacts.count();
-    this.shownContactDbIndices = new Array<boolean>(this.numContacts); // all undefined to start
   }
 
-  cancel() {
-    this.currentCategory = this.CATEGORY_IDEAS;
-    this.currentContact = undefined;
-    this.currentIdeaIndex = 0;
-    this.numContacts = 0;
-    this.shownContactDbIndices = [];
-
+  close() {
+    // close the dialog but don't change values (just in case some actions are added later)
     this.visible = false;
   }
 
-  proceed() {
-    // proceed with logic but don't change values (just in case some actions are added later)
-    this.visible = false;
-    if (this.currentCategory === this.CATEGORY_IDEAS) {
-      (this.$router as Router).push({
-        name: "contact-gift",
-        query: {
-          prompt: this.IDEAS[this.currentIdeaIndex],
-        },
-      });
-    } else {
-      // must be this.CATEGORY_CONTACTS
-      this.callbackOnFullGiftInfo?.(
-        this.currentContact as GiverReceiverInputInfo,
-      );
-    }
-  }
-
   /**
    * Get the next idea.
    * If it is a contact prompt, loop through.
    */
   async nextIdea() {
-    // check if the next one is an idea or a contact
-    if (this.currentCategory === this.CATEGORY_IDEAS) {
-      this.currentIdeaIndex++;
-      if (this.currentIdeaIndex === this.IDEAS.length) {
-        // must have just finished ideas so move to contacts
-        this.findNextUnshownContact();
-      }
-    } else {
-      // must be this.CATEGORY_CONTACTS
+    // if we're incrementing to the contact prompt
+    // or if we're at the contact prompt and there was a previous contact...
+    if (
+      this.currentIdeaIndex == this.CONTACT_PROMPT_INDEX - 1 ||
+      (this.currentIdeaIndex == this.CONTACT_PROMPT_INDEX &&
+        this.shownContactDbIndices.length < this.numContacts)
+    ) {
+      this.currentIdeaIndex = this.CONTACT_PROMPT_INDEX;
       this.findNextUnshownContact();
-      // when that's finished, it'll reset to ideas
+    } else {
+      // we're not at the contact prompt (or we ran out), so increment the idea index
+      this.currentIdeaIndex =
+        (this.currentIdeaIndex + 1) % (this.IDEAS.length + this.OTHER_PROMPTS);
+      // ... and clear out any other prompt info
+      this.currentContact = undefined;
+      this.shownContactDbIndices = [];
     }
   }
 
-  /**
-   * Get the previous idea.
-   * If it is a contact prompt, loop through.
-   */
-  async prevIdea() {
-    // check if the next one is an idea or a contact
-    if (this.currentCategory === this.CATEGORY_IDEAS) {
+  prevIdea() {
+    if (
+      this.currentIdeaIndex ==
+        (this.CONTACT_PROMPT_INDEX + 1) %
+          (this.IDEAS.length + this.OTHER_PROMPTS) ||
+      (this.currentIdeaIndex == this.CONTACT_PROMPT_INDEX &&
+        this.shownContactDbIndices.length < this.numContacts)
+    ) {
+      this.currentIdeaIndex = this.CONTACT_PROMPT_INDEX;
+      this.findNextUnshownContact();
+    } else {
+      // we're not at the contact prompt (or we ran out), so increment the idea index
       this.currentIdeaIndex--;
       if (this.currentIdeaIndex < 0) {
-        // must have just finished ideas so move to contacts
-        this.findNextUnshownContact();
+        this.currentIdeaIndex = this.IDEAS.length - 1 + this.OTHER_PROMPTS;
       }
-    } else {
-      // must be this.CATEGORY_CONTACTS
-      this.findNextUnshownContact();
-      // when that's finished, it'll reset to ideas
+      // ... and clear out any other prompt info
+      this.currentContact = undefined;
+      this.shownContactDbIndices = [];
     }
   }
 
   nextIdeaPastContacts() {
+    this.currentIdeaIndex = 0;
     this.currentContact = undefined;
-    this.shownContactDbIndices = new Array<boolean>(this.numContacts);
-
-    this.currentCategory = this.CATEGORY_IDEAS;
-    // look at the previous idea and switch to the other side of the list
-    this.currentIdeaIndex =
-      this.currentIdeaIndex >= this.IDEAS.length ? 0 : this.IDEAS.length - 1;
+    this.shownContactDbIndices = [];
   }
 
   async findNextUnshownContact() {
-    if (this.currentCategory === this.CATEGORY_IDEAS) {
-      // we're not in the contact prompts, so reset index array
-      this.shownContactDbIndices = new Array<boolean>(this.numContacts);
-    }
-    this.currentCategory = this.CATEGORY_CONTACTS;
-
-    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 &&
-      count++ < this.numContacts
-    ) {
-      someContactDbIndex = (someContactDbIndex + 1) % this.numContacts;
-    }
-    if (count >= this.numContacts) {
-      // all contacts have been shown
-      this.nextIdeaPastContacts();
+    // get a random contact
+    if (this.shownContactDbIndices.length === this.numContacts) {
+      // no more contacts to show
+      this.currentContact = undefined;
     } else {
+      // get a random contact that hasn't been shown yet
+      let someContactDbIndex = Math.floor(Math.random() * this.numContacts);
+      // and guarantee that one is found by walking past shown contacts
+      let shownContactIndex =
+        this.shownContactDbIndices.indexOf(someContactDbIndex);
+      while (shownContactIndex !== -1) {
+        // increment both indices until we find a spot where "shown" skips a spot
+        shownContactIndex = (shownContactIndex + 1) % this.numContacts;
+        someContactDbIndex = (someContactDbIndex + 1) % this.numContacts;
+        if (
+          this.shownContactDbIndices[shownContactIndex] !== someContactDbIndex
+        ) {
+          // we found a contact that hasn't been shown yet
+          break;
+        }
+        // continue
+        // ... and there must be at least one because shownContactDbIndices length < numContacts
+      }
+      this.shownContactDbIndices.push(someContactDbIndex);
+      this.shownContactDbIndices.sort();
+
       // get the contact at that offset
       await db.open();
       this.currentContact = await db.contacts
         .offset(someContactDbIndex)
         .first();
-      this.shownContactDbIndices[someContactDbIndex] = true;
     }
   }
+
+  cancel() {
+    this.currentContact = undefined;
+    this.currentIdeaIndex = 0;
+    this.numContacts = 0;
+    this.shownContactDbIndices = [];
+
+    this.close();
+  }
 }
 </script>
 
 <style>
 .dialog-overlay {
-  z-index: 50;
   position: fixed;
   top: 0;
   left: 0;

src/components/HiddenDidDialog.vue

@@ -1,182 +0,0 @@
-<template>
-  <div
-    v-if="isOpen"
-    class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50"
-  >
-    <div class="bg-white rounded-lg p-6 max-w-2xl w-full mx-4">
-      <!-- Header -->
-      <div class="flex justify-between items-center mb-4">
-        <h2 class="text-xl font-bold capitalize">{{ roleName }} Details</h2>
-        <button @click="close" class="text-gray-500 hover:text-gray-700">
-          <fa icon="times" />
-        </button>
-      </div>
-
-      <!-- Content -->
-      <!-- This is somewhat similar to ClaimView.vue and ConfirmGiftView.vue -->
-      <div class="mb-4">
-        <p class="mb-4">
-          <span v-if="R.isEmpty(visibleToDids)">
-            The {{ roleName }} is not visible to you or any of your contacts.
-          </span>
-          <span v-else> The {{ roleName }} is not visible to you. </span>
-        </p>
-
-        <div v-if="R.isEmpty(visibleToDids)">
-          <p class="mt-2">
-            You can ask one of your contacts to take a look and see if their
-            contacts can see more details. Someone is connected to people closer
-            to them; if you don't know who to ask, try the person who registered
-            you.
-          </p>
-        </div>
-
-        <div v-else>
-          <p class="mb-2">
-            They are visible to some of your contacts. If you'd like an
-            introduction, ask them if they'll tell you more.
-          </p>
-
-          <div class="ml-4">
-            <ul>
-              <li
-                v-for="(visDid, idx) of visibleToDids"
-                :key="idx"
-                class="list-disc ml-4 mb-2"
-              >
-                <div class="text-sm">
-                  <span>
-                    {{ didInfo(visDid) }}
-                    <span v-if="!serverUtil.isEmptyOrHiddenDid(visDid)">
-                      <a
-                        :href="`/did/${visDid}`"
-                        target="_blank"
-                        class="text-blue-500"
-                      >
-                        <fa icon="arrow-up-right-from-square" class="fa-fw" />
-                      </a>
-                    </span>
-                  </span>
-                </div>
-              </li>
-            </ul>
-          </div>
-        </div>
-
-        <div class="mt-4">
-          <span v-if="canShare">
-            If you'd like an introduction,
-            <a @click="onClickShareClaim()" class="text-blue-500"
-              >click here to share the information with them and ask if they'll
-              tell you more about the {{ roleName }}.</a
-            >
-          </span>
-          <span v-else>
-            If you'd like an introduction,
-            <a
-              @click="copyToClipboard('A link to this page', windowLocation)"
-              class="text-blue-500"
-              >click here to copy this page, paste it into a message, and ask if
-              they'll tell you more about the {{ roleName }}.</a
-            >
-          </span>
-        </div>
-      </div>
-
-      <!-- Footer -->
-      <div class="flex justify-end">
-        <button
-          @click="close"
-          class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600"
-        >
-          Close
-        </button>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-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";
-
-@Component
-export default class HiddenDidDialog extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  isOpen = false;
-  roleName = "";
-  visibleToDids: string[] = [];
-  allContacts: Array<Contact> = [];
-  activeDid = "";
-  allMyDids: Array<string> = [];
-  canShare = false;
-  windowLocation = window.location.href;
-
-  R = R;
-  serverUtil = serverUtil;
-
-  created() {
-    // When Chrome compatibility is fixed https://developer.mozilla.org/en-US/docs/Web/API/Web_Share_API#api.navigator.canshare
-    // then use this truer check: navigator.canShare && navigator.canShare()
-    this.canShare = !!navigator.share;
-  }
-
-  open(
-    roleName: string,
-    visibleToDids: string[],
-    allContacts: Array<Contact>,
-    activeDid: string,
-    allMyDids: Array<string>,
-  ) {
-    this.roleName = roleName;
-    this.visibleToDids = visibleToDids;
-    this.allContacts = allContacts;
-    this.activeDid = activeDid;
-    this.allMyDids = allMyDids;
-    this.isOpen = true;
-  }
-
-  close() {
-    this.isOpen = false;
-  }
-
-  didInfo(did: string) {
-    return serverUtil.didInfo(
-      did,
-      this.activeDid,
-      this.allMyDids,
-      this.allContacts,
-    );
-  }
-
-  copyToClipboard(name: string, text: string) {
-    useClipboard()
-      .copy(text)
-      .then(() => {
-        this.$notify(
-          {
-            group: "alert",
-            type: "toast",
-            title: "Copied",
-            text: (name || "That") + " was copied to the clipboard.",
-          },
-          2000,
-        );
-      });
-  }
-
-  onClickShareClaim() {
-    this.copyToClipboard("A link to this page", this.windowLocation);
-    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,
-    });
-  }
-}
-</script>

src/components/ImageMethodDialog.vue

@@ -18,7 +18,7 @@
 
       <div>
         <div class="text-center mt-8">
-          <div>
+          <div class>
             <fa
               icon="camera"
               class="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-2 rounded-md"
@@ -155,7 +155,6 @@ export default class ImageMethodDialog extends Vue {
 
 <style>
 .dialog-overlay {
-  z-index: 50;
   position: fixed;
   top: 0;
   left: 0;

src/components/ImageViewer.vue

@@ -1,94 +0,0 @@
-<template>
-  <Teleport to="body">
-    <Transition name="fade">
-      <div v-if="isOpen" class="fixed inset-0 z-50 flex flex-col bg-black/90">
-        <!-- Header bar - fixed height to prevent overlap -->
-        <div class="h-16 flex justify-between items-center px-4 bg-black">
-          <button
-            class="text-white text-2xl p-2 rounded-full hover:bg-white/10"
-            @click="close"
-          >
-            <fa icon="xmark" />
-          </button>
-
-          <!-- Mobile share button -->
-          <button
-            v-if="isMobile"
-            class="text-white text-xl p-2 rounded-full hover:bg-white/10"
-            @click="handleShare"
-          >
-            <fa icon="ellipsis" />
-          </button>
-        </div>
-
-        <!-- Image container - fill remaining space -->
-        <div class="flex-1 flex items-center justify-center p-2">
-          <div class="w-full h-full flex items-center justify-center">
-            <img
-              :src="imageUrl"
-              class="max-h-[calc(100vh-5rem)] w-full h-full object-contain"
-              @click.stop
-              alt="expanded shared content"
-            />
-          </div>
-        </div>
-      </div>
-    </Transition>
-  </Teleport>
-</template>
-
-<script lang="ts">
-import { Component, Vue, Prop } from "vue-facing-decorator";
-import { UAParser } from "ua-parser-js";
-
-@Component({ emits: ["update:isOpen"] })
-export default class ImageViewer extends Vue {
-  @Prop() imageUrl!: string;
-  @Prop() imageData!: Blob | null;
-  @Prop() isOpen!: boolean;
-
-  userAgent = new UAParser();
-
-  get isMobile() {
-    const os = this.userAgent.getOS().name;
-    return os === "iOS" || os === "Android";
-  }
-
-  close() {
-    this.$emit("update:isOpen", false);
-  }
-
-  async handleShare() {
-    const os = this.userAgent.getOS().name;
-
-    try {
-      if (os === "iOS" || os === "Android") {
-        if (navigator.share) {
-          // Always share the URL since it's more reliable across platforms
-          await navigator.share({
-            url: this.imageUrl,
-          });
-        } else {
-          // Fallback for browsers without share API
-          window.open(this.imageUrl, "_blank");
-        }
-      }
-    } catch (error) {
-      console.warn("Share failed, opening in new tab:", error);
-      window.open(this.imageUrl, "_blank");
-    }
-  }
-}
-</script>
-
-<style scoped>
-.fade-enter-active,
-.fade-leave-active {
-  transition: opacity 0.2s ease;
-}
-
-.fade-enter-from,
-.fade-leave-to {
-  opacity: 0;
-}
-</style>

src/components/InviteDialog.vue

@@ -1,119 +0,0 @@
-<template>
-  <div v-if="visible" class="dialog-overlay">
-    <div class="dialog">
-      <h1 class="text-xl font-bold text-center mb-4">Invitation & Notes</h1>
-
-      These are optional notes for your use; they are comments to help you
-      recall who it is when they accept it. These notes are sent to the server.
-      If you want to store your own way, the invitation ID is:
-      {{ inviteIdentifier }}
-      <input
-        type="text"
-        placeholder="Notes"
-        class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
-        v-model="text"
-      />
-
-      <!-- Add date selection element -->
-      Expiration
-      <input
-        type="date"
-        class="block rounded border border-slate-400 mb-4 px-3 py-2"
-        v-model="expiresAt"
-      />
-
-      <div class="mt-8">
-        <div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
-          <button
-            type="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 mb-2"
-            @click="onClickSaveChanges()"
-          >
-            Save
-          </button>
-          <!-- SHOW ME instead while processing saving changes -->
-          <button
-            type="button"
-            class="block w-full text-center text-md uppercase bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md mb-2"
-            @click="onClickCancel()"
-          >
-            Cancel
-          </button>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts">
-import { Vue, Component } from "vue-facing-decorator";
-
-import { NotificationIface } from "@/constants/app";
-
-@Component
-export default class InviteDialog extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  callback: (text: string, expiresAt: string) => void = () => {};
-  inviteIdentifier = "";
-  text = "";
-  visible = false;
-  expiresAt = new Date(Date.now() + 1000 * 60 * 60 * 24 * 7)
-    .toISOString()
-    .substring(0, 10);
-
-  async open(
-    inviteIdentifier: string,
-    aCallback: (text: string, expiresAt: string) => void,
-  ) {
-    this.callback = aCallback;
-    this.inviteIdentifier = inviteIdentifier;
-    this.visible = true;
-  }
-
-  async onClickSaveChanges() {
-    if (!this.expiresAt) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "warning",
-          title: "Needs Expiration",
-          text: "You must select an expiration date.",
-        },
-        5000,
-      );
-    } else {
-      this.callback(this.text, this.expiresAt);
-      this.visible = false;
-    }
-  }
-
-  onClickCancel() {
-    this.visible = false;
-  }
-}
-</script>
-
-<style>
-.dialog-overlay {
-  z-index: 50;
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background-color: rgba(0, 0, 0, 0.5);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  padding: 1.5rem;
-}
-
-.dialog {
-  background-color: white;
-  padding: 1rem;
-  border-radius: 0.5rem;
-  width: 100%;
-  max-width: 500px;
-}
-</style>

src/components/MembersList.vue

@@ -1,522 +0,0 @@
-<template>
-  <div class="space-y-4">
-    <!-- Loading State -->
-    <div
-      v-if="isLoading"
-      class="mt-16 text-center text-4xl bg-slate-400 text-white w-14 py-2.5 rounded-full mx-auto"
-    >
-      <fa icon="spinner" class="fa-spin-pulse" />
-    </div>
-
-    <!-- Members List -->
-
-    <div v-else>
-      <div class="text-center text-red-600 py-4">
-        {{ decryptionErrorMessage() }}
-      </div>
-
-      <div v-if="missingMyself" class="py-4 text-red-600">
-        You are not currently admitted by the organizer.
-      </div>
-      <div v-if="!firstName" class="py-4 text-red-600">
-        Your name is not set, so others may not recognize you. Reload this page
-        to set it.
-      </div>
-
-      <div>
-        <span
-          v-if="membersToShow().length > 0 && showOrganizerTools && isOrganizer"
-          class="inline-flex items-center flex-wrap"
-        >
-          <span class="inline-flex items-center">
-            &bull; Click
-            <span
-              class="mx-2 min-w-[24px] min-h-[24px] w-6 h-6 flex items-center justify-center rounded-full bg-blue-100 text-blue-600"
-            >
-              <fa icon="plus" class="text-sm" />
-            </span>
-            /
-            <span
-              class="mx-2 min-w-[24px] min-h-[24px] w-6 h-6 flex items-center justify-center rounded-full bg-blue-100 text-blue-600"
-            >
-              <fa icon="minus" class="text-sm" />
-            </span>
-            to add/remove them to/from the meeting.
-          </span>
-        </span>
-      </div>
-      <div>
-        <span
-          v-if="membersToShow().length > 0"
-          class="inline-flex items-center"
-        >
-          &bull; Click
-          <span
-            class="mx-2 w-8 h-8 flex items-center justify-center rounded-full bg-green-100 text-green-600"
-          >
-            <fa icon="circle-user" class="text-xl" />
-          </span>
-          to add them to your contacts.
-        </span>
-      </div>
-
-      <div class="flex justify-center">
-        <!-- always have at least one refresh button even without members in case the organizer changes the password -->
-        <button
-          @click="fetchMembers"
-          class="w-8 h-8 flex items-center justify-center rounded-full bg-blue-100 text-blue-600 hover:bg-blue-200 hover:text-blue-800 transition-colors"
-          title="Refresh members list"
-        >
-          <fa icon="rotate" :class="{ 'fa-spin': isLoading }" />
-        </button>
-      </div>
-      <div
-        v-for="member in membersToShow()"
-        :key="member.member.memberId"
-        class="mt-2 p-4 bg-gray-50 rounded-lg"
-      >
-        <div class="flex items-center justify-between">
-          <div class="flex items-center">
-            <h3 class="text-lg font-medium">{{ member.name }}</h3>
-            <div
-              v-if="!getContactFor(member.did) && member.did !== activeDid"
-              class="flex justify-end"
-            >
-              <button
-                @click="addAsContact(member)"
-                class="ml-2 w-8 h-8 flex items-center justify-center rounded-full bg-green-100 text-green-600 hover:bg-green-200 hover:text-green-800 transition-colors"
-                title="Add as contact"
-              >
-                <fa icon="circle-user" class="text-xl" />
-              </button>
-            </div>
-            <button
-              v-if="member.did !== activeDid"
-              @click="
-                informAboutAddingContact(
-                  getContactFor(member.did) !== undefined,
-                )
-              "
-              class="ml-2 mb-2 w-6 h-6 flex items-center justify-center rounded-full bg-slate-100 text-slate-500 hover:bg-slate-200 hover:text-slate-800 transition-colors"
-              title="Contact info"
-            >
-              <fa icon="circle-info" class="text-base" />
-            </button>
-          </div>
-          <div class="flex">
-            <span
-              v-if="
-                showOrganizerTools && isOrganizer && member.did !== activeDid
-              "
-              class="flex items-center"
-            >
-              <button
-                @click="checkWhetherContactBeforeAdmitting(member)"
-                class="mr-2 w-6 h-6 flex items-center justify-center rounded-full bg-blue-100 text-blue-600 hover:bg-blue-200 hover:text-blue-800 transition-colors"
-                :title="
-                  member.member.admitted ? 'Remove member' : 'Admit member'
-                "
-              >
-                <fa
-                  :icon="member.member.admitted ? 'minus' : 'plus'"
-                  class="text-sm"
-                />
-              </button>
-              <button
-                @click="informAboutAdmission()"
-                class="mr-2 mb-2 w-6 h-6 flex items-center justify-center rounded-full bg-slate-100 text-slate-500 hover:bg-slate-200 hover:text-slate-800 transition-colors"
-                title="Admission info"
-              >
-                <fa icon="circle-info" class="text-base" />
-              </button>
-            </span>
-          </div>
-        </div>
-        <p class="text-sm text-gray-600 truncate">
-          {{ member.did }}
-        </p>
-      </div>
-      <div v-if="membersToShow().length > 0" class="flex justify-center mt-4">
-        <button
-          @click="fetchMembers"
-          class="w-8 h-8 flex items-center justify-center rounded-full bg-blue-100 text-blue-600 hover:bg-blue-200 hover:text-blue-800 transition-colors"
-          title="Refresh members list"
-        >
-          <fa icon="rotate" :class="{ 'fa-spin': isLoading }" />
-        </button>
-      </div>
-
-      <p v-if="members.length === 0" class="text-gray-500 py-4">
-        No members have joined this meeting yet
-      </p>
-    </div>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Vue, Prop } from "vue-facing-decorator";
-
-import {
-  logConsoleAndDb,
-  retrieveSettingsForActiveAccount,
-  db,
-} from "@/db/index";
-import {
-  errorStringForLog,
-  getHeaders,
-  register,
-  serverMessageForUser,
-} from "@/libs/endorserServer";
-import { decryptMessage } from "@/libs/crypto";
-import { Contact } from "@/db/tables/contacts";
-import * as libsUtil from "@/libs/util";
-import { NotificationIface } from "@/constants/app";
-
-interface Member {
-  admitted: boolean;
-  content: string;
-  memberId: number;
-}
-
-interface DecryptedMember {
-  member: Member;
-  name: string;
-  did: string;
-  isRegistered: boolean;
-}
-
-@Component
-export default class MembersList extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  libsUtil = libsUtil;
-
-  @Prop({ required: true }) password!: string;
-  @Prop({ default: false }) showOrganizerTools!: boolean;
-
-  decryptedMembers: DecryptedMember[] = [];
-  firstName = "";
-  isLoading = true;
-  isOrganizer = false;
-  members: Member[] = [];
-  missingPassword = false;
-  missingMyself = false;
-  activeDid = "";
-  apiServer = "";
-  contacts: Array<Contact> = [];
-
-  async created() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
-    this.firstName = settings.firstName || "";
-    await this.fetchMembers();
-    await this.loadContacts();
-  }
-
-  async fetchMembers() {
-    try {
-      this.isLoading = true;
-      const headers = await getHeaders(this.activeDid);
-      const response = await this.axios.get(
-        `${this.apiServer}/api/partner/groupOnboardMembers`,
-        { headers },
-      );
-
-      if (response.data && response.data.data) {
-        this.members = response.data.data;
-        await this.decryptMemberContents();
-      }
-    } catch (error) {
-      logConsoleAndDb(
-        "Error fetching members: " + errorStringForLog(error),
-        true,
-      );
-      this.$emit(
-        "error",
-        serverMessageForUser(error) || "Failed to fetch members.",
-      );
-    } finally {
-      this.isLoading = false;
-    }
-  }
-
-  async decryptMemberContents() {
-    this.decryptedMembers = [];
-
-    if (!this.password) {
-      this.missingPassword = true;
-      return;
-    }
-
-    let isFirstEntry = true,
-      foundMyself = false;
-    for (const member of this.members) {
-      try {
-        const decryptedContent = await decryptMessage(
-          member.content,
-          this.password,
-        );
-        const content = JSON.parse(decryptedContent);
-
-        this.decryptedMembers.push({
-          member: member,
-          name: content.name,
-          did: content.did,
-          isRegistered: !!content.isRegistered,
-        });
-        if (isFirstEntry && content.did === this.activeDid) {
-          this.isOrganizer = true;
-        }
-        if (content.did === this.activeDid) {
-          foundMyself = true;
-        }
-      } catch (error) {
-        // do nothing, relying on the count of members to determine if there was an error
-      }
-      isFirstEntry = false;
-    }
-    this.missingMyself = !foundMyself;
-  }
-
-  decryptionErrorMessage(): string {
-    if (this.isOrganizer) {
-      if (this.decryptedMembers.length < this.members.length) {
-        return "Some members have data that cannot be decrypted with that password.";
-      } else {
-        // the lists must be equal
-        return "";
-      }
-    } else {
-      // non-organizers should only see problems if the first (organizer) member is not decrypted
-      if (
-        this.decryptedMembers.length === 0 ||
-        this.decryptedMembers[0].member.memberId !== this.members[0].memberId
-      ) {
-        return "Your password is not the same as the organizer. Reload or have them check their password.";
-      } else {
-        // the first (organizer) member was decrypted OK
-        return "";
-      }
-    }
-  }
-
-  membersToShow(): DecryptedMember[] {
-    if (this.isOrganizer) {
-      if (this.showOrganizerTools) {
-        return this.decryptedMembers;
-      } else {
-        return this.decryptedMembers.filter(
-          (member: DecryptedMember) => member.member.admitted,
-        );
-      }
-    }
-    // non-organizers only get visible members from server
-    return this.decryptedMembers;
-  }
-
-  informAboutAdmission() {
-    this.$notify(
-      {
-        group: "alert",
-        type: "info",
-        title: "Admission info",
-        text: "This is to register people in Time Safari and to admit them to the meeting. A '+' symbol means they are not yet admitted and you can register and admit them. A '-' means you can remove them, but they will stay registered.",
-      },
-      10000,
-    );
-  }
-
-  informAboutAddingContact(contactImportedAlready: boolean) {
-    if (contactImportedAlready) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "info",
-          title: "Contact Exists",
-          text: "They are in your contacts. If you want to remove them, you must do that from the contacts screen.",
-        },
-        10000,
-      );
-    } else {
-      this.$notify(
-        {
-          group: "alert",
-          type: "info",
-          title: "Contact Available",
-          text: "This is to add them to your contacts. If you want to remove them later, you must do that from the contacts screen.",
-        },
-        10000,
-      );
-    }
-  }
-
-  async loadContacts() {
-    this.contacts = await db.contacts.toArray();
-  }
-
-  getContactFor(did: string): Contact | undefined {
-    return this.contacts.find((contact) => contact.did === did);
-  }
-
-  checkWhetherContactBeforeAdmitting(decrMember: DecryptedMember) {
-    const contact = this.getContactFor(decrMember.did);
-    if (!decrMember.member.admitted && !contact) {
-      // If not a contact, show confirmation dialog
-      this.$notify(
-        {
-          group: "modal",
-          type: "confirm",
-          title: "Add as Contact First?",
-          text: "This person is not in your contacts. Would you like to add them as a contact first?",
-          yesText: "Add as Contact",
-          noText: "Skip Adding Contact",
-          onYes: async () => {
-            await this.addAsContact(decrMember);
-            // After adding as contact, proceed with admission
-            await this.toggleAdmission(decrMember);
-          },
-          onNo: async () => {
-            // If they choose not to add as contact, show second confirmation
-            this.$notify(
-              {
-                group: "modal",
-                type: "confirm",
-                title: "Continue Without Adding?",
-                text: "Are you sure you want to proceed with admission? If they are not a contact, you will not know their name after this meeting.",
-                yesText: "Continue",
-                onYes: async () => {
-                  await this.toggleAdmission(decrMember);
-                },
-                onCancel: async () => {
-                  // Do nothing, effectively canceling the operation
-                },
-              },
-              -1,
-            );
-          },
-        },
-        -1,
-      );
-    } else {
-      // If already a contact, proceed directly with admission
-      this.toggleAdmission(decrMember);
-    }
-  }
-
-  async toggleAdmission(decrMember: DecryptedMember) {
-    try {
-      const headers = await getHeaders(this.activeDid);
-      await this.axios.put(
-        `${this.apiServer}/api/partner/groupOnboardMember/${decrMember.member.memberId}`,
-        { admitted: !decrMember.member.admitted },
-        { headers },
-      );
-      // Update local state
-      decrMember.member.admitted = !decrMember.member.admitted;
-
-      const oldContact = this.getContactFor(decrMember.did);
-      // if admitted, now register that user if they are not registered
-      if (
-        decrMember.member.admitted &&
-        !decrMember.isRegistered &&
-        !oldContact?.registered
-      ) {
-        const contactOldOrNew: Contact = oldContact || {
-          did: decrMember.did,
-          name: decrMember.name,
-        };
-        try {
-          const result = await register(
-            this.activeDid,
-            this.apiServer,
-            this.axios,
-            contactOldOrNew,
-          );
-          if (result.success) {
-            decrMember.isRegistered = true;
-            if (oldContact) {
-              await db.contacts.update(decrMember.did, { registered: true });
-              oldContact.registered = true;
-            }
-            this.$notify(
-              {
-                group: "alert",
-                type: "success",
-                title: "Registered",
-                text: "Besides being admitted, they were also registered.",
-              },
-              3000,
-            );
-          } else {
-            throw result;
-          }
-          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        } catch (error: any) {
-          // registration failure is likely explained by a message from the server
-          const additionalInfo =
-            serverMessageForUser(error) || error?.error || "";
-          this.$notify(
-            {
-              group: "alert",
-              type: "warning",
-              title: "Registration failed",
-              text:
-                "They were admitted to the meeting. However, registration failed. You can register them from the contacts screen. " +
-                additionalInfo,
-            },
-            12000,
-          );
-        }
-      }
-    } catch (error) {
-      logConsoleAndDb(
-        "Error toggling admission: " + errorStringForLog(error),
-        true,
-      );
-      this.$emit(
-        "error",
-        serverMessageForUser(error) ||
-          "Failed to update member admission status.",
-      );
-    }
-  }
-
-  async addAsContact(member: DecryptedMember) {
-    try {
-      const newContact = {
-        did: member.did,
-        name: member.name,
-      };
-
-      await db.contacts.add(newContact);
-      this.contacts.push(newContact);
-
-      this.$notify(
-        {
-          group: "alert",
-          type: "success",
-          title: "Contact Added",
-          text: "They were added to your contacts.",
-        },
-        3000,
-      );
-    } catch (err) {
-      logConsoleAndDb("Error adding contact: " + errorStringForLog(err), true);
-      let message = "An error prevented adding this contact.";
-      if (err instanceof Error && err.message?.indexOf("already exists") > -1) {
-        message = "This person is already in your contact list.";
-      }
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Contact Not Added",
-          text: message,
-        },
-        5000,
-      );
-    }
-  }
-}
-</script>

src/components/OfferDialog.vue

@@ -6,7 +6,7 @@
         type="text"
         data-testId="inputDescription"
         class="block w-full rounded border border-slate-400 mb-2 px-3 py-2"
-        placeholder="Description of what is offered"
+        placeholder="Description, prerequisites, terms, etc."
         v-model="description"
       />
       <div class="flex flex-row mt-2">
@@ -83,19 +83,17 @@
 import { Vue, Component, Prop } from "vue-facing-decorator";
 
 import { NotificationIface } from "@/constants/app";
-import {
-  createAndSubmitOffer,
-  serverMessageForUser,
-} from "@/libs/endorserServer";
+import { createAndSubmitOffer } from "@/libs/endorserServer";
 import * as libsUtil from "@/libs/util";
-import { retrieveSettingsForActiveAccount } from "@/db/index";
+import { db } from "@/db/index";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
 
 @Component
 export default class OfferDialog extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
-  @Prop projectId?: string;
-  @Prop projectName?: string;
+  @Prop projectId?;
+  @Prop projectName?;
 
   activeDid = "";
   apiServer = "";
@@ -115,9 +113,10 @@ export default class OfferDialog extends Vue {
       this.recipientDid = recipientDid;
       this.recipientName = recipientName;
 
-      const settings = await retrieveSettingsForActiveAccount();
-      this.apiServer = settings.apiServer || "";
-      this.activeDid = settings.activeDid || "";
+      await db.open();
+      const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+      this.apiServer = settings?.apiServer || "";
+      this.activeDid = settings?.activeDid || "";
 
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (err: any) {
@@ -210,9 +209,9 @@ export default class OfferDialog extends Vue {
           group: "alert",
           type: "danger",
           title: "Error",
-          text: "You must select an identity before you can record an offer.",
+          text: "You must select an identifier before you can record an offer.",
         },
-        7000,
+        -1,
       );
       return;
     }
@@ -238,7 +237,6 @@ export default class OfferDialog extends Vue {
         description,
         amount,
         unitCode,
-        "",
         expirationDateInput,
         this.recipientDid,
         this.projectId,
@@ -267,7 +265,7 @@ export default class OfferDialog extends Vue {
             title: "Success",
             text: "That offer was recorded.",
           },
-          5000,
+          10000,
         );
       }
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -307,9 +305,9 @@ export default class OfferDialog extends Vue {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   getOfferCreationErrorMessage(result: any) {
     return (
-      serverMessageForUser(result) ||
       result.error?.userMessage ||
-      result.error?.error
+      result.error?.error ||
+      result.response?.data?.error?.message
     );
   }
 }
@@ -317,7 +315,6 @@ export default class OfferDialog extends Vue {
 
 <style>
 .dialog-overlay {
-  z-index: 50;
   position: fixed;
   top: 0;
   left: 0;

src/components/OnboardingDialog.vue

@@ -1,286 +0,0 @@
-<!-- similar to ContactNameDialog -->
-<template>
-  <div v-if="visible" class="dialog-overlay">
-    <div v-if="page === OnboardPage.Home" class="dialog">
-      <h1 class="text-xl font-bold text-center mb-4 relative">
-        Welcome to Time Safari
-        <br />
-        - Showcasing Gratitude & Magnifying Time
-        <div
-          class="text-lg text-center leading-none absolute right-0 -top-1"
-          @click="onClickClose(true)"
-        >
-          <fa icon="xmark" class="w-[1em]" />
-        </div>
-      </h1>
-
-      <p v-if="isRegistered" class="mt-4">
-        You can now log things that you've seen:
-        <span v-if="numContacts > 0">
-          click on any name (like {{ firstContactName }}) or
-        </span>
-        click on the
-        <span class="bg-green-600 text-white rounded-full">
-          <fa icon="plus" class="fa-fw" />
-        </span>
-        button to express your appreciation for... whatever -- maybe thanks for
-        showing you all these fascinating stories of
-        <em>gratitude</em>.
-      </p>
-      <p v-else class="mt-4">
-        The feed underneath this pop-up shows the latest gifts that others have
-        recognized. Once someone registers you, you can log your appreciation,
-        too.
-      </p>
-
-      <p class="mt-4">
-        The more you illuminate cool things people are doing, the more you
-        attract people to work with you.
-      </p>
-
-      <p class="mt-4 flex items-center">
-        The
-        <fa
-          icon="house-chimney"
-          class="ml-1 mr-1 text-lg text-white bg-slate-400 px-2 py-2 rounded"
-        />
-        button below brings you back to this feed screen.
-      </p>
-
-      <div class="mt-8">
-        <div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
-          <button
-            type="button"
-            data-testId="closeOnboardingAndFinish"
-            class="block w-full 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-2 py-3 rounded-md mb-2"
-            @click="onClickClose(true)"
-          >
-            That's enough help, thanks.
-          </button>
-          <button
-            type="button"
-            class="block w-full text-center text-md bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md mb-2"
-            @click="$router.push({ name: 'discover' })"
-          >
-            Show me more!
-          </button>
-        </div>
-      </div>
-
-      <p class="mt-4 flex items-center">
-        To see these instructions and more, click above on
-        <span
-          class="ml-1 mr-1 text-xs uppercase bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-1 rounded-md"
-        >
-          Help
-        </span>
-      </p>
-    </div>
-
-    <div v-if="page === OnboardPage.Discover" class="dialog">
-      <h1 class="text-xl font-bold text-center mb-4 relative">
-        Offer to Interesting Events & People
-        <div
-          class="text-lg text-center leading-none absolute right-0 -top-1"
-          @click="onClickClose(true)"
-        >
-          <fa icon="xmark" class="w-[1em]" />
-        </div>
-      </h1>
-
-      <p>
-        Once you've seen things that others have given or done, you may find
-        ways you want to contribute, too. It turns out others have proposed
-        activities together, and this page is where you find projects.
-      </p>
-
-      <p class="mt-4">
-        Search for a topic, or search around your neighborhod under "Nearby".
-      </p>
-
-      <p class="mt-4">
-        When you find some that seem interesting, you can offer your help. You
-        are welcome to make your offer conditional, for example if they get 2
-        other people to help besides you.
-      </p>
-
-      <p class="mt-4 flex items-center">
-        The
-        <fa
-          icon="magnifying-glass"
-          class="ml-1 mr-1 text-lg text-white bg-slate-400 px-2 py-2 rounded"
-        />
-        button below brings you to this discovery screen.
-      </p>
-
-      <div class="mt-8">
-        <div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
-          <button
-            type="button"
-            data-testId="closeOnboardingAndFinish"
-            class="block w-full 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-2 py-3 rounded-md mb-2"
-            @click="onClickClose(true)"
-          >
-            No more help, thanks.
-          </button>
-          <button
-            type="button"
-            class="block w-full text-center text-md bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md mb-2"
-            @click="$router.push({ name: 'projects' })"
-          >
-            Show me even more.
-          </button>
-        </div>
-      </div>
-    </div>
-
-    <div v-if="page === OnboardPage.Create" class="dialog">
-      <h1 class="text-xl font-bold text-center mb-4 relative">
-        Fish for Others with Your Projects
-        <div
-          class="text-lg text-center leading-none absolute right-0 -top-1"
-          @click="onClickClose(true)"
-        >
-          <fa icon="xmark" class="w-[1em]" />
-        </div>
-      </h1>
-
-      <p class="relative">
-        Now you can take a turn: click on the
-        <span class="bg-green-600 text-white rounded-full">
-          <fa icon="plus" class="fa-fw" />
-        </span>
-        button to throw out projects of your own... anything you'd like to see
-        happen. If your first idea doesn't catch anyone, try, try again... and
-        let others know that this is a good place to find help.
-      </p>
-
-      <p class="mt-4 flex items-center">
-        The
-        <fa
-          icon="hand"
-          class="ml-1 mr-1 text-lg text-white bg-slate-400 px-2 py-2 rounded"
-        />
-        button below brings you here to see your ideas.
-      </p>
-
-      <p class="mt-4">
-        By the way, one good way to get to know your neighbors and their
-        interests is to offer time directly to them. You can do this on the
-        contacts screen
-        <fa icon="users" class="text-slate-500" />
-        which is a great way to get to know a neighbor's interests.
-      </p>
-
-      <div class="mt-8">
-        <div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
-          <button
-            type="button"
-            data-testId="closeOnboardingAndFinish"
-            class="block w-full 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-2 py-3 rounded-md mb-2"
-            @click="onClickClose(true, true)"
-          >
-            Let's go!
-            <br />
-            See & record gratitude.
-          </button>
-          <button
-            type="button"
-            class="block w-full text-center text-md bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md mb-2"
-            @click="$router.push({ name: 'help' })"
-          >
-            I want to read more Help.
-          </button>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-import { Router } from "vue-router";
-
-import { NotificationIface } from "@/constants/app";
-import {
-  db,
-  retrieveSettingsForActiveAccount,
-  updateAccountSettings,
-} from "@/db/index";
-import { OnboardPage } from "@/libs/util";
-
-@Component({
-  computed: {
-    OnboardPage() {
-      return OnboardPage;
-    },
-  },
-  components: { OnboardPage },
-})
-export default class OnboardingDialog extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  activeDid = "";
-  firstContactName = null;
-  givenName = "";
-  isRegistered = false;
-  numContacts = 0;
-  page = OnboardPage.Home;
-  visible = false;
-
-  async open(page: OnboardPage) {
-    this.page = page;
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.isRegistered = !!settings.isRegistered;
-    const contacts = await db.contacts.toArray();
-    this.numContacts = contacts.length;
-    if (this.numContacts > 0) {
-      this.firstContactName = contacts[0].name;
-    }
-    this.visible = true;
-    if (this.page === OnboardPage.Create) {
-      // we'll assume that they've been through all the other pages
-      await updateAccountSettings(this.activeDid, {
-        finishedOnboarding: true,
-      });
-    }
-  }
-
-  async onClickClose(done?: boolean, goHome?: boolean) {
-    this.visible = false;
-    if (done) {
-      await updateAccountSettings(this.activeDid, {
-        finishedOnboarding: true,
-      });
-      if (goHome) {
-        (this.$router as Router).push({ name: "home" });
-      }
-    }
-  }
-}
-</script>
-
-<style>
-.dialog-overlay {
-  z-index: 40;
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background-color: rgba(0, 0, 0, 0.5);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  padding: 1.5rem;
-}
-
-.dialog {
-  background-color: white;
-  padding: 1rem;
-  border-radius: 0.5rem;
-  width: 100%;
-  max-width: 500px;
-}
-</style>

src/components/PhotoDialog.vue

@@ -76,8 +76,7 @@
       </div>
       <div v-else ref="cameraContainer">
         <!--
-          Camera "resolution" doesn't change how it shows on screen but rather stretches the result,
-          eg. the following which just stretches it vertically:
+          Camera "resolution" doesn't change how it shows on screen but rather stretches the result, eg the following which just stretches it vertically:
           :resolution="{ width: 375, height: 812 }"
         -->
         <camera
@@ -127,7 +126,8 @@ import { Component, Vue } from "vue-facing-decorator";
 import VuePictureCropper, { cropper } from "vue-picture-cropper";
 
 import { DEFAULT_IMAGE_API_SERVER, NotificationIface } from "@/constants/app";
-import { retrieveSettingsForActiveAccount } from "@/db/index";
+import { db } from "@/db/index";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
 import { accessToken } from "@/libs/crypto";
 
 @Component({ components: { Camera, VuePictureCropper } })
@@ -151,8 +151,9 @@ export default class PhotoDialog extends Vue {
 
   async mounted() {
     try {
-      const settings = await retrieveSettingsForActiveAccount();
-      this.activeDid = settings.activeDid || "";
+      await db.open();
+      const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+      this.activeDid = settings?.activeDid || "";
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (err: any) {
       console.error("Error retrieving settings from database:", err);
@@ -409,7 +410,6 @@ export default class PhotoDialog extends Vue {
 
 <style>
 .dialog-overlay {
-  z-index: 60;
   position: fixed;
   top: 0;
   left: 0;

src/components/PushNotificationPermission.vue

@@ -1,574 +0,0 @@
-<template>
-  <transition
-    enter-active-class="transform ease-out duration-300 transition"
-    enter-from-class="translate-y-2 opacity-0 sm:translate-y-4"
-    enter-to-class="translate-y-0 opacity-100 sm:translate-y-0"
-    leave-active-class="transition ease-in duration-500"
-    leave-from-class="opacity-100"
-    leave-to-class="opacity-0"
-  >
-    <div
-      v-if="isVisible"
-      class="fixed z-[100] top-0 inset-x-0 w-full inset-0 h-screen flex flex-col items-center justify-center bg-slate-900/50"
-    >
-      <div
-        class="flex w-11/12 max-w-sm mx-auto mb-3 overflow-hidden bg-white rounded-lg shadow-lg"
-      >
-        <div class="w-full px-6 py-6 text-slate-900 text-center">
-          <p v-if="serviceWorkerReady && vapidKey" class="text-lg mb-4">
-            <span v-if="pushType === DAILY_CHECK_TITLE">
-              Would you like to be notified of new activity, up to once a day?
-            </span>
-            <span v-else>
-              Would you like to get a reminder message once a day?
-            </span>
-          </p>
-          <p v-else class="text-lg mb-4">
-            Waiting for system initialization, which may take up to 5 seconds...
-            <fa icon="spinner" spin />
-          </p>
-
-          <div v-if="serviceWorkerReady && vapidKey">
-            <div v-if="pushType === DAILY_CHECK_TITLE">
-              <span>Yes, send me a message when there is new data for me</span>
-            </div>
-            <div v-else>
-              <span>Yes, send me this message:</span>
-              <!-- eslint-disable -->
-              <textarea
-                type="text"
-                id="push-message"
-                v-model="messageInput"
-                class="rounded border border-slate-400 mt-2 px-2 py-2 w-full"
-                maxlength="100"
-              ></textarea
-              >
-              <!-- eslint-enable -->
-              <span class="w-full flex justify-between text-xs text-slate-500">
-                <span></span>
-                <span>(100 characters max)</span>
-              </span>
-            </div>
-
-            <div>
-              <span class="flex flex-row justify-center">
-                <span class="mt-2">... at: </span>
-                <input
-                  type="number"
-                  @change="checkHourInput"
-                  class="rounded-l border border-r-0 border-slate-400 ml-2 mt-2 px-2 py-2 text-center w-20"
-                  v-model="hourInput"
-                />
-                <input
-                  type="number"
-                  @change="checkMinuteInput"
-                  class="border border-slate-400 mt-2 px-2 py-2 text-center w-20"
-                  v-model="minuteInput"
-                />
-                <span
-                  class="rounded-r border border-slate-400 bg-slate-200 text-center text-blue-500 mt-2 px-2 py-2 w-20"
-                  @click="hourAm = !hourAm"
-                >
-                  <span v-if="hourAm"> AM <fa icon="chevron-down" /> </span>
-                  <span v-else> PM <fa icon="chevron-up" /> </span>
-                </span>
-              </span>
-            </div>
-            <button
-              class="block w-full text-center text-md font-bold uppercase bg-blue-600 text-white mt-2 px-2 py-2 rounded-md"
-              @click="
-                close();
-                turnOnNotifications();
-              "
-            >
-              Turn on Daily Message
-            </button>
-          </div>
-
-          <button
-            @click="close()"
-            class="block w-full text-center text-md font-bold uppercase bg-slate-600 text-white mt-4 px-2 py-2 rounded-md"
-          >
-            No, Not Now
-          </button>
-        </div>
-      </div>
-    </div>
-  </transition>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-
-import { DEFAULT_PUSH_SERVER, NotificationIface } from "@/constants/app";
-import {
-  logConsoleAndDb,
-  retrieveSettingsForActiveAccount,
-  secretDB,
-} from "@/db/index";
-import { MASTER_SECRET_KEY } from "@/db/tables/secret";
-import { urlBase64ToUint8Array } from "@/libs/crypto/vc/util";
-import * as libsUtil from "@/libs/util";
-
-// Example interface for error
-interface ErrorResponse {
-  message: string;
-}
-
-// PushSubscriptionJSON is defined in the Push API https://www.w3.org/TR/push-api/#dom-pushsubscriptionjson
-interface PushSubscriptionWithTime extends PushSubscriptionJSON {
-  message?: string;
-  notifyTime: { utcHour: number; minute: number };
-  notifyType: string;
-}
-
-interface ServiceWorkerMessage {
-  type: string;
-  data: string;
-}
-
-interface ServiceWorkerResponse {
-  // Define the properties and their types
-  success: boolean;
-  message?: string;
-}
-
-interface VapidResponse {
-  data: {
-    vapidKey: string;
-  };
-}
-
-@Component
-export default class PushNotificationPermission extends Vue {
-  // eslint-disable-next-line
-  $notify!: (notification: NotificationIface, timeout?: number) => Promise<() => void>;
-
-  DAILY_CHECK_TITLE = libsUtil.DAILY_CHECK_TITLE;
-  DIRECT_PUSH_TITLE = libsUtil.DIRECT_PUSH_TITLE;
-
-  callback: (success: boolean, time: string, message?: string) => void =
-    () => {};
-  hourAm = true;
-  hourInput = "8";
-  isVisible = false;
-  messageInput = "";
-  minuteInput = "00";
-  pushType = "";
-  serviceWorkerReady = false;
-  vapidKey = "";
-
-  async open(
-    pushType: string,
-    callback?: (success: boolean, time: string, message?: string) => void,
-  ) {
-    this.callback = callback || this.callback;
-    this.isVisible = true;
-    this.pushType = pushType;
-    try {
-      const settings = await retrieveSettingsForActiveAccount();
-      let pushUrl = DEFAULT_PUSH_SERVER;
-      if (settings?.webPushServer) {
-        pushUrl = settings.webPushServer;
-      }
-
-      if (pushUrl.startsWith("http://localhost")) {
-        logConsoleAndDb("Not checking for VAPID in this local environment.");
-      } else {
-        let responseData = "";
-        await this.axios
-          .get(pushUrl + "/web-push/vapid")
-          .then((response: VapidResponse) => {
-            this.vapidKey = response.data?.vapidKey || "";
-            logConsoleAndDb("Got vapid key: " + this.vapidKey);
-            responseData = JSON.stringify(response.data);
-            navigator.serviceWorker?.addEventListener(
-              "controllerchange",
-              () => {
-                logConsoleAndDb(
-                  "New service worker is now controlling the page",
-                );
-              },
-            );
-          });
-        if (!this.vapidKey) {
-          this.$notify(
-            {
-              group: "alert",
-              type: "danger",
-              title: "Error Setting Notifications",
-              text: "Could not set notifications.",
-            },
-            5000,
-          );
-          logConsoleAndDb(
-            "Error Setting Notifications: web push server response didn't have vapidKey: " +
-              responseData,
-            true,
-          );
-        }
-      }
-    } catch (error) {
-      if (window.location.host.startsWith("localhost")) {
-        logConsoleAndDb(
-          "Ignoring the error getting VAPID for local development.",
-        );
-      } else {
-        logConsoleAndDb(
-          "Got an error initializing notifications: " + JSON.stringify(error),
-          true,
-        );
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error Setting Notifications",
-            text: "Got an error setting notifications.",
-          },
-          5000,
-        );
-      }
-    }
-    // there may be a long pause here on first initialization
-    navigator.serviceWorker?.ready.then(() => {
-      this.serviceWorkerReady = true;
-    });
-
-    if (this.pushType === this.DIRECT_PUSH_TITLE) {
-      this.messageInput =
-        "Click to share some gratitude with the world -- even if they're unnamed.";
-      // focus on the message input
-      setTimeout(function () {
-        document.getElementById("push-message")?.focus();
-      }, 100);
-    } else {
-      // not critical but doesn't make sense in a daily check
-      this.messageInput = "";
-    }
-  }
-
-  private close() {
-    this.isVisible = false;
-  }
-
-  private sendMessageToServiceWorker(
-    message: ServiceWorkerMessage,
-  ): Promise<unknown> {
-    return new Promise((resolve, reject) => {
-      if (navigator.serviceWorker?.controller) {
-        const messageChannel = new MessageChannel();
-
-        messageChannel.port1.onmessage = (event: MessageEvent) => {
-          if (event.data.error) {
-            reject(event.data.error as ErrorResponse);
-          } else {
-            resolve(event.data as ServiceWorkerResponse);
-          }
-        };
-
-        navigator.serviceWorker?.controller.postMessage(message, [
-          messageChannel.port2,
-        ]);
-      } else {
-        reject("Service worker controller not available");
-      }
-    });
-  }
-
-  private async askPermission(): Promise<NotificationPermission> {
-    // console.log(
-    //   "Requesting permission for notifications: " + JSON.stringify(navigator),
-    // );
-    if (
-      !("serviceWorker" in navigator && navigator.serviceWorker?.controller)
-    ) {
-      return Promise.reject("Service worker not available.");
-    }
-
-    await secretDB.open();
-    const secret = (await secretDB.secret.get(MASTER_SECRET_KEY))?.secret;
-    if (!secret) {
-      return Promise.reject("No secret found.");
-    }
-
-    return this.sendSecretToServiceWorker(secret)
-      .then(() => this.checkNotificationSupport())
-      .then(() => this.requestNotificationPermission())
-      .catch((error) => Promise.reject(error));
-  }
-
-  private sendSecretToServiceWorker(secret: string): Promise<void> {
-    const message: ServiceWorkerMessage = {
-      type: "SEND_LOCAL_DATA",
-      data: secret,
-    };
-
-    return this.sendMessageToServiceWorker(message).then((response) => {
-      logConsoleAndDb(
-        "Response from service worker: " + JSON.stringify(response),
-      );
-    });
-  }
-
-  private checkNotificationSupport(): Promise<void> {
-    if (!("Notification" in window)) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Browser Notifications Are Not Supported",
-          text: "This browser does not support notifications.",
-        },
-        3000,
-      );
-      return Promise.reject("This browser does not support notifications.");
-    }
-    if (window.Notification.permission === "granted") {
-      return Promise.resolve();
-    }
-    return Promise.resolve();
-  }
-
-  private requestNotificationPermission(): Promise<NotificationPermission> {
-    return window.Notification.requestPermission().then(
-      (permission: string) => {
-        if (permission !== "granted") {
-          this.$notify(
-            {
-              group: "alert",
-              type: "danger",
-              title: "Error Requesting Notification Permission",
-              text:
-                "Allow this app permission to make notifications for personal reminders." +
-                " You can adjust them at any time in your settings.",
-            },
-            -1,
-          );
-          throw new Error("Permission was not granted to this app.");
-        }
-        return permission;
-      },
-    );
-  }
-
-  private checkHourInput() {
-    const hourNum = parseInt(this.hourInput);
-    if (isNaN(hourNum)) {
-      this.hourInput = "12";
-    } else if (hourNum < 1) {
-      this.hourInput = "12";
-      this.hourAm = !this.hourAm;
-    } else if (hourNum > 12) {
-      this.hourInput = "1";
-      this.hourAm = !this.hourAm;
-    } else {
-      this.hourInput = hourNum.toString();
-    }
-  }
-
-  private checkMinuteInput() {
-    const minuteNum = parseInt(this.minuteInput);
-    if (isNaN(minuteNum)) {
-      this.minuteInput = "00";
-    } else if (minuteNum < 0) {
-      this.minuteInput = "59";
-    } else if (minuteNum < 10) {
-      this.minuteInput = "0" + minuteNum;
-    } else if (minuteNum > 59) {
-      this.minuteInput = "00";
-    } else {
-      this.minuteInput = minuteNum.toString();
-    }
-  }
-
-  private async turnOnNotifications() {
-    let notifyCloser = () => {};
-    return this.askPermission()
-      .then((permission) => {
-        logConsoleAndDb("Permission granted: " + JSON.stringify(permission));
-
-        // Call the function and handle promises
-        return this.subscribeToPush();
-      })
-      .then(() => {
-        logConsoleAndDb("Subscribed successfully.");
-        return navigator.serviceWorker?.ready;
-      })
-      .then((registration) => {
-        return registration.pushManager.getSubscription();
-      })
-      .then(async (subscription) => {
-        if (subscription) {
-          notifyCloser = await this.$notify(
-            {
-              group: "alert",
-              type: "info",
-              title: "Notification Setup Underway",
-              text: "Setting up notifications for interesting activity, which takes about 10 seconds. If you don't see a final confirmation, check the 'Troubleshoot' page.",
-            },
-            -1,
-          );
-          // we already checked that this is a valid hour number
-          const rawHourNum = libsUtil.numberOrZero(this.hourInput);
-          const adjHourNum = this.hourAm
-            ? // If it's AM, then we'll change it to 0 for 12 AM but otherwise use rawHourNum
-              rawHourNum === 12
-              ? 0
-              : rawHourNum
-            : // Otherwise it's PM, so keep a 12 but otherwise add 12
-              rawHourNum === 12
-              ? 12
-              : rawHourNum + 12;
-          const hourNum = adjHourNum % 24; // probably unnecessary now
-          const utcHour =
-            hourNum + Math.round(new Date().getTimezoneOffset() / 60);
-          const finalUtcHour = (utcHour + (utcHour < 0 ? 24 : 0)) % 24;
-          const minuteNum = libsUtil.numberOrZero(this.minuteInput);
-          const utcMinute =
-            minuteNum + Math.round(new Date().getTimezoneOffset() % 60);
-          const finalUtcMinute = (utcMinute + (utcMinute < 0 ? 60 : 0)) % 60;
-
-          const subscriptionWithTime: PushSubscriptionWithTime = {
-            notifyTime: { utcHour: finalUtcHour, minute: finalUtcMinute },
-            notifyType: this.pushType,
-            message: this.messageInput,
-            ...subscription.toJSON(),
-          };
-          await this.sendSubscriptionToServer(subscriptionWithTime);
-          // To help investigate potential issues with this: https://firebase.google.com/docs/cloud-messaging/migrate-v1
-          logConsoleAndDb(
-            "Subscription data sent to server with endpoint: " +
-              subscription.endpoint,
-          );
-          return subscriptionWithTime;
-        } else {
-          throw new Error("Subscription object is not available.");
-        }
-      })
-      .then(async (subscription: PushSubscriptionWithTime) => {
-        logConsoleAndDb(
-          "Subscription data sent to server and all finished successfully.",
-        );
-        await libsUtil.sendTestThroughPushServer(subscription, true);
-        notifyCloser();
-        setTimeout(() => {
-          this.$notify(
-            {
-              group: "alert",
-              type: "success",
-              title: "Notification Is On",
-              text: "You should see at least one on your device; if not, check the 'Troubleshoot' link.",
-            },
-            7000,
-          );
-        }, 500);
-        const timeText =
-          // eslint-disable-next-line
-          this.hourInput + ":" + this.minuteInput + " " + (this.hourAm ? "AM" : "PM");
-        this.callback(true, timeText, this.messageInput);
-      })
-      .catch((error) => {
-        logConsoleAndDb(
-          "Got an error setting notification permissions: " +
-            " string " +
-            error.toString() +
-            " JSON " +
-            JSON.stringify(error),
-          true,
-        );
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error Setting Notification Permissions",
-            text: "Could not set notification permissions.",
-          },
-          3000,
-        );
-        // if we want to also unsubscribe, be sure to do that only if no other notification is active
-      });
-  }
-
-  private subscribeToPush(): Promise<void> {
-    return new Promise<void>((resolve, reject) => {
-      if (!("serviceWorker" in navigator && "PushManager" in window)) {
-        const errorMsg = "Push messaging is not supported";
-        console.warn(errorMsg);
-        return reject(new Error(errorMsg));
-      }
-
-      if (window.Notification.permission !== "granted") {
-        const errorMsg = "Notification permission not granted";
-        console.warn(errorMsg);
-        return reject(new Error(errorMsg));
-      }
-
-      const applicationServerKey = urlBase64ToUint8Array(this.vapidKey);
-      const options: PushSubscriptionOptions = {
-        userVisibleOnly: true,
-        applicationServerKey: applicationServerKey,
-      };
-
-      navigator.serviceWorker?.ready
-        .then((registration) => {
-          return registration.pushManager.subscribe(options);
-        })
-        .then((subscription) => {
-          logConsoleAndDb(
-            "Push subscription successful: " + JSON.stringify(subscription),
-          );
-          resolve();
-        })
-        .catch((error) => {
-          logConsoleAndDb(
-            "Push subscription failed: " +
-              JSON.stringify(error) +
-              " - " +
-              JSON.stringify(options),
-            true,
-          );
-
-          // Inform the user about the issue
-          this.$notify(
-            {
-              group: "alert",
-              type: "danger",
-              title: "Error Setting Push Notifications",
-              text:
-                "We encountered an issue setting up push notifications. " +
-                "If you wish to revoke notification permissions, please do so in your browser settings.",
-            },
-            -1,
-          );
-
-          reject(error);
-        });
-    });
-  }
-
-  private sendSubscriptionToServer(
-    subscription: PushSubscriptionWithTime,
-  ): Promise<void> {
-    logConsoleAndDb(
-      "About to send subscription... " + JSON.stringify(subscription),
-    );
-    return fetch("/web-push/subscribe", {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify(subscription),
-    }).then((response) => {
-      if (!response.ok) {
-        console.error("Bad response subscribing to web push: ", response);
-        throw new Error("Failed to send push subscription to server");
-      }
-      logConsoleAndDb("Push subscription sent to server successfully.");
-    });
-  }
-}
-</script>
-
-<style scoped>
-/* Add any specific styles for this component here */
-</style>

src/components/QuickNav.vue

@@ -11,11 +11,8 @@
           'text-slate-500': selected !== 'Home',
         }"
       >
-        <router-link :to="{ name: 'home' }" class="block text-center py-2 px-1">
-          <div class="flex flex-col items-center">
-            <fa icon="house-chimney" class="fa-fw" />
-            <span class="text-xs mt-1">feed</span>
-          </div>
+        <router-link :to="{ name: 'home' }" class="block text-center py-3 px-1">
+          <fa icon="house-chimney" class="fa-fw" />
         </router-link>
       </li>
       <!-- Search -->
@@ -29,12 +26,9 @@
       >
         <router-link
           :to="{ name: 'discover' }"
-          class="block text-center py-2 px-1"
+          class="block text-center py-3 px-1"
         >
-          <div class="flex flex-col items-center">
-            <fa icon="magnifying-glass" class="fa-fw" />
-            <span class="text-xs mt-1">search</span>
-          </div>
+          <fa icon="magnifying-glass" class="fa-fw" />
         </router-link>
       </li>
       <!-- Projects -->
@@ -48,12 +42,9 @@
       >
         <router-link
           :to="{ name: 'projects' }"
-          class="block text-center py-2 px-1"
+          class="block text-center py-3 px-1"
         >
-          <div class="flex flex-col items-center">
-            <fa icon="hand" class="fa-fw" />
-            <span class="text-xs mt-1">your work</span>
-          </div>
+          <fa icon="hand" class="fa-fw" />
         </router-link>
       </li>
       <!-- Contacts -->
@@ -67,12 +58,9 @@
       >
         <router-link
           :to="{ name: 'contacts' }"
-          class="block text-center py-2 px-1"
+          class="block text-center py-3 px-1"
         >
-          <div class="flex flex-col items-center">
-            <fa icon="users" class="fa-fw" />
-            <span class="text-xs mt-1">contacts</span>
-          </div>
+          <fa icon="users" class="fa-fw" />
         </router-link>
       </li>
       <!-- Profile -->
@@ -86,18 +74,9 @@
       >
         <router-link
           :to="{ name: 'account' }"
-          class="block text-center py-2 px-1"
+          class="block text-center py-3 px-1"
         >
-          <div class="flex flex-col items-center">
-            <fa icon="circle-user" class="fa-fw" />
-            <!--
-             We used to say "account", so we'll keep that in the code,
-             but it isn't accurate because we don't hold anything for them.
-             We'll say "profile" to the users.
-             (Or: settings, face, registry, cache, repo, vault... or separate preferences from identity.)
-            -->
-            <span class="text-xs mt-1">profile</span>
-          </div>
+          <fa icon="circle-user" class="fa-fw" />
         </router-link>
       </li>
     </ul>

src/components/TopMessage.vue

@@ -16,7 +16,8 @@
 import { Component, Vue, Prop } from "vue-facing-decorator";
 
 import { AppString, NotificationIface } from "@/constants/app";
-import { retrieveSettingsForActiveAccount } from "@/db/index";
+import { db } from "@/db/index";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 
 @Component
 export default class TopMessage extends Vue {
@@ -28,15 +29,17 @@ export default class TopMessage extends Vue {
 
   async mounted() {
     try {
-      const settings = await retrieveSettingsForActiveAccount();
+      await db.open();
+
+      const settings = await db.settings.get(MASTER_SETTINGS_KEY);
       if (
-        settings.warnIfTestServer &&
+        settings?.warnIfTestServer &&
         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;
       } else if (
-        settings.warnIfProdServer &&
+        settings?.warnIfProdServer &&
         settings.apiServer === AppString.PROD_ENDORSER_API_SERVER
       ) {
         const didPrefix = settings.activeDid?.slice(11, 15);

src/components/UserNameDialog.vue

@@ -1,10 +1,10 @@
-<!-- similar to ContactNameDialog -->
 <template>
   <div v-if="visible" class="dialog-overlay">
     <div class="dialog">
       <h1 class="text-xl font-bold text-center mb-4">Set Your Name</h1>
 
-      {{ sharingExplanation }}
+      Note that this is not sent to servers. It is only shared with people when
+      you choose to send it to them.
       <input
         type="text"
         placeholder="Name"
@@ -21,6 +21,7 @@
           >
             Save
           </button>
+          <!-- SHOW ME instead while processing saving changes -->
           <button
             type="button"
             class="block w-full text-center text-md uppercase bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md mb-2"
@@ -35,34 +36,25 @@
 </template>
 
 <script lang="ts">
-import { Vue, Component, Prop } from "vue-facing-decorator";
+import { Vue, Component } from "vue-facing-decorator";
 
 import { NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
-import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
+import { db } from "@/db/index";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
 
 @Component
 export default class UserNameDialog extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
-  @Prop({
-    default:
-      "This is not sent to servers. It is only shared with people when you send it to them.",
-  })
-  sharingExplanation!: string;
-  @Prop({ default: false }) callbackOnCancel!: boolean;
-
-  callback: (name?: string) => void = () => {};
+  callback: (string?) => void = () => {};
   givenName = "";
   visible = false;
 
-  /**
-   * @param aCallback - callback function for name, which may be ""
-   */
   async open(aCallback?: (name?: string) => void) {
     this.callback = aCallback || this.callback;
-    const settings = await retrieveSettingsForActiveAccount();
-    this.givenName = settings.firstName || "";
+    await db.open();
+    const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+    this.givenName = settings?.firstName || "";
     this.visible = true;
   }
 
@@ -76,16 +68,12 @@ export default class UserNameDialog extends Vue {
 
   onClickCancel() {
     this.visible = false;
-    if (this.callbackOnCancel) {
-      this.callback();
-    }
   }
 }
 </script>
 
 <style>
 .dialog-overlay {
-  z-index: 50;
   position: fixed;
   top: 0;
   left: 0;

src/components/World/components/objects/landmarks.js

@@ -3,7 +3,8 @@ import * as THREE from "three";
 import { GLTFLoader } from "three/addons/loaders/GLTFLoader";
 import * as SkeletonUtils from "three/addons/utils/SkeletonUtils";
 import * as TWEEN from "@tweenjs/tween.js";
-import { retrieveSettingsForActiveAccount } from "@/db";
+import { db } from "@/db";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import { getHeaders } from "@/libs/endorserServer";
 
 const ANIMATION_DURATION_SECS = 10;
@@ -13,9 +14,10 @@ export async function loadLandmarks(vue, world, scene, loop) {
   vue.setWorldProperty("animationDurationSeconds", ANIMATION_DURATION_SECS);
 
   try {
-    const settings = await retrieveSettingsForActiveAccount();
-    const activeDid = settings.activeDid || "";
-    const apiServer = settings.apiServer;
+    await db.open();
+    const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+    const activeDid = settings?.activeDid || "";
+    const apiServer = settings?.apiServer;
     const headers = await getHeaders(activeDid);
 
     const url = apiServer + "/api/v2/report/claims?claimType=GiveAction";

src/constants/app.ts

@@ -12,24 +12,17 @@ export enum AppString {
   TEST_ENDORSER_API_SERVER = "https://test-api.endorser.ch",
   LOCAL_ENDORSER_API_SERVER = "http://localhost:3000",
 
-  PROD_IMAGE_API_SERVER = "https://image-api.timesafari.app",
-  TEST_IMAGE_API_SERVER = "https://test-image-api.timesafari.app",
-  LOCAL_IMAGE_API_SERVER = "http://localhost:3001",
-
-  PROD_PARTNER_API_SERVER = "https://partner-api.endorser.ch",
-  TEST_PARTNER_API_SERVER = "https://test-partner-api.endorser.ch",
-  LOCAL_PARTNER_API_SERVER = LOCAL_ENDORSER_API_SERVER,
-
   PROD_PUSH_SERVER = "https://timesafari.app",
   TEST1_PUSH_SERVER = "https://test.timesafari.app",
   TEST2_PUSH_SERVER = "https://timesafari-pwa.anomalistlabs.com",
 
+  PROD_IMAGE_API_SERVER = "https://image-api.timesafari.app",
+  TEST_IMAGE_API_SERVER = "https://test-image-api.timesafari.app",
+  LOCAL_IMAGE_API_SERVER = "http://localhost:3001",
+
   NO_CONTACT_NAME = "(no name)",
 }
 
-export const APP_SERVER =
-  import.meta.env.VITE_APP_SERVER || "https://timesafari.app";
-
 export const DEFAULT_ENDORSER_API_SERVER =
   import.meta.env.VITE_DEFAULT_ENDORSER_API_SERVER ||
   AppString.TEST_ENDORSER_API_SERVER;
@@ -38,10 +31,6 @@ export const DEFAULT_IMAGE_API_SERVER =
   import.meta.env.VITE_DEFAULT_IMAGE_API_SERVER ||
   AppString.TEST_IMAGE_API_SERVER;
 
-export const DEFAULT_PARTNER_API_SERVER =
-  import.meta.env.VITE_DEFAULT_PARTNER_API_SERVER ||
-  AppString.TEST_PARTNER_API_SERVER;
-
 export const DEFAULT_PUSH_SERVER =
   window.location.protocol + "//" + window.location.host;
 
@@ -52,14 +41,13 @@ export const PASSKEYS_ENABLED =
 
 /**
  * The possible values for "group" and "type" are in App.vue.
- * Some of this comes from the notiwind package, some is custom.
+ * From the notiwind package
  */
 export interface NotificationIface {
   group: string; // "alert" | "modal"
   type: string; // "toast" | "info" | "success" | "warning" | "danger"
   title: string;
   text?: string;
-  callback?: (success: boolean) => Promise<void>; // if this triggered an action
   noText?: string;
   onCancel?: (stopAsking?: boolean) => Promise<void>;
   onNo?: (stopAsking?: boolean) => Promise<void>;

src/db/index.ts

@@ -1,11 +1,8 @@
 import BaseDexie, { Table } from "dexie";
 import { encrypted, Encryption } from "@pvermeer/dexie-encrypted-addon";
-import * as R from "ramda";
-
 import { Account, AccountsSchema } from "./tables/accounts";
 import { Contact, ContactSchema } from "./tables/contacts";
 import { Log, LogSchema } from "./tables/logs";
-import { MASTER_SECRET_KEY, Secret, SecretSchema } from "./tables/secret";
 import {
   MASTER_SETTINGS_KEY,
   Settings,
@@ -15,7 +12,6 @@ import { Temp, TempSchema } from "./tables/temp";
 import { DEFAULT_ENDORSER_API_SERVER } from "@/constants/app";
 
 // Define types for tables that hold sensitive and non-sensitive data
-type SecretTable = { secret: Table<Secret> };
 type SensitiveTables = { accounts: Table<Account> };
 type NonsensitiveTables = {
   contacts: Table<Contact>;
@@ -25,222 +21,39 @@ type NonsensitiveTables = {
 };
 
 // Using 'unknown' instead of 'any' for stricter typing and to avoid TypeScript warnings
-export type SecretDexie<T extends unknown = SecretTable> = BaseDexie & T;
 export type SensitiveDexie<T extends unknown = SensitiveTables> = BaseDexie & T;
 export type NonsensitiveDexie<T extends unknown = NonsensitiveTables> =
   BaseDexie & T;
 
-//// Initialize the DBs, starting with the sensitive ones.
-
-// Initialize Dexie database for secret, which is then used to encrypt accountsDB
-export const secretDB = new BaseDexie("TimeSafariSecret") as SecretDexie;
-secretDB.version(1).stores(SecretSchema);
-
-// Initialize Dexie database for accounts
-const accountsDexie = new BaseDexie("TimeSafariAccounts") as SensitiveDexie;
-
-// Instead of accountsDBPromise, use libs/util retrieveAccountMetadata or retrieveFullyDecryptedAccount
-// so that it's clear whether the usage needs the private key inside.
-//
-// This is a promise because the decryption key comes from IndexedDB
-// and someday it may come from a password or keystore or external wallet.
-// It's important that usages take into account that there may be a delay due
-// to a user action required to unlock the data.
-export const accountsDBPromise = useSecretAndInitializeAccountsDB(
-  secretDB,
-  accountsDexie,
-);
-
-//// Now initialize the other DB.
-
-// Initialize Dexie databases for non-sensitive data
+// Initialize Dexie databases for sensitive and non-sensitive data
+export const accountsDB = new BaseDexie("TimeSafariAccounts") as SensitiveDexie;
 export const db = new BaseDexie("TimeSafari") as NonsensitiveDexie;
 
-// Only the tables with index modifications need listing. https://dexie.org/docs/Tutorial/Design#database-versioning
+// Manage the encryption key. If not present in localStorage, create and store it.
+const secret =
+  localStorage.getItem("secret") || Encryption.createRandomEncryptionKey();
+if (!localStorage.getItem("secret")) localStorage.setItem("secret", secret);
 
+// Apply encryption to the sensitive database using the secret key
+encrypted(accountsDB, { secretKey: secret });
+
+// Define the schemas for our databases
+// Only the tables with index modifications need listing. https://dexie.org/docs/Tutorial/Design#database-versioning
+accountsDB.version(1).stores(AccountsSchema);
 // v1 also had contacts & settings
 // v2 added Log
 db.version(2).stores({
   ...ContactSchema,
   ...LogSchema,
-  ...{ settings: "id" }, // old Settings schema
+  ...SettingsSchema,
 });
 // v3 added Temp
 db.version(3).stores(TempSchema);
-db.version(4)
-  .stores(SettingsSchema)
-  .upgrade((tx) => {
-    return tx
-      .table("settings")
-      .toCollection()
-      .modify((settings) => {
-        settings.accountDid = ""; // make it non-null for the default master settings, but still indexable
-      });
-  });
-
-const DEFAULT_SETTINGS = {
-  id: MASTER_SETTINGS_KEY,
-  activeDid: undefined,
-  apiServer: DEFAULT_ENDORSER_API_SERVER,
-};
 
 // Event handler to initialize the non-sensitive database with default settings
 db.on("populate", async () => {
-  await db.settings.add(DEFAULT_SETTINGS);
+  await db.settings.add({
+    id: MASTER_SETTINGS_KEY,
+    apiServer: DEFAULT_ENDORSER_API_SERVER,
+  });
 });
-
-// Manage the encryption key.
-
-// It's not really secure to maintain the secret next to the user's data.
-// However, until we have better hooks into a real wallet or reliable secure
-// storage, we'll do this for user convenience. As they sign more records
-// and integrate with more people, they'll value it more and want to be more
-// secure, so we'll prompt them to take steps to back it up, properly encrypt,
-// etc. At the beginning, we'll prompt for a password, then we'll prompt for a
-// PWA so it's not in a browser... and then we hope to be integrated with a
-// real wallet or something else more secure.
-
-// One might ask: why encrypt at all? We figure a basic encryption is better
-// than none. Plus, we expect to support their own password or keystore or
-// external wallet as better signing options in the future, so it's gonna be
-// important to have the structure where each account access might require
-// user action.
-
-// (Once upon a time we stored the secret in localStorage, but it frequently
-// got erased, even though the IndexedDB still had the identity data. This
-// ended up throwing lots of errors to the user... and they'd end up in a state
-// where they couldn't take action because they couldn't unlock that identity.)
-
-// check for the secret in storage
-async function useSecretAndInitializeAccountsDB(
-  secretDB: SecretDexie,
-  accountsDB: SensitiveDexie,
-): Promise<SensitiveDexie> {
-  return secretDB
-    .open()
-    .then(() => {
-      return secretDB.secret.get(MASTER_SECRET_KEY);
-    })
-    .then((secretRow?: Secret) => {
-      let secret = secretRow?.secret;
-      if (secret != null) {
-        // they already have it in IndexedDB, so just pass it along
-        return secret;
-      } else {
-        // check localStorage (for users before v 0.3.37)
-        const localSecret = localStorage.getItem("secret");
-        if (localSecret != null) {
-          // they had one, so we want to move it to IndexedDB
-          secret = localSecret;
-        } else {
-          // they didn't have one, so let's generate one
-          secret = Encryption.createRandomEncryptionKey();
-        }
-        // it is not in IndexedDB, so add it now
-        return secretDB.secret
-          .add({ id: MASTER_SECRET_KEY, secret })
-          .then(() => {
-            return secret;
-          });
-      }
-    })
-    .then((secret?: string) => {
-      if (secret == null) {
-        throw new Error("No secret found or created.");
-      } else {
-        // apply encryption to the sensitive database using the secret key
-        encrypted(accountsDB, { secretKey: secret });
-        accountsDB.version(1).stores(AccountsSchema);
-        accountsDB.open();
-        return accountsDB;
-      }
-    })
-    .catch((error) => {
-      logConsoleAndDb("Error processing secret & encrypted accountsDB.", error);
-      // alert("There was an error processing encrypted data. See the Help page.");
-      throw error;
-    });
-}
-
-// retrieves default settings
-// calls db.open()
-export async function retrieveSettingsForDefaultAccount(): Promise<Settings> {
-  await db.open();
-  return (await db.settings.get(MASTER_SETTINGS_KEY)) || DEFAULT_SETTINGS;
-}
-
-export async function retrieveSettingsForActiveAccount(): Promise<Settings> {
-  const defaultSettings = await retrieveSettingsForDefaultAccount();
-  if (!defaultSettings.activeDid) {
-    return defaultSettings;
-  } else {
-    const overrideSettings =
-      (await db.settings
-        .where("accountDid")
-        .equals(defaultSettings.activeDid)
-        .first()) || {};
-    return R.mergeDeepRight(defaultSettings, overrideSettings);
-  }
-}
-
-// Update settings for the given account, or in MASTER_SETTINGS_KEY if no accountDid is provided.
-// Don't expose this because we should be explicit on whether we're updating the default settings or account settings.
-async function updateSettings(settingsChanges: Settings): Promise<void> {
-  await db.open();
-  if (!settingsChanges.accountDid) {
-    // ensure there is no "id" that would override the key
-    delete settingsChanges.id;
-    await db.settings.update(MASTER_SETTINGS_KEY, settingsChanges);
-  } else {
-    const result = await db.settings
-      .where("accountDid")
-      .equals(settingsChanges.accountDid)
-      .modify(settingsChanges);
-    if (result === 0) {
-      if (!settingsChanges.id) {
-        // It is unfortunate that we have to set this explicitly.
-        // We didn't make id a "++id" at the beginning and Dexie won't let us change it,
-        // plus we made our first settings objects MASTER_SETTINGS_KEY = 1 instead of 0
-        settingsChanges.id = (await db.settings.count()) + 1;
-      }
-      await db.settings.add(settingsChanges);
-    }
-  }
-}
-
-export async function updateDefaultSettings(settings: Settings): Promise<void> {
-  delete settings.accountDid; // just in case
-  await updateSettings(settings);
-}
-
-export async function updateAccountSettings(
-  accountDid: string,
-  settings: Settings,
-): Promise<void> {
-  settings.accountDid = accountDid;
-  await updateSettings(settings);
-}
-
-// similar method is in the sw_scripts/additional-scripts.js file
-export async function logConsoleAndDb(
-  message: string,
-  isError = false,
-): Promise<void> {
-  if (isError) {
-    console.error(`${new Date().toISOString()} ${message}`);
-  } else {
-    console.log(`${new Date().toISOString()} ${message}`);
-  }
-
-  await db.open();
-  const todayKey = new Date().toDateString();
-  // only keep one day's worth of logs
-  const previous = await db.logs.get(todayKey);
-  if (!previous) {
-    // when this is today's first log, clear out everything previous
-    await db.logs.clear();
-  }
-  const prevMessages = (previous && previous.message) || "";
-  const fullMessage = `${prevMessages}\n${new Date().toISOString()} ${message}`;
-  await db.logs.update(todayKey, { message: fullMessage });
-}

src/db/tables/README.md

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

src/db/tables/accounts.ts

@@ -5,7 +5,7 @@ export type Account = {
   /**
    * Auto-generated ID by Dexie
    */
-  id?: number; // this is only blank on input, when the database assigns it
+  id?: number;
 
   /**
    * The date the account was created
@@ -48,7 +48,7 @@ export type Account = {
 /**
  * Schema for the accounts table in the database.
  * Fields starting with a $ character are encrypted.
- * @see {@link https://github.com/PVermeer/dexie-addon-suite-monorepo/tree/master/packages/dexie-encrypted-addon#added-schema-syntax}
+ * @see {@link https://github.com/PVermeer/dexie-addon-suite-monorepo/tree/master/packages/dexie-encrypted-addon}
  */
 export const AccountsSchema = {
   accounts:

src/db/tables/contacts.ts

@@ -1,18 +1,7 @@
-export interface ContactMethod {
-  label: string;
-  type: string; // eg. "EMAIL", "SMS", "WHATSAPP", maybe someday "GOOGLE-CONTACT-API"
-  value: string;
-}
-
 export interface Contact {
-  //
-  // When adding a property, consider whether it should be added when exporting & sharing contacts.
-
   did: string;
-  contactMethods?: Array<ContactMethod>;
   name?: string;
   nextPubKeyHashB64?: string; // base64-encoded SHA256 hash of next public key
-  notes?: string;
   profileImageUrl?: string;
   publicKeyBase64?: string;
   seesMe?: boolean; // cached value of the server setting

src/db/tables/secret.ts

@@ -1,18 +0,0 @@
-/**
- * Represents an account stored in the database.
- */
-export type Secret = {
-  /**
-   * Auto-generated ID by Dexie
-   */
-  id: number;
-
-  /**
-   * The secret key used to decrypt the identity if they're not using their own password
-   */
-  secret: string;
-};
-
-export const SecretSchema = { secret: "++id, secret" };
-
-export const MASTER_SECRET_KEY = 0;

src/db/tables/settings.ts

@@ -12,42 +12,24 @@ export type BoundingBox = {
  * Settings type encompasses user-specific configuration details.
  */
 export type Settings = {
-  // default entry is keyed with MASTER_SETTINGS_KEY; other entries are linked to an account with account ID
-  id?: number; // this is erased for all those entries that are keyed with accountDid
+  id: number; // Only one entry, keyed with MASTER_SETTINGS_KEY
 
-  // if supplied, this settings record overrides the master record when the user switches to this account
-  accountDid?: string; // not used in the MASTER_SETTINGS_KEY entry
-  // active Decentralized ID
-  activeDid?: string; // only used in the MASTER_SETTINGS_KEY entry
-
-  apiServer: string; // API server URL
+  activeDid?: string; // Active Decentralized ID
+  apiServer?: string; // API server URL
 
   filterFeedByNearby?: boolean; // filter by nearby
   filterFeedByVisible?: boolean; // filter by visible users ie. anyone not hidden
-  finishedOnboarding?: boolean; // the user has completed the onboarding process
 
-  firstName?: string; // user's full name, may be null if unwanted for a particular account
+  firstName?: string; // user's full name
   hideRegisterPromptOnNewContact?: boolean;
   isRegistered?: boolean;
-  // imageServer?: string; // if we want to allow modification then we should make image functionality optional -- or at least customizable
   lastName?: string; // deprecated - put all names in firstName
-
-  lastAckedOfferToUserJwtId?: string; // the last JWT ID for offer-to-user that they've acknowledged seeing
-  lastAckedOfferToUserProjectsJwtId?: string; // the last JWT ID for offers-to-user's-projects that they've acknowledged seeing
-
-  // The claim list has a most recent one used in notifications that's separate from the last viewed
   lastNotifiedClaimId?: string;
   lastViewedClaimId?: string;
-
-  notifyingNewActivityTime?: string; // set to their chosen time if they have turned on daily check for new activity via the push server
-  notifyingReminderMessage?: string; // set to their chosen message for a daily reminder
-  notifyingReminderTime?: string; // set to their chosen time for a daily reminder
-
-  partnerApiServer?: string; // partner server API URL
-
   passkeyExpirationMinutes?: number; // passkey access token time-to-live in minutes
-
-  profileImageUrl?: string; // may be null if unwanted for a particular account
+  profileImageUrl?: string;
+  reminderTime?: number; // Time in milliseconds since UNIX epoch for reminders
+  reminderOn?: boolean; // Toggle to enable or disable reminders
 
   // Array of named search boxes defined by bounding boxes
   searchBoxes?: Array<{
@@ -64,7 +46,7 @@ export type Settings = {
   webPushServer?: string; // Web Push server URL
 };
 
-export function checkIsAnyFeedFilterOn(settings: Settings): boolean {
+export function isAnyFeedFilterOn(settings: Settings): boolean {
   return !!(settings?.filterFeedByNearby || settings?.filterFeedByVisible);
 }
 
@@ -72,7 +54,7 @@ export function checkIsAnyFeedFilterOn(settings: Settings): boolean {
  * Schema for the Settings table in the database.
  */
 export const SettingsSchema = {
-  settings: "id, &accountDid",
+  settings: "id",
 };
 
 /**

src/db/tables/temp.ts

@@ -9,4 +9,6 @@ export type Temp = {
 /**
  * Schema for the Temp table in the database.
  */
-export const TempSchema = { temp: "id" };
+export const TempSchema = {
+  temp: "id",
+};

src/libs/crypto/index.ts

@@ -5,12 +5,11 @@ import { wordlist } from "ethereum-cryptography/bip39/wordlists/english";
 import { HDNode } from "@ethersproject/hdnode";
 
 import {
-  CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI,
   createEndorserJwtForDid,
-  CONTACT_URL_PATH_ENDORSER_CH_OLD,
-  CONTACT_IMPORT_ONE_URL_PATH_TIME_SAFARI,
+  ENDORSER_JWT_URL_LOCATION,
 } from "@/libs/endorserServer";
 import { DEFAULT_DID_PROVIDER_NAME } from "../veramo/setup";
+import { decodeEndorserJwt } from "@/libs/crypto/vc";
 
 export const DEFAULT_ROOT_DERIVATION_PATH = "m/84737769'/0'/0'/0'";
 
@@ -52,7 +51,7 @@ export const newIdentifier = (
  *
  *
  * @param {string} mnemonic
- * @return {[string, string, string, string]} address, privateHex, publicHex, derivationPath
+ * @return {*}  {[string, string, string, string]}
  */
 export const deriveAddress = (
   mnemonic: string,
@@ -88,8 +87,7 @@ export const generateSeed = (): string => {
 /**
  * Retrieve an access token, or "" if no DID is provided.
  *
- * @param {string} did
- * @return {string} JWT with basic payload
+ * @return {*}
  */
 export const accessToken = async (did?: string) => {
   if (did) {
@@ -103,34 +101,24 @@ export const accessToken = async (did?: string) => {
 };
 
 /**
- @return payload of JWT pulled out of any recognized URL path (if any)
+ @return results of uportJwtPayload:
+ { iat: number, iss: string (DID), own: { name, publicEncKey (base64-encoded key) } }
+
+ Note that similar code is also contained in time-safari
  */
-export const getContactJwtFromJwtUrl = (jwtUrlText: string) => {
+export const getContactPayloadFromJwtUrl = (jwtUrlText: string) => {
   let jwtText = jwtUrlText;
-  const appImportConfirmUrlLoc = jwtText.indexOf(
-    CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI,
-  );
-  if (appImportConfirmUrlLoc > -1) {
+  const endorserContextLoc = jwtText.indexOf(ENDORSER_JWT_URL_LOCATION);
+  if (endorserContextLoc > -1) {
     jwtText = jwtText.substring(
-      appImportConfirmUrlLoc +
-        CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI.length,
+      endorserContextLoc + ENDORSER_JWT_URL_LOCATION.length,
     );
   }
-  const appImportOneUrlLoc = jwtText.indexOf(
-    CONTACT_IMPORT_ONE_URL_PATH_TIME_SAFARI,
-  );
-  if (appImportOneUrlLoc > -1) {
-    jwtText = jwtText.substring(
-      appImportOneUrlLoc + CONTACT_IMPORT_ONE_URL_PATH_TIME_SAFARI.length,
-    );
-  }
-  const endorserUrlPathLoc = jwtText.indexOf(CONTACT_URL_PATH_ENDORSER_CH_OLD);
-  if (endorserUrlPathLoc > -1) {
-    jwtText = jwtText.substring(
-      endorserUrlPathLoc + CONTACT_URL_PATH_ENDORSER_CH_OLD.length,
-    );
-  }
-  return jwtText;
+
+  // JWT format: { header, payload, signature, data }
+  const jwt = decodeEndorserJwt(jwtText);
+
+  return jwt.payload;
 };
 
 export const nextDerivationPath = (origDerivPath: string) => {
@@ -148,156 +136,3 @@ export const nextDerivationPath = (origDerivPath: string) => {
     .join("/");
   return newDerivPath;
 };
-
-// Base64 encoding/decoding utilities for browser
-function base64ToArrayBuffer(base64: string): Uint8Array {
-  const binaryString = atob(base64);
-  const bytes = new Uint8Array(binaryString.length);
-  for (let i = 0; i < binaryString.length; i++) {
-    bytes[i] = binaryString.charCodeAt(i);
-  }
-  return bytes;
-}
-
-function arrayBufferToBase64(buffer: ArrayBuffer): string {
-  const binary = String.fromCharCode(...new Uint8Array(buffer));
-  return btoa(binary);
-}
-
-const SALT_LENGTH = 16;
-const IV_LENGTH = 12;
-const KEY_LENGTH = 256;
-const ITERATIONS = 100000;
-
-// Encryption helper function
-export async function encryptMessage(message: string, password: string) {
-  const encoder = new TextEncoder();
-  const salt = crypto.getRandomValues(new Uint8Array(SALT_LENGTH));
-  const iv = crypto.getRandomValues(new Uint8Array(IV_LENGTH));
-
-  // Derive key from password using PBKDF2
-  const keyMaterial = await crypto.subtle.importKey(
-    "raw",
-    encoder.encode(password),
-    "PBKDF2",
-    false,
-    ["deriveBits", "deriveKey"],
-  );
-
-  const key = await crypto.subtle.deriveKey(
-    {
-      name: "PBKDF2",
-      salt,
-      iterations: ITERATIONS,
-      hash: "SHA-256",
-    },
-    keyMaterial,
-    { name: "AES-GCM", length: KEY_LENGTH },
-    false,
-    ["encrypt"],
-  );
-
-  // Encrypt the message
-  const encryptedContent = await crypto.subtle.encrypt(
-    {
-      name: "AES-GCM",
-      iv,
-    },
-    key,
-    encoder.encode(message),
-  );
-
-  // Return a JSON structure with base64-encoded components
-  const result = {
-    salt: arrayBufferToBase64(salt),
-    iv: arrayBufferToBase64(iv),
-    encrypted: arrayBufferToBase64(encryptedContent),
-  };
-
-  return btoa(JSON.stringify(result));
-}
-
-// Decryption helper function
-export async function decryptMessage(encryptedJson: string, password: string) {
-  const decoder = new TextDecoder();
-  const { salt, iv, encrypted } = JSON.parse(atob(encryptedJson));
-
-  // Convert base64 components back to Uint8Arrays
-  const saltArray = base64ToArrayBuffer(salt);
-  const ivArray = base64ToArrayBuffer(iv);
-  const encryptedContent = base64ToArrayBuffer(encrypted);
-
-  // Derive the same key using PBKDF2 with the extracted salt
-  const keyMaterial = await crypto.subtle.importKey(
-    "raw",
-    new TextEncoder().encode(password),
-    "PBKDF2",
-    false,
-    ["deriveBits", "deriveKey"],
-  );
-
-  const key = await crypto.subtle.deriveKey(
-    {
-      name: "PBKDF2",
-      salt: saltArray,
-      iterations: ITERATIONS,
-      hash: "SHA-256",
-    },
-    keyMaterial,
-    { name: "AES-GCM", length: KEY_LENGTH },
-    false,
-    ["decrypt"],
-  );
-
-  // Decrypt the content
-  const decryptedContent = await crypto.subtle.decrypt(
-    {
-      name: "AES-GCM",
-      iv: ivArray,
-    },
-    key,
-    encryptedContent,
-  );
-
-  // Convert the decrypted content back to a string
-  return decoder.decode(decryptedContent);
-}
-
-// Test function to verify encryption/decryption
-export async function testEncryptionDecryption() {
-  try {
-    const testMessage = "Hello, this is a test message! 🚀";
-    const testPassword = "myTestPassword123";
-
-    console.log("Original message:", testMessage);
-
-    // Test encryption
-    console.log("Encrypting...");
-    const encrypted = await encryptMessage(testMessage, testPassword);
-    console.log("Encrypted result:", encrypted);
-
-    // Test decryption
-    console.log("Decrypting...");
-    const decrypted = await decryptMessage(encrypted, testPassword);
-    console.log("Decrypted result:", decrypted);
-
-    // Verify
-    const success = testMessage === decrypted;
-    console.log("Test " + (success ? "PASSED ✅" : "FAILED ❌"));
-    console.log("Messages match:", success);
-
-    // Test with wrong password
-    console.log("\nTesting with wrong password...");
-    try {
-      await decryptMessage(encrypted, "wrongPassword");
-      console.log("Should not reach here");
-    } catch (error) {
-      console.log("Correctly failed with wrong password ✅");
-    }
-
-    return success;
-  } catch (error) {
-    console.error("Test failed with error:", error);
-    return false;
-  }
-}

src/libs/crypto/vc/did-eth-local-resolver.ts

@@ -1,46 +0,0 @@
-/**
- * This did:ethr resolver instructs the did-jwt machinery to use the
- * EcdsaSecp256k1RecoveryMethod2020Uses verification method which adds the recovery bit to the
- * signature to recover the DID's public key from a signature.
- *
- * This effectively hard codes the did:ethr DID resolver to use the address as the public key.
- * @param did : string
- * @returns {Promise<DIDResolutionResult>}
- *
- * Similar code resides in endorser-ch and image-api
- */
-export const didEthLocalResolver = async (did: string) => {
-  const didRegex = /^did:ethr:(0x[0-9a-fA-F]{40})$/;
-  const match = did.match(didRegex);
-
-  if (match) {
-    const address = match[1]; // Extract eth address: 0x...
-    const publicKeyHex = address; // Use the address directly as a public key placeholder
-
-    return {
-      didDocumentMetadata: {},
-      didResolutionMetadata: {
-        contentType: "application/did+ld+json",
-      },
-      didDocument: {
-        "@context": [
-          "https://www.w3.org/ns/did/v1",
-          "https://w3id.org/security/suites/secp256k1recovery-2020/v2",
-        ],
-        id: did,
-        verificationMethod: [
-          {
-            id: `${did}#controller`,
-            type: "EcdsaSecp256k1RecoveryMethod2020",
-            controller: did,
-            blockchainAccountId: "eip155:1:" + publicKeyHex,
-          },
-        ],
-        authentication: [`${did}#controller`],
-        assertionMethod: [`${did}#controller`],
-      },
-    };
-  }
-
-  throw new Error(`Unsupported DID format: ${did}`);
-};

src/libs/crypto/vc/index.ts

@@ -6,21 +6,14 @@
  *
  */
 
-import { Buffer } from "buffer/";
 import * as didJwt from "did-jwt";
-import { JWTVerified } from "did-jwt";
-import { Resolver } from "did-resolver";
+import { JWTDecoded } from "did-jwt/lib/JWT";
 import { IIdentifier } from "@veramo/core";
 import * as u8a from "uint8arrays";
 
-import { didEthLocalResolver } from "./did-eth-local-resolver";
-import { PEER_DID_PREFIX, verifyPeerSignature } from "./didPeer";
-import { base64urlDecodeString, createDidPeerJwt } from "./passkeyDidPeer";
-import { urlBase64ToUint8Array } from "./util";
+import { createDidPeerJwt } from "@/libs/crypto/vc/passkeyDidPeer";
 
 export const ETHR_DID_PREFIX = "did:ethr:";
-export const JWT_VERIFY_FAILED_CODE = "JWT_VERIFY_FAILED";
-export const UNSUPPORTED_DID_METHOD_CODE = "UNSUPPORTED_DID_METHOD";
 
 /**
  * Meta info about a key
@@ -40,8 +33,6 @@ export interface KeyMeta {
   passkeyCredIdHex?: string;
 }
 
-const ethLocalResolver = new Resolver({ ethr: didEthLocalResolver });
-
 /**
  * Tell whether a key is from a passkey
  * @param keyMeta contains info about the key, whose passkeyCredIdHex determines if the key is from a passkey
@@ -53,23 +44,16 @@ export function isFromPasskey(keyMeta?: KeyMeta): boolean {
 export async function createEndorserJwtForKey(
   account: KeyMeta,
   payload: object,
-  expiresIn?: number,
 ) {
   if (account?.identity) {
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     const identity: IIdentifier = JSON.parse(account.identity!);
     const privateKeyHex = identity.keys[0].privateKeyHex;
     const signer = await SimpleSigner(privateKeyHex as string);
-    const options = {
-      // alg: "ES256K", // "K" is the default, "K-R" is used by the server in tests
+    return didJwt.createJWT(payload, {
       issuer: account.did,
       signer: signer,
-      expiresIn: undefined as number | undefined,
-    };
-    if (expiresIn) {
-      options.expiresIn = expiresIn;
-    }
-    return didJwt.createJWT(payload, options);
+    });
   } else if (account?.passkeyCredIdHex) {
     return createDidPeerJwt(account.did, account.passkeyCredIdHex, payload);
   } else {
@@ -123,79 +107,6 @@ function bytesToHex(b: Uint8Array): string {
   return u8a.toString(b, "base16");
 }
 
-// We should be calling 'verify' in more places, showing warnings if it fails.
-// @returns JWTDecoded with { header: JWTHeader, payload: any, signature: string, data: string } (but doesn't verify the signature)
-export function decodeEndorserJwt(jwt: string) {
+export function decodeEndorserJwt(jwt: string): JWTDecoded {
   return didJwt.decodeJWT(jwt);
 }
-
-// return Promise of at least { issuer, payload, verified boolean }
-// ... and also if successfully verified by did-jwt (not JWANT): data, doc, signature, signer
-export async function decodeAndVerifyJwt(
-  jwt: string,
-): Promise<Omit<JWTVerified, "didResolutionResult" | "signer" | "jwt">> {
-  const pieces = jwt.split(".");
-  const header = JSON.parse(base64urlDecodeString(pieces[0]));
-  const payload = JSON.parse(base64urlDecodeString(pieces[1]));
-  const issuerDid = payload.iss;
-  if (!issuerDid) {
-    return Promise.reject({
-      clientError: {
-        message: `Missing "iss" field in JWT.`,
-      },
-    });
-  }
-
-  if (issuerDid.startsWith(ETHR_DID_PREFIX)) {
-    try {
-      const verified = await didJwt.verifyJWT(jwt, {
-        resolver: ethLocalResolver,
-      });
-      return verified;
-    } catch (e: unknown) {
-      return Promise.reject({
-        clientError: {
-          // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-          // @ts-expect-error
-          message: `JWT failed verification: ` + e.toString(),
-          code: JWT_VERIFY_FAILED_CODE,
-        },
-      });
-    }
-  }
-
-  if (issuerDid.startsWith(PEER_DID_PREFIX) && header.typ === "JWANT") {
-    const verified = await verifyPeerSignature(
-      Buffer.from(payload),
-      issuerDid,
-      urlBase64ToUint8Array(pieces[2]),
-    );
-    if (!verified) {
-      return Promise.reject({
-        clientError: {
-          // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-          // @ts-expect-error
-          message: `JWT failed verification: ` + e.toString(),
-          code: JWT_VERIFY_FAILED_CODE,
-        },
-      });
-    } else {
-      return { issuer: issuerDid, payload: payload, verified: true };
-    }
-  }
-
-  if (issuerDid.startsWith(PEER_DID_PREFIX)) {
-    return Promise.reject({
-      clientError: {
-        message: `JWT with a PEER DID currently only supported with typ == JWANT. Contact us us for JWT suport since it should be straightforward.`,
-      },
-    });
-  }
-
-  return Promise.reject({
-    clientError: {
-      message: `Unsupported DID method ${issuerDid}`,
-      code: UNSUPPORTED_DID_METHOD_CODE,
-    },
-  });
-}

src/libs/crypto/vc/passkeyDidPeer.ts

@@ -470,18 +470,8 @@ ${pubKeyBuffer.toString("base64")}
   return pem;
 }
 
-// tried the base64url library but got an error using their Buffer
-export function base64urlDecodeString(input: string) {
-  return atob(input.replace(/-/g, "+").replace(/_/g, "/"));
-}
-
-// tried the base64url library but got an error using their Buffer
-export function base64urlEncodeString(input: string) {
-  return btoa(input).replace(/\+/g, "-").replace(/\//g, "_").replace(/=+$/, "");
-}
-
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-function base64urlDecodeArrayBuffer(input: string) {
+function base64urlDecode(input: string) {
   input = input.replace(/-/g, "+").replace(/_/g, "/");
   const pad = input.length % 4 === 0 ? "" : "====".slice(input.length % 4);
   const str = atob(input + pad);
@@ -493,9 +483,9 @@ function base64urlDecodeArrayBuffer(input: string) {
 }
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-function base64urlEncodeArrayBuffer(buffer: ArrayBuffer) {
+function base64urlEncode(buffer: ArrayBuffer) {
   const str = String.fromCharCode(...new Uint8Array(buffer));
-  return base64urlEncodeString(str);
+  return btoa(str).replace(/\+/g, "-").replace(/\//g, "_").replace(/=+$/, "");
 }
 
 // from @simplewebauthn/browser

src/libs/crypto/vc/util.ts

@@ -1,11 +0,0 @@
-export function urlBase64ToUint8Array(base64String: string): Uint8Array {
-  const padding = "=".repeat((4 - (base64String.length % 4)) % 4);
-  const base64 = (base64String + padding).replace(/-/g, "+").replace(/_/g, "/");
-  const rawData = window.atob(base64);
-  const outputArray = new Uint8Array(rawData.length);
-
-  for (let i = 0; i < rawData.length; ++i) {
-    outputArray[i] = rawData.charCodeAt(i);
-  }
-  return outputArray;
-}

src/libs/endorserServer.ts

@@ -4,20 +4,11 @@ import { sha256 } from "ethereum-cryptography/sha256";
 import { LRUCache } from "lru-cache";
 import * as R from "ramda";
 
-import {
-  APP_SERVER,
-  DEFAULT_IMAGE_API_SERVER,
-  NotificationIface,
-} from "@/constants/app";
+import { DEFAULT_IMAGE_API_SERVER } from "@/constants/app";
 import { Contact } from "@/db/tables/contacts";
 import { accessToken, deriveAddress, nextDerivationPath } from "@/libs/crypto";
-import { logConsoleAndDb, NonsensitiveDexie } from "@/db/index";
-import {
-  retrieveAccountMetadata,
-  retrieveFullyDecryptedAccount,
-  getPasskeyExpirationSeconds,
-  GiverReceiverInputInfo,
-} from "@/libs/util";
+import { NonsensitiveDexie } from "@/db/index";
+import { getAccount, getPasskeyExpirationSeconds } from "@/libs/util";
 import { createEndorserJwtForKey, KeyMeta } from "@/libs/crypto/vc";
 import { Account } from "@/db/tables/accounts";
 
@@ -26,14 +17,10 @@ export const SCHEMA_ORG_CONTEXT = "https://schema.org";
 export const SERVICE_ID = "endorser.ch";
 // the header line for contacts exported via Endorser Mobile
 export const CONTACT_CSV_HEADER = "name,did,pubKeyBase64,seesMe,registered";
-// the suffix for the contact URL in this app where they are confirmed before import
-export const CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI = "/contact-import/";
-// the suffix for the contact URL in this app where a single one gets imported automatically
-export const CONTACT_IMPORT_ONE_URL_PATH_TIME_SAFARI = "/contacts?contactJwt=";
-// the suffix for the old contact URL -- deprecated Jan 2025, though "endorser.ch/contact?jwt=" shows data on endorser.ch server
-export const CONTACT_URL_PATH_ENDORSER_CH_OLD = "/contact?jwt=";
-// unused now that we match on the URL path; just note that it was used for a while to create URLs that showed at endorser.ch
-//export const CONTACT_URL_PREFIX_ENDORSER_CH_OLD = "https://endorser.ch";
+// the prefix for the contact URL
+export const CONTACT_URL_PREFIX = "https://endorser.ch";
+// the suffix for the contact URL
+export const ENDORSER_JWT_URL_LOCATION = "/contact?jwt=";
 // the prefix for handle IDs, the permanent ID for claims on Endorser
 export const ENDORSER_CH_HANDLE_PREFIX = "https://endorser.ch/entity/";
 
@@ -45,6 +32,11 @@ export interface AgreeVerifiableCredential {
   object: Record<string, any>;
 }
 
+export interface GiverReceiverInputInfo {
+  did?: string;
+  name?: string;
+}
+
 export interface GiverOutputInfo {
   action: string;
   giver?: GiverReceiverInputInfo;
@@ -58,7 +50,6 @@ export interface ClaimResult {
   error: { code: string; message: string };
 }
 
-// similar to VerifiableCredentialSubject... maybe rename this
 export interface GenericVerifiableCredential {
   "@context"?: string; // optional when embedded, eg. in an Agree
   "@type": string;
@@ -66,6 +57,8 @@ export interface GenericVerifiableCredential {
 }
 
 export interface GenericCredWrapper<T extends GenericVerifiableCredential> {
+  "@context": string;
+  "@type": string;
   claim: T;
   claimType?: string;
   handleId: string;
@@ -76,6 +69,8 @@ export interface GenericCredWrapper<T extends GenericVerifiableCredential> {
 }
 export const BLANK_GENERIC_SERVER_RECORD: GenericCredWrapper<GenericVerifiableCredential> =
   {
+    "@context": SCHEMA_ORG_CONTEXT,
+    "@type": "",
     claim: { "@type": "" },
     handleId: "",
     id: "",
@@ -90,14 +85,11 @@ export interface GiveSummaryRecord {
   amountConfirmed: number;
   description: string;
   fullClaim: GiveVerifiableCredential;
-  fulfillsHandleId: string;
-  fulfillsPlanHandleId?: string;
-  fulfillsType?: string;
+  fulfillsPlanHandleId: string;
   handleId: string;
   issuedAt: string;
   issuerDid: string;
   jwtId: string;
-  providerPlanHandleId?: string;
   recipientDid: string;
   unit: string;
 }
@@ -121,10 +113,6 @@ export interface OfferSummaryRecord {
   validThrough: string;
 }
 
-export interface OfferToPlanSummaryRecord extends OfferSummaryRecord {
-  planName: string;
-}
-
 // a summary record; the VC is not currently part of this record
 export interface PlanSummaryRecord {
   agentDid?: string; // optional, if the issuer wants someone else to manage as well
@@ -152,7 +140,6 @@ export interface GiveVerifiableCredential extends GenericVerifiableCredential {
   identifier?: string;
   image?: string;
   object?: { amountOfThisGood: number; unitCode: string };
-  provider?: GenericVerifiableCredential; // typically @type & identifier
   recipient?: { identifier: string };
 }
 
@@ -191,9 +178,13 @@ export interface PlanVerifiableCredential extends GenericVerifiableCredential {
  * Represents data about a project
  *
  * @deprecated
- * (Maybe we should use PlanSummaryRecord instead, either by adding rowId or by iterating with jwtId.)
+ * We should use PlanSummaryRecord instead.
  **/
 export interface PlanData {
+  /**
+   * Name of the project
+   **/
+  name: string;
   /**
    * Description of the project
    **/
@@ -208,14 +199,9 @@ export interface PlanData {
    */
   issuerDid: string;
   /**
-   * Name of the project
+   * The identifier of the project -- different from jwtId, needs to be fixed
    **/
-  name: string;
-  /**
-   * The identifier of the project record -- different from jwtId
-   * (Maybe we should use the jwtId to iterate through the records instead.)
-   **/
-  rowId?: string;
+  rowid?: string;
 }
 
 export interface EndorserRateLimits {
@@ -234,21 +220,11 @@ export interface ImageRateLimits {
 }
 
 export interface VerifiableCredential {
-  exp?: number;
-  iat: number;
-  iss: string;
-  vc: {
-    "@context": string[];
-    type: string[];
-    credentialSubject: VerifiableCredentialSubject;
-  };
-}
-
-// similar to GenericVerifiableCredential... maybe replace that one
-export interface VerifiableCredentialSubject {
   "@context": string;
   "@type": string;
-  [key: string]: any; // eslint-disable-line @typescript-eslint/no-explicit-any
+  name: string;
+  description: string;
+  identifier?: string;
 }
 
 export interface WorldProperties {
@@ -256,14 +232,12 @@ export interface WorldProperties {
   endTime?: string;
 }
 
-// AKA Registration & RegisterAction
 export interface RegisterVerifiableCredential {
-  "@context": typeof SCHEMA_ORG_CONTEXT;
-  "@type": "RegisterAction";
+  "@context": string;
+  "@type": string;
   agent: { identifier: string };
-  identifier?: string; // used for invites (when participant ID isn't known)
   object: string;
-  participant?: { identifier: string }; // used when person is known (not an invite)
+  participant: { identifier: string };
 }
 
 // now for some of the error & other wrapper types
@@ -295,19 +269,6 @@ export interface ErrorResult extends ResultWithType {
 
 export type CreateAndSubmitClaimResult = SuccessResult | ErrorResult;
 
-/**
- * This is similar to Contact but it grew up in different logic paths.
- * We may want to change this to be a Contact.
- */
-export interface UserInfo {
-  did: string;
-  name: string;
-  publicEncKey: string;
-  registered: boolean;
-  profileImageUrl?: string;
-  nextPublicEncKeyHash?: string;
-}
-
 // This is used to check for hidden info.
 // See https://github.com/trentlarson/endorser-ch/blob/0cb626f803028e7d9c67f095858a9fc8542e3dbd/server/api/services/util.js#L6
 const HIDDEN_DID = "did:none:HIDDEN";
@@ -451,7 +412,6 @@ export function didInfoForContact(
   activeDid: string | undefined,
   contact?: Contact,
   allMyDids: string[] = [],
-  showDidForVisible: boolean = false,
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
 ): { known: boolean; displayName: string; profileImageUrl?: string } {
   if (!did) return { displayName: "Someone Unnamed/Unknown", known: false };
@@ -460,7 +420,7 @@ export function didInfoForContact(
   } else if (contact) {
     return {
       displayName: contact.name || "Contact With No Name",
-      known: true,
+      known: !!contact,
       profileImageUrl: contact.profileImageUrl,
     };
   } else {
@@ -468,29 +428,14 @@ export function didInfoForContact(
     return myId
       ? { displayName: "You (Alt ID)", known: true }
       : isHiddenDid(did)
-        ? { displayName: "Someone Outside Your View", known: false }
+        ? { displayName: "Someone Totally Outside Your View", known: false }
         : {
-            displayName: showDidForVisible
-              ? did
-              : "Someone Visible But Not In Your Contact List",
+            displayName: "Someone Visible But Outside Your Contact List",
             known: false,
           };
   }
 }
 
-/**
- * @returns full contact info object (never undefined), where did is searched in contacts and allMyDids
- */
-export function didInfoObject(
-  did: string | undefined,
-  activeDid: string | undefined,
-  allMyDids: string[],
-  contacts: Contact[],
-): { known: boolean; displayName: string; profileImageUrl?: string } {
-  const contact = contactForDid(did, contacts);
-  return didInfoForContact(did, activeDid, contact, allMyDids);
-}
-
 /**
  always returns text, maybe something like "unnamed" or "unknown"
 
@@ -506,22 +451,6 @@ export function didInfo(
   return didInfoForContact(did, activeDid, contact, allMyDids).displayName;
 }
 
-/**
- * return text description without any references to "you" as user
- */
-export function didInfoForCertificate(
-  did: string | undefined,
-  contacts: Contact[],
-): string {
-  return didInfoForContact(
-    did,
-    undefined,
-    contactForDid(did, contacts),
-    [],
-    true,
-  ).displayName;
-}
-
 let passkeyAccessToken: string = "";
 let passkeyTokenExpirationEpochSeconds: number = 0;
 
@@ -547,72 +476,35 @@ export function tokenExpiryTimeDescription() {
 /**
  * Get the headers for a request, potentially including Authorization
  */
-export async function getHeaders(
-  did?: string,
-  $notify?: (notification: NotificationIface, timeout?: number) => void,
-  failureMessage?: string,
-) {
+export async function getHeaders(did?: string) {
   const headers: { "Content-Type": string; Authorization?: string } = {
     "Content-Type": "application/json",
   };
   if (did) {
-    try {
-      let token;
-      const account = await retrieveAccountMetadata(did);
-      if (account?.passkeyCredIdHex) {
-        if (
-          passkeyAccessToken &&
-          passkeyTokenExpirationEpochSeconds > Date.now() / 1000
-        ) {
-          // there's an active current passkey token
-          token = passkeyAccessToken;
-        } else {
-          // there's no current passkey token or it's expired
-          token = await accessToken(did);
-
-          passkeyAccessToken = token;
-          const passkeyExpirationSeconds = await getPasskeyExpirationSeconds();
-          passkeyTokenExpirationEpochSeconds =
-            Date.now() / 1000 + passkeyExpirationSeconds;
-        }
+    let token;
+    const account = await getAccount(did);
+    if (account?.passkeyCredIdHex) {
+      if (
+        passkeyAccessToken &&
+        passkeyTokenExpirationEpochSeconds > Date.now() / 1000
+      ) {
+        // there's an active current passkey token
+        token = passkeyAccessToken;
       } else {
+        // there's no current passkey token or it's expired
         token = await accessToken(did);
-      }
-      headers["Authorization"] = "Bearer " + token;
-    } catch (error) {
-      // This rarely happens: we've seen it when they have account info but the
-      // encryption secret got lost. But in most cases we want users to at
-      // least see their feed -- and anything else that returns results for
-      // anonymous users.
 
-      // We'll continue with an anonymous request... still want to show feed and other things, but ideally let them know.
-      logConsoleAndDb(
-        "Something failed in getHeaders call (will proceed anonymously" +
-          ($notify ? " and notify user" : "") +
-          "): " +
-          // IntelliJ type system complains about getCircularReplacer() with: Argument of type '(obj: any, key: string, value: any) => any' is not assignable to parameter of type '(this: any, key: string, value: any) => any'.
-          //JSON.stringify(error, getCircularReplacer()), // JSON.stringify(error) on a Dexie error throws another error about: Converting circular structure to JSON
-          error,
-        true,
-      );
-      if ($notify) {
-        // remember: only want to do this if they supplied a DID, expecting personal results
-        const notifyMessage =
-          failureMessage ||
-          "Showing anonymous data. See the Help page for help with personal data.";
-        $notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Personal Data Error",
-            text: notifyMessage,
-          },
-          3000,
-        );
+        passkeyAccessToken = token;
+        const passkeyExpirationSeconds = await getPasskeyExpirationSeconds();
+        passkeyTokenExpirationEpochSeconds =
+          Date.now() / 1000 + passkeyExpirationSeconds;
       }
+    } else {
+      token = await accessToken(did);
     }
+    headers["Authorization"] = "Bearer " + token;
   } else {
-    // it's usually OK to request without auth; we assume we're only here when allowed
+    // it's often OK to request without auth; we assume necessary checks are done earlier
   }
   return headers;
 }
@@ -628,7 +520,7 @@ const planCache: LRUCache<string, PlanSummaryRecord> = new LRUCache({
  * @param apiServer
  */
 export async function getPlanFromCache(
-  handleId: string | undefined,
+  handleId: string | null,
   axios: Axios,
   apiServer: string,
   requesterDid?: string,
@@ -675,102 +567,6 @@ export async function setPlanInCache(
   planCache.set(handleId, planSummary);
 }
 
-/**
- *
- * @param error that is thrown from an Endorser server call by Axios
- * @returns user-friendly message, or undefined if none found
- */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function serverMessageForUser(error: any) {
-  return (
-    // this is how most user messages are returned
-    error?.response?.data?.error?.message
-    // some are returned as "error" with a string, but those are more for devs and are less helpful to the user
-  );
-}
-
-/**
- * Helpful for server errors, to get all the info -- including stuff skipped by toString & JSON.stringify
- * It works with AxiosError, eg handling an error.response intelligently.
- *
- * @param error
- */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function errorStringForLog(error: any) {
-  let stringifiedError = "" + error;
-  try {
-    stringifiedError = JSON.stringify(error);
-  } catch (e) {
-    // can happen with Dexie, eg:
-    // TypeError: Converting circular structure to JSON
-    // --> starting at object with constructor 'DexieError2'
-    // |     property '_promise' -> object with constructor 'DexiePromise'
-    // --- property '_value' closes the circle
-  }
-  let fullError = "" + error + " - JSON: " + stringifiedError;
-  const errorResponseText = JSON.stringify(error.response);
-  // for some reason, error.response is not included in stringify result (eg. for 400 errors on invite redemptions)
-  if (!R.empty(errorResponseText) && !fullError.includes(errorResponseText)) {
-    // add error.response stuff
-    if (R.equals(error?.config, error?.response?.config)) {
-      // but exclude "config" because it's already in there
-      const newErrorResponseText = JSON.stringify(
-        R.omit(["config"] as never[], error.response),
-      );
-      fullError += " - .response w/o same config JSON: " + newErrorResponseText;
-    } else {
-      fullError += " - .response JSON: " + errorResponseText;
-    }
-  }
-  return fullError;
-}
-
-/**
- *
- * @returns { data: Array<OfferSummaryRecord>, hitLimit: boolean true if maximum was hit and there may be more }
- */
-export async function getNewOffersToUser(
-  axios: Axios,
-  apiServer: string,
-  activeDid: string,
-  afterOfferJwtId?: string,
-  beforeOfferJwtId?: string,
-) {
-  let url = `${apiServer}/api/v2/report/offers?recipientDid=${activeDid}`;
-  if (afterOfferJwtId) {
-    url += "&afterId=" + afterOfferJwtId;
-  }
-  if (beforeOfferJwtId) {
-    url += "&beforeId=" + beforeOfferJwtId;
-  }
-  const headers = await getHeaders(activeDid);
-  const response = await axios.get(url, { headers });
-  return response.data;
-}
-/**
- *
- * @returns { data: Array<OfferToPlanSummaryRecord>, hitLimit: boolean true if maximum was hit and there may be more }
- */
-export async function getNewOffersToUserProjects(
-  axios: Axios,
-  apiServer: string,
-  activeDid: string,
-  afterOfferJwtId?: string,
-  beforeOfferJwtId?: string,
-) {
-  let url = `${apiServer}/api/v2/report/offersToPlansOwnedByMe`;
-  if (afterOfferJwtId) {
-    url += "?afterId=" + afterOfferJwtId;
-  }
-  if (beforeOfferJwtId) {
-    url += afterOfferJwtId ? "&" : "?";
-    url += "beforeId=" + beforeOfferJwtId;
-  }
-  const headers = await getHeaders(activeDid);
-  const response = await axios.get(url, { headers });
-  return response.data;
-}
-
 /**
  * Construct GiveAction VC for submission to server
  *
@@ -787,7 +583,6 @@ export function hydrateGive(
   fulfillsOfferHandleId?: string,
   isTrade: boolean = false,
   imageUrl?: string,
-  providerPlanHandleId?: string,
   lastClaimId?: string,
 ): GiveVerifiableCredential {
   // Remember: replace values or erase if it's null
@@ -846,10 +641,6 @@ export function hydrateGive(
 
   vcClaim.image = imageUrl || undefined;
 
-  vcClaim.provider = providerPlanHandleId
-    ? { "@type": "PlanAction", identifier: providerPlanHandleId }
-    : undefined;
-
   return vcClaim;
 }
 
@@ -874,7 +665,6 @@ export async function createAndSubmitGive(
   fulfillsOfferHandleId?: string,
   isTrade: boolean = false,
   imageUrl?: string,
-  providerPlanHandleId?: string,
 ): Promise<CreateAndSubmitClaimResult> {
   const vcClaim = hydrateGive(
     undefined,
@@ -887,7 +677,6 @@ export async function createAndSubmitGive(
     fulfillsOfferHandleId,
     isTrade,
     imageUrl,
-    providerPlanHandleId,
     undefined,
   );
   return createAndSubmitClaim(
@@ -920,7 +709,6 @@ export async function editAndSubmitGive(
   fulfillsOfferHandleId?: string,
   isTrade: boolean = false,
   imageUrl?: string,
-  providerPlanHandleId?: string,
 ): Promise<CreateAndSubmitClaimResult> {
   const vcClaim = hydrateGive(
     fullClaim.claim,
@@ -933,7 +721,6 @@ export async function editAndSubmitGive(
     fulfillsOfferHandleId,
     isTrade,
     imageUrl,
-    providerPlanHandleId,
     fullClaim.id,
   );
   return createAndSubmitClaim(
@@ -1128,7 +915,7 @@ export async function createAndSubmitClaim(
   } catch (error: any) {
     console.error("Error submitting claim:", error);
     const errorMessage: string =
-      serverMessageForUser(error) ||
+      error.response?.data?.error?.message ||
       error.message ||
       "Got some error submitting the claim. Check your permissions, network, and error logs.";
 
@@ -1141,22 +928,26 @@ export async function createAndSubmitClaim(
   }
 }
 
-export async function generateEndorserJwtUrlForAccount(
+export async function generateEndorserJwtForAccount(
   account: Account,
   isRegistered?: boolean,
   name?: string,
   profileImageUrl?: string,
-  // note that including the next key pushes QR codes to the next resolution smaller
-  includeNextKeyIfDerived?: boolean,
 ) {
   const publicKeyHex = account.publicKeyHex;
   const publicEncKey = Buffer.from(publicKeyHex, "hex").toString("base64");
 
+  interface UserInfo {
+    name: string;
+    publicEncKey: string;
+    registered: boolean;
+    profileImageUrl?: string;
+    nextPublicEncKeyHash?: string;
+  }
   const contactInfo = {
     iat: Date.now(),
     iss: account.did,
     own: {
-      did: account.did,
       name: name ?? "",
       publicEncKey,
       registered: !!isRegistered,
@@ -1166,8 +957,7 @@ export async function generateEndorserJwtUrlForAccount(
     contactInfo.own.profileImageUrl = profileImageUrl;
   }
 
-  // Add the next key -- not recommended for the QR code for such a high resolution
-  if (includeNextKeyIfDerived && account?.mnemonic && account?.derivationPath) {
+  if (account?.mnemonic && account?.derivationPath) {
     const newDerivPath = nextDerivationPath(account.derivationPath as string);
     const nextPublicHex = deriveAddress(
       account.mnemonic as string,
@@ -1179,20 +969,18 @@ export async function generateEndorserJwtUrlForAccount(
       Buffer.from(nextPublicEncKeyHash).toString("base64");
     contactInfo.own.nextPublicEncKeyHash = nextPublicEncKeyHashBase64;
   }
-
   const vcJwt = await createEndorserJwtForDid(account.did, contactInfo);
 
-  const viewPrefix = APP_SERVER + CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI;
+  const viewPrefix = CONTACT_URL_PREFIX + ENDORSER_JWT_URL_LOCATION;
   return viewPrefix + vcJwt;
 }
 
 export async function createEndorserJwtForDid(
   issuerDid: string,
   payload: object,
-  expiresIn?: number,
 ) {
-  const account = await retrieveFullyDecryptedAccount(issuerDid);
-  return createEndorserJwtForKey(account as KeyMeta, payload, expiresIn);
+  const account = await getAccount(issuerDid);
+  return createEndorserJwtForKey(account as KeyMeta, payload);
 }
 
 /**
@@ -1388,7 +1176,7 @@ export const claimSpecialDescription = (
 
 export const BVC_MEETUPS_PROJECT_CLAIM_ID =
   import.meta.env.VITE_BVC_MEETUPS_PROJECT_CLAIM_ID ||
-  "https://endorser.ch/entity/01GXYPFF7FA03NXKPYY142PY4H"; // production value, which seems like the safest value if forgotten
+  "https://endorser.ch/entity/01HNTZYJJXTGT0EZS3VEJGX7AK"; // this won't resolve as a URL on production; it's a URN only found in the test system
 
 export const bvcMeetingJoinClaim = (did: string, startTime: string) => {
   return {
@@ -1422,24 +1210,19 @@ export async function createEndorserJwtVcFromClaim(
   return createEndorserJwtForDid(issuerDid, vcPayload);
 }
 
-export async function createInviteJwt(
+export async function register(
   activeDid: string,
-  contact?: Contact,
-  inviteId?: string,
-  expiresIn?: number,
-): Promise<string> {
+  apiServer: string,
+  axios: Axios,
+  contact: Contact,
+) {
   const vcClaim: RegisterVerifiableCredential = {
     "@context": SCHEMA_ORG_CONTEXT,
     "@type": "RegisterAction",
     agent: { identifier: activeDid },
     object: SERVICE_ID,
+    participant: { identifier: contact.did },
   };
-  if (contact) {
-    vcClaim.participant = { identifier: contact.did };
-  }
-  if (inviteId) {
-    vcClaim.identifier = inviteId;
-  }
   // Make a payload for the claim
   const vcPayload = {
     vc: {
@@ -1449,17 +1232,7 @@ export async function createInviteJwt(
     },
   };
   // Create a signature using private key of identity
-  const vcJwt = await createEndorserJwtForDid(activeDid, vcPayload, expiresIn);
-  return vcJwt;
-}
-
-export async function register(
-  activeDid: string,
-  apiServer: string,
-  axios: Axios,
-  contact: Contact,
-): Promise<{ success?: boolean; error?: string }> {
-  const vcJwt = await createInviteJwt(activeDid, contact);
+  const vcJwt = await createEndorserJwtForDid(activeDid, vcPayload);
 
   const url = apiServer + "/api/v2/claim";
   const resp = await axios.post(url, { jwtEncoded: vcJwt });

src/libs/partnerServer.ts

@@ -1,9 +0,0 @@
-export interface UserProfile {
-  description: string;
-  locLat?: number;
-  locLon?: number;
-  locLat2?: number;
-  locLon2?: number;
-  issuerDid: string;
-  rowId?: string; // set on profile retrieved from server
-}

src/libs/util.ts

@@ -5,42 +5,26 @@ import { Buffer } from "buffer";
 import * as R from "ramda";
 import { useClipboard } from "@vueuse/core";
 
-import { DEFAULT_PUSH_SERVER, NotificationIface } from "@/constants/app";
-import {
-  accountsDBPromise,
-  retrieveSettingsForActiveAccount,
-  updateAccountSettings,
-  updateDefaultSettings,
-} from "@/db/index";
+import { DEFAULT_PUSH_SERVER } from "@/constants/app";
+import { accountsDB, db } from "@/db/index";
 import { Account } from "@/db/tables/accounts";
 import { Contact } from "@/db/tables/contacts";
-import { DEFAULT_PASSKEY_EXPIRATION_MINUTES } from "@/db/tables/settings";
+import {
+  DEFAULT_PASSKEY_EXPIRATION_MINUTES,
+  MASTER_SETTINGS_KEY,
+} from "@/db/tables/settings";
 import { deriveAddress, generateSeed, newIdentifier } from "@/libs/crypto";
-import * as serverUtil from "@/libs/endorserServer";
 import {
   containsHiddenDid,
   GenericCredWrapper,
   GenericVerifiableCredential,
-  GiveSummaryRecord,
   OfferVerifiableCredential,
 } from "@/libs/endorserServer";
+import * as serverUtil from "@/libs/endorserServer";
 import { KeyMeta } from "@/libs/crypto/vc";
 import { createPeerDid } from "@/libs/crypto/vc/didPeer";
 import { registerCredential } from "@/libs/crypto/vc/passkeyDidPeer";
 
-export interface GiverReceiverInputInfo {
-  did?: string;
-  name?: string;
-}
-
-export enum OnboardPage {
-  Home = "HOME",
-  Discover = "DISCOVER",
-  Create = "CREATE",
-  Contact = "CONTACT",
-  Account = "ACCOUNT",
-}
-
 export const PRIVACY_MESSAGE =
   "The data you send will be visible to the world -- except: your IDs and the IDs of anyone you tag will stay private, only visible to them and others you explicitly allow.";
 export const SHARED_PHOTO_BASE64_KEY = "shared-photo-base64";
@@ -102,29 +86,10 @@ export const isGlobalUri = (uri: string) => {
   return uri && uri.match(new RegExp(/^[A-Za-z][A-Za-z0-9+.-]+:/));
 };
 
-export const isGiveClaimType = (claimType?: string) => {
-  return claimType === "GiveAction";
-};
-
 export const isGiveAction = (
   veriClaim: GenericCredWrapper<GenericVerifiableCredential>,
 ) => {
-  return isGiveClaimType(veriClaim.claimType);
-};
-
-export const shortDid = (did: string) => {
-  if (did.startsWith("did:peer:")) {
-    return (
-      did.substring(0, "did:peer:".length + 2) +
-      "..." +
-      did.substring("did:peer:".length + 18, "did:peer:".length + 25) +
-      "..."
-    );
-  } else if (did.startsWith("did:ethr:")) {
-    return did.substring(0, "did:ethr:".length + 9) + "...";
-  } else {
-    return did.substring(0, did.indexOf(":", 4) + 7) + "...";
-  }
+  return veriClaim.claimType === "GiveAction";
 };
 
 export const nameForDid = (
@@ -156,92 +121,16 @@ export const doCopyTwoSecRedo = (text: string, fn: () => void) => {
     .then(() => setTimeout(fn, 2000));
 };
 
-export interface ConfirmerData {
-  confirmerIdList: string[];
-  confsVisibleToIdList: string[];
-  numConfsNotVisible: number;
-}
-
-// // This is meant to be a second argument to JSON.stringify to avoid circular references.
-// // Usage: JSON.stringify(error, getCircularReplacer())
-// // Beware: we've seen this return "undefined" when there is actually a message, eg: DatabaseClosedError: Error DEXIE ENCRYPT ADDON: Encryption key has changed
-// function getCircularReplacer() {
-//   const seen = new WeakSet();
-//   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-//   return (obj: any, key: string, value: any): any => {
-//     if (typeof value === "object" && value !== null) {
-//       if (seen.has(value)) {
-//         return "[circular ref]";
-//       }
-//       seen.add(value);
-//     }
-//     return value;
-//   };
-// }
-
-/**
- * @return only confirmers, excluding the issuer and hidden DIDs
- */
-export async function retrieveConfirmerIdList(
-  apiServer: string,
-  claimId: string,
-  claimIssuerId: string,
-  userDid: string,
-): Promise<ConfirmerData | undefined> {
-  const confirmUrl =
-    apiServer +
-    "/api/report/issuersWhoClaimedOrConfirmed?claimId=" +
-    encodeURIComponent(serverUtil.stripEndorserPrefix(claimId));
-  const confirmHeaders = await serverUtil.getHeaders(userDid);
-  const response = await axios.get(confirmUrl, {
-    headers: confirmHeaders,
-  });
-  if (response.status === 200) {
-    const resultList1 = response.data.result || [];
-    //const publicUrls = resultList.publicUrls || [];
-    delete resultList1.publicUrls;
-    // exclude hidden DIDs
-    const resultList2 = R.reject(serverUtil.isHiddenDid, resultList1);
-    // exclude the issuer
-    const resultList3 = R.reject(
-      (did: string) => did === claimIssuerId,
-      resultList2,
-    );
-    const confirmerIdList = resultList3;
-    let numConfsNotVisible = resultList1.length - resultList2.length;
-    if (resultList3.length === resultList2.length) {
-      // the issuer was not in the "visible" list so they must be hidden
-      // so subtract them from the non-visible confirmers count
-      numConfsNotVisible = numConfsNotVisible - 1;
-    }
-    const confsVisibleToIdList = response.data.result.resultVisibleToDids || [];
-    const result: ConfirmerData = {
-      confirmerIdList,
-      confsVisibleToIdList,
-      numConfsNotVisible,
-    };
-    return result;
-  } else {
-    console.error(
-      "Bad response status of",
-      response.status,
-      "for confirmers:",
-      response,
-    );
-    return undefined;
-  }
-}
-
 /**
  * @returns true if the user can confirm the claim
  * @param veriClaim is expected to have fields: claim, claimType, and issuer
  */
-export function isGiveRecordTheUserCanConfirm(
+export const isGiveRecordTheUserCanConfirm = (
   isRegistered: boolean,
   veriClaim: GenericCredWrapper<GenericVerifiableCredential>,
   activeDid: string,
   confirmerIdList: string[] = [],
-): boolean {
+) => {
   return (
     isRegistered &&
     isGiveAction(veriClaim) &&
@@ -249,78 +138,7 @@ export function isGiveRecordTheUserCanConfirm(
     veriClaim.issuer !== activeDid &&
     !containsHiddenDid(veriClaim.claim)
   );
-}
-
-export function notifyWhyCannotConfirm(
-  notifyFun: (notification: NotificationIface, timeout: number) => void,
-  isRegistered: boolean,
-  claimType: string | undefined,
-  giveDetails: GiveSummaryRecord | undefined,
-  activeDid: string,
-  confirmerIdList: string[] = [],
-) {
-  if (!isRegistered) {
-    notifyFun(
-      {
-        group: "alert",
-        type: "info",
-        title: "Not Registered",
-        text: "Someone needs to register you before you can confirm.",
-      },
-      3000,
-    );
-  } else if (!isGiveClaimType(claimType)) {
-    notifyFun(
-      {
-        group: "alert",
-        type: "info",
-        title: "Not A Give",
-        text: "This is not a giving action to confirm.",
-      },
-      3000,
-    );
-  } else if (confirmerIdList.includes(activeDid)) {
-    notifyFun(
-      {
-        group: "alert",
-        type: "info",
-        title: "Already Confirmed",
-        text: "You already confirmed this claim.",
-      },
-      3000,
-    );
-  } else if (giveDetails?.issuerDid == activeDid) {
-    notifyFun(
-      {
-        group: "alert",
-        type: "info",
-        title: "Cannot Confirm",
-        text: "You cannot confirm this because you issued this claim.",
-      },
-      3000,
-    );
-  } else if (serverUtil.containsHiddenDid(giveDetails?.fullClaim)) {
-    notifyFun(
-      {
-        group: "alert",
-        type: "info",
-        title: "Cannot Confirm",
-        text: "You cannot confirm this because some people are hidden.",
-      },
-      3000,
-    );
-  } else {
-    notifyFun(
-      {
-        group: "alert",
-        type: "info",
-        title: "Cannot Confirm",
-        text: "You cannot confirm this claim. There are no other details -- we can help more if you contact us and send us screenshots.",
-      },
-      3000,
-    );
-  }
-}
+};
 
 export async function blobToBase64(blob: Blob): Promise<string> {
   return new Promise((resolve, reject) => {
@@ -358,9 +176,9 @@ export function base64ToBlob(base64DataUrl: string, sliceSize = 512) {
  * @returns the DID of the person who offered, or undefined if hidden
  * @param veriClaim is expected to have fields: claim and issuer
  */
-export function offerGiverDid(
-  veriClaim: GenericCredWrapper<OfferVerifiableCredential>,
-): string | undefined {
+export const offerGiverDid: (
+  arg0: GenericCredWrapper<OfferVerifiableCredential>,
+) => string | undefined = (veriClaim) => {
   let giver;
   if (
     veriClaim.claim.offeredBy?.identifier &&
@@ -371,7 +189,7 @@ export function offerGiverDid(
     giver = veriClaim.issuer;
   }
   return giver;
-}
+};
 
 /**
  * @returns true if the user can fulfill the offer
@@ -380,9 +198,9 @@ export function offerGiverDid(
 export const canFulfillOffer = (
   veriClaim: GenericCredWrapper<GenericVerifiableCredential>,
 ) => {
-  return (
+  return !!(
     veriClaim.claimType === "Offer" &&
-    !!offerGiverDid(veriClaim as GenericCredWrapper<OfferVerifiableCredential>)
+    offerGiverDid(veriClaim as GenericCredWrapper<OfferVerifiableCredential>)
   );
 };
 
@@ -454,56 +272,10 @@ export function findAllVisibleToDids(
 
 export interface AccountKeyInfo extends Account, KeyMeta {}
 
-export const retrieveAccountCount = async (): Promise<number> => {
-  // one of the few times we use accountsDBPromise directly; try to avoid more usage
-  const accountsDB = await accountsDBPromise;
-  return await accountsDB.accounts.count();
-};
-
-export const retrieveAccountDids = async (): Promise<string[]> => {
-  // one of the few times we use accountsDBPromise directly; try to avoid more usage
-  const accountsDB = await accountsDBPromise;
-  const allAccounts = await accountsDB.accounts.toArray();
-  const allDids = allAccounts.map((acc) => acc.did);
-  return allDids;
-};
-
-// This is provided and recommended when the full key is not necessary so that
-// future work could separate this info from the sensitive key material.
-export const retrieveAccountMetadata = async (
+export const getAccount = async (
   activeDid: string,
 ): Promise<AccountKeyInfo | undefined> => {
-  // one of the few times we use accountsDBPromise directly; try to avoid more usage
-  const accountsDB = await accountsDBPromise;
-  const account = (await accountsDB.accounts
-    .where("did")
-    .equals(activeDid)
-    .first()) as Account;
-  if (account) {
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const { identity, mnemonic, ...metadata } = account;
-    return metadata;
-  } else {
-    return undefined;
-  }
-};
-
-export const retrieveAllAccountsMetadata = async (): Promise<Account[]> => {
-  // one of the few times we use accountsDBPromise directly; try to avoid more usage
-  const accountsDB = await accountsDBPromise;
-  const array = await accountsDB.accounts.toArray();
-  return array.map((account) => {
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const { identity, mnemonic, ...metadata } = account;
-    return metadata;
-  });
-};
-
-export const retrieveFullyDecryptedAccount = async (
-  activeDid: string,
-): Promise<AccountKeyInfo | undefined> => {
-  // one of the few times we use accountsDBPromise directly; try to avoid more usage
-  const accountsDB = await accountsDBPromise;
+  await accountsDB.open();
   const account = (await accountsDB.accounts
     .where("did")
     .equals(activeDid)
@@ -511,15 +283,6 @@ export const retrieveFullyDecryptedAccount = async (
   return account;
 };
 
-// let's try and eliminate this
-export const retrieveAllFullyDecryptedAccounts = async (): Promise<
-  Array<AccountKeyInfo>
-> => {
-  const accountsDB = await accountsDBPromise;
-  const allAccounts = await accountsDB.accounts.toArray();
-  return allAccounts;
-};
-
 /**
  * Generates a new identity, saves it to the database, and sets it as the active identity.
  * @return {Promise<string>} with the DID of the new identity
@@ -533,8 +296,7 @@ export const generateSaveAndActivateIdentity = async (): Promise<string> => {
   const newId = newIdentifier(address, publicHex, privateHex, derivationPath);
   const identity = JSON.stringify(newId);
 
-  // one of the few times we use accountsDBPromise directly; try to avoid more usage
-  const accountsDB = await accountsDBPromise;
+  await accountsDB.open();
   await accountsDB.accounts.add({
     dateCreated: new Date().toISOString(),
     derivationPath: derivationPath,
@@ -544,9 +306,9 @@ export const generateSaveAndActivateIdentity = async (): Promise<string> => {
     publicKeyHex: newId.keys[0].publicKeyHex,
   });
 
-  await updateDefaultSettings({ activeDid: newId.did });
-  //console.log("Updated default settings in util");
-  await updateAccountSettings(newId.did, { isRegistered: false });
+  await db.settings.update(MASTER_SETTINGS_KEY, {
+    activeDid: newId.did,
+  });
 
   return newId.did;
 };
@@ -565,8 +327,7 @@ export const registerAndSavePasskey = async (
     passkeyCredIdHex,
     publicKeyHex: Buffer.from(publicKeyBytes).toString("hex"),
   };
-  // one of the few times we use accountsDBPromise directly; try to avoid more usage
-  const accountsDB = await accountsDBPromise;
+  await accountsDB.open();
   await accountsDB.accounts.add(account);
   return account;
 };
@@ -575,40 +336,45 @@ export const registerSaveAndActivatePasskey = async (
   keyName: string,
 ): Promise<Account> => {
   const account = await registerAndSavePasskey(keyName);
-  await updateDefaultSettings({ activeDid: account.did });
-  await updateAccountSettings(account.did, { isRegistered: false });
+
+  await db.open();
+  await db.settings.update(MASTER_SETTINGS_KEY, {
+    activeDid: account.did,
+  });
+
   return account;
 };
 
 export const getPasskeyExpirationSeconds = async (): Promise<number> => {
-  const settings = await retrieveSettingsForActiveAccount();
-  return (
+  await db.open();
+  const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+  const passkeyExpirationSeconds =
     (settings?.passkeyExpirationMinutes ?? DEFAULT_PASSKEY_EXPIRATION_MINUTES) *
-    60
-  );
+    60;
+  return passkeyExpirationSeconds;
 };
 
-// These are shared with the service worker and should be a constant. Look for the same name in additional-scripts.js
-export const DAILY_CHECK_TITLE = "DAILY_CHECK";
-// This is a special value that tells the service worker to send a direct notification to the device, skipping filters.
-export const DIRECT_PUSH_TITLE = "DIRECT_NOTIFICATION";
-
 export const sendTestThroughPushServer = async (
   subscriptionJSON: PushSubscriptionJSON,
   skipFilter: boolean,
 ): Promise<AxiosResponse> => {
-  const settings = await retrieveSettingsForActiveAccount();
+  await db.open();
+  const settings = await db.settings.get(MASTER_SETTINGS_KEY);
   let pushUrl: string = DEFAULT_PUSH_SERVER as string;
   if (settings?.webPushServer) {
     pushUrl = settings.webPushServer;
   }
 
+  // This is a special value that tells the service worker to send a direct notification to the device, skipping filters.
+  // This is shared with the service worker and should be a constant. Look for the same name in additional-scripts.js
+  // Use something other than "Daily Update" https://gitea.anomalistdesign.com/trent_larson/py-push-server/src/commit/3c0e196c11bc98060ec5934e99e7dbd591b5da4d/app.py#L213
+  const DIRECT_PUSH_TITLE = "DIRECT_NOTIFICATION";
+
   const newPayload = {
-    ...subscriptionJSON,
-    // ... overridden with the following
     // eslint-disable-next-line prettier/prettier
     message: `Test, where you will see this message ${ skipFilter ? "un" : "" }filtered.`,
     title: skipFilter ? DIRECT_PUSH_TITLE : "Your Web Push",
+    ...subscriptionJSON,
   };
   console.log("Sending a test web push message:", newPayload);
   const payloadStr = JSON.stringify(newPayload);

src/main.ts

@@ -22,8 +22,6 @@ import {
   faBurst,
   faCalendar,
   faCamera,
-  faCaretDown,
-  faChair,
   faCheck,
   faChevronDown,
   faChevronLeft,
@@ -41,13 +39,9 @@ import {
   faDollar,
   faEllipsis,
   faEllipsisVertical,
-  faEnvelopeOpenText,
-  faEraser,
   faEye,
   faEyeSlash,
-  faFileContract,
   faFileLines,
-  faFilter,
   faFloppyDisk,
   faFolderOpen,
   faForward,
@@ -60,8 +54,6 @@ import {
   faHouseChimney,
   faImagePortrait,
   faLeftRight,
-  faLightbulb,
-  faLink,
   faLocationDot,
   faLongArrowAltLeft,
   faLongArrowAltRight,
@@ -74,7 +66,6 @@ import {
   faPlus,
   faQuestion,
   faQrcode,
-  faRightFromBracket,
   faRotate,
   faShareNodes,
   faSpinner,
@@ -101,8 +92,6 @@ library.add(
   faBurst,
   faCalendar,
   faCamera,
-  faCaretDown,
-  faChair,
   faCheck,
   faChevronDown,
   faChevronLeft,
@@ -120,13 +109,9 @@ library.add(
   faDollar,
   faEllipsis,
   faEllipsisVertical,
-  faEnvelopeOpenText,
-  faEraser,
   faEye,
   faEyeSlash,
-  faFileContract,
   faFileLines,
-  faFilter,
   faFloppyDisk,
   faFolderOpen,
   faForward,
@@ -139,8 +124,6 @@ library.add(
   faHouseChimney,
   faImagePortrait,
   faLeftRight,
-  faLightbulb,
-  faLink,
   faLocationDot,
   faLongArrowAltLeft,
   faLongArrowAltRight,
@@ -154,7 +137,6 @@ library.add(
   faQrcode,
   faQuestion,
   faRotate,
-  faRightFromBracket,
   faShareNodes,
   faSpinner,
   faSquare,
@@ -180,14 +162,11 @@ function setupGlobalErrorHandler(app: VueApp) {
     info: string,
   ) => {
     console.error(
-      "Ouch! Global Error Handler.",
+      "Ouch! Global Error Handler. Info:",
+      info,
       "Error:",
       err,
-      "- Error toString:",
-      err.toString(),
-      "- Info:",
-      info,
-      "- Instance:",
+      "Instance:",
       instance,
     );
     // Want to show a nice notiwind notification but can't figure out how.

src/router/index.ts

@@ -5,7 +5,7 @@ import {
   RouteLocationNormalized,
   RouteRecordRaw,
 } from "vue-router";
-import { accountsDBPromise } from "@/db/index";
+import { accountsDB } from "@/db/index";
 
 /**
  *
@@ -18,8 +18,7 @@ const enterOrStart = async (
   from: RouteLocationNormalized,
   next: NavigationGuardNext,
 ) => {
-  // one of the few times we use accountsDBPromise directly; try to avoid more usage
-  const accountsDB = await accountsDBPromise;
+  await accountsDB.open();
   const num_accounts = await accountsDB.accounts.count();
   if (num_accounts > 0) {
     next();
@@ -44,11 +43,6 @@ const routes: Array<RouteRecordRaw> = [
     name: "claim-add-raw",
     component: () => import("../views/ClaimAddRawView.vue"),
   },
-  {
-    path: "/claim-cert/:id",
-    name: "claim-cert",
-    component: () => import("../views/ClaimCertificateView.vue"),
-  },
   {
     path: "/confirm-contact",
     name: "confirm-contact",
@@ -64,18 +58,13 @@ const routes: Array<RouteRecordRaw> = [
     name: "contact-amounts",
     component: () => import("../views/ContactAmountsView.vue"),
   },
-  {
-    path: "/contact-edit/:did",
-    name: "contact-edit",
-    component: () => import("../views/ContactEditView.vue"),
-  },
   {
     path: "/contact-gift",
     name: "contact-gift",
     component: () => import("../views/ContactGiftingView.vue"),
   },
   {
-    path: "/contact-import/:jwt?",
+    path: "/contact-import",
     name: "contact-import",
     component: () => import("../views/ContactImportView.vue"),
   },
@@ -114,11 +103,6 @@ const routes: Array<RouteRecordRaw> = [
     name: "help-notifications",
     component: () => import("../views/HelpNotificationsView.vue"),
   },
-  {
-    path: "/help-notification-types",
-    name: "help-notification-types",
-    component: () => import("../views/HelpNotificationTypesView.vue"),
-  },
   {
     path: "/help-onboarding",
     name: "help-onboarding",
@@ -144,21 +128,6 @@ const routes: Array<RouteRecordRaw> = [
     name: "import-derive",
     component: () => import("../views/ImportDerivedAccountView.vue"),
   },
-  {
-    path: "/invite-one",
-    name: "invite-one",
-    component: () => import("../views/InviteOneView.vue"),
-  },
-  {
-    path: "/invite-one-accept/:jwt?",
-    name: "InviteOneAcceptView",
-    component: () => import("@/views/InviteOneAcceptView.vue"),
-  },
-  {
-    path: "/new-activity",
-    name: "new-activity",
-    component: () => import("../views/NewActivityView.vue"),
-  },
   {
     path: "/new-edit-account",
     name: "new-edit-account",
@@ -179,21 +148,6 @@ const routes: Array<RouteRecordRaw> = [
     name: "offer-details",
     component: () => import("../views/OfferDetailsView.vue"),
   },
-  {
-    path: "/onboard-meeting-list",
-    name: "onboard-meeting-list",
-    component: () => import("../views/OnboardMeetingListView.vue"),
-  },
-  {
-    path: "/onboard-meeting-members/:groupId",
-    name: "onboard-meeting-members",
-    component: () => import("../views/OnboardMeetingMembersView.vue"),
-  },
-  {
-    path: "/onboard-meeting-setup",
-    name: "onboard-meeting-setup",
-    component: () => import("../views/OnboardMeetingSetupView.vue"),
-  },
   {
     path: "/project/:id?",
     name: "project",
@@ -220,16 +174,6 @@ const routes: Array<RouteRecordRaw> = [
     name: "quick-action-bvc-end",
     component: () => import("../views/QuickActionBvcEndView.vue"),
   },
-  {
-    path: "/recent-offers-to-user",
-    name: "recent-offers-to-user",
-    component: () => import("../views/RecentOffersToUserView.vue"),
-  },
-  {
-    path: "/recent-offers-to-user-projects",
-    name: "recent-offers-to-user-projects",
-    component: () => import("../views/RecentOffersToUserProjectsView.vue"),
-  },
   {
     path: "/scan-contact",
     name: "scan-contact",
@@ -273,11 +217,6 @@ const routes: Array<RouteRecordRaw> = [
     name: "test",
     component: () => import("../views/TestView.vue"),
   },
-  {
-    path: "/userProfile/:id?",
-    name: "userProfile",
-    component: () => import("../views/UserProfileView.vue"),
-  },
 ];
 
 /** @type {*} */
@@ -294,7 +233,6 @@ const errorHandler = (
 ) => {
   // Handle the error here
   console.error("Caught in top level error handler:", error, to, from);
-  alert("Something is very wrong. Try reloading or restarting the app.");
 
   // You can also perform additional actions, such as displaying an error message or redirecting the user to a specific page
 };

src/store/app.ts

@@ -0,0 +1,20 @@
+// @ts-check
+import { defineStore } from "pinia";
+
+export const useAppStore = defineStore({
+  id: "app",
+  state: () => ({
+    _projectId:
+      typeof localStorage.getItem("projectId") === "undefined"
+        ? ""
+        : localStorage.getItem("projectId"),
+  }),
+  getters: {
+    projectId: (state): string => state._projectId as string,
+  },
+  actions: {
+    async setProjectId(newProjectId: string) {
+      localStorage.setItem("projectId", newProjectId);
+    },
+  },
+});

src/test/index.ts

@@ -1,9 +1,10 @@
 import axios from "axios";
 import * as didJwt from "did-jwt";
 import { AppString } from "@/constants/app";
-import { retrieveSettingsForActiveAccount } from "../db";
-import { SERVICE_ID } from "@/libs/endorserServer";
-import { deriveAddress, newIdentifier } from "@/libs/crypto";
+import { db } from "../db";
+import { SERVICE_ID } from "../libs/endorserServer";
+import { deriveAddress, newIdentifier } from "../libs/crypto";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 
 /**
  * Get User #0 to sign & submit a RegisterAction for the user's activeDid.
@@ -16,7 +17,8 @@ export async function testServerRegisterUser() {
 
   const identity0 = newIdentifier(addr, publicHex, privateHex, deriPath);
 
-  const settings = await retrieveSettingsForActiveAccount();
+  await db.open();
+  const settings = await db.settings.get(MASTER_SETTINGS_KEY);
 
   // Make a claim
   const vcClaim = {
@@ -24,7 +26,7 @@ export async function testServerRegisterUser() {
     "@type": "RegisterAction",
     agent: { did: identity0.did },
     object: SERVICE_ID,
-    participant: { did: settings.activeDid },
+    participant: { did: settings?.activeDid },
   };
   // Make a payload for the claim
   const vcPayload = {
@@ -51,7 +53,7 @@ export async function testServerRegisterUser() {
 
   const payload = JSON.stringify({ jwtEncoded: vcJwt });
   const endorserApiServer =
-    settings.apiServer || AppString.TEST_ENDORSER_API_SERVER;
+    settings?.apiServer || AppString.TEST_ENDORSER_API_SERVER;
   const url = endorserApiServer + "/api/claim";
   const headers = {
     "Content-Type": "application/json",

src/views/ClaimAddRawView.vue

@@ -32,12 +32,11 @@
 import { Component, Vue } from "vue-facing-decorator";
 import { Router } from "vue-router";
 
-import QuickNav from "@/components/QuickNav.vue";
 import { NotificationIface } from "@/constants/app";
-import { logConsoleAndDb, retrieveSettingsForActiveAccount } from "@/db/index";
+import { db } from "@/db/index";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
 import * as serverUtil from "@/libs/endorserServer";
-import * as libsUtil from "@/libs/util";
-import { errorStringForLog } from "@/libs/endorserServer";
+import QuickNav from "@/components/QuickNav.vue";
 
 @Component({
   components: { QuickNav },
@@ -51,60 +50,17 @@ export default class ClaimAddRawView extends Vue {
   claimStr = "";
 
   async mounted() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
+    await db.open();
+    const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+    this.activeDid = settings?.activeDid || "";
+    this.apiServer = settings?.apiServer || "";
 
     this.claimStr = (this.$route as Router).query["claim"];
-    if (this.claimStr) {
-      try {
-        const veriClaim = JSON.parse(this.claimStr);
-        this.claimStr = JSON.stringify(veriClaim, null, 2);
-      } catch (e) {
-        // ignore a parse error
-      }
-    } else {
-      // there may be no link that uses this, meaning you'd have to enter it in a browser
-      const claimJwtId = (this.$route as Router).query["claimJwtId"];
-      if (claimJwtId) {
-        const urlPath = libsUtil.isGlobalUri(claimJwtId)
-          ? "/api/claim/byHandle/"
-          : "/api/claim/";
-        const url = this.apiServer + urlPath + encodeURIComponent(claimJwtId);
-        const headers = await serverUtil.getHeaders(this.activeDid);
-
-        try {
-          const response = await this.axios.get(url, { headers });
-          if (response.status === 200) {
-            const claim = response.data?.claim;
-            claim.lastClaimId = serverUtil.stripEndorserPrefix(claimJwtId);
-            this.claimStr = JSON.stringify(claim, null, 2);
-          } else {
-            throw {
-              message: "Got an error loading that claim.",
-              response: {
-                status: response.status,
-                statusText: response.statusText,
-                // url is in "fetch" response but not in AxiosResponse
-              },
-            };
-          }
-        } catch (error: unknown) {
-          logConsoleAndDb(
-            "Error retrieving claim: " + errorStringForLog(error),
-            true,
-          );
-          this.$notify(
-            {
-              group: "alert",
-              type: "danger",
-              title: "Error",
-              text: "Got an error retrieving claim data.",
-            },
-            3000,
-          );
-        }
-      }
+    try {
+      this.veriClaim = JSON.parse(this.claimStr);
+      this.claimStr = JSON.stringify(this.veriClaim, null, 2);
+    } catch (e) {
+      // ignore a parse
     }
   }
 
@@ -133,9 +89,9 @@ export default class ClaimAddRawView extends Vue {
           group: "alert",
           type: "danger",
           title: "Error",
-          text: "There was a problem submitting the claim.",
+          text: "There was a problem submitting the claim. See logs for more info.",
         },
-        5000,
+        -1,
       );
     }
   }

src/views/ClaimCertificateView.vue

@@ -1,270 +0,0 @@
-<template>
-  <section id="Content">
-    <div class="flex items-center justify-center h-screen">
-      <div v-if="claimData">
-        <router-link :to="'/claim/' + this.claimId">
-          <canvas class="w-full block mx-auto" ref="claimCanvas"></canvas>
-        </router-link>
-      </div>
-    </div>
-  </section>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-import { nextTick } from "vue";
-import QRCode from "qrcode";
-
-import { APP_SERVER, NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
-import * as serverUtil from "@/libs/endorserServer";
-
-@Component
-export default class ClaimCertificateView extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  activeDid = "";
-  allMyDids: Array<string> = [];
-  apiServer = "";
-  claimId = "";
-  claimData = null;
-
-  serverUtil = serverUtil;
-
-  async created() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
-    const pathParams = window.location.pathname.substring(
-      "/claim-cert/".length,
-    );
-    this.claimId = pathParams;
-    await this.fetchClaim();
-  }
-
-  async fetchClaim() {
-    try {
-      const headers = await serverUtil.getHeaders(this.activeDid);
-      const response = await this.axios.get(
-        `${this.apiServer}/api/claim/${this.claimId}`,
-        { headers },
-      );
-      if (response.status === 200) {
-        this.claimData = await response.data;
-        const claimEntryIds = [this.claimId];
-        const headers = await serverUtil.getHeaders(this.activeDid);
-        const confirmerResponse = await this.axios.post(
-          `${this.apiServer}/api/v2/report/confirmers/?claimEntryIds=${this.claimId}`,
-          { claimEntryIds },
-          { headers },
-        );
-        let confirmerIds: Array<string> = [];
-        if (confirmerResponse.status === 200) {
-          confirmerIds = await confirmerResponse.data.data;
-        }
-        await nextTick(); // Wait for the DOM to update
-        if (this.claimData) {
-          this.drawCanvas(this.claimData, confirmerIds);
-        }
-      } else {
-        throw new Error(`Error fetching claim: ${response.statusText}`);
-      }
-    } catch (error) {
-      console.error("Failed to load claim:", error);
-      this.$notify({
-        group: "alert",
-        type: "danger",
-        title: "Error",
-        text: "There was a problem loading the claim.",
-      });
-    }
-  }
-
-  async drawCanvas(
-    claimData: serverUtil.GenericCredWrapper<serverUtil.GenericVerifiableCredential>,
-    confirmerIds: Array<string>,
-  ) {
-    await db.open();
-    const allContacts = await db.contacts.toArray();
-
-    const canvas = this.$refs.claimCanvas as HTMLCanvasElement;
-    if (canvas) {
-      const CANVAS_WIDTH = 1100;
-      const CANVAS_HEIGHT = 850;
-
-      // size to approximate portrait of 8.5"x11"
-      canvas.width = CANVAS_WIDTH;
-      canvas.height = CANVAS_HEIGHT;
-      const ctx = canvas.getContext("2d");
-      if (ctx) {
-        // Load the background image
-        const backgroundImage = new Image();
-        backgroundImage.src = "/img/background/cert-frame-2.jpg";
-        backgroundImage.onload = async () => {
-          // Draw the background image
-          ctx.drawImage(backgroundImage, 0, 0, CANVAS_WIDTH, CANVAS_HEIGHT);
-
-          // Set font and styles
-          ctx.fillStyle = "black";
-
-          // Draw claim type
-          ctx.font = "bold 20px Arial";
-          const claimTypeText =
-            claimData.claimType === "GiveAction"
-              ? "Gift"
-              : claimData.claimType === "PlanAction"
-                ? "Project"
-                : this.serverUtil.capitalizeAndInsertSpacesBeforeCaps(
-                    claimData.claimType || "",
-                  );
-          const claimTypeWidth = ctx.measureText(claimTypeText).width;
-          ctx.fillText(
-            claimTypeText,
-            (CANVAS_WIDTH - claimTypeWidth) / 2, // Center horizontally
-            CANVAS_HEIGHT * 0.33,
-          );
-
-          if (claimData.claimType === "GiveAction" && claimData.claim.agent) {
-            const presentedText = "Thanks To";
-            ctx.font = "14px Arial";
-            const presentedWidth = ctx.measureText(presentedText).width;
-            ctx.fillText(
-              presentedText,
-              (CANVAS_WIDTH - presentedWidth) / 2, // Center horizontally
-              CANVAS_HEIGHT * 0.37,
-            );
-            const agentDid =
-              claimData.claim.agent.identifier || claimData.claim.agent;
-            const agentText = serverUtil.didInfoForCertificate(
-              agentDid,
-              allContacts,
-            );
-            ctx.font = "bold 20px Arial";
-            const agentWidth = ctx.measureText(agentText).width;
-            ctx.fillText(
-              agentText,
-              (CANVAS_WIDTH - agentWidth) / 2, // Center horizontally
-              CANVAS_HEIGHT * 0.41,
-            );
-          }
-
-          // alternatively, show some offer details
-          if (claimData.claimType === "Offer") {
-            const presentedText = "To";
-            ctx.font = "14px Arial";
-            const presentedWidth = ctx.measureText(presentedText).width;
-            ctx.fillText(
-              presentedText,
-              (CANVAS_WIDTH - presentedWidth) / 2, // Center horizontally
-              CANVAS_HEIGHT * 0.37,
-            );
-            // fulfills
-            const agentDid =
-              claimData.claim.agent.identifier || claimData.claim.agent;
-            const agentText = serverUtil.didInfoForCertificate(
-              agentDid,
-              allContacts,
-            );
-            ctx.font = "bold 20px Arial";
-            const agentWidth = ctx.measureText(agentText).width;
-            ctx.fillText(
-              agentText,
-              (CANVAS_WIDTH - agentWidth) / 2, // Center horizontally
-              CANVAS_HEIGHT * 0.41,
-            );
-          }
-
-          const descriptionText =
-            claimData.claim.name ||
-            claimData.claim.description ||
-            claimData.claim.itemOffered?.description; // for Offers
-          if (descriptionText) {
-            const descriptionLine =
-              descriptionText.length > 50
-                ? descriptionText.substring(0, 75) + "..."
-                : descriptionText;
-            ctx.font = "14px Arial";
-            const descriptionWidth = ctx.measureText(descriptionLine).width;
-            ctx.fillText(
-              descriptionLine,
-              (CANVAS_WIDTH - descriptionWidth) / 2,
-              CANVAS_HEIGHT * 0.495,
-            );
-          }
-
-          const possibleObject =
-            claimData.claim.object || // for GiveActions
-            claimData.claim.includesObject; // for Offers
-          if (possibleObject?.amountOfThisGood && possibleObject?.unitCode) {
-            const amount = possibleObject.amountOfThisGood;
-            const unit = possibleObject.unitCode;
-            const amountText = serverUtil.displayAmount(unit, amount);
-            const amountWidth = ctx.measureText(amountText).width;
-            // if there was no description then put this in that spot, otherwise put it below the description
-            const yPos = descriptionText
-              ? CANVAS_HEIGHT * 0.525
-              : CANVAS_HEIGHT * 0.495;
-            ctx.font = "14px Arial";
-            ctx.fillText(amountText, (CANVAS_WIDTH - amountWidth) / 2, yPos);
-          }
-
-          // Draw claim issuer
-          if (
-            claimData.issuer == null ||
-            serverUtil.isHiddenDid(claimData.issuer) ||
-            // don't show if issuer claimed for themselves
-            // (The confirmations are the good stuff anyway, and self-issued certs shouldn't detract from that.)
-            claimData.issuer !== claimData.claim.agent?.identifier
-          ) {
-            ctx.font = "14px Arial";
-            let fullIssuer = serverUtil.didInfoForCertificate(
-              claimData.issuer,
-              allContacts,
-            );
-            if (fullIssuer.length > 30) {
-              fullIssuer = fullIssuer.substring(0, 30) + "...";
-            }
-            const issuerText = "Issued by " + fullIssuer;
-            ctx.fillText(issuerText, CANVAS_WIDTH * 0.3, CANVAS_HEIGHT * 0.6);
-          }
-
-          // Draw number of claim confirmers
-          if (confirmerIds.length > 0) {
-            const confirmerText =
-              "Confirmed by " +
-              confirmerIds.length +
-              (confirmerIds.length === 1 ? " person" : " people");
-            ctx.font = "14px Arial";
-            ctx.fillText(
-              confirmerText,
-              CANVAS_WIDTH * 0.3,
-              CANVAS_HEIGHT * 0.63,
-            );
-          }
-
-          // Draw claim ID
-          ctx.font = "14px Arial";
-          ctx.fillText(this.claimId, CANVAS_WIDTH * 0.3, CANVAS_HEIGHT * 0.7);
-          ctx.fillText(
-            "via EndorserSearch.com",
-            CANVAS_WIDTH * 0.3,
-            CANVAS_HEIGHT * 0.73,
-          );
-
-          // Generate and draw QR code
-          const qrCodeCanvas = document.createElement("canvas");
-          await QRCode.toCanvas(
-            qrCodeCanvas,
-            APP_SERVER + "/claim/" + this.claimId,
-            {
-              width: 150,
-              color: { light: "#0000" /* Transparent background */ },
-            },
-          );
-          ctx.drawImage(qrCodeCanvas, CANVAS_WIDTH * 0.6, CANVAS_HEIGHT * 0.55);
-        };
-      }
-    }
-  }
-}
-</script>

src/views/ClaimReportCertificateView.vue

@@ -1,190 +0,0 @@
-<template>
-  <section id="Content">
-    <div v-if="claimData">
-      <canvas ref="claimCanvas"></canvas>
-    </div>
-  </section>
-</template>
-
-<style scoped>
-canvas {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-}
-</style>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-import { nextTick } from "vue";
-import QRCode from "qrcode";
-
-import { APP_SERVER, NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
-import * as endorserServer from "@/libs/endorserServer";
-
-@Component
-export default class ClaimReportCertificateView extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  activeDid = "";
-  allMyDids: Array<string> = [];
-  apiServer = "";
-  claimId = "";
-  claimData = null;
-
-  endorserServer = endorserServer;
-
-  async created() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
-    const pathParams = window.location.pathname.substring(
-      "/claim-cert/".length,
-    );
-    this.claimId = pathParams;
-    await this.fetchClaim();
-  }
-
-  async fetchClaim() {
-    try {
-      const response = await fetch(
-        `${this.apiServer}/api/claim/${this.claimId}`,
-      );
-      if (response.ok) {
-        this.claimData = await response.json();
-        await nextTick(); // Wait for the DOM to update
-        if (this.claimData) {
-          this.drawCanvas(this.claimData);
-        }
-      } else {
-        throw new Error(`Error fetching claim: ${response.statusText}`);
-      }
-    } catch (error) {
-      console.error("Failed to load claim:", error);
-      this.$notify({
-        group: "alert",
-        type: "danger",
-        title: "Error",
-        text: "There was a problem loading the claim.",
-      });
-    }
-  }
-
-  async drawCanvas(
-    claimData: endorserServer.GenericCredWrapper<endorserServer.GenericVerifiableCredential>,
-  ) {
-    await db.open();
-    const allContacts = await db.contacts.toArray();
-
-    const canvas = this.$refs.claimCanvas as HTMLCanvasElement;
-    if (canvas) {
-      const CANVAS_WIDTH = 1100;
-      const CANVAS_HEIGHT = 850;
-
-      // size to approximate portrait of 8.5"x11"
-      canvas.width = CANVAS_WIDTH;
-      canvas.height = CANVAS_HEIGHT;
-      const ctx = canvas.getContext("2d");
-      if (ctx) {
-        // Load the background image
-        const backgroundImage = new Image();
-        backgroundImage.src = "/img/background/cert-frame-2.jpg";
-        backgroundImage.onload = async () => {
-          // Draw the background image
-          ctx.drawImage(backgroundImage, 0, 0, CANVAS_WIDTH, CANVAS_HEIGHT);
-
-          // Set font and styles
-          ctx.fillStyle = "black";
-
-          // Draw claim type
-          ctx.font = "bold 20px Arial";
-          const claimTypeText =
-            this.endorserServer.capitalizeAndInsertSpacesBeforeCaps(
-              claimData.claimType || "",
-            );
-          const claimTypeWidth = ctx.measureText(claimTypeText).width;
-          ctx.fillText(
-            claimTypeText,
-            (CANVAS_WIDTH - claimTypeWidth) / 2, // Center horizontally
-            CANVAS_HEIGHT * 0.33,
-          );
-
-          if (claimData.claim.agent) {
-            const presentedText = "Presented to ";
-            ctx.font = "14px Arial";
-            const presentedWidth = ctx.measureText(presentedText).width;
-            ctx.fillText(
-              presentedText,
-              (CANVAS_WIDTH - presentedWidth) / 2, // Center horizontally
-              CANVAS_HEIGHT * 0.37,
-            );
-            const agentText = endorserServer.didInfoForCertificate(
-              claimData.claim.agent,
-              allContacts,
-            );
-            ctx.font = "bold 20px Arial";
-            const agentWidth = ctx.measureText(agentText).width;
-            ctx.fillText(
-              agentText,
-              (CANVAS_WIDTH - agentWidth) / 2, // Center horizontally
-              CANVAS_HEIGHT * 0.4,
-            );
-          }
-
-          const descriptionText =
-            claimData.claim.name || claimData.claim.description;
-          if (descriptionText) {
-            const descriptionLine =
-              descriptionText.length > 50
-                ? descriptionText.substring(0, 75) + "..."
-                : descriptionText;
-            ctx.font = "14px Arial";
-            const descriptionWidth = ctx.measureText(descriptionLine).width;
-            ctx.fillText(
-              descriptionLine,
-              (CANVAS_WIDTH - descriptionWidth) / 2,
-              CANVAS_HEIGHT * 0.45,
-            );
-          }
-
-          // Draw claim issuer & recipient
-          if (claimData.issuer) {
-            ctx.font = "14px Arial";
-            const issuerText =
-              "Issued by " +
-              endorserServer.didInfoForCertificate(
-                claimData.issuer,
-                allContacts,
-              );
-            ctx.fillText(issuerText, CANVAS_WIDTH * 0.3, CANVAS_HEIGHT * 0.6);
-          }
-
-          // Draw claim ID
-          ctx.font = "14px Arial";
-          ctx.fillText(this.claimId, CANVAS_WIDTH * 0.3, CANVAS_HEIGHT * 0.7);
-          ctx.fillText(
-            "via EndorserSearch.com",
-            CANVAS_WIDTH * 0.3,
-            CANVAS_HEIGHT * 0.73,
-          );
-
-          // Generate and draw QR code
-          const qrCodeCanvas = document.createElement("canvas");
-          await QRCode.toCanvas(
-            qrCodeCanvas,
-            APP_SERVER + "/claim/" + this.claimId,
-            {
-              width: 150,
-              color: { light: "#0000" /* Transparent background */ },
-            },
-          );
-          ctx.drawImage(qrCodeCanvas, CANVAS_WIDTH * 0.6, CANVAS_HEIGHT * 0.55);
-        };
-      }
-    }
-  }
-}
-</script>

src/views/ClaimView.vue

@@ -17,50 +17,40 @@
     </div>
 
     <!-- Details -->
-    <div class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4 w-full">
-      <div class="block flex gap-4 overflow-hidden w-full">
-        <div class="w-full">
-          <div class="flex columns-3">
-            <h2 class="text-md font-bold w-full">
-              {{ capitalizeAndInsertSpacesBeforeCaps(veriClaim.claimType) }}
-              <button
-                v-if="
-                  ['GiveAction', 'Offer', 'PlanAction'].includes(
-                    veriClaim.claimType as string,
-                  ) && veriClaim.issuer === activeDid
-                  // a PlanAction agent also could edit one of those,
-                  // but rather than add more Plan-specific logic to detect the agent
-                  // we'll let them click the Project link and edit from there
-                "
-                @click="onClickEditClaim"
-                title="Edit"
-                data-testId="editClaimButton"
-              >
-                <fa icon="pen" class="text-sm text-blue-500 ml-2 mb-1" />
-              </button>
-            </h2>
-            <div class="flex justify-center w-full">
-              <router-link
-                :to="'/claim-cert/' + encodeURIComponent(veriClaim.id)"
-                class="text-blue-500 mt-2"
-                title="Printable Certificate"
-              >
-                <fa icon="square" class="text-white bg-yellow-500 p-1" />
-              </router-link>
-            </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)
-                "
-              >
-                <fa icon="link" class="text-slate-500" />
-              </button>
-            </div>
-          </div>
+    <div class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4">
+      <div class="block flex gap-4 overflow-hidden">
+        <div class="overflow-hidden">
+          <h2 class="text-md font-bold">
+            {{ capitalizeAndInsertSpacesBeforeCaps(veriClaim.claimType) }}
+            <button
+              v-if="
+                ['GiveAction', 'Offer'].includes(
+                  veriClaim.claimType as string,
+                ) && veriClaim.issuer === activeDid
+              "
+              @click="onClickEditClaim"
+              title="Edit"
+              data-testId="editClaimButton"
+            >
+              <fa icon="pen" class="text-sm text-blue-500 ml-2 mb-1" />
+            </button>
+          </h2>
           <div class="text-sm">
+            <div>
+              {{ veriClaim.id }}
+              <button
+                @click="
+                  libsUtil.doCopyTwoSecRedo(
+                    veriClaim.id as string,
+                    () => (showIdCopy = !showIdCopy),
+                  )
+                "
+                class="ml-2 mr-2"
+              >
+                <fa icon="copy" class="text-slate-400 fa-fw" />
+              </button>
+              <span v-show="showIdCopy">Copied ID</span>
+            </div>
             <div data-testId="description">
               <fa icon="message" class="fa-fw text-slate-400" />
               {{
@@ -70,11 +60,24 @@
             </div>
             <div>
               <fa icon="user" class="fa-fw text-slate-400" />
-              {{ didInfo(veriClaim.issuer) }}
+              {{ veriClaim.issuer }}
+              <span v-if="!serverUtil.isEmptyOrHiddenDid(veriClaim.issuer)">
+                <button
+                  @click="
+                    libsUtil.doCopyTwoSecRedo(
+                      veriClaim.issuer as string,
+                      () => (showDidCopy = !showDidCopy),
+                    )
+                  "
+                  class="ml-2 mr-2"
+                >
+                  <fa icon="copy" class="text-slate-400 fa-fw" />
+                </button>
+                <span v-show="showDidCopy">Copied DID</span>
+              </span>
             </div>
             <div>
               <fa icon="calendar" class="fa-fw text-slate-400" />
-              Recorded
               {{ veriClaim.issuedAt?.replace(/T/, " ").replace(/Z/, " UTC") }}
             </div>
             <div v-if="veriClaim.claim.image" class="flex justify-center">
@@ -83,19 +86,10 @@
               </a>
             </div>
 
-            <div v-if="veriClaim.claimType === 'PlanAction'" class="mt-4">
-              <router-link
-                :to="'/project/' + encodeURIComponent(veriClaim.handleId)"
-                class="text-blue-500 mt-2"
-              >
-                Go to Project page
-              </router-link>
-            </div>
-
             <!-- Fullfills Links -->
 
             <!-- fullfills links for a give -->
-            <div v-if="detailsForGive?.fulfillsPlanHandleId" class="mt-4">
+            <div v-if="detailsForGive?.fulfillsPlanHandleId">
               <router-link
                 :to="
                   '/project/' +
@@ -119,7 +113,7 @@
                 @click="
                   showDifferentClaimPage(detailsForGive?.fulfillsHandleId)
                 "
-                class="text-blue-500 mt-4 cursor-pointer"
+                class="text-blue-500 mt-4"
               >
                 Fulfills
                 {{
@@ -142,52 +136,10 @@
                 Offered to a bigger plan...
               </router-link>
             </div>
-
-            <!-- Providers -->
-            <div v-if="providersForGive?.length > 0" class="mt-4">
-              <span>Other assistance provided by:</span>
-              <ul class="ml-4">
-                <li
-                  v-for="provider of providersForGive"
-                  :key="provider.identifier"
-                  class="list-disc ml-4"
-                >
-                  <div class="flex gap-4">
-                    <div class="grow overflow-hidden">
-                      <a
-                        @click="
-                          provider.identifier.startsWith('did:')
-                            ? this.$router.push(
-                                '/did/' +
-                                  encodeURIComponent(provider.identifier),
-                              )
-                            : showDifferentClaimPage(provider.identifier)
-                        "
-                        class="text-blue-500 mt-4 cursor-pointer"
-                      >
-                        an activity...
-                      </a>
-                    </div>
-                  </div>
-                </li>
-              </ul>
-            </div>
           </div>
         </div>
       </div>
     </div>
-    <div class="mt-2">
-      <fa icon="comment" class="text-slate-400" />
-      {{ issuerName }} posted that.
-    </div>
-    <!--
-    <div>
-      <router-link :to="'/claim-cert/' + encodeURIComponent(veriClaim.id)">
-        <fa icon="file-contract" class="text-slate-400" />
-        <span class="ml-2 text-blue-500">Printable Certificate</span>
-      </router-link>
-    </div>
-    -->
 
     <div class="mt-8">
       <button
@@ -199,7 +151,6 @@
         <fa icon="hand-holding-heart" class="ml-2 text-white cursor-pointer" />
       </button>
     </div>
-    <GiftedDialog ref="customGiveDialog" />
 
     <div v-if="libsUtil.isGiveAction(veriClaim)">
       <div class="flex columns-3">
@@ -231,16 +182,13 @@
           </router-link>
         </span>
       </div>
+      <GiftedDialog ref="customGiveDialog" />
 
-      <div class="mt-2">
-        <span v-if="totalConfirmers() === 0">Nobody has confirmed this.</span>
-        <span v-else-if="totalConfirmers() === 1">
-          One person has confirmed this.
-        </span>
-        <span v-else>
-          {{ totalConfirmers() }} people have confirmed this.
-        </span>
-      </div>
+      <span v-if="totalConfirmers() === 0">Nobody has confirmed this.</span>
+      <span v-else-if="totalConfirmers() === 1">
+        One person has confirmed this.
+      </span>
+      <span v-else> {{ totalConfirmers() }} people have confirmed this. </span>
 
       <div v-if="totalConfirmers() > 0">
         <div
@@ -259,7 +207,7 @@
           Nobody that you know has issued or confirmed this claim.
         </div>
         <div v-if="confirmerIdList.length > 0">
-          The following people have confirmed this claim.
+          The following people have issued or confirmed this claim.
           <ul class="ml-4">
             <li
               v-for="confirmerId in confirmerIdList"
@@ -271,13 +219,16 @@
                   <div class="text-sm">
                     {{ didInfo(confirmerId) }}
                     <span v-if="!serverUtil.isEmptyOrHiddenDid(confirmerId)">
-                      <a
-                        :href="`/did/${confirmerId}`"
-                        target="_blank"
-                        class="text-blue-500"
+                      <button
+                        @click="
+                          copyToClipboard(
+                            'The DID of ' + confirmerId,
+                            confirmerId,
+                          )
+                        "
                       >
-                        <fa icon="arrow-up-right-from-square" class="fa-fw" />
-                      </a>
+                        <fa icon="copy" class="text-slate-400 fa-fw" />
+                      </button>
                     </span>
                   </div>
                 </div>
@@ -309,13 +260,16 @@
                   <div class="text-sm">
                     {{ didInfo(confsVisibleTo) }}
                     <span v-if="!serverUtil.isEmptyOrHiddenDid(confsVisibleTo)">
-                      <a
-                        :href="`/did/${confsVisibleTo}`"
-                        target="_blank"
-                        class="text-blue-500"
+                      <button
+                        @click="
+                          copyToClipboard(
+                            'The DID of ' + confsVisibleTo,
+                            confsVisibleTo,
+                          )
+                        "
                       >
-                        <fa icon="arrow-up-right-from-square" class="fa-fw" />
-                      </a>
+                        <fa icon="copy" class="text-slate-400 fa-fw" />
+                      </button>
                     </span>
                   </div>
                 </div>
@@ -339,16 +293,10 @@
       </div>
     </div>
 
-    <!-- Note that a similar section is found in ConfirmGiftView.vue, and kinda in HiddenDidDialog.vue -->
-    <h2
-      class="font-bold uppercase text-xl text-blue-500 mt-8 cursor-pointer"
-      @click="showVeriClaimDump = !showVeriClaimDump"
-    >
-      Details
-      <fa v-if="showVeriClaimDump" icon="chevron-up" />
-      <fa v-else icon="chevron-right" />
-    </h2>
-    <div v-if="showVeriClaimDump">
+    <div>
+      <h2 class="font-bold uppercase text-xl mt-8 mb-2">
+        {{ serverUtil.containsHiddenDid(veriClaim) ? "Visible " : "" }}Details
+      </h2>
       <div
         v-if="
           serverUtil.containsHiddenDid(veriClaim) &&
@@ -359,26 +307,24 @@
         Some of the details are not visible to you; they show as "HIDDEN". They
         are not visible to any of your direct contacts, either.
         <span v-if="canShare">
-          You can ask one of your contacts to take a look and see if their
-          contacts can see more details:
+          If you'd like to ask any of your contacts to take a look and see if
+          their contacts can see more details,
           <a @click="onClickShareClaim()" class="text-blue-500"
-            >click to send them this page info</a
+            >click to send them this info</a
           >
-          and see if they can make an introduction. Someone is connected to
-          people closer to them; if you don't know who to ask, try the person
-          who registered you.
+          and see if they are willing to make an introduction. They are surely
+          connected to someone; if you don't know who to ask, you might try the
+          person who registered you.
         </span>
         <span v-else>
-          You can ask one of your contacts to take a look and see if their
-          contacts can see more details:
+          If you'd like to ask any of your contacts to take a look and see if
+          their contacts can see more details,
           <a
-            @click="copyToClipboard('A link to this page', windowLocation)"
+            @click="copyToClipboard('This page location', windowLocation)"
             class="text-blue-500"
-            >click to copy this page info</a
+            >share this page with them</a
           >
-          and see if they can make an introduction. Someone is connected to
-          people closer to them; if you don't know who to ask, try the person
-          who registered you.
+          and see if they are willing to make an introduction.
         </span>
       </div>
 
@@ -395,7 +341,7 @@
         <span v-else>
           If you'd like an introduction,
           <a
-            @click="copyToClipboard('A link to this page', windowLocation)"
+            @click="copyToClipboard('Location', windowLocation)"
             class="text-blue-500"
             >share this page with them and ask if they'll tell you more about
             about the participants.</a
@@ -422,22 +368,18 @@
                   <span>
                     {{ didInfo(visDid) }}
                     <span v-if="!serverUtil.isEmptyOrHiddenDid(visDid)">
-                      <a
-                        :href="`/did/${visDid}`"
-                        target="_blank"
-                        class="text-blue-500"
+                      <button
+                        @click="copyToClipboard('The DID of ' + visDid, visDid)"
                       >
-                        <fa icon="arrow-up-right-from-square" class="fa-fw" />
-                      </a>
+                        <fa icon="copy" class="text-slate-400 fa-fw" />
+                      </button>
                     </span>
                     <span v-if="veriClaim.publicUrls?.[visDid]"
-                      >, found at&nbsp;<a
+                      >, found at
+                      <fa icon="globe" class="fa-fw text-slate-400" />&nbsp;<a
                         :href="veriClaim.publicUrls?.[visDid]"
-                        target="_blank"
                         class="text-blue-500"
-                      >
-                        <fa icon="globe" class="fa-fw" />
-                        {{
+                        >{{
                           veriClaim.publicUrls[visDid].substring(
                             veriClaim.publicUrls[visDid].indexOf("//") + 2,
                           )
@@ -452,51 +394,53 @@
         </div>
       </div>
       <span v-if="isEditedGlobalId" class="mt-2">
-        This record is an edited version. The latest version is shown.
+        This record is an edited version. The latest version is here.
       </span>
       <br />
+      <button @click="showVeriClaimDump = !showVeriClaimDump" class="ml-2">
+        Details
+        <fa v-if="showVeriClaimDump" icon="chevron-up" class="text-blue-400" />
+        <fa v-else icon="chevron-down" class="text-blue-400" />
+      </button>
       <!-- Keep the dump contents directly between > and < to avoid weird spacing. -->
       <pre
         v-if="showVeriClaimDump"
         class="text-sm overflow-x-scroll bg-slate-100 px-4 py-3 rounded-md"
         >{{ veriClaimDump }}</pre
       >
-
-      <h2 class="text-xl mt-8 mb-2">Full Claim</h2>
-      <p class="mb-4">
-        The full claim includes the claim as it was originally issued, including
-        the signature (ie. the proof of issuance by that person).
-      </p>
-      <div v-if="!fullClaim">
-        <p v-if="fullClaimMessage" class="mb-4">
-          {{ fullClaimMessage }}
-        </p>
-        <button
-          v-else
-          class="text-blue-500 cursor-pointer"
-          @click="showFullClaim(veriClaim.id as string)"
-        >
-          <fa icon="file-lines" class="fa-fw" />
-          Load Full Claim Details
-        </button>
-      </div>
-      <div v-else>
-        <pre
-          class="text-sm overflow-x-scroll bg-slate-100 px-4 py-3 rounded-md"
-          >{{ fullClaimDump }}</pre
-        >
-      </div>
-
-      <a
-        :href="apiServer + '/api/claim/' + veriClaim.id"
-        target="_blank"
-        class="text-blue-500 cursor-pointer"
-      >
-        <fa icon="file-lines" class="fa-fw" />
-        <fa icon="arrow-up-right-from-square" class="ml-1 fa-fw" />
-        View on the Public Server
-      </a>
     </div>
+
+    <h2 class="font-bold uppercase text-xl mt-8 mb-2">Full Claim</h2>
+    <p class="mb-4">
+      The full claim includes the claim as it was originally issued, including
+      the signature (ie. the proof of issuance by that person).
+    </p>
+    <div v-if="!fullClaim">
+      <p v-if="fullClaimMessage" class="mb-4">
+        {{ fullClaimMessage }}
+      </p>
+      <button
+        v-else
+        class="block w-full text-center text-md uppercase bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-2 rounded-md mb-2"
+        @click="showFullClaim(veriClaim.id as string)"
+      >
+        Load Full Claim Details
+      </button>
+    </div>
+    <div v-else>
+      <pre
+        class="text-sm overflow-x-scroll bg-slate-100 px-4 py-3 rounded-md"
+        >{{ fullClaimDump }}</pre
+      >
+    </div>
+
+    <a
+      :href="apiServer + '/api/claim/' + veriClaim.id"
+      target="_blank"
+      class="block w-full text-center text-md uppercase bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-2 rounded-md mb-2"
+    >
+      View on the Public Server
+    </a>
   </section>
 </template>
 
@@ -509,25 +453,19 @@ import { Router } from "vue-router";
 import { useClipboard } from "@vueuse/core";
 
 import GiftedDialog from "@/components/GiftedDialog.vue";
-import QuickNav from "@/components/QuickNav.vue";
 import { NotificationIface } from "@/constants/app";
-import {
-  db,
-  logConsoleAndDb,
-  retrieveSettingsForActiveAccount,
-} from "@/db/index";
+import { accountsDB, db } from "@/db/index";
 import { Contact } from "@/db/tables/contacts";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
 import * as serverUtil from "@/libs/endorserServer";
+import * as libsUtil from "@/libs/util";
+import QuickNav from "@/components/QuickNav.vue";
+import { Account } from "@/db/tables/accounts";
 import {
   GenericCredWrapper,
+  GiverReceiverInputInfo,
   OfferVerifiableCredential,
 } from "@/libs/endorserServer";
-import * as libsUtil from "@/libs/util";
-
-interface ProviderInfo {
-  identifier: string; // could be a DID or a handleId
-  linkConfirmed: boolean;
-}
 
 @Component({
   components: { GiftedDialog, QuickNav },
@@ -551,9 +489,8 @@ export default class ClaimView extends Vue {
   fullClaimMessage = "";
   isEditedGlobalId = false;
   isRegistered = false;
-  issuerName = "";
   numConfsNotVisible = 0; // number of hidden DIDs in the confirmerIdList, minus the issuer if they aren't visible
-  providersForGive: ProviderInfo[] = [];
+  showDidCopy = false;
   showIdCopy = false;
   showVeriClaimDump = false;
   veriClaim = serverUtil.BLANK_GENERIC_SERVER_RECORD;
@@ -565,7 +502,6 @@ export default class ClaimView extends Vue {
   yaml = yaml;
   libsUtil = libsUtil;
   serverUtil = serverUtil;
-  window = window;
 
   resetThisValues() {
     this.confirmerIdList = [];
@@ -577,38 +513,24 @@ export default class ClaimView extends Vue {
     this.fullClaimDump = "";
     this.fullClaimMessage = "";
     this.isEditedGlobalId = false;
+    this.isRegistered = false;
     this.numConfsNotVisible = 0;
-    this.providersForGive = [];
     this.veriClaim = serverUtil.BLANK_GENERIC_SERVER_RECORD;
     this.veriClaimDump = "";
-    this.veriClaimDidsVisible = {};
   }
 
   async created() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
+    await db.open();
+    const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+    this.activeDid = settings?.activeDid || "";
+    this.apiServer = settings?.apiServer || "";
     this.allContacts = await db.contacts.toArray();
-    this.isRegistered = settings.isRegistered || false;
+    this.isRegistered = settings?.isRegistered || false;
 
-    try {
-      this.allMyDids = await libsUtil.retrieveAccountDids();
-    } catch (error) {
-      // continue because we want to see claims, even anonymously
-      logConsoleAndDb(
-        "Error retrieving all account DIDs on home page:" + error,
-        true,
-      );
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error Loading Profile",
-          text: "See the Help page for problems with your personal data.",
-        },
-        5000,
-      );
-    }
+    await accountsDB.open();
+    const accounts = accountsDB.accounts;
+    const accountsArr: Array<Account> = await accounts?.toArray();
+    this.allMyDids = accountsArr.map((acc) => acc.did);
 
     const pathParam = window.location.pathname.substring("/claim/".length);
     let claimId;
@@ -623,7 +545,7 @@ export default class ClaimView extends Vue {
           title: "Error",
           text: "No claim ID was provided.",
         },
-        5000,
+        -1,
       );
     }
 
@@ -669,7 +591,6 @@ export default class ClaimView extends Vue {
       const resp = await this.axios.get(url, { headers });
       if (resp.status === 200) {
         this.veriClaim = resp.data;
-        this.issuerName = this.didInfo(this.veriClaim.issuer);
         this.veriClaimDump = yaml.dump(this.veriClaim);
         this.veriClaimDidsVisible = libsUtil.findAllVisibleToDids(
           this.veriClaim,
@@ -685,7 +606,7 @@ export default class ClaimView extends Vue {
             title: "Error",
             text: "There was a problem retrieving that claim.",
           },
-          5000,
+          -1,
         );
         return;
       }
@@ -702,39 +623,11 @@ export default class ClaimView extends Vue {
         const giveResp = await this.axios.get(giveUrl, {
           headers: giveHeaders,
         });
-        if (giveResp.status === 200 && giveResp.data.data?.length > 0) {
+        if (giveResp.status === 200) {
           this.detailsForGive = giveResp.data.data[0];
         } else {
           console.error("Error getting detailed give info:", giveResp);
         }
-
-        // look for providers
-        const providerUrl =
-          this.apiServer +
-          "/api/v2/report/providersToGive?handleId=" +
-          encodeURIComponent(this.veriClaim.handleId as string);
-        const providerHeaders = await serverUtil.getHeaders(userDid);
-        const providerResp = await this.axios.get(providerUrl, {
-          headers: providerHeaders,
-        });
-        // should be at least an empty array
-        if (
-          providerResp.status === 200 &&
-          Array.isArray(providerResp.data.data)
-        ) {
-          this.providersForGive = providerResp.data.data;
-        } else {
-          console.error("Error getting give providers:", giveResp);
-          this.$notify(
-            {
-              group: "alert",
-              type: "warning",
-              title: "Error",
-              text: "Got error retrieving linked provider data.",
-            },
-            5000,
-          );
-        }
       } else if (this.veriClaim.claimType === "Offer") {
         const offerUrl =
           this.apiServer +
@@ -748,29 +641,36 @@ export default class ClaimView extends Vue {
           this.detailsForOffer = offerResp.data.data[0];
         } else {
           console.error("Error getting detailed offer info:", offerResp);
-          this.$notify(
-            {
-              group: "alert",
-              type: "warning",
-              title: "Error",
-              text: "Got error retrieving linked offer data.",
-            },
-            5000,
-          );
         }
       }
 
       // retrieve the list of confirmers
-      const confirmerInfo = await libsUtil.retrieveConfirmerIdList(
-        this.apiServer,
-        claimId,
-        this.veriClaim.issuer,
-        userDid,
-      );
-      if (confirmerInfo) {
-        this.confirmerIdList = confirmerInfo.confirmerIdList;
-        this.confsVisibleToIdList = confirmerInfo.confsVisibleToIdList;
-        this.numConfsNotVisible = confirmerInfo.numConfsNotVisible;
+      const confirmUrl =
+        this.apiServer +
+        "/api/report/issuersWhoClaimedOrConfirmed?claimId=" +
+        encodeURIComponent(serverUtil.stripEndorserPrefix(claimId));
+      const confirmHeaders = await serverUtil.getHeaders(userDid);
+      const response = await this.axios.get(confirmUrl, {
+        headers: confirmHeaders,
+      });
+      if (response.status === 200) {
+        const resultList1 = response.data.result || [];
+        //const publicUrls = resultList.publicUrls || [];
+        delete resultList1.publicUrls;
+        const resultList2 = R.reject(serverUtil.isHiddenDid, resultList1);
+        const resultList3 = R.reject(
+          (did: string) => did === this.veriClaim.issuer,
+          resultList2,
+        );
+        this.confirmerIdList = resultList3;
+        this.numConfsNotVisible = resultList1.length - resultList2.length;
+        if (resultList3.length === resultList2.length) {
+          // the issuer was not in the "visible" list so they must be hidden
+          // so subtract them from the non-visible confirmers count
+          this.numConfsNotVisible = this.numConfsNotVisible - 1;
+        }
+        this.confsVisibleToIdList =
+          response.data.result.resultVisibleToDids || [];
       } else {
         this.confsVisibleErrorMessage =
           "Had problems retrieving confirmations.";
@@ -785,7 +685,7 @@ export default class ClaimView extends Vue {
           title: "Error",
           text: "Something went wrong retrieving claim data.",
         },
-        3000,
+        -1,
       );
     }
   }
@@ -808,53 +708,31 @@ export default class ClaimView extends Vue {
             group: "alert",
             type: "danger",
             title: "Error",
-            text: "There was a problem getting that claim.",
+            text: "There was a problem getting that claim. See logs for more info.",
           },
-          5000,
+          -1,
         );
       }
     } catch (error: unknown) {
       console.error("Error retrieving full claim:", error);
       const serverError = error as AxiosError;
       if (serverError.response?.status === 403) {
-        let issuerPhrase = "";
-        const issuerContact = serverUtil.contactForDid(
-          this.veriClaim.issuer,
-          this.allContacts,
-        );
-        if (issuerContact?.name) {
-          issuerPhrase +=
-            "Ask " +
-            issuerContact.name +
-            " to show you the full claim details.";
-        }
-        if (
-          this.confirmerIdList.length > 0 ||
-          this.confsVisibleToIdList.length > 0
-        ) {
-          if (issuerContact?.name) {
-            issuerPhrase +=
-              "You could also ask someone in the Confirmations section to make an introduction.";
-          } else {
-            issuerPhrase +=
-              "Ask someone in the Confirmations section to make an introduction.";
-          }
-        }
         this.fullClaimMessage =
           "You are not authorized to view the full contents of this claim." +
-          issuerPhrase +
-          " You might ask someone in your network -- like the person who registered you --" +
-          " if they can find out more and make an introduction: " +
-          " send them this page and see if they can make a connection for you.";
+          " To see all the details, ask the issuer to allow you to see their claims." +
+          " If you cannot see the issuer's DID, ask someone in the Confirmations section above." +
+          " If there are no connections, you will have to ask people in your" +
+          " network for their help, some other way; send them to this page and" +
+          " see if they can make a connection for you.";
       } else {
         this.$notify(
           {
             group: "alert",
             type: "danger",
             title: "Error",
-            text: "Something went wrong retrieving that claim.",
+            text: "Something went wrong retrieving that claim. See logs for more info.",
           },
-          5000,
+          -1,
         );
       }
     }
@@ -915,9 +793,9 @@ export default class ClaimView extends Vue {
           group: "alert",
           type: "danger",
           title: "Error",
-          text: "There was a problem submitting the confirmation.",
+          text: "There was a problem submitting the confirmation. See logs for more info.",
         },
-        5000,
+        -1,
       );
     }
   }
@@ -933,7 +811,7 @@ export default class ClaimView extends Vue {
   }
 
   openFulfillGiftDialog() {
-    const giver: libsUtil.GiverReceiverInputInfo = {
+    const giver: GiverReceiverInputInfo = {
       did: libsUtil.offerGiverDid(
         this.veriClaim as GenericCredWrapper<OfferVerifiableCredential>,
       ),
@@ -963,10 +841,9 @@ export default class ClaimView extends Vue {
   }
 
   onClickShareClaim() {
-    this.copyToClipboard("A link to this page", this.windowLocation);
     window.navigator.share({
       title: "Help Connect Me",
-      text: "I'm trying to find the people who recorded this. Can you help me?",
+      text: "I'm trying to find the full details of this claim. Can you help me?",
       url: this.windowLocation,
     });
   }
@@ -992,12 +869,6 @@ export default class ClaimView extends Vue {
         },
       };
       (this.$router as Router).push(route);
-    } else if (this.veriClaim.claimType === "PlanAction") {
-      const route = {
-        name: "new-edit-project",
-        query: { projectId: this.veriClaim.handleId },
-      };
-      (this.$router as Router).push(route);
     } else {
       console.error(
         "Unrecognized claim type for edit:",
@@ -1016,37 +887,3 @@ export default class ClaimView extends Vue {
   }
 }
 </script>
-<style>
-/*
-  Tooltip, generated on "title" attributes on "fa" icons
-  Kudos to https://www.w3schools.com/css/css_tooltip.asp
-*/
-/* Tooltip container */
-.tooltip {
-  position: relative;
-  display: inline-block;
-  border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
-}
-
-/* Tooltip text */
-.tooltip .tooltiptext {
-  visibility: hidden;
-  width: 200px;
-  background-color: black;
-  color: #fff;
-  text-align: center;
-  padding: 5px 0;
-  border-radius: 6px;
-
-  position: absolute;
-  z-index: 1;
-}
-
-/* Show the tooltip text when you mouse over the tooltip container */
-.tooltip:hover .tooltiptext {
-  visibility: visible;
-}
-.tooltip:hover .tooltiptext-left {
-  visibility: visible;
-}
-</style>

src/views/ConfirmGiftView.vue

@@ -25,7 +25,7 @@
         >
           Do you agree?
         </span>
-        <span v-else> Confirmation Details </span>
+        <span v-else> Details </span>
       </h1>
     </div>
 
@@ -54,15 +54,22 @@
           Confirm
           <fa icon="circle-check" class="ml-2 text-white cursor-pointer" />
         </button>
+        <a
+          v-if="isRegistered"
+          class="col-span-1 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-2 px-4 py-2 rounded-md"
+          :href="urlForNewGive"
+        >
+          Record a Similar One
+        </a>
       </div>
 
       <!-- Details -->
       <div class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mt-4">
-        <div class="flex gap-4 overflow-hidden">
+        <div class="block flex gap-4 overflow-hidden">
           <div class="overflow-hidden">
             <div class="text-sm">
               <div>
-                <fa icon="arrow-left" class="fa-fw text-slate-400" />
+                <fa icon="arrow-down" class="fa-fw text-slate-400" />
                 {{ giverName }}
               </div>
               <div class="ml-6">gave</div>
@@ -77,7 +84,7 @@
               </div>
               <div class="ml-6">to</div>
               <div>
-                <fa icon="arrow-right" class="fa-fw text-slate-400" />
+                <fa icon="arrow-up" class="fa-fw text-slate-400" />
                 {{ recipientName }}
               </div>
               <div>
@@ -93,7 +100,7 @@
                 <router-link
                   :to="
                     '/project/' +
-                    encodeURIComponent(giveDetails?.fulfillsPlanHandleId || '')
+                    encodeURIComponent(giveDetails?.fulfillsPlanHandleId)
                   "
                   class="text-blue-500 mt-2 cursor-pointer"
                   target="_blank"
@@ -114,7 +121,7 @@
                 <router-link
                   :to="
                     '/claim/' +
-                    encodeURIComponent(giveDetails?.fulfillsHandleId || '')
+                    encodeURIComponent(giveDetails?.fulfillsHandleId)
                   "
                   class="text-blue-500 mt-2 cursor-pointer"
                   target="_blank"
@@ -122,7 +129,7 @@
                   This fulfills
                   {{
                     capitalizeAndInsertSpacesBeforeCapsWithAPrefix(
-                      giveDetails?.fulfillsType || "",
+                      giveDetails.fulfillsType,
                     )
                   }}
                   <fa icon="arrow-up-right-from-square" class="fa-fw" />
@@ -165,7 +172,7 @@
             Nobody that you know issued or confirmed this claim.
           </div>
           <div v-if="confirmerIdList.length > 0">
-            The following people confirmed this claim.
+            The following people issued or confirmed this claim.
             <ul class="ml-4">
               <li
                 v-for="confirmerId in confirmerIdList"
@@ -250,20 +257,19 @@
           count as confirming it.
         </div>
         <div v-else-if="serverUtil.containsHiddenDid(veriClaim.claim)">
-          You cannot confirm this because some people are hidden.
+          You cannot confirm this because it contains hidden identifiers.
         </div>
       </div>
 
-      <!-- Note that a similar section is found in ClaimView.vue, and kinda in HiddenDidDialog.vue -->
       <h2
-        class="font-bold uppercase text-xl text-blue-500 mt-8 cursor-pointer"
-        @click="showVeriClaimDump = !showVeriClaimDump"
+        class="font-bold uppercase text-xl text-blue-500 mt-8 mb-2 cursor-pointer"
+        @click="showDetails = !showDetails"
       >
-        Details
-        <fa v-if="showVeriClaimDump" icon="chevron-up" />
-        <fa v-else icon="chevron-right" />
+        {{ serverUtil.containsHiddenDid(veriClaim) ? "Visible " : "" }}Details
+        <span v-if="!showDetails"><fa icon="chevron-down" /></span>
+        <span v-else><fa icon="chevron-up" /></span>
       </h2>
-      <div v-if="showVeriClaimDump">
+      <div v-if="showDetails">
         <div
           v-if="
             serverUtil.containsHiddenDid(veriClaim) &&
@@ -274,26 +280,22 @@
           Some of the details are not visible to you; they show as "HIDDEN".
           They are not visible to any of your direct contacts, either.
           <span v-if="canShare">
-            You can ask one of your contacts to take a look and see if their
-            contacts can see more details:
+            If you'd like to ask any of your contacts to take a look and see if
+            their contacts can see more details,
             <a @click="onClickShareClaim()" class="text-blue-500"
-              >click to send them this page info</a
+              >click to send them this info</a
             >
-            and see if they can make an introduction. Someone is connected to
-            people closer to them; if you don't know who to ask, try the person
-            who registered you.
+            and see if they are willing to make an introduction.
           </span>
           <span v-else>
-            You can ask one of your contacts to take a look and see if their
-            contacts can see more details:
+            If you'd like to ask any of your contacts to take a look and see if
+            their contacts can see more details,
             <a
-              @click="copyToClipboard('A link to this page', windowLocation)"
+              @click="copyToClipboard('Location', windowLocation.href)"
               class="text-blue-500"
-              >click to copy this page info</a
+              >share this page with them</a
             >
-            and see if they can make an introduction. Someone is connected to
-            people closer to them; if you don't know who to ask, try the person
-            who registered you.
+            and see if they are willing to make an introduction.
           </span>
         </div>
 
@@ -310,7 +312,7 @@
           <span v-else>
             If you'd like an introduction,
             <a
-              @click="copyToClipboard('A link to this page', windowLocation)"
+              @click="copyToClipboard('Location', windowLocation.href)"
               class="text-blue-500"
               >share this page with them and ask if they'll tell you more about
               about the participants.</a
@@ -370,29 +372,20 @@
           class="text-sm overflow-x-scroll px-4 py-3 bg-slate-100 rounded-md"
           >{{ veriClaimDump }}</pre
         >
-        <div class="mt-2 ml-2">
-          <a
-            @click="showClaimPage(veriClaim.id)"
-            class="text-blue-500 cursor-pointer"
-          >
-            <fa icon="file-lines" />
-            See All Generic Info
-          </a>
-        </div>
-        <div class="mt-2 ml-2">
-          <a
-            v-if="isRegistered"
-            class="text-blue-500 cursor-pointer"
-            :href="urlForNewGive"
-          >
-            <fa icon="file-lines" />
-            Record a Give Similar to the Original
-          </a>
-        </div>
       </div>
     </div>
     <div v-else-if="!isLoading">This does not have details to confirm.</div>
 
+    <div class="mt-4" v-if="!isLoading">
+      <a
+        @click="showClaimPage(veriClaim.id)"
+        class="text-blue-500 cursor-pointer"
+      >
+        <fa icon="file-lines" class="pl-2" />
+        All Generic Info
+      </a>
+    </div>
+
     <div
       class="fixed left-6 bottom-24 text-center text-4xl leading-none bg-slate-400 text-white w-14 py-2.5 rounded-full"
       v-if="isLoading"
@@ -412,12 +405,14 @@ import { Router } from "vue-router";
 
 import QuickNav from "@/components/QuickNav.vue";
 import { NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
+import { accountsDB, db } from "@/db/index";
+import { Account } from "@/db/tables/accounts";
 import { Contact } from "@/db/tables/contacts";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
 import * as serverUtil from "@/libs/endorserServer";
 import { displayAmount, GiveSummaryRecord } from "@/libs/endorserServer";
 import * as libsUtil from "@/libs/util";
-import { isGiveAction, retrieveAccountDids } from "@/libs/util";
+import { isGiveAction } from "@/libs/util";
 import TopMessage from "@/components/TopMessage.vue";
 
 @Component({
@@ -443,12 +438,12 @@ export default class ClaimView extends Vue {
   isRegistered = false;
   numConfsNotVisible = 0; // number of hidden DIDs in the confirmerIdList, minus the issuer if they aren't visible
   recipientName = "";
-  showVeriClaimDump = false;
+  showDetails = false;
   urlForNewGive = "";
   veriClaim = serverUtil.BLANK_GENERIC_SERVER_RECORD;
   veriClaimDump = "";
   veriClaimDidsVisible = {};
-  windowLocation = window.location.href;
+  windowLocation = window.location;
 
   R = R;
   yaml = yaml;
@@ -469,13 +464,17 @@ export default class ClaimView extends Vue {
 
   async mounted() {
     this.isLoading = true;
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
+    await db.open();
+    const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+    this.activeDid = settings?.activeDid || "";
+    this.apiServer = settings?.apiServer || "";
     this.allContacts = await db.contacts.toArray();
-    this.isRegistered = settings.isRegistered || false;
+    this.isRegistered = settings?.isRegistered || false;
 
-    this.allMyDids = await retrieveAccountDids();
+    await accountsDB.open();
+    const accounts = accountsDB.accounts;
+    const accountsArr: Array<Account> = await accounts?.toArray();
+    this.allMyDids = accountsArr.map((acc) => acc.did);
 
     const pathParam = window.location.pathname.substring(
       "/confirm-gift/".length,
@@ -658,21 +657,39 @@ export default class ClaimView extends Vue {
       }
       if (this.giveDetails.fulfillsPlanHandleId) {
         this.urlForNewGive +=
-          "&fulfillsProjectId=" +
+          "&projectId=" +
           encodeURIComponent(this.giveDetails.fulfillsPlanHandleId);
       }
 
       // retrieve the list of confirmers
-      const confirmerInfo = await libsUtil.retrieveConfirmerIdList(
-        this.apiServer,
-        claimId,
-        this.veriClaim.issuer,
-        userDid,
-      );
-      if (confirmerInfo) {
-        this.confirmerIdList = confirmerInfo.confirmerIdList;
-        this.confsVisibleToIdList = confirmerInfo.confsVisibleToIdList;
-        this.numConfsNotVisible = confirmerInfo.numConfsNotVisible;
+      const confirmUrl =
+        this.apiServer +
+        "/api/report/issuersWhoClaimedOrConfirmed?claimId=" +
+        encodeURIComponent(serverUtil.stripEndorserPrefix(claimId));
+      const confirmHeaders = await serverUtil.getHeaders(userDid);
+      const response = await this.axios.get(confirmUrl, {
+        headers: confirmHeaders,
+      });
+      if (response.status === 200) {
+        const resultList1 = response.data.result || [];
+        //const publicUrls = resultList.publicUrls || [];
+        delete resultList1.publicUrls;
+        // remove any hidden DIDs
+        const resultList2 = R.reject(serverUtil.isHiddenDid, resultList1);
+        // remove confirmations by this user
+        const resultList3 = R.reject(
+          (did: string) => did === this.giveDetails?.issuerDid,
+          resultList2,
+        );
+        this.confirmerIdList = resultList3;
+        this.numConfsNotVisible = resultList1.length - resultList2.length;
+        if (resultList3.length === resultList2.length) {
+          // the issuer was not in the "visible" list so they must be hidden
+          // so subtract them from the non-visible confirmers count
+          this.numConfsNotVisible = this.numConfsNotVisible - 1;
+        }
+        this.confsVisibleToIdList =
+          response.data.result.resultVisibleToDids || [];
       } else {
         this.confsVisibleErrorMessage =
           "Had problems retrieving confirmations.";
@@ -747,7 +764,7 @@ export default class ClaimView extends Vue {
           group: "alert",
           type: "danger",
           title: "Error",
-          text: "There was a problem submitting the confirmation.",
+          text: "There was a problem submitting the confirmation. See logs for more info.",
         },
         5000,
       );
@@ -781,17 +798,6 @@ export default class ClaimView extends Vue {
   }
 
   notifyWhyCannotConfirm() {
-    libsUtil.notifyWhyCannotConfirm(
-      this.$notify,
-      this.isRegistered,
-      this.veriClaim.claimType,
-      this.giveDetails,
-      this.activeDid,
-      this.confirmerIdList,
-    );
-  }
-
-  notifyWhyCannotConfirmBak() {
     if (!this.isRegistered) {
       this.$notify(
         {
@@ -838,7 +844,7 @@ export default class ClaimView extends Vue {
           group: "alert",
           type: "info",
           title: "Cannot Confirm",
-          text: "You cannot confirm this because some people are hidden.",
+          text: "You cannot confirm this because it contains hidden identifiers.",
         },
         3000,
       );
@@ -848,7 +854,7 @@ export default class ClaimView extends Vue {
           group: "alert",
           type: "info",
           title: "Cannot Confirm",
-          text: "You cannot confirm this claim. There are no other details, but we can help more if you contact us and send us screenshots.",
+          text: "You cannot confirm this claim.",
         },
         3000,
       );
@@ -856,11 +862,10 @@ export default class ClaimView extends Vue {
   }
 
   onClickShareClaim() {
-    this.copyToClipboard("A link to this page", this.windowLocation);
     window.navigator.share({
       title: "Help Connect Me",
       text: "I'm trying to find the full details of this claim. Can you help me?",
-      url: this.windowLocation,
+      url: this.windowLocation.href,
     });
   }
 }

src/views/ContactAmountsView.vue

@@ -112,8 +112,9 @@ import { Router } from "vue-router";
 
 import QuickNav from "@/components/QuickNav.vue";
 import { NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
+import { accountsDB, db } from "@/db/index";
 import { Contact } from "@/db/tables/contacts";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import {
   AgreeVerifiableCredential,
   createEndorserJwtVcFromClaim,
@@ -123,7 +124,6 @@ import {
   GiveVerifiableCredential,
   SCHEMA_ORG_CONTEXT,
 } from "@/libs/endorserServer";
-import { retrieveAccountCount } from "@/libs/util";
 
 @Component({ components: { QuickNav } })
 export default class ContactAmountssView extends Vue {
@@ -138,17 +138,19 @@ export default class ContactAmountssView extends Vue {
   displayAmount = displayAmount;
 
   async beforeCreate() {
-    this.numAccounts = await retrieveAccountCount();
+    await accountsDB.open();
+    this.numAccounts = await accountsDB.accounts.count();
   }
 
   async created() {
     try {
+      await db.open();
       const contactDid = (this.$route as Router).query["contactDid"] as string;
       this.contact = (await db.contacts.get(contactDid)) || null;
 
-      const settings = await retrieveSettingsForActiveAccount();
-      this.activeDid = settings?.activeDid || "";
-      this.apiServer = settings?.apiServer || "";
+      const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+      this.activeDid = (settings?.activeDid as string) || "";
+      this.apiServer = (settings?.apiServer as string) || "";
 
       if (this.activeDid && this.contact) {
         this.loadGives(this.activeDid, this.contact);
@@ -165,7 +167,7 @@ export default class ContactAmountssView extends Vue {
             err.userMessage ||
             "There was an error retrieving your settings or contacts or gives.",
         },
-        5000,
+        -1,
       );
     }
   }
@@ -196,7 +198,7 @@ export default class ContactAmountssView extends Vue {
             title: "Error With Server",
             text: "Got an error retrieving your given time from the server.",
           },
-          5000,
+          -1,
         );
       }
 
@@ -223,7 +225,7 @@ export default class ContactAmountssView extends Vue {
             title: "Error With Server",
             text: "Got an error retrieving your given time from the server.",
           },
-          5000,
+          -1,
         );
       }
 
@@ -241,7 +243,7 @@ export default class ContactAmountssView extends Vue {
           title: "Error With Server",
           text: error as string,
         },
-        5000,
+        -1,
       );
     }
   }
@@ -278,7 +280,7 @@ export default class ContactAmountssView extends Vue {
           (origClaim.object?.amountOfThisGood as number) || 1;
       }
     } catch (error) {
-      let userMessage = "There was an error.";
+      let userMessage = "There was an error. See logs for more info.";
       const serverError = error as AxiosError;
       if (serverError) {
         if (serverError.message) {
@@ -297,7 +299,7 @@ export default class ContactAmountssView extends Vue {
           title: "Error With Server",
           text: userMessage,
         },
-        5000,
+        -1,
       );
     }
   }
@@ -310,7 +312,7 @@ export default class ContactAmountssView extends Vue {
         title: "Not Allowed",
         text: "Only the recipient can confirm final receipt.",
       },
-      5000,
+      -1,
     );
   }
 }

src/views/ContactEditView.vue

@@ -1,238 +0,0 @@
-<template>
-  <QuickNav selected="Contacts" />
-  <TopMessage />
-
-  <section id="ContactEdit" class="p-6 max-w-3xl mx-auto">
-    <div id="ViewBreadcrumb" class="mb-8">
-      <h1 class="text-4xl text-center font-light relative px-7">
-        <!-- Back -->
-        <button
-          @click="$router.go(-1)"
-          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
-        >
-          <fa icon="chevron-left" class="fa-fw" />
-        </button>
-        {{ contact.name || AppString.NO_CONTACT_NAME }}
-      </h1>
-    </div>
-
-    <!-- Contact Name -->
-    <div class="mt-4 flex" data-testId="contactName">
-      <label
-        for="contactName"
-        class="block text-sm font-medium text-gray-700 mt-2"
-      >
-        Name
-      </label>
-      <input
-        type="text"
-        class="block w-full ml-2 mt-1 border border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
-        v-model="contactName"
-      />
-    </div>
-
-    <!-- Contact Notes -->
-    <div class="mt-4">
-      <label for="contactNotes" class="block text-sm font-medium text-gray-700">
-        Notes
-      </label>
-      <textarea
-        id="contactNotes"
-        rows="4"
-        class="block w-full mt-1 border border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
-        v-model="contactNotes"
-      ></textarea>
-    </div>
-
-    <!-- Contact Methods -->
-    <div class="mt-4">
-      <h2 class="text-lg font-medium text-gray-700">Contact Methods</h2>
-      <div
-        v-for="(method, index) in contactMethods"
-        :key="index"
-        class="flex mt-2"
-      >
-        <input
-          type="text"
-          v-model="method.label"
-          class="block w-1/4 border border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
-          placeholder="Label"
-        />
-        <input
-          type="text"
-          v-model="method.type"
-          class="block ml-2 w-1/4 border border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
-          placeholder="Type"
-        />
-        <div class="relative">
-          <button
-            @click="toggleDropdown(index)"
-            class="px-2 py-1 bg-gray-200 rounded-md"
-          >
-            <fa icon="caret-down" class="fa-fw" />
-          </button>
-          <div
-            v-if="dropdownIndex === index"
-            class="absolute bg-white border border-gray-300 rounded-md mt-1"
-          >
-            <div
-              @click="setMethodType(index, 'CELL')"
-              class="px-4 py-2 hover:bg-gray-100 cursor-pointer"
-            >
-              CELL
-            </div>
-            <div
-              @click="setMethodType(index, 'EMAIL')"
-              class="px-4 py-2 hover:bg-gray-100 cursor-pointer"
-            >
-              EMAIL
-            </div>
-            <div
-              @click="setMethodType(index, 'WHATSAPP')"
-              class="px-4 py-2 hover:bg-gray-100 cursor-pointer"
-            >
-              WHATSAPP
-            </div>
-          </div>
-        </div>
-        <input
-          type="text"
-          v-model="method.value"
-          class="block ml-2 w-1/2 border border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
-          placeholder="Number, email, etc."
-        />
-        <button @click="removeContactMethod(index)" class="ml-2 text-red-500">
-          <fa icon="trash-can" class="fa-fw" />
-        </button>
-      </div>
-      <button @click="addContactMethod" class="mt-2">
-        <fa
-          icon="plus"
-          class="fa-fw px-2 py-2.5 bg-green-500 text-green-100 rounded-full"
-        />
-      </button>
-    </div>
-
-    <!-- Save Button -->
-    <div class="mt-8 flex justify-between">
-      <button
-        class="px-4 py-2 bg-blue-500 text-white rounded-md"
-        @click="saveEdit"
-      >
-        Save
-      </button>
-      <button
-        class="ml-4 px-4 py-2 bg-slate-500 text-white rounded-md"
-        @click="$router.go(-1)"
-      >
-        Cancel
-      </button>
-    </div>
-  </section>
-</template>
-
-<script lang="ts">
-import * as R from "ramda";
-import { Component, Vue } from "vue-facing-decorator";
-import { RouteLocation, Router } from "vue-router";
-
-import QuickNav from "@/components/QuickNav.vue";
-import TopMessage from "@/components/TopMessage.vue";
-import { AppString, NotificationIface } from "@/constants/app";
-import { db } from "@/db/index";
-import { Contact, ContactMethod } from "@/db/tables/contacts";
-
-@Component({
-  components: {
-    QuickNav,
-    TopMessage,
-  },
-})
-export default class ContactEditView extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  contact: Contact = {
-    did: "",
-    name: "",
-    notes: "",
-  };
-  contactName = "";
-  contactNotes = "";
-  contactMethods: Array<ContactMethod> = [];
-  dropdownIndex: number | null = null;
-
-  AppString = AppString;
-
-  async created() {
-    const contactDid = (this.$route as RouteLocation).params.did;
-    const contact = await db.contacts.get(contactDid || "");
-    if (contact) {
-      this.contact = contact;
-      this.contactName = contact.name || "";
-      this.contactNotes = contact.notes || "";
-      this.contactMethods = contact.contactMethods || [];
-    } else {
-      this.$notify({
-        group: "alert",
-        type: "danger",
-        title: "Contact Not Found",
-        text: "There is no contact with DID " + contactDid,
-      });
-      (this.$router as Router).push({ path: "/contacts" });
-      return;
-    }
-  }
-
-  addContactMethod() {
-    this.contactMethods.push({ label: "", type: "", value: "" });
-  }
-
-  removeContactMethod(index: number) {
-    this.contactMethods.splice(index, 1);
-  }
-
-  toggleDropdown(index: number) {
-    this.dropdownIndex = this.dropdownIndex === index ? null : index;
-  }
-
-  setMethodType(index: number, type: string) {
-    this.contactMethods[index].type = type;
-    this.dropdownIndex = null;
-  }
-
-  async saveEdit() {
-    // without this conversion, "Failed to execute 'put' on 'IDBObjectStore': [object Array] could not be cloned."
-    const contactMethodsObj = JSON.parse(JSON.stringify(this.contactMethods));
-    const contactMethods = contactMethodsObj.map((method: ContactMethod) =>
-      R.set(R.lensProp("type"), method.type.toUpperCase(), method),
-    );
-    if (!R.equals(contactMethodsObj, contactMethods)) {
-      this.contactMethods = contactMethods;
-      this.$notify(
-        {
-          group: "alert",
-          type: "warning",
-          title: "Contact Methods Updated",
-          text: "Note that some methods have been updated, such as uppercasing 'email' to 'EMAIL'. Save again if the changes are acceptable.",
-        },
-        15000,
-      );
-      return;
-    }
-    await db.contacts.update(this.contact.did, {
-      name: this.contactName,
-      notes: this.contactNotes,
-      contactMethods: contactMethods,
-    });
-    this.$notify({
-      group: "alert",
-      type: "success",
-      title: "Contact Saved",
-      text: "The contact info has been updated successfully.",
-    });
-    (this.$router as Router).push({
-      path: "/did/" + encodeURIComponent(this.contact.did),
-    });
-  }
-}
-</script>

src/views/ContactGiftingView.vue

@@ -11,7 +11,8 @@
           class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
           ><fa icon="chevron-left" class="fa-fw"></fa
         ></router-link>
-        Given by...
+
+        Give to Contacts
       </h1>
     </div>
 
@@ -65,21 +66,21 @@
       </li>
     </ul>
 
-    <GiftedDialog ref="customDialog" :toProjectId="projectId" />
+    <GiftedDialog ref="customDialog" :projectId="projectId" />
   </section>
 </template>
 
 <script lang="ts">
 import { Component, Vue } from "vue-facing-decorator";
-import { Router } from "vue-router";
 
 import GiftedDialog from "@/components/GiftedDialog.vue";
 import QuickNav from "@/components/QuickNav.vue";
 import EntityIcon from "@/components/EntityIcon.vue";
 import { NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
+import { db } from "@/db/index";
 import { Contact } from "@/db/tables/contacts";
-import { GiverReceiverInputInfo } from "@/libs/util";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
+import { GiverReceiverInputInfo } from "@/libs/endorserServer";
 
 @Component({
   components: { GiftedDialog, QuickNav, EntityIcon },
@@ -90,15 +91,14 @@ export default class ContactGiftingView extends Vue {
   activeDid = "";
   allContacts: Array<Contact> = [];
   apiServer = "";
-  description = "";
-  projectId = "";
-  prompt = "";
+  projectId = localStorage.getItem("projectId") || "";
 
   async created() {
     try {
-      const settings = await retrieveSettingsForActiveAccount();
-      this.apiServer = settings.apiServer || "";
-      this.activeDid = settings.activeDid || "";
+      await db.open();
+      const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+      this.apiServer = settings?.apiServer || "";
+      this.activeDid = settings?.activeDid || "";
 
       // .orderBy("name") wouldn't retrieve any entries with a blank name
       // .toCollection.sortBy("name") didn't sort in an order I understood
@@ -107,9 +107,7 @@ export default class ContactGiftingView extends Vue {
         (a.name || "").localeCompare(b.name || ""),
       );
 
-      this.projectId = (this.$route as Router).query["projectId"] || "";
-
-      this.prompt = (this.$route as Router).query["prompt"] ?? this.prompt;
+      localStorage.removeItem("projectId");
 
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (err: any) {
@@ -123,7 +121,7 @@ export default class ContactGiftingView extends Vue {
             err.message ||
             "There was an error retrieving your settings or contacts.",
         },
-        5000,
+        -1,
       );
     }
   }
@@ -137,7 +135,6 @@ export default class ContactGiftingView extends Vue {
       recipient,
       undefined,
       "Given by " + (giver?.name || "someone not named"),
-      this.prompt,
     );
   }
 }

src/views/ContactImportView.vue

@@ -16,134 +16,86 @@
       Contact Import
     </h1>
 
-    <div v-if="checkingImports" class="text-center">
-      <fa icon="spinner" class="animate-spin" />
+    <span>
+      Note that you will have to make them visible one-by-one in the list of
+      Contacts.
+    </span>
+    <div v-if="sameCount > 0">
+      <span v-if="sameCount == 1"
+        >One contact is the same as an existing contact</span
+      >
+      <span v-else
+        >{{ sameCount }} contacts are the same as existing contacts</span
+      >
     </div>
-    <div v-else>
-      <span
-        v-if="contactsImporting.length > sameCount"
-        class="flex justify-center"
-      >
-        <input type="checkbox" v-model="makeVisible" class="mr-2" />
-        Make my activity visible to these contacts.
-      </span>
 
-      <div v-if="sameCount > 0">
-        <span v-if="sameCount == 1"
-          >One contact is the same as an existing contact</span
+    <!-- Results List -->
+    <ul v-if="contactsImporting.length > 0" class="border-t border-slate-300">
+      <li v-for="(contact, index) in contactsImporting" :key="contact.did">
+        <div
+          v-if="
+            !contactsExisting[contact.did] ||
+            !R.isEmpty(contactDifferences[contact.did])
+          "
+          class="grow overflow-hidden border-b border-slate-300 pt-2.5 pb-4"
         >
-        <span v-else
-          >{{ sameCount }} contacts are the same as existing contacts</span
-        >
-      </div>
-
-      <!-- Results List -->
-      <ul
-        v-if="contactsImporting.length > sameCount"
-        class="border-t border-slate-300"
-      >
-        <li v-for="(contact, index) in contactsImporting" :key="contact.did">
-          <div
-            v-if="
-              !contactsExisting[contact.did] ||
-              !R.isEmpty(contactDifferences[contact.did])
-            "
-            class="grow overflow-hidden border-b border-slate-300 pt-2.5 pb-4"
-          >
-            <h2 class="text-base font-semibold">
-              <input type="checkbox" v-model="contactsSelected[index]" />
-              {{ contact.name || AppString.NO_CONTACT_NAME }}
-              -
-              <span v-if="contactsExisting[contact.did]" class="text-orange-500"
-                >Existing</span
+          <h2 class="text-base font-semibold">
+            <input type="checkbox" v-model="contactsSelected[index]" />
+            {{ contact.name || AppString.NO_CONTACT_NAME }}
+            -
+            <span v-if="contactsExisting[contact.did]" class="text-orange-500"
+              >Existing</span
+            >
+            <span v-else class="text-green-500">New</span>
+          </h2>
+          <div class="text-sm truncate">
+            {{ contact.did }}
+          </div>
+          <div v-if="contactDifferences[contact.did]">
+            <div>
+              <div class="grid grid-cols-3 gap-2">
+                <div class="font-bold">Field</div>
+                <div class="font-bold">Old Value</div>
+                <div class="font-bold">New Value</div>
+              </div>
+              <div
+                v-for="(value, contactField) in contactDifferences[contact.did]"
+                :key="contactField"
+                class="grid grid-cols-3 border"
               >
-              <span v-else class="text-green-500">New</span>
-            </h2>
-            <div class="text-sm truncate">
-              {{ contact.did }}
-            </div>
-            <div v-if="contactDifferences[contact.did]">
-              <div>
-                <div class="grid grid-cols-3 gap-2">
-                  <div></div>
-                  <div class="font-bold">Old Value</div>
-                  <div class="font-bold">New Value</div>
-                </div>
-                <div
-                  v-for="(value, contactField) in contactDifferences[
-                    contact.did
-                  ]"
-                  :key="contactField"
-                  class="grid grid-cols-3 border"
-                >
-                  <div class="border font-bold p-1">
-                    {{ capitalizeAndInsertSpacesBeforeCaps(contactField) }}
-                  </div>
-                  <div class="border p-1">{{ value.old }}</div>
-                  <div class="border p-1">{{ value.new }}</div>
-                </div>
+                <div class="border p-1">{{ contactField }}</div>
+                <div class="border p-1">{{ value.old }}</div>
+                <div class="border p-1">{{ value.new }}</div>
               </div>
             </div>
           </div>
-        </li>
-        <button
-          class="bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-sm text-white mt-2 px-2 py-1.5 rounded"
-          @click="importContacts"
-        >
-          Import Selected Contacts
-        </button>
-      </ul>
-      <p v-else-if="contactsImporting.length > 0">
-        All those contacts are already in your list with the same information.
-      </p>
-      <div v-else>
-        There are no contacts in that import. If some were sent, try again to
-        get the full text and paste it. (Note that iOS cuts off data in text
-        messages.) Ask the person to send the data a different way, eg. email.
-        <div class="mt-4 text-center">
-          <textarea
-            v-model="inputJwt"
-            placeholder="Contact-import data"
-            class="mt-4 border-2 border-gray-300 p-2 rounded"
-            cols="30"
-            @input="() => checkContactJwt(inputJwt)"
-          />
-          <br />
-          <button
-            @click="() => processContactJwt(inputJwt)"
-            class="ml-2 p-2 bg-blue-500 text-white rounded"
-          >
-            Check Import
-          </button>
         </div>
-      </div>
-    </div>
+      </li>
+      <fa icon="spinner" v-if="importing" class="animate-spin" />
+      <button
+        v-else
+        class="bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-sm text-white mt-2 px-2 py-1.5 rounded"
+        @click="importContacts"
+      >
+        Import Selected Contacts
+      </button>
+    </ul>
+    <p v-else>There are no contacts to import.</p>
   </section>
 </template>
 
 <script lang="ts">
 import * as R from "ramda";
 import { Component, Vue } from "vue-facing-decorator";
-import { RouteLocationNormalizedLoaded, Router } from "vue-router";
+import { Router } from "vue-router";
 
+import { AppString, NotificationIface } from "@/constants/app";
+import { db } from "@/db/index";
+import { Contact } from "@/db/tables/contacts";
+import * as libsUtil from "@/libs/util";
 import QuickNav from "@/components/QuickNav.vue";
 import EntityIcon from "@/components/EntityIcon.vue";
 import OfferDialog from "@/components/OfferDialog.vue";
-import { APP_SERVER, AppString, NotificationIface } from "@/constants/app";
-import {
-  db,
-  logConsoleAndDb,
-  retrieveSettingsForActiveAccount,
-} from "@/db/index";
-import { Contact, ContactMethod } from "@/db/tables/contacts";
-import * as libsUtil from "@/libs/util";
-import { decodeEndorserJwt } from "@/libs/crypto/vc";
-import {
-  capitalizeAndInsertSpacesBeforeCaps,
-  errorStringForLog,
-  setVisibilityUtil,
-} from "@/libs/endorserServer";
-import { getContactJwtFromJwtUrl } from "@/libs/crypto";
 
 @Component({
   components: { EntityIcon, OfferDialog, QuickNav },
@@ -152,83 +104,27 @@ export default class ContactImportView extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
   AppString = AppString;
-  capitalizeAndInsertSpacesBeforeCaps = capitalizeAndInsertSpacesBeforeCaps;
   libsUtil = libsUtil;
   R = R;
 
-  activeDid = "";
-  apiServer = "";
   contactsExisting: Record<string, Contact> = {}; // user's contacts already in the system, keyed by DID
   contactsImporting: Array<Contact> = []; // contacts from the import
   contactsSelected: Array<boolean> = []; // whether each contact in contactsImporting is selected
   contactDifferences: Record<
     string,
-    Record<
-      string,
-      {
-        new: string | boolean | Array<ContactMethod> | undefined;
-        old: string | boolean | Array<ContactMethod> | undefined;
-      }
-    >
+    Record<string, { new: string; old: string }>
   > = {}; // for existing contacts, it shows the difference between imported and existing contacts for each key
-  checkingImports = false;
-  inputJwt: string = "";
-  makeVisible = true;
+  importing = false;
   sameCount = 0;
 
   async created() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
-
-    // look for any imported contact array from the query parameter
-    const importedContacts = (this.$route as RouteLocationNormalizedLoaded)
-      .query["contacts"] as string;
-    if (importedContacts) {
-      await this.setContactsSelected(JSON.parse(importedContacts));
-    }
-
-    // look for a JWT after /contact-import/ in the window.location.pathname
-    const jwt = window.location.pathname.match(
-      /\/contact-import\/(ey.+)$/,
-    )?.[1];
-    if (jwt) {
-      // would prefer to validate but we've got an error with JWTs on QR codes generated in the future
-      // eslint-disable-next-line prettier/prettier
-      // const parsedJwt: Omit<JWTVerified, "didResolutionResult" | "signer" | "jwt"> = await decodeAndVerifyJwt(jwt);
-      // decode the JWT
-      const parsedJwt = decodeEndorserJwt(jwt);
-
-      const contacts: Array<Contact> =
-        parsedJwt.payload.contacts || // someday this will be the only payload sent to this page
-        (Array.isArray(parsedJwt.payload) ? parsedJwt.payload : undefined);
-      if (!contacts && parsedJwt.payload.own) {
-        // handle this single-contact JWT in the contacts page, better suited to single additions
-        (this.$router as Router).push({
-          name: "contacts",
-          query: { contactJwt: jwt },
-        });
-      }
-      if (contacts) {
-        await this.setContactsSelected(contacts);
-      } else {
-        // no contacts found so default message should be OK
-      }
-    }
-
-    if (
-      this.contactsImporting.length === 1 &&
-      R.isEmpty(this.contactsExisting)
-    ) {
-      // if there is only one contact and it's new, then we will automatically import it
-      this.contactsSelected[0] = true;
-      this.importContacts(); // ... which routes to the contacts list
-    }
-  }
-
-  async setContactsSelected(contacts: Array<Contact>) {
-    this.contactsImporting = contacts;
-    this.contactsSelected = new Array(this.contactsImporting.length).fill(true);
+    // Retrieve the imported contacts from the query parameter
+    const importedContacts =
+      ((this.$route as Router).query["contacts"] as string) || "[]";
+    this.contactsImporting = JSON.parse(importedContacts);
+    this.contactsSelected = new Array(this.contactsImporting.length).fill(
+      false,
+    );
 
     await db.open();
     const baseContacts = await db.contacts.toArray();
@@ -241,19 +137,12 @@ export default class ContactImportView extends Vue {
       if (existingContact) {
         this.contactsExisting[contactIn.did] = existingContact;
 
-        const differences: Record<
-          string,
-          {
-            new: string | boolean | Array<ContactMethod> | undefined;
-            old: string | boolean | Array<ContactMethod> | undefined;
-          }
-        > = {};
+        const differences: Record<string, { new: string; old: string }> = {};
         Object.keys(contactIn).forEach((key) => {
-          // eslint-disable-next-line prettier/prettier
-          if (!R.equals(contactIn[key as keyof Contact], existingContact[key as keyof Contact])) {
+          if (contactIn[key] !== existingContact[key]) {
             differences[key] = {
-              old: existingContact[key as keyof Contact],
-              new: contactIn[key as keyof Contact],
+              old: existingContact[key],
+              new: contactIn[key],
             };
           }
         });
@@ -261,66 +150,15 @@ export default class ContactImportView extends Vue {
         if (R.isEmpty(differences)) {
           this.sameCount++;
         }
-
-        // don't automatically import previous data
-        this.contactsSelected[i] = false;
-      }
-    }
-  }
-
-  // check the contact-import JWT
-  async checkContactJwt(jwtInput: string) {
-    if (
-      jwtInput.endsWith(APP_SERVER) ||
-      jwtInput.endsWith(APP_SERVER + "/") ||
-      jwtInput.endsWith("contact-import") ||
-      jwtInput.endsWith("contact-import/")
-    ) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "That is only part of the contact-import data; it's missing data at the end. Try another way to get the full data.",
-        },
-        5000,
-      );
-    }
-  }
-
-  // process the invite JWT and/or text message containing the URL with the JWT
-  async processContactJwt(jwtInput: string) {
-    this.checkingImports = true;
-
-    try {
-      // (For another approach used with invites, see InviteOneAcceptView.processInvite)
-      const jwt: string = getContactJwtFromJwtUrl(jwtInput);
-      // JWT format: { header, payload, signature, data }
-      const payload = decodeEndorserJwt(jwt).payload;
-
-      if (Array.isArray(payload.contacts)) {
-        await this.setContactsSelected(payload.contacts);
       } else {
-        throw new Error("Invalid contact-import JWT or URL: " + jwtInput);
+        // automatically import new data
+        this.contactsSelected[i] = true;
       }
-    } catch (error) {
-      const fullError = "Error importing contacts: " + errorStringForLog(error);
-      logConsoleAndDb(fullError, true);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "There was an error processing the contact-import data.",
-        },
-        3000,
-      );
     }
-    this.checkingImports = false;
   }
 
   async importContacts() {
-    this.checkingImports = true;
+    this.importing = true;
     let importedCount = 0,
       updatedCount = 0;
     for (let i = 0; i < this.contactsImporting.length; i++) {
@@ -332,54 +170,18 @@ export default class ContactImportView extends Vue {
           updatedCount++;
         } else {
           // without explicit clone on the Proxy, we get: DataCloneError: Failed to execute 'add' on 'IDBObjectStore': #<Object> could not be cloned.
-          // DataError: Failed to execute 'add' on 'IDBObjectStore': Evaluating the object store's key path yielded a value that is not a valid key.
           await db.contacts.add(R.clone(contact));
           importedCount++;
         }
       }
     }
-    if (this.makeVisible) {
-      const failedVisibileToContacts = [];
-      for (let i = 0; i < this.contactsImporting.length; i++) {
-        if (this.contactsSelected[i]) {
-          const contact = this.contactsImporting[i];
-          if (contact) {
-            const visResult = await setVisibilityUtil(
-              this.activeDid,
-              this.apiServer,
-              this.axios,
-              db,
-              contact,
-              true,
-            );
-            if (!visResult.success) {
-              failedVisibileToContacts.push(contact);
-            }
-          }
-        }
-      }
-      if (failedVisibileToContacts.length > 0) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Visibility Error",
-            text: `Failed to set visibility for ${failedVisibileToContacts.length} contact${
-              failedVisibileToContacts.length == 1 ? "" : "s"
-            }. You must set them individually: ${failedVisibileToContacts.map((c) => c.name).join(", ")}`,
-          },
-          -1,
-        );
-      }
-    }
-
-    this.checkingImports = false;
+    this.importing = false;
 
     this.$notify(
       {
         group: "alert",
         type: "success",
-        title: "Imported",
+        title: "Import Success",
         text:
           `${importedCount} contact${importedCount == 1 ? "" : "s"} imported.` +
           (updatedCount ? ` ${updatedCount} updated.` : ""),

src/views/ContactQRScanShowView.vue

@@ -10,7 +10,7 @@
           class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
           @click="$router.back()"
         >
-          <fa icon="chevron-left" class="fa-fw" />
+          <fa icon="chevron-left" class="fa-fw"></fa>
         </h1>
       </div>
 
@@ -34,8 +34,8 @@
           click here to set it for them.
         </span>
       </p>
+      <UserNameDialog ref="userNameDialog" />
     </div>
-    <UserNameDialog ref="userNameDialog" />
 
     <div
       @click="onCopyUrlToClipboard()"
@@ -90,7 +90,10 @@
 
 <script lang="ts">
 import { AxiosError } from "axios";
+import { Buffer } from "buffer/";
+import { sha256 } from "ethereum-cryptography/sha256.js";
 import QRCodeVue3 from "qr-code-generator-vue3";
+import * as R from "ramda";
 import { Component, Vue } from "vue-facing-decorator";
 import { QrcodeStream } from "vue-qrcode-reader";
 import { useClipboard } from "@vueuse/core";
@@ -98,18 +101,24 @@ import { useClipboard } from "@vueuse/core";
 import QuickNav from "@/components/QuickNav.vue";
 import UserNameDialog from "@/components/UserNameDialog.vue";
 import { NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
+import { accountsDB, db } from "@/db/index";
 import { Contact } from "@/db/tables/contacts";
 import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
-import { getContactJwtFromJwtUrl } from "@/libs/crypto";
 import {
-  generateEndorserJwtUrlForAccount,
+  deriveAddress,
+  getContactPayloadFromJwtUrl,
+  nextDerivationPath,
+} from "@/libs/crypto";
+import {
+  CONTACT_URL_PREFIX,
+  createEndorserJwtForDid,
+  ENDORSER_JWT_URL_LOCATION,
+  generateEndorserJwtForAccount,
   isDid,
   register,
   setVisibilityUtil,
 } from "@/libs/endorserServer";
-import { decodeEndorserJwt, ETHR_DID_PREFIX } from "@/libs/crypto/vc";
-import { retrieveAccountMetadata } from "@/libs/util";
+import { ETHR_DID_PREFIX } from "@/libs/crypto/vc";
 
 @Component({
   components: {
@@ -132,26 +141,64 @@ export default class ContactQRScanShow extends Vue {
   ETHR_DID_PREFIX = ETHR_DID_PREFIX;
 
   async created() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
-    this.givenName = settings.firstName || "";
+    await db.open();
+    const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+    this.activeDid = (settings?.activeDid as string) || "";
+    this.apiServer = (settings?.apiServer as string) || "";
+    this.givenName = (settings?.firstName as string) || "";
     this.hideRegisterPromptOnNewContact =
-      !!settings.hideRegisterPromptOnNewContact;
-    this.isRegistered = !!settings.isRegistered;
+      !!settings?.hideRegisterPromptOnNewContact;
+    this.isRegistered = !!settings?.isRegistered;
 
-    const account = await retrieveAccountMetadata(this.activeDid);
+    await accountsDB.open();
+    const accounts = await accountsDB.accounts.toArray();
+    const account = R.find((acc) => acc.did === this.activeDid, accounts);
     if (account) {
-      const name =
-        (settings.firstName || "") +
-        (settings.lastName ? ` ${settings.lastName}` : ""); // lastName is deprecated, pre v 0.1.3
+      const publicKeyHex = account.publicKeyHex;
+      const publicEncKey = Buffer.from(publicKeyHex, "hex").toString("base64");
 
-      this.qrValue = await generateEndorserJwtUrlForAccount(
+      const contactInfo = {
+        iat: Date.now(),
+        iss: this.activeDid,
+        own: {
+          name:
+            (settings?.firstName || "") +
+            (settings?.lastName ? ` ${settings.lastName}` : ""), // lastName is deprecated, pre v 0.1.3
+          publicEncKey,
+          profileImageUrl: settings?.profileImageUrl,
+          registered: settings?.isRegistered,
+        },
+      };
+
+      if (account?.mnemonic && account?.derivationPath) {
+        const newDerivPath = nextDerivationPath(
+          account.derivationPath as string,
+        );
+        const nextPublicHex = deriveAddress(
+          account.mnemonic as string,
+          newDerivPath,
+        )[2];
+        const nextPublicEncKey = Buffer.from(nextPublicHex, "hex");
+        const nextPublicEncKeyHash = sha256(nextPublicEncKey);
+        const nextPublicEncKeyHashBase64 =
+          Buffer.from(nextPublicEncKeyHash).toString("base64");
+        contactInfo.own.nextPublicEncKeyHash = nextPublicEncKeyHashBase64;
+      }
+
+      const vcJwt = await createEndorserJwtForDid(this.activeDid, contactInfo);
+
+      const viewPrefix = CONTACT_URL_PREFIX + ENDORSER_JWT_URL_LOCATION;
+      viewPrefix + vcJwt;
+
+      const name =
+        (settings?.firstName || "") +
+        (settings?.lastName ? ` ${settings.lastName}` : ""); // lastName is deprecated, pre v 0.1.3
+
+      this.qrValue = await generateEndorserJwtForAccount(
         account,
-        !!settings.isRegistered,
+        !!settings?.isRegistered,
         name,
-        settings.profileImageUrl,
-        false,
+        settings?.profileImageUrl as string,
       );
     }
   }
@@ -179,8 +226,8 @@ export default class ContactQRScanShow extends Vue {
     if (url) {
       let newContact: Contact;
       try {
-        const jwt = getContactJwtFromJwtUrl(url);
-        if (!jwt) {
+        const payload = getContactPayloadFromJwtUrl(url);
+        if (!payload) {
           this.$notify(
             {
               group: "alert",
@@ -192,9 +239,8 @@ export default class ContactQRScanShow extends Vue {
           );
           return;
         }
-        const { payload } = decodeEndorserJwt(jwt);
         newContact = {
-          did: payload.own.did || payload.iss, // ".own.did" is reliable as of v 0.3.49
+          did: payload.iss as string,
           name: payload.own.name,
           nextPubKeyHashB64: payload.own.nextPublicEncKeyHash,
           profileImageUrl: payload.own.profileImageUrl,
@@ -361,7 +407,7 @@ export default class ContactQRScanShow extends Vue {
       }
     } catch (error) {
       console.error("Error when registering:", error);
-      let userMessage = "There was an error.";
+      let userMessage = "There was an error. See logs for more info.";
       const serverError = error as AxiosError;
       if (serverError) {
         if (serverError.response?.data?.error?.message) {
@@ -406,7 +452,7 @@ export default class ContactQRScanShow extends Vue {
     useClipboard()
       .copy(this.qrValue)
       .then(() => {
-        // console.log("Contact URL:", this.qrValue);
+        console.log("Contact URL:", this.qrValue);
         this.$notify(
           {
             group: "alert",

src/views/ContactsView.vue

@@ -23,67 +23,20 @@
 
     <!-- New Contact -->
     <div id="formAddNewContact" class="mt-4 mb-4 flex items-stretch">
-      <span class="flex" v-if="isRegistered">
-        <router-link
-          :to="{ name: 'invite-one' }"
-          class="flex items-center bg-gradient-to-b from-green-400 to-green-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-1 mr-1 rounded-md"
-        >
-          <fa icon="envelope-open-text" class="fa-fw text-2xl" />
-        </router-link>
-
-        <button
-          @click="showOnboardMeetingDialog()"
-          class="flex items-center bg-gradient-to-b from-green-400 to-green-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-1 mr-1 rounded-md"
-        >
-          <fa icon="chair" class="fa-fw text-2xl" />
-        </button>
-      </span>
-      <span v-else class="flex">
-        <span
-          class="flex items-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.5 py-1 mr-1 rounded-md"
-        >
-          <fa
-            icon="envelope-open-text"
-            class="fa-fw text-2xl"
-            @click="
-              warning(
-                'You must get registered before you can create invites.',
-                'Not Registered',
-              )
-            "
-          />
-        </span>
-        <span
-          class="flex items-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.5 py-1 mr-1 rounded-md"
-        >
-          <fa
-            icon="chair"
-            class="fa-fw text-2xl"
-            @click="
-              warning(
-                'You must get registered before you can initiate an onboarding meeting.',
-                'Not Registered',
-              )
-            "
-          />
-        </span>
-      </span>
-
       <router-link
         :to="{ name: 'contact-qr' }"
-        class="flex items-center bg-gradient-to-b from-green-400 to-green-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-1 mr-1 rounded-md"
+        class="flex items-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.5 py-1 mr-1 rounded-md"
       >
         <fa icon="qrcode" class="fa-fw text-2xl" />
       </router-link>
-
       <textarea
         type="text"
-        placeholder="New URL or DID, Name, Public Key, Next Public Key Hash"
+        placeholder="URL or DID, Name, Public Key, Next Public Key Hash"
         class="block w-full rounded-l border border-r-0 border-slate-400 px-3 py-2 h-10"
         v-model="contactInput"
       />
       <button
-        class="px-4 rounded-r bg-green-200 border border-l-0 border-green-400"
+        class="px-4 rounded-r bg-slate-200 border border-l-0 border-slate-400"
         @click="onClickNewContact()"
       >
         <fa icon="plus" class="fa-fw" />
@@ -92,36 +45,32 @@
 
     <div class="flex justify-between" v-if="contacts.length > 0">
       <div class="w-full text-left">
-        <div v-if="!showGiveNumbers">
-          <input
-            type="checkbox"
-            :checked="contactsSelected.length === contacts.length"
-            @click="
-              contactsSelected.length === contacts.length
-                ? (contactsSelected = [])
-                : (contactsSelected = contacts.map((contact) => contact.did))
-            "
-            class="align-middle ml-2 h-6 w-6"
-            data-testId="contactCheckAllTop"
-          />
-          <button
-            href=""
-            class="text-md bg-gradient-to-b shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white ml-2 px-1 py-1 rounded-md"
-            :style="
-              contactsSelected.length > 0
-                ? 'background-image: linear-gradient(to bottom, #3b82f6, #1e40af);'
-                : 'background-image: linear-gradient(to bottom, #94a3b8, #374151);'
-            "
-            @click="copySelectedContacts()"
-            v-if="!showGiveNumbers"
-            data-testId="copySelectedContactsButtonTop"
-          >
-            Copy Selections
-          </button>
-          <button @click="showCopySelectionsInfo()">
-            <fa icon="circle-info" class="text-xl text-blue-500 ml-4" />
-          </button>
-        </div>
+        <input
+          type="checkbox"
+          v-if="!showGiveNumbers"
+          :checked="contactsSelected.length === contacts.length"
+          @click="
+            contactsSelected.length === contacts.length
+              ? (contactsSelected = [])
+              : (contactsSelected = contacts.map((contact) => contact.did))
+          "
+          class="align-middle ml-2 h-6 w-6"
+          data-testId="contactCheckAllTop"
+        />
+        <button
+          href=""
+          class="text-md bg-gradient-to-b shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white ml-2 px-1 py-1 rounded-md"
+          :style="
+            contactsSelected.length > 0
+              ? 'background-image: linear-gradient(to bottom, #3b82f6, #1e40af);'
+              : 'background-image: linear-gradient(to bottom, #94a3b8, #374151);'
+          "
+          @click="copySelectedContacts()"
+          v-if="!showGiveNumbers"
+          data-testId="copySelectedContactsButtonTop"
+        >
+          Copy Selections
+        </button>
       </div>
 
       <div class="w-full text-right">
@@ -130,9 +79,7 @@
           class="text-md bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1 py-1 rounded-md"
           @click="toggleShowContactAmounts()"
         >
-          {{
-            showGiveNumbers ? "Hide Hours, Offer, etc" : "See Hours, Offer, etc"
-          }}
+          {{ showGiveNumbers ? "Hide Given Hours" : "Show Given Hours" }}
         </button>
       </div>
     </div>
@@ -197,35 +144,22 @@
                     )
                   : contactsSelected.push(contact.did)
               "
-              class="ml-2 h-6 w-6 flex-shrink-0"
+              class="ml-2 h-6 w-6"
               data-testId="contactCheckOne"
             />
 
-            <h2
-              class="text-base font-semibold ml-2 w-1/3 truncate flex-shrink-0"
-            >
-              {{ contactNameNonBreakingSpace(contact.name) }}
+            <h2 class="text-base font-semibold ml-2">
+              {{ contact.name || AppString.NO_CONTACT_NAME }}
             </h2>
 
-            <span>
-              <div class="flex items-center">
-                <router-link
-                  :to="{
-                    path: '/did/' + encodeURIComponent(contact.did),
-                  }"
-                  title="See more about this person"
-                >
-                  <fa icon="circle-info" class="text-xl text-blue-500 ml-4" />
-                </router-link>
-
-                <span class="ml-4 text-sm overflow-hidden">{{
-                  libsUtil.shortDid(contact.did)
-                }}</span>
-              </div>
-              <div class="ml-4 text-sm">
-                {{ contact.notes }}
-              </div>
-            </span>
+            <router-link
+              :to="{
+                path: '/did/' + encodeURIComponent(contact.did),
+              }"
+              title="See more about this person"
+            >
+              <fa icon="circle-info" class="text-blue-500 ml-4" />
+            </router-link>
           </div>
           <div id="ContactActions" class="flex gap-1.5 mt-2">
             <div
@@ -234,25 +168,6 @@
             >
               <button
                 class="text-sm bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-1.5 rounded-l-md"
-                @click="confirmShowGiftedDialog(contact.did, activeDid)"
-                :title="givenToMeDescriptions[contact.did] || ''"
-              >
-                From:
-                <br />
-                {{
-                  /* eslint-disable prettier/prettier */
-                  this.showGiveTotals
-                    ? ((givenToMeConfirmed[contact.did] || 0)
-                        + (givenToMeUnconfirmed[contact.did] || 0))
-                    : this.showGiveConfirmed
-                        ? (givenToMeConfirmed[contact.did] || 0)
-                        : (givenToMeUnconfirmed[contact.did] || 0)
-                  /* eslint-enable prettier/prettier */
-                }}
-              </button>
-
-              <button
-                class="text-sm bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white -ml-1.5 px-2 py-1.5 rounded-r-md border-l"
                 @click="confirmShowGiftedDialog(activeDid, contact.did)"
                 :title="givenByMeDescriptions[contact.did] || ''"
               >
@@ -268,12 +183,34 @@
                         : (givenByMeUnconfirmed[contact.did] || 0)
                   /* eslint-enable prettier/prettier */
                 }}
+                <br />
+                <fa icon="plus" />
+              </button>
+
+              <button
+                class="text-sm bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white -ml-1.5 px-2 py-1.5 rounded-r-md border-l"
+                @click="confirmShowGiftedDialog(contact.did, this.activeDid)"
+                :title="givenToMeDescriptions[contact.did] || ''"
+              >
+                From:
+                <br />
+                {{
+                  /* eslint-disable prettier/prettier */
+                  this.showGiveTotals
+                    ? ((givenToMeConfirmed[contact.did] || 0)
+                        + (givenToMeUnconfirmed[contact.did] || 0))
+                    : this.showGiveConfirmed
+                        ? (givenToMeConfirmed[contact.did] || 0)
+                        : (givenToMeUnconfirmed[contact.did] || 0)
+                  /* eslint-enable prettier/prettier */
+                }}
+                <br />
+                <fa icon="plus" />
               </button>
 
               <button
                 class="text-sm bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-1.5 rounded-md border border-blue-400"
                 @click="openOfferDialog(contact.did, contact.name)"
-                data-testId="offerButton"
               >
                 Offer
               </button>
@@ -325,7 +262,6 @@
 
     <GiftedDialog ref="customGivenDialog" />
     <OfferDialog ref="customOfferDialog" />
-    <ContactNameDialog ref="contactNameDialog" />
 
     <div v-if="showLargeIdenticon" class="fixed z-[100] top-0 inset-x-0 w-full">
       <div
@@ -346,56 +282,35 @@
 import { AxiosError } from "axios";
 import { Buffer } from "buffer/";
 import { IndexableType } from "dexie";
-import { JWTPayload } from "did-jwt";
 import * as R from "ramda";
 import { Component, Vue } from "vue-facing-decorator";
-import { RouteLocationNormalizedLoaded, Router } from "vue-router";
+import { Router } from "vue-router";
 import { useClipboard } from "@vueuse/core";
 
-import QuickNav from "@/components/QuickNav.vue";
-import EntityIcon from "@/components/EntityIcon.vue";
-import GiftedDialog from "@/components/GiftedDialog.vue";
-import OfferDialog from "@/components/OfferDialog.vue";
-import ContactNameDialog from "@/components/ContactNameDialog.vue";
-import TopMessage from "@/components/TopMessage.vue";
-import { APP_SERVER, AppString, NotificationIface } from "@/constants/app";
-import {
-  db,
-  logConsoleAndDb,
-  retrieveSettingsForActiveAccount,
-  updateAccountSettings,
-  updateDefaultSettings,
-} from "@/db/index";
+import { AppString, NotificationIface } from "@/constants/app";
+import { db } from "@/db/index";
 import { Contact } from "@/db/tables/contacts";
-import { getContactJwtFromJwtUrl } from "@/libs/crypto";
-import { decodeEndorserJwt } from "@/libs/crypto/vc";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
+import { getContactPayloadFromJwtUrl } from "@/libs/crypto";
 import {
   CONTACT_CSV_HEADER,
-  createEndorserJwtForDid,
-  errorStringForLog,
+  CONTACT_URL_PREFIX,
+  GiverReceiverInputInfo,
   GiveSummaryRecord,
   getHeaders,
   isDid,
   register,
   setVisibilityUtil,
-  UserInfo,
-  VerifiableCredential,
-  CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI,
-  CONTACT_IMPORT_ONE_URL_PATH_TIME_SAFARI,
-  CONTACT_URL_PATH_ENDORSER_CH_OLD,
 } from "@/libs/endorserServer";
 import * as libsUtil from "@/libs/util";
-import { generateSaveAndActivateIdentity } from "@/libs/util";
+import QuickNav from "@/components/QuickNav.vue";
+import EntityIcon from "@/components/EntityIcon.vue";
+import GiftedDialog from "@/components/GiftedDialog.vue";
+import OfferDialog from "@/components/OfferDialog.vue";
+import TopMessage from "@/components/TopMessage.vue";
 
 @Component({
-  components: {
-    GiftedDialog,
-    EntityIcon,
-    OfferDialog,
-    QuickNav,
-    ContactNameDialog,
-    TopMessage,
-  },
+  components: { TopMessage, GiftedDialog, EntityIcon, OfferDialog, QuickNav },
 })
 export default class ContactsView extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
@@ -434,19 +349,14 @@ export default class ContactsView extends Vue {
 
   public async created() {
     await db.open();
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
-    this.isRegistered = !!settings.isRegistered;
+    const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+    this.activeDid = settings?.activeDid || "";
+    this.apiServer = settings?.apiServer || "";
+    this.isRegistered = !!settings?.isRegistered;
 
-    // if these detect a query parameter, they can and then redirect to this URL without a query parameter
-    // to avoid problems when they reload or they go forward & back and it tries to reprocess
-    await this.processContactJwt();
-    await this.processInviteJwt();
-
-    this.showGiveNumbers = !!settings.showContactGivesInline;
+    this.showGiveNumbers = !!settings?.showContactGivesInline;
     this.hideRegisterPromptOnNewContact =
-      !!settings.hideRegisterPromptOnNewContact;
+      !!settings?.hideRegisterPromptOnNewContact;
 
     if (this.showGiveNumbers) {
       this.loadGives();
@@ -460,144 +370,6 @@ 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
-    // because that will do better error checking for things like missing data on iOS platforms.
-    const importedContactJwt = (this.$route as RouteLocationNormalizedLoaded)
-      .query["contactJwt"] as string;
-    if (importedContactJwt) {
-      // really should fully verify contents
-      const { payload } = decodeEndorserJwt(importedContactJwt);
-      const userInfo = payload["own"] as UserInfo;
-      const newContact = {
-        did: userInfo.did || payload["iss"], // ".did" is reliable as of v 0.3.49
-        name: userInfo.name,
-        nextPubKeyHashB64: userInfo.nextPublicEncKeyHash,
-        profileImageUrl: userInfo.profileImageUrl,
-        publicKeyBase64: userInfo.publicEncKey,
-        registered: userInfo.registered,
-      } as Contact;
-      await this.addContact(newContact);
-      // if we're here, they haven't redirected anywhere, so we'll redirect here without a query parameter
-      (this.$router as Router).push({ path: "/contacts" });
-    }
-  }
-
-  private async processInviteJwt() {
-    // handle an invite JWT sent via URL
-    const importedInviteJwt = (this.$route as RouteLocationNormalizedLoaded)
-      .query["inviteJwt"] as string;
-    if (importedInviteJwt === "") {
-      // this happens when a platform (eg iOS) doesn't include anything after the "=" in a shared link.
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Blank Invite",
-          text: "The invite was not included, which can happen when your iOS device cuts off the link. Try pasting the full link into a browser.",
-        },
-        7000,
-      );
-    } else if (importedInviteJwt) {
-      // make sure user is created
-      if (!this.activeDid) {
-        this.activeDid = await generateSaveAndActivateIdentity();
-      }
-      // send invite directly to server, with auth for this user
-      const headers = await getHeaders(this.activeDid);
-      try {
-        const response = await this.axios.post(
-          this.apiServer + "/api/v2/claim",
-          { jwtEncoded: importedInviteJwt },
-          { headers },
-        );
-        if (response.status != 201) {
-          throw { error: { response: response } };
-        }
-        await updateAccountSettings(this.activeDid, { isRegistered: true });
-        this.isRegistered = true;
-        this.$notify(
-          {
-            group: "alert",
-            type: "success",
-            title: "Registered",
-            text: "You are now registered.",
-          },
-          3000,
-        );
-
-        // wait for a second before continuing so they see the registration message
-        await new Promise((resolve) => setTimeout(resolve, 1000));
-
-        // now add the inviter as a contact
-        // (similar code is in InviteOneAcceptView.vue)
-        const payload: JWTPayload =
-          decodeEndorserJwt(importedInviteJwt).payload;
-        const registration = payload as VerifiableCredential;
-        (this.$refs.contactNameDialog as ContactNameDialog).open(
-          "Who Invited You?",
-          "",
-          async (name) => {
-            await this.addContact({
-              did: registration.vc.credentialSubject.agent.identifier,
-              name: name,
-              registered: true,
-            });
-            // wait for a second before continuing so they see the user-added message
-            await new Promise((resolve) => setTimeout(resolve, 1000));
-            this.showOnboardingInfo();
-          },
-          async () => {
-            // on cancel, will still add the contact
-            await this.addContact({
-              did: registration.vc.credentialSubject.agent.identifier,
-              name: "(person who invited you)",
-              registered: true,
-            });
-            // wait for a second before continuing so they see the user-added message
-            await new Promise((resolve) => setTimeout(resolve, 1000));
-            this.showOnboardingInfo();
-          },
-        );
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      } catch (error: any) {
-        const fullError = "Error redeeming invite: " + errorStringForLog(error);
-        logConsoleAndDb(fullError, true);
-        let message = "Got an error sending the invite.";
-        if (
-          error.response &&
-          error.response.data &&
-          error.response.data.error
-        ) {
-          if (error.response.data.error.message) {
-            message = error.response.data.error.message;
-          } else {
-            message = error.response.data.error;
-          }
-        } else if (error.message) {
-          message = error.message;
-        }
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error with Invite",
-            text: message,
-          },
-          5000,
-        );
-      }
-      // if we're here, they haven't redirected anywhere, so we'll redirect here without a query parameter
-      (this.$router as Router).push({ path: "/contacts" });
-    }
-  }
-
-  private contactNameNonBreakingSpace(contactName?: string) {
-    return (contactName || AppString.NO_CONTACT_NAME).replace(/\s/g, "\u00A0");
-  }
-
   private danger(message: string, title: string = "Error", timeout = 5000) {
     this.$notify(
       {
@@ -610,33 +382,6 @@ export default class ContactsView extends Vue {
     );
   }
 
-  private warning(message: string, title: string = "Error", timeout = 5000) {
-    this.$notify(
-      {
-        group: "alert",
-        type: "warning",
-        title: title,
-        text: message,
-      },
-      timeout,
-    );
-  }
-
-  private showOnboardingInfo() {
-    this.$notify(
-      {
-        group: "modal",
-        type: "confirm",
-        title: "They're Added To Your List",
-        text: "Would you like to go to the main page now?",
-        onYes: async () => {
-          (this.$router as Router).push({ name: "home" });
-        },
-      },
-      -1,
-    );
-  }
-
   private filteredContacts() {
     return this.showGiveNumbers
       ? this.contactsSelected.length === 0
@@ -692,13 +437,13 @@ export default class ContactsView extends Vue {
               (useRecipient ? "given" : "received") +
               " data from the server.",
           },
-          3000,
+          -1,
         );
       }
     };
 
     try {
-      const headers = await getHeaders(this.activeDid, this.$notify);
+      const headers = await getHeaders(this.activeDid);
       const givenByUrl =
         this.apiServer +
         "/api/v2/report/gives?agentDid=" +
@@ -741,8 +486,7 @@ export default class ContactsView extends Vue {
       this.givenToMeConfirmed = givenToMeConfirmed;
       this.givenToMeUnconfirmed = givenToMeUnconfirmed;
     } catch (error) {
-      const fullError = "Error loading gives: " + errorStringForLog(error);
-      logConsoleAndDb(fullError, true);
+      console.error("Error loading gives", error);
       this.$notify(
         {
           group: "alert",
@@ -750,7 +494,7 @@ export default class ContactsView extends Vue {
           title: "Load Error",
           text: "Got an error loading your gives.",
         },
-        3000,
+        5000,
       );
     }
   }
@@ -758,37 +502,12 @@ export default class ContactsView extends Vue {
   private async onClickNewContact(): Promise<void> {
     const contactInput = this.contactInput.trim();
     if (!contactInput) {
-      this.danger(
-        "There was no contact info to add. Try the other green buttons.",
-        "No Contact",
-      );
+      this.danger("There was no contact info to add.", "No Contact");
       return;
     }
 
-    if (contactInput.includes(CONTACT_IMPORT_CONFIRM_URL_PATH_TIME_SAFARI)) {
-      const jwt = getContactJwtFromJwtUrl(contactInput);
-      (this.$router as Router).push({
-        path: "/contact-import/" + jwt,
-      });
-      return;
-    }
-
-    if (
-      contactInput.includes(CONTACT_IMPORT_ONE_URL_PATH_TIME_SAFARI) ||
-      contactInput.includes(CONTACT_URL_PATH_ENDORSER_CH_OLD)
-    ) {
-      const jwt = getContactJwtFromJwtUrl(contactInput);
-      const { payload } = decodeEndorserJwt(jwt);
-      const userInfo = payload["own"] as UserInfo;
-      const newContact = {
-        did: userInfo.did || payload["iss"], // "did" is reliable as of v 0.3.49
-        name: userInfo.name,
-        nextPubKeyHashB64: userInfo.nextPublicEncKeyHash,
-        profileImageUrl: userInfo.profileImageUrl,
-        publicKeyBase64: userInfo.publicEncKey,
-        registered: userInfo.registered,
-      } as Contact;
-      await this.addContact(newContact);
+    if (contactInput.startsWith(CONTACT_URL_PREFIX)) {
+      await this.addContactFromScan(contactInput);
       return;
     }
 
@@ -813,9 +532,6 @@ export default class ContactsView extends Vue {
           3000, // keeping it up so that the "visibility" message is seen
         );
       } catch (e) {
-        const fullError =
-          "Error adding contacts from CSV: " + errorStringForLog(e);
-        logConsoleAndDb(fullError, true);
         this.danger("An error occurred. Some contacts may have been added.");
       }
 
@@ -882,9 +598,6 @@ export default class ContactsView extends Vue {
           query: { contacts: JSON.stringify(contacts) },
         });
       } catch (e) {
-        const fullError =
-          "Error adding contacts from array: " + errorStringForLog(e);
-        logConsoleAndDb(fullError, true);
         this.danger("The input could not be parsed.", "Invalid Contact List");
       }
       return;
@@ -936,6 +649,31 @@ export default class ContactsView extends Vue {
     return db.contacts.add(newContact);
   }
 
+  private async addContactFromScan(url: string): Promise<void> {
+    const payload = getContactPayloadFromJwtUrl(url);
+    if (!payload) {
+      this.$notify(
+        {
+          group: "alert",
+          type: "danger",
+          title: "No Contact Info",
+          text: "The contact info could not be parsed.",
+        },
+        3000,
+      );
+      return;
+    } else {
+      return this.addContact({
+        did: payload.iss,
+        name: payload.own.name,
+        nextPubKeyHashB64: payload.own.nextPublicEncKeyHash,
+        profileImageUrl: payload.own.profileImageUrl,
+        publicKeyBase64: payload.own.publicEncKey,
+        registered: payload.own.registered,
+      } as Contact);
+    }
+  }
+
   private async addContact(newContact: Contact) {
     if (!newContact.did) {
       this.danger("Cannot add a contact without a DID.", "Incomplete Contact");
@@ -972,17 +710,17 @@ export default class ContactsView extends Vue {
                   type: "confirm",
                   title: "Register",
                   text: "Do you want to register them?",
-                  onCancel: async (stopAsking?: boolean) => {
+                  onCancel: async (stopAsking: boolean) => {
                     if (stopAsking) {
-                      await updateDefaultSettings({
+                      await db.settings.update(MASTER_SETTINGS_KEY, {
                         hideRegisterPromptOnNewContact: stopAsking,
                       });
                       this.hideRegisterPromptOnNewContact = stopAsking;
                     }
                   },
-                  onNo: async (stopAsking?: boolean) => {
+                  onNo: async (stopAsking: boolean) => {
                     if (stopAsking) {
-                      await updateDefaultSettings({
+                      await db.settings.update(MASTER_SETTINGS_KEY, {
                         hideRegisterPromptOnNewContact: stopAsking,
                       });
                       this.hideRegisterPromptOnNewContact = stopAsking;
@@ -995,7 +733,7 @@ export default class ContactsView extends Vue {
                 },
                 -1,
               );
-            }, 1000);
+            }, 500);
           }
         }
         this.$notify(
@@ -1009,9 +747,7 @@ export default class ContactsView extends Vue {
         );
       })
       .catch((err) => {
-        const fullError =
-          "Error when adding contact to storage: " + errorStringForLog(err);
-        logConsoleAndDb(fullError, true);
+        console.error("Error when adding contact to storage:", err);
         let message = "An error prevented this import.";
         if (
           err.message?.indexOf("Key already exists in the object store.") > -1
@@ -1023,7 +759,7 @@ export default class ContactsView extends Vue {
           message +=
             " Check that the contact doesn't conflict with any you already have.";
         }
-        this.danger(message, "Contact Not Added", 5000);
+        this.danger(message, "Contact Not Added", -1);
       });
   }
 
@@ -1072,7 +808,7 @@ export default class ContactsView extends Vue {
             text:
               (contact.name || "That unnamed person") + " has been registered.",
           },
-          3000,
+          5000,
         );
       } else {
         this.$notify(
@@ -1088,20 +824,12 @@ export default class ContactsView extends Vue {
         );
       }
     } catch (error) {
-      const fullError = "Error when registering: " + errorStringForLog(error);
-      logConsoleAndDb(fullError, true);
-      let userMessage = "There was an error.";
+      console.error("Error when registering:", error);
+      let userMessage = "There was an error. See logs for more info.";
       const serverError = error as AxiosError;
-      if (serverError.isAxiosError) {
-        if (
-          serverError.response?.data &&
-          typeof serverError.response.data === "object" &&
-          "error" in serverError.response.data &&
-          typeof serverError.response.data.error === "object" &&
-          serverError.response.data.error !== null &&
-          "message" in serverError.response.data.error
-        ) {
-          userMessage = serverError.response.data.error.message as string;
+      if (serverError) {
+        if (serverError.response?.data?.error?.message) {
+          userMessage = serverError.response.data.error.message;
         } else if (serverError.message) {
           userMessage = serverError.message; // Info for the user
         } else {
@@ -1157,10 +885,7 @@ export default class ContactsView extends Vue {
       }
       return true;
     } else {
-      console.error(
-        "Got strange result from setting visibility. It can happen when setting visibility on oneself.",
-        result,
-      );
+      console.error("Got strange result from setting visibility:", result);
       const message =
         (result.error as string) || "Could not set visibility on the server.";
       this.$notify(
@@ -1176,6 +901,74 @@ export default class ContactsView extends Vue {
     }
   }
 
+  // note that this is also in DIDView.vue
+  private async checkVisibility(contact: Contact) {
+    const url =
+      this.apiServer +
+      "/api/report/canDidExplicitlySeeMe?did=" +
+      encodeURIComponent(contact.did);
+    const headers = await getHeaders(this.activeDid);
+    if (!headers["Authorization"]) {
+      this.$notify(
+        {
+          group: "alert",
+          type: "danger",
+          title: "No Identity",
+          text: "There is no identity to use to check visibility.",
+        },
+        3000,
+      );
+      return;
+    }
+
+    try {
+      const resp = await this.axios.get(url, { headers });
+      if (resp.status === 200) {
+        const visibility = resp.data;
+        contact.seesMe = visibility;
+        //console.log("Visi check:", visibility, contact.seesMe, contact.did);
+        await db.contacts.update(contact.did, { seesMe: visibility });
+
+        this.$notify(
+          {
+            group: "alert",
+            type: "info",
+            title: "Visibility Refreshed",
+            text:
+              libsUtil.nameForContact(contact, true) +
+              " can " +
+              (visibility ? "" : "not ") +
+              "see your activity.",
+          },
+          3000,
+        );
+      } else {
+        console.error("Got bad server response checking visibility:", resp);
+        const message = resp.data.error?.message || "Got bad server response.";
+        this.$notify(
+          {
+            group: "alert",
+            type: "danger",
+            title: "Error Checking Visibility",
+            text: message,
+          },
+          5000,
+        );
+      }
+    } catch (err) {
+      console.error("Caught error from request to check visibility:", err);
+      this.$notify(
+        {
+          group: "alert",
+          type: "danger",
+          title: "Error Checking Visibility",
+          text: "Check connectivity and try again.",
+        },
+        3000,
+      );
+    }
+  }
+
   private confirmShowGiftedDialog(giverDid: string, recipientDid: string) {
     // if they have unconfirmed amounts, ask to confirm those
     if (
@@ -1217,8 +1010,7 @@ export default class ContactsView extends Vue {
   }
 
   private showGiftedDialog(giverDid: string, recipientDid: string) {
-    let giver: libsUtil.GiverReceiverInputInfo | undefined;
-    let receiver: libsUtil.GiverReceiverInputInfo | undefined;
+    let giver: GiverReceiverInputInfo, receiver: GiverReceiverInputInfo;
     if (giverDid) {
       giver = {
         did: giverDid,
@@ -1241,7 +1033,7 @@ export default class ContactsView extends Vue {
         newList[recipientDid] = (newList[recipientDid] || 0) + amount;
         this.givenByMeUnconfirmed = newList;
       };
-      customTitle = "Given to " + (receiver?.name || "Someone Unnamed");
+      customTitle = "Given to " + receiver.name;
     } else {
       // must be (recipientDid == this.activeDid)
       callback = (amount: number) => {
@@ -1249,14 +1041,13 @@ export default class ContactsView extends Vue {
         newList[giverDid] = (newList[giverDid] || 0) + amount;
         this.givenToMeUnconfirmed = newList;
       };
-      customTitle = "Received from " + (giver?.name || "Someone Unnamed");
+      customTitle = "Received from " + giver.name;
     }
     (this.$refs.customGivenDialog as GiftedDialog).open(
       giver,
       receiver,
-      undefined as unknown as string,
+      undefined as string,
       customTitle,
-      undefined as unknown as string,
       callback,
     );
   }
@@ -1271,13 +1062,11 @@ export default class ContactsView extends Vue {
   private async toggleShowContactAmounts() {
     const newShowValue = !this.showGiveNumbers;
     try {
-      await updateDefaultSettings({
+      await db.open();
+      await db.settings.update(MASTER_SETTINGS_KEY, {
         showContactGivesInline: newShowValue,
       });
     } catch (err) {
-      const fullError =
-        "Error updating contact-amounts setting: " + errorStringForLog(err);
-      logConsoleAndDb(fullError, true);
       this.$notify(
         {
           group: "alert",
@@ -1285,7 +1074,11 @@ export default class ContactsView extends Vue {
           title: "Error Updating Contact Setting",
           text: "The setting may not have saved. Try again, maybe after restarting the app.",
         },
-        5000,
+        -1,
+      );
+      console.error(
+        "Telling user to try again after contact-amounts setting update because:",
+        err,
       );
     }
     this.showGiveNumbers = newShowValue;
@@ -1326,117 +1119,30 @@ export default class ContactsView extends Vue {
     };
   }
 
-  private async copySelectedContacts() {
+  private copySelectedContacts() {
     if (this.contactsSelected.length === 0) {
       this.danger("You must select contacts to copy.");
       return;
     }
-    const selectedContactsFull = this.contacts.filter((c) =>
+    const selectedContacts = this.contacts.filter((c) =>
       this.contactsSelected.includes(c.did),
     );
-    const selectedContacts: Array<Contact> = selectedContactsFull.map((c) => {
-      const contact: Contact = {
-        did: c.did,
-        name: c.name,
-      };
-      if (c.nextPubKeyHashB64) {
-        contact.nextPubKeyHashB64 = c.nextPubKeyHashB64;
-      }
-      if (c.profileImageUrl) {
-        contact.profileImageUrl = c.profileImageUrl;
-      }
-      if (c.publicKeyBase64) {
-        contact.publicKeyBase64 = c.publicKeyBase64;
-      }
-      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 message =
+      "To add contacts, paste this into the box on the 'Contacts' screen.\n\n" +
+      JSON.stringify(selectedContacts);
     useClipboard()
-      .copy(contactsJwtUrl)
+      .copy(message)
       .then(() => {
         this.$notify(
           {
             group: "alert",
             type: "info",
             title: "Copied",
-            text: "The link for those contacts is now in the clipboard.",
+            text: "Those contacts were copied to the clipboard. Have them paste it in the box on their 'Contacts' screen.",
           },
-          3000,
+          5000,
         );
       });
   }
-
-  private showCopySelectionsInfo() {
-    this.$notify(
-      {
-        group: "alert",
-        type: "info",
-        title: "Copying Contacts",
-        text: "Contact info will include name, ID, profile image, and public key.",
-      },
-      5000,
-    );
-  }
-
-  private async showOnboardMeetingDialog() {
-    try {
-      // First check if they're in a meeting
-      const headers = await getHeaders(this.activeDid);
-      const memberResponse = await this.axios.get(
-        this.apiServer + "/api/partner/groupOnboardMember",
-        { headers },
-      );
-
-      if (memberResponse.data.data) {
-        // They're in a meeting, check if they're the host
-        const hostResponse = await this.axios.get(
-          this.apiServer + "/api/partner/groupOnboard",
-          { headers },
-        );
-
-        if (hostResponse.data.data) {
-          // They're the host, take them to setup
-          (this.$router as Router).push({ name: "onboard-meeting-setup" });
-        } else {
-          // They're not the host, take them to list
-          (this.$router as Router).push({ name: "onboard-meeting-list" });
-        }
-      } else {
-        // They're not in a meeting, show the dialog
-        this.$notify(
-          {
-            group: "modal",
-            type: "confirm",
-            title: "Onboarding Meeting",
-            text: "Would you like to start a new meeting?",
-            onYes: async () => {
-              (this.$router as Router).push({ name: "onboard-meeting-setup" });
-            },
-            yesText: "Start New Meeting",
-            onNo: async () => {
-              (this.$router as Router).push({ name: "onboard-meeting-list" });
-            },
-            noText: "Join Existing Meeting",
-          },
-          -1,
-        );
-      }
-    } catch (error) {
-      logConsoleAndDb(
-        "Error checking meeting status:" + errorStringForLog(error),
-      );
-      this.danger(
-        "There was an error checking your meeting status.",
-        "Meeting Error",
-      );
-    }
-  }
 }
 </script>

src/views/DIDView.vue

@@ -6,7 +6,7 @@
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
-      <h1 id="ViewHeading" class="text-lg text-center font-light relative px-7">
+      <h1 class="text-lg text-center font-light relative px-7">
         <!-- Back -->
         <button
           @click="$router.go(-1)"
@@ -19,26 +19,27 @@
     </div>
 
     <!-- Identity Details -->
-    <div
-      v-if="!!contactFromDid"
-      class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4"
-    >
+    <div class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4">
       <div>
         <h2 class="text-xl font-semibold">
-          {{ contactFromDid?.name || "(no name)" }}
-          <router-link
-            :to="{ name: 'contact-edit', params: { did: contactFromDid?.did } }"
+          {{ contact?.name || "(no name)" }}
+          <button
+            @click="
+              contactEdit = true;
+              contactNewName = contact.name || '';
+            "
+            title="Edit"
           >
             <fa icon="pen" class="text-sm text-blue-500 ml-2 mb-1" />
-          </router-link>
+          </button>
         </h2>
         <button
           @click="showDidDetails = !showDidDetails"
           class="ml-2 mr-2 mt-4"
         >
           Details
-          <fa v-if="showDidDetails" icon="chevron-down" class="text-blue-400" />
-          <fa v-else icon="chevron-right" class="text-blue-400" />
+          <fa v-if="showDidDetails" icon="chevron-up" class="text-blue-400" />
+          <fa v-else icon="chevron-down" class="text-blue-400" />
         </button>
         <!-- Keep the dump contents directly between > and < to avoid weird spacing. -->
         <pre
@@ -48,15 +49,12 @@
         >
       </div>
       <div class="flex justify-center mt-4">
-        <span
-          v-if="contactFromDid?.profileImageUrl"
-          class="flex justify-between"
-        >
+        <span v-if="contact?.profileImageUrl" class="flex justify-between">
           <EntityIcon
             :icon-size="96"
-            :profileImageUrl="contactFromDid?.profileImageUrl"
+            :profileImageUrl="contact?.profileImageUrl"
             class="inline-block align-text-bottom border border-slate-300 rounded"
-            @click="showLargeIdenticonUrl = contactFromDid?.profileImageUrl"
+            @click="showLargeIdenticonUrl = contact?.profileImageUrl"
           />
         </span>
       </div>
@@ -65,60 +63,62 @@
           <div v-if="activeDid" class="flex justify-between">
             <div>
               <button
-                v-if="
-                  contactFromDid?.seesMe && contactFromDid.did !== activeDid
-                "
+                v-if="contact?.seesMe && contact.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"
-                @click="confirmSetVisibility(contactFromDid, false)"
+                @click="confirmSetVisibility(contact, false)"
                 title="They can see you"
               >
                 <fa icon="eye" class="fa-fw" />
               </button>
               <button
-                v-else-if="
-                  !contactFromDid?.seesMe && contactFromDid?.did !== activeDid
-                "
+                v-else-if="!contact?.seesMe && contact?.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"
-                @click="confirmSetVisibility(contactFromDid, true)"
+                @click="confirmSetVisibility(contact, true)"
                 title="They cannot see you"
               >
                 <fa icon="eye-slash" class="fa-fw" />
               </button>
+              <!-- otherwise it's this user so hide it -->
+              <fa v-else icon="eye" class="text-white mx-2.5" />
 
               <button
                 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"
-                @click="checkVisibility(contactFromDid)"
+                @click="checkVisibility(contact)"
                 title="Check Visibility"
-                v-if="contactFromDid?.did !== activeDid"
+                v-if="contact?.did !== activeDid"
               >
                 <fa icon="rotate" class="fa-fw" />
               </button>
+              <!-- otherwise it's this user so hide it -->
+              <fa v-else icon="rotate" class="text-white mx-2.5" />
             </div>
 
             <button
-              @click="confirmRegister(contactFromDid)"
+              @click="confirmRegister(contact)"
               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 ml-6 mx-0.5 my-0.5 px-2 py-1.5 rounded-md"
-              v-if="contactFromDid?.did !== activeDid"
+              v-if="contact?.did !== activeDid"
               title="Registration"
             >
               <fa
-                v-if="contactFromDid?.registered"
+                v-if="contact?.registered"
                 icon="person-circle-check"
                 class="fa-fw"
               />
               <fa v-else icon="person-circle-question" class="fa-fw" />
             </button>
+            <!-- otherwise it's this user so hide it -->
+            <fa v-else icon="rotate" class="text-white ml-6 px-2.5" />
           </div>
 
           <button
-            @click="confirmDeleteContact(contactFromDid)"
+            @click="confirmDeleteContact(contact)"
             class="text-sm uppercase bg-gradient-to-b from-rose-500 to-rose-800 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white ml-6 mx-0.5 my-0.5 px-2 py-1.5 rounded-md"
             title="Delete"
           >
             <fa icon="trash-can" class="fa-fw" />
           </button>
         </div>
-        <div v-if="!contactFromDid?.profileImageUrl">
+        <div v-if="!contact?.profileImageUrl">
           <div>Auto-Generated Icon</div>
           <div class="flex justify-center">
             <EntityIcon
@@ -150,12 +150,30 @@
         </div>
       </div>
     </div>
-    <div v-else class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4">
-      <!-- !contactFromDid -->
-      <div>
-        <h2 class="text-xl font-semibold">
-          {{ isMyDid ? "You" : "(no name)" }}
-        </h2>
+    <div v-if="contactEdit" class="dialog-overlay">
+      <div class="dialog">
+        <h1 class="text-xl font-bold text-center mb-4">Edit Name</h1>
+        <input
+          type="text"
+          class="block w-full rounded border border-slate-400 mb-2 px-3 py-2"
+          placeholder="Name"
+          v-model="contactNewName"
+        />
+        <div class="flex justify-between">
+          <button
+            class="text-sm bg-blue-600 text-white px-2 py-1.5 rounded -ml-1.5 border-l border-blue-400"
+            @click="onClickSaveName(contactNewName)"
+          >
+            <fa icon="save" />
+          </button>
+          <span class="inline-block w-2" />
+          <button
+            class="text-sm bg-blue-600 text-white px-2 py-1.5 rounded -ml-1.5 border-l border-blue-400"
+            @click="onClickCancelName()"
+          >
+            <fa icon="ban" />
+          </button>
+        </div>
       </div>
     </div>
 
@@ -168,9 +186,7 @@
     </div>
     <!-- Results List -->
     <div v-if="claims.length > 0" class="mt-4">
-      <div class="text-l font-bold text-center">
-        Claims That Involve {{ isMyDid ? "You" : "Them" }}
-      </div>
+      <div class="text-l font-bold text-center">Claims That Involve Them</div>
     </div>
     <InfiniteScroll @reached-bottom="loadMoreData">
       <ul>
@@ -206,8 +222,7 @@
       v-if="!isLoading && claims.length === 0"
       class="flex justify-center mt-4"
     >
-      <span v-if="isMyDid">You have no claims yet.</span>
-      <span v-else>They are in no claims visible to you.</span>
+      <span>They are in no claims visible to you.</span>
     </div>
   </section>
 </template>
@@ -222,9 +237,9 @@ import QuickNav from "@/components/QuickNav.vue";
 import InfiniteScroll from "@/components/InfiniteScroll.vue";
 import TopMessage from "@/components/TopMessage.vue";
 import { NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
+import { accountsDB, db } from "@/db/index";
 import { Contact } from "@/db/tables/contacts";
-import { BoundingBox } from "@/db/tables/settings";
+import { BoundingBox, MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import {
   capitalizeAndInsertSpacesBeforeCaps,
   didInfoForContact,
@@ -255,13 +270,15 @@ export default class DIDView extends Vue {
   yaml = yaml;
 
   activeDid = "";
+  allMyDids: Array<string> = [];
   apiServer = "";
   claims: Array<GenericCredWrapper<GenericVerifiableCredential>> = [];
-  contactFromDid?: Contact;
+  contact: Contact;
+  contactEdit = false;
+  contactNewName?: string;
   contactYaml = "";
   hitEnd = false;
   isLoading = false;
-  isMyDid = false;
   searchBox: { name: string; bbox: BoundingBox } | null = null;
   showDidDetails = false;
   showLargeIdenticonId?: string;
@@ -273,37 +290,38 @@ export default class DIDView extends Vue {
   displayAmount = displayAmount;
 
   async mounted() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
+    await db.open();
+    const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+    this.activeDid = (settings?.activeDid as string) || "";
+    this.apiServer = (settings?.apiServer as string) || "";
 
     const pathParam = window.location.pathname.substring("/did/".length);
-    let showDid = pathParam;
-    if (!showDid) {
-      showDid = this.activeDid;
-      if (showDid) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "toast",
-            title: "Your Info",
-            text: "No user was specified so showing your info.",
-          },
-          3000,
-        );
-      }
+    let theContact: Contact | undefined;
+    if (pathParam) {
+      this.viewingDid = decodeURIComponent(pathParam);
+      theContact = await db.contacts.get(this.viewingDid);
+    }
+    if (theContact) {
+      this.contact = theContact;
+    } else {
+      this.$notify(
+        {
+          group: "alert",
+          type: "danger",
+          title: "Error",
+          text: "No valid claim ID was provided.",
+        },
+        -1,
+      );
+      return;
     }
-    if (showDid) {
-      this.viewingDid = decodeURIComponent(showDid);
-      this.contactFromDid = await db.contacts.get(this.viewingDid);
-      if (this.contactFromDid) {
-        this.contactYaml = yaml.dump(this.contactFromDid);
-      }
-      await this.loadClaimsAbout();
 
-      const allAccountDids = await libsUtil.retrieveAccountDids();
-      this.isMyDid = allAccountDids.includes(this.viewingDid);
-    }
+    this.contactYaml = yaml.dump(this.contact);
+    await this.loadClaimsAbout();
+
+    await accountsDB.open();
+    const allAccounts = await accountsDB.accounts.toArray();
+    this.allMyDids = allAccounts.map((acc) => acc.did);
   }
 
   /**
@@ -318,20 +336,15 @@ export default class DIDView extends Vue {
 
   // prompt with confirmation if they want to delete a contact
   confirmDeleteContact(contact: Contact) {
-    let message =
-      "Are you sure you want to remove " +
-      libsUtil.nameForContact(contact, false) +
-      " from your contact list?";
-    if (contact.seesMe) {
-      message +=
-        " Note that they can see your activity, so if you want to hide your activity from them then you should do that first.";
-    }
     this.$notify(
       {
         group: "modal",
         type: "confirm",
         title: "Delete",
-        text: message,
+        text:
+          "Are you sure you want to remove " +
+          libsUtil.nameForContact(contact, false) +
+          " from your contact list?",
         onYes: async () => {
           await this.deleteContact(contact);
         },
@@ -364,7 +377,7 @@ export default class DIDView extends Vue {
         title: "Register",
         text:
           "Are you sure you want to register " +
-          libsUtil.nameForContact(this.contactFromDid, false) +
+          libsUtil.nameForContact(this.contact, false) +
           (contact.registered
             ? " -- especially since they are already marked as registered"
             : "") +
@@ -417,7 +430,7 @@ export default class DIDView extends Vue {
       }
     } catch (error) {
       console.error("Error when registering:", error);
-      let userMessage = "There was an error.";
+      let userMessage = "There was an error. See logs for more info.";
       const serverError = error as AxiosError;
       if (serverError) {
         if (serverError.response?.data?.error?.message) {
@@ -494,7 +507,7 @@ export default class DIDView extends Vue {
           title: "Error",
           text: e.userMessage || "There was a problem retrieving claims.",
         },
-        3000,
+        -1,
       );
     } finally {
       this.isLoading = false;
@@ -540,6 +553,17 @@ export default class DIDView extends Vue {
     return claim.claim.name || claim.claim.description || "";
   }
 
+  private async onClickCancelName() {
+    this.contactEdit = false;
+  }
+
+  private async onClickSaveName(newName: string) {
+    this.contact.name = newName;
+    return db.contacts
+      .update(this.contact.did, { name: newName })
+      .then(() => (this.contactEdit = false));
+  }
+
   // note that this is also in ContactView.vue
   async confirmSetVisibility(contact: Contact, visibility: boolean) {
     const visibilityPrompt = visibility
@@ -684,7 +708,6 @@ export default class DIDView extends Vue {
 
 <style>
 .dialog-overlay {
-  z-index: 50;
   position: fixed;
   top: 0;
   left: 0;

src/views/DiscoverView.vue

@@ -6,70 +6,30 @@
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Heading -->
     <h1 id="ViewHeading" class="text-4xl text-center font-light">
-      Discover Projects & People
+      Discover Projects
     </h1>
 
-    <OnboardingDialog ref="onboardingDialog" />
-
     <!-- Quick Search -->
     <div
       id="QuickSearch"
       class="mt-8 mb-4 flex"
-      :style="{ visibility: isSearchVisible ? 'visible' : 'hidden' }"
+      v-on:keyup.enter="searchSelected()"
     >
       <input
         type="text"
         v-model="searchTerms"
         placeholder="Search…"
         class="block w-full rounded-l border border-r-0 border-slate-400 px-3 py-2"
-        v-on:keyup.enter="searchSelected()"
       />
       <button
-        class="px-4 rounded-r bg-slate-200 border border-l-0 border-slate-400"
         @click="searchSelected()"
+        class="px-4 rounded-r bg-slate-200 border border-l-0 border-slate-400"
       >
         <fa icon="magnifying-glass" class="fa-fw"></fa>
       </button>
     </div>
 
     <!-- Result Tabs -->
-    <!-- Top Level Selection -->
-    <div class="text-center text-slate-500 border-b border-slate-300 mb-4">
-      <ul class="flex flex-wrap justify-center gap-4 -mb-px">
-        <li>
-          <a
-            href="#"
-            @click="
-              projects = [];
-              userProfiles = [];
-              isProjectsActive = true;
-              isPeopleActive = false;
-              searchSelected();
-            "
-            v-bind:class="computedProjectsTabStyleClassNames()"
-          >
-            Projects
-          </a>
-        </li>
-        <li>
-          <a
-            href="#"
-            @click="
-              projects = [];
-              userProfiles = [];
-              isProjectsActive = false;
-              isPeopleActive = true;
-              searchSelected();
-            "
-            v-bind:class="computedPeopleTabStyleClassNames()"
-          >
-            People
-          </a>
-        </li>
-      </ul>
-    </div>
-
-    <!-- Secondary Tabs -->
     <div class="text-center text-slate-500 border-b border-slate-300">
       <ul class="flex flex-wrap justify-center gap-4 -mb-px">
         <li>
@@ -77,25 +37,19 @@
             href="#"
             @click="
               projects = [];
-              userProfiles = [];
               isLocalActive = true;
-              isMappedActive = false;
-              isAnywhereActive = false;
-              isSearchVisible = true;
-              tempSearchBox = null;
+              isRemoteActive = false;
               searchLocal();
             "
             v-bind:class="computedLocalTabStyleClassNames()"
           >
             Nearby
-            <!-- restore when the links don't jump around for different numbers
             <span
               class="font-semibold text-sm bg-slate-200 px-1.5 py-0.5 rounded-md"
               v-if="isLocalActive"
             >
               {{ localCount > -1 ? localCount : "?" }}
             </span>
-            -->
           </a>
         </li>
         <li>
@@ -103,80 +57,35 @@
             href="#"
             @click="
               projects = [];
-              userProfiles = [];
+              isRemoteActive = true;
               isLocalActive = false;
-              isMappedActive = true;
-              isAnywhereActive = false;
-              isSearchVisible = false;
-              searchTerms = '';
-              tempSearchBox = null;
-            "
-            v-bind:class="computedMappedTabStyleClassNames()"
-          >
-            <!-- search is triggered when map component gets to "ready" state -->
-            Mapped
-          </a>
-        </li>
-        <li>
-          <a
-            href="#"
-            @click="
-              projects = [];
-              userProfiles = [];
-              isLocalActive = false;
-              isMappedActive = false;
-              isAnywhereActive = true;
-              isSearchVisible = true;
-              tempSearchBox = null;
               searchAll();
             "
             v-bind:class="computedRemoteTabStyleClassNames()"
           >
             Anywhere
-            <!-- restore when the links don't jump around for different numbers
             <span
               class="font-semibold text-sm bg-slate-200 px-1.5 py-0.5 rounded-md"
-              v-if="isAnywhereActive"
+              v-if="isRemoteActive"
             >
               {{ remoteCount > -1 ? remoteCount : "?" }}
             </span>
-            -->
           </a>
         </li>
       </ul>
     </div>
 
     <div v-if="isLocalActive">
-      <div class="text-center">
+      <div>
         <button
           class="ml-2 mt-2 px-4 py-2 rounded-md bg-blue-200 text-blue-500"
           @click="$router.push({ name: 'search-area' })"
         >
-          <fa icon="location-dot" class="fa-fw" />
           Select a {{ searchBox ? "Different" : "" }} Location for Nearby Search
         </button>
       </div>
     </div>
 
-    <div v-if="isMappedActive && !tempSearchBox">
-      <div class="mt-4 h-96 w-5/6 mx-auto">
-        <l-map
-          ref="projectMap"
-          @ready="onMapReady"
-          @moveend="onMoveEnd"
-          @movestart="onMoveStart"
-          @zoomend="onZoomEnd"
-          @zoomstart="onZoomStart"
-        >
-          <l-tile-layer
-            url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
-            layer-type="base"
-            name="OpenStreetMap"
-          />
-        </l-map>
-      </div>
-    </div>
-
     <!-- Loading Animation -->
     <div
       class="fixed left-6 bottom-24 text-center text-4xl leading-none bg-slate-400 text-white w-14 py-2.5 rounded-full"
@@ -184,157 +93,61 @@
     >
       <fa icon="spinner" class="fa-spin-pulse"></fa>
     </div>
-    <div
-      v-else-if="projects.length === 0 && userProfiles.length === 0"
-      class="text-center mt-8"
-    >
-      <p class="text-lg text-slate-500">
-        <span v-if="isLocalActive">
-          <span v-if="searchBox"> None found in the selected area. </span>
-          <!-- Otherwise there's no search area selected so we'll just leave the search box for them to click. -->
-        </span>
-        <span v-else-if="isAnywhereActive"
-          >No projects were found with that search.</span
-        >
-      </p>
-    </div>
 
     <!-- Results List -->
     <InfiniteScroll @reached-bottom="loadMoreData">
       <ul id="listDiscoverResults">
-        <!-- Projects List -->
-        <template v-if="isProjectsActive">
-          <li
-            class="border-b border-slate-300"
-            v-for="project in projects"
-            :key="project.handleId"
+        <li
+          class="border-b border-slate-300"
+          v-for="project in projects"
+          :key="project.handleId"
+        >
+          <a
+            @click="onClickLoadProject(project.handleId)"
+            class="block py-4 flex gap-4 cursor-pointer"
           >
-            <a
-              @click="onClickLoadItem(project.handleId)"
-              class="block py-4 flex gap-4 cursor-pointer"
-            >
-              <div>
-                <ProjectIcon
-                  :entityId="project.handleId"
-                  :iconSize="48"
-                  :imageUrl="project.image"
-                  class="block border border-slate-300 rounded-md max-h-12 max-w-12"
-                />
-              </div>
+            <div>
+              <ProjectIcon
+                :entityId="project.handleId"
+                :iconSize="48"
+                :imageUrl="project.image"
+                class="block border border-slate-300 rounded-md max-h-12 max-w-12"
+              />
+            </div>
 
-              <div class="grow">
-                <h2 class="text-base font-semibold">{{ project.name }}</h2>
-                <div class="text-sm">
-                  <fa icon="user" class="fa-fw text-slate-400"></fa>
-                  {{
-                    didInfo(
-                      project.issuerDid,
-                      activeDid,
-                      allMyDids,
-                      allContacts,
-                    )
-                  }}
-                </div>
+            <div class="grow">
+              <h2 class="text-base font-semibold">{{ project.name }}</h2>
+              <div class="text-sm">
+                <fa icon="user" class="fa-fw text-slate-400"></fa>
+                {{
+                  didInfo(project.issuerDid, activeDid, allMyDids, allContacts)
+                }}
               </div>
-            </a>
-          </li>
-        </template>
-
-        <!-- Profiles List -->
-        <template v-else>
-          <li
-            class="border-b border-slate-300"
-            v-for="profile in userProfiles"
-            :key="profile.issuerDid"
-          >
-            <a
-              @click="onClickLoadItem(profile?.rowId || '')"
-              class="block py-4 flex gap-4 cursor-pointer"
-            >
-              <div class="grow">
-                <div class="text-sm">
-                  <fa icon="user" class="fa-fw text-slate-400"></fa>
-                  {{
-                    didInfo(
-                      profile.issuerDid,
-                      activeDid,
-                      allMyDids,
-                      allContacts,
-                    )
-                  }}
-                </div>
-                <p
-                  v-if="profile.description"
-                  class="mt-1 text-sm text-slate-600"
-                >
-                  {{ profile.description }}
-                </p>
-                <div
-                  v-if="isAnywhereActive && profile.locLat && profile.locLon"
-                  class="mt-1 text-xs text-slate-500"
-                >
-                  <fa icon="location-dot" class="fa-fw"></fa>
-                  {{
-                    (profile.locLat > 0 ? "North" : "South") +
-                    " in " +
-                    (profile.locLon > 0 ? "Eastern" : "Western") +
-                    " Hemisphere"
-                  }}
-                </div>
-              </div>
-            </a>
-          </li>
-        </template>
+            </div>
+          </a>
+        </li>
       </ul>
     </InfiniteScroll>
   </section>
 </template>
 
 <script lang="ts">
-import "leaflet/dist/leaflet.css";
-import * as L from "leaflet";
 import { Component, Vue } from "vue-facing-decorator";
-import { LMap, LTileLayer } from "@vue-leaflet/vue-leaflet";
-import { Router, RouteLocationNormalizedLoaded } from "vue-router";
+import { Router } from "vue-router";
 
 import QuickNav from "@/components/QuickNav.vue";
 import InfiniteScroll from "@/components/InfiniteScroll.vue";
 import ProjectIcon from "@/components/ProjectIcon.vue";
-import OnboardingDialog from "@/components/OnboardingDialog.vue";
 import TopMessage from "@/components/TopMessage.vue";
-import { DEFAULT_PARTNER_API_SERVER, NotificationIface } from "@/constants/app";
-import {
-  db,
-  logConsoleAndDb,
-  retrieveSettingsForActiveAccount,
-} from "@/db/index";
+import { NotificationIface } from "@/constants/app";
+import { accountsDB, db } from "@/db/index";
 import { Contact } from "@/db/tables/contacts";
-import { BoundingBox } from "@/db/tables/settings";
-import {
-  didInfo,
-  errorStringForLog,
-  getHeaders,
-  PlanData,
-} from "@/libs/endorserServer";
-import { UserProfile } from "@/libs/partnerServer";
-import { OnboardPage, retrieveAccountDids } from "@/libs/util";
-
-interface Tile {
-  indexLat: number;
-  indexLon: number;
-  minFoundLat: number;
-  maxFoundLat: number;
-  minFoundLon: number;
-  maxFoundLon: number;
-  recordCount: number;
-}
+import { BoundingBox, MASTER_SETTINGS_KEY } from "@/db/tables/settings";
+import { didInfo, getHeaders, PlanData } from "@/libs/endorserServer";
 
 @Component({
   components: {
     InfiniteScroll,
-    LMap,
-    LTileLayer,
-    OnboardingDialog,
     ProjectIcon,
     QuickNav,
     TopMessage,
@@ -342,66 +155,43 @@ interface Tile {
 })
 export default class DiscoverView extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
-  $router!: Router;
-  $route!: RouteLocationNormalizedLoaded;
 
   activeDid = "";
   allContacts: Array<Contact> = [];
   allMyDids: Array<string> = [];
   apiServer = "";
+  searchTerms = "";
+  projects: PlanData[] = [];
   isLoading = false;
   isLocalActive = true;
-  isMappedActive = false;
-  isAnywhereActive = false;
-  isProjectsActive = true;
-  isPeopleActive = false;
-  isSearchVisible = true;
-  localCenterLat = 0;
-  localCenterLong = 0;
+  isRemoteActive = false;
   localCount = -1;
-  markers: { [key: string]: L.Marker } = {};
-  partnerApiServer = DEFAULT_PARTNER_API_SERVER;
-  projects: PlanData[] = [];
   remoteCount = -1;
   searchBox: { name: string; bbox: BoundingBox } | null = null;
-  searchTerms = "";
-  tempSearchBox: BoundingBox | null = null;
-  userProfiles: UserProfile[] = [];
-  zoomedSoDoNotMove = false;
 
   // make this function available to the Vue template
   didInfo = didInfo;
 
   async mounted() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = (settings.activeDid as string) || "";
-    this.apiServer = (settings.apiServer as string) || "";
-    this.partnerApiServer =
-      (settings.partnerApiServer as string) || this.partnerApiServer;
-    this.searchBox = settings.searchBoxes?.[0] || null;
+    await db.open();
+    const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+    this.activeDid = (settings?.activeDid as string) || "";
+    this.apiServer = (settings?.apiServer as string) || "";
+    this.searchBox = settings?.searchBoxes?.[0] || null;
 
     this.allContacts = await db.contacts.toArray();
 
-    this.allMyDids = await retrieveAccountDids();
+    await accountsDB.open();
+    const allAccounts = await accountsDB.accounts.toArray();
+    this.allMyDids = allAccounts.map((acc) => acc.did);
 
-    this.searchTerms = this.$route.query["searchText"]?.toString() || "";
-
-    if (!settings.finishedOnboarding) {
-      (this.$refs.onboardingDialog as OnboardingDialog).open(
-        OnboardPage.Discover,
-      );
-    }
+    this.searchTerms = (this.$route as Router).query["searchText"] || "";
 
     if (this.searchBox) {
       await this.searchLocal();
-
-      const bbox = this.searchBox.bbox;
-      this.localCenterLat = (bbox.maxLat + bbox.minLat) / 2;
-      this.localCenterLong = (bbox.eastLong + bbox.westLong) / 2;
     } else {
       this.isLocalActive = false;
-      this.isMappedActive = false;
-      this.isAnywhereActive = true;
+      this.isRemoteActive = true;
       await this.searchAll();
     }
   }
@@ -414,9 +204,6 @@ export default class DiscoverView extends Vue {
   public async searchSelected() {
     if (this.isLocalActive) {
       await this.searchLocal();
-    } else if (this.isMappedActive) {
-      const mapRef = this.$refs.projectMap as L.Map;
-      this.requestTiles(mapRef.leafletObject); // not ideal because I found this from experimentation, not documentation
     } else {
       await this.searchAll();
     }
@@ -428,7 +215,6 @@ export default class DiscoverView extends Vue {
     if (!beforeId) {
       // this was an initial search so clear any previous results
       this.projects = [];
-      this.userProfiles = [];
     }
 
     let queryParams = "claimContents=" + encodeURIComponent(this.searchTerms);
@@ -437,60 +223,64 @@ export default class DiscoverView extends Vue {
       queryParams = queryParams + `&beforeId=${beforeId}`;
     }
 
-    const endpoint = this.isProjectsActive
-      ? this.apiServer + "/api/v2/report/plans"
-      : this.partnerApiServer + "/api/partner/userProfile";
-
     try {
       this.isLoading = true;
-      const response = await fetch(endpoint + "?" + queryParams, {
-        method: "GET",
-        headers: await getHeaders(this.activeDid),
-      });
+      const response = await fetch(
+        this.apiServer + "/api/v2/report/plans?" + queryParams,
+        {
+          method: "GET",
+          headers: await getHeaders(this.activeDid),
+        },
+      );
 
       if (response.status !== 200) {
         const details = await response.text();
+        console.error("Problem with full search:", details);
+        this.$notify(
+          {
+            group: "alert",
+            type: "danger",
+            title: "Error",
+            text: `There was a problem accessing the server. Try again later.`,
+          },
+          -1,
+        );
+
         throw details;
       }
 
       const results = await response.json();
 
-      if (this.isProjectsActive) {
-        this.userProfiles = [];
-        const plans: PlanData[] = results.data;
-        if (plans) {
-          this.projects.push(...plans);
-          this.remoteCount = this.projects.length;
-        } else {
-          throw JSON.stringify(results);
+      const plans: PlanData[] = results.data;
+      if (plans) {
+        for (const plan of plans) {
+          const { name, description, handleId, image, issuerDid, rowid } = plan;
+          this.projects.push({
+            name,
+            description,
+            handleId,
+            image,
+            issuerDid,
+            rowid,
+          });
         }
+        this.remoteCount = this.projects.length;
       } else {
-        this.projects = [];
-        const profiles: UserProfile[] = results.data;
-        if (profiles) {
-          this.userProfiles.push(...profiles);
-          this.remoteCount = this.userProfiles.length;
-        } else {
-          throw JSON.stringify(results);
-        }
+        throw JSON.stringify(results);
       }
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (e: any) {
-      console.error("Error with search all:", e);
+      console.error("Error with feed load:", e);
       // this sometimes gives different information
-      console.error("Error with search all (error added): " + e);
+      console.error("Error with feed load (error added): " + e);
       this.$notify(
         {
           group: "alert",
           type: "danger",
-          title: "Error Searching",
-          text:
-            e.userMessage ||
-            "There was a problem retrieving " +
-              (this.isProjectsActive ? "projects" : "profiles") +
-              ".",
+          title: "Error",
+          text: e.userMessage || "There was a problem retrieving projects.",
         },
-        5000,
+        -1,
       );
     } finally {
       this.isLoading = false;
@@ -500,20 +290,14 @@ export default class DiscoverView extends Vue {
   public async searchLocal(beforeId?: string) {
     this.resetCounts();
 
-    const searchBox =
-      (this.isMappedActive && this.tempSearchBox) ||
-      (this.isLocalActive && this.searchBox?.bbox);
-
-    if (!searchBox) {
+    if (!this.searchBox) {
       this.projects = [];
-      this.userProfiles = [];
       return;
     }
 
     if (!beforeId) {
       // this was an initial search so clear any previous results
       this.projects = [];
-      this.userProfiles = [];
     }
 
     const claimContents =
@@ -521,68 +305,74 @@ export default class DiscoverView extends Vue {
 
     let queryParams = [
       claimContents,
-      "minLocLat=" + searchBox.minLat,
-      "maxLocLat=" + searchBox.maxLat,
-      "minLocLon=" + searchBox.westLong,
-      "maxLocLon=" + searchBox.eastLong,
+      "minLocLat=" + this.searchBox.bbox.minLat,
+      "maxLocLat=" + this.searchBox.bbox.maxLat,
+      "westLocLon=" + this.searchBox.bbox.westLong,
+      "eastLocLon=" + this.searchBox.bbox.eastLong,
     ].join("&");
 
     if (beforeId) {
       queryParams = queryParams + `&beforeId=${beforeId}`;
     }
 
-    const endpoint = this.isProjectsActive
-      ? this.apiServer + "/api/v2/report/plansByLocation"
-      : this.partnerApiServer + "/api/partner/userProfile";
-
     try {
       this.isLoading = true;
-      const response = await fetch(endpoint + "?" + queryParams, {
-        method: "GET",
-        headers: await getHeaders(this.activeDid),
-      });
+      const response = await fetch(
+        this.apiServer + "/api/v2/report/plansByLocation?" + queryParams,
+        {
+          method: "GET",
+          headers: await getHeaders(this.activeDid),
+        },
+      );
 
       if (response.status !== 200) {
         const details = await response.text();
-        throw details;
+        console.error("Problem with nearby search:", details);
+        this.$notify(
+          {
+            group: "alert",
+            type: "danger",
+            title: "Error",
+            text: "There was a problem accessing the server. Try again later.",
+          },
+          -1,
+        );
+        throw await response.text();
       }
 
       const results = await response.json();
 
-      if (this.isProjectsActive) {
-        this.userProfiles = [];
-        const plans: PlanData[] = results.data;
-        if (plans) {
-          this.projects.push(...plans);
-          this.localCount = this.projects.length;
+      if (results.data) {
+        if (beforeId) {
+          const plans: PlanData[] = results.data;
+          for (const plan of plans) {
+            const { name, description, handleId, issuerDid, rowid } = plan;
+            this.projects.push({
+              name,
+              description,
+              handleId,
+              issuerDid,
+              rowid,
+            });
+          }
         } else {
-          throw JSON.stringify(results);
+          this.projects = results.data;
         }
+        this.localCount = this.projects.length;
       } else {
-        this.projects = [];
-        const profiles: UserProfile[] = results.data;
-        if (profiles) {
-          this.userProfiles.push(...profiles);
-          this.localCount = this.userProfiles.length;
-        } else {
-          throw JSON.stringify(results);
-        }
+        throw JSON.stringify(results);
       }
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (e: any) {
-      console.error("Error with search local:", e);
+      console.error("Error with feed load:", e);
       this.$notify(
         {
           group: "alert",
           type: "danger",
           title: "Error",
-          text:
-            e.userMessage ||
-            "There was a problem retrieving " +
-              (this.isProjectsActive ? "projects" : "profiles") +
-              ".",
+          text: e.userMessage || "There was a problem retrieving projects.",
         },
-        5000,
+        -1,
       );
     } finally {
       this.isLoading = false;
@@ -594,156 +384,26 @@ export default class DiscoverView extends Vue {
    * @param payload is the flag from the InfiniteScroll indicating if it should load
    **/
   async loadMoreData(payload: boolean) {
-    if (payload) {
-      if (this.isProjectsActive && this.projects.length > 0) {
-        const latestProject = this.projects[this.projects.length - 1];
-        if (this.isLocalActive || this.isMappedActive) {
-          this.searchLocal(latestProject.rowId);
-        } else if (this.isAnywhereActive) {
-          this.searchAll(latestProject.rowId);
-        }
-      } else if (this.isPeopleActive && this.userProfiles.length > 0) {
-        const latestProfile = this.userProfiles[this.userProfiles.length - 1];
-        if (this.isLocalActive || this.isMappedActive) {
-          this.searchLocal(latestProfile.rowId || "");
-        } else if (this.isAnywhereActive) {
-          this.searchAll(latestProfile.rowId || "");
-        }
+    if (this.projects.length > 0 && payload) {
+      const latestProject = this.projects[this.projects.length - 1];
+      if (this.isLocalActive) {
+        this.searchLocal(latestProject["rowid"]);
+      } else if (this.isRemoteActive) {
+        this.searchAll(latestProject["rowid"]);
       }
     }
   }
 
-  clearMarkers() {
-    Object.values(this.markers).forEach((marker) => marker.remove());
-    this.markers = {};
-  }
-
-  async onMapReady(map: L.Map) {
-    // doing this here instead of on the l-map element avoids a recentering after a drag then zoom at startup
-    map.setView([this.localCenterLat, this.localCenterLong], 2);
-    this.requestTiles(map);
-  }
-
-  // Tried but failed to use other vue-leaflet methods update:zoom and update:bounds
-  // To access the from this.$refs, use this.$refs.projectMap.leafletObject (or maybe mapObject)
-
-  onMoveStart(/* event: L.LocationEvent */) {
-    // don't remove markers because they follow the map when moving (and the experience is jarring)
-  }
-
-  async onMoveEnd(event: L.LocationEvent) {
-    if (this.zoomedSoDoNotMove) {
-      // since a zoom triggers a moveend, too, don't duplicate a tile request
-      this.zoomedSoDoNotMove = false;
-    } else {
-      // not part of a zoom so request tiles
-      await this.requestTiles(event.target);
-    }
-  }
-
-  onZoomStart(/* event: L.LocationEvent */) {
-    // remove markers because otherwise they jump around at zoom end
-    this.clearMarkers();
-
-    this.zoomedSoDoNotMove = true;
-  }
-
-  async onZoomEnd(event: L.LocationEvent) {
-    await this.requestTiles(event.target);
-  }
-
-  async requestTiles(targetMap: L.Map) {
-    try {
-      const bounds = targetMap.getBounds();
-      const queryParams = [
-        "minLocLat=" + bounds?.getSouthWest().lat,
-        "maxLocLat=" + bounds?.getNorthEast().lat,
-        "westLocLon=" + bounds?.getSouthWest().lng,
-        "eastLocLon=" + bounds?.getNorthEast().lng,
-      ].join("&");
-      const endpoint = this.isProjectsActive
-        ? this.apiServer + "/api/v2/report/planCountsByBBox"
-        : this.partnerApiServer + "/api/partner/userProfileCountsByBBox";
-      const response = await fetch(endpoint + "?" + queryParams);
-      if (response.status === 200) {
-        this.clearMarkers();
-        const results = await response.json();
-        if (results.data?.tiles?.length > 0) {
-          for (const tile: Tile of results.data.tiles) {
-            const pinLat = (tile.minFoundLat + tile.maxFoundLat) / 2;
-            const pinLon = (tile.minFoundLon + tile.maxFoundLon) / 2;
-            const numberIcon = L.divIcon({
-              className: "numbered-marker",
-              html: `<strong>${tile.recordCount}</strong>`,
-              iconSize: [24, 24],
-              // Why isn't this showing?
-              iconAnchor: [12, 12], // coordinates of the tip of the icon relative to the top-left corner of the icon
-            });
-            const marker = L.marker([pinLat, pinLon], { icon: numberIcon });
-            marker.addTo(targetMap);
-            marker.on("click", () => {
-              this.tempSearchBox = {
-                minLat: tile.minFoundLat,
-                maxLat: tile.maxFoundLat,
-                westLong: tile.minFoundLon,
-                eastLong: tile.maxFoundLon,
-              };
-              this.searchLocal();
-            });
-            this.markers[
-              "" +
-                tile.indexLat +
-                "X" +
-                tile.indexLon +
-                "_" +
-                tile.minFoundLat +
-                "X" +
-                tile.minFoundLon +
-                "-" +
-                tile.maxFoundLat +
-                "X" +
-                tile.maxFoundLon
-            ] = marker;
-          }
-        }
-      } else {
-        throw {
-          message: "Got an error loading projects on the map.",
-          response: {
-            status: response.status,
-            statusText: response.statusText,
-            url: response.url,
-          },
-        };
-      }
-    } catch (e) {
-      logConsoleAndDb(
-        "Error loading projects on the map: " + errorStringForLog(e),
-        true,
-      );
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Map Error",
-          text: "There was a problem loading projects on the map.",
-        },
-        3000,
-      );
-    }
-  }
-
   /**
-   * Handle clicking on a project or profile entry found in the list
-   * @param id of the project or profile
+   * Handle clicking on a project entry found in the list
+   * @param id of the project
    **/
-  onClickLoadItem(id: string) {
+  onClickLoadProject(id: string) {
+    localStorage.setItem("projectId", id);
     const route = {
-      path: this.isProjectsActive
-        ? "/project/" + encodeURIComponent(id)
-        : "/userProfile/" + encodeURIComponent(id),
+      path: "/project/" + encodeURIComponent(id),
     };
-    this.$router.push(route);
+    (this.$router as Router).push(route);
   }
 
   public computedLocalTabStyleClassNames() {
@@ -764,24 +424,6 @@ export default class DiscoverView extends Vue {
     };
   }
 
-  public computedMappedTabStyleClassNames() {
-    return {
-      "inline-block": true,
-      "py-3": true,
-      "rounded-t-lg": true,
-      "border-b-2": true,
-
-      active: this.isMappedActive,
-      "text-black": this.isMappedActive,
-      "border-black": this.isMappedActive,
-      "font-semibold": this.isMappedActive,
-
-      "text-blue-600": !this.isMappedActive,
-      "border-transparent": !this.isMappedActive,
-      "hover:border-slate-400": !this.isMappedActive,
-    };
-  }
-
   public computedRemoteTabStyleClassNames() {
     return {
       "inline-block": true,
@@ -789,67 +431,15 @@ export default class DiscoverView extends Vue {
       "rounded-t-lg": true,
       "border-b-2": true,
 
-      active: this.isAnywhereActive,
-      "text-black": this.isAnywhereActive,
-      "border-black": this.isAnywhereActive,
-      "font-semibold": this.isAnywhereActive,
+      active: this.isRemoteActive,
+      "text-black": this.isRemoteActive,
+      "border-black": this.isRemoteActive,
+      "font-semibold": this.isRemoteActive,
 
-      "text-blue-600": !this.isAnywhereActive,
-      "border-transparent": !this.isAnywhereActive,
-      "hover:border-slate-400": !this.isAnywhereActive,
-    };
-  }
-
-  public computedProjectsTabStyleClassNames() {
-    return {
-      "inline-block": true,
-      "py-3": true,
-      "rounded-t-lg": true,
-      "border-b-2": true,
-
-      active: this.isProjectsActive,
-      "text-black": this.isProjectsActive,
-      "border-black": this.isProjectsActive,
-      "font-semibold": this.isProjectsActive,
-
-      "text-blue-600": !this.isProjectsActive,
-      "border-transparent": !this.isProjectsActive,
-      "hover:border-slate-400": !this.isProjectsActive,
-    };
-  }
-
-  public computedPeopleTabStyleClassNames() {
-    return {
-      "inline-block": true,
-      "py-3": true,
-      "rounded-t-lg": true,
-      "border-b-2": true,
-
-      active: this.isPeopleActive,
-      "text-black": this.isPeopleActive,
-      "border-black": this.isPeopleActive,
-      "font-semibold": this.isPeopleActive,
-
-      "text-blue-600": !this.isPeopleActive,
-      "border-transparent": !this.isPeopleActive,
-      "hover:border-slate-400": !this.isPeopleActive,
+      "text-blue-600": !this.isRemoteActive,
+      "border-transparent": !this.isRemoteActive,
+      "hover:border-slate-400": !this.isRemoteActive,
     };
   }
 }
 </script>
-<style>
-.numbered-marker {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  text-align: center;
-  font-size: 14px;
-  font-weight: bold;
-  color: white;
-  background: blue;
-  width: 24px;
-  height: 24px;
-  border-radius: 50%;
-  border: 2px solid white;
-}
-</style>

src/views/GiftedDetailsView.vue

@@ -21,25 +21,15 @@
     <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>From {{ giverName }}</span>
       <span>
         to
         {{
           givenToProject
-            ? fulfillsProjectName
+            ? projectName
             : givenToRecipient
               ? recipientName
-              : "someone not named"
+              : "someone unidentified"
         }}</span
       >
     </h1>
@@ -74,7 +64,7 @@
       </div>
     </div>
 
-    <div class="flex justify-center mt-4" data-testId="imagery">
+    <div class="flex justify-center mt-4" data-testid="imagery">
       <span v-if="imageUrl" class="flex justify-between">
         <a :href="imageUrl" target="_blank">
           <img :src="imageUrl" class="h-24 rounded-xl" />
@@ -95,132 +85,56 @@
     </div>
     <ImageMethodDialog ref="imageDialog" />
 
-    <div class="mt-4 flex justify-between gap-2">
-      <!-- First Column for Giver -->
-      <div class="flex-grow border border-slate-400 p-2 rounded-md">
-        <div class="flex">
-          <input
-            v-if="giverDid && !providedByProject"
-            type="checkbox"
-            class="h-6 w-6 mr-2"
-            v-model="providedByGiver"
-          />
-          <fa
-            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">
-            {{
-              giverDid
-                ? "This was provided by " + giverName + "."
-                : "No named individual gave."
-            }}
-          </label>
-          <fa
-            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"
-            @click="notifyUserOfGiver()"
-          />
-        </div>
-
-        <div class="flex">
-          <input
-            v-if="providerProjectId && !providedByGiver"
-            type="checkbox"
-            class="h-6 w-6 mr-2"
-            v-model="providedByProject"
-          />
-          <fa
-            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">
-            {{
-              providerProjectId
-                ? "This was provided by " + providerProjectName + "."
-                : "This was not provided by a project."
-            }}
-          </label>
-          <fa
-            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"
-            @click="notifyUserOfProvidingProject()"
-          />
-        </div>
-      </div>
-
-      <div class="flex-shrink flex justify-center items-center">
-        <fa icon="arrow-right" class="fa-fw h-7" />
-      </div>
-
-      <!-- Third Column for Recipient -->
-      <div class="flex-grow border border-slate-400 p-2 rounded-md">
-        <div class="flex">
-          <input
-            v-if="recipientDid && !givenToProject"
-            type="checkbox"
-            class="h-6 w-6 mr-2"
-            v-model="givenToRecipient"
-          />
-          <fa
-            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">
-            {{
-              recipientDid
-                ? "This was given to " + recipientName + "."
-                : "No individual benefitted."
-            }}
-          </label>
-          <fa
-            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"
-            @click="notifyUserOfRecipient()"
-          />
-        </div>
-
-        <div class="flex">
-          <input
-            v-if="fulfillsProjectId && !givenToRecipient"
-            type="checkbox"
-            class="h-6 w-6 mr-2"
-            v-model="givenToProject"
-          />
-          <fa
-            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">
-            {{
-              fulfillsProjectId
-                ? "This was given to " + fulfillsProjectName + ". "
-                : "No project benefitted."
-            }}
-          </label>
-          <fa
-            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"
-            @click="notifyUserFulfillsProject()"
-          />
-        </div>
-      </div>
+    <div class="h-7 mt-4 flex">
+      <input
+        v-if="projectId && !givenToRecipient"
+        type="checkbox"
+        class="h-6 w-6 mr-2"
+        v-model="givenToProject"
+      />
+      <fa
+        v-else
+        icon="square"
+        class="bg-slate-500 text-slate-500 h-5 w-5 px-0.5 py-0.5 mr-2 rounded"
+        @click="notifyUserOfProject()"
+      />
+      <label class="text-sm mt-1">
+        {{
+          projectId
+            ? "This was given to " + projectName
+            : "No project was chosen"
+        }}
+      </label>
     </div>
 
-    <div class="mt-8 flex">
+    <div class="h-7 mt-4 flex">
+      <input
+        v-if="recipientDid && !givenToProject"
+        type="checkbox"
+        class="h-6 w-6 mr-2"
+        v-model="givenToRecipient"
+      />
+      <fa
+        v-else
+        icon="square"
+        class="bg-slate-500 text-slate-500 h-5 w-5 px-0.5 py-0.5 mr-2 rounded"
+        @click="notifyUserOfRecipient()"
+      />
+      <label class="text-sm mt-1">
+        {{
+          recipientDid
+            ? "This was given to " + recipientName
+            : "No recipient was chosen."
+        }}
+      </label>
+    </div>
+
+    <div class="mt-4 flex">
       <input type="checkbox" class="h-6 w-6 mr-2" v-model="isTrade" />
       <label class="text-sm mt-1">This was a trade (not a gift)</label>
     </div>
 
-    <div v-if="showGeneralAdvanced" class="mt-4 flex">
+    <div class="mt-4 flex">
       <router-link
         :to="{
           name: 'claim-add-raw',
@@ -230,7 +144,7 @@
         }"
         class="text-blue-500"
       >
-        Edit Raw Data
+        Edit & Submit Raw
       </router-link>
     </div>
 
@@ -267,7 +181,8 @@ import ImageMethodDialog from "@/components/ImageMethodDialog.vue";
 import QuickNav from "@/components/QuickNav.vue";
 import TopMessage from "@/components/TopMessage.vue";
 import { DEFAULT_IMAGE_API_SERVER, NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
+import { accountsDB, db } from "@/db/index";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
 import {
   createAndSubmitGive,
   didInfo,
@@ -279,7 +194,7 @@ import {
   hydrateGive,
 } from "@/libs/endorserServer";
 import * as libsUtil from "@/libs/util";
-import { retrieveAccountDids } from "@/libs/util";
+import { Contact } from "@/db/tables/contacts";
 
 @Component({
   components: {
@@ -297,11 +212,9 @@ export default class GiftedDetails extends Vue {
   amountInput = "0";
   description = "";
   destinationPathAfter = "";
-  fulfillsProjectId = "";
-  fulfillsProjectName = "a project";
-  givenToProject = false; // basically static, based on input; if we allow changing then let's fix things (see below)
-  givenToRecipient = false; // basically static, based on input; if we allow changing then let's fix things (see below)
-  giverDid = "";
+  givenToProject = false;
+  givenToRecipient = false;
+  giverDid: string | undefined;
   giverName = "";
   hideBackButton = false;
   imageUrl = "";
@@ -309,13 +222,10 @@ export default class GiftedDetails extends Vue {
   message = "";
   offerId = "";
   prevCredToEdit?: GenericCredWrapper<GiveVerifiableCredential>;
-  providerProjectId = "";
-  providerProjectName = "a project";
-  providedByProject = false; // basically static, based on input; if we allow changing then let's fix things (see below)
-  providedByGiver = false; // basically static, based on input; if we allow changing then let's fix things (see below)
+  projectId = "";
+  projectName = "a project";
   recipientDid = "";
   recipientName = "";
-  showGeneralAdvanced = false;
   unitCode = "HUR";
 
   libsUtil = libsUtil;
@@ -372,31 +282,11 @@ export default class GiftedDetails extends Vue {
       offer?.identifier ||
       this.offerId) as string;
 
-    // find any fulfills project ID
-    const fulfillsProject = fulfillsArray.find(
-      (rec) => rec["@type"] === "PlanAction",
-    );
-    // eslint-disable-next-line prettier/prettier
-    this.fulfillsProjectId =
-      ((this.$route as Router).query["fulfillsProjectId"] ||
-      fulfillsProject?.identifier ||
-      this.fulfillsProjectId) as string;
-
-    // find any provider project ID
-    const provider = this.prevCredToEdit?.claim?.provider;
-    const providerArray = Array.isArray(provider)
-      ? provider
-      : provider
-        ? [provider]
-        : [];
-    const providerProject = providerArray.find(
-      (rec) => rec["@type"] === "PlanAction",
-    );
-    this.providerProjectId = ((this.$route as Router).query[
-      "providerProjectId"
-    ] ||
-      providerProject?.identifier ||
-      this.providerProjectId) as string;
+    // find any project ID
+    const project = fulfillsArray.find((rec) => rec["@type"] === "PlanAction");
+    this.projectId = ((this.$route as Router).query["projectId"] ||
+      project?.identifier ||
+      this.projectId) as string;
 
     this.recipientDid = ((this.$route as Router).query["recipientDid"] ||
       this.prevCredToEdit?.claim?.recipient?.identifier) as string;
@@ -428,65 +318,68 @@ export default class GiftedDetails extends Vue {
       this.imageUrl = (this.$route as Router).query["shareUrl"] as string;
     }
 
-    const settings = await retrieveSettingsForActiveAccount();
-    this.apiServer = settings.apiServer || "";
-    this.activeDid = settings.activeDid || "";
+    try {
+      await db.open();
+      const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+      this.apiServer = settings?.apiServer || "";
+      this.activeDid = settings?.activeDid || "";
 
-    if (
-      (this.giverDid && !this.giverName) ||
-      (this.recipientDid && !this.recipientName)
-    ) {
-      const allContacts = await db.contacts.toArray();
-      const allMyDids = await retrieveAccountDids();
-      if (this.giverDid && !this.giverName) {
-        this.giverName = didInfo(
-          this.giverDid,
-          this.activeDid,
-          allMyDids,
-          allContacts,
-        );
-      }
-      if (this.recipientDid && !this.recipientName) {
-        this.recipientName = didInfo(
-          this.recipientDid,
-          this.activeDid,
-          allMyDids,
-          allContacts,
-        );
+      let allContacts: Contact[] = [];
+      let allMyDids: string[] = [];
+      if (
+        (this.giverDid && !this.giverName) ||
+        (this.recipientDid && !this.recipientName)
+      ) {
+        allContacts = await db.contacts.toArray();
+
+        await accountsDB.open();
+        const allAccounts = await accountsDB.accounts.toArray();
+        allMyDids = allAccounts.map((acc) => acc.did);
+        if (this.giverDid && !this.giverName) {
+          this.giverName = didInfo(
+            this.giverDid,
+            this.activeDid,
+            allMyDids,
+            allContacts,
+          );
+        }
+        if (this.recipientDid && !this.recipientName) {
+          this.recipientName = didInfo(
+            this.recipientDid,
+            this.activeDid,
+            allMyDids,
+            allContacts,
+          );
+        }
       }
+      // these should be functions but something's wrong with the syntax in the <> conditional
+      this.givenToProject = !!this.projectId;
+      this.givenToRecipient = !this.givenToProject && !!this.recipientDid;
+
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    } catch (err: any) {
+      console.error("Error retrieving settings from database:", err);
+      this.$notify(
+        {
+          group: "alert",
+          type: "danger",
+          title: "Error",
+          text: err.message || "There was an error retrieving your settings.",
+        },
+        -1,
+      );
     }
-    // these should be functions but something's wrong with the syntax in the <> conditional
-    this.givenToProject = !!this.fulfillsProjectId;
-    this.givenToRecipient = !this.givenToProject && !!this.recipientDid;
 
-    // these should be functions but something's wrong with the syntax in the <> conditional
-    this.providedByProject = !!this.providerProjectId;
-    this.providedByGiver = !this.providedByProject && !!this.giverDid;
-
-    this.showGeneralAdvanced = !!settings.showGeneralAdvanced;
-
-    if (this.fulfillsProjectId) {
-      // console.log("Getting project name from cache", this.fulfillsProjectId);
-      const fulfillsProject = await getPlanFromCache(
-        this.fulfillsProjectId,
+    if (this.projectId) {
+      // console.log("Getting project name from cache", this.projectId);
+      const project = await getPlanFromCache(
+        this.projectId,
         this.axios,
         this.apiServer,
         this.activeDid,
       );
-      this.fulfillsProjectName = fulfillsProject?.name
-        ? `the project "${fulfillsProject.name}"`
-        : "a project";
-    }
-    if (this.providerProjectId) {
-      // console.log("Getting project name from cache", this.providerProjectId);
-      const providerProject = await getPlanFromCache(
-        this.providerProjectId,
-        this.axios,
-        this.apiServer,
-        this.activeDid,
-      );
-      this.providerProjectName = providerProject?.name
-        ? `the project "${providerProject.name}"`
+      this.projectName = project?.name
+        ? "the project: " + project.name
         : "a project";
     }
   }
@@ -577,7 +470,7 @@ export default class GiftedDetails extends Vue {
       console.error("Error deleting image:", error);
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       if ((error as any).response.status === 404) {
-        console.log("Weird: the image was already deleted.", error);
+        console.log("The image was already deleted:", error);
 
         localStorage.removeItem("imageUrl");
         this.imageUrl = "";
@@ -651,24 +544,25 @@ export default class GiftedDetails extends Vue {
     await this.recordGive();
   }
 
-  notifyUserOfGiver() {
-    if (!this.giverDid) {
+  notifyUserOfProject() {
+    if (!this.projectId) {
       this.$notify(
         {
           group: "alert",
           type: "warning",
-          title: "Go To The Contacts Page",
-          text: "To assign a giver, you must open this page from a contact.",
+          title: "Error",
+          text: "To assign to a project, you must open this page through a project.",
         },
         3000,
       );
     } else {
+      // must be because givenToRecipient is true
       this.$notify(
         {
           group: "alert",
           type: "warning",
-          title: "Unavailable",
-          text: "You cannot assign both a giver and a project.",
+          title: "Error",
+          text: "You cannot assign both to a project and to a recipient.",
         },
         3000,
       );
@@ -681,7 +575,7 @@ export default class GiftedDetails extends Vue {
         {
           group: "alert",
           type: "warning",
-          title: "Go To The Contacts Page",
+          title: "Error",
           text: "To assign to a recipient, you must open this page from a contact.",
         },
         3000,
@@ -692,7 +586,7 @@ export default class GiftedDetails extends Vue {
         {
           group: "alert",
           type: "warning",
-          title: "Unavailable",
+          title: "Error",
           text: "You cannot assign both to a recipient and to a project.",
         },
         3000,
@@ -700,58 +594,6 @@ export default class GiftedDetails extends Vue {
     }
   }
 
-  notifyUserOfProvidingProject() {
-    // we're here because they clicked and either there is no provider project or there is a giver chosen
-    if (!this.providerProjectId) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "warning",
-          title: "Go To The Project Page",
-          text: "To select a project as a provider, you must open this page through a project.",
-        },
-        3000,
-      );
-    } else {
-      // no providing project was chosen
-      this.$notify(
-        {
-          group: "alert",
-          type: "warning",
-          title: "Unavailable",
-          text: "You cannot select both a giving project and person.",
-        },
-        3000,
-      );
-    }
-  }
-
-  notifyUserFulfillsProject() {
-    // we're here because they clicked and either there is no fulfills project or there is a recipient chosen
-    if (!this.fulfillsProjectId) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "warning",
-          title: "Go To The Project Page",
-          text: "To assign to a project, you must open this page through a project.",
-        },
-        3000,
-      );
-    } else {
-      // no fulfills project was chosen
-      this.$notify(
-        {
-          group: "alert",
-          type: "warning",
-          title: "Unavailable",
-          text: "You cannot assign both to a project and to a recipient.",
-        },
-        3000,
-      );
-    }
-  }
-
   /**
    *
    * @param giverDid may be null
@@ -761,13 +603,10 @@ export default class GiftedDetails extends Vue {
    */
   public async recordGive() {
     try {
-      const giverDid = this.providedByGiver ? this.giverDid : undefined;
       const recipientDid = this.givenToRecipient
         ? this.recipientDid
         : undefined;
-      const fulfillsProjectId = this.givenToProject
-        ? this.fulfillsProjectId
-        : undefined;
+      const projectId = this.givenToProject ? this.projectId : undefined;
       let result;
       if (this.prevCredToEdit) {
         // don't create from a blank one in case some properties were set from a different interface
@@ -776,32 +615,30 @@ export default class GiftedDetails extends Vue {
           this.apiServer,
           this.prevCredToEdit,
           this.activeDid,
-          giverDid,
+          this.giverDid,
           recipientDid,
           this.description,
           parseFloat(this.amountInput),
           this.unitCode,
-          fulfillsProjectId,
+          projectId,
           this.offerId,
           this.isTrade,
           this.imageUrl,
-          this.providerProjectId,
         );
       } else {
         result = await createAndSubmitGive(
           this.axios,
           this.apiServer,
           this.activeDid,
-          giverDid,
+          this.giverDid,
           recipientDid,
           this.description,
           parseFloat(this.amountInput),
           this.unitCode,
-          fulfillsProjectId,
+          projectId,
           this.offerId,
           this.isTrade,
           this.imageUrl,
-          this.providerProjectId,
         );
       }
 
@@ -818,7 +655,7 @@ export default class GiftedDetails extends Vue {
             title: "Error",
             text: errorMessage || "There was an error creating the give.",
           },
-          5000,
+          -1,
         );
       } else {
         this.$notify(
@@ -828,7 +665,7 @@ export default class GiftedDetails extends Vue {
             title: "Success",
             text: `That ${this.isTrade ? "trade" : "gift"} was recorded.`,
           },
-          3000,
+          5000,
         );
         localStorage.removeItem("imageUrl");
         if (this.destinationPathAfter) {
@@ -851,29 +688,25 @@ export default class GiftedDetails extends Vue {
           title: "Error",
           text: errorMessage,
         },
-        5000,
+        -1,
       );
     }
   }
 
   constructGiveParam() {
-    const giverDid = this.providedByGiver ? this.giverDid : undefined;
     const recipientDid = this.givenToRecipient ? this.recipientDid : undefined;
-    const fulfillsProjectId = this.givenToProject
-      ? this.fulfillsProjectId
-      : undefined;
+    const projectId = this.givenToProject ? this.projectId : undefined;
     const giveClaim = hydrateGive(
       this.prevCredToEdit?.claim as GiveVerifiableCredential,
-      giverDid,
+      this.giverDid,
       recipientDid,
       this.description,
       parseFloat(this.amountInput),
       this.unitCode,
-      fulfillsProjectId,
+      projectId,
       this.offerId,
       this.isTrade,
       this.imageUrl,
-      this.providerProjectId,
       this.prevCredToEdit?.id as string,
     );
     const claimStr = JSON.stringify(giveClaim);
@@ -912,7 +745,7 @@ export default class GiftedDetails extends Vue {
         title: "Data Sharing",
         text: libsUtil.PRIVACY_MESSAGE,
       },
-      7000,
+      -1,
     );
   }
 }

src/views/HelpNotificationTypesView.vue

@@ -1,68 +0,0 @@
-<template>
-  <QuickNav />
-
-  <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Breadcrumb -->
-    <div class="mb-8">
-      <!-- Back -->
-      <div class="text-lg text-center font-light relative px-7">
-        <h1
-          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
-          @click="$router.back()"
-        >
-          <fa icon="chevron-left" class="fa-fw"></fa>
-        </h1>
-      </div>
-
-      <!-- Heading -->
-      <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
-        Notification Types
-      </h1>
-    </div>
-
-    <!-- eslint-disable prettier/prettier -->
-    <div>
-      <p>There are two types of notifications:</p>
-
-      <h2 class="text-xl font-semibold mt-4">Reminder Notifications</h2>
-      <div>
-        <p>
-          The Reminder Notification will be sent to you daily with a specific message,
-          at whatever time you choose. Use it to remind
-          yourself to act, for example: pause and consider who has given you
-          something, so you can record thanks in here.
-        </p>
-        <p>
-          This is a reliable message, but it doesn't contain any details about
-          activity that might be especially interesting to you.
-        </p>
-      </div>
-
-      <h2 class="text-xl font-semibold mt-4">New Activity Notifications</h2>
-      <div>
-        <p>
-          The New Activity Notification will be sent to you when there is new, relevant activity for you.
-          It will only trigger if something involves you or a project of interest; it will not
-          bug you for other, general activity.
-        </p>
-        <p>
-          This type is not as reliable as a Reminder Notification because mobile devices often suppress
-          such notifications to save battery. (If you want to quickly check for relevant activity daily,
-          use the Reminder Notification and open the app and look for a large green button that points out new
-          activity that is personal to you. We are working on other ways to notify you more
-          reliably -- <router-link class="text-blue-500" to="/help">go here to follow us or contact us</router-link>.)
-        </p>
-      </div>
-    </div>
-    <!-- eslint-enable -->
-  </section>
-</template>
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-
-import QuickNav from "@/components/QuickNav.vue";
-
-@Component({ components: { QuickNav } })
-export default class HelpNotificationTypesView extends Vue {}
-</script>

src/views/HelpNotificationsView.vue

@@ -39,15 +39,6 @@
         </p>
       </div>
 
-      <h2 class="text-xl font-semibold mt-4">Android Users</h2>
-      <div>
-        <p>
-          Note that you may not receive notifications when the app is in the
-          background. When you're done working, close the app, and then you'll
-          get the reminder notifications.
-        </p>
-      </div>
-
       <h2 class="text-xl font-semibold mt-4">
         If this app doesn't support notifications...
         <!-- Note that that exact verbiage shows in a message elsewhere. -->
@@ -75,7 +66,6 @@
           <button class="text-blue-500" @click="showNotificationChoice()">
             Click here.
           </button>
-          <PushNotificationPermission ref="pushNotificationPermission" />
         </p>
       </div>
 
@@ -194,18 +184,14 @@
       <h2 class="text-xl font-semibold mt-4">Reinstall</h2>
       <div>
         <p>
-          If all else fails, it's best to start over.
+          If all else fails, uninstall the app, ensure all the browser tabs with
+          it are closed, and clear out caches and storage.
         </p>
         <p>
           Of course, you'll want to back up all your data first -- all seeds as
-          well as the contacts & settings -- on the Profile
+          well as the contacts & settings -- on the Account
           <fa icon="circle-user" /> page.
         </p>
-        <p>
-          Here are instructions to uninstall the app and clear out caches and storage.
-          Note that you should first ensure check that the browser tabs with Time Safari are closed.
-          (If any are open then that will interfere with your refresh.)
-        </p>
         <ul class="ml-4 list-disc">
           <li>
             Clear cache.
@@ -309,12 +295,9 @@ import { Component, Vue } from "vue-facing-decorator";
 
 import QuickNav from "@/components/QuickNav.vue";
 import { NotificationIface } from "@/constants/app";
-import { DIRECT_PUSH_TITLE, sendTestThroughPushServer } from "@/libs/util";
-import PushNotificationPermission from "@/components/PushNotificationPermission.vue";
-import { db } from "@/db/index";
-import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
+import { sendTestThroughPushServer } from "@/libs/util";
 
-@Component({ components: { PushNotificationPermission, QuickNav } })
+@Component({ components: { QuickNav } })
 export default class HelpNotificationsView extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
@@ -322,8 +305,8 @@ export default class HelpNotificationsView extends Vue {
 
   async mounted() {
     try {
-      const registration = await navigator.serviceWorker?.ready;
-      const fullSub = await registration?.pushManager.getSubscription();
+      const registration = await navigator.serviceWorker.ready;
+      const fullSub = await registration.pushManager.getSubscription();
       this.subscriptionJSON = fullSub?.toJSON();
     } catch (error) {
       console.error("Mount error:", error);
@@ -331,10 +314,10 @@ export default class HelpNotificationsView extends Vue {
   }
 
   alertWebPushSubscription() {
-    // console.log(
-    //   "Web push subscription:",
-    //   JSON.parse(JSON.stringify(this.subscriptionJSON)), // gives more info than plain console logging
-    // );
+    console.log(
+      "Web push subscription:",
+      JSON.parse(JSON.stringify(this.subscriptionJSON)), // gives more info than plain console logging
+    );
     alert(JSON.stringify(this.subscriptionJSON));
   }
 
@@ -348,7 +331,7 @@ export default class HelpNotificationsView extends Vue {
           // Note that this exact verbiage shows in help text.
           text: "You must enable notifications before testing the web push.",
         },
-        5000,
+        -1,
       );
       return;
     }
@@ -365,7 +348,7 @@ export default class HelpNotificationsView extends Vue {
             "Check your device for the test web push message" +
             (skipFilter ? "." : " if there are new items in your feed."),
         },
-        5000,
+        -1,
       );
     } catch (error) {
       console.error("Got an error sending test notification:", error);
@@ -376,14 +359,14 @@ export default class HelpNotificationsView extends Vue {
           title: "Error Sending Test",
           text: "Got an error sending the test web push notification.",
         },
-        5000,
+        -1,
       );
     }
   }
 
   showTestNotification() {
     const TEST_NOTIFICATION_TITLE = "It Worked";
-    navigator.serviceWorker?.ready
+    navigator.serviceWorker.ready
       .then((registration) => {
         return registration.showNotification(TEST_NOTIFICATION_TITLE, {
           body: "This is your test notification.",
@@ -409,25 +392,20 @@ export default class HelpNotificationsView extends Vue {
             title: "Failed",
             text: "Got an error sending a notification.",
           },
-          5000,
+          -1,
         );
       });
   }
 
   showNotificationChoice() {
-    (this.$refs.pushNotificationPermission as PushNotificationPermission).open(
-      DIRECT_PUSH_TITLE,
-      async (success: boolean, timeText: string, message?: string) => {
-        if (success) {
-          await db.settings.update(MASTER_SETTINGS_KEY, {
-            notifyingReminderMessage: message,
-            notifyingReminderTime: timeText,
-          });
-          this.notifyingReminder = true;
-          this.notifyingReminderMessage = message || "";
-          this.notifyingReminderTime = timeText;
-        }
+    this.$notify(
+      {
+        group: "modal",
+        type: "notification-permission",
+        title: "", // unused, only here to satisfy type check
+        text: "", // unused, only here to satisfy type check
       },
+      -1,
     );
   }
 }

src/views/HelpOnboardingView.vue

@@ -12,91 +12,45 @@
       </h1>
     </div>
 
-    <p>
-      To invite someone the easiest way, send them a link that you generate from
-      this page:
-      <router-link
-        :to="{ name: 'invite-one' }"
-        class="bg-gradient-to-b from-green-400 to-green-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-2 rounded-md"
-      >
-        <fa icon="envelope-open-text" class="fa-fw text-xl"
-      /></router-link>
-    </p>
-    <p>Then watch that page to see when they accept their invite.</p>
-    <p>
-      (That page is also reachable from the Contacts <fa icon="users" /> page
-      though the invitation <fa icon="envelope-open-text" /> icon.)
-    </p>
-
-    <h1 class="mt-4 font-bold text-xl">Next Steps</h1>
-    Although not totally necessary, backups are important to understand.
-
-    <div class="ml-4">
-      <h1 class="font-bold text-xl">Without a backup, you can lose data.</h1>
-      <div>
-        <p>
-          Exporting backups (from the Account <fa icon="circle-user" /> screen)
-          is important for the case where they lose their device. This is
-          especially true for the Identifier Seed: that is theirs and and theirs
-          alone, and currently nobody else can recover it if they lose it. The
-          good thing is that anyone can create a new account and simply inform
-          their network of their new ID.
-        </p>
-      </div>
-    </div>
-
-    <h1 class="mt-4 font-bold text-xl">Advanced</h1>
-    The following are optional steps for even more functionality.
-
     <!-- eslint-disable prettier/prettier -->
     <div class="ml-4">
-
-      <h1 class="font-bold text-xl">Add Contact & Register</h1>
-      <p>
-        You share even more information such as your picture and name when
-        you share with your QR code at these links: <fa icon="qrcode" />
-      </p>
-      <p>
-        Scanning
-        those with your cameras will automatically register people and add them
-        to each other's contact lists.
-      </p>
-      <p>
-        The following are more detailed manual steps:
-      </p>
-      <div>
-        <p>
-          1) Have them follow their yellow prompts.
-        </p>
-        <p>
-          2) Scan their QR, or have them tap on it to copy their info and send it to you.
-          Then you can add them to your Contacts <fa icon="users" />
-        </p>
-        <p>
-          3) You can register them at their info page <fa icon="circle-info" />
-          and click on the register button <fa icon="person-circle-question" />
-        </p>
-        <p>
-          4) Add yourself to their Contacts <fa icon="users" />
-        </p>
-      </div>
-
       <h1 class="font-bold text-xl">Install</h1>
       <div>
         <p>
-          Have them visit TimeSafari.app in a browser, preferably Chrome or Safari,
-          and then look for the "Install" selection which adds this app to their desktop.
-          This enables other things, like the ability to "share" a photo from their
-          device directly to Time Safari, and it makes notifications more reliable.
+          1) Have them visit TimeSafari.app in a browser, preferably Chrome or Safari.
+        </p>
+        <p>
+          2) Have them "Install" the site to their desktop.
+        </p>
+      </div>
+
+      <h1 class="font-bold text-xl">Add Contact & Register</h1>
+      <div>
+        <p>
+          3) Have them follow their yellow prompts.
+        </p>
+        <p>
+          4) Add them to your contacts <fa icon="users" />
+        </p>
+        <p>
+          5) Register them <fa icon="person-circle-question" />
+        </p>
+        <p>
+          6) Add yourself to their contacts <fa icon="users" />
         </p>
       </div>
 
       <h1 class="font-bold text-xl">Enable Notifications</h1>
       <div>
         <p>
-          Enable notifications from the Account page <fa icon="circle-user" />.
-          Those notifications might show up on the device depending on your settings.
-          For the most reliable habits, set an alarm or do some other ritual to record gratitude every day.
+          7) Enable notifications from <fa icon="circle-user" />
+        </p>
+      </div>
+
+      <h1 class="font-bold text-xl">Discuss Backups</h1>
+      <div>
+        <p>
+          8) Exporting backups <fa icon="circle-user" /> are important if they lose their phone --- especially for the Identifier Seed!
         </p>
       </div>
 

src/views/HelpView.vue

@@ -21,20 +21,12 @@
       </h1>
     </div>
 
-    <!-- eslint-disable prettier/prettier max-len -->
+    <!-- eslint-disable prettier/prettier -->
     <div>
       <p>
         This app focuses on gifts & gratitude, using them to build cool things together with your network.
       </p>
 
-      <p class="ml-4">
-        If you'd like to see the page-by-page help,
-        <span
-          @click="unsetFinishedOnboarding()"
-          class="text-blue-500 cursor-pointer"
-        >click here</span>.
-      </p>
-
       <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
@@ -383,11 +375,11 @@
         How do I access even more functionality?
       </h2>
       <p>
-        There is an "Advanced" section at the bottom of the Profile
+        There is an "Advanced" section at the bottom of the Account
         <fa icon="circle-user" /> page.
       </p>
       <p>
-        There is even more functionality in a mobile app (and more
+        There is a even more functionality in a mobile app (and more
         documentation) at
         <a href="https://endorser.ch" target="_blank" class="text-blue-500">
           EndorserSearch.com
@@ -422,19 +414,19 @@
       </p>
 
       <h2 class="text-xl font-semibold">
-        This app is misbehaving, like showing me a blank screen or failing to show my personal data.
+        My app is misbehaving, like showing me a blank screen or failing to show a feed.
         What can I do?
       </h2>
       <p>
         First, note that clearing the cache will clear all your identity and contact info,
-        so we recommend doing other things first -- and only clearing when have your backups ready.
+        so we recommend doing other things first (unless you know you have your backups ready).
       </p>
       <ul class="list-disc list-outside ml-4">
         <li>
           Drag down on the screen to refresh it; do that multiple times, because
-          it sometimes takes multiple tries for the app to refresh to the latest version.
+          it sometimes takes multiple tries for the app to refresh to the current version.
           You can see the version information at the bottom of this page; the best
-          way to determine the latest version is to open this page in an incognito/private
+          way to determine the current version is to open this page in an incognito
           browser window and look at the version there.
         </li>
         <li>
@@ -480,7 +472,7 @@
 
       <h2 class="text-xl font-semibold">What are the terms & conditions and the privacy policy?</h2>
       <p style="display:inline; align-items: center">
-        This work is public domain. (If you like rules, reference
+        This work is public domain. If you like rules, reference
         <a href="http://creativecommons.org/publicdomain/zero/1.0?ref=chooser-v1" target="_blank" rel="license noopener noreferrer">
           <span class="text-blue-500 mr-1">CC0 1.0</span>
           <img
@@ -496,32 +488,14 @@
               style="display: inline"
           />
         </a>
-        .) This is offered freely, with the hope that it helps but without any warranty or guarantee;
-        if it helps you then enjoy using it,
-        but if you may try to forcibly collect damages for things you think it should do (or not do)
-        then don't use it.
         <br />
-        As for data & privacy:
-        <ul class="list-disc list-outside ml-4">
-          <li>
-            If using notifications, a server stores push token data. That can be revoked at any time
-            by disabling notifications on the Profile <fa icon="circle-user" class="fa-fw" /> page.
-          </li>
-          <li>
-            If sending images, a server stores them, too. They can be removed by editing the claim
-            and deleting them.
-          </li>
-          <li>
-            If sending other partner system data (eg. to Trustroots) a public key and message
-            data are stored on a server. Those can be removed via direct personal request.
-          </li>
-          <li>
-            For all other claim data,
-            <a href="https://endorser.ch/privacy-policy" target="_blank" class="text-blue-500">
-              the Endorser Service has this Privacy Policy.
-            </a>
-          </li>
-        </ul>
+        For notifications, this service stores push token data; that can be revoked at any time
+        by disabling notifications on the Account <fa icon="circle-user" class="fa-fw" /> page.
+        <br />
+        For all other claim data,
+        <a href="https://endorser.ch/privacy-policy" target="_blank" class="text-blue-500">
+          the Endorser Service has this Privacy Policy.
+        </a>
       </p>
 
       <h2 class="text-xl font-semibold">How can I contribute?</h2>
@@ -538,11 +512,9 @@
           class="text-blue-500 ml-2"
         >
           bc1q90v4ted6cpt63tjfh2lvd5xzfc67sd4g9w8xma
-          <fa v-show="!showDidCopy" icon="copy" class="text-sm text-slate-400 fa-fw" />
-          <fa v-show="showDidCopy" icon="circle-check" class="text-sm text-green-500 fa-fw"/>
+          <fa v-show="!showDidCopy" icon="copy" class="text-slate-400 fa-fw" />
         </button>
-        You can donate online via
-        <a href="https://www.patreon.com/TimeSafari" target="_blank" class="text-blue-500">Patreon here</a>.
+        <span v-show="showDidCopy" class="ml-2 text-sm text-green-500">Copied</span>
         For other donations, contact us.
       </p>
 
@@ -559,7 +531,7 @@
       <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.
+        I have other questions, like getting a new account or removing all my data from the public ledger.
       </h2>
       <p>
         Contact us at
@@ -574,16 +546,11 @@
 
 <script lang="ts">
 import { Component, Vue } from "vue-facing-decorator";
-import { Router } from "vue-router";
 import { useClipboard } from "@vueuse/core";
 
 import * as Package from "../../package.json";
 import QuickNav from "@/components/QuickNav.vue";
 import { NotificationIface } from "@/constants/app";
-import {
-  retrieveSettingsForActiveAccount,
-  updateAccountSettings,
-} from "@/db/index";
 
 @Component({ components: { QuickNav } })
 export default class Help extends Vue {
@@ -606,15 +573,5 @@ export default class Help extends Vue {
       .copy(text)
       .then(() => setTimeout(fn, 2000));
   }
-
-  async unsetFinishedOnboarding() {
-    const settings = await retrieveSettingsForActiveAccount();
-    if (settings.activeDid) {
-      await updateAccountSettings(settings.activeDid || "", {
-        finishedOnboarding: false,
-      });
-    }
-    (this.$router as Router).push({ name: "home" });
-  }
 }
 </script>

src/views/HomeView.vue

@@ -8,8 +8,6 @@
       {{ AppString.APP_NAME }}
     </h1>
 
-    <OnboardingDialog ref="onboardingDialog" />
-
     <!-- prompt to install notifications with notificationsSupported, which we're making an advanced feature -->
     <div class="mb-8 mt-8">
       <div
@@ -73,8 +71,7 @@
     <div class="mb-8">
       <div v-if="isCreatingIdentifier">
         <p class="text-slate-500 text-center italic mt-4 mb-4">
-          <fa icon="spinner" class="fa-spin-pulse" />
-          Loading&hellip;
+          <fa icon="spinner" class="fa-spin-pulse" /> Loading&hellip;
         </p>
       </div>
 
@@ -87,11 +84,11 @@
             id="noticeSomeoneMustRegisterYou"
             class="bg-amber-200 rounded-md overflow-hidden text-center px-4 py-3 mb-4"
           >
-            <!-- !isCreatingIdentifier && !isRegistered -->
+            <!-- activeDid && !isRegistered -->
             To share, someone must register you.
             <div class="block text-center">
               <button
-                @click="showNameThenIdDialog()"
+                @click="showNameDialog()"
                 class="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"
               >
                 Show them {{ PASSKEYS_ENABLED ? "default" : "your" }} identifier
@@ -110,17 +107,19 @@
           </div>
 
           <div v-else id="sectionRecordSomethingGiven">
-            <!-- !isCreatingIdentifier && isRegistered -->
+            <!-- activeDid && isRegistered -->
 
             <!-- show the actions for recognizing a give -->
-            <div class="flex">
-              <h2 class="text-xl font-bold">What have you seen someone do?</h2>
-              <button
-                @click="openGiftedPrompts()"
-                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"
-              >
-                <fa icon="lightbulb" class="fa-fw" />
-              </button>
+            <div class="flex justify-between">
+              <h2 class="text-xl font-bold">Record Something Given By:</h2>
+              <div class="flex justify-end">
+                <button
+                  @click="openGiftedPrompts()"
+                  class="block 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"
+                >
+                  Ideas...
+                </button>
+              </div>
             </div>
 
             <ul
@@ -129,17 +128,14 @@
               <li @click="openDialog()">
                 <img
                   src="../assets/blank-square.svg"
-                  class="mx-auto border border-blue-500 rounded-md mb-1 cursor-pointer"
+                  class="mx-auto border border-slate-300 rounded-md mb-1"
                 />
                 <h3
-                  class="text-xs text-blue-500 italic font-medium text-ellipsis whitespace-nowrap overflow-hidden cursor-pointer"
+                  class="text-xs italic font-medium text-ellipsis whitespace-nowrap overflow-hidden"
                 >
                   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"
@@ -148,10 +144,10 @@
                 <EntityIcon
                   :contact="contact"
                   :iconSize="64"
-                  class="mx-auto border border-blue-500 rounded-md mb-1 cursor-pointer"
+                  class="mx-auto border border-slate-300 rounded-md mb-1 cursor-pointer"
                 />
                 <h3
-                  class="text-xs text-blue-500 font-medium text-ellipsis whitespace-nowrap overflow-hidden cursor-pointer"
+                  class="text-xs font-medium text-ellipsis whitespace-nowrap overflow-hidden"
                 >
                   {{ contact.name || contact.did }}
                 </h3>
@@ -160,9 +156,9 @@
                 <router-link
                   v-if="allContacts.length >= 6"
                   :to="{ name: 'contact-gift' }"
-                  class="flex align-bottom text-xs text-blue-500 mt-12 cursor-pointer"
+                  class="block text-center text-md font-bold bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md"
                 >
-                  ... or someone else...
+                  Choose From All Contacts
                 </router-link>
               </li>
             </ul>
@@ -175,79 +171,27 @@
     <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()"
-      >
-        <fa icon="plus" class="fa-fw" />
-      </button>
-    </div>
-
     <!-- Results List -->
-    <div class="bg-slate-100 rounded-md px-4 py-3 mt-4 mb-4">
+    <div class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mt-4 mb-4">
       <div class="flex items-center mb-4">
-        <h2 class="text-xl font-bold">
-          Latest Activity
-          <button @click="openFeedFilters()">
-            <span class="text-xs text-white">
-              <fa
-                v-if="resultsAreFiltered()"
-                icon="filter"
-                class="bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] px-1 py-1.5 rounded-md"
-              />
-              <fa
-                v-else
-                icon="filter"
-                class="bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] px-1 py-1.5 rounded-md"
-              />
-            </span>
-          </button>
-        </h2>
-      </div>
-
-      <div
-        @click="goToActivityToUserPage()"
-        class="border-t p-2 border-slate-300"
-      >
-        <div class="flex justify-center">
-          <div
-            v-if="numNewOffersToUser"
-            class="bg-gradient-to-b from-green-400 to-green-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] m-1 px-4 py-4 rounded-md text-white"
-          >
+        <h2 class="text-xl font-bold">Latest Activity</h2>
+        <button @click="openFeedFilters()" class="block text-center ml-auto">
+          <span class="text-sm text-white">
             <span
-              class="block text-center text-6xl"
-              data-testId="newDirectOffersActivityNumber"
+              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"
             >
-              {{ numNewOffersToUser }}{{ newOffersToUserHitLimit ? "+" : "" }}
+              Filtered
             </span>
-            <p class="text-center">
-              new offer{{ numNewOffersToUser === 1 ? "" : "s" }} to you
-            </p>
-          </div>
-          <div
-            v-if="numNewOffersToUserProjects"
-            class="bg-gradient-to-b from-green-400 to-green-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] m-1 px-4 py-4 rounded-md text-white"
-          >
             <span
-              class="block text-center text-6xl"
-              data-testId="newOffersToUserProjectsActivityNumber"
+              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"
             >
-              {{ numNewOffersToUserProjects
-              }}{{ newOffersToUserProjectsHitLimit ? "+" : "" }}
+              Unfiltered
             </span>
-            <p class="text-center">
-              new offer{{ numNewOffersToUserProjects === 1 ? "" : "s" }} to your
-              projects
-            </p>
-          </div>
-        </div>
-        <div class="flex justify-end mt-2">
-          <button class="text-blue-500">View All New Activity For You</button>
-        </div>
+          </span>
+        </button>
       </div>
-
       <InfiniteScroll @reached-bottom="loadMoreGives">
         <ul id="listLatestActivity" class="border-t border-slate-300">
           <li
@@ -256,7 +200,7 @@
             :key="record.jwtId"
           >
             <div
-              class="border-b border-slate-300 text-orange-400 pb-2 mb-2 font-bold text-sm"
+              class="border-b border-dashed border-slate-400 text-orange-400 pb-2 mb-2 font-bold text-sm"
               v-if="record.jwtId == feedLastViewedClaimId"
             >
               You've already seen all the following
@@ -281,7 +225,7 @@
                   />
                 </span>
               </span>
-              <span class="col-span-10 justify-self-stretch overflow-hidden">
+              <span class="col-span-10 justify-self-stretch">
                 <!-- show giver and/or receiver profiles... which seemed like a good idea but actually adds clutter
                 <span
                   v-if="
@@ -315,13 +259,13 @@
                   />
                 </span>
                 -->
-                <span class="pl-2 block break-words">
+                <span class="pl-2">
                   {{ giveDescription(record) }}
                 </span>
                 <a @click="onClickLoadClaim(record.jwtId)">
                   <fa
                     icon="file-lines"
-                    class="pl-2 text-slate-500 cursor-pointer"
+                    class="pl-2 text-blue-500 cursor-pointer"
                   />
                 </a>
               </span>
@@ -335,29 +279,12 @@
                 >
                   <fa icon="hammer" class="text-blue-500" />
                 </router-link>
-                <router-link
-                  v-if="record.providerPlanHandleId"
-                  :to="
-                    '/project/' +
-                    encodeURIComponent(record.providerPlanHandleId)
-                  "
-                >
-                  <fa icon="hammer" class="text-blue-500" />
-                </router-link>
               </span>
             </div>
-            <div v-if="record.image" class="w-full">
-              <div
-                class="cursor-pointer"
-                @click="openImageViewer(record.image)"
-              >
-                <img
-                  :src="record.image"
-                  class="w-full aspect-[3/2] object-cover rounded-xl mt-2"
-                  alt="shared content"
-                  @load="cacheImageData($event, record.image)"
-                />
-              </div>
+            <div v-if="record.image" class="flex justify-center">
+              <a :href="record.image" target="_blank">
+                <img :src="record.image" class="h-24 mt-2 rounded-xl" />
+              </a>
             </div>
           </li>
         </ul>
@@ -374,14 +301,6 @@
       </div>
     </div>
   </section>
-
-  <ChoiceButtonDialog ref="choiceButtonDialog" />
-
-  <ImageViewer
-    :image-url="selectedImage"
-    :image-data="selectedImageData"
-    v-model:is-open="isImageViewerOpen"
-  />
 </template>
 
 <script lang="ts">
@@ -395,28 +314,21 @@ import GiftedDialog from "@/components/GiftedDialog.vue";
 import GiftedPrompts from "@/components/GiftedPrompts.vue";
 import FeedFilters from "@/components/FeedFilters.vue";
 import InfiniteScroll from "@/components/InfiniteScroll.vue";
-import OnboardingDialog from "@/components/OnboardingDialog.vue";
 import QuickNav from "@/components/QuickNav.vue";
 import TopMessage from "@/components/TopMessage.vue";
 import UserNameDialog from "@/components/UserNameDialog.vue";
-import ChoiceButtonDialog from "@/components/ChoiceButtonDialog.vue";
-import ImageViewer from "@/components/ImageViewer.vue";
 import {
   AppString,
   NotificationIface,
   PASSKEYS_ENABLED,
 } from "@/constants/app";
-import {
-  db,
-  logConsoleAndDb,
-  retrieveSettingsForActiveAccount,
-  updateAccountSettings,
-} from "@/db/index";
+import { db, accountsDB } from "@/db/index";
 import { Contact } from "@/db/tables/contacts";
 import {
   BoundingBox,
-  checkIsAnyFeedFilterOn,
+  isAnyFeedFilterOn,
   MASTER_SETTINGS_KEY,
+  Settings,
 } from "@/db/tables/settings";
 import {
   contactForDid,
@@ -424,16 +336,12 @@ import {
   didInfoForContact,
   fetchEndorserRateLimits,
   getHeaders,
-  getNewOffersToUser,
-  getNewOffersToUserProjects,
   getPlanFromCache,
+  GiverReceiverInputInfo,
   GiveSummaryRecord,
 } from "@/libs/endorserServer";
 import {
   generateSaveAndActivateIdentity,
-  retrieveAccountDids,
-  GiverReceiverInputInfo,
-  OnboardPage,
   registerSaveAndActivatePasskey,
 } from "@/libs/util";
 
@@ -444,7 +352,6 @@ interface GiveRecordWithContactInfo extends GiveSummaryRecord {
     profileImageUrl?: string;
   };
   image?: string;
-  providerPlanName?: string;
   recipientProjectName?: string;
   receiver: {
     displayName: string;
@@ -460,17 +367,14 @@ interface GiveRecordWithContactInfo extends GiveSummaryRecord {
     },
   },
   components: {
-    EntityIcon,
-    FeedFilters,
     GiftedDialog,
     GiftedPrompts,
-    InfiniteScroll,
-    OnboardingDialog,
-    ChoiceButtonDialog,
+    FeedFilters,
     QuickNav,
+    EntityIcon,
+    InfiniteScroll,
     TopMessage,
     UserNameDialog,
-    ImageViewer,
   },
 })
 export default class HomeView extends Vue {
@@ -493,64 +397,41 @@ export default class HomeView extends Vue {
   isFeedFilteredByNearby = false;
   isFeedLoading = true;
   isRegistered = false;
-  lastAckedOfferToUserJwtId?: string; // the last JWT ID for offer-to-user that they've acknowledged seeing
-  lastAckedOfferToUserProjectsJwtId?: string; // the last JWT ID for offers-to-user's-projects that they've acknowledged seeing
-  newOffersToUserHitLimit: boolean = false;
-  newOffersToUserProjectsHitLimit: boolean = false;
-  numNewOffersToUser: number = 0; // number of new offers-to-user
-  numNewOffersToUserProjects: number = 0; // number of new offers-to-user's-projects
   searchBoxes: Array<{
     name: string;
     bbox: BoundingBox;
   }> = [];
   showShortcutBvc = false;
   userAgentInfo = new UAParser(); // see https://docs.uaparser.js.org/v2/api/ua-parser-js/get-os.html
-  selectedImage = "";
-  selectedImageData: Blob | null = null;
-  isImageViewerOpen = false;
-  imageCache: Map<string, Blob | null> = new Map();
 
   async mounted() {
     try {
-      try {
-        this.allMyDids = await retrieveAccountDids();
-        if (this.allMyDids.length === 0) {
-          this.isCreatingIdentifier = true;
-          const newDid = await generateSaveAndActivateIdentity();
-          this.isCreatingIdentifier = false;
-          this.allMyDids = [newDid];
-        }
-      } catch (error) {
-        // continue because we want the feed to work, even anonymously
-        logConsoleAndDb(
-          "Error retrieving all account DIDs on home page:" + error,
-          true,
-        );
-        // some other piece will display an error about personal info
+      await accountsDB.open();
+      const allAccounts = await accountsDB.accounts.toArray();
+      if (allAccounts.length > 0) {
+        this.allMyDids = allAccounts.map((acc) => acc.did);
+      } else {
+        this.isCreatingIdentifier = true;
+        const newDid = await generateSaveAndActivateIdentity();
+        this.isCreatingIdentifier = false;
+        this.allMyDids = [newDid];
       }
 
-      const settings = await retrieveSettingsForActiveAccount();
-      this.apiServer = settings.apiServer || "";
-      this.activeDid = settings.activeDid || "";
+      await db.open();
+      const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+      this.apiServer = settings?.apiServer || "";
+      this.activeDid = settings?.activeDid || "";
       this.allContacts = await db.contacts.toArray();
-      this.feedLastViewedClaimId = settings.lastViewedClaimId;
-      this.givenName = settings.firstName || "";
-      this.isFeedFilteredByVisible = !!settings.filterFeedByVisible;
-      this.isFeedFilteredByNearby = !!settings.filterFeedByNearby;
-      this.isRegistered = !!settings.isRegistered;
-      this.lastAckedOfferToUserJwtId = settings.lastAckedOfferToUserJwtId;
-      this.lastAckedOfferToUserProjectsJwtId =
-        settings.lastAckedOfferToUserProjectsJwtId;
-      this.searchBoxes = settings.searchBoxes || [];
-      this.showShortcutBvc = !!settings.showShortcutBvc;
+      this.feedLastViewedClaimId = settings?.lastViewedClaimId;
+      this.givenName = settings?.firstName || "";
+      this.isFeedFilteredByVisible = !!settings?.filterFeedByVisible;
+      this.isFeedFilteredByNearby = !!settings?.filterFeedByNearby;
+      this.isRegistered = !!settings?.isRegistered;
+      this.searchBoxes = settings?.searchBoxes || [];
+      this.showShortcutBvc = !!settings?.showShortcutBvc;
 
-      this.isAnyFeedFilterOn = checkIsAnyFeedFilterOn(settings);
-
-      if (!settings.finishedOnboarding) {
-        (this.$refs.onboardingDialog as OnboardingDialog).open(
-          OnboardPage.Home,
-        );
-      }
+      this.isAnyFeedFilterOn = isAnyFeedFilterOn(settings);
+      console.log("getting through mounted");
 
       // someone may have have registered after sharing contact info, so recheck
       if (!this.isRegistered && this.activeDid) {
@@ -561,7 +442,9 @@ export default class HomeView extends Vue {
             this.activeDid,
           );
           if (resp.status === 200) {
-            await updateAccountSettings(this.activeDid, {
+            // we just needed to know that they're registered
+            await db.open();
+            await db.settings.update(MASTER_SETTINGS_KEY, {
               isRegistered: true,
             });
             this.isRegistered = true;
@@ -574,31 +457,9 @@ export default class HomeView extends Vue {
       // this returns a Promise but we don't need to wait for it
       this.updateAllFeed();
 
-      if (this.activeDid) {
-        const offersToUserData = await getNewOffersToUser(
-          this.axios,
-          this.apiServer,
-          this.activeDid,
-          this.lastAckedOfferToUserJwtId,
-        );
-        this.numNewOffersToUser = offersToUserData.data.length;
-        this.newOffersToUserHitLimit = offersToUserData.hitLimit;
-      }
-
-      if (this.activeDid) {
-        const offersToUserProjects = await getNewOffersToUserProjects(
-          this.axios,
-          this.apiServer,
-          this.activeDid,
-          this.lastAckedOfferToUserProjectsJwtId,
-        );
-        this.numNewOffersToUserProjects = offersToUserProjects.data.length;
-        this.newOffersToUserProjectsHitLimit = offersToUserProjects.hitLimit;
-      }
-
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (err: any) {
-      logConsoleAndDb("Error retrieving settings or feed: " + err, true);
+      console.error("Error retrieving settings or feed.", err);
       this.$notify(
         {
           group: "alert",
@@ -608,7 +469,7 @@ export default class HomeView extends Vue {
             err.userMessage ||
             "There was an error retrieving your settings or the latest activity.",
         },
-        5000,
+        -1,
       );
     }
   }
@@ -632,10 +493,11 @@ export default class HomeView extends Vue {
 
   // only called when a setting was changed
   async reloadFeedOnChange() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.isFeedFilteredByVisible = !!settings.filterFeedByVisible;
-    this.isFeedFilteredByNearby = !!settings.filterFeedByNearby;
-    this.isAnyFeedFilterOn = checkIsAnyFeedFilterOn(settings);
+    await db.open();
+    const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+    this.isFeedFilteredByVisible = !!settings?.filterFeedByVisible;
+    this.isFeedFilteredByNearby = !!settings?.filterFeedByNearby;
+    this.isAnyFeedFilterOn = isAnyFeedFilterOn(settings);
 
     this.feedData = [];
     this.feedPreviousOldestId = undefined;
@@ -671,6 +533,7 @@ export default class HomeView extends Vue {
   async updateAllFeed() {
     this.isFeedLoading = true;
     let endOfResults = true;
+    console.log("about to retrieveGives");
     await this.retrieveGives(this.apiServer, this.feedPreviousOldestId)
       .then(async (results) => {
         if (results.data.length > 0) {
@@ -690,7 +553,7 @@ export default class HomeView extends Vue {
 
             // This has indeed proven problematic. See loadMoreGives
             // We should display it immediately and then get the plan later.
-            const fulfillsPlan = await getPlanFromCache(
+            const plan = await getPlanFromCache(
               record.fulfillsPlanHandleId,
               this.axios,
               this.apiServer,
@@ -706,13 +569,8 @@ export default class HomeView extends Vue {
             if (!anyMatch && this.isFeedFilteredByNearby) {
               // check if the associated project has a location inside user's search box
               if (record.fulfillsPlanHandleId) {
-                if (fulfillsPlan?.locLat && fulfillsPlan?.locLon) {
-                  if (
-                    this.latLongInAnySearchBox(
-                      fulfillsPlan.locLat,
-                      fulfillsPlan.locLon,
-                    )
-                  ) {
+                if (plan?.locLat && plan?.locLon) {
+                  if (this.latLongInAnySearchBox(plan.locLat, plan.locLon)) {
                     anyMatch = true;
                   }
                 }
@@ -722,17 +580,6 @@ export default class HomeView extends Vue {
               continue;
             }
 
-            // checking for arrays due to legacy data
-            const provider = Array.isArray(claim.provider)
-              ? claim.provider[0]
-              : claim.provider;
-            const providedByPlan = await getPlanFromCache(
-              provider?.identifier as string,
-              this.axios,
-              this.apiServer,
-              this.activeDid,
-            );
-
             const newRecord: GiveRecordWithContactInfo = {
               ...record,
               giver: didInfoForContact(
@@ -742,9 +589,7 @@ export default class HomeView extends Vue {
                 this.allMyDids,
               ),
               image: claim.image,
-              providerPlanHandleId: provider?.identifier as string,
-              providerPlanName: providedByPlan?.name as string,
-              recipientProjectName: fulfillsPlan?.name as string,
+              recipientProjectName: plan?.name as string,
               receiver: didInfoForContact(
                 recipientDid,
                 this.activeDid,
@@ -795,19 +640,13 @@ export default class HomeView extends Vue {
    */
   async retrieveGives(endorserApiServer: string, beforeId?: string) {
     const beforeQuery = beforeId == null ? "" : "&beforeId=" + beforeId;
-    const doNotShowErrorAgain = !!beforeId; // don't show error again if we're loading more
-    const headers = await getHeaders(
-      this.activeDid,
-      doNotShowErrorAgain ? undefined : this.$notify,
-    );
-    // retrieve headers for this user, but if an error happens then report it but proceed with the fetch with no header
     const response = await fetch(
       endorserApiServer +
         "/api/v2/report/gives?giftNotTrade=true" +
         beforeQuery,
       {
         method: "GET",
-        headers: headers,
+        headers: await getHeaders(this.activeDid),
       },
     );
 
@@ -844,70 +683,50 @@ export default class HomeView extends Vue {
     }
 
     /**
-     * Only show giver and/or receiver info first if they're named in your contacts.
+     * Only show giver and/or receiver info first if they're named.
      * - If only giver is named, show "... gave"
      * - If only receiver is named, show "... received"
      */
 
     const giverInfo = giveRecord.giver;
     const recipientInfo = giveRecord.receiver;
-
-    // any specific names should be shown first
     if (giverInfo.known && recipientInfo.known) {
       // both giver and recipient are named
       return `${giverInfo.displayName} gave to ${recipientInfo.displayName}: ${gaveAmount}`;
     } else if (giverInfo.known) {
-      // giver is known but recipient is not
+      // giver is named but recipient is not
 
       // show the project name if to one
       if (giveRecord.recipientProjectName) {
-        return `${giverInfo.displayName} gave: ${gaveAmount} (to the project "${giveRecord.recipientProjectName}")`;
-      } else {
-        // it's not to a project
-        return `${giverInfo.displayName} gave: ${gaveAmount} (to ${recipientInfo.displayName})`;
+        // retrieve the project name
+        return `${giverInfo.displayName} gave: ${gaveAmount} (to the project ${giveRecord.recipientProjectName})`;
       }
-    } else if (recipientInfo.known) {
-      // recipient is known but giver is not
 
-      // show the project name if from one
-      if (giveRecord.providerPlanName) {
-        return `${recipientInfo.displayName} received: ${gaveAmount} (from the project "${giveRecord.providerPlanName}")`;
-      } else {
-        // it's not from a project
-        return `${recipientInfo.displayName} received: ${gaveAmount} (from ${giverInfo.displayName})`;
-      }
+      // it's not to a project
+      return `${giverInfo.displayName} gave: ${gaveAmount} (to ${recipientInfo.displayName})`;
+    } else if (recipientInfo.known) {
+      // recipient is named but giver is not
+      return `${recipientInfo.displayName} received: ${gaveAmount} (from ${giverInfo.displayName})`;
     } else {
       // neither giver nor recipient are named
 
-      // create the part in parens
-      let peopleInfo = "";
-      if (giveRecord.providerPlanName || giveRecord.recipientProjectName) {
-        if (giveRecord.providerPlanName) {
-          peopleInfo = `from the project "${giveRecord.providerPlanName}"`;
-        } else {
-          peopleInfo = `from ${giverInfo.displayName}`;
-        }
-        if (giveRecord.recipientProjectName) {
-          peopleInfo += ` to the project "${giveRecord.recipientProjectName}"`;
-        } else {
-          peopleInfo += ` to ${recipientInfo.displayName}`;
-        }
-      } else {
-        if (giverInfo.displayName === recipientInfo.displayName) {
-          peopleInfo = `between two who are ${giverInfo.displayName}`;
-        } else {
-          peopleInfo = `from ${giverInfo.displayName} to ${recipientInfo.displayName}`;
-        }
+      // show the project name if to one
+      if (giveRecord.recipientProjectName) {
+        // retrieve the project name
+        return `${gaveAmount} (to the project ${giveRecord.recipientProjectName})`;
       }
 
+      // it's not to a project
+      let peopleInfo;
+      if (giverInfo.displayName === recipientInfo.displayName) {
+        peopleInfo = `between two who are ${giverInfo.displayName}`;
+      } else {
+        peopleInfo = `from ${giverInfo.displayName} to ${recipientInfo.displayName}`;
+      }
       return gaveAmount + " (" + peopleInfo + ")";
     }
   }
 
-  goToActivityToUserPage() {
-    (this.$router as Router).push({ name: "new-activity" });
-  }
-
   onClickLoadClaim(jwtId: string) {
     const route = {
       path: "/claim/" + encodeURIComponent(jwtId),
@@ -923,30 +742,27 @@ export default class HomeView extends Vue {
     return unitCode === "HUR" ? (single ? "hour" : "hours") : unitCode;
   }
 
-  openDialog(giver?: GiverReceiverInputInfo, description?: string) {
+  openDialog(giver?: GiverReceiverInputInfo) {
     (this.$refs.customDialog as GiftedDialog).open(
       giver,
       {
         did: this.activeDid,
         name: "you",
-      } as GiverReceiverInputInfo,
+      },
       undefined,
       "Given by " + (giver?.name || "someone not named"),
-      description,
     );
   }
 
   openGiftedPrompts() {
-    (this.$refs.giftedPrompts as GiftedPrompts).open((giver, description) =>
-      this.openDialog(giver as GiverReceiverInputInfo, description),
-    );
+    (this.$refs.giftedPrompts as GiftedPrompts).open();
   }
 
   openFeedFilters() {
     (this.$refs.feedFilters as FeedFilters).open(this.reloadFeedOnChange);
   }
 
-  toastUser(message: string) {
+  toastUser(message) {
     this.$notify(
       {
         group: "alert",
@@ -962,7 +778,7 @@ export default class HomeView extends Vue {
     return known ? "text-slate-500" : "text-slate-100";
   }
 
-  showNameThenIdDialog() {
+  showNameDialog() {
     if (!this.givenName) {
       (this.$refs.userNameDialog as UserNameDialog).open(() => {
         this.promptForShareMethod();
@@ -973,38 +789,24 @@ export default class HomeView extends Vue {
   }
 
   promptForShareMethod() {
-    (this.$refs.choiceButtonDialog as ChoiceButtonDialog).open({
-      title: "How can you share your info?",
-      text: "",
-      option1Text: "We are in a meeting together",
-      option2Text: "We are nearby with cameras",
-      option3Text: "We will share some other way",
-      onOption1: () => {
-        (this.$router as Router).push({ name: "onboard-meeting-list" });
+    this.$notify(
+      {
+        group: "modal",
+        type: "confirm",
+        title: "Are you nearby with cameras?",
+        text: "If so, we'll use those with QR codes to share.",
+        onCancel: async () => {},
+        onNo: async () => {
+          (this.$router as Router).push({ name: "share-my-contact-info" });
+        },
+        onYes: async () => {
+          (this.$router as Router).push({ name: "contact-qr" });
+        },
+        noText: "we will share another way",
+        yesText: "we are nearby with cameras",
       },
-      onOption2: () => {
-        (this.$router as Router).push({ name: "contact-qr" });
-      },
-      onOption3: () => {
-        (this.$router as Router).push({ name: "share-my-contact-info" });
-      },
-    });
-  }
-
-  async cacheImageData(event: Event, imageUrl: string) {
-    try {
-      // For images that might fail CORS, just store the URL
-      // The Web Share API will handle sharing the URL appropriately
-      this.imageCache.set(imageUrl, null);
-    } catch (error) {
-      console.warn("Failed to cache image:", error);
-    }
-  }
-
-  async openImageViewer(imageUrl: string) {
-    this.selectedImageData = this.imageCache.get(imageUrl) ?? null;
-    this.selectedImage = imageUrl;
-    this.isImageViewerOpen = true;
+      -1,
+    );
   }
 }
 </script>

src/views/IdentitySwitcherView.vue

@@ -101,15 +101,10 @@
 import { Component, Vue } from "vue-facing-decorator";
 import { Router } from "vue-router";
 
-import QuickNav from "@/components/QuickNav.vue";
 import { NotificationIface } from "@/constants/app";
-import {
-  accountsDBPromise,
-  db,
-  retrieveSettingsForActiveAccount,
-} from "@/db/index";
-import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
-import { retrieveAllAccountsMetadata } from "@/libs/util";
+import { db, accountsDB } from "@/db/index";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
+import QuickNav from "@/components/QuickNav.vue";
 
 @Component({ components: { QuickNav } })
 export default class IdentitySwitcherView extends Vue {
@@ -123,12 +118,14 @@ export default class IdentitySwitcherView extends Vue {
 
   async created() {
     try {
-      const settings = await retrieveSettingsForActiveAccount();
-      this.activeDid = settings.activeDid || "";
-      this.apiServer = settings.apiServer || "";
-      this.apiServerInput = settings.apiServer || "";
+      await db.open();
+      const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+      this.activeDid = settings?.activeDid || "";
+      this.apiServer = settings?.apiServer || "";
+      this.apiServerInput = settings?.apiServer || "";
 
-      const accounts = await retrieveAllAccountsMetadata();
+      await accountsDB.open();
+      const accounts = await accountsDB.accounts.toArray();
       for (let n = 0; n < accounts.length; n++) {
         const acct = accounts[n];
         this.otherIdentities.push({ id: acct.id as string, did: acct.did });
@@ -144,7 +141,7 @@ export default class IdentitySwitcherView extends Vue {
           title: "Error Loading Accounts",
           text: "Clear your cache and start over (after data backup).",
         },
-        5000,
+        -1,
       );
       console.error("Telling user to clear cache at page create because:", err);
     }
@@ -170,8 +167,7 @@ export default class IdentitySwitcherView extends Vue {
         title: "Delete Identity?",
         text: "Are you sure you want to erase this identity? (There is no undo. You may want to select it and back it up just in case.)",
         onYes: async () => {
-          // one of the few times we use accountsDBPromise directly; try to avoid more usage
-          const accountsDB = await accountsDBPromise;
+          await accountsDB.open();
           await accountsDB.accounts.delete(id);
           this.otherIdentities = this.otherIdentities.filter(
             (ident) => ident.id !== id,
@@ -188,7 +184,7 @@ export default class IdentitySwitcherView extends Vue {
         group: "alert",
         type: "warning",
         title: "Cannot Delete",
-        text: "You cannot delete the active identity. Set to another identity or 'no identity' first.",
+        text: "You cannot delete the active identity.",
       },
       3000,
     );

src/views/ImportAccountView.vue

@@ -53,13 +53,6 @@
         <input type="checkbox" class="mr-2" v-model="shouldErase" />
         <label>Erase the previous identifier.</label>
       </div>
-
-      <div v-if="isNotProdServer()" class="mt-4 text-blue-500">
-        <!-- if they click this, fill in the mnemonic seed-input with the test mnemonic -->
-        <button @click="mnemonic = TEST_USER_0_MNEMONIC">
-          Use mnemonic for Test User #0
-        </button>
-      </div>
     </div>
 
     <div class="mt-8">
@@ -86,57 +79,41 @@
 import { Component, Vue } from "vue-facing-decorator";
 import { Router } from "vue-router";
 
-import { AppString, NotificationIface } from "@/constants/app";
-import {
-  accountsDBPromise,
-  db,
-  retrieveSettingsForActiveAccount,
-} from "@/db/index";
+import { NotificationIface } from "@/constants/app";
+import { accountsDB, db } from "@/db/index";
 import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import {
   DEFAULT_ROOT_DERIVATION_PATH,
   deriveAddress,
   newIdentifier,
 } from "@/libs/crypto";
-import { retrieveAccountCount } from "@/libs/util";
 
 @Component({
   components: {},
 })
 export default class ImportAccountView extends Vue {
-  TEST_USER_0_MNEMONIC =
-    "rigid shrug mobile smart veteran half all pond toilet brave review universe ship congress found yard skate elite apology jar uniform subway slender luggage";
   UPORT_DERIVATION_PATH = "m/7696500'/0'/0'/0'"; // for legacy imports, likely never used
 
-  AppString = AppString;
-
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
-  apiServer = "";
-  address = "";
-  derivationPath = DEFAULT_ROOT_DERIVATION_PATH;
   mnemonic = "";
+  address = "";
   numAccounts = 0;
   privateHex = "";
   publicHex = "";
+  derivationPath = DEFAULT_ROOT_DERIVATION_PATH;
   showAdvanced = false;
   shouldErase = false;
 
   async created() {
-    this.numAccounts = await retrieveAccountCount();
-    // get the server, to help with import on the test server
-    const settings = await retrieveSettingsForActiveAccount();
-    this.apiServer = settings.apiServer || "";
+    await accountsDB.open();
+    this.numAccounts = await accountsDB.accounts.count();
   }
 
   public onCancelClick() {
     (this.$router as Router).back();
   }
 
-  public isNotProdServer() {
-    return this.apiServer !== AppString.PROD_ENDORSER_API_SERVER;
-  }
-
   public async fromMnemonic() {
     const mne: string = this.mnemonic.trim().toLowerCase();
     try {
@@ -152,7 +129,7 @@ export default class ImportAccountView extends Vue {
         this.derivationPath,
       );
 
-      const accountsDB = await accountsDBPromise;
+      await accountsDB.open();
       if (this.shouldErase) {
         await accountsDB.accounts.clear();
       }
@@ -182,7 +159,7 @@ export default class ImportAccountView extends Vue {
             title: "Invalid Mnemonic",
             text: "Please check your mnemonic and try again.",
           },
-          5000,
+          -1,
         );
       } else {
         this.$notify(
@@ -192,7 +169,7 @@ export default class ImportAccountView extends Vue {
             title: "Error",
             text: "Got an error creating that identifier.",
           },
-          5000,
+          -1,
         );
       }
     }

src/views/ImportDerivedAccountView.vue

@@ -33,7 +33,7 @@
           <fa
             v-if="dids[0] == selectedArrayFirstDid"
             icon="circle"
-            class="fa-fw text-blue-500 text-xl mr-3"
+            class="fa-fw text-blue-400 text-xl mr-3"
           ></fa>
           <fa
             v-else
@@ -78,9 +78,8 @@ import {
   newIdentifier,
   nextDerivationPath,
 } from "@/libs/crypto";
-import { accountsDBPromise, db } from "@/db/index";
+import { accountsDB, db } from "@/db/index";
 import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
-import { retrieveAllFullyDecryptedAccounts } from "@/libs/util";
 
 @Component({
   components: {},
@@ -91,7 +90,8 @@ export default class ImportAccountView extends Vue {
   selectedArrayFirstDid = "";
 
   async mounted() {
-    const accounts = await retrieveAllFullyDecryptedAccounts(); // let's match derived accounts differently so we don't need the private info
+    await accountsDB.open();
+    const accounts = await accountsDB.accounts.toArray();
     const seedDids: Record<string, Array<string>> = {};
     accounts.forEach((account) => {
       const prevDids: Array<string> = seedDids[account.mnemonic] || [];
@@ -110,11 +110,11 @@ export default class ImportAccountView extends Vue {
   }
 
   public async incrementDerivation() {
+    await accountsDB.open();
     // find the maximum derivation path for the selected DIDs
     const selectedArray: Array<string> =
       this.didArrays.find((dids) => dids[0] === this.selectedArrayFirstDid) ||
       [];
-    const accountsDB = await accountsDBPromise; // let's match derived accounts differently so we don't need the private info
     const allMatchingAccounts = await accountsDB.accounts
       .where("did")
       .anyOf(...selectedArray)

src/views/InviteOneAcceptView.vue

@@ -1,169 +0,0 @@
-<template>
-  <QuickNav selected="Invite" />
-  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <div
-      v-if="checkingInvite"
-      class="text-lg text-center font-light relative px-7"
-    >
-      <fa icon="spinner" class="fa-spin-pulse" />
-    </div>
-    <div v-else class="text-center mt-4">
-      <p>That invitation did not work.</p>
-      <p class="mt-2">
-        Go back to your invite message and copy the entire text, then paste it
-        here.
-      </p>
-      <p class="mt-2">
-        If the data looks correct, try Chrome. (For example, iOS may have cut
-        off the invite data, or it may have shown a preview that stole your
-        invite.) If it still complains, you may need the person who invited you
-        to send a new one.
-      </p>
-      <textarea
-        v-model="inputJwt"
-        placeholder="Paste invitation..."
-        class="mt-4 border-2 border-gray-300 p-2 rounded"
-        cols="30"
-        @input="() => checkInvite(inputJwt)"
-      />
-      <br />
-      <button
-        @click="() => processInvite(inputJwt, true)"
-        class="ml-2 p-2 bg-blue-500 text-white rounded"
-      >
-        Accept
-      </button>
-    </div>
-  </section>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-import { Router } from "vue-router";
-
-import QuickNav from "@/components/QuickNav.vue";
-import { APP_SERVER, NotificationIface } from "@/constants/app";
-import {
-  db,
-  logConsoleAndDb,
-  retrieveSettingsForActiveAccount,
-} from "@/db/index";
-import { decodeEndorserJwt } from "@/libs/crypto/vc";
-import { errorStringForLog } from "@/libs/endorserServer";
-import { generateSaveAndActivateIdentity } from "@/libs/util";
-
-@Component({ components: { QuickNav } })
-export default class InviteOneAcceptView extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  activeDid: string = "";
-  apiServer: string = "";
-  checkingInvite: boolean = true;
-  inputJwt: string = "";
-
-  async mounted() {
-    this.checkingInvite = true;
-    await db.open();
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
-
-    if (!this.activeDid) {
-      this.activeDid = await generateSaveAndActivateIdentity();
-    }
-
-    const jwt = window.location.pathname.substring(
-      "/invite-one-accept/".length,
-    );
-    await this.processInvite(jwt, false);
-
-    this.checkingInvite = false;
-  }
-
-  // process the invite JWT and/or text message containing the URL with the JWT
-  async processInvite(jwtInput: string, notifyOnFailure: boolean) {
-    this.checkingInvite = true;
-
-    try {
-      let jwt: string = jwtInput ?? "";
-
-      // parse the string: extract the URL or JWT if surrounded by spaces
-      // and then extract the JWT from the URL
-      // (For another approach used with contacts, see getContactPayloadFromJwtUrl)
-      const urlMatch = jwtInput.match(/(https?:\/\/[^\s]+)/);
-      if (urlMatch && urlMatch[1]) {
-        // extract the JWT from the URL, meaning any character except "?"
-        const internalMatch = urlMatch[1].match(/\/invite-one-accept\/([^?]+)/);
-        if (internalMatch && internalMatch[1]) {
-          jwt = internalMatch[1];
-        }
-      } else {
-        // extract the JWT (which starts with "ey") if it is surrounded by other input
-        const spaceMatch = jwtInput.match(/(ey[\w.-]+)/);
-        if (spaceMatch && spaceMatch[1]) {
-          jwt = spaceMatch[1];
-        }
-      }
-
-      if (!jwt) {
-        if (notifyOnFailure) {
-          this.$notify(
-            {
-              group: "alert",
-              type: "danger",
-              title: "Missing Invite",
-              text: "There was no invite. Paste the entire text that has the data.",
-            },
-            5000,
-          );
-        }
-      } else {
-        //const payload: JWTPayload =
-        decodeEndorserJwt(jwt);
-
-        // That's good enough for an initial check.
-        // Send them to the contacts page to finish, with inviteJwt in the query string.
-        (this.$router as Router).push({
-          name: "contacts",
-          query: { inviteJwt: jwt },
-        });
-      }
-    } catch (error) {
-      const fullError = "Error accepting invite: " + errorStringForLog(error);
-      logConsoleAndDb(fullError, true);
-      if (notifyOnFailure) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Error",
-            text: "There was an error processing that invite.",
-          },
-          3000,
-        );
-      }
-    }
-    this.checkingInvite = false;
-  }
-
-  // check the invite JWT
-  async checkInvite(jwtInput: string) {
-    if (
-      jwtInput.endsWith(APP_SERVER) ||
-      jwtInput.endsWith(APP_SERVER + "/") ||
-      jwtInput.endsWith("invite-one-accept") ||
-      jwtInput.endsWith("invite-one-accept/")
-    ) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "That is only part of the invite data; it's missing some at the end. Try another way to get the full data.",
-        },
-        5000,
-      );
-    }
-  }
-}
-</script>

src/views/InviteOneView.vue

@@ -1,399 +0,0 @@
-<template>
-  <QuickNav selected="Invite" />
-  <TopMessage />
-
-  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Back -->
-    <div class="text-lg text-center font-light relative px-7">
-      <h1
-        class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
-        @click="$router.back()"
-      >
-        <fa icon="chevron-left" class="fa-fw"></fa>
-      </h1>
-    </div>
-
-    <!-- Heading -->
-    <h1 class="text-4xl text-center font-light">Invitations</h1>
-
-    <ul class="ml-8 mt-4 list-outside list-disc w-5/6">
-      <li>
-        Note when sending
-        <span
-          v-if="!showAppleWarning"
-          class="text-blue-500 cursor-pointer"
-          @click="showAppleWarning = !showAppleWarning"
-        >
-          to Apple users...
-        </span>
-        <span v-else>
-          to Apple users: their links often fail because their device cuts off
-          part of the link. You might need to send it to them some other way,
-          like in an email.
-        </span>
-      </li>
-    </ul>
-
-    <!-- New Project -->
-    <button
-      v-if="isRegistered"
-      class="fixed right-6 top-12 text-center text-4xl leading-none bg-green-600 text-white w-14 py-2.5 rounded-full"
-      @click="createInvite()"
-    >
-      <fa icon="plus" class="fa-fw"></fa>
-    </button>
-
-    <InviteDialog ref="inviteDialog" />
-
-    <!-- Invites Table -->
-    <div v-if="invites.length" class="mt-6">
-      <table class="min-w-full bg-white">
-        <thead>
-          <tr>
-            <th class="py-2">
-              ID
-              <br />
-              (click for link)
-            </th>
-            <th class="py-2">Notes</th>
-            <th class="py-2">Expires At</th>
-            <th class="py-2">Redeemed</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr
-            v-for="invite in invites"
-            :key="invite.inviteIdentifier"
-            class="border-t py-2"
-          >
-            <td>
-              <span
-                v-if="
-                  !invite.redeemedAt &&
-                  invite.expiresAt > new Date().toISOString()
-                "
-                @click="
-                  copyInviteAndNotify(invite.inviteIdentifier, invite.jwt)
-                "
-                class="text-center text-blue-500 cursor-pointer"
-                :title="inviteLink(invite.jwt)"
-              >
-                {{ getTruncatedInviteId(invite.inviteIdentifier) }}
-              </span>
-              <span
-                v-else
-                @click="
-                  showInvite(
-                    invite.inviteIdentifier,
-                    !!invite.redeemedAt,
-                    invite.expiresAt < new Date().toISOString(),
-                  )
-                "
-                class="text-center text-slate-500 cursor-pointer"
-                :title="inviteLink(invite.jwt)"
-              >
-                {{ getTruncatedInviteId(invite.inviteIdentifier) }}
-              </span>
-            </td>
-            <td class="text-left" :data-testId="inviteLink(invite.jwt)">
-              {{ invite.notes }}
-            </td>
-            <td class="text-center">
-              {{ invite.redeemedAt ? "" : invite.expiresAt.substring(0, 10) }}
-            </td>
-            <td class="text-center">
-              {{ invite.redeemedAt?.substring(0, 10) }}
-              <br />
-              {{ getTruncatedRedeemedBy(invite.redeemedBy) }}
-              <br />
-              <fa
-                v-if="invite.redeemedBy && !contactsRedeemed[invite.redeemedBy]"
-                icon="plus"
-                class="bg-green-600 text-white px-1 py-1 rounded-full cursor-pointer"
-                @click="addNewContact(invite.redeemedBy, invite.notes)"
-              />
-            </td>
-            <td>
-              <fa
-                icon="trash-can"
-                class="text-red-600 text-xl ml-2 mr-2 cursor-pointer"
-                @click="deleteInvite(invite.inviteIdentifier, invite.notes)"
-              />
-            </td>
-          </tr>
-        </tbody>
-      </table>
-      <ContactNameDialog ref="contactNameDialog" />
-    </div>
-    <p v-else class="mt-6 text-center">No invites found.</p>
-  </section>
-</template>
-<script lang="ts">
-import axios from "axios";
-import { Component, Vue } from "vue-facing-decorator";
-import { useClipboard } from "@vueuse/core";
-
-import ContactNameDialog from "@/components/ContactNameDialog.vue";
-import QuickNav from "@/components/QuickNav.vue";
-import TopMessage from "@/components/TopMessage.vue";
-import InviteDialog from "@/components/InviteDialog.vue";
-import { APP_SERVER, AppString, NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
-import { Contact } from "@/db/tables/contacts";
-import { createInviteJwt, getHeaders } from "@/libs/endorserServer";
-
-interface Invite {
-  inviteIdentifier: string;
-  expiresAt: string;
-  jwt: string;
-  notes: string;
-  redeemedAt: string | null;
-  redeemedBy: string | null;
-}
-
-@Component({
-  components: { ContactNameDialog, QuickNav, TopMessage, InviteDialog },
-})
-export default class InviteOneView extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  invites: Invite[] = [];
-  activeDid: string = "";
-  apiServer: string = "";
-  contactsRedeemed: { [key: string]: Contact } = {};
-  isRegistered: boolean = false;
-  showAppleWarning = false;
-
-  async mounted() {
-    try {
-      await db.open();
-      const settings = await retrieveSettingsForActiveAccount();
-      this.activeDid = settings.activeDid || "";
-      this.apiServer = settings.apiServer || "";
-      this.isRegistered = !!settings.isRegistered;
-
-      const headers = await getHeaders(this.activeDid);
-      const response = await axios.get(
-        this.apiServer + "/api/userUtil/invite",
-        { headers },
-      );
-      this.invites = response.data.data;
-
-      const baseContacts: Contact[] = await db.contacts.toArray();
-      for (const invite of this.invites) {
-        const contact = baseContacts.find(
-          (contact) => contact.did === invite.redeemedBy,
-        );
-        if (contact && invite.redeemedBy) {
-          this.contactsRedeemed[invite.redeemedBy] = contact;
-        }
-      }
-    } catch (error) {
-      console.error("Error fetching invites:", error);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Load Error",
-          text: "Got an error loading your invites.",
-        },
-        5000,
-      );
-    }
-  }
-
-  getTruncatedInviteId(inviteId: string): string {
-    if (inviteId.length <= 9) return inviteId;
-    return `${inviteId.slice(0, 6)}...`;
-  }
-
-  getTruncatedRedeemedBy(redeemedBy: string | null): string {
-    if (!redeemedBy) return "";
-    if (this.contactsRedeemed[redeemedBy]) {
-      return (
-        this.contactsRedeemed[redeemedBy].name || AppString.NO_CONTACT_NAME
-      );
-    }
-    if (redeemedBy.length <= 19) return redeemedBy;
-    return `${redeemedBy.slice(0, 13)}...${redeemedBy.slice(-3)}`;
-  }
-
-  inviteLink(jwt: string): string {
-    return APP_SERVER + "/invite-one-accept/" + jwt;
-  }
-
-  copyInviteAndNotify(inviteId: string, jwt: string) {
-    useClipboard().copy(this.inviteLink(jwt));
-    this.$notify(
-      {
-        group: "alert",
-        type: "success",
-        title: "Copied",
-        text: "Your clipboard now contains the link for invite " + inviteId,
-      },
-      5000,
-    );
-  }
-
-  showInvite(inviteId: string, redeemed: boolean, expired: boolean) {
-    let message = `Your clipboard now contains the invite ID ${inviteId}`;
-    if (redeemed) {
-      message += " (This invite has been used.)";
-    } else if (expired) {
-      message += " (This invite has expired.)";
-    }
-    useClipboard().copy(inviteId);
-    this.$notify(
-      {
-        group: "alert",
-        type: "success",
-        title: "Copied",
-        text: message,
-      },
-      5000,
-    );
-  }
-
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  lookForErrorAndNotify(error: any, title: string, defaultMessage: string) {
-    console.error(title, "-", error);
-    let message = defaultMessage;
-    if (error.response && error.response.data && error.response.data.error) {
-      if (error.response.data.error.message) {
-        message = error.response.data.error.message;
-      } else {
-        message = error.response.data.error;
-      }
-    }
-    this.$notify(
-      {
-        group: "alert",
-        type: "danger",
-        title: title,
-        text: message,
-      },
-      5000,
-    );
-  }
-
-  async createInvite() {
-    const inviteIdentifier =
-      Math.random().toString(36).substring(2) +
-      Math.random().toString(36).substring(2) +
-      Math.random().toString(36).substring(2);
-    (this.$refs.inviteDialog as InviteDialog).open(
-      inviteIdentifier,
-      async (notes, expiresAt) => {
-        try {
-          const headers = await getHeaders(this.activeDid);
-          if (!expiresAt) {
-            throw {
-              response: {
-                data: { error: "You must select an expiration date." },
-              },
-            };
-          }
-          const expiresIn = (new Date(expiresAt).getTime() - Date.now()) / 1000;
-          const inviteJwt = await createInviteJwt(
-            this.activeDid,
-            undefined,
-            inviteIdentifier,
-            expiresIn,
-          );
-          await axios.post(
-            this.apiServer + "/api/userUtil/invite",
-            { inviteJwt: inviteJwt, notes: notes },
-            { headers },
-          );
-          const newInvite = {
-            inviteIdentifier: inviteIdentifier,
-            expiresAt: expiresAt,
-            jwt: inviteJwt,
-            notes: notes,
-            redeemedAt: null,
-            redeemedBy: null,
-          };
-          this.invites = [newInvite, ...this.invites];
-          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        } catch (error: any) {
-          this.lookForErrorAndNotify(
-            error,
-            "Error Creating Invite",
-            "Got an error creating your invite.",
-          );
-        }
-      },
-    );
-  }
-
-  addNewContact(did: string, notes: string) {
-    (this.$refs.contactNameDialog as ContactNameDialog).open(
-      "To Whom Did You Send The Invite?",
-      "Their name will be added to your contact list.",
-      (name) => {
-        // the person obviously registered themselves and this user already granted visibility, so we just add them
-        const contact = {
-          did: did,
-          name: name,
-          registered: true,
-        };
-        db.contacts.add(contact);
-        this.contactsRedeemed[did] = contact;
-        this.$notify(
-          {
-            group: "alert",
-            type: "success",
-            title: "Contact Added",
-            text: `${name} has been added to your contacts.`,
-          },
-          3000,
-        );
-      },
-      () => {},
-      notes,
-    );
-  }
-
-  deleteInvite(inviteId: string, notes: string) {
-    this.$notify(
-      {
-        group: "modal",
-        type: "confirm",
-        title: "Delete Invite?",
-        text: `Are you sure you want to erase the invite for "${notes}"? (There is no undo.)`,
-        onYes: async () => {
-          const headers = await getHeaders(this.activeDid);
-          try {
-            const result = await axios.delete(
-              this.apiServer + "/api/userUtil/invite/" + inviteId,
-              { headers },
-            );
-            if (result.status !== 204) {
-              throw result.data;
-            }
-            this.invites = this.invites.filter(
-              (invite) => invite.inviteIdentifier !== inviteId,
-            );
-            this.$notify(
-              {
-                group: "alert",
-                type: "success",
-                title: "Deleted",
-                text: "Invite deleted.",
-              },
-              3000,
-            );
-          } catch (e) {
-            this.lookForErrorAndNotify(
-              e,
-              "Error Deleting Invite",
-              "Got an error deleting your invite.",
-            );
-          }
-        },
-      },
-      -1,
-    );
-  }
-}
-</script>

src/views/NewActivityView.vue

@@ -1,330 +0,0 @@
-<template>
-  <QuickNav selected="Home"></QuickNav>
-  <!-- CONTENT -->
-  <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">
-        <!-- Back -->
-        <fa
-          icon="chevron-left"
-          @click="$router.back()"
-          class="fa-fw text-lg text-center px-2 py-1 absolute -left-2 -top-1"
-        />
-        New Activity For You
-      </h1>
-    </div>
-
-    <!-- Display a single row with the name of "New Offers To You" with a count. -->
-    <div class="flex justify-between" data-testId="showOffersToUser">
-      <div>
-        <span class="text-lg font-medium"
-          >{{ newOffersToUser.length
-          }}{{ newOffersToUserHitLimit ? "+" : "" }}</span
-        >
-        <span class="text-lg font-medium ml-4"
-          >New Offer{{ newOffersToUser.length === 1 ? "" : "s" }} To You</span
-        >
-        <fa
-          v-if="newOffersToUser.length > 0"
-          :icon="showOffersDetails ? 'chevron-down' : 'chevron-right'"
-          class="cursor-pointer ml-4 mr-4 text-lg"
-          @click="expandOffersToUserAndMarkRead()"
-        />
-      </div>
-      <router-link to="/recent-offers-to-user" class="text-blue-500">
-        See&nbsp;all
-      </router-link>
-    </div>
-
-    <div v-if="showOffersDetails" class="ml-4 mt-4">
-      <ul class="list-disc ml-4">
-        <li
-          v-for="offer in newOffersToUser"
-          :key="offer.jwtId"
-          class="mt-4 relative group"
-        >
-          <span>{{
-            didInfo(offer.offeredByDid, activeDid, allMyDids, allContacts)
-          }}</span>
-          offered
-          <span v-if="offer.objectDescription">{{
-            offer.objectDescription
-          }}</span
-          >{{ offer.objectDescription && offer.amount ? ", and " : "" }}
-          <span v-if="offer.amount">{{
-            displayAmount(offer.unit, offer.amount)
-          }}</span>
-          <router-link
-            :to="{ path: '/claim/' + encodeURIComponent(offer.jwtId) }"
-            class="text-blue-500"
-          >
-            <fa icon="file-lines" class="pl-2 text-blue-500 cursor-pointer" />
-          </router-link>
-          <!-- New line that appears on hover or when the offer is clicked -->
-          <div
-            @click="markOffersAsReadStartingWith(offer.jwtId)"
-            class="absolute left-0 w-full text-left text-gray-500 text-sm hidden group-hover:flex cursor-pointer items-center"
-          >
-            <span class="inline-block w-8 h-px bg-gray-500 mr-2" />
-            Click to keep all above as new offers
-          </div>
-        </li>
-      </ul>
-    </div>
-
-    <!-- Display a single row with the name of "New Offers To Your Projects" with a count. -->
-    <div
-      class="mt-4 flex justify-between"
-      data-testId="showOffersToUserProjects"
-    >
-      <div>
-        <span class="text-lg font-medium"
-          >{{ newOffersToUserProjects.length
-          }}{{ newOffersToUserProjectsHitLimit ? "+" : "" }}</span
-        >
-        <span class="text-lg font-medium ml-4"
-          >New Offer{{ newOffersToUserProjects.length === 1 ? "" : "s" }} To
-          Your Projects</span
-        >
-        <fa
-          v-if="newOffersToUserProjects.length > 0"
-          :icon="
-            showOffersToUserProjectsDetails ? 'chevron-down' : 'chevron-right'
-          "
-          class="cursor-pointer ml-4 mr-4 text-lg"
-          @click="expandOffersToUserProjectsAndMarkRead()"
-        />
-      </div>
-      <router-link to="/recent-offers-to-user-projects" class="text-blue-500">
-        See&nbsp;all
-      </router-link>
-    </div>
-
-    <div v-if="showOffersToUserProjectsDetails" class="ml-4 mt-4">
-      <ul class="list-disc ml-4">
-        <li
-          v-for="offer in newOffersToUserProjects"
-          :key="offer.jwtId"
-          class="mt-4 relative group"
-        >
-          <span>{{
-            didInfo(offer.offeredByDid, activeDid, allMyDids, allContacts)
-          }}</span>
-          offered
-          <span v-if="offer.objectDescription">{{
-            offer.objectDescription
-          }}</span
-          >{{ offer.objectDescription && offer.amount ? ", and " : "" }}
-          <span v-if="offer.amount">{{
-            displayAmount(offer.unit, offer.amount)
-          }}</span>
-          to
-          <span>{{ offer.planName }}</span>
-          <router-link
-            :to="{ path: '/claim/' + encodeURIComponent(offer.jwtId) }"
-            class="text-blue-500"
-          >
-            <fa icon="file-lines" class="pl-2 text-blue-500 cursor-pointer" />
-          </router-link>
-          <!-- New line that appears on hover -->
-          <div
-            @click="markOffersToUserProjectsAsReadStartingWith(offer.jwtId)"
-            class="absolute left-0 w-full text-left text-gray-500 text-sm hidden group-hover:flex cursor-pointer items-center"
-          >
-            <span class="inline-block w-8 h-px bg-gray-500 mr-2" />
-            Click to keep all above as new offers
-          </div>
-        </li>
-      </ul>
-    </div>
-  </section>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-
-import GiftedDialog from "@/components/GiftedDialog.vue";
-import QuickNav from "@/components/QuickNav.vue";
-import EntityIcon from "@/components/EntityIcon.vue";
-import { NotificationIface } from "@/constants/app";
-import {
-  db,
-  retrieveSettingsForActiveAccount,
-  updateAccountSettings,
-} from "@/db/index";
-import { Contact } from "@/db/tables/contacts";
-import {
-  didInfo,
-  displayAmount,
-  getNewOffersToUser,
-  getNewOffersToUserProjects,
-  OfferSummaryRecord,
-  OfferToPlanSummaryRecord,
-} from "@/libs/endorserServer";
-import { retrieveAccountDids } from "@/libs/util";
-
-@Component({
-  components: { GiftedDialog, QuickNav, EntityIcon },
-})
-export default class NewActivityView extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  activeDid = "";
-  allContacts: Array<Contact> = [];
-  allMyDids: string[] = [];
-  apiServer = "";
-  lastAckedOfferToUserJwtId = "";
-  lastAckedOfferToUserProjectsJwtId = "";
-  newOffersToUser: Array<OfferSummaryRecord> = [];
-  newOffersToUserHitLimit = false;
-  newOffersToUserProjects: Array<OfferToPlanSummaryRecord> = [];
-  newOffersToUserProjectsHitLimit = false;
-
-  showOffersDetails = false;
-  showOffersToUserProjectsDetails = false;
-  didInfo = didInfo;
-  displayAmount = displayAmount;
-
-  async created() {
-    try {
-      const settings = await retrieveSettingsForActiveAccount();
-      this.apiServer = settings.apiServer || "";
-      this.activeDid = settings.activeDid || "";
-      this.lastAckedOfferToUserJwtId = settings.lastAckedOfferToUserJwtId || "";
-      this.lastAckedOfferToUserProjectsJwtId =
-        settings.lastAckedOfferToUserProjectsJwtId || "";
-
-      this.allContacts = await db.contacts.toArray();
-      this.allMyDids = await retrieveAccountDids();
-
-      const offersToUserData = await getNewOffersToUser(
-        this.axios,
-        this.apiServer,
-        this.activeDid,
-        this.lastAckedOfferToUserJwtId,
-      );
-      this.newOffersToUser = offersToUserData.data;
-      this.newOffersToUserHitLimit = offersToUserData.hitLimit;
-
-      const offersToUserProjectsData = await getNewOffersToUserProjects(
-        this.axios,
-        this.apiServer,
-        this.activeDid,
-        this.lastAckedOfferToUserProjectsJwtId,
-      );
-      this.newOffersToUserProjects = offersToUserProjectsData.data;
-      this.newOffersToUserProjectsHitLimit = offersToUserProjectsData.hitLimit;
-
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    } catch (err: any) {
-      console.error("Error retrieving settings & contacts:", err);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: err.message || "There was an error retrieving your activity.",
-        },
-        5000,
-      );
-    }
-  }
-
-  async expandOffersToUserAndMarkRead() {
-    this.showOffersDetails = !this.showOffersDetails;
-    if (this.showOffersDetails) {
-      await updateAccountSettings(this.activeDid, {
-        lastAckedOfferToUserJwtId: this.newOffersToUser[0].jwtId,
-      });
-      // note that we don't update this.lastAckedOfferToUserJwtId in case they
-      // later choose the last one to keep the offers as new
-      this.$notify(
-        {
-          group: "alert",
-          type: "info",
-          title: "Marked as Read",
-          text: "The offers are marked as viewed. Click in the list to keep them as new.",
-        },
-        5000,
-      );
-    }
-  }
-
-  async markOffersAsReadStartingWith(jwtId: string) {
-    const index = this.newOffersToUser.findIndex(
-      (offer) => offer.jwtId === jwtId,
-    );
-    if (index !== -1 && index < this.newOffersToUser.length - 1) {
-      // Set to the next offer's jwtId
-      await updateAccountSettings(this.activeDid, {
-        lastAckedOfferToUserJwtId: this.newOffersToUser[index + 1].jwtId,
-      });
-    } else {
-      // it's the last entry (or not found), so just keep it the same
-      await updateAccountSettings(this.activeDid, {
-        lastAckedOfferToUserJwtId: this.lastAckedOfferToUserJwtId,
-      });
-    }
-    this.$notify(
-      {
-        group: "alert",
-        type: "info",
-        title: "Marked as Unread",
-        text: "All offers above that line are marked as unread.",
-      },
-      3000,
-    );
-  }
-
-  async expandOffersToUserProjectsAndMarkRead() {
-    this.showOffersToUserProjectsDetails =
-      !this.showOffersToUserProjectsDetails;
-    if (this.showOffersToUserProjectsDetails) {
-      await updateAccountSettings(this.activeDid, {
-        lastAckedOfferToUserProjectsJwtId:
-          this.newOffersToUserProjects[0].jwtId,
-      });
-      // note that we don't update this.lastAckedOfferToUserProjectsJwtId in case
-      // they later choose the last one to keep the offers as new
-      this.$notify(
-        {
-          group: "alert",
-          type: "info",
-          title: "Marked as Read",
-          text: "The offers are now marked as viewed. Click in the list to keep them as new.",
-        },
-        5000,
-      );
-    }
-  }
-
-  async markOffersToUserProjectsAsReadStartingWith(jwtId: string) {
-    const index = this.newOffersToUserProjects.findIndex(
-      (offer) => offer.jwtId === jwtId,
-    );
-    if (index !== -1 && index < this.newOffersToUserProjects.length - 1) {
-      // Set to the next offer's jwtId
-      await updateAccountSettings(this.activeDid, {
-        lastAckedOfferToUserProjectsJwtId:
-          this.newOffersToUserProjects[index + 1].jwtId,
-      });
-    } else {
-      // it's the last entry (or not found), so just keep it the same
-      await updateAccountSettings(this.activeDid, {
-        lastAckedOfferToUserProjectsJwtId:
-          this.lastAckedOfferToUserProjectsJwtId,
-      });
-    }
-    this.$notify(
-      {
-        group: "alert",
-        type: "info",
-        title: "Marked as Unread",
-        text: "All offers above that line are marked as unread.",
-      },
-      3000,
-    );
-  }
-}
-</script>

src/views/NewEditAccountView.vue

@@ -47,8 +47,8 @@
 import { Component, Vue } from "vue-facing-decorator";
 import { Router } from "vue-router";
 
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
-import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
+import { db } from "@/db/index";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
 
 @Component({
   components: {},
@@ -58,10 +58,11 @@ export default class NewEditAccountView extends Vue {
 
   // 'created' hook runs when the Vue instance is first created
   async created() {
-    const settings = await retrieveSettingsForActiveAccount();
+    await db.open();
+    const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
     this.givenName =
-      (settings.firstName || "") +
-      (settings.lastName ? ` ${settings.lastName}` : ""); // deprecated, pre v 0.1.3
+      (settings?.firstName || "") +
+      (settings?.lastName ? ` ${settings.lastName}` : ""); // deprecated, pre v 0.1.3
   }
 
   async onClickSaveChanges() {

src/views/NewEditProjectView.vue

@@ -6,14 +6,12 @@
     <div id="ViewBreadcrumb" class="mb-8">
       <h1 class="text-lg text-center font-light relative px-7">
         <!-- Cancel -->
-        <!-- Back -->
-        <button
-          @click="$router.go(-1)"
+        <router-link
+          :to="{ name: 'project' }"
           class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
-        >
-          <fa icon="chevron-left" class="fa-fw"></fa>
-        </button>
-        Edit Project Idea
+          ><fa icon="chevron-left" class="fa-fw"></fa
+        ></router-link>
+        Edit Idea
       </h1>
     </div>
 
@@ -71,17 +69,15 @@
 
     <textarea
       placeholder="Description"
-      class="block w-full rounded border border-slate-400 px-3 py-2"
+      class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
       rows="5"
       v-model="fullClaim.description"
       maxlength="5000"
     ></textarea>
-    <div class="text-xs text-slate-500 italic">
-      If you want to be contacted, be sure to include your contact information
-      -- just remember that this information is public and saved in a public
-      history.
+    <div class="text-xs text-slate-500 italic -mt-3 mb-4">
+      If you want to be contacted, be sure to include your contact information.
     </div>
-    <div class="text-xs text-slate-500 italic">
+    <div class="text-xs text-slate-500 italic -mt-3 mb-4">
       {{ fullClaim.description?.length }}/5000 max. characters
     </div>
 
@@ -89,58 +85,33 @@
       v-model="fullClaim.url"
       placeholder="Website"
       autocapitalize="none"
-      class="block w-full rounded border border-slate-400 mt-4 px-3 py-2"
+      class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
     />
 
-    <div>
-      <div class="flex items-center mt-4">
-        <span class="mr-2">Starts At</span>
-        <input
-          v-model="startDateInput"
-          placeholder="Start Date"
-          type="date"
-          class="rounded border border-slate-400 px-3 py-2"
-        />
-        <input
-          :disabled="!startDateInput"
-          placeholder="Start Time"
-          v-model="startTimeInput"
-          type="time"
-          class="rounded border border-slate-400 ml-2 px-3 py-2"
-        />
-      </div>
-
-      <div class="flex w-full justify-end items-center">
-        <span class="w-full flex justify-end items-center">
-          {{ zoneName }} time zone
-        </span>
-      </div>
-
-      <div class="flex items-center">
-        <div class="mr-2">
-          <span>Ends at</span>
-        </div>
-        <input
-          v-model="endDateInput"
-          placeholder="End Date"
-          type="date"
-          class="ml-2 rounded border border-slate-400 px-3 py-2"
-        />
-        <input
-          :disabled="!endDateInput"
-          placeholder="End Time"
-          v-model="endTimeInput"
-          type="time"
-          class="rounded border border-slate-400 ml-2 px-3 py-2"
-        />
-      </div>
+    <div class="flex mb-4 columns-3 w-full">
+      <input
+        v-model="startDateInput"
+        placeholder="Start Date"
+        type="date"
+        class="col-span-1 w-full rounded border border-slate-400 px-3 py-2"
+      />
+      <input
+        :disabled="!startDateInput"
+        placeholder="Start Time"
+        v-model="startTimeInput"
+        type="time"
+        class="col-span-1 w-full rounded border border-slate-400 ml-2 px-3 py-2"
+      />
+      <span class="col-span-1 w-full flex justify-center">{{ zoneName }}</span>
     </div>
 
-    <div
-      class="flex items-center mt-4"
-      @click="includeLocation = !includeLocation"
-    >
-      <input type="checkbox" class="mr-2" v-model="includeLocation" />
+    <div class="flex items-center mb-4">
+      <input
+        type="checkbox"
+        class="mr-2"
+        v-model="includeLocation"
+        @click="includeLocation = !includeLocation"
+      />
       <label for="includeLocation">Include Location</label>
     </div>
     <div v-if="includeLocation" class="mb-4 aspect-video">
@@ -174,28 +145,6 @@
       </l-map>
     </div>
 
-    <div
-      v-if="showGeneralAdvanced && includeLocation"
-      class="items-center mb-4"
-    >
-      <div class="flex" @click="sendToTrustroots = !sendToTrustroots">
-        <input type="checkbox" class="mr-2" v-model="sendToTrustroots" />
-        <label>Send to Trustroots</label>
-        <fa
-          icon="circle-info"
-          class="text-blue-500 ml-2 cursor-pointer"
-          @click.stop="showNostrPartnerInfo"
-        />
-      </div>
-      <!--
-      <div class="flex" @click="sendToTripHopping = !sendToTripHopping">
-        <input type="checkbox" class="mr-2" v-model="sendToTripHopping" />
-        <label>Send to TripHopping</label>
-        <fa icon="circle-info" class="text-blue-500 ml-2 cursor-pointer" @click.stop="showNostrPartnerInfo" />
-      </div>
-      -->
-    </div>
-
     <div class="mt-8">
       <div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
         <button
@@ -229,38 +178,28 @@
 import "leaflet/dist/leaflet.css";
 import { AxiosError, AxiosRequestHeaders } from "axios";
 import { DateTime } from "luxon";
-import { finalizeEvent, serializeEvent } from "nostr-tools";
-// these core imports could also be included as "import type ..."
-import { EventTemplate, UnsignedEvent, VerifiedEvent } from "nostr-tools/core";
-import * as nip06 from "nostr-tools/nip06";
 import { Component, Vue } from "vue-facing-decorator";
 import { LMap, LMarker, LTileLayer } from "@vue-leaflet/vue-leaflet";
-import { RouteLocationNormalizedLoaded, Router } from "vue-router";
+import { Router } from "vue-router";
 
 import ImageMethodDialog from "@/components/ImageMethodDialog.vue";
 import QuickNav from "@/components/QuickNav.vue";
-import {
-  DEFAULT_IMAGE_API_SERVER,
-  DEFAULT_PARTNER_API_SERVER,
-  NotificationIface,
-} from "@/constants/app";
-import { retrieveSettingsForActiveAccount } from "@/db/index";
+import { DEFAULT_IMAGE_API_SERVER, NotificationIface } from "@/constants/app";
+import { accountsDB, db } from "@/db/index";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import {
   createEndorserJwtVcFromClaim,
   getHeaders,
   PlanVerifiableCredential,
 } from "@/libs/endorserServer";
-import {
-  retrieveAccountCount,
-  retrieveFullyDecryptedAccount,
-} from "@/libs/util";
+import { useAppStore } from "@/store/app";
 
 @Component({
   components: { ImageMethodDialog, LMap, LMarker, LTileLayer, QuickNav },
 })
 export default class NewEditProjectView extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
-  errNote(message: string) {
+  errNote(message) {
     this.$notify(
       { group: "alert", type: "danger", title: "Error", text: message },
       5000,
@@ -270,8 +209,6 @@ export default class NewEditProjectView extends Vue {
   activeDid = "";
   agentDid = "";
   apiServer = "";
-  endDateInput?: string;
-  endTimeInput?: string;
   errorMessage = "";
   fullClaim: PlanVerifiableCredential = {
     "@context": "https://schema.org",
@@ -287,26 +224,21 @@ export default class NewEditProjectView extends Vue {
   latitude = 0;
   longitude = 0;
   numAccounts = 0;
-  projectId = "";
+  projectId = localStorage.getItem("projectId") || "";
   projectIssuerDid = "";
-  sendToTrustroots = false;
-  sendToTripHopping = false;
-  showGeneralAdvanced = false;
   startDateInput?: string;
   startTimeInput?: string;
   zoneName = DateTime.local().zoneName;
   zoom = 2;
 
   async mounted() {
-    this.numAccounts = await retrieveAccountCount();
+    await accountsDB.open();
+    this.numAccounts = await accountsDB.accounts.count();
 
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
-    this.showGeneralAdvanced = !!settings.showGeneralAdvanced;
-
-    this.projectId =
-      (this.$route as RouteLocationNormalizedLoaded).query["projectId"] || "";
+    await db.open();
+    const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+    this.activeDid = (settings?.activeDid as string) || "";
+    this.apiServer = (settings?.apiServer as string) || "";
 
     if (this.projectId) {
       if (this.numAccounts === 0) {
@@ -346,13 +278,6 @@ export default class NewEditProjectView extends Vue {
           this.startDateInput = localDateTime.toFormat("yyyy-MM-dd");
           this.startTimeInput = localDateTime.toFormat("HH:mm");
         }
-        if (this.fullClaim.endTime) {
-          const localDateTime = DateTime.fromISO(
-            this.fullClaim.endTime as string,
-          ).toLocal();
-          this.endDateInput = localDateTime.toFormat("yyyy-MM-dd");
-          this.endTimeInput = localDateTime.toFormat("HH:mm");
-        }
       }
     } catch (error) {
       console.error("Got error retrieving that project", error);
@@ -432,7 +357,7 @@ export default class NewEditProjectView extends Vue {
     }
   }
 
-  private async saveProject() {
+  private async saveProject(issuerDid: string) {
     // Make a claim
     const vcClaim: PlanVerifiableCredential = this.fullClaim;
     if (this.projectId) {
@@ -451,26 +376,13 @@ export default class NewEditProjectView extends Vue {
       delete vcClaim.image;
     }
     if (this.includeLocation) {
-      if (!this.latitude || !this.longitude) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Location Error",
-            text: "The location was invalid so it was not set.",
-          },
-          5000,
-        );
-        delete vcClaim.location;
-      } else {
-        vcClaim.location = {
-          geo: {
-            "@type": "GeoCoordinates",
-            latitude: this.latitude,
-            longitude: this.longitude,
-          },
-        };
-      }
+      vcClaim.location = {
+        geo: {
+          "@type": "GeoCoordinates",
+          latitude: this.latitude,
+          longitude: this.longitude,
+        },
+      };
     } else {
       delete vcClaim.location;
     }
@@ -487,8 +399,8 @@ export default class NewEditProjectView extends Vue {
           {
             group: "alert",
             type: "danger",
-            title: "Date Error",
-            text: "The start date was invalid so it was not set.",
+            title: "Error",
+            text: "The date was invalid so it was not set.",
           },
           5000,
         );
@@ -496,94 +408,24 @@ export default class NewEditProjectView extends Vue {
     } else {
       delete vcClaim.startTime;
     }
-    if (this.endDateInput) {
-      try {
-        const endTimeFull = this.endTimeInput || "23:59:59";
-        const fullTimeString = this.endDateInput + " " + endTimeFull;
-        // throw an error on an invalid date or time string
-        vcClaim.endTime = new Date(fullTimeString).toISOString(); // ensure timezone is part of it
-      } catch {
-        // it's not a valid date so erase it and tell the user
-        delete vcClaim.endTime;
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Date Error",
-            text: "The end date was invalid so it was not set.",
-          },
-          5000,
-        );
-      }
-    } else {
-      delete vcClaim.endTime;
-    }
-    const vcJwt = await createEndorserJwtVcFromClaim(this.activeDid, vcClaim);
+    const vcJwt = await createEndorserJwtVcFromClaim(issuerDid, vcClaim);
 
     // Make the xhr request payload
 
     const payload = JSON.stringify({ jwtEncoded: vcJwt });
     const url = this.apiServer + "/api/v2/claim";
-    const headers = await getHeaders(this.activeDid);
+    const headers = await getHeaders(issuerDid);
 
     try {
       const resp = await this.axios.post(url, payload, { headers });
       if (resp.data?.success?.handleId) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "success",
-            title: "Saved",
-            text: "The project was saved successfully.",
-          },
-          3000,
-        );
-
         this.errorMessage = "";
 
-        const projectPath = encodeURIComponent(resp.data.success.handleId);
-
-        if (this.sendToTrustroots || this.sendToTripHopping) {
-          if (this.latitude && this.longitude) {
-            let payloadAndKey; // sign something to prove ownership of pubkey
-            if (this.sendToTrustroots) {
-              payloadAndKey = await this.signSomePayload();
-              // not going to await... the save was successful, so we'll continue to the next page
-              this.sendToNostrPartner(
-                "NOSTR-EVENT-TRUSTROOTS",
-                "Trustroots",
-                resp.data.success.claimId,
-                payloadAndKey.signedEvent,
-                payloadAndKey.publicExtendedKey,
-              );
-            }
-            if (this.sendToTripHopping) {
-              if (!payloadAndKey) {
-                payloadAndKey = await this.signSomePayload();
-              }
-              // not going to await... the save was successful, so we'll continue to the next page
-              this.sendToNostrPartner(
-                "NOSTR-EVENT-TRIPHOPPING",
-                "TripHopping",
-                resp.data.success.claimId,
-                payloadAndKey.signedEvent,
-                payloadAndKey.publicExtendedKey,
-              );
-            }
-          } else {
-            this.$notify(
-              {
-                group: "alert",
-                type: "danger",
-                title: "Partner Error",
-                text: "A partner was selected but the location was not set, so it was not sent to any partner.",
-              },
-              5000,
-            );
-          }
-        }
-
-        (this.$router as Router).push({ path: "/project/" + projectPath });
+        useAppStore()
+          .setProjectId(resp.data.success.handleId)
+          .then(() => {
+            (this.$router as Router).push({ name: "project" });
+          });
       } else {
         console.error(
           "Got unexpected 'data' inside response from server",
@@ -596,7 +438,7 @@ export default class NewEditProjectView extends Vue {
             title: "Error Saving Idea",
             text: "Server did not save the idea. Try again.",
           },
-          5000,
+          -1,
         );
       }
     } catch (error) {
@@ -617,7 +459,7 @@ export default class NewEditProjectView extends Vue {
               title: "User Message",
               text: userMessage,
             },
-            5000,
+            -1,
           );
         } else {
           this.$notify(
@@ -627,7 +469,7 @@ export default class NewEditProjectView extends Vue {
               title: "Server Message",
               text: JSON.stringify(serverError.toJSON()),
             },
-            5000,
+            -1,
           );
         }
       } else {
@@ -639,7 +481,7 @@ export default class NewEditProjectView extends Vue {
             title: "Claim Error",
             text: error as string,
           },
-          5000,
+          -1,
         );
       }
       // Now set that error for the user to see.
@@ -647,128 +489,6 @@ export default class NewEditProjectView extends Vue {
     }
   }
 
-  /**
-   * @return a signed payload and an extended public key for later transmission
-   */
-  private async signSomePayload(): Promise<{
-    signedEvent: VerifiedEvent;
-    publicExtendedKey: string;
-  }> {
-    const account = await retrieveFullyDecryptedAccount(this.activeDid);
-    // get the last number of the derivationPath
-    const finalDerNum = account?.derivationPath?.split?.("/")?.reverse()[0];
-    // remove any trailing '
-    const finalDerNumNoApostrophe = finalDerNum?.replace(/'/g, "");
-    const accountNum = Number(finalDerNumNoApostrophe || 0);
-    const extPubPri = nip06.extendedKeysFromSeedWords(
-      account?.mnemonic as string,
-      "",
-      accountNum,
-    );
-    const publicExtendedKey: string = extPubPri?.publicExtendedKey;
-    const privateExtendedKey = extPubPri?.privateExtendedKey;
-    const privateBytes: Uint8Array =
-      nip06.accountFromExtendedKey(privateExtendedKey).privateKey;
-    // No real content is necessary, we just want something signed,
-    // so we might as well use nostr libs for nostr functions.
-    // Besides: someday we may create real content that we can relay.
-    const event: EventTemplate = {
-      kind: 30402,
-      tags: [[]],
-      content: "",
-      created_at: 0,
-    };
-    const signedEvent: VerifiedEvent = finalizeEvent(
-      // Why does IntelliJ not see matching types?
-      event as EventTemplate,
-      privateBytes,
-    ) as VerifiedEvent;
-    return { signedEvent, publicExtendedKey };
-  }
-
-  private async sendToNostrPartner(
-    linkCode: string,
-    serviceName: string,
-    jwtId: string,
-    signedPayload: VerifiedEvent,
-    publicExtendedKey: string,
-  ) {
-    try {
-      let partnerServer = DEFAULT_PARTNER_API_SERVER;
-      const settings = await retrieveSettingsForActiveAccount();
-      if (settings.partnerApiServer) {
-        partnerServer = settings.partnerApiServer;
-      }
-      const endorserPartnerUrl = partnerServer + "/api/partner/link";
-      const timeSafariUrl = window.location.origin + "/claim/" + jwtId;
-      const content = this.fullClaim.name + " - see " + timeSafariUrl;
-      const publicKeyHex =
-        nip06.accountFromExtendedKey(publicExtendedKey).publicKey;
-      const unsignedPayload: UnsignedEvent = {
-        // why doesn't "...signedPayload" work?
-        kind: signedPayload.kind,
-        tags: signedPayload.tags,
-        content: signedPayload.content,
-        created_at: signedPayload.created_at,
-        pubkey: publicKeyHex,
-      };
-      // Why does IntelliJ not see matching types?
-      const payload = serializeEvent(unsignedPayload as UnsignedEvent);
-      const partnerParams = {
-        jwtId: jwtId,
-        linkCode: linkCode,
-        inputJson: JSON.stringify(content),
-        pubKeyHex: publicKeyHex,
-        pubKeyImage: payload,
-        pubKeySigHex: signedPayload.sig,
-      };
-      const headers = await getHeaders(this.activeDid);
-      const linkResp = await this.axios.post(
-        endorserPartnerUrl,
-        partnerParams,
-        { headers },
-      );
-      if (linkResp.status === 201) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "success",
-            title: `Sent to ${serviceName}`,
-            text: `The project info was sent to ${serviceName}.`,
-          },
-          5000,
-        );
-      } else {
-        // axios never gets here because it throws an error, but just in case
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: `Failed Sending to ${serviceName}`,
-            text: JSON.stringify(linkResp.data),
-          },
-          5000,
-        );
-      }
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    } catch (error: any) {
-      console.error(`Error sending to ${serviceName}`, error);
-      let errorMessage = `There was an error sending to ${serviceName}.`;
-      if (error.response?.data?.error?.message) {
-        errorMessage = error.response.data.error.message;
-      }
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: `Error Sending to ${serviceName}`,
-          text: errorMessage,
-        },
-        7000,
-      );
-    }
-  }
-
   public async onSaveProjectClick() {
     this.isHiddenSave = true;
     this.isHiddenSpinner = false;
@@ -776,7 +496,7 @@ export default class NewEditProjectView extends Vue {
     if (this.numAccounts === 0) {
       console.error("Error: there is no account.");
     } else {
-      this.saveProject();
+      this.saveProject(this.activeDid);
     }
   }
 
@@ -804,17 +524,5 @@ export default class NewEditProjectView extends Vue {
   public onCancelClick() {
     (this.$router as Router).back();
   }
-
-  public showNostrPartnerInfo() {
-    this.$notify(
-      {
-        group: "alert",
-        type: "info",
-        title: "About Nostr Events",
-        text: "This will submit this project to a partner on the nostr network. It will contain your public key data which may allow correlation, so don't allow this if you're not comfortable with that.",
-      },
-      7000,
-    );
-  }
 }
 </script>

src/views/OfferDetailsView.vue

@@ -28,14 +28,14 @@
             ? projectName
             : offeredToRecipient
               ? recipientName
-              : "someone not named"
+              : "someone unidentified"
         }}</span
       >
     </h1>
     <textarea
       class="block w-full rounded border border-slate-400 mb-2 px-3 py-2"
       placeholder="What is offered"
-      v-model="descriptionOfItem"
+      v-model="itemDescription"
       data-testId="itemDescription"
     />
     <div class="flex flex-row justify-center">
@@ -74,7 +74,7 @@
       <textarea
         class="w-full border border-slate-400 px-3 py-2 rounded-r"
         placeholder="Prerequisites, other people to include, etc."
-        v-model="descriptionOfCondition"
+        v-model="conditionDescription"
       />
     </div>
 
@@ -135,7 +135,7 @@
       </label>
     </div>
 
-    <div v-if="showGeneralAdvanced" class="mt-4 flex">
+    <div class="mt-4 flex">
       <router-link
         :to="{
           name: 'claim-add-raw',
@@ -181,7 +181,8 @@ import { Router } from "vue-router";
 import QuickNav from "@/components/QuickNav.vue";
 import TopMessage from "@/components/TopMessage.vue";
 import { NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
+import { accountsDB, db } from "@/db/index";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
 import {
   createAndSubmitOffer,
   didInfo,
@@ -192,7 +193,7 @@ import {
   OfferVerifiableCredential,
 } from "@/libs/endorserServer";
 import * as libsUtil from "@/libs/util";
-import { retrieveAccountDids } from "@/libs/util";
+import { Contact } from "@/db/tables/contacts";
 
 @Component({
   components: {
@@ -207,21 +208,20 @@ export default class OfferDetailsView extends Vue {
   apiServer = "";
 
   amountInput = "0";
-  descriptionOfCondition = "";
-  descriptionOfItem = "";
+  conditionDescription = "";
+  itemDescription = "";
   destinationPathAfter = "";
-  hideBackButton = false;
-  message = "";
   offeredToProject = false;
   offeredToRecipient = false;
   offererDid: string | undefined;
+  hideBackButton = false;
+  message = "";
   offerId = "";
   prevCredToEdit?: GenericCredWrapper<OfferVerifiableCredential>;
   projectId = "";
   projectName = "a project";
   recipientDid = "";
   recipientName = "";
-  showGeneralAdvanced = false;
   unitCode = "HUR";
   validThroughDateInput = "";
 
@@ -242,7 +242,7 @@ export default class OfferDetailsView extends Vue {
           title: "Retrieval Error",
           text: "The previous record isn't available for editing. If you submit, you'll create a new record.",
         },
-        5000,
+        6000,
       );
     }
 
@@ -256,12 +256,12 @@ export default class OfferDetailsView extends Vue {
       this.prevCredToEdit?.claim?.includesObject?.unitCode ||
       this.unitCode) as string;
 
-    this.descriptionOfCondition =
-      this.prevCredToEdit?.claim?.description || this.descriptionOfCondition;
-    this.descriptionOfItem =
+    this.conditionDescription =
+      this.prevCredToEdit?.claim?.description || this.conditionDescription;
+    this.itemDescription =
       (this.$route as Router).query["description"] ||
       this.prevCredToEdit?.claim?.itemOffered?.description ||
-      this.descriptionOfItem;
+      this.itemDescription;
     this.destinationPathAfter = (this.$route as Router).query[
       "destinationPathAfter"
     ];
@@ -296,14 +296,19 @@ export default class OfferDetailsView extends Vue {
       this.prevCredToEdit?.claim?.validThrough || this.validThroughDateInput;
 
     try {
-      const settings = await retrieveSettingsForActiveAccount();
-      this.apiServer = settings.apiServer ?? "";
-      this.activeDid = settings.activeDid ?? "";
-      this.showGeneralAdvanced = settings.showGeneralAdvanced ?? false;
+      await db.open();
+      const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+      this.apiServer = settings?.apiServer || "";
+      this.activeDid = settings?.activeDid || "";
 
+      let allContacts: Contact[] = [];
+      let allMyDids: string[] = [];
       if (this.recipientDid && !this.recipientName) {
-        const allContacts = await db.contacts.toArray();
-        const allMyDids = await retrieveAccountDids();
+        allContacts = await db.contacts.toArray();
+
+        await accountsDB.open();
+        const allAccounts = await accountsDB.accounts.toArray();
+        allMyDids = allAccounts.map((acc) => acc.did);
         this.recipientName = didInfo(
           this.recipientDid,
           this.activeDid,
@@ -325,7 +330,7 @@ export default class OfferDetailsView extends Vue {
           title: "Error",
           text: err.message || "There was an error retrieving your settings.",
         },
-        5000,
+        -1,
       );
     }
 
@@ -397,7 +402,7 @@ export default class OfferDetailsView extends Vue {
       );
       return;
     }
-    if (!this.descriptionOfItem && !parseFloat(this.amountInput)) {
+    if (!this.itemDescription && !parseFloat(this.amountInput)) {
       this.$notify(
         {
           group: "alert",
@@ -497,10 +502,10 @@ export default class OfferDetailsView extends Vue {
           this.apiServer,
           this.prevCredToEdit,
           this.activeDid,
-          this.descriptionOfItem,
+          this.itemDescription,
           parseFloat(this.amountInput),
           this.unitCode,
-          this.descriptionOfCondition,
+          this.conditionDescription,
           this.validThroughDateInput,
           recipientDid,
           projectId,
@@ -510,10 +515,10 @@ export default class OfferDetailsView extends Vue {
           this.axios,
           this.apiServer,
           this.activeDid,
-          this.descriptionOfItem,
+          this.itemDescription,
           parseFloat(this.amountInput),
           this.unitCode,
-          this.descriptionOfCondition,
+          this.conditionDescription,
           this.validThroughDateInput,
           recipientDid,
           projectId,
@@ -530,7 +535,7 @@ export default class OfferDetailsView extends Vue {
             title: "Error",
             text: errorMessage || "There was an error creating the offer.",
           },
-          5000,
+          -1,
         );
       } else {
         this.$notify(
@@ -563,7 +568,7 @@ export default class OfferDetailsView extends Vue {
           title: "Error",
           text: errorMessage,
         },
-        5000,
+        -1,
       );
     }
   }
@@ -577,10 +582,10 @@ export default class OfferDetailsView extends Vue {
       this.prevCredToEdit?.claim as OfferVerifiableCredential,
       this.activeDid,
       recipientDid,
-      this.descriptionOfItem,
+      this.itemDescription,
       parseFloat(this.amountInput),
       this.unitCode,
-      this.descriptionOfCondition,
+      this.conditionDescription,
       projectId,
       this.validThroughDateInput,
       this.prevCredToEdit?.id as string,
@@ -621,7 +626,7 @@ export default class OfferDetailsView extends Vue {
         title: "Data Sharing",
         text: libsUtil.PRIVACY_MESSAGE,
       },
-      7000,
+      -1,
     );
   }
 }

src/views/OnboardMeetingListView.vue

@@ -1,343 +0,0 @@
-<template>
-  <QuickNav selected="Contacts" />
-  <TopMessage />
-
-  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Heading -->
-    <h1 id="ViewHeading" class="text-4xl text-center font-light mb-8">
-      Onboarding Meetings
-    </h1>
-
-    <!-- Loading State -->
-    <div v-if="isLoading" class="flex justify-center items-center py-8">
-      <fa icon="spinner" class="fa-spin-pulse" />
-    </div>
-
-    <div v-else-if="attendingMeeting">
-      <p>You are in this meeting.</p>
-      <div
-        class="p-4 bg-white rounded-lg shadow hover:shadow-md transition-shadow cursor-pointer"
-        @click="promptPassword(attendingMeeting)"
-      >
-        <div class="flex justify-between items-center">
-          <h2 class="text-xl font-medium">{{ attendingMeeting.name }}</h2>
-          <button
-            @click.stop="leaveMeeting"
-            class="text-red-600 hover:text-red-700 p-2"
-            title="Leave Meeting"
-          >
-            <fa icon="right-from-bracket" />
-          </button>
-        </div>
-      </div>
-    </div>
-
-    <!-- Meeting List -->
-    <div v-else class="space-y-4">
-      <div
-        v-for="meeting in meetings"
-        :key="meeting.groupId"
-        class="p-4 bg-white rounded-lg shadow hover:shadow-md transition-shadow cursor-pointer"
-        @click="promptPassword(meeting)"
-      >
-        <h2 class="text-xl font-medium">{{ meeting.name }}</h2>
-      </div>
-
-      <p v-if="meetings.length === 0" class="text-center text-gray-500 py-8">
-        No onboarding meetings available
-      </p>
-    </div>
-
-    <!-- Password Dialog -->
-    <div
-      v-if="showPasswordDialog"
-      class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4"
-    >
-      <div class="bg-white rounded-lg p-6 max-w-sm w-full">
-        <h3 class="text-lg font-medium mb-4">Enter Meeting Password</h3>
-        <input
-          ref="passwordInput"
-          v-model="password"
-          type="text"
-          class="w-full px-3 py-2 border rounded-md mb-4"
-          placeholder="Enter password"
-          @keyup.enter="submitPassword"
-        />
-        <div class="flex justify-end space-x-4">
-          <button
-            @click="cancelPasswordDialog"
-            class="px-4 py-2 bg-gray-200 rounded hover:bg-gray-300"
-          >
-            Cancel
-          </button>
-          <button
-            @click="submitPassword"
-            class="px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700"
-          >
-            Submit
-          </button>
-        </div>
-      </div>
-    </div>
-  </section>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-import { nextTick } from "vue";
-import { Router } from "vue-router";
-
-import QuickNav from "@/components/QuickNav.vue";
-import TopMessage from "@/components/TopMessage.vue";
-import { logConsoleAndDb, retrieveSettingsForActiveAccount } from "@/db/index";
-import {
-  errorStringForLog,
-  getHeaders,
-  serverMessageForUser,
-} from "@/libs/endorserServer";
-import { encryptMessage } from "@/libs/crypto";
-
-interface Meeting {
-  name: string;
-  groupId: number;
-}
-
-@Component({
-  components: {
-    QuickNav,
-    TopMessage,
-  },
-})
-export default class OnboardMeetingListView extends Vue {
-  $notify!: (
-    notification: {
-      group: string;
-      type: string;
-      title: string;
-      text: string;
-      onYes?: () => void;
-      yesText?: string;
-    },
-    timeout?: number,
-  ) => void;
-
-  activeDid = "";
-  apiServer = "";
-  attendingMeeting: Meeting | null = null;
-  firstName = "";
-  isLoading = false;
-  isRegistered = false;
-  meetings: Meeting[] = [];
-  password = "";
-  selectedMeeting: Meeting | null = null;
-  showPasswordDialog = false;
-
-  async created() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
-    this.firstName = settings.firstName || "";
-    this.isRegistered = !!settings.isRegistered;
-    await this.fetchMeetings();
-  }
-
-  async fetchMeetings() {
-    this.isLoading = true;
-    try {
-      // get the meeting that the user is attending
-      const headers = await getHeaders(this.activeDid);
-      const response = await this.axios.get(
-        this.apiServer + "/api/partner/groupOnboardMember",
-        { headers },
-      );
-
-      if (response.data?.data) {
-        // they're in a meeting already
-        const attendingMeetingId = response.data.data.groupId;
-        // retrieve the meeting details
-        const headers2 = await getHeaders(this.activeDid);
-        const response2 = await this.axios.get(
-          this.apiServer + "/api/partner/groupOnboard/" + attendingMeetingId,
-          { headers: headers2 },
-        );
-
-        if (response2.data?.data) {
-          this.attendingMeeting = response2.data.data;
-          return;
-        } else {
-          // this should never happen
-          logConsoleAndDb(
-            "Error fetching meeting for user after saying they are in one.",
-            true,
-          );
-        }
-      }
-
-      const headers2 = await getHeaders(this.activeDid);
-      const response2 = await this.axios.get(
-        this.apiServer + "/api/partner/groupsOnboarding",
-        { headers: headers2 },
-      );
-
-      if (response2.data?.data) {
-        this.meetings = response2.data.data;
-      }
-    } catch (error) {
-      logConsoleAndDb(
-        "Error fetching meetings: " + errorStringForLog(error),
-        true,
-      );
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: serverMessageForUser(error) || "Failed to fetch meetings.",
-        },
-        5000,
-      );
-    } finally {
-      this.isLoading = false;
-    }
-  }
-
-  promptPassword(meeting: Meeting) {
-    this.password = "";
-    this.selectedMeeting = meeting;
-    this.showPasswordDialog = true;
-    nextTick(() => {
-      const input = this.$refs.passwordInput as HTMLInputElement;
-      if (input) {
-        input.focus();
-      }
-    });
-  }
-
-  cancelPasswordDialog() {
-    this.password = "";
-    this.selectedMeeting = null;
-    this.showPasswordDialog = false;
-  }
-
-  async submitPassword() {
-    if (!this.selectedMeeting) {
-      // this should never happen
-      logConsoleAndDb(
-        "No meeting selected when prompting for password, which should never happen.",
-        true,
-      );
-      return;
-    }
-
-    try {
-      // Create member data object
-      const memberData = {
-        name: this.firstName,
-        did: this.activeDid,
-        isRegistered: this.isRegistered,
-      };
-      const memberDataString = JSON.stringify(memberData);
-      const encryptedMemberData = await encryptMessage(
-        memberDataString,
-        this.password,
-      );
-
-      // Get headers for authentication
-      const headers = await getHeaders(this.activeDid);
-
-      // Encrypt the member data
-      const postResult = await this.axios.post(
-        this.apiServer + "/api/partner/groupOnboardMember",
-        {
-          groupId: this.selectedMeeting.groupId,
-          content: encryptedMemberData,
-        },
-        { headers },
-      );
-
-      if (postResult.data && postResult.data.success) {
-        // Navigate to members view with password and groupId
-        (this.$router as Router).push({
-          name: "onboard-meeting-members",
-          params: {
-            groupId: this.selectedMeeting.groupId.toString(),
-          },
-          query: {
-            password: this.password,
-            memberId: postResult.data.memberId,
-          },
-        });
-
-        this.cancelPasswordDialog();
-      } else {
-        throw { response: postResult };
-      }
-    } catch (error) {
-      logConsoleAndDb(
-        "Error joining meeting: " + errorStringForLog(error),
-        true,
-      );
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text:
-            serverMessageForUser(error) || "You failed to join the meeting.",
-        },
-        5000,
-      );
-    }
-  }
-
-  async leaveMeeting() {
-    this.$notify(
-      {
-        group: "modal",
-        type: "confirm",
-        title: "Leave Meeting",
-        text: "Are you sure you want to leave this meeting?",
-        onYes: async () => {
-          try {
-            const headers = await getHeaders(this.activeDid);
-            await this.axios.delete(
-              this.apiServer + "/api/partner/groupOnboardMember",
-              { headers },
-            );
-
-            this.attendingMeeting = null;
-            await this.fetchMeetings();
-
-            this.$notify(
-              {
-                group: "alert",
-                type: "success",
-                title: "Success",
-                text: "You left the meeting.",
-              },
-              5000,
-            );
-          } catch (error) {
-            logConsoleAndDb(
-              "Error leaving meeting: " + errorStringForLog(error),
-              true,
-            );
-            this.$notify(
-              {
-                group: "alert",
-                type: "danger",
-                title: "Error",
-                text:
-                  serverMessageForUser(error) ||
-                  "You failed to leave the meeting.",
-              },
-              5000,
-            );
-          }
-        },
-      },
-      -1,
-    );
-  }
-}
-</script>

src/views/OnboardMeetingMembersView.vue

@@ -1,216 +0,0 @@
-<template>
-  <QuickNav selected="Contacts" />
-  <TopMessage />
-
-  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Heading -->
-    <h1 id="ViewHeading" class="text-4xl text-center font-light mb-8">
-      Meeting Members
-    </h1>
-
-    <!-- Loading Animation -->
-    <div
-      class="mt-16 text-center text-4xl bg-slate-400 text-white w-14 py-2.5 rounded-full mx-auto"
-      v-if="isLoading"
-    >
-      <fa icon="spinner" class="fa-spin-pulse"></fa>
-    </div>
-
-    <!-- Error State -->
-    <div v-else-if="errorMessage">
-      <div class="text-center text-red-600 py-8">
-        {{ errorMessage }}
-      </div>
-      <div class="text-center">
-        For authorization, wait for your meeting organizer to approve you.
-      </div>
-    </div>
-
-    <!-- Members List -->
-    <MembersList v-else :password="password" @error="handleError" />
-  </section>
-
-  <UserNameDialog
-    ref="userNameDialog"
-    :callback-on-cancel="true"
-    sharing-explanation="This is encrypted and shared only with people in this meeting."
-  />
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-import { RouteLocation } from "vue-router";
-
-import QuickNav from "@/components/QuickNav.vue";
-import TopMessage from "@/components/TopMessage.vue";
-import MembersList from "@/components/MembersList.vue";
-import UserNameDialog from "@/components/UserNameDialog.vue";
-import { logConsoleAndDb, retrieveSettingsForActiveAccount } from "@/db/index";
-import { encryptMessage } from "@/libs/crypto";
-import {
-  errorStringForLog,
-  getHeaders,
-  serverMessageForUser,
-} from "@/libs/endorserServer";
-import { generateSaveAndActivateIdentity } from "@/libs/util";
-
-@Component({
-  components: {
-    QuickNav,
-    TopMessage,
-    MembersList,
-    UserNameDialog,
-  },
-})
-export default class OnboardMeetingMembersView extends Vue {
-  activeDid = "";
-  apiServer = "";
-  errorMessage = "";
-  firstName = "";
-  isRegistered = false;
-  isLoading = true;
-
-  $refs!: {
-    userNameDialog: InstanceType<typeof UserNameDialog>;
-  };
-
-  get groupId(): string {
-    return (this.$route as RouteLocation).params.groupId as string;
-  }
-
-  get password(): string {
-    return (this.$route as RouteLocation).query.password as string;
-  }
-
-  async created() {
-    if (!this.groupId) {
-      this.errorMessage = "The group info is missing. Go back and try again.";
-      return;
-    }
-    if (!this.password) {
-      this.errorMessage = "The password is missing. Go back and try again.";
-      return;
-    }
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
-    this.firstName = settings.firstName || "";
-    this.isRegistered = settings.isRegistered || false;
-    try {
-      if (!this.activeDid) {
-        this.activeDid = await generateSaveAndActivateIdentity();
-        this.isRegistered = false;
-      }
-      const headers = await getHeaders(this.activeDid);
-      const response = await this.axios.get(
-        `${this.apiServer}/api/partner/groupOnboardMember`,
-        { headers },
-      );
-      const member = response.data?.data;
-      if (!member) {
-        if (!this.firstName) {
-          this.$refs.userNameDialog.open(this.addMemberToMeeting);
-          // addMemberToMeeting sets isLoading to false
-        } else {
-          await this.addMemberToMeeting(this.firstName);
-          // addMemberToMeeting sets isLoading to false
-        }
-      } else if (String(member.groupId) !== this.groupId) {
-        this.errorMessage =
-          "You are already in a different meeting. Reload or go back and try again.";
-        this.isLoading = false;
-      } else {
-        // must be already in the right meeting
-        if (!this.firstName) {
-          this.$refs.userNameDialog.open(this.updateMemberInMeeting);
-          // updateMemberInMeeting sets isLoading to false
-        } else {
-          await this.updateMemberInMeeting(this.firstName);
-          // updateMemberInMeeting sets isLoading to false
-        }
-      }
-    } catch (error) {
-      this.errorMessage =
-        serverMessageForUser(error) ||
-        "There was an error checking for that meeting. Reload or go back and try again.";
-      logConsoleAndDb(
-        "Error checking meeting: " + errorStringForLog(error),
-        true,
-      );
-      this.isLoading = false;
-    }
-  }
-
-  async addMemberToMeeting(name?: string) {
-    if (name != null) {
-      this.firstName = name;
-    }
-
-    const memberData = {
-      name: this.firstName,
-      did: this.activeDid,
-      isRegistered: this.isRegistered,
-    };
-    const memberDataString = JSON.stringify(memberData);
-    const encryptedMemberData = await encryptMessage(
-      memberDataString,
-      this.password,
-    );
-
-    const headers = await getHeaders(this.activeDid);
-    try {
-      await this.axios.post(
-        `${this.apiServer}/api/partner/groupOnboardMember`,
-        { groupId: this.groupId, content: encryptedMemberData },
-        { headers },
-      );
-    } catch (error) {
-      logConsoleAndDb(
-        "Error adding member to meeting: " + errorStringForLog(error),
-        true,
-      );
-      this.errorMessage =
-        serverMessageForUser(error) ||
-        "You're not in a meeting and couldn't be added to this one. Reload or go back and try again.";
-    }
-    this.isLoading = false;
-  }
-
-  async updateMemberInMeeting(name?: string) {
-    if (name != null) {
-      this.firstName = name;
-    }
-    const memberData = {
-      name: this.firstName,
-      did: this.activeDid,
-      isRegistered: this.isRegistered,
-    };
-    const memberDataString = JSON.stringify(memberData);
-    const encryptedMemberData = await encryptMessage(
-      memberDataString,
-      this.password,
-    );
-    const headers = await getHeaders(this.activeDid);
-    try {
-      await this.axios.put(
-        `${this.apiServer}/api/partner/groupOnboardMember`,
-        { content: encryptedMemberData },
-        { headers },
-      );
-    } catch (error) {
-      logConsoleAndDb(
-        "Error updating member in meeting: " + errorStringForLog(error),
-        true,
-      );
-      this.errorMessage =
-        serverMessageForUser(error) ||
-        "There was an error updating your name. Reload or go back and try again.";
-    }
-    this.isLoading = false;
-  }
-
-  handleError(message: string) {
-    this.errorMessage = message;
-  }
-}
-</script>

src/views/OnboardMeetingSetupView.vue

@@ -1,673 +0,0 @@
-<template>
-  <QuickNav selected="Contacts" />
-  <TopMessage />
-
-  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Heading -->
-    <h1 id="ViewHeading" class="text-4xl text-center font-light">
-      Onboarding Meeting
-    </h1>
-
-    <!-- Existing Meeting Section -->
-    <div
-      v-if="!isLoading && currentMeeting != null && !isInEditOrCreateMode()"
-      class="mt-8 p-4 border rounded-lg bg-white shadow"
-    >
-      <div class="flex items-center justify-between mb-4">
-        <div class="flex items-center">
-          <h2 class="text-2xl">Current Meeting</h2>
-          <button
-            @click="startEditing"
-            class="mb-4 text-blue-600 hover:text-blue-800 transition-colors duration-200 ml-2"
-            title="Edit Meeting"
-          >
-            <fa icon="pen" class="fa-fw" />
-            <span class="sr-only">{{
-              isInCreateMode() ? "Create Meeting" : "Edit Meeting"
-            }}</span>
-          </button>
-        </div>
-        <button
-          @click="confirmDelete"
-          class="text-red-600 hover:text-red-800 transition-colors duration-200"
-          :disabled="isDeleting"
-          :class="{ 'opacity-50 cursor-not-allowed': isDeleting }"
-          title="Delete Meeting"
-        >
-          <fa icon="trash-can" class="fa-fw" />
-          <span class="sr-only">{{
-            isDeleting ? "Deleting..." : "Delete Meeting"
-          }}</span>
-        </button>
-      </div>
-      <div class="space-y-2">
-        <p><strong>Name:</strong> {{ currentMeeting.name }}</p>
-        <p>
-          <strong>Expires:</strong>
-          {{ formatExpirationTime(currentMeeting.expiresAt) }}
-        </p>
-
-        <div v-if="currentMeeting.password" class="mt-4">
-          <p class="text-gray-600">
-            Share the password with the people you want to onboard.
-          </p>
-        </div>
-        <div v-else class="text-red-600">
-          Your copy of the password is not saved. Edit the meeting, or delete it
-          and create a new meeting.
-        </div>
-      </div>
-    </div>
-
-    <!-- Delete Confirmation Dialog -->
-    <div
-      v-if="showDeleteConfirm"
-      class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4"
-    >
-      <div class="bg-white rounded-lg p-6 max-w-sm w-full">
-        <h3 class="text-lg font-medium mb-4">Delete Meeting?</h3>
-        <p class="text-gray-600 mb-6">
-          This action cannot be undone. Are you sure you want to delete this
-          meeting?
-        </p>
-        <div class="flex justify-between space-x-4">
-          <button
-            @click="showDeleteConfirm = false"
-            class="px-4 py-2 bg-slate-500 text-white rounded hover:bg-slate-700"
-          >
-            Cancel
-          </button>
-          <button
-            @click="deleteMeeting"
-            class="px-4 py-2 bg-red-600 text-white rounded hover:bg-red-700"
-          >
-            Delete
-          </button>
-        </div>
-      </div>
-    </div>
-
-    <!-- Create/Edit Meeting Form -->
-    <div
-      v-if="
-        !isLoading &&
-        isInEditOrCreateMode() &&
-        newOrUpdatedMeeting != null /* duplicate check is for typechecks */
-      "
-      class="mt-8"
-    >
-      <h2 class="text-2xl mb-4">
-        {{ isInCreateMode() ? "Create New Meeting" : "Edit Meeting" }}
-      </h2>
-      <!-- This is my first form. Not sure if I like it; will see if the browser benefits extend to the native app. -->
-      <form
-        @submit.prevent="isInCreateMode() ? createMeeting() : updateMeeting()"
-        class="space-y-4"
-      >
-        <div>
-          <label
-            for="meetingName"
-            class="block text-sm font-medium text-gray-700"
-            >Meeting Name</label
-          >
-          <input
-            id="meetingName"
-            v-model="newOrUpdatedMeeting.name"
-            type="text"
-            required
-            class="mt-1 block w-full rounded-md border border-gray-300 px-3 py-2 shadow-sm focus:border-blue-500 focus:outline-none"
-            placeholder="Enter meeting name"
-          />
-        </div>
-
-        <div>
-          <label
-            for="expirationTime"
-            class="block text-sm font-medium text-gray-700"
-            >Meeting Expiration Time</label
-          >
-          <input
-            id="expirationTime"
-            v-model="newOrUpdatedMeeting.expiresAt"
-            type="datetime-local"
-            required
-            :min="minDateTime"
-            class="mt-1 block w-full rounded-md border border-gray-300 px-3 py-2 shadow-sm focus:border-blue-500 focus:outline-none"
-          />
-        </div>
-
-        <div>
-          <label for="password" class="block text-sm font-medium text-gray-700"
-            >Meeting Password</label
-          >
-          <input
-            id="password"
-            v-model="newOrUpdatedMeeting.password"
-            type="text"
-            required
-            class="mt-1 block w-full rounded-md border border-gray-300 px-3 py-2 shadow-sm focus:border-blue-500 focus:outline-none"
-            placeholder="Enter meeting password"
-          />
-        </div>
-
-        <div>
-          <label for="userName" class="block text-sm font-medium text-gray-700"
-            >Your Name</label
-          >
-          <input
-            id="userName"
-            v-model="newOrUpdatedMeeting.userFullName"
-            type="text"
-            required
-            class="mt-1 block w-full rounded-md border border-gray-300 px-3 py-2 shadow-sm focus:border-blue-500 focus:outline-none"
-            placeholder="Your name"
-          />
-        </div>
-
-        <button
-          type="submit"
-          class="w-full bg-gradient-to-b from-green-400 to-green-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-4 py-2 rounded-md hover:from-green-500 hover:to-green-800"
-          :disabled="isLoading"
-        >
-          {{
-            isLoading
-              ? isInCreateMode()
-                ? "Creating..."
-                : "Updating..."
-              : isInCreateMode()
-                ? "Create Meeting"
-                : "Update Meeting"
-          }}
-        </button>
-        <button
-          v-if="isInEditOrCreateMode()"
-          type="button"
-          @click="cancelEditing"
-          class="w-full bg-slate-500 text-white px-4 py-2 rounded-md hover:bg-slate-600"
-        >
-          Cancel
-        </button>
-      </form>
-    </div>
-
-    <!-- Members Section -->
-    <div
-      v-if="!isLoading && currentMeeting != null && !!currentMeeting.password"
-      class="mt-8 p-4 border rounded-lg bg-white shadow"
-    >
-      <div class="flex items-center justify-between mb-4">
-        <h2 class="text-2xl">Meeting Members</h2>
-      </div>
-      <router-link
-        v-if="!!currentMeeting.password"
-        :to="onboardMeetingMembersLink()"
-        class="inline-block text-blue-600"
-        target="_blank"
-      >
-        &bull; Open shortcut page for members <fa icon="external-link" />
-      </router-link>
-
-      <MembersList
-        :password="currentMeeting.password || ''"
-        :show-organizer-tools="true"
-        @error="handleMembersError"
-        class="mt-4"
-      />
-    </div>
-
-    <div v-else-if="isLoading">
-      <div class="flex justify-center items-center h-full">
-        <fa icon="spinner" class="fa-spin-pulse" />
-      </div>
-    </div>
-  </section>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-import QuickNav from "@/components/QuickNav.vue";
-import TopMessage from "@/components/TopMessage.vue";
-import MembersList from "@/components/MembersList.vue";
-import { logConsoleAndDb, retrieveSettingsForActiveAccount } from "@/db/index";
-import {
-  errorStringForLog,
-  getHeaders,
-  serverMessageForUser,
-} from "@/libs/endorserServer";
-import { encryptMessage } from "@/libs/crypto";
-
-interface ServerMeeting {
-  groupId: number; // from the server
-  name: string; // from the server
-  expiresAt: string; // from the server
-  userFullName?: string; // from the user's session
-  password?: string; // from the user's session
-}
-
-interface MeetingSetupInfo {
-  name: string;
-  expiresAt: string;
-  userFullName: string;
-  password: string;
-}
-
-@Component({
-  components: {
-    QuickNav,
-    TopMessage,
-    MembersList,
-  },
-})
-export default class OnboardMeetingView extends Vue {
-  $notify!: (
-    notification: { group: string; type: string; title: string; text: string },
-    timeout?: number,
-  ) => void;
-
-  currentMeeting: ServerMeeting | null = null;
-  newOrUpdatedMeeting: MeetingSetupInfo | null = null;
-  activeDid = "";
-  apiServer = "";
-  isDeleting = false;
-  isLoading = true;
-  isRegistered = false;
-  showDeleteConfirm = false;
-  fullName = "";
-  get minDateTime() {
-    const now = new Date();
-    now.setMinutes(now.getMinutes() + 5); // Set minimum 5 minutes in the future
-    return this.formatDateForInput(now);
-  }
-
-  async created() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.apiServer = settings.apiServer || "";
-    this.fullName = settings.firstName || "";
-    this.isRegistered = !!settings.isRegistered;
-
-    await this.fetchCurrentMeeting();
-    this.isLoading = false;
-  }
-
-  isInCreateMode(): boolean {
-    return this.newOrUpdatedMeeting != null && this.currentMeeting == null;
-  }
-
-  isInEditOrCreateMode(): boolean {
-    return this.newOrUpdatedMeeting != null;
-  }
-
-  getDefaultExpirationTime(): string {
-    const date = new Date();
-    // Round up to the next hour
-    date.setMinutes(0);
-    date.setSeconds(0);
-    date.setMilliseconds(0);
-    date.setHours(date.getHours() + 1); // Round up to next hour
-    date.setHours(date.getHours() + 2); // Add 2 more hours
-    return this.formatDateForInput(date);
-  }
-
-  // Format a date object to YYYY-MM-DDTHH:mm format for datetime-local input
-  private formatDateForInput(date: Date): string {
-    const year = date.getFullYear();
-    const month = String(date.getMonth() + 1).padStart(2, "0");
-    const day = String(date.getDate()).padStart(2, "0");
-    const hours = String(date.getHours()).padStart(2, "0");
-    const minutes = String(date.getMinutes()).padStart(2, "0");
-
-    return `${year}-${month}-${day}T${hours}:${minutes}`;
-  }
-
-  blankMeeting(): MeetingSetupInfo {
-    return {
-      // no groupId yet
-      name: "",
-      expiresAt: this.getDefaultExpirationTime(),
-      userFullName: this.fullName,
-      password: (this.currentMeeting?.password as string) || "",
-    };
-  }
-
-  async fetchCurrentMeeting() {
-    try {
-      const headers = await getHeaders(this.activeDid);
-      const response = await this.axios.get(
-        this.apiServer + "/api/partner/groupOnboard",
-        { headers },
-      );
-
-      if (response?.data?.data) {
-        this.currentMeeting = {
-          ...response.data.data,
-          userFullName: this.fullName,
-          password: this.currentMeeting?.password || "",
-        };
-      } else {
-        // no meeting found
-        this.newOrUpdatedMeeting = this.blankMeeting();
-      }
-    } catch (error) {
-      // no meeting found
-      this.newOrUpdatedMeeting = this.blankMeeting();
-    }
-  }
-
-  async createMeeting() {
-    this.isLoading = true;
-
-    try {
-      if (!this.newOrUpdatedMeeting) {
-        throw Error(
-          "There was no meeting data to create. We should never get here.",
-        );
-      }
-
-      // Convert local time to UTC for comparison and server submission
-      const localExpiresAt = new Date(this.newOrUpdatedMeeting.expiresAt);
-      const now = new Date();
-      if (localExpiresAt <= now) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "warning",
-            title: "Invalid Time",
-            text: "Select a future time for the meeting expiration.",
-          },
-          5000,
-        );
-        return;
-      }
-      if (!this.newOrUpdatedMeeting.userFullName) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "warning",
-            title: "Invalid Name",
-            text: "Please enter your name.",
-          },
-          5000,
-        );
-        return;
-      }
-      if (!this.newOrUpdatedMeeting.password) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "warning",
-            title: "Invalid Password",
-            text: "Please enter a password.",
-          },
-          5000,
-        );
-        return;
-      }
-
-      // create content with user's name and DID encrypted with password
-      const content = {
-        name: this.newOrUpdatedMeeting.userFullName,
-        did: this.activeDid,
-        isRegistered: this.isRegistered,
-      };
-      const encryptedContent = await encryptMessage(
-        JSON.stringify(content),
-        this.newOrUpdatedMeeting.password,
-      );
-
-      const headers = await getHeaders(this.activeDid);
-      const response = await this.axios.post(
-        this.apiServer + "/api/partner/groupOnboard",
-        {
-          name: this.newOrUpdatedMeeting.name,
-          expiresAt: localExpiresAt.toISOString(),
-          content: encryptedContent,
-        },
-        { headers },
-      );
-
-      if (response.data && response.data.success) {
-        this.currentMeeting = {
-          ...this.newOrUpdatedMeeting,
-          groupId: response.data.success.groupId,
-        };
-
-        this.newOrUpdatedMeeting = null;
-        this.$notify(
-          {
-            group: "alert",
-            type: "success",
-            title: "Success",
-            text: "Meeting created.",
-          },
-          3000,
-        );
-      } else {
-        throw { response: response };
-      }
-    } catch (error) {
-      logConsoleAndDb(
-        "Error creating meeting: " + errorStringForLog(error),
-        true,
-      );
-      const errorMessage = serverMessageForUser(error);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text:
-            errorMessage ||
-            "Failed to create meeting. Try reloading or submitting again.",
-        },
-        5000,
-      );
-    } finally {
-      this.isLoading = false;
-    }
-  }
-
-  formatExpirationTime(expiresAt: string): string {
-    const expiration = new Date(expiresAt); // Server time is in UTC
-    const now = new Date();
-    const diffHours = Math.round(
-      (expiration.getTime() - now.getTime()) / (1000 * 60 * 60),
-    );
-
-    if (diffHours < 0) {
-      return "Expired";
-    } else if (diffHours < 1) {
-      return "Less than an hour";
-    } else if (diffHours === 1) {
-      return "1 hour";
-    } else {
-      return `${diffHours} hours`;
-    }
-  }
-
-  confirmDelete() {
-    this.showDeleteConfirm = true;
-  }
-
-  async deleteMeeting() {
-    this.isDeleting = true;
-    try {
-      const headers = await getHeaders(this.activeDid);
-      await this.axios.delete(this.apiServer + "/api/partner/groupOnboard", {
-        headers,
-      });
-
-      this.currentMeeting = null;
-      this.newOrUpdatedMeeting = this.blankMeeting();
-      this.showDeleteConfirm = false;
-
-      this.$notify(
-        {
-          group: "alert",
-          type: "success",
-          title: "Success",
-          text: "Meeting deleted successfully.",
-        },
-        3000,
-      );
-    } catch (error) {
-      console.error("Error deleting meeting:", error);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: serverMessageForUser(error) || "Failed to delete meeting.",
-        },
-        5000,
-      );
-    } finally {
-      this.isDeleting = false;
-    }
-  }
-
-  startEditing() {
-    // Populate form with existing meeting data
-    if (this.currentMeeting) {
-      const localExpiresAt = new Date(this.currentMeeting.expiresAt);
-      this.newOrUpdatedMeeting = {
-        name: this.currentMeeting.name,
-        expiresAt: this.formatDateForInput(localExpiresAt),
-        userFullName: this.currentMeeting.userFullName || "",
-        password: this.currentMeeting.password || "",
-      };
-    } else {
-      console.error(
-        "There is no current meeting to edit. We should never get here.",
-      );
-    }
-  }
-
-  cancelEditing() {
-    // Reset form data
-    this.newOrUpdatedMeeting = null;
-  }
-
-  async updateMeeting() {
-    this.isLoading = true;
-    if (!this.newOrUpdatedMeeting) {
-      throw Error("There was no meeting data to update.");
-    }
-
-    try {
-      // Convert local time to UTC for comparison and server submission
-      const localExpiresAt = new Date(this.newOrUpdatedMeeting.expiresAt);
-      const now = new Date();
-      if (localExpiresAt <= now) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "warning",
-            title: "Invalid Time",
-            text: "Select a future time for the meeting expiration.",
-          },
-          5000,
-        );
-        return;
-      }
-      if (!this.newOrUpdatedMeeting.userFullName) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "warning",
-            title: "Invalid Name",
-            text: "Please enter your name.",
-          },
-          5000,
-        );
-        return;
-      }
-      if (!this.newOrUpdatedMeeting.password) {
-        this.$notify(
-          {
-            group: "alert",
-            type: "warning",
-            title: "Invalid Password",
-            text: "Please enter a password.",
-          },
-          5000,
-        );
-        return;
-      }
-      // create content with user's name and DID encrypted with password
-      const content = {
-        name: this.newOrUpdatedMeeting.userFullName,
-        did: this.activeDid,
-        isRegistered: this.isRegistered,
-      };
-      const encryptedContent = await encryptMessage(
-        JSON.stringify(content),
-        this.newOrUpdatedMeeting.password,
-      );
-
-      const headers = await getHeaders(this.activeDid);
-      const response = await this.axios.put(
-        this.apiServer + "/api/partner/groupOnboard",
-        {
-          // the groupId is in the currentMeeting but it's not necessary while users only have one meeting
-          name: this.newOrUpdatedMeeting.name,
-          expiresAt: localExpiresAt.toISOString(),
-          content: encryptedContent,
-        },
-        { headers },
-      );
-
-      if (response.data && response.data.success) {
-        // Update the current meeting with only the necessary fields
-        this.currentMeeting = {
-          ...this.newOrUpdatedMeeting,
-          groupId: (this.currentMeeting?.groupId as number) || -1,
-        };
-        this.newOrUpdatedMeeting = null;
-      } else {
-        throw { response: response };
-      }
-    } catch (error) {
-      logConsoleAndDb(
-        "Error updating meeting: " + errorStringForLog(error),
-        true,
-      );
-      const errorMessage = serverMessageForUser(error);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text:
-            errorMessage ||
-            "Failed to update meeting. Try reloading or submitting again.",
-        },
-        5000,
-      );
-    } finally {
-      this.isLoading = false;
-    }
-  }
-
-  onboardMeetingMembersLink(): string {
-    if (this.currentMeeting) {
-      return `/onboard-meeting-members/${this.currentMeeting?.groupId}?password=${encodeURIComponent(
-        this.currentMeeting?.password || "",
-      )}`;
-    }
-    return "";
-  }
-
-  handleMembersError(message: string) {
-    this.$notify(
-      {
-        group: "alert",
-        type: "danger",
-        title: "Error",
-        text: message,
-      },
-      5000,
-    );
-  }
-}
-</script>

src/views/ProjectsView.vue

@@ -4,11 +4,7 @@
 
   <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Heading -->
-    <h1 id="ViewHeading" class="text-4xl text-center font-light">
-      Your Project Ideas
-    </h1>
-
-    <OnboardingDialog ref="onboardingDialog" />
+    <h1 id="ViewHeading" class="text-4xl text-center font-light">Your Ideas</h1>
 
     <!-- Result Tabs -->
     <div class="text-center text-slate-500 border-b border-slate-300 mt-8">
@@ -65,7 +61,7 @@
     <!-- New Project -->
     <button
       v-if="isRegistered && showProjects"
-      class="fixed right-6 top-24 text-center text-4xl leading-none bg-green-600 text-white w-14 py-2.5 rounded-full"
+      class="fixed right-6 top-24 text-center text-4xl leading-none bg-blue-600 text-white w-14 py-2.5 rounded-full"
       @click="onClickNewProject()"
     >
       <fa icon="plus" class="fa-fw"></fa>
@@ -154,10 +150,7 @@
                       <span
                         v-if="offer.amountGivenConfirmed >= offer.amountGiven"
                       >
-                        <!--
-                         There's no need for a green icon:
-                         it's unnecessary if there's already a green, and confusing if there's a yellow.
-                        -->
+                        <!-- no need for green icon; unnecessary if there's already a green, confusing if there's a yellow -->
                         all
                       </span>
                       <span v-else>
@@ -211,19 +204,10 @@
           Hit the big
           <fa
             icon="plus"
-            class="bg-green-600 text-white px-1.5 py-1 rounded-full"
+            class="bg-blue-600 text-white px-1 py-1 rounded-full"
           />
           button. You'll never know until you try.
         </div>
-        <div v-else>
-          <button
-            @click="showNameThenIdDialog()"
-            class="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"
-          >
-            Get someone to onboard you.
-          </button>
-          <UserNameDialog ref="userNameDialog" />
-        </div>
       </div>
       <ul id="listProjects" class="border-t border-slate-300">
         <li
@@ -263,15 +247,13 @@ import { Component, Vue } from "vue-facing-decorator";
 import { Router } from "vue-router";
 
 import { NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
-import EntityIcon from "@/components/EntityIcon.vue";
+import { accountsDB, db } from "@/db/index";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
+import * as libsUtil from "@/libs/util";
 import InfiniteScroll from "@/components/InfiniteScroll.vue";
 import QuickNav from "@/components/QuickNav.vue";
-import OnboardingDialog from "@/components/OnboardingDialog.vue";
 import ProjectIcon from "@/components/ProjectIcon.vue";
 import TopMessage from "@/components/TopMessage.vue";
-import UserNameDialog from "@/components/UserNameDialog.vue";
-import { Contact } from "@/db/tables/contacts";
 import {
   didInfo,
   getHeaders,
@@ -279,19 +261,11 @@ import {
   OfferSummaryRecord,
   PlanData,
 } from "@/libs/endorserServer";
-import * as libsUtil from "@/libs/util";
-import { OnboardPage } from "@/libs/util";
+import EntityIcon from "@/components/EntityIcon.vue";
+import { Contact } from "@/db/tables/contacts";
 
 @Component({
-  components: {
-    EntityIcon,
-    InfiniteScroll,
-    QuickNav,
-    OnboardingDialog,
-    ProjectIcon,
-    TopMessage,
-    UserNameDialog,
-  },
+  components: { EntityIcon, InfiniteScroll, QuickNav, ProjectIcon, TopMessage },
 })
 export default class ProjectsView extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
@@ -306,41 +280,36 @@ export default class ProjectsView extends Vue {
   allContacts: Array<Contact> = [];
   allMyDids: Array<string> = [];
   apiServer = "";
-  givenName = "";
+  projects: PlanData[] = [];
   isLoading = false;
   isRegistered = false;
   offers: OfferSummaryRecord[] = [];
   projectNameFromHandleId: Record<string, string> = {}; // mapping from handleId to description
-  projects: PlanData[] = [];
-  showOffers = false;
-  showProjects = true;
+  showOffers = true;
+  showProjects = false;
 
   libsUtil = libsUtil;
   didInfo = didInfo;
 
   async mounted() {
     try {
-      const settings = await retrieveSettingsForActiveAccount();
-      this.activeDid = settings.activeDid || "";
-      this.apiServer = settings.apiServer || "";
-      this.isRegistered = !!settings.isRegistered;
-      this.givenName = settings.firstName || "";
+      await db.open();
+      const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+      this.activeDid = (settings?.activeDid as string) || "";
+      this.apiServer = (settings?.apiServer as string) || "";
+      this.isRegistered = !!settings?.isRegistered;
 
       this.allContacts = await db.contacts.toArray();
 
-      this.allMyDids = await libsUtil.retrieveAccountDids();
+      await accountsDB.open();
+      const allAccounts = await accountsDB.accounts.toArray();
+      this.allMyDids = allAccounts.map((acc) => acc.did);
 
-      if (!settings.finishedOnboarding) {
-        (this.$refs.onboardingDialog as OnboardingDialog).open(
-          OnboardPage.Create,
-        );
-      }
-
-      if (this.allMyDids.length === 0) {
+      if (allAccounts.length === 0) {
         console.error("No accounts found.");
         this.errNote("You need an identifier to load your projects.");
       } else {
-        await this.loadProjects();
+        await this.loadOffers();
       }
     } catch (err) {
       console.error("Error initializing:", err);
@@ -355,20 +324,20 @@ export default class ProjectsView extends Vue {
    **/
   async projectDataLoader(url: string) {
     try {
-      const headers = await getHeaders(this.activeDid, this.$notify);
+      const headers = await getHeaders(this.activeDid);
       this.isLoading = true;
       const resp = await this.axios.get(url, { headers } as AxiosRequestConfig);
       if (resp.status === 200 && resp.data.data) {
         const plans: PlanData[] = resp.data.data;
         for (const plan of plans) {
-          const { name, description, handleId, image, issuerDid, rowId } = plan;
+          const { name, description, handleId, image, issuerDid, rowid } = plan;
           this.projects.push({
             name,
             description,
             image,
             handleId,
             issuerDid,
-            rowId,
+            rowid,
           });
         }
       } else {
@@ -395,7 +364,7 @@ export default class ProjectsView extends Vue {
   async loadMoreProjectData(payload: boolean) {
     if (this.projects.length > 0 && payload) {
       const latestProject = this.projects[this.projects.length - 1];
-      await this.loadProjects(`beforeId=${latestProject.rowId}`);
+      await this.loadProjects(`beforeId=${latestProject.rowid}`);
     }
   }
 
@@ -414,6 +383,7 @@ export default class ProjectsView extends Vue {
    * @param id of the project
    **/
   onClickLoadProject(id: string) {
+    localStorage.setItem("projectId", id);
     const route = {
       path: "/project/" + encodeURIComponent(id),
     };
@@ -424,6 +394,7 @@ export default class ProjectsView extends Vue {
    * Handling clicking on the new project button
    **/
   onClickNewProject(): void {
+    localStorage.removeItem("projectId");
     const route = {
       name: "new-edit-project",
     };
@@ -459,8 +430,18 @@ export default class ProjectsView extends Vue {
               this.activeDid,
             );
             const projectName = project?.name as string;
+            console.log(
+              "now have name for",
+              offer.fulfillsPlanHandleId,
+              projectName,
+            );
             this.projectNameFromHandleId[offer.fulfillsPlanHandleId] =
               projectName;
+            console.log(
+              "now have a real name for",
+              offer.fulfillsPlanHandleId,
+              this.projectNameFromHandleId[offer.fulfillsPlanHandleId],
+            );
           }
           this.offers = this.offers.concat([offer]);
         }
@@ -475,9 +456,9 @@ export default class ProjectsView extends Vue {
             group: "alert",
             type: "danger",
             title: "Error",
-            text: "Failed to get offers from the server.",
+            text: "Failed to get offers from the server. Try again later.",
           },
-          5000,
+          -1,
         );
       }
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -490,7 +471,7 @@ export default class ProjectsView extends Vue {
           title: "Error",
           text: "Got an error loading offers.",
         },
-        5000,
+        -1,
       );
     } finally {
       this.isLoading = false;
@@ -518,37 +499,6 @@ export default class ProjectsView extends Vue {
     await this.offerDataLoader(url);
   }
 
-  showNameThenIdDialog() {
-    if (!this.givenName) {
-      (this.$refs.userNameDialog as UserNameDialog).open(() => {
-        this.promptForShareMethod();
-      });
-    } else {
-      this.promptForShareMethod();
-    }
-  }
-
-  promptForShareMethod() {
-    this.$notify(
-      {
-        group: "modal",
-        type: "confirm",
-        title: "Are you nearby with cameras?",
-        text: "If so, we'll use those with QR codes to share.",
-        onCancel: async () => {},
-        onNo: async () => {
-          (this.$router as Router).push({ name: "share-my-contact-info" });
-        },
-        onYes: async () => {
-          (this.$router as Router).push({ name: "contact-qr" });
-        },
-        noText: "we will share another way",
-        yesText: "we are nearby with cameras",
-      },
-      -1,
-    );
-  }
-
   public computedOfferTabClassNames() {
     return {
       "inline-block": true,

src/views/QuickActionBvcBeginView.vue

@@ -67,13 +67,12 @@
 <script lang="ts">
 import axios from "axios";
 import { DateTime } from "luxon";
-import { Router } from "vue-router";
 import { Component, Vue } from "vue-facing-decorator";
 
 import QuickNav from "@/components/QuickNav.vue";
 import TopMessage from "@/components/TopMessage.vue";
 import { NotificationIface } from "@/constants/app";
-import { retrieveSettingsForActiveAccount } from "@/db/index";
+import { db } from "@/db/index";
 import {
   BVC_MEETUPS_PROJECT_CLAIM_ID,
   bvcMeetingJoinClaim,
@@ -81,6 +80,7 @@ import {
   createAndSubmitGive,
 } from "@/libs/endorserServer";
 import * as libsUtil from "@/libs/util";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
 
 @Component({
   components: {
@@ -117,9 +117,10 @@ export default class QuickActionBvcBeginView extends Vue {
   }
 
   async record() {
-    const settings = await retrieveSettingsForActiveAccount();
-    const activeDid = settings.activeDid || "";
-    const apiServer = settings.apiServer || "";
+    await db.open();
+    const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+    const activeDid = settings?.activeDid || "";
+    const apiServer = settings?.apiServer || "";
 
     try {
       const hoursNum = libsUtil.numberOrZero(this.hoursStr);
@@ -201,7 +202,6 @@ export default class QuickActionBvcBeginView extends Vue {
           },
           3000,
         );
-        (this.$router as Router).push({ path: "/quick-action-bvc" });
       }
 
       // eslint-disable-next-line @typescript-eslint/no-explicit-any

src/views/QuickActionBvcEndView.vue

@@ -22,7 +22,7 @@
     <div>
       <h2 class="text-2xl m-2">Confirm</h2>
       <div v-if="loadingConfirms" class="flex justify-center">
-        <fa icon="spinner" class="fa-spin-pulse" />
+        <fa icon="spinner" class="animate-spin" />
       </div>
       <div v-else-if="claimsToConfirm.length === 0">
         There are no claims yet today for you to confirm.
@@ -97,7 +97,7 @@
       <h2 class="text-2xl m-2">Anything else?</h2>
       <div class="m-2 flex">
         <input type="checkbox" v-model="someoneGave" class="h-6 w-6" />
-        <span class="pb-2 pl-2 pr-2">The group provided</span>
+        <span class="pb-2 pl-2 pr-2">Someone else gave</span>
         <span v-if="someoneGave">
           <input
             type="text"
@@ -106,8 +106,7 @@
             class="border border-slate-400 h-6 px-2"
           />
           <br />
-          (Everyone likes personalized messages! 😁 ... and for a pic:
-          <input type="checkbox" v-model="supplyGiftDetails" />)
+          (Everyone likes personalized messages! 😁)
         </span>
         <!-- This is to match input height to avoid shifting when hiding & showing. -->
         <span v-else class="h-6">...</span>
@@ -145,12 +144,9 @@ import { Router } from "vue-router";
 import QuickNav from "@/components/QuickNav.vue";
 import TopMessage from "@/components/TopMessage.vue";
 import { NotificationIface } from "@/constants/app";
-import {
-  accountsDBPromise,
-  db,
-  retrieveSettingsForActiveAccount,
-} from "@/db/index";
+import { accountsDB, db } from "@/db/index";
 import { Contact } from "@/db/tables/contacts";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
 import {
   BVC_MEETUPS_PROJECT_CLAIM_ID,
   claimSpecialDescription,
@@ -184,16 +180,17 @@ export default class QuickActionBvcBeginView extends Vue {
   description = "breakfast";
   loadingConfirms = true;
   someoneGave = false;
-  supplyGiftDetails = false;
 
   async created() {
-    this.loadingConfirms = true;
-
-    const settings = await retrieveSettingsForActiveAccount();
-    this.apiServer = settings.apiServer || "";
-    this.activeDid = settings.activeDid || "";
+    await db.open();
+    const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+    this.apiServer = settings?.apiServer || "";
+    this.activeDid = settings?.activeDid || "";
     this.allContacts = await db.contacts.toArray();
+  }
 
+  async mounted() {
+    this.loadingConfirms = true;
     let currentOrPreviousSat = DateTime.now().setZone("America/Denver");
     if (currentOrPreviousSat.weekday < 6) {
       // it's not Saturday or Sunday,
@@ -211,7 +208,6 @@ export default class QuickActionBvcBeginView extends Vue {
         suppressMilliseconds: true,
       }) || "";
 
-    const accountsDB = await accountsDBPromise;
     await accountsDB.open();
     const allAccounts = await accountsDB.accounts.toArray();
     this.allMyDids = allAccounts.map((acc) => acc.did);
@@ -269,9 +265,7 @@ export default class QuickActionBvcBeginView extends Vue {
 
   async record() {
     try {
-      if (this.claimsToConfirmSelected.length > 0) {
-        this.$notify({ group: "alert", type: "toast", title: "Sent..." }, 1000);
-      }
+      this.$notify({ group: "alert", type: "toast", title: "Sent..." }, 1000);
 
       // in parallel, make a confirmation for each selected claim and send them all to the server
       const confirmResults = await Promise.allSettled(
@@ -313,7 +307,7 @@ export default class QuickActionBvcBeginView extends Vue {
 
       // now send the give for the description
       let giveSucceeded = false;
-      if (this.someoneGave && !this.supplyGiftDetails) {
+      if (this.someoneGave) {
         const giveResult = await createAndSubmitGive(
           axios,
           this.apiServer,
@@ -323,10 +317,6 @@ export default class QuickActionBvcBeginView extends Vue {
           this.description,
           undefined,
           undefined,
-          undefined,
-          undefined,
-          false,
-          undefined,
           BVC_MEETUPS_PROJECT_CLAIM_ID,
         );
         giveSucceeded = giveResult.type === "success";
@@ -345,60 +335,29 @@ export default class QuickActionBvcBeginView extends Vue {
           );
         }
       }
-      if (this.someoneGave && this.supplyGiftDetails) {
-        // we'll give a success message for the confirmations and go to the gifted details page
-        if (confirmsSucceeded.length > 0) {
-          const actions =
-            confirmsSucceeded.length === 1
-              ? `Your confirmation has been recorded.`
-              : `Your confirmations have been recorded.`;
-          this.$notify(
-            {
-              group: "alert",
-              type: "success",
-              title: "Success",
-              text: actions,
-            },
-            3000,
-          );
-        }
-        (this.$router as Router).push({
-          name: "gifted-details",
-          query: {
-            description: this.description,
-            destinationPathAfter: "/",
-            providerProjectId: BVC_MEETUPS_PROJECT_CLAIM_ID,
-            recipientDid: this.activeDid,
+
+      if (confirmsSucceeded.length > 0 || giveSucceeded) {
+        const confirms =
+          confirmsSucceeded.length === 1 ? "confirmation" : "confirmations";
+        const actions =
+          confirmsSucceeded.length > 0 && giveSucceeded
+            ? `Your ${confirms} and that give have been recorded.`
+            : giveSucceeded
+              ? "That give has been recorded."
+              : "Your " +
+                confirms +
+                " " +
+                (confirmsSucceeded.length === 1 ? "has" : "have") +
+                " been recorded.";
+        this.$notify(
+          {
+            group: "alert",
+            type: "success",
+            title: "Success",
+            text: actions,
           },
-        });
-      } else {
-        // just go ahead and print a message for all the activity
-        if (confirmsSucceeded.length > 0 || giveSucceeded) {
-          const confirms =
-            confirmsSucceeded.length === 1 ? "confirmation" : "confirmations";
-          const actions =
-            confirmsSucceeded.length > 0 && giveSucceeded
-              ? `Your ${confirms} and that give have been recorded.`
-              : giveSucceeded
-                ? "That give has been recorded."
-                : "Your " +
-                  confirms +
-                  " " +
-                  (confirmsSucceeded.length === 1 ? "has" : "have") +
-                  " been recorded.";
-          this.$notify(
-            {
-              group: "alert",
-              type: "success",
-              title: "Success",
-              text: actions,
-            },
-            3000,
-          );
-          (this.$router as Router).push({ path: "/" });
-        } else {
-          // errors should have already shown
-        }
+          3000,
+        );
       }
 
       // eslint-disable-next-line @typescript-eslint/no-explicit-any

src/views/RecentOffersToUserProjectsView.vue

@@ -1,166 +0,0 @@
-<template>
-  <QuickNav selected="Home"></QuickNav>
-  <!-- CONTENT -->
-  <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">
-        <!-- Back -->
-        <fa
-          icon="chevron-left"
-          @click="$router.back()"
-          class="fa-fw text-lg text-center px-2 py-1 absolute -left-2 -top-1"
-        />
-        Offers to Your Projects
-      </h1>
-    </div>
-
-    <div v-if="newOffersToUserProjects.length === 0">
-      <p>Nobody has given any offers to your projects.</p>
-      <p class="mt-2">
-        Maybe there are already some projects you can help on the
-        <router-link to="/discover" class="text-blue-500">
-          Discover page <fa icon="search" />
-        </router-link>
-      </p>
-      <p class="mt-2">
-        You can announce more of your own on
-        <router-link to="/contacts" class="text-blue-500">
-          Your Ideas page <fa icon="hand" />
-        </router-link>
-      </p>
-    </div>
-
-    <InfiniteScroll @reached-bottom="loadMoreOffersToUserProjects">
-      <ul
-        data-testId="listRecentOffersToUserProjects"
-        class="border-t border-slate-300"
-      >
-        <li
-          v-for="offer in newOffersToUserProjects"
-          :key="offer.jwtId"
-          class="mt-4 relative group"
-        >
-          <div
-            class="border-b border-slate-300 text-orange-400 pb-2 mb-2 font-bold text-sm"
-            v-if="offer.jwtId == lastAckedOfferToUserProjectsJwtId"
-          >
-            You've already seen all the following
-          </div>
-
-          <span>{{
-            didInfo(offer.offeredByDid, activeDid, allMyDids, allContacts)
-          }}</span>
-          offered
-          <span v-if="offer.objectDescription">{{
-            offer.objectDescription
-          }}</span
-          >{{ offer.objectDescription && offer.amount ? ", and " : "" }}
-          <span v-if="offer.amount">{{
-            displayAmount(offer.unit, offer.amount)
-          }}</span>
-          to
-          <span>{{ offer.planName }}</span>
-          <router-link
-            :to="{ path: '/claim/' + encodeURIComponent(offer.jwtId) }"
-            class="text-blue-500"
-          >
-            <fa icon="file-lines" class="pl-2 text-blue-500 cursor-pointer" />
-          </router-link>
-        </li>
-      </ul>
-    </InfiniteScroll>
-  </section>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-
-import EntityIcon from "@/components/EntityIcon.vue";
-import GiftedDialog from "@/components/GiftedDialog.vue";
-import InfiniteScroll from "@/components/InfiniteScroll.vue";
-import QuickNav from "@/components/QuickNav.vue";
-import { NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
-import { Contact } from "@/db/tables/contacts";
-import {
-  didInfo,
-  displayAmount,
-  getNewOffersToUserProjects,
-  OfferToPlanSummaryRecord,
-} from "@/libs/endorserServer";
-import { retrieveAccountDids } from "@/libs/util";
-
-@Component({
-  components: { EntityIcon, GiftedDialog, InfiniteScroll, QuickNav },
-})
-export default class RecentOffersToUserView extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  activeDid = "";
-  allContacts: Array<Contact> = [];
-  allMyDids: string[] = [];
-  apiServer = "";
-  lastAckedOfferToUserProjectsJwtId = "";
-  newOffersToUserProjects: Array<OfferToPlanSummaryRecord> = [];
-  newOffersToUserProjectsAtEnd = false;
-
-  showOffersDetails = false;
-  showOffersToUserProjectsDetails = false;
-  didInfo = didInfo;
-  displayAmount = displayAmount;
-
-  async created() {
-    try {
-      const settings = await retrieveSettingsForActiveAccount();
-      this.apiServer = settings.apiServer || "";
-      this.activeDid = settings.activeDid || "";
-      this.lastAckedOfferToUserProjectsJwtId =
-        settings.lastAckedOfferToUserProjectsJwtId || "";
-
-      this.allContacts = await db.contacts.toArray();
-
-      this.allMyDids = await retrieveAccountDids();
-
-      const offersToUserProjectsData = await getNewOffersToUserProjects(
-        this.axios,
-        this.apiServer,
-        this.activeDid,
-        undefined,
-        undefined,
-      );
-      this.newOffersToUserProjects = offersToUserProjectsData.data;
-      this.newOffersToUserProjectsAtEnd = !offersToUserProjectsData.hitLimit;
-
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    } catch (err: any) {
-      console.error("Error retrieving settings & contacts:", err);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: err.message || "There was an error retrieving your activity.",
-        },
-        5000,
-      );
-    }
-  }
-
-  async loadMoreOffersToUserProjects() {
-    if (this.newOffersToUserProjectsAtEnd) {
-      return;
-    }
-    const offersToUserProjectsData = await getNewOffersToUserProjects(
-      this.axios,
-      this.apiServer,
-      this.activeDid,
-      undefined,
-      this.newOffersToUserProjects[this.newOffersToUserProjects.length - 1]
-        .jwtId,
-    );
-    this.newOffersToUserProjects.push(...offersToUserProjectsData.data);
-    this.newOffersToUserProjectsAtEnd = !offersToUserProjectsData.hitLimit;
-  }
-}
-</script>

src/views/RecentOffersToUserView.vue

@@ -1,157 +0,0 @@
-<template>
-  <QuickNav selected="Home"></QuickNav>
-  <!-- CONTENT -->
-  <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">
-        <!-- Back -->
-        <fa
-          icon="chevron-left"
-          @click="$router.back()"
-          class="fa-fw text-lg text-center px-2 py-1 absolute -left-2 -top-1"
-        />
-        Offers to You
-      </h1>
-    </div>
-
-    <div v-if="newOffersToUser.length === 0">
-      <p>Nobody has given you an offer.</p>
-      <p class="mt-2">
-        You can start the cycle on the
-        <router-link to="/contacts" class="text-blue-500">
-          Contacts page <fa icon="users" />
-        </router-link>
-        with an "Offer" directly to someone. Hopefully you'll find a common
-        interest!
-      </p>
-    </div>
-    <InfiniteScroll @reached-bottom="loadMoreOffersToUser">
-      <ul
-        data-testId="listRecentOffersToUser"
-        class="border-t border-slate-300"
-      >
-        <li
-          v-for="offer in newOffersToUser"
-          :key="offer.jwtId"
-          class="mt-4 relative group"
-        >
-          <div
-            class="border-b border-slate-300 text-orange-400 pb-2 mb-2 font-bold text-sm"
-            v-if="offer.jwtId == lastAckedOfferToUserJwtId"
-          >
-            You've already seen all the following
-          </div>
-
-          <span>{{
-            didInfo(offer.offeredByDid, activeDid, allMyDids, allContacts)
-          }}</span>
-          offered
-          <span v-if="offer.objectDescription">{{
-            offer.objectDescription
-          }}</span
-          >{{ offer.objectDescription && offer.amount ? ", and " : "" }}
-          <span v-if="offer.amount">{{
-            displayAmount(offer.unit, offer.amount)
-          }}</span>
-          <router-link
-            :to="{ path: '/claim/' + encodeURIComponent(offer.jwtId) }"
-            class="text-blue-500"
-          >
-            <fa icon="file-lines" class="pl-2 text-blue-500 cursor-pointer" />
-          </router-link>
-        </li>
-      </ul>
-    </InfiniteScroll>
-  </section>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-
-import GiftedDialog from "@/components/GiftedDialog.vue";
-import EntityIcon from "@/components/EntityIcon.vue";
-import InfiniteScroll from "@/components/InfiniteScroll.vue";
-import QuickNav from "@/components/QuickNav.vue";
-import { NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
-import { Contact } from "@/db/tables/contacts";
-import {
-  didInfo,
-  displayAmount,
-  getNewOffersToUser,
-  OfferSummaryRecord,
-} from "@/libs/endorserServer";
-import { retrieveAccountDids } from "@/libs/util";
-
-@Component({
-  components: { EntityIcon, GiftedDialog, InfiniteScroll, QuickNav },
-})
-export default class RecentOffersToUserView extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-
-  activeDid = "";
-  allContacts: Array<Contact> = [];
-  allMyDids: string[] = [];
-  apiServer = "";
-  lastAckedOfferToUserJwtId = "";
-  newOffersToUser: Array<OfferSummaryRecord> = [];
-  newOffersToUserAtEnd = false;
-
-  showOffersDetails = false;
-  showOffersToUserProjectsDetails = false;
-  didInfo = didInfo;
-  displayAmount = displayAmount;
-
-  async created() {
-    try {
-      const settings = await retrieveSettingsForActiveAccount();
-      this.apiServer = settings.apiServer || "";
-      this.activeDid = settings.activeDid || "";
-      this.lastAckedOfferToUserJwtId = settings.lastAckedOfferToUserJwtId || "";
-
-      this.allContacts = await db.contacts.toArray();
-
-      this.allMyDids = await retrieveAccountDids();
-
-      const offersToUserData = await getNewOffersToUser(
-        this.axios,
-        this.apiServer,
-        this.activeDid,
-        undefined,
-        undefined,
-      );
-      this.newOffersToUser = offersToUserData.data;
-      this.newOffersToUserAtEnd = !offersToUserData.hitLimit;
-
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    } catch (err: any) {
-      console.error("Error retrieving settings & contacts:", err);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: err.message || "There was an error retrieving your activity.",
-        },
-        5000,
-      );
-    }
-  }
-
-  async loadMoreOffersToUser() {
-    if (this.newOffersToUserAtEnd) {
-      return;
-    }
-    const offersToUserData = await getNewOffersToUser(
-      this.axios,
-      this.apiServer,
-      this.activeDid,
-      undefined,
-      this.newOffersToUser[this.newOffersToUser.length - 1].jwtId,
-    );
-    this.newOffersToUser.push(...offersToUserData.data);
-    this.newOffersToUserAtEnd = !offersToUserData.hitLimit;
-  }
-}
-</script>

src/views/SearchAreaView.vue

@@ -26,7 +26,7 @@
       your device to run searches but it is not stored on our servers.
     </div>
 
-    <div class="text-center">
+    <div>
       <button v-if="!searchBox && !isNewMarkerSet" class="m-4 px-4 py-2">
         Click to Choose a Location for Nearby Search
       </button>
@@ -35,7 +35,6 @@
         class="m-4 px-4 py-2 rounded-md bg-blue-200 text-blue-500"
         @click="storeSearchBox"
       >
-        <fa icon="save" class="fa-fw" />
         Store This Location for Nearby Search
       </button>
       <button
@@ -43,7 +42,6 @@
         class="m-4 px-4 py-2 rounded-md bg-blue-200 text-blue-500"
         @click="forgetSearchBox"
       >
-        <fa icon="trash-can" class="fa-fw" />
         Delete Stored Location
       </button>
       <button
@@ -51,15 +49,13 @@
         class="m-4 px-4 py-2 rounded-md bg-blue-200 text-blue-500"
         @click="resetLatLong"
       >
-        <fa icon="rotate" class="fa-fw" />
-        Reset To Original
+        Reset Marker
       </button>
       <button
         v-if="isNewMarkerSet"
         class="m-4 px-4 py-2 rounded-md bg-blue-200 text-blue-500"
         @click="isNewMarkerSet = false"
       >
-        <fa icon="eraser" class="fa-fw" />
         Erase Marker
       </button>
       <div v-if="isNewMarkerSet">
@@ -68,7 +64,7 @@
       </div>
     </div>
 
-    <div class="aspect-video">
+    <div class="mb-4 aspect-video">
       <l-map
         ref="map"
         :center="[localCenterLat, localCenterLong]"
@@ -113,7 +109,7 @@ import { Router } from "vue-router";
 
 import QuickNav from "@/components/QuickNav.vue";
 import { NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
+import { db } from "@/db/index";
 import { BoundingBox, MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 
 const DEFAULT_LAT_LONG_DIFF = 0.01;
@@ -129,7 +125,7 @@ const DEFAULT_ZOOM = 2;
     LTileLayer,
   },
 })
-export default class SearchAreaView extends Vue {
+export default class DiscoverView extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
   isChoosingSearchBox = false;
@@ -146,8 +142,9 @@ export default class SearchAreaView extends Vue {
   searchBox: { name: string; bbox: BoundingBox } | null = null;
 
   async mounted() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.searchBox = settings.searchBoxes?.[0] || null;
+    await db.open();
+    const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+    this.searchBox = settings?.searchBoxes?.[0] || null;
     this.resetLatLong();
   }
 
@@ -166,10 +163,8 @@ export default class SearchAreaView extends Vue {
       // This doesn't seem like the right approach but it's the only way I can find to get the screen bounds.
       const bounds = event.target.boxZoom?._map?.getBounds();
       if (bounds) {
-        latDiff =
-          Math.abs(bounds.getNorthEast().lat - bounds.getSouthWest().lat) / 8;
-        longDiff =
-          Math.abs(bounds.getNorthEast().lng - bounds.getSouthWest().lng) / 8;
+        latDiff = Math.abs(bounds._northEast.lat - bounds._southWest.lat) / 8;
+        longDiff = Math.abs(bounds._northEast.lng - bounds._southWest.lng) / 8;
       }
       this.localLatDiff = latDiff;
       this.localLongDiff = longDiff;
@@ -228,7 +223,7 @@ export default class SearchAreaView extends Vue {
             title: "Error Updating Search Settings",
             text: "Try going to a different page and then coming back.",
           },
-          5000,
+          -1,
         );
         console.error(
           "Telling user to retry the location search setting because:",
@@ -243,7 +238,7 @@ export default class SearchAreaView extends Vue {
           title: "No Location Selected",
           text: "Select a location on the map.",
         },
-        5000,
+        -1,
       );
     }
   }
@@ -271,7 +266,7 @@ export default class SearchAreaView extends Vue {
           title: "Error Updating Search Settings",
           text: "Try going to a different page and then coming back.",
         },
-        5000,
+        -1,
       );
       console.error(
         "Telling user to retry the location search setting because:",

src/views/SeedBackupView.vue

@@ -94,22 +94,20 @@
         </button>
       </div>
     </div>
-    <div v-else>You do not have an active identity.</div>
+    <div v-else>You do not have an active identifier.</div>
   </section>
 </template>
 
 <script lang="ts">
+import * as R from "ramda";
 import { Component, Vue } from "vue-facing-decorator";
 import { useClipboard } from "@vueuse/core";
 
 import QuickNav from "@/components/QuickNav.vue";
 import { NotificationIface } from "@/constants/app";
-import { retrieveSettingsForActiveAccount } from "@/db/index";
+import { accountsDB, db } from "@/db/index";
 import { Account } from "@/db/tables/accounts";
-import {
-  retrieveAccountCount,
-  retrieveFullyDecryptedAccount,
-} from "@/libs/util";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 
 @Component({ components: { QuickNav } })
 export default class SeedBackupView extends Vue {
@@ -124,21 +122,24 @@ export default class SeedBackupView extends Vue {
   // 'created' hook runs when the Vue instance is first created
   async created() {
     try {
-      const settings = await retrieveSettingsForActiveAccount();
-      const activeDid = settings.activeDid || "";
+      await db.open();
+      const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+      const activeDid = settings?.activeDid || "";
 
-      this.numAccounts = await retrieveAccountCount();
-      this.activeAccount = await retrieveFullyDecryptedAccount(activeDid);
+      await accountsDB.open();
+      const accounts = await accountsDB.accounts.toArray();
+      this.numAccounts = accounts.length;
+      this.activeAccount = R.find((acc) => acc.did === activeDid, accounts);
     } catch (err: unknown) {
       console.error("Got an error loading an identifier:", err);
       this.$notify(
         {
           group: "alert",
           type: "danger",
-          title: "Error Loading Profile",
+          title: "Error Loading Account",
           text: "Got an error loading your seed data.",
         },
-        3000,
+        -1,
       );
     }
   }

src/views/ShareMyContactInfoView.vue

@@ -41,6 +41,7 @@
 </template>
 
 <script lang="ts">
+import * as R from "ramda";
 import { Component, Vue } from "vue-facing-decorator";
 import { Router } from "vue-router";
 import { useClipboard } from "@vueuse/core";
@@ -48,9 +49,9 @@ import { useClipboard } from "@vueuse/core";
 import QuickNav from "@/components/QuickNav.vue";
 import TopMessage from "@/components/TopMessage.vue";
 import { NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
-import { generateEndorserJwtUrlForAccount } from "@/libs/endorserServer";
-import { retrieveAccountMetadata } from "@/libs/util";
+import { accountsDB, db } from "@/db/index";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
+import { generateEndorserJwtForAccount } from "@/libs/endorserServer";
 
 @Component({
   components: { QuickNav, TopMessage },
@@ -59,23 +60,25 @@ export default class ShareMyContactInfoView extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
   async onClickShare() {
-    const settings = await retrieveSettingsForActiveAccount();
-    const activeDid = settings.activeDid || "";
-    const givenName = settings.firstName || "";
-    const isRegistered = !!settings.isRegistered;
-    const profileImageUrl = settings.profileImageUrl || "";
+    await db.open();
+    const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+    const activeDid = settings?.activeDid || "";
+    const givenName = settings?.firstName || "";
+    const isRegistered = !!settings?.isRegistered;
+    const profileImageUrl = settings?.profileImageUrl || "";
 
-    const account = await retrieveAccountMetadata(activeDid);
+    await accountsDB.open();
+    const accounts = await accountsDB.accounts.toArray();
+    const account = R.find((acc) => acc.did === activeDid, accounts);
 
     const numContacts = await db.contacts.count();
 
     if (account) {
-      const message = await generateEndorserJwtUrlForAccount(
+      const message = await generateEndorserJwtForAccount(
         account,
         isRegistered,
         givenName,
         profileImageUrl,
-        true,
       );
       useClipboard()
         .copy(message)

src/views/SharedPhotoView.vue

@@ -75,7 +75,7 @@ import {
   IMAGE_TYPE_PROFILE,
   NotificationIface,
 } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
+import { db } from "@/db/index";
 import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import { accessToken } from "@/libs/crypto";
 import { base64ToBlob, SHARED_PHOTO_BASE64_KEY } from "@/libs/util";
@@ -94,8 +94,9 @@ export default class SharedPhotoView extends Vue {
   // 'created' hook runs when the Vue instance is first created
   async mounted() {
     try {
-      const settings = await retrieveSettingsForActiveAccount();
-      this.activeDid = settings.activeDid;
+      await db.open();
+      const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+      this.activeDid = settings?.activeDid as string;
 
       const temp = await db.temp.get(SHARED_PHOTO_BASE64_KEY);
       const imageB64 = temp?.blobB64 as string;
@@ -120,7 +121,7 @@ export default class SharedPhotoView extends Vue {
           title: "Error",
           text: "Got an error loading this data.",
         },
-        3000,
+        -1,
       );
     }
   }

src/views/StartView.vue

@@ -92,11 +92,9 @@ import { Component, Vue } from "vue-facing-decorator";
 import { Router } from "vue-router";
 
 import { AppString, PASSKEYS_ENABLED } from "@/constants/app";
-import { retrieveSettingsForActiveAccount } from "@/db/index";
-import {
-  registerSaveAndActivatePasskey,
-  retrieveAccountCount,
-} from "@/libs/util";
+import { accountsDB, db } from "@/db/index";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
+import { registerSaveAndActivatePasskey } from "@/libs/util";
 
 @Component({
   components: {},
@@ -108,10 +106,12 @@ export default class StartView extends Vue {
   numAccounts = 0;
 
   async mounted() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.givenName = settings.firstName || "";
+    await db.open();
+    const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+    this.givenName = settings?.firstName || "";
 
-    this.numAccounts = await retrieveAccountCount();
+    await accountsDB.open();
+    this.numAccounts = await accountsDB.accounts.count();
   }
 
   public onClickNewSeed() {

src/views/StatisticsView.vue

@@ -25,13 +25,12 @@
       Here is a view of the activity you can see.
       <ul class="list-disc outside ml-4">
         <li>Each identity and claim has a unique position.</li>
-        <li>
-          Each will show at their time of appearance relative to all others.
-        </li>
-        <li>
-          Note that the ones on the left and right edges are randomized because
-          their data isn't all visible to you.
+        <!-- eslint-disable prettier/prettier --><!-- If we format prettier then there is extra space at the start of the line. -->
+        <li>Each will show at their time of appearance relative to all others.</li>
+        <li>Note that the ones on the left and right edges are randomized
+          because their data isn't all visible to you.
         </li>
+        <!-- eslint-enable -->
       </ul>
     </div>
 
@@ -47,9 +46,7 @@
         {{ worldProperties.animationDurationSeconds }} seconds
       </div>
     </div>
-    <button class="float-right text-blue-600" @click="captureGraphics()">
-      Screenshot
-    </button>
+    <button class="float-right text-blue-600" @click="captureGraphics()">Screenshot</button>
     <div id="scene-container" class="h-screen"></div>
   </section>
 </template>
@@ -91,7 +88,7 @@ export default class StatisticsView extends Vue {
           title: "Mounting Error",
           text: error.message,
         },
-        5000,
+        -1,
       );
     }
   }

src/views/TestView.vue

@@ -35,7 +35,7 @@
             5000,
           )
         "
-        class="font-bold capitalize bg-slate-900 text-white px-3 py-2 rounded-md mr-2"
+        class="font-bold uppercase bg-slate-900 text-white px-3 py-2 rounded-md mr-2"
       >
         Toast
       </button>
@@ -49,10 +49,10 @@
               title: 'Information Alert',
               text: 'Just wanted you to know.',
             },
-            5000,
+            -1,
           )
         "
-        class="font-bold capitalize bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
+        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
       >
         Info
       </button>
@@ -66,10 +66,10 @@
               title: 'Success Alert',
               text: 'Congratulations!',
             },
-            5000,
+            -1,
           )
         "
-        class="font-bold capitalize bg-emerald-600 text-white px-3 py-2 rounded-md mr-2"
+        class="font-bold uppercase bg-emerald-600 text-white px-3 py-2 rounded-md mr-2"
       >
         Success
       </button>
@@ -83,10 +83,10 @@
               title: 'Warning Alert',
               text: 'You might wanna look at this.',
             },
-            5000,
+            -1,
           )
         "
-        class="font-bold capitalize bg-amber-600 text-white px-3 py-2 rounded-md mr-2"
+        class="font-bold uppercase bg-amber-600 text-white px-3 py-2 rounded-md mr-2"
       >
         Warning
       </button>
@@ -100,10 +100,10 @@
               title: 'Danger Alert',
               text: 'Something terrible has happened!',
             },
-            5000,
+            -1,
           )
         "
-        class="font-bold capitalize bg-rose-600 text-white px-3 py-2 rounded-md mr-2"
+        class="font-bold uppercase bg-rose-600 text-white px-3 py-2 rounded-md mr-2"
       >
         Danger
       </button>
@@ -118,7 +118,7 @@
             -1,
           )
         "
-        class="font-bold capitalize bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
+        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
       >
         Notif ON
       </button>
@@ -133,7 +133,7 @@
             -1,
           )
         "
-        class="font-bold capitalize bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
+        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
       >
         Notif MUTE
       </button>
@@ -148,7 +148,7 @@
             -1,
           )
         "
-        class="font-bold capitalize bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
+        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
       >
         Notif OFF
       </button>
@@ -157,7 +157,7 @@
     <div class="mt-8">
       <h2 class="text-xl font-bold mb-4">Image Sharing</h2>
       Populates the "shared-photo" view as if they used "share_target".
-      <input type="file" data-testId="fileInput" @change="uploadFile" />
+      <input type="file" data-testid="fileInput" @change="uploadFile" />
       <router-link
         v-if="showFileNextStep()"
         :to="{
@@ -165,7 +165,7 @@
           query: { fileName },
         }"
         class="block w-full 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-1.5 py-2 rounded-md mb-2 mt-2"
-        data-testId="fileUploadButton"
+        data-testid="fileUploadButton"
       >
         Go to Shared Page
       </router-link>
@@ -184,7 +184,7 @@
         Register Passkey
         <button
           @click="register()"
-          class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
+          class="font-bold uppercase bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
         >
           Simplewebauthn
         </button>
@@ -194,13 +194,13 @@
         Create JWT
         <button
           @click="createJwtSimplewebauthn()"
-          class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
+          class="font-bold uppercase bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
         >
           Simplewebauthn
         </button>
         <button
           @click="createJwtNavigator()"
-          class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
+          class="font-bold uppercase bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
         >
           Navigator
         </button>
@@ -210,19 +210,19 @@
         Verify New JWT
         <button
           @click="verifySimplewebauthn()"
-          class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
+          class="font-bold uppercase bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
         >
           Simplewebauthn
         </button>
         <button
           @click="verifyWebCrypto()"
-          class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
+          class="font-bold uppercase bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
         >
           WebCrypto
         </button>
         <button
           @click="verifyP256()"
-          class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
+          class="font-bold uppercase bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
         >
           p256 - broken
         </button>
@@ -230,25 +230,11 @@
       <div v-else>Verify New JWT -- requires creation first</div>
       <button
         @click="verifyMyJwt()"
-        class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
+        class="font-bold uppercase bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
       >
         Verify Hard-Coded JWT
       </button>
     </div>
-
-    <div class="mt-8">
-      <h2 class="text-xl font-bold mb-4">Encryption & Decryption</h2>
-      See console for more output.
-      <div>
-        <button
-          @click="testEncryptionDecryption()"
-          class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
-        >
-          Run Test
-        </button>
-        Result: {{ encryptionTestResult }}
-      </div>
-    </div>
   </section>
 </template>
 
@@ -261,8 +247,8 @@ import { Router } from "vue-router";
 
 import QuickNav from "@/components/QuickNav.vue";
 import { AppString, NotificationIface } from "@/constants/app";
-import { db, retrieveSettingsForActiveAccount } from "@/db/index";
-import * as cryptoLib from "@/libs/crypto";
+import { accountsDB, db } from "@/db/index";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import * as vcLib from "@/libs/crypto/vc";
 import {
   PeerSetup,
@@ -273,7 +259,7 @@ import {
 import {
   AccountKeyInfo,
   blobToBase64,
-  retrieveAccountMetadata,
+  getAccount,
   registerAndSavePasskey,
   SHARED_PHOTO_BASE64_KEY,
 } from "@/libs/util";
@@ -294,9 +280,6 @@ const TEST_PAYLOAD = {
 export default class Help extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
-  // for encryption/decryption
-  encryptionTestResult?: boolean;
-
   // for file import
   fileName?: string;
 
@@ -307,14 +290,17 @@ export default class Help extends Vue {
   peerSetup?: PeerSetup;
   userName?: string;
 
-  cryptoLib = cryptoLib;
-
   async mounted() {
-    const settings = await retrieveSettingsForActiveAccount();
-    this.activeDid = settings.activeDid || "";
-    this.userName = settings.firstName;
+    await db.open();
+    const settings = await db.settings.get(MASTER_SETTINGS_KEY);
+    this.activeDid = (settings?.activeDid as string) || "";
+    this.userName = settings?.firstName as string;
 
-    const account = await retrieveAccountMetadata(this.activeDid);
+    await accountsDB.open();
+    const account: { identity?: string } | undefined = await accountsDB.accounts
+      .where("did")
+      .equals(this.activeDid)
+      .first();
     if (this.activeDid) {
       if (account) {
         this.credIdHex = account.passkeyCredIdHex as string;
@@ -383,12 +369,8 @@ export default class Help extends Vue {
     this.credIdHex = account.passkeyCredIdHex;
   }
 
-  public async testEncryptionDecryption() {
-    this.encryptionTestResult = await cryptoLib.testEncryptionDecryption();
-  }
-
   public async createJwtSimplewebauthn() {
-    const account: AccountKeyInfo | undefined = await retrieveAccountMetadata(
+    const account: AccountKeyInfo | undefined = await getAccount(
       this.activeDid || "",
     );
     if (!vcLib.isFromPasskey(account)) {
@@ -405,7 +387,7 @@ export default class Help extends Vue {
   }
 
   public async createJwtNavigator() {
-    const account: AccountKeyInfo | undefined = await retrieveAccountMetadata(
+    const account: AccountKeyInfo | undefined = await getAccount(
       this.activeDid || "",
     );
     if (!vcLib.isFromPasskey(account)) {

src/views/UserProfileView.vue

@@ -1,184 +0,0 @@
-<template>
-  <QuickNav selected="Discover" />
-  <TopMessage />
-
-  <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <!-- Breadcrumb -->
-    <div id="ViewBreadcrumb" class="mb-8">
-      <h1 id="ViewHeading" class="text-lg text-center font-light relative px-7">
-        <!-- Back -->
-        <button
-          @click="$router.go(-1)"
-          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
-        >
-          <fa icon="chevron-left" class="fa-fw"></fa>
-        </button>
-        Individual Profile
-      </h1>
-    </div>
-
-    <!-- Loading Animation -->
-    <div
-      class="fixed left-6 mt-16 text-center text-4xl leading-none bg-slate-400 text-white w-14 py-2.5 rounded-full"
-      v-if="isLoading"
-    >
-      <fa icon="spinner" class="fa-spin-pulse"></fa>
-    </div>
-
-    <div v-else-if="profile">
-      <!-- Profile Info -->
-      <div class="mt-8">
-        <div class="text-sm">
-          <fa icon="user" class="fa-fw text-slate-400"></fa>
-          {{ didInfo(profile.issuerDid, activeDid, allMyDids, allContacts) }}
-        </div>
-        <p v-if="profile.description" class="mt-4 text-slate-600">
-          {{ profile.description }}
-        </p>
-      </div>
-
-      <!-- Map for first coordinates -->
-      <div v-if="profile?.locLat && profile?.locLon" class="mt-4">
-        <h2 class="text-lg font-semibold">Location</h2>
-        <div class="h-96 mt-2 w-full">
-          <l-map
-            ref="profileMap"
-            :center="[profile.locLat, profile.locLon]"
-            :zoom="12"
-          >
-            <l-tile-layer
-              url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
-              layer-type="base"
-              name="OpenStreetMap"
-            />
-            <l-marker :lat-lng="[profile.locLat, profile.locLon]">
-              <l-popup>{{
-                didInfo(profile.issuerDid, activeDid, allMyDids, allContacts)
-              }}</l-popup>
-            </l-marker>
-          </l-map>
-        </div>
-      </div>
-
-      <!-- Map for second coordinates -->
-      <div v-if="profile?.locLat2 && profile?.locLon2" class="mt-4">
-        <h2 class="text-lg font-semibold">Second Location</h2>
-        <div class="h-96 mt-2 w-full">
-          <l-map
-            ref="profileMap"
-            :center="[profile.locLat2, profile.locLon2]"
-            :zoom="12"
-          >
-            <l-tile-layer
-              url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
-              layer-type="base"
-              name="OpenStreetMap"
-            />
-            <l-marker :lat-lng="[profile.locLat2, profile.locLon2]">
-              <l-popup>{{
-                didInfo(profile.issuerDid, activeDid, allMyDids, allContacts)
-              }}</l-popup>
-            </l-marker>
-          </l-map>
-        </div>
-      </div>
-    </div>
-
-    <div v-else class="text-center mt-8">
-      <p class="text-lg text-slate-500">Profile not found.</p>
-    </div>
-  </section>
-</template>
-
-<script lang="ts">
-import "leaflet/dist/leaflet.css";
-import { Component, Vue } from "vue-facing-decorator";
-import { LMap, LTileLayer, LMarker, LPopup } from "@vue-leaflet/vue-leaflet";
-import { Router, RouteLocationNormalizedLoaded } from "vue-router";
-
-import QuickNav from "@/components/QuickNav.vue";
-import TopMessage from "@/components/TopMessage.vue";
-import { DEFAULT_PARTNER_API_SERVER, NotificationIface } from "@/constants/app";
-import { db } from "@/db/index";
-import { Contact } from "@/db/tables/contacts";
-import { didInfo, getHeaders } from "@/libs/endorserServer";
-import { UserProfile } from "@/libs/partnerServer";
-import { retrieveAccountDids } from "@/libs/util";
-
-@Component({
-  components: {
-    LMap,
-    LMarker,
-    LPopup,
-    LTileLayer,
-    QuickNav,
-    TopMessage,
-  },
-})
-export default class UserProfileView extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
-  $router!: Router;
-  $route!: RouteLocationNormalizedLoaded;
-
-  activeDid = "";
-  allContacts: Array<Contact> = [];
-  allMyDids: Array<string> = [];
-  isLoading = true;
-  partnerApiServer = DEFAULT_PARTNER_API_SERVER;
-  profile: UserProfile | null = null;
-
-  // make this function available to the Vue template
-  didInfo = didInfo;
-
-  async mounted() {
-    const settings = await db.settings.toArray();
-    this.activeDid = settings[0]?.activeDid || "";
-    this.partnerApiServer =
-      settings[0]?.partnerApiServer || this.partnerApiServer;
-
-    this.allContacts = await db.contacts.toArray();
-    this.allMyDids = await retrieveAccountDids();
-
-    await this.loadProfile();
-  }
-
-  async loadProfile() {
-    const profileId: string = this.$route.params.id as string;
-    if (!profileId) {
-      this.isLoading = false;
-      return;
-    }
-
-    try {
-      const response = await fetch(
-        `${this.partnerApiServer}/api/partner/userProfile/${encodeURIComponent(profileId)}`,
-        {
-          method: "GET",
-          headers: await getHeaders(this.activeDid),
-        },
-      );
-
-      if (response.status === 200) {
-        const result = await response.json();
-        this.profile = result.data;
-      } else {
-        throw new Error("Failed to load profile");
-      }
-    } catch (error) {
-      console.error("Error loading profile:", error);
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Error",
-          text: "There was a problem loading the profile.",
-        },
-        5000,
-      );
-    } finally {
-      this.isLoading = false;
-    }
-  }
-}
-</script>

sw_scripts/additional-scripts.js

@@ -5,7 +5,6 @@ importScripts(
   "https://storage.googleapis.com/workbox-cdn/releases/6.4.1/workbox-sw.js",
 );
 
-// similar method is in the src/db/index.ts file
 function logConsoleAndDb(message, arg1, arg2) {
   // in chrome://serviceworker-internals note that the arg1 and arg2 here will show as "[object Object]" in that page but will show as expandable objects in the console
   console.log(`${new Date().toISOString()} ${message}`, arg1, arg2);
@@ -14,18 +13,10 @@ function logConsoleAndDb(message, arg1, arg2) {
   if (appendDailyLog) {
     let fullMessage = `${new Date().toISOString()} ${message}`;
     if (arg1) {
-      if (typeof arg1 === "string") {
-        fullMessage += `\n${arg1}`;
-      } else {
-        fullMessage += `\n${JSON.stringify(arg1)}`;
-      }
+      fullMessage += `\n${JSON.stringify(arg1)}`;
     }
     if (arg2) {
-      if (typeof arg2 === "string") {
-        fullMessage += `\n${arg2}`;
-      } else {
-        fullMessage += `\n${JSON.stringify(arg2)}`;
-      }
+      fullMessage += `\n${JSON.stringify(arg2)}`;
     }
     // appendDailyLog is injected from safari-notifications.js at build time by the vue.config.js configureWebpack apply plugin
     // eslint-disable-next-line no-undef
@@ -72,16 +63,16 @@ self.addEventListener("push", function (event) {
         // See https://gitea.anomalistdesign.com/trent_larson/py-push-server/src/commit/c1ed026662e754348a5f91542680bd4f57e5b81e/app.py#L217
         const DAILY_UPDATE_TITLE = "DAILY_CHECK";
 
-        // This is shared with the notification-test code and should be a constant. Look for the same name in HelpNotificationsView.vue
         // This is a special value that tells the service worker to send a direct notification to the device, skipping filters.
-        // Make sure it is something different from the DAILY_UPDATE_TITLE.
+        // This is shared with the notification-test code and should be a constant. Look for the same name in HelpNotificationsView.vue
+        // Make sure it is something other than the DAILY_UPDATE_TITLE.
         const DIRECT_PUSH_TITLE = "DIRECT_NOTIFICATION";
 
         let title;
         let message = "Got some empty message.";
         if (payload && payload.title == DIRECT_PUSH_TITLE) {
           // skip any search logic and show the message directly
-          title = "Direct Message";
+          title = "Direct Notification";
           message = payload.message || "No details were provided.";
         } else {
           // any other title will run through regular filtering logic
@@ -115,7 +106,7 @@ self.addEventListener("push", function (event) {
 self.addEventListener("message", (event) => {
   logConsoleAndDb("Service worker got a message...", event);
   if (event.data && event.data.type === "SEND_LOCAL_DATA") {
-    self.secret = event.data.data; // used in safari-notifications.js to decrypt the account identity
+    self.secret = event.data.data;
     event.ports[0].postMessage({ success: true });
   }
   logConsoleAndDb("Service worker posted a message.");
@@ -142,8 +133,7 @@ self.addEventListener("notificationclick", (event) => {
 
 // This is invoked when the user chooses this as a share_target, mapped to share-target in the manifest.
 self.addEventListener("fetch", (event) => {
-  // Skipping this because we get so many of them, at startup and other times, all with an event of: {isTrusted:true}
-  //logConsoleAndDb("Service worker got fetch event.", event);
+  logConsoleAndDb("Service worker got fetch event.", event);
 
   // Bypass any regular requests not related to Web Share Target
   // and also requests that are not exactly to the timesafari.app

sw_scripts/safari-notifications.js

@@ -515,7 +515,6 @@ async function getNotificationCount() {
 
   const identity = activeAccount && activeAccount["identity"];
   if (identity && "secret" in self) {
-    // get the "secret" pulled in additional-scripts.js to decrypt the "identity" inside the IndexedDB; see account.ts
     const secret = self.secret;
     const secretUint8Array = self.decodeBase64(secret);
     const messageWithNonceAsUint8Array = self.decodeBase64(identity);

test-playwright/00-noid-tests.spec.ts

@@ -1,13 +1,12 @@
 import { test, expect } from '@playwright/test';
-import { deleteContact, generateAndRegisterEthrUser, importUser } from './testUtils';
+import { generateEthrUser, importUser } from './testUtils';
 
-test('Check activity feed - check that server is running', async ({ page }) => {
+test('Check activity feed', async ({ page }) => {
   // Load app homepage
   await page.goto('./');
-  await page.getByTestId('closeOnboardingAndFinish').click();
 
   // Check that initial 10 activities have been loaded
-  await expect(page.locator('ul#listLatestActivity li:nth-child(10)')).toBeVisible();
+  await page.locator('ul#listLatestActivity li:nth-child(10)');
 
   // Scroll down a bit to trigger loading additional activities
   await page.locator('ul#listLatestActivity li:nth-child(50)').scrollIntoViewIfNeeded();
@@ -18,7 +17,7 @@ test('Check discover results', async ({ page }) => {
   await page.goto('./discover');
 
   // Check that initial 10 projects have been loaded
-  await expect(page.locator('ul#listDiscoverResults li.border-b:nth-child(10)')).toBeVisible();
+  await page.locator('ul#listDiscoverResults li.border-b:nth-child(10)');
 
   // Scroll down a bit to trigger loading additional projects
   await page.locator('ul#listDiscoverResults li.border-b:nth-child(20)').scrollIntoViewIfNeeded();
@@ -38,17 +37,6 @@ test('Check no-ID messaging in account', async ({ page }) => {
   await expect(page.locator('#sectionIdentityDetails code.truncate')).toBeEmpty();
 });
 
-test('Check ability to share contact', async ({ page }) => {
-  // Load Discover view
-  await page.goto('./discover');
-
-  // Check that initial 10 projects have been loaded
-  await expect(page.locator('ul#listDiscoverResults li.border-b:nth-child(10)')).toBeVisible();
-
-  // Scroll down a bit to trigger loading additional projects
-  await page.locator('ul#listDiscoverResults li.border-b:nth-child(20)').scrollIntoViewIfNeeded();
-});
-
 test('Check ID generation', async ({ page }) => {
   // Load Account view
   await page.goto('./account');
@@ -76,7 +64,6 @@ test('Check ID generation', async ({ page }) => {
 test('Check setting name & sharing info', async ({ page }) => {
   // Load homepage to trigger ID generation (?)
   await page.goto('./');
-  await page.getByTestId('closeOnboardingAndFinish').click();
   // Check 'someone must register you' notice
   await expect(page.getByText('someone must register you.')).toBeVisible();
   await page.getByRole('button', { name: /Show them/}).click();
@@ -84,8 +71,8 @@ test('Check setting name & sharing info', async ({ page }) => {
   await expect(page.getByText('Set Your Name')).toBeVisible();
   await page.getByRole('textbox').fill('Me Test User');
   await page.locator('button:has-text("Save")').click();
-  await expect(page.getByText('share some other way')).toBeVisible();
-  await page.getByRole('button', { name: /share some other way/ }).click();
+  await expect(page.getByText('share another way')).toBeVisible();
+  await page.getByRole('button', { name: /share another way/ }).click();
   await expect(page.getByRole('button', { name: 'copy to clipboard' })).toBeVisible();
   await page.getByRole('button', { name: 'copy to clipboard' }).click();
   await expect(page.getByText('contact info was copied')).toBeVisible();
@@ -96,7 +83,7 @@ test('Check setting name & sharing info', async ({ page }) => {
   await expect(page.getByText('your contacts')).toBeVisible();
 });
 
-test('Confirm test API setting (may fail if you are running your own Time Safari)', async ({ page }, testInfo) => {
+test('Confirm usage of test API (may fail if you are running your own Time Safari)', async ({ page }, testInfo) => {
   // Load account view
   await page.goto('./account');
   await page.getByRole('heading', { name: 'Advanced' }).click();
@@ -114,33 +101,15 @@ test('Confirm test API setting (may fail if you are running your own Time Safari
 
 test('Check User 0 can register a random person', async ({ page }) => {
   await importUser(page, '00');
-  const newDid = await generateAndRegisterEthrUser(page);
+  const newDid = await generateEthrUser(page);
   expect(newDid).toContain('did:ethr:');
 
   await page.goto('./');
-  await page.getByTestId('closeOnboardingAndFinish').click();
   await page.getByRole('heading', { name: 'Unnamed/Unknown' }).click();
-  await page.getByPlaceholder('What was given').fill('Gave me access!');
+  await page.getByPlaceholder('What was given').fill('Access!');
   await page.getByRole('button', { name: 'Sign & Send' }).click();
   await expect(page.getByText('That gift was recorded.')).toBeVisible();
   // now ensure that alert goes away
   await page.locator('div[role="alert"] button > svg.fa-xmark').click(); // dismiss alert
   await expect(page.getByText('That gift was recorded.')).toBeHidden();
-
-  // now delete the contact to test that pages still do reasonable things
-  await deleteContact(page, newDid);
-  // go the activity page for this new person
-  await page.goto('./did/' + encodeURIComponent(newDid));
-  // maybe replace by: const popupPromise = page.waitForEvent('popup');
-  let error;
-  try {
-    await page.waitForSelector('div[role="alert"]', { timeout: 2000 });
-    error = new Error('Error alert should not show.');
-  } catch (error) {
-    // success
-  } finally {
-    if (error) {
-      throw error;
-    }
-  }
 });