From 45b54db01e18b550f98e0e373533744e3037f40d Mon Sep 17 00:00:00 2001
From: Trent Larson <trent@trentlarson.com>
Date: Sun, 19 Mar 2023 16:25:19 -0600
Subject: [PATCH 1/5] separate account from other data for backup/restore

---
 README.md                               |  4 +--
 src/db/index.ts                         | 41 +++++++++++++------------
 src/db/tables/{index.ts => accounts.ts} | 26 ----------------
 src/db/tables/contacts.ts               | 11 +++++++
 src/db/tables/settings.ts               | 13 ++++++++
 src/router/index.ts                     |  6 ++--
 src/test/index.ts                       |  6 ++--
 src/views/AccountViewView.vue           | 33 ++++++++++----------
 src/views/ContactsView.vue              | 10 +++---
 src/views/ImportAccountView.vue         |  8 ++---
 src/views/NewEditAccountView.vue        |  6 ++--
 src/views/NewEditProjectView.vue        | 14 ++++-----
 src/views/ProjectViewView.vue           |  8 ++---
 src/views/ProjectsView.vue              |  8 ++---
 14 files changed, 99 insertions(+), 95 deletions(-)
 rename src/db/tables/{index.ts => accounts.ts} (50%)
 create mode 100644 src/db/tables/contacts.ts
 create mode 100644 src/db/tables/settings.ts

diff --git a/README.md b/README.md
index 9b43e43..79bbd90 100644
--- a/README.md
+++ b/README.md
@@ -48,9 +48,9 @@ On the test server, User #0 has rights to register others, so you can start play
 
 - Register someone else under User #0 on the `/account` page:
 
-  * Edit the `src/views/AccountViewView.vue` file and uncomment the lines referring to "test".
+  * Edit the `src/views/AccountViewView.vue` file and uncomment the lines referring to "testServerRegisterUser".
 
