Added gatekeeping dialogs for PWA install requirement

CHANGELOG.md

@@ -1,14 +0,0 @@
-# Changelog
-
-All notable changes to this project will be documented in this file.
-
-The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
-and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
-
-
-## [Unreleased]
-
-
-## [0.1.2] - 2023.11.01
-### Added
-- Basics: create ID, record a give, declare a project, search, and get notifications.

README.md

@@ -1,9 +1,6 @@
 # kickstart-for-time-pwa
 
 ## Project setup
-
-We have pkgx.dev set up in package.json, so you can use `dev` to set up the dev environment.
-
 ```
 npm install
 ```
@@ -26,12 +23,6 @@ npm run build
 npm run lint
 ```
 
-## Tests
-
-###
-
-For your own web-push tests, change the 'vapid' URL in App.vue, and install apps on the same domain.
-
 ### Test key contents
 
 See [this page](openssl_signing_console.rst)
@@ -95,6 +86,15 @@ Clear cache for localhost, then go to http://localhost:8080/start
 
 
 
+## Dependencies
+
+See https://tea.xyz
+
+| Project    | Version   |
+| ---------- | --------- |
+| nodejs.org | ^16.0.0   |
+| npmjs.com  | ^8.0.0    |
+
 ## Other
 
 ### Reference Material

package.json

@@ -1,6 +1,6 @@
 {
   "name": "kickstart-for-time-pwa",
-  "version": "0.1.2",
+  "version": "0.1.0",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",
@@ -52,7 +52,6 @@
     "vue": "^3.3.4",
     "vue-axios": "^3.5.2",
     "vue-facing-decorator": "^2.1.20",
-    "vue-qrcode-reader": "^5.3.4",
     "vue-router": "^4.2.3",
     "web-did-resolver": "^2.0.27"
   },
@@ -81,6 +80,5 @@
     "prettier": "^3.0.0",
     "tailwindcss": "^3.3.2",
     "typescript": "~5.1.6"
-  },
+  }
-  "pkgx": "node^18 npm^10"
 }

project.task.yaml

@@ -1,16 +1,15 @@
 
 tasks:
 
+- 08 Scan QR code to import into contacts assignee:matthew
+    - SEE - https://github.com/gruhn/vue-qrcode-reader
+
 - in endorser-push-server - mount folder for persistent sqlite DB outside of container
 - test alerts on all pages -- or refactor to new "notify" (since AlertMessage refactoring may require a change, et. ContactQRScanShowView)
+- .2 bug - on contacts view, click on "to" & "from" and nothing happens
 - 40 notifications :
   - push, where we trigger a ServiceWorker(?) in the app to reach out and check for new data assignee:matthew
 
-- 01 bug - we get a 404 when reloading the page anyplace except "/", and it's hard to get back
-- .1 test - make sure that a registration failure (including network failure) doesn't give a success message (which may have happened during board meeting)
-
-- .1 don't allow to even see the claim actions if they're not registered
-
 - 01 Replace Gifted/Give in ContactsView with GiftedDialog assignee:matthew
 
 - 01 fix the Discovery map display to not show on top of bottom icons (and any other UI tweaks on the map flow) assignee-group:ui
@@ -27,23 +26,17 @@ tasks:
 
 - 24 Move to Vite assignee:matthew
 
-- .2 fit more icons on home screen, with a "more" button to contacts page if there is more than 2 rows
+- .2 Edit Plan does not have icons across the bottom assignee-group:ui
-- .1 Remove notification alert visuals on home page
+- .5 include the hash of the latest commit, and maybe a version
-- .5 Add infinite scroll to gifts on the home page
-- .5 bug - search for "Safari" does not find the project, but if already on the "Anywhere" tab it shows all
-- .2 figure out why endorser-mobile search doesn't find recently created PlanAction
-- .1 when creating a plan, select location and then make sure you can deselect on Android
-- .5 include a version, maybe the hash of the latest commit -- figuring out how it works on prod now
 - .5 add link to further project / people when a project pays ahead
 - .5 add project ID to the URL, to make a project publicly-accessible
+- .5 remove edit from project page for projects owned by others
 - .5 fix where user 0 sees no txns from user 1 on contacts page but sees them on list page
 - .2 on ProjectViewView, show different messages for "to" and "from" sections if none exist assignee-group:ui
 - .2 fix static icon to the right on project page (Matthew - I've made "Rotary" into issuer?) assignee:jose assignee-group:ui
 - .2 fix rate limit verbiage (with the new one-per-day allowance) assignee:trent
 - .1 remove the logic to exclude beforeId in list of plans after server has commit 26b25af605e715600d4f12b6416ed9fd7142d164
 - .2 in SeedBackupView, don't load the mnemonic and keep it in memory; only load it when they click "show"
-- .1 Make give description text box into something that expands as they type
-- .1 Make contact info specific to Time Safari - rather pointing at CommunityCred.org
 
 - Discuss whether the remaining tasks are worthwhile before MVP release.
 
@@ -56,8 +49,6 @@ tasks:
 - .2 Show a warning if both giver and recipient are the same (but still allow?) assignee-group:ui
 - 01 Would it look better to shrink the buttons on many pages so they don't expand to the width of the screen? assignee-group:ui
 - .5 Display a more appealing confirmation on the map when erasing the marker assignee-group:ui
-- .5 make a VC details page
-- .1 Add units or different icon to the coins (to distinguish $, BTC, etc)
 
 - contacts v+ :
   - 01 Import all the non-sensitive data (ie. contacts & settings).
@@ -81,11 +72,6 @@ tasks:
   - Test PWA features on Android and iOS.
   blocks: ref:https://raw.githubusercontent.com/trentlarson/lives-of-gifts/master/project.yaml#kickstarter%20for%20time
 
-- .5 show seed phrase in a QR code for transfer to another device
-
-- 32 accept images for projects
-- 32 accept images for contacts
-
 - linking between projects or plans :
   - show total time given to & from a project
   - terminology:

src/App.vue

@@ -246,6 +246,75 @@
               </div>
             </div>
           </div>
+          <div
+            v-if="notification.type === 'pwa-install-gate-ios'"
+            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">
+                <fa
+                  icon="mobile-screen-button"
+                  class="inline-block text-7xl text-slate-400 mb-4"
+                >
+                </fa>
+                <h3 class="text-2xl font-semibold mb-4">Add to Home Screen</h3>
+                <p class="text-md mb-4">
+                  To install the app, you need to add this website to your home
+                  screen.
+                </p>
+                <p class="text-md">
+                  In your Safari browser menu, tap the
+                  <span class="whitespace-nowrap">
+                    <fa
+                      icon="arrow-up-from-bracket"
+                      class="fa-fw text-slate-500 bg-slate-200 py-1 -my-1 px-0.5 rounded"
+                    >
+                    </fa>
+                    Share
+                  </span>
+                  icon and choose
+                  <b>Add to Home Screen</b> in the options. Then, open the Time
+                  Safari app on your home screen.
+                </p>
+              </div>
+            </div>
+          </div>
+          <div
+            v-if="notification.type === 'pwa-install-gate-android'"
+            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">
+                <fa
+                  icon="mobile-screen-button"
+                  class="inline-block text-7xl text-slate-400 mb-4"
+                >
+                </fa>
+                <h3 class="text-2xl font-semibold mb-4">Add to Home Screen</h3>
+                <p class="text-md mb-4">
+                  To install the app, you need to add this website to your home
+                  screen.
+                </p>
+                <p class="text-md">
+                  In your Chrome browser menu, tap the
+                  <span class="whitespace-nowrap">
+                    <fa
+                      icon="ellipsis-vertical"
+                      class="fa-fw text-slate-500 bg-slate-200 py-1 -my-1 px-0.5 rounded"
+                    >
+                    </fa>
+                    More
+                  </span>
+                  button and choose
+                  <b>Install App</b> in the options.
+                </p>
+              </div>
+            </div>
+          </div>
         </div>
       </Notification>
     </div>

src/constants/app.ts

@@ -1,10 +1,8 @@
 /**
  * Generic strings that could be used throughout the app.
- *
- * See also ../libs/veramo/setup.ts
  */
 export enum AppString {
-  APP_NAME = "Time Safari",
+  APP_NAME = "Kick-Start with Time",
 
   PROD_ENDORSER_API_SERVER = "https://api.endorser.ch",
   TEST_ENDORSER_API_SERVER = "https://test-api.endorser.ch",
@@ -12,13 +10,3 @@ export enum AppString {
 
   DEFAULT_ENDORSER_API_SERVER = TEST_ENDORSER_API_SERVER,
 }
-
-/**
- * See notiwind package
- */
-export interface NotificationIface {
-  group: string;
-  type: string; // "toast" | "info" | "success" | "warning" | "danger"
-  title: string;
-  text: string;
-}

src/db/tables/contacts.ts

@@ -7,5 +7,5 @@ export interface Contact {
 }
 
 export const ContactsSchema = {
-  contacts: "&did, name, publicKeyBase64, registered, seesMe",
+  contacts: "++did, name, publicKeyBase64, registered, seesMe",
 };

src/libs/crypto/index.ts

@@ -1,4 +1,5 @@
 import { IIdentifier } from "@veramo/core";
+import { DEFAULT_DID_PROVIDER_NAME } from "../veramo/setup";
 import { getRandomBytesSync } from "ethereum-cryptography/random";
 import { entropyToMnemonic } from "ethereum-cryptography/bip39";
 import { wordlist } from "ethereum-cryptography/bip39/wordlists/english";
@@ -6,10 +7,7 @@ import { HDNode } from "@ethersproject/hdnode";
 import * as didJwt from "did-jwt";
 import * as u8a from "uint8arrays";
 
-import { ENDORSER_JWT_URL_LOCATION } from "@/libs/endorserServer";
+export const DEFAULT_ROOT_DERIVATION_PATH = "m/76798669'/0'/0'/0'";
-import { DEFAULT_DID_PROVIDER_NAME } from "../veramo/setup";
-
-export const DEFAULT_ROOT_DERIVATION_PATH = "m/84737769'/0'/0'/0'";
 
 /**
  *
@@ -152,24 +150,3 @@ export function fromJose(signature: string): {
 export function bytesToHex(b: Uint8Array): string {
   return u8a.toString(b, "base16");
 }
-
-/**
- @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 getContactPayloadFromJwtUrl = (jwtUrlText: string) => {
-  let jwtText = jwtUrlText;
-  const endorserContextLoc = jwtText.indexOf(ENDORSER_JWT_URL_LOCATION);
-  if (endorserContextLoc > -1) {
-    jwtText = jwtText.substring(
-      endorserContextLoc + ENDORSER_JWT_URL_LOCATION.length,
-    );
-  }
-
-  // JWT format: { header, payload, signature, data }
-  const jwt = didJwt.decodeJWT(jwtText);
-
-  return jwt.payload;
-};

src/libs/endorserServer.ts

@@ -6,12 +6,7 @@ import { Axios, AxiosResponse } from "axios";
 import { Contact } from "@/db/tables/contacts";
 
 export const SCHEMA_ORG_CONTEXT = "https://schema.org";
-// the object in RegisterAction claims
 export const SERVICE_ID = "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=";
 
 export interface AgreeVerifiableCredential {
   "@context": string;
@@ -116,8 +111,6 @@ export function isHiddenDid(did: string) {
 
 /**
  always returns text, maybe UNNAMED_VISIBLE or UNKNOWN_ENTITY
-
- Similar logic is found in endorser-mobile.
  **/
 export function didInfo(
   did: string,
@@ -125,14 +118,14 @@ export function didInfo(
   allMyDids: string[],
   contacts: Contact[],
 ): string {
-  if (!did) return "Someone Anonymous";
-
   const myId = R.find(R.equals(did), allMyDids);
   if (myId) return `You${myId !== activeDid ? " (Alt ID)" : ""}`;
 
   const contact = R.find((c) => c.did === did, contacts);
   return contact
-    ? contact.name || "Contact With No Name"
+    ? contact.name || "Someone Unnamed in Contacts"
+    : !did
+    ? "Unspecified Person"
     : isHiddenDid(did)
     ? "Someone Not In Network"
     : "Someone Not In Contacts";

src/libs/veramo/setup.ts

@@ -1,7 +1,151 @@
-// see also ../constants/app.ts and
+// Created from the setup in https://veramo.io/docs/guides/react_native
 
+// Core interfaces
+/* import {
+  createAgent,
+  IDIDManager,
+  IResolver,
+  IDataStore,
+  IKeyManager,
+} from "@veramo/core";
+ */
+// Core identity manager plugin
+//import { DIDManager } from "@veramo/did-manager";
+
+// Ethr did identity provider
+//import { EthrDIDProvider } from "@veramo/did-provider-ethr";
+
+// Core key manager plugin
+//import { KeyManager } from "@veramo/key-manager";
+
+// Custom key management system for RN
+//import { KeyManagementSystem } from '@veramo/kms-local-react-native'
+
+// Custom resolver
+// Custom resolvers
+//import { DIDResolverPlugin } from "@veramo/did-resolver";
+/* import { Resolver } from "did-resolver";
+import { getResolver as ethrDidResolver } from "ethr-did-resolver";
+import { getResolver as webDidResolver } from "web-did-resolver";
+ */
+// for VCs and VPs https://veramo.io/docs/api/credential-w3c
+//import { CredentialIssuer } from '@veramo/credential-w3c'
+
+// Storage plugin using TypeOrm
+/* import {
+  Entities,
+  KeyStore,
+  DIDStore,
+  IDataStoreORM,
+} from "@veramo/data-store";
+ */
+// TypeORM is installed with @veramo/typeorm
+//import { createConnection } from 'typeorm'
+
+//import * as R from "ramda";
+
+/*
+import { Contact } from '../entity/contact'
+import { Settings } from '../entity/settings'
+import { PrivateData } from '../entity/privateData'
+
+import { Initial1616938713828 }          from '../migration/1616938713828-initial'
+import { SettingsContacts1616967972293 } from '../migration/1616967972293-settings-contacts'
+import { EncryptedSeed1637856484788 }    from '../migration/1637856484788-EncryptedSeed'
+import { HomeScreenConfig1639947962124 } from '../migration/1639947962124-HomeScreenConfig'
+import { HandlePublicKeys1652142819353 } from '../migration/1652142819353-HandlePublicKeys'
+import { LastClaimsSeen1656811846836 }   from '../migration/1656811846836-LastClaimsSeen'
+import { ContactRegistered1662256903367 }from '../migration/1662256903367-ContactRegistered'
+import { PrivateData1663080623479 }      from '../migration/1663080623479-PrivateData'
+
+const ALL_ENTITIES = Entities.concat([Contact, Settings, PrivateData])
+
+// Create react native DB connection configured by ormconfig.js
+
+export const dbConnection = createConnection({
+  database: 'endorser-mobile.sqlite',
+  entities: ALL_ENTITIES,
+  location: 'default',
+  logging: ['error', 'info', 'warn'],
+  migrations: [ Initial1616938713828, SettingsContacts1616967972293, EncryptedSeed1637856484788, HomeScreenConfig1639947962124, HandlePublicKeys1652142819353, LastClaimsSeen1656811846836, ContactRegistered1662256903367, PrivateData1663080623479 ],
+  migrationsRun: true,
+  type: 'react-native',
+})
+*/
 function didProviderName(netName: string) {
   return "did:ethr" + (netName === "mainnet" ? "" : ":" + netName);
 }
 
-export const DEFAULT_DID_PROVIDER_NAME = didProviderName("mainnet");
+//const NETWORK_NAMES = ["mainnet", "rinkeby"];
+
+const DEFAULT_DID_PROVIDER_NETWORK_NAME = "mainnet";
+
+export const DEFAULT_DID_PROVIDER_NAME = didProviderName(
+  DEFAULT_DID_PROVIDER_NETWORK_NAME,
+);
+
+export const HANDY_APP = false;
+
+// this is used as the object in RegisterAction claims
+export const SERVICE_ID = "endorser.ch";
+
+//const INFURA_PROJECT_ID = "INFURA_PROJECT_ID";
+/*
+const providers = {}
+NETWORK_NAMES.forEach((networkName) => {
+  providers[didProviderName(networkName)] = new EthrDIDProvider({
+    defaultKms: 'local',
+    network: networkName,
+    rpcUrl: 'https://' + networkName + '.infura.io/v3/' + INFURA_PROJECT_ID,
+    gas: 1000001,
+    ttl: 60 * 60 * 24 * 30 * 12 + 1,
+  })
+})
+
+
+const didManager = new DIDManager({
+  store: new DIDStore(dbConnection),
+  defaultProvider: DEFAULT_DID_PROVIDER_NAME,
+  providers: providers,
+})
+*/
+
+/* const basicDidResolvers = NETWORK_NAMES.map((networkName) => [
+  networkName,
+  new Resolver({
+    ethr: ethrDidResolver({
+      networks: [
+        {
+          name: networkName,
+          rpcUrl:
+            "https://" + networkName + ".infura.io/v3/" + INFURA_PROJECT_ID,
+        },
+      ],
+    }).ethr,
+    web: webDidResolver().web,
+  }),
+]);
+
+const basicResolverMap = R.fromPairs(basicDidResolvers)
+
+export const DEFAULT_BASIC_RESOLVER = basicResolverMap[DEFAULT_DID_PROVIDER_NETWORK_NAME]
+
+const agentDidResolvers = NETWORK_NAMES.map((networkName) => {
+  return new DIDResolverPlugin({
+    resolver: basicResolverMap[networkName],
+  })
+})
+
+let allPlugins = [
+  new CredentialIssuer(),
+  new KeyManager({
+    store: new KeyStore(dbConnection),
+    kms: {
+      local: new KeyManagementSystem(),
+    },
+  }),
+  didManager,
+].concat(agentDidResolvers)
+*/
+
+//export const agent = createAgent<IDIDManager & IKeyManager & IDataStore & IDataStoreORM & IResolver>({ plugins: allPlugins })

src/main.ts

@@ -13,7 +13,7 @@ import { library } from "@fortawesome/fontawesome-svg-core";
 import {
   faArrowLeft,
   faArrowRight,
-  faBan,
+  faArrowUpFromBracket,
   faBurst,
   faCalendar,
   faChevronLeft,
@@ -40,6 +40,7 @@ import {
   faLongArrowAltLeft,
   faLongArrowAltRight,
   faMagnifyingGlass,
+  faMobileScreenButton,
   faPen,
   faPersonCircleCheck,
   faPersonCircleQuestion,
@@ -60,7 +61,7 @@ import {
 library.add(
   faArrowLeft,
   faArrowRight,
-  faBan,
+  faArrowUpFromBracket,
   faBurst,
   faCalendar,
   faChevronLeft,
@@ -87,6 +88,7 @@ library.add(
   faLongArrowAltLeft,
   faLongArrowAltRight,
   faMagnifyingGlass,
+  faMobileScreenButton,
   faPen,
   faPersonCircleCheck,
   faPersonCircleQuestion,

src/router/index.ts

@@ -58,14 +58,6 @@ const routes: Array<RouteRecordRaw> = [
         /* webpackChunkName: "contact-amounts" */ "../views/ContactAmountsView.vue"
       ),
   },
-  {
-    path: "/contact-gives",
-    name: "contact-gives",
-    component: () =>
-      import(
-        /* webpackChunkName: "contact-gives" */ "../views/ContactGiftingView.vue"
-      ),
-  },
   {
     path: "/contact-qr",
     name: "contact-qr",
@@ -193,11 +185,11 @@ const routes: Array<RouteRecordRaw> = [
       ),
   },
   {
-    path: "/test",
+    path: "/contact-gives",
-    name: "test",
+    name: "contact-gives",
     component: () =>
       import(
-        /* webpackChunkName: "test" */ "../views/TestView.vue"
+        /* webpackChunkName: "contact-gives" */ "../views/ContactGiftingView.vue"
       ),
   },
 ];

src/test/index.ts

@@ -2,7 +2,7 @@ import axios from "axios";
 import * as didJwt from "did-jwt";
 import { AppString } from "@/constants/app";
 import { db } from "../db";
-import { SERVICE_ID } from "../libs/endorserServer";
+import { SERVICE_ID } from "../libs/veramo/setup";
 import { deriveAddress, newIdentifier } from "../libs/crypto";
 import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 

src/views/AccountViewView.vue

@@ -244,9 +244,7 @@
       </div>
     </div>
 
-    <!-- id used by puppeteer test script -->
     <h3
-      id="advanced"
       class="text-sm uppercase font-semibold mb-3"
       @click="showAdvanced = !showAdvanced"
     >
@@ -279,9 +277,7 @@
       </label>
 
       <div class="flex py-2">
-        <!-- id used by puppeteer test script -->
         <router-link
-          id="switch-identity-link"
           :to="{ name: 'identity-switcher' }"
           class="block text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md mb-2"
         >
@@ -343,11 +339,11 @@ import "dexie-export-import";
 import { Component, Vue } from "vue-facing-decorator";
 import { useClipboard } from "@vueuse/core";
 
-import QuickNav from "@/components/QuickNav.vue";
 import { AppString } from "@/constants/app";
 import { db, accountsDB } from "@/db/index";
 import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import { accessToken } from "@/libs/crypto";
+import QuickNav from "@/components/QuickNav.vue";
 import { IIdentifier } from "@veramo/core";
 import { ErrorResponse, RateLimits } from "@/libs/endorserServer";
 

src/views/ContactQRScanShowView.vue

@@ -3,7 +3,7 @@
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24">
     <!-- Heading -->
-    <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4">
+    <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
       Your Contact Info
     </h1>
 
@@ -17,17 +17,12 @@
       :dotsOptions="{ type: 'square' }"
       class="flex justify-center"
     />
-
-    <h1 class="text-4xl text-center font-light pt-4">Scan Contact Info</h1>
-    <qrcode-stream @detect="onScanDetect" @error="onScanError" />
   </section>
 </template>
 
 <script lang="ts">
 import QRCodeVue3 from "qr-code-generator-vue3";
 import { Component, Vue } from "vue-facing-decorator";
-import { QrcodeStream } from "vue-qrcode-reader";
-
 import { accountsDB, db } from "@/db/index";
 import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import * as R from "ramda";
@@ -35,10 +30,6 @@ import { SimpleSigner } from "@/libs/crypto";
 import * as didJwt from "did-jwt";
 import QuickNav from "@/components/QuickNav.vue";
 import { Account } from "@/db/tables/accounts";
-import {
-  CONTACT_URL_PREFIX,
-  ENDORSER_JWT_URL_LOCATION,
-} from "@/libs/endorserServer";
 
 // eslint-disable-next-line @typescript-eslint/no-var-requires
 const Buffer = require("buffer/").Buffer;
@@ -52,7 +43,6 @@ interface Notification {
 
 @Component({
   components: {
-    QrcodeStream,
     QRCodeVue3,
     QuickNav,
   },
@@ -122,47 +112,9 @@ export default class ContactQRScanShow extends Vue {
         issuer: identity.did,
         signer: signer,
       });
-      const viewPrefix = CONTACT_URL_PREFIX + ENDORSER_JWT_URL_LOCATION;
+      const viewPrefix = "https://endorser.ch/contact?jwt=";
       this.qrValue = viewPrefix + vcJwt;
     }
   }
-
-  /**
-   *
-   * @param content is the result of a QR scan, an array with one item with a rawValue property
-   */
-  // Unfortunately, there are not typescript definitions for the qrcode-stream component yet.
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  onScanDetect(content: any) {
-    if (content[0]?.rawValue) {
-      console.log("onDetect", content[0].rawValue);
-      localStorage.setItem("contactEndorserUrl", content[0].rawValue);
-      this.$router.push({ name: "contacts" });
-    } else {
-      this.$notify(
-        {
-          group: "alert",
-          type: "warning",
-          title: "Invalid Contact QR Code",
-          text: "No QR code detected with contact information.",
-        },
-        -1,
-      );
-    }
-  }
-
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  onScanError(error: any) {
-    console.log("Scan was invalid:", error);
-    this.$notify(
-      {
-        group: "alert",
-        type: "warning",
-        title: "Invalid Scan",
-        text: "The scan was invalid.",
-      },
-      -1,
-    );
-  }
 }
 </script>

src/views/ContactsView.vue

@@ -20,11 +20,6 @@
 
     <!-- New Contact -->
     <div class="mb-4 flex">
-      <span class="self-center bg-slate-500 text-white px-1.5 py-1 rounded-md">
-        <router-link :to="{ name: 'contact-qr' }">
-          <fa icon="qrcode" class="fa-fw" />
-        </router-link>
-      </span>
       <input
         type="text"
         placeholder="DID, Name, Public Key"
@@ -93,16 +88,6 @@
               class="inline-block align-text-bottom border border-slate-300 rounded"
             ></EntityIcon>
             {{ contact.name || "(no name)" }}
-            <button
-              class="text-sm uppercase bg-slate-500 text-white px-1 rounded-md"
-              @click="
-                contactEdit = contact;
-                contactNewName = contact.name;
-              "
-              title="Edit"
-            >
-              <fa icon="pen" class="fa-fw" />
-            </button>
           </h2>
           <div class="text-sm truncate">{{ contact.did }}</div>
           <div class="text-sm truncate" v-if="contact.publicKeyBase64">
@@ -219,31 +204,6 @@
       </li>
     </ul>
     <p v-else>This identity has no contacts.</p>
-
-    <div v-if="contactEdit !== null" 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"
-        />
-        <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(contactEdit, 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>
   </section>
 </template>
 
@@ -251,17 +211,11 @@
 import { AxiosError } from "axios";
 import * as didJwt from "did-jwt";
 import * as R from "ramda";
-
-import { NotificationIface } from "@/constants/app";
 import { IIdentifier } from "@veramo/core";
 import { accountsDB, db } from "@/db/index";
 import { Contact } from "@/db/tables/contacts";
 import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
-import {
+import { accessToken, SimpleSigner } from "@/libs/crypto";
-  accessToken,
-  getContactPayloadFromJwtUrl,
-  SimpleSigner,
-} from "@/libs/crypto";
 import {
   GiveServerRecord,
   GiveVerifiableCredential,
@@ -275,19 +229,23 @@ import EntityIcon from "@/components/EntityIcon.vue";
 // eslint-disable-next-line @typescript-eslint/no-var-requires
 const Buffer = require("buffer/").Buffer;
 
+interface Notification {
+  group: string;
+  type: string;
+  title: string;
+  text: string;
+}
+
 @Component({
   components: { QuickNav, EntityIcon },
 })
 export default class ContactsView extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
+  $notify!: (notification: Notification, timeout?: number) => void;
 
   activeDid = "";
   apiServer = "";
   contacts: Array<Contact> = [];
-  contactEndorserUrl = localStorage.getItem("contactEndorserUrl") || "";
   contactInput = "";
-  contactEdit: Contact | null = null;
-  contactNewName = "";
   // { "did:...": concatenated-descriptions } entry for each contact
   givenByMeDescriptions: Record<string, string> = {};
   // { "did:...": amount } entry for each contact
@@ -321,12 +279,6 @@ export default class ContactsView extends Vue {
       (a: Contact, b) => (a.name || "").localeCompare(b.name || ""),
       allContacts,
     );
-
-    if (this.contactEndorserUrl) {
-      await this.newContactFromScan(this.contactEndorserUrl);
-      localStorage.removeItem("contactEndorserUrl");
-      this.contactEndorserUrl = "";
-    }
   }
 
   public async getIdentity(activeDid: string) {
@@ -462,18 +414,6 @@ export default class ContactsView extends Vue {
   }
 
   async onClickNewContact(): Promise<void> {
-    if (!this.contactInput) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "warning",
-          title: "No Contact",
-          text: "There was no contact info to add.",
-        },
-        -1,
-      );
-      return;
-    }
     let did = this.contactInput;
     let name, publicKeyBase64;
     const commaPos1 = this.contactInput.indexOf(",");
@@ -492,74 +432,12 @@ export default class ContactsView extends Vue {
       publicKeyBase64 = Buffer.from(publicKeyBase64, "hex").toString("base64");
     }
     const newContact = { did, name, publicKeyBase64 };
-    return this.addContact(newContact);
+    await db.contacts.add(newContact);
-  }
+    const allContacts = this.contacts.concat([newContact]);
-
+    this.contacts = R.sort(
-  async newContactFromScan(url: string): Promise<void> {
+      (a: Contact, b) => (a.name || "").localeCompare(b.name || ""),
-    const payload = getContactPayloadFromJwtUrl(url);
+      allContacts,
-    if (!payload) {
+    );
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "No Contact Info",
-          text: "The contact info could not be parsed.",
-        },
-        -1,
-      );
-      return;
-    } else {
-      return this.addContact({
-        did: payload.iss,
-        name: payload.own.name,
-        publicKeyBase64: payload.own.publicEncKey,
-      } as Contact);
-    }
-  }
-
-  async addContact(newContact: Contact) {
-    if (!newContact.did) {
-      this.$notify(
-        {
-          group: "alert",
-          type: "danger",
-          title: "Incomplete Contact",
-          text: "Cannot add a contact without a DID.",
-        },
-        -1,
-      );
-      return;
-    }
-    return db.contacts
-      .add(newContact)
-      .then(() => {
-        const allContacts = this.contacts.concat([newContact]);
-        this.contacts = R.sort(
-          (a: Contact, b) => (a.name || "").localeCompare(b.name || ""),
-          allContacts,
-        );
-        this.$notify(
-          {
-            group: "alert",
-            type: "success",
-            title: "Contact added",
-            text: newContact.name + " was added.",
-          },
-          -1,
-        );
-      })
-      .catch((err) => {
-        console.error("Error when adding contact to storage:", err);
-        this.$notify(
-          {
-            group: "alert",
-            type: "danger",
-            title: "Contact Not Added",
-            text: "An error prevented importing.",
-          },
-          -1,
-        );
-      });
   }
 
   async deleteContact(contact: Contact) {
@@ -998,18 +876,6 @@ export default class ContactsView extends Vue {
     }
   }
 
-  private async onClickCancelName() {
-    this.contactEdit = null;
-    this.contactNewName = "";
-  }
-
-  private async onClickSaveName(contact: Contact, newName: string) {
-    contact.name = newName;
-    return db.contacts
-      .update(contact.did, { name: newName })
-      .then(() => (this.contactEdit = null));
-  }
-
   public toggleShowGiveTotals() {
     if (this.showGiveTotals) {
       this.showGiveTotals = false;
@@ -1034,26 +900,6 @@ export default class ContactsView extends Vue {
 </script>
 
 <style>
-.dialog-overlay {
-  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;
-}
-
 /* Tooltip from https://www.w3schools.com/css/css_tooltip.asp */
 /* Tooltip container */
 .tooltip {
@@ -1061,6 +907,7 @@ export default class ContactsView extends Vue {
   display: inline-block;
   border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
 }
+
 /* Tooltip text */
 .tooltip .tooltiptext {
   visibility: hidden;

src/views/HelpView.vue

@@ -41,15 +41,14 @@
         You need someone to register you -- usually the person who told you
         about this app, on the Contacts
         <fa icon="circle-user" class="fa-fw" /> page. After they register you,
-        you can select any contact on the home page (or "anonymous") and record
+        and after you have contacts, you can select any contact on the home page
-        your appreciation for... whatever. The main goal is to record what
+        and record your appreciation for... whatever. That is a claim recorded
-        people have given you, to grow gifting economies. Each claim is recorded
         on a custom ledger. The day after being registered, you'll be able to
-        able to register others; later, you can create projects, too.
+        register others; later, you can create projects, too.
       </p>
       <p>
-        Note that there are limits to how many others each person can register,
+        Note that there are limits to how many each person can register, so you
-        so you may have to wait.
+        may have to wait.
       </p>
 
       <h2 class="text-xl font-semibold">How do I backup all my data?</h2>
@@ -131,9 +130,7 @@
 
       <h2 class="text-xl font-semibold">How do I create another identity?</h2>
       <p>
-        Before doing this, note that it is an advanced feature that affects
+        Go
-        functionality (eg. the words "Alt ID" next to results, backup features)
-        so beware if you think that may cause confusion. You can
         <router-link to="start" class="text-blue-500">
           create another identity here.
         </router-link>

src/views/HomeView.vue

@@ -7,7 +7,141 @@
     </h1>
 
     <div class="mb-8">
-      <h2 class="text-xl font-bold">Record a Gift</h2>
+      <h2 class="text-xl font-bold mb-4">Notiwind Alert Test Suite</h2>
+
+      <button
+        @click="
+          this.$notify(
+            {
+              group: 'alert',
+              type: 'toast',
+              text: 'I\'m a toast. Don\'t mind me.',
+            },
+            5000,
+          )
+        "
+        class="font-bold uppercase bg-slate-400 text-white px-3 py-2 rounded-md mr-2"
+      >
+        Toast (self-dismiss)
+      </button>
+
+      <button
+        @click="
+          this.$notify(
+            {
+              group: 'alert',
+              type: 'info',
+              title: 'Information Alert',
+              text: 'Just wanted you to know.',
+            },
+            -1,
+          )
+        "
+        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
+      >
+        Info
+      </button>
+
+      <button
+        @click="
+          this.$notify(
+            {
+              group: 'alert',
+              type: 'success',
+              title: 'Success Alert',
+              text: 'Congratulations!',
+            },
+            -1,
+          )
+        "
+        class="font-bold uppercase bg-emerald-600 text-white px-3 py-2 rounded-md mr-2"
+      >
+        Success
+      </button>
+
+      <button
+        @click="
+          this.$notify(
+            {
+              group: 'alert',
+              type: 'warning',
+              title: 'Warning Alert',
+              text: 'You might wanna look at this.',
+            },
+            -1,
+          )
+        "
+        class="font-bold uppercase bg-amber-600 text-white px-3 py-2 rounded-md mr-2"
+      >
+        Warning
+      </button>
+
+      <button
+        @click="
+          this.$notify(
+            {
+              group: 'alert',
+              type: 'danger',
+              title: 'Danger Alert',
+              text: 'Something terrible has happened!',
+            },
+            -1,
+          )
+        "
+        class="font-bold uppercase bg-rose-600 text-white px-3 py-2 rounded-md mr-2"
+      >
+        Danger
+      </button>
+
+      <button
+        @click="
+          this.$notify(
+            {
+              group: 'modal',
+              type: 'notification-permission',
+            },
+            -1,
+          )
+        "
+        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
+      >
+        Notif ON
+      </button>
+
+      <button
+        @click="
+          this.$notify(
+            {
+              group: 'modal',
+              type: 'notification-mute',
+            },
+            -1,
+          )
+        "
+        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
+      >
+        Notif MUTE
+      </button>
+
+      <button
+        @click="
+          this.$notify(
+            {
+              group: 'modal',
+              type: 'notification-off',
+            },
+            -1,
+          )
+        "
+        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
+      >
+        Notif OFF
+      </button>
+    </div>
+
+    <div class="mb-8">
+      <h2 class="text-xl font-bold">Quick Action</h2>
+      <p class="mb-4">Record a gift from a contact:</p>
 
       <ul class="grid grid-cols-4 gap-x-3 gap-y-5 text-center mb-5">
         <li @click="openDialog()">
@@ -281,7 +415,6 @@ export default class HomeView extends Vue {
   }
 
   giveDescription(giveRecord: GiveServerRecord) {
-    // similar code is in endorser-mobile utility.ts
     // claim.claim happen for some claims wrapped in a Verifiable Credential
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const claim = (giveRecord.fullClaim as any).claim || giveRecord.fullClaim;
@@ -294,18 +427,9 @@ export default class HomeView extends Vue {
       this.allMyDids,
       this.allContacts,
     );
-    let gaveAmount = claim.object?.amountOfThisGood
+    const gaveAmount = claim.object?.amountOfThisGood
       ? this.displayAmount(claim.object.unitCode, claim.object.amountOfThisGood)
-      : "";
+      : claim.description || "something unknown";
-    if (claim.description) {
-      if (gaveAmount) {
-        gaveAmount = gaveAmount + ", and also: ";
-      }
-      gaveAmount = gaveAmount + claim.description;
-    }
-    if (!gaveAmount) {
-      gaveAmount = "something not described";
-    }
     // recipient.did is for legacy data, before March 2023
     const gaveRecipientId =
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -319,7 +443,7 @@ export default class HomeView extends Vue {
           this.allContacts,
         )
       : "";
-    return giverInfo + " gave" + gaveRecipientInfo + ": " + gaveAmount;
+    return giverInfo + " gave " + gaveAmount + gaveRecipientInfo;
   }
 
   displayAmount(code: string, amt: number) {
@@ -399,18 +523,15 @@ export default class HomeView extends Vue {
         hours,
       );
 
-      if (
+      if (this.isGiveCreationError(result)) {
-        result.type === "error" ||
-        this.isGiveCreationError(result.response)
-      ) {
         const errorMessage = this.getGiveCreationErrorMessage(result);
-        console.log("Error with give creation result:", result);
+        console.log("Error with give result:", result);
         this.$notify(
           {
             group: "alert",
             type: "danger",
             title: "Error",
-            text: errorMessage || "There was an error creating the give.",
+            text: errorMessage || "There was an error recording the give.",
           },
           -1,
         );
@@ -427,7 +548,7 @@ export default class HomeView extends Vue {
       }
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (error: any) {
-      console.log("Error with give recordation caught:", error);
+      console.log("Error with give caught:", error);
       const message =
         error.userMessage ||
         error.response?.data?.error?.message ||
@@ -446,26 +567,14 @@ export default class HomeView extends Vue {
 
   // Helper functions for readability
 
-  /**
-   * @param result response "data" from the server
-   * @returns true if the result indicates an error
-   */
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   isGiveCreationError(result: any) {
     return result.status !== 201 || result.data?.error;
   }
 
-  /**
-   * @param result direct response eg. ErrorResult or SuccessResult (potentially with embedded "data")
-   * @returns best guess at an error message
-   */
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   getGiveCreationErrorMessage(result: any) {
-    return (
+    return result.data?.error?.message;
-      result.error?.userMessage ||
-      result.error?.error ||
-      result.response?.data?.error?.message
-    );
   }
 }
 </script>

src/views/IdentitySwitcherView.vue

@@ -49,9 +49,7 @@
     </ul>
 
     <!-- Actions -->
-    <!-- id used by puppeteer test script -->
     <router-link
-      id="start-link"
       :to="{ name: 'start' }"
       class="block text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-2"
     >

src/views/ImportAccountView.vue

@@ -17,9 +17,7 @@
     <p class="text-center text-xl mb-4 font-light">
       Enter your seed phrase below to import your identity on this device.
     </p>
-    <!-- id used by puppeteer test script -->
     <input
-      id="seed-input"
       type="text"
       placeholder="Seed Phrase"
       class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"

src/views/NewEditProjectView.vue

@@ -1,5 +1,4 @@
 <template>
-  <QuickNav selected="Projects"></QuickNav>
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24">
     <!-- Breadcrumb -->
@@ -108,7 +107,6 @@ import * as didJwt from "did-jwt";
 import { Component, Vue } from "vue-facing-decorator";
 import { LMap, LMarker, LTileLayer } from "@vue-leaflet/vue-leaflet";
 
-import QuickNav from "@/components/QuickNav.vue";
 import { accountsDB, db } from "@/db/index";
 import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import { accessToken, SimpleSigner } from "@/libs/crypto";
@@ -124,7 +122,7 @@ interface Notification {
 }
 
 @Component({
-  components: { LMap, LMarker, LTileLayer, QuickNav },
+  components: { LMap, LMarker, LTileLayer },
 })
 export default class NewEditProjectView extends Vue {
   $notify!: (notification: Notification, timeout?: number) => void;

src/views/NewIdentifierView.vue

@@ -46,7 +46,7 @@ import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import QuickNav from "@/components/QuickNav.vue";
 
 @Component({ components: { QuickNav } })
-export default class NewIdentifierView extends Vue {
+export default class AccountViewView extends Vue {
   loading = true;
 
   async mounted() {

src/views/StartView.vue

@@ -8,8 +8,7 @@
       Start Here
     </h1>
 
-    <!-- id used by puppeteer test script -->
+    <div class="mt-8">
-    <div id="start-question" class="mt-8">
       <p class="text-center text-xl mb-4 font-light">
         Do you have an identity to import?
       </p>

src/views/TestView.vue

@@ -1,151 +0,0 @@
-<template>
-  <QuickNav selected="Profile"></QuickNav>
-  <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
-    <!-- Heading -->
-    <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
-      Test
-    </h1>
-
-    <div class="mb-8">
-      <h2 class="text-xl font-bold mb-4">Notiwind Alert Test Suite</h2>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'alert',
-              type: 'toast',
-              text: 'I\'m a toast. Don\'t mind me.',
-            },
-            5000,
-          )
-        "
-        class="font-bold uppercase bg-slate-400 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Toast (self-dismiss)
-      </button>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'alert',
-              type: 'info',
-              title: 'Information Alert',
-              text: 'Just wanted you to know.',
-            },
-            -1,
-          )
-        "
-        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Info
-      </button>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'alert',
-              type: 'success',
-              title: 'Success Alert',
-              text: 'Congratulations!',
-            },
-            -1,
-          )
-        "
-        class="font-bold uppercase bg-emerald-600 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Success
-      </button>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'alert',
-              type: 'warning',
-              title: 'Warning Alert',
-              text: 'You might wanna look at this.',
-            },
-            -1,
-          )
-        "
-        class="font-bold uppercase bg-amber-600 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Warning
-      </button>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'alert',
-              type: 'danger',
-              title: 'Danger Alert',
-              text: 'Something terrible has happened!',
-            },
-            -1,
-          )
-        "
-        class="font-bold uppercase bg-rose-600 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Danger
-      </button>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'modal',
-              type: 'notification-permission',
-            },
-            -1,
-          )
-        "
-        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Notif ON
-      </button>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'modal',
-              type: 'notification-mute',
-            },
-            -1,
-          )
-        "
-        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Notif MUTE
-      </button>
-
-      <button
-        @click="
-          this.$notify(
-            {
-              group: 'modal',
-              type: 'notification-off',
-            },
-            -1,
-          )
-        "
-        class="font-bold uppercase bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
-      >
-        Notif OFF
-      </button>
-    </div>
-  </section>
-</template>
-
-<script lang="ts">
-import { Component, Vue } from "vue-facing-decorator";
-import QuickNav from "@/components/QuickNav.vue";
-
-@Component({ components: { QuickNav } })
-export default class Help extends Vue {}
-</script>