Browse Source

remove separate storage reference for account check

kb/add-usage-guide
Trent Larson 2 years ago
parent
commit
5f3861049e
  1. 1
      .tool-versions
  2. 10
      src/router/index.ts
  3. 11
      src/store/app.ts
  4. 60
      src/views/AccountViewView.vue
  5. 2
      src/views/ImportAccountView.vue

1
.tool-versions

@ -1 +0,0 @@
nodejs 16.18.0

10
src/router/index.ts

@ -1,5 +1,5 @@
import { createRouter, createWebHistory, RouteRecordRaw } from "vue-router"; import { createRouter, createWebHistory, RouteRecordRaw } from "vue-router";
import { useAppStore } from "../store/app"; import { db } from "@/db";
const routes: Array<RouteRecordRaw> = [ const routes: Array<RouteRecordRaw> = [
{ {
@ -7,10 +7,10 @@ const routes: Array<RouteRecordRaw> = [
name: "home", name: "home",
component: () => component: () =>
import(/* webpackChunkName: "start" */ "../views/DiscoverView.vue"), import(/* webpackChunkName: "start" */ "../views/DiscoverView.vue"),
beforeEnter: (to, from, next) => { beforeEnter: async (to, from, next) => {
const appStore = useAppStore(); await db.open();
const isAuthenticated = appStore.condition === "registered"; const num_accounts = await db.accounts.count();
if (isAuthenticated) { if (num_accounts > 0) {
next(); next();
} else { } else {
next({ name: "start" }); next({ name: "start" });

11
src/store/app.ts

@ -4,10 +4,6 @@ import { defineStore } from "pinia";
export const useAppStore = defineStore({ export const useAppStore = defineStore({
id: "app", id: "app",
state: () => ({ state: () => ({
_condition:
typeof localStorage["condition"] == "undefined"
? "uninitialized"
: localStorage["condition"],
_lastView: _lastView:
typeof localStorage["lastView"] == "undefined" typeof localStorage["lastView"] == "undefined"
? "/start" ? "/start"
@ -18,16 +14,9 @@ export const useAppStore = defineStore({
: localStorage.getItem("projectId"), : localStorage.getItem("projectId"),
}), }),
getters: { getters: {
condition: (state) => state._condition,
projectId: (state): string => state._projectId as string, projectId: (state): string => state._projectId as string,
}, },
actions: { actions: {
reset() {
localStorage.removeItem("condition");
},
setCondition(newCondition: string) {
localStorage.setItem("condition", newCondition);
},
async setProjectId(newProjectId: string) { async setProjectId(newProjectId: string) {
localStorage.setItem("projectId", newProjectId); localStorage.setItem("projectId", newProjectId);
}, },

60
src/views/AccountViewView.vue

@ -168,6 +168,17 @@
</button> </button>
</form> </form>
</dialog> </dialog>
<div v-bind:class="computedAlertClassNames()">
<button
class="close-button bg-slate-200 w-8 leading-loose rounded-full absolute top-2 right-2"
@click="onClickClose()"
>
<fa icon="xmark"></fa>
</button>
<h4 class="font-bold pr-5">{{ alertTitle }}</h4>
<p>{{ alertMessage }}</p>
</div>
</section> </section>
</template> </template>
@ -176,7 +187,6 @@ import { Options, Vue } from "vue-class-component";
import { useClipboard } from "@vueuse/core"; import { useClipboard } from "@vueuse/core";
import { deriveAddress, generateSeed, newIdentifier } from "../libs/crypto"; import { deriveAddress, generateSeed, newIdentifier } from "../libs/crypto";
import { db } from "../db"; import { db } from "../db";
import { useAppStore } from "@/store/app";
//import { testServerRegisterUser } from "../test"; //import { testServerRegisterUser } from "../test";
@Options({ @Options({
@ -203,8 +213,10 @@ export default class AccountViewView extends Vue {
// 'created' hook runs when the Vue instance is first created // 'created' hook runs when the Vue instance is first created
async created() { async created() {
const appCondition = useAppStore().condition; await db.open();
if (appCondition == "uninitialized") { const num_accounts = await db.accounts.count();
if (num_accounts === 0) {
try {
this.mnemonic = generateSeed(); this.mnemonic = generateSeed();
[this.address, this.privateHex, this.publicHex, this.derivationPath] = [this.address, this.privateHex, this.publicHex, this.derivationPath] =
deriveAddress(this.mnemonic); deriveAddress(this.mnemonic);
@ -215,10 +227,6 @@ export default class AccountViewView extends Vue {
this.privateHex, this.privateHex,
this.derivationPath this.derivationPath
); );
try {
await db.open();
const num_accounts = await db.accounts.count();
if (num_accounts === 0) {
await db.accounts.add({ await db.accounts.add({
dateCreated: new Date(), dateCreated: new Date(),
derivationPath: this.derivationPath, derivationPath: this.derivationPath,
@ -226,23 +234,47 @@ export default class AccountViewView extends Vue {
mnemonic: this.mnemonic, mnemonic: this.mnemonic,
publicKeyHex: newId.keys[0].publicKeyHex, publicKeyHex: newId.keys[0].publicKeyHex,
}); });
}
useAppStore().setCondition("registered");
} catch (err) { } catch (err) {
this.alertMessage =
"Clear your cache and start over. Root Cause: " + err;
this.alertTitle = "Error Creating Account";
this.isAlertVisible = true;
console.log(err); console.log(err);
} }
} }
await db.open();
const num_accounts = await db.accounts.count();
if (num_accounts === 0) {
console.log("Problem! Should have a profile!");
} else {
const accounts = await db.accounts.toArray(); const accounts = await db.accounts.toArray();
const identity = JSON.parse(accounts[0].identity); const identity = JSON.parse(accounts[0].identity);
this.address = identity.did; this.address = identity.did;
this.publicHex = identity.keys[0].publicKeyHex; this.publicHex = identity.keys[0].publicKeyHex;
this.derivationPath = identity.keys[0].meta.derivationPath; this.derivationPath = identity.keys[0].meta.derivationPath;
} }
alertMessage = "";
alertTitle = "";
isAlertVisible = false;
public onClickClose() {
this.isAlertVisible = false;
this.alertTitle = "";
this.alertMessage = "";
}
public computedAlertClassNames() {
return {
hidden: !this.isAlertVisible,
"dismissable-alert": true,
"bg-slate-100": true,
"p-5": true,
rounded: true,
"drop-shadow-lg": true,
absolute: true,
"top-3": true,
"inset-x-3": true,
"transition-transform": true,
"ease-in": true,
"duration-300": true,
};
} }
} }
</script> </script>

2
src/views/ImportAccountView.vue

@ -46,7 +46,6 @@
import { Options, Vue } from "vue-class-component"; import { Options, Vue } from "vue-class-component";
import { deriveAddress, newIdentifier } from "../libs/crypto"; import { deriveAddress, newIdentifier } from "../libs/crypto";
import { db } from "@/db"; import { db } from "@/db";
import { useAppStore } from "@/store/app";
@Options({ @Options({
components: {}, components: {},
@ -87,7 +86,6 @@ export default class ImportAccountView extends Vue {
publicKeyHex: newId.keys[0].publicKeyHex, publicKeyHex: newId.keys[0].publicKeyHex,
}); });
} }
useAppStore().setCondition("registered");
this.$router.push({ name: "account" }); this.$router.push({ name: "account" });
} catch (err) { } catch (err) {
console.log("Error!"); console.log("Error!");

Loading…
Cancel
Save