-  * Use the [Vue Devtools browser extension](https://devtools.vuejs.org/) and type this into the console: `$vm.ctx.testRegisterUser()`
+  * Visit the `/account` page, open the [Vue Devtools browser extension](https://devtools.vuejs.org/), select a component, then type this into the console: `$vm.ctx.testRegisterUser()`
 
 
 
diff --git a/src/db/index.ts b/src/db/index.ts
index dc7e911..c8c785c 100644
--- a/src/db/index.ts
+++ b/src/db/index.ts
@@ -1,17 +1,19 @@
 import BaseDexie, { Table } from "dexie";
 import { encrypted, Encryption } from "@pvermeer/dexie-encrypted-addon";
+import { Account, AccountsSchema } from "./tables/accounts";
+import { Contact, ContactsSchema } from "./tables/contacts";
 import {
-  Account,
-  AccountsSchema,
-  Contact,
-  ContactsSchema,
-  MASTER_SETTINGS,
+  MASTER_SETTINGS_KEY,
   Settings,
   SettingsSchema,
-} from "./tables";
+} from "./tables/settings";
 
-type AllTables = {
+// a separate DB because the seed is super-sensitive data
+type SensitiveTables = {
   accounts: Table<Account>;
+};
+
+type NonsensitiveTables = {
   contacts: Table<Contact>;
   settings: Table<Settings>;
 };
@@ -24,15 +26,14 @@ type AllTables = {
  *
  *   https://9to5answer.com/how-to-bypass-warning-unexpected-any-specify-a-different-type-typescript-eslint-no-explicit-any
  */
-type DexieTables = AllTables;
-export type Dexie<T extends unknown = DexieTables> = BaseDexie & T;
-export const db = new BaseDexie("KickStart") as Dexie;
-const AllSchemas = Object.assign(
-  {},
-  AccountsSchema,
-  ContactsSchema,
-  SettingsSchema
-);
+export type SensitiveDexie<T extends unknown = SensitiveTables> = BaseDexie & T;
+export const accountsDB = new BaseDexie("KickStartSensitive") as SensitiveDexie;
+const SensitiveSchemas = Object.assign({}, AccountsSchema);
+
+export type NonsensitiveDexie<T extends unknown = NonsensitiveTables> =
+  BaseDexie & T;
+export const db = new BaseDexie("KickStart") as NonsensitiveDexie;
+const NonsensitiveSchemas = Object.assign({}, ContactsSchema, SettingsSchema);
 
 /**
  * Needed to enable a special webpack setting to allow *await* below:
@@ -48,11 +49,13 @@ if (localStorage.getItem("secret") == null) {
 }
 
 //console.log("IndexedDB Encryption Secret:", secret);
-encrypted(db, { secretKey: secret });
-db.version(1).stores(AllSchemas);
+encrypted(accountsDB, { secretKey: secret });
+accountsDB.version(1).stores(SensitiveSchemas);
+
+db.version(1).stores(NonsensitiveSchemas);
 
 // initialize, a la https://dexie.org/docs/Tutorial/Design#the-populate-event
 db.on("populate", function () {
   // ensure there's an initial entry for settings
-  db.settings.add({ id: MASTER_SETTINGS });
+  db.settings.add({ id: MASTER_SETTINGS_KEY });
 });
diff --git a/src/db/tables/index.ts b/src/db/tables/accounts.ts
similarity index 50%
rename from src/db/tables/index.ts
rename to src/db/tables/accounts.ts
index 6b7b62f..9602439 100644
--- a/src/db/tables/index.ts
+++ b/src/db/tables/accounts.ts
@@ -13,29 +13,3 @@ export const AccountsSchema = {
   accounts:
     "++id, dateCreated, derivationPath, $identity, $mnemonic, publicKeyHex",
 };
-
-export interface Contact {
-  did: string;
-  name?: string;
-  publicKeyBase64?: string;
-  seesMe?: boolean;
-  registered?: boolean;
-}
-
-export const ContactsSchema = {
-  contacts: "++did, name, publicKeyBase64, registered, seesMe",
-};
-
-// a singleton
-export type Settings = {
-  id: number;
-  firstName?: string;
-  lastName?: string;
-  showContactGivesInline?: boolean;
-};
-
-export const SettingsSchema = {
-  settings: "id",
-};
-
-export const MASTER_SETTINGS = 1;
diff --git a/src/db/tables/contacts.ts b/src/db/tables/contacts.ts
new file mode 100644
index 0000000..00923f5
--- /dev/null
+++ b/src/db/tables/contacts.ts
@@ -0,0 +1,11 @@
+export interface Contact {
+  did: string;
+  name?: string;
+  publicKeyBase64?: string;
+  seesMe?: boolean;
+  registered?: boolean;
+}
+
+export const ContactsSchema = {
+  contacts: "++did, name, publicKeyBase64, registered, seesMe",
+};
diff --git a/src/db/tables/settings.ts b/src/db/tables/settings.ts
new file mode 100644
index 0000000..1da602a
--- /dev/null
+++ b/src/db/tables/settings.ts
@@ -0,0 +1,13 @@
+// a singleton
+export type Settings = {
+  id: number;
+  firstName?: string;
+  lastName?: string;
+  showContactGivesInline?: boolean;
+};
+
+export const SettingsSchema = {
+  settings: "id",
+};
+
+export const MASTER_SETTINGS_KEY = 1;
diff --git a/src/router/index.ts b/src/router/index.ts
index 376cfd7..83305a3 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -1,5 +1,5 @@
 import { createRouter, createWebHistory, RouteRecordRaw } from "vue-router";
-import { db } from "@/db";
+import { accountsDB } from "@/db";
 
 const routes: Array<RouteRecordRaw> = [
   {
@@ -8,8 +8,8 @@ const routes: Array<RouteRecordRaw> = [
     component: () =>
       import(/* webpackChunkName: "start" */ "../views/DiscoverView.vue"),
     beforeEnter: async (to, from, next) => {
-      await db.open();
-      const num_accounts = await db.accounts.count();
+      await accountsDB.open();
+      const num_accounts = await accountsDB.accounts.count();
       if (num_accounts > 0) {
         next();
       } else {
diff --git a/src/test/index.ts b/src/test/index.ts
index 4f10fb7..fe593da 100644
--- a/src/test/index.ts
+++ b/src/test/index.ts
@@ -1,7 +1,7 @@
 import axios from "axios";
 import * as didJwt from "did-jwt";
 import { AppString } from "@/constants/app";
-import { db } from "../db";
+import { accountsDB } from "../db";
 import { SERVICE_ID } from "../libs/veramo/setup";
 import { deriveAddress, newIdentifier } from "../libs/crypto";
 
@@ -13,8 +13,8 @@ export async function testServerRegisterUser() {
 
   const identity0 = newIdentifier(addr, publicHex, privateHex, deriPath);
 
-  await db.open();
-  const accounts = await db.accounts.toArray();
+  await accountsDB.open();
+  const accounts = await accountsDB.accounts.toArray();
   const thisIdentity = JSON.parse(accounts[0].identity);
 
   // Make a claim
diff --git a/src/views/AccountViewView.vue b/src/views/AccountViewView.vue
index 01bdf49..3a3a514 100644
--- a/src/views/AccountViewView.vue
+++ b/src/views/AccountViewView.vue
@@ -200,17 +200,17 @@
 <script lang="ts">
 import { Options, Vue } from "vue-class-component";
 import { useClipboard } from "@vueuse/core";
-import { db } from "@/db";
-import { MASTER_SETTINGS } from "@/db/tables";
+import { db, accountsDB } from "@/db";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import { deriveAddress, generateSeed, newIdentifier } from "@/libs/crypto";
-//import { testServerRegisterUser } from "../test";
+import { testServerRegisterUser } from "../test";
 
 @Options({
   components: {},
 })
 export default class AccountViewView extends Vue {
   // This registers current user in vue plugin with: $vm.ctx.testRegisterUser()
-  //testRegisterUser = testServerRegisterUser;
+  testRegisterUser = testServerRegisterUser;
 
   address = "";
   firstName = "";
@@ -224,16 +224,17 @@ export default class AccountViewView extends Vue {
 
   // 'created' hook runs when the Vue instance is first created
   async created() {
-    await db.open();
     try {
-      const settings = await db.settings.get(MASTER_SETTINGS);
+      await db.open();
+      const settings = await db.settings.get(MASTER_SETTINGS_KEY);
       if (settings) {
         this.firstName = settings.firstName || "";
         this.lastName = settings.lastName || "";
         this.showContactGives = !!settings.showContactGivesInline;
       }
 
-      const numAccounts = await db.accounts.count();
+      await accountsDB.open();
+      const numAccounts = await accountsDB.accounts.count();
       if (numAccounts === 0) {
         let privateHex = "";
         this.mnemonic = generateSeed();
@@ -246,7 +247,7 @@ export default class AccountViewView extends Vue {
           privateHex,
           this.derivationPath
         );
-        await db.accounts.add({
+        await accountsDB.accounts.add({
           dateCreated: new Date().toISOString(),
           derivationPath: this.derivationPath,
           identity: JSON.stringify(newId),
@@ -254,6 +255,12 @@ export default class AccountViewView extends Vue {
           publicKeyHex: newId.keys[0].publicKeyHex,
         });
       }
+
+      const accounts = await accountsDB.accounts.toArray();
+      const identity = JSON.parse(accounts[0].identity);
+      this.address = identity.did;
+      this.publicHex = identity.keys[0].publicKeyHex;
+      this.derivationPath = identity.keys[0].meta.derivationPath;
     } catch (err) {
       this.alertMessage =
         "Clear your cache and start over (after data backup). See console log for more info.";
@@ -261,21 +268,15 @@ export default class AccountViewView extends Vue {
       this.alertTitle = "Error Creating Account";
       this.isAlertVisible = true;
     }
-
-    const accounts = await db.accounts.toArray();
-    const identity = JSON.parse(accounts[0].identity);
-    this.address = identity.did;
-    this.publicHex = identity.keys[0].publicKeyHex;
-    this.derivationPath = identity.keys[0].meta.derivationPath;
   }
 
   public async toggleShowContactAmounts() {
     this.showContactGives = !this.showContactGives;
     try {
       await db.open();
-      const settings = await db.settings.get(MASTER_SETTINGS);
+      const settings = await db.settings.get(MASTER_SETTINGS_KEY);
       if (settings) {
-        db.settings.update(MASTER_SETTINGS, {
+        db.settings.update(MASTER_SETTINGS_KEY, {
           showContactGivesInline: this.showContactGives,
         });
       }
diff --git a/src/views/ContactsView.vue b/src/views/ContactsView.vue
index 4d89c7a..9de8c4d 100644
--- a/src/views/ContactsView.vue
+++ b/src/views/ContactsView.vue
@@ -140,8 +140,8 @@ import { Options, Vue } from "vue-class-component";
 import { AppString } from "@/constants/app";
 import { accessToken, SimpleSigner } from "@/libs/crypto";
 import { IIdentifier } from "@veramo/core";
-import { db } from "../db";
-import { Contact } from "../db/tables";
+import { accountsDB, db } from "../db";
+import { Contact } from "../db/tables/contacts";
 
 export interface GiveVerifiableCredential {
   "@context": string;
@@ -169,9 +169,11 @@ export default class ContactsView extends Vue {
 
   // 'created' hook runs when the Vue instance is first created
   async created() {
-    await db.open();
-    const accounts = await db.accounts.toArray();
+    await accountsDB.open();
+    const accounts = await accountsDB.accounts.toArray();
     this.identity = JSON.parse(accounts[0].identity);
+
+    await db.open();
     this.contacts = await db.contacts.toArray();
 
     const params = new URLSearchParams(window.location.search);
diff --git a/src/views/ImportAccountView.vue b/src/views/ImportAccountView.vue
index 73a7359..fa13803 100644
--- a/src/views/ImportAccountView.vue
+++ b/src/views/ImportAccountView.vue
@@ -45,7 +45,7 @@
 <script lang="ts">
 import { Options, Vue } from "vue-class-component";
 import { deriveAddress, newIdentifier } from "../libs/crypto";
-import { db } from "@/db";
+import { accountsDB } from "@/db";
 
 @Options({
   components: {},
@@ -75,10 +75,10 @@ export default class ImportAccountView extends Vue {
       );
 
       try {
-        await db.open();
-        const num_accounts = await db.accounts.count();
+        await accountsDB.open();
+        const num_accounts = await accountsDB.accounts.count();
         if (num_accounts === 0) {
-          await db.accounts.add({
+          await accountsDB.accounts.add({
             dateCreated: new Date().toISOString(),
             derivationPath: this.derivationPath,
             identity: JSON.stringify(newId),
diff --git a/src/views/NewEditAccountView.vue b/src/views/NewEditAccountView.vue
index d63d401..dd0bcca 100644
--- a/src/views/NewEditAccountView.vue
+++ b/src/views/NewEditAccountView.vue
@@ -51,7 +51,7 @@
 <script lang="ts">
 import { Options, Vue } from "vue-class-component";
 import { db } from "@/db";
-import { MASTER_SETTINGS } from "@/db/tables";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 
 @Options({
   components: {},
@@ -69,7 +69,7 @@ export default class NewEditAccountView extends Vue {
   // 'created' hook runs when the Vue instance is first created
   async created() {
     await db.open();
-    const settings = await db.settings.get(MASTER_SETTINGS);
+    const settings = await db.settings.get(MASTER_SETTINGS_KEY);
     if (settings) {
       this.firstName = settings.firstName || "";
       this.lastName = settings.lastName || "";
@@ -77,7 +77,7 @@ export default class NewEditAccountView extends Vue {
   }
 
   onClickSaveChanges() {
-    db.settings.update(MASTER_SETTINGS, {
+    db.settings.update(MASTER_SETTINGS_KEY, {
       firstName: this.firstName,
       lastName: this.lastName,
     });
diff --git a/src/views/NewEditProjectView.vue b/src/views/NewEditProjectView.vue
index bb153aa..ebe13ae 100644
--- a/src/views/NewEditProjectView.vue
+++ b/src/views/NewEditProjectView.vue
@@ -78,7 +78,7 @@
 <script lang="ts">
 import { Options, Vue } from "vue-class-component";
 import { AppString } from "@/constants/app";
-import { db } from "../db";
+import { accountsDB } from "../db";
 import { accessToken, SimpleSigner } from "@/libs/crypto";
 import * as didJwt from "did-jwt";
 import { IIdentifier } from "@veramo/core";
@@ -112,12 +112,12 @@ export default class NewEditProjectView extends Vue {
     if (this.projectId === "") {
       console.log("This is a new project");
     } else {
-      await db.open();
-      const num_accounts = await db.accounts.count();
+      await accountsDB.open();
+      const num_accounts = await accountsDB.accounts.count();
       if (num_accounts === 0) {
         console.log("Problem!  Should have a profile!");
       } else {
-        const accounts = await db.accounts.toArray();
+        const accounts = await accountsDB.accounts.toArray();
         const identity = JSON.parse(accounts[0].identity);
         this.LoadProject(identity);
       }
@@ -254,12 +254,12 @@ export default class NewEditProjectView extends Vue {
   public async onSaveProjectClick() {
     this.isHiddenSave = true;
     this.isHiddenSpinner = false;
-    await db.open();
-    const num_accounts = await db.accounts.count();
+    await accountsDB.open();
+    const num_accounts = await accountsDB.accounts.count();
     if (num_accounts === 0) {
       console.log("Problem!  Should have a profile!");
     } else {
-      const accounts = await db.accounts.toArray();
+      const accounts = await accountsDB.accounts.toArray();
       const identity = JSON.parse(accounts[0].identity);
       this.SaveProject(identity);
     }
diff --git a/src/views/ProjectViewView.vue b/src/views/ProjectViewView.vue
index e8577ff..8ca5d00 100644
--- a/src/views/ProjectViewView.vue
+++ b/src/views/ProjectViewView.vue
@@ -146,7 +146,7 @@
 <script lang="ts">
 import { Options, Vue } from "vue-class-component";
 import { accessToken } from "@/libs/crypto";
-import { db } from "../db";
+import { accountsDB } from "../db";
 import { IIdentifier } from "@veramo/core";
 import { AppString } from "@/constants/app";
 import * as moment from "moment";
@@ -224,12 +224,12 @@ export default class ProjectViewView extends Vue {
 
   // 'created' hook runs when the Vue instance is first created
   async created() {
-    await db.open();
-    const num_accounts = await db.accounts.count();
+    await accountsDB.open();
+    const num_accounts = await accountsDB.accounts.count();
     if (num_accounts === 0) {
       console.log("Problem!  Should have a profile!");
     } else {
-      const accounts = await db.accounts.toArray();
+      const accounts = await accountsDB.accounts.toArray();
       const identity = JSON.parse(accounts[0].identity);
       this.LoadProject(identity);
     }
diff --git a/src/views/ProjectsView.vue b/src/views/ProjectsView.vue
index 46660cd..d65e210 100644
--- a/src/views/ProjectsView.vue
+++ b/src/views/ProjectsView.vue
@@ -103,7 +103,7 @@
 <script lang="ts">
 import { Options, Vue } from "vue-class-component";
 import { accessToken } from "@/libs/crypto";
-import { db } from "../db";
+import { accountsDB } from "../db";
 import { IIdentifier } from "@veramo/core";
 import { AppString } from "@/constants/app";
 
@@ -155,12 +155,12 @@ export default class ProjectsView extends Vue {
 
   // 'created' hook runs when the Vue instance is first created
   async created() {
-    await db.open();
-    const num_accounts = await db.accounts.count();
+    await accountsDB.open();
+    const num_accounts = await accountsDB.accounts.count();
     if (num_accounts === 0) {
       console.log("Problem!  Should have a profile!");
     } else {
-      const accounts = await db.accounts.toArray();
+      const accounts = await accountsDB.accounts.toArray();
       const identity = JSON.parse(accounts[0].identity);
       this.LoadProjects(identity);
     }

From 34a50d75b36fa1d87e31af8cd470461b8f92f39d Mon Sep 17 00:00:00 2001
From: Trent Larson <trent@trentlarson.com>
Date: Sun, 19 Mar 2023 17:33:18 -0600
Subject: [PATCH 2/5] remove the handle for test-user registration, and add
 easier instructions

---
 README.md                     |  9 +++++----
 src/views/AccountViewView.vue | 11 +++++++----
 2 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/README.md b/README.md
index 79bbd90..72965aa 100644
--- a/README.md
+++ b/README.md
@@ -44,13 +44,14 @@ New users require registration. This can be done with a claim payload like this
 
 On the test server, User #0 has rights to register others, so you can start playing one of two ways:
 
-- Import the keys for that test User `did:ethr:0x000Ee5654b9742f6Fe18ea970e32b97ee2247B51` by importing this seed phrase: `seminar accuse mystery assist delay law thing deal image undo guard initial shallow wrestle list fragile borrow velvet tomorrow awake explain test offer control`
+- Import the keys for the test User `did:ethr:0x000Ee5654b9742f6Fe18ea970e32b97ee2247B51` by importing this seed phrase:
+  `seminar accuse mystery assist delay law thing deal image undo guard initial shallow wrestle list fragile borrow velvet tomorrow awake explain test offer control`
 
-- Register someone else under User #0 on the `/account` page:
+- Alternatively, register someone else under User #0 on the `/account` page:
 
-  * Edit the `src/views/AccountViewView.vue` file and uncomment the lines referring to "testServerRegisterUser".
+  * In the `src/views/AccountViewView.vue` file, uncomment the lines referring to "testServerRegisterUser".
 
-  * Visit the `/account` page, open the [Vue Devtools browser extension](https://devtools.vuejs.org/), select a component, then type this into the console: `$vm.ctx.testRegisterUser()`
+  * Visit the `/account` page.
 
 
 
diff --git a/src/views/AccountViewView.vue b/src/views/AccountViewView.vue
index 3a3a514..3a8781d 100644
--- a/src/views/AccountViewView.vue
+++ b/src/views/AccountViewView.vue
@@ -203,15 +203,12 @@ import { useClipboard } from "@vueuse/core";
 import { db, accountsDB } from "@/db";
 import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import { deriveAddress, generateSeed, newIdentifier } from "@/libs/crypto";
-import { testServerRegisterUser } from "../test";
+//import { testServerRegisterUser } from "../test";
 
 @Options({
   components: {},
 })
 export default class AccountViewView extends Vue {
-  // This registers current user in vue plugin with: $vm.ctx.testRegisterUser()
-  testRegisterUser = testServerRegisterUser;
-
   address = "";
   firstName = "";
   lastName = "";
@@ -224,6 +221,12 @@ export default class AccountViewView extends Vue {
 
   // 'created' hook runs when the Vue instance is first created
   async created() {
+    // Uncomment to register this user on the test server.
+    // To manage within the vue devtools browser extension https://devtools.vuejs.org/
+    // assign this to a class variable, eg. "registerThisUser = testServerRegisterUser",
+    // select a component in the extension, and enter in the console: $vm.ctx.registerThisUser()
+    //testServerRegisterUser();
+
     try {
       await db.open();
       const settings = await db.settings.get(MASTER_SETTINGS_KEY);

From c7fa6823bc5f7c50ce77ca51abf15aed45546e4f Mon Sep 17 00:00:00 2001
From: Trent Larson <trent@trentlarson.com>
Date: Sun, 19 Mar 2023 18:23:15 -0600
Subject: [PATCH 3/5] add DB export

---
 package-lock.json             |  9 ++++++++
 package.json                  |  1 +
 project.yaml                  |  3 +++
 src/db/index.ts               |  2 +-
 src/views/AccountViewView.vue | 42 ++++++++++++++++++++++++++++++-----
 5 files changed, 50 insertions(+), 7 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 06b8ae2..3814b71 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -26,6 +26,7 @@
         "class-transformer": "^0.5.1",
         "core-js": "^3.26.1",
         "dexie": "^3.2.2",
+        "dexie-export-import": "^4.0.6",
         "did-jwt": "^6.9.0",
         "ethereum-cryptography": "^1.1.2",
         "ethereumjs-util": "^7.1.5",
@@ -12187,6 +12188,14 @@
         "node": ">=6.0"
       }
     },
+    "node_modules/dexie-export-import": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmjs.org/dexie-export-import/-/dexie-export-import-4.0.6.tgz",
+      "integrity": "sha512-WFTSm/XB4MNHBZVQJTrWjWvqur7vfpx1mWEWMuTUB9zdW3FTXvkpm7SvsUX55r6y6wmJ3libwA5eRCbVUKmuTw==",
+      "peerDependencies": {
+        "dexie": "^2.0.4 || ^3.0.0 || ^4.0.1-alpha.5"
+      }
+    },
     "node_modules/did-jwt": {
       "version": "6.9.0",
       "resolved": "https://registry.npmjs.org/did-jwt/-/did-jwt-6.9.0.tgz",
diff --git a/package.json b/package.json
index e880fd5..9a7a3cb 100644
--- a/package.json
+++ b/package.json
@@ -26,6 +26,7 @@
     "class-transformer": "^0.5.1",
     "core-js": "^3.26.1",
     "dexie": "^3.2.2",
+    "dexie-export-import": "^4.0.6",
     "did-jwt": "^6.9.0",
     "ethereum-cryptography": "^1.1.2",
     "ethereumjs-util": "^7.1.5",
diff --git a/project.yaml b/project.yaml
index 8e2141f..b5b654c 100644
--- a/project.yaml
+++ b/project.yaml
@@ -16,6 +16,9 @@
   - .2 show error to user when adding a duplicate contact
   - parse input more robustly (with CSV lib and not commas)
 
+- refactor alerts:
+  - They show at the top and can be missed, eg. account bakcup download
+
 - commit screen
 
 - discover screen
diff --git a/src/db/index.ts b/src/db/index.ts
index c8c785c..6806b60 100644
--- a/src/db/index.ts
+++ b/src/db/index.ts
@@ -27,7 +27,7 @@ type NonsensitiveTables = {
  *   https://9to5answer.com/how-to-bypass-warning-unexpected-any-specify-a-different-type-typescript-eslint-no-explicit-any
  */
 export type SensitiveDexie<T extends unknown = SensitiveTables> = BaseDexie & T;
-export const accountsDB = new BaseDexie("KickStartSensitive") as SensitiveDexie;
+export const accountsDB = new BaseDexie("KickStartAccounts") as SensitiveDexie;
 const SensitiveSchemas = Object.assign({}, AccountsSchema);
 
 export type NonsensitiveDexie<T extends unknown = NonsensitiveTables> =
diff --git a/src/views/AccountViewView.vue b/src/views/AccountViewView.vue
index 3a8781d..f15cb22 100644
--- a/src/views/AccountViewView.vue
+++ b/src/views/AccountViewView.vue
@@ -122,29 +122,34 @@
     <router-link
       :to="{ name: 'new-edit-account' }"
       class="block text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-8"
-      >Edit Identity</router-link
     >
+      Edit Identity
+    </router-link>
 
     <h3 class="text-sm uppercase font-semibold mb-3">Contact Actions</h3>
 
     <a
       href="contact-scan.html"
       class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md mb-6"
-      >Scan New Contact</a
     >
+      Scan New Contact
+    </a>
 
-    <h3 class="text-sm uppercase font-semibold mb-3">Identity Actions</h3>
+    <h3 class="text-sm uppercase font-semibold mb-3">Data</h3>
 
     <a
       href=""
       class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md mb-2"
-      >Backup Seed</a
     >
+      Backup Identifier Seed
+    </a>
     <a
-      href=""
       class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md mb-6"
-      >Backup Other Data</a
+      @click="exportDatabase()"
     >
+      Download Settings & Contacts (excluding Identifier Data)
+    </a>
+    <a ref="downloadLink" />
 
     <!-- QR code popup -->
     <dialog id="dlgQR" class="backdrop:bg-black/75 rounded-md">
@@ -198,6 +203,7 @@
 </template>
 
 <script lang="ts">
+import "dexie-export-import";
 import { Options, Vue } from "vue-class-component";
 import { useClipboard } from "@vueuse/core";
 import { db, accountsDB } from "@/db";
@@ -299,6 +305,30 @@ export default class AccountViewView extends Vue {
     };
   }
 
+  public async exportDatabase() {
+    try {
+      const blob = await db.export({ prettyJson: true });
+      const url = URL.createObjectURL(blob);
+
+      console.log("typeof", typeof this.$refs.downloadLink);
+      const downloadAnchor = this.$refs.downloadLink as HTMLAnchorElement;
+      downloadAnchor.href = url;
+      downloadAnchor.download = db.name + "-backup.json";
+      downloadAnchor.click();
+
+      URL.revokeObjectURL(url);
+
+      this.alertTitle = "Download Started";
+      this.alertMessage = "See your downloads directory for the backup.";
+      this.isAlertVisible = true;
+    } catch (error) {
+      this.alertTitle = "Export Error";
+      this.alertMessage = "See console logs for more info.";
+      this.isAlertVisible = true;
+      console.error("Export Error:", error);
+    }
+  }
+
   alertMessage = "";
   alertTitle = "";
   isAlertVisible = false;

From 4cec3859ea44af28912445b5eea0ae6e623751da Mon Sep 17 00:00:00 2001
From: Trent Larson <trent@trentlarson.com>
Date: Sun, 19 Mar 2023 18:29:02 -0600
Subject: [PATCH 4/5] refactor: misc tweaks for types, lint, etc

---
 project.yaml                     |  2 +-
 src/views/AccountViewView.vue    |  1 -
 src/views/NewEditProjectView.vue | 15 ++++++---------
 3 files changed, 7 insertions(+), 11 deletions(-)

diff --git a/project.yaml b/project.yaml
index b5b654c..f9b35da 100644
--- a/project.yaml
+++ b/project.yaml
@@ -17,7 +17,7 @@
   - parse input more robustly (with CSV lib and not commas)
 
 - refactor alerts:
-  - They show at the top and can be missed, eg. account bakcup download
+  - They show at the top and can be missed, eg. account data download
 
 - commit screen
 
diff --git a/src/views/AccountViewView.vue b/src/views/AccountViewView.vue
index f15cb22..e12ca29 100644
--- a/src/views/AccountViewView.vue
+++ b/src/views/AccountViewView.vue
@@ -310,7 +310,6 @@ export default class AccountViewView extends Vue {
       const blob = await db.export({ prettyJson: true });
       const url = URL.createObjectURL(blob);
 
-      console.log("typeof", typeof this.$refs.downloadLink);
       const downloadAnchor = this.$refs.downloadLink as HTMLAnchorElement;
       downloadAnchor.href = url;
       downloadAnchor.download = db.name + "-backup.json";
diff --git a/src/views/NewEditProjectView.vue b/src/views/NewEditProjectView.vue
index ebe13ae..03fcffc 100644
--- a/src/views/NewEditProjectView.vue
+++ b/src/views/NewEditProjectView.vue
@@ -126,8 +126,10 @@ export default class NewEditProjectView extends Vue {
 
   async LoadProject(identity: IIdentifier) {
     const endorserApiServer = AppString.DEFAULT_ENDORSER_API_SERVER;
-    // eslint-disable-next-line prettier/prettier
-    const url = endorserApiServer + "/api/claim/byHandle/" + encodeURIComponent(this.projectId);
+    const url =
+      endorserApiServer +
+      "/api/claim/byHandle/" +
+      encodeURIComponent(this.projectId);
     const token = await accessToken(identity);
     const headers = {
       "Content-Type": "application/json",
@@ -161,7 +163,6 @@ export default class NewEditProjectView extends Vue {
     }
     // Make a payload for the claim
     const vcPayload = {
-      sub: "PlanAction",
       vc: {
         "@context": ["https://www.w3.org/2018/credentials/v1"],
         type: ["VerifiableCredential"],
@@ -169,12 +170,8 @@ export default class NewEditProjectView extends Vue {
       },
     };
     // create a signature using private key of identity
-    if (
-      identity.keys[0].privateKeyHex !== "undefined" &&
-      identity.keys[0].privateKeyHex !== null
-    ) {
-      // eslint-disable-next-line
-      const privateKeyHex: string = identity.keys[0].privateKeyHex!;
+    if (identity.keys[0].privateKeyHex != null) {
+      const privateKeyHex: string = identity.keys[0].privateKeyHex;
       const signer = await SimpleSigner(privateKeyHex);
       const alg = undefined;
       // create a JWT for the request

From 07bba55a3098c00b8c1c5d5fa309b935914c8245 Mon Sep 17 00:00:00 2001
From: Trent Larson <trent@trentlarson.com>
Date: Sun, 19 Mar 2023 19:47:37 -0600
Subject: [PATCH 5/5] add help page; add tasks for rest of "contact giving"
 functions

---
 project.yaml                  |  16 +++-
 src/router/index.ts           |   6 ++
 src/views/AccountViewView.vue |  14 +++-
 src/views/ContactsView.vue    |   2 +-
 src/views/DiscoverView.vue    |   2 +-
 src/views/HelpView.vue        | 139 ++++++++++++++++++++++++++++++++++
 src/views/ProjectViewView.vue |   6 +-
 src/views/ProjectsView.vue    |   2 +-
 8 files changed, 178 insertions(+), 9 deletions(-)
 create mode 100644 src/views/HelpView.vue

diff --git a/project.yaml b/project.yaml
index f9b35da..a94ad5a 100644
--- a/project.yaml
+++ b/project.yaml
@@ -11,13 +11,23 @@
 
 - replace user-affecting console.logs with error messages (eg. catches)
 
-- contacts v1:
+- contacts v1 :
+  - .2 show gives with new setting
+  - 01 show gives with confirmations
+  - .5 Add page to show seed.
+  - 01 Provide a way to import the non-sensitive data.
+  - 01 Provide way to share your contact info.
+  - .1 remove "scan new contact"
+
+- contacts v+ :
   - .5 make advanced "show/hide amounts" button into a nice UI toggle
   - .2 show error to user when adding a duplicate contact
   - parse input more robustly (with CSV lib and not commas)
 
-- refactor alerts:
-  - They show at the top and can be missed, eg. account data download
+- refactor UI :
+  - .5 Alerts show at the top and can be missed, eg. account data download
+  - 01 Code for "nav" tabs across the bottom is duplicated on each page.
+  - .2 Add "copied" feedback when they click "copy" on /account
 
 - commit screen
 
diff --git a/src/router/index.ts b/src/router/index.ts
index 83305a3..bc4b683 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -63,6 +63,12 @@ const routes: Array<RouteRecordRaw> = [
     component: () =>
       import(/* webpackChunkName: "discover" */ "../views/DiscoverView.vue"),
   },
+  {
+    path: "/help",
+    name: "help",
+    component: () =>
+      import(/* webpackChunkName: "help" */ "../views/HelpView.vue"),
+  },
   {
     path: "/import-account",
     name: "import-account",
diff --git a/src/views/AccountViewView.vue b/src/views/AccountViewView.vue
index e12ca29..43407be 100644
--- a/src/views/AccountViewView.vue
+++ b/src/views/AccountViewView.vue
@@ -26,7 +26,7 @@
           <fa icon="folder-open" class="fa-fw"></fa>
         </router-link>
       </li>
-      <!-- Commitments -->
+      <!-- Contacts -->
       <li class="basis-1/5 rounded-md text-slate-500">
         <router-link
           :to="{ name: 'contacts' }"
@@ -54,6 +54,18 @@
       Your Identity
     </h1>
 
+    <div class="flex justify-between py-2">
+      <span />
+      <span>
+        <router-link
+          :to="{ name: 'help' }"
+          class="text-xs uppercase bg-blue-500 text-white px-1.5 py-1 rounded-md ml-1"
+        >
+          Help
+        </router-link>
+      </span>
+    </div>
+
     <!-- Friend referral requirement notice -->
     <div
       class="bg-amber-200 text-amber-900 border-amber-500 border-dashed border text-center rounded-md overflow-hidden px-4 py-3 mb-4"
diff --git a/src/views/ContactsView.vue b/src/views/ContactsView.vue
index 9de8c4d..0f0ccce 100644
--- a/src/views/ContactsView.vue
+++ b/src/views/ContactsView.vue
@@ -24,7 +24,7 @@
           ><fa icon="folder-open" class="fa-fw"></fa
         ></router-link>
       </li>
-      <!-- Commitments -->
+      <!-- Contacts -->
       <li class="basis-1/5 rounded-md text-slate-500">
         <router-link
           :to="{ name: 'contacts' }"
diff --git a/src/views/DiscoverView.vue b/src/views/DiscoverView.vue
index 7eadab7..51b252a 100644
--- a/src/views/DiscoverView.vue
+++ b/src/views/DiscoverView.vue
@@ -24,7 +24,7 @@
           ><fa icon="folder-open" class="fa-fw"></fa
         ></router-link>
       </li>
-      <!-- Commitments -->
+      <!-- Contacts -->
       <li class="basis-1/5 rounded-md text-slate-500">
         <router-link
           :to="{ name: 'contacts' }"
diff --git a/src/views/HelpView.vue b/src/views/HelpView.vue
new file mode 100644
index 0000000..cac9e87
--- /dev/null
+++ b/src/views/HelpView.vue
@@ -0,0 +1,139 @@
+<template>
+  <!-- QUICK NAV -->
+  <nav id="QuickNav" class="fixed bottom-0 left-0 right-0 bg-slate-200">
+    <ul class="flex text-2xl p-2 gap-2">
+      <!-- Home Feed -->
+      <li class="basis-1/5 rounded-md text-slate-500">
+        <router-link :to="{ name: 'home' }" class="block text-center py-3 px-1">
+          <fa icon="house-chimney" class="fa-fw"></fa>
+        </router-link>
+      </li>
+      <!-- Search -->
+      <li class="basis-1/5 rounded-md text-slate-500">
+        <router-link
+          :to="{ name: 'discover' }"
+          class="block text-center py-3 px-1"
+        >
+          <fa icon="magnifying-glass" class="fa-fw"></fa>
+        </router-link>
+      </li>
+      <!-- Projects -->
+      <li class="basis-1/5 rounded-md text-slate-500">
+        <router-link
+          :to="{ name: 'projects' }"
+          class="block text-center py-3 px-1"
+        >
+          <fa icon="folder-open" class="fa-fw"></fa>
+        </router-link>
+      </li>
+      <!-- Contacts -->
+      <li class="basis-1/5 rounded-md text-slate-500">
+        <router-link
+          :to="{ name: 'contacts' }"
+          class="block text-center py-3 px-1"
+        >
+          <fa icon="users" class="fa-fw"></fa>
+        </router-link>
+      </li>
+      <!-- Profile -->
+      <li class="basis-1/5 rounded-md text-slate-400">
+        <router-link
+          :to="{ name: 'account' }"
+          class="block text-center py-3 px-1"
+        >
+          <fa icon="circle-user" class="fa-fw"></fa>
+        </router-link>
+      </li>
+    </ul>
+  </nav>
+
+  <!-- CONTENT -->
+  <section id="Content" class="p-6 pb-24">
+    <!-- Heading -->
+    <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
+      Help
+    </h1>
+
+    <div>
+      <h2 class="text-xl font-semibold">Introduction</h2>
+      <p>
+        This app is a window into data that you and your friends own, focused on
+        gifts and collaboration.
+      </p>
+
+      <h2 class="text-xl font-semibold">How do I backup all my data?</h2>
+      <p>
+        There are two parts to backup your data: the identifier secrets and the
+        other data such as settings, contacts, etc.
+      </p>
+
+      <div class="px-4">
+        <h2 class="text-xl font-semibold">
+          How do I backup my identifier (secret) data?
+        </h2>
+        <ul class="list-disc list-inside">
+          <li>
+            Go to Your Identity <fa icon="circle-user" class="fa-fw" /> page.
+          </li>
+          <li>
+            Click on "Backup Identifier Seed" and follow the instructions.
+          </li>
+        </ul>
+
+        <h2 class="text-xl font-semibold">
+          How do I backup my other (non-identifier-secret) data?
+        </h2>
+        <ul class="list-disc list-inside">
+          <li>
+            Go to Your Identity <fa icon="circle-user" class="fa-fw" /> page.
+          </li>
+          <li>
+            Click on "Download Settings...". That will save a file to your
+            downloads folder. That is your backup, so put it someplace where you
+            won't lose it.
+          </li>
+        </ul>
+      </div>
+
+      <h2 class="text-xl font-semibold">How do I restore my data?</h2>
+      <p>
+        There are two parts to restore your data: the identity secrets and the
+        other data such as settings, contacts, etc.
+      </p>
+
+      <div class="px-4">
+        <h2 class="text-xl font-semibold">
+          How do I restore my identifier (secret) data?
+        </h2>
+        <ul class="list-disc list-inside">
+          <li>
+            You only have one identifier at a time. If you have an identifier on
+            Your Identity <fa icon="circle-user" class="fa-fw" /> page, you'll
+            need to clear it out;
+            <a
+              href="https://www.lifewire.com/how-to-clear-cache-2617980"
+              class="text-blue-500"
+            >
+              here are some helpful instructions.
+            </a>
+            But beware! This will also clear out your settings and contact data,
+            so be sure to back that up first.
+          </li>
+          <li>
+            <router-link class="text-blue-500" to="/">
+              Go to the start
+            </router-link>
+            and choose "Yes" to enter the identity you backed up.
+          </li>
+        </ul>
+
+        <h2 class="text-xl font-semibold">
+          How do I restore my other (non-identifier-secret) data?
+        </h2>
+        <ul class="list-disc list-inside">
+          <li>Make sure you have your backup file (above), then contact us.</li>
+        </ul>
+      </div>
+    </div>
+  </section>
+</template>
diff --git a/src/views/ProjectViewView.vue b/src/views/ProjectViewView.vue
index 8ca5d00..1ae6d4f 100644
--- a/src/views/ProjectViewView.vue
+++ b/src/views/ProjectViewView.vue
@@ -24,9 +24,11 @@
           ><fa icon="folder-open" class="fa-fw"></fa
         ></router-link>
       </li>
-      <!-- Commitments -->
+      <!-- Contacts -->
       <li class="basis-1/5 rounded-md text-slate-500">
-        <router-link :to="{ name: '' }" class="block text-center py-3 px-1"
+        <router-link
+          :to="{ name: 'contacts' }"
+          class="block text-center py-3 px-1"
           ><fa icon="hand" class="fa-fw"></fa
         ></router-link>
       </li>
diff --git a/src/views/ProjectsView.vue b/src/views/ProjectsView.vue
index d65e210..49d6497 100644
--- a/src/views/ProjectsView.vue
+++ b/src/views/ProjectsView.vue
@@ -24,7 +24,7 @@
           ><fa icon="folder-open" class="fa-fw"></fa
         ></router-link>
       </li>
-      <!-- Commitments -->
+      <!-- Contacts -->
       <li class="basis-1/5 rounded-md text-slate-500">
         <router-link
           :to="{ name: 'contacts' }"