Adding Identity Management stubs #42
Merged
anomalist
merged 8 commits from identity-switcher
into master
1 year ago
3 changed files with 184 additions and 1 deletions
@ -0,0 +1,169 @@ |
|||||
|
<template> |
||||
|
<QuickNav selected="Profile"></QuickNav> |
||||
|
<section id="Content" class="p-6 pb-24"> |
||||
|
<!-- Breadcrumb --> |
||||
|
<div id="ViewBreadcrumb" class="mb-8"> |
||||
|
<h1 class="text-lg text-center font-light relative px-7"> |
||||
|
<!-- Cancel --> |
||||
|
<router-link |
||||
|
:to="{ name: 'account' }" |
||||
|
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1" |
||||
|
><fa icon="chevron-left" class="fa-fw"></fa> |
||||
|
</router-link> |
||||
|
|
||||
|
Switch Identity |
||||
|
</h1> |
||||
|
</div> |
||||
|
|
||||
|
<!-- Identity List --> |
||||
|
|
||||
|
<!-- Current Identity - Display First! --> |
||||
|
<div class="block bg-slate-100 rounded-md flex items-center px-4 py-3 mb-4"> |
||||
|
<fa icon="circle-check" class="fa-fw text-blue-600 text-xl mr-3"></fa> |
||||
|
<span class="overflow-hidden"> |
||||
|
<h2 class="text-xl font-semibold mb-0"> |
||||
|
{{ firstName }} {{ lastName }} |
||||
|
</h2> |
||||
|
<div class="text-sm text-slate-500 truncate"> |
||||
|
<b>ID:</b> <code>{{ activeDid }}</code> |
||||
|
</div> |
||||
|
</span> |
||||
|
</div> |
||||
|
|
||||
|
<!-- Other Identity/ies --> |
||||
|
<ul class="mb-4"> |
||||
|
<li |
||||
|
class="block bg-slate-100 rounded-md flex items-center px-4 py-3 mb-2" |
||||
|
v-for="ident in otherIdentities" |
||||
|
:key="ident.did" |
||||
|
@click="switchAccount(ident.did)" |
||||
|
> |
||||
|
<fa icon="circle" class="fa-fw text-slate-400 text-xl mr-3"></fa> |
||||
|
<span class="overflow-hidden"> |
||||
|
<h2 class="text-xl font-semibold mb-0"></h2> |
||||
|
<div class="text-sm text-slate-500 truncate"> |
||||
|
<b>ID:</b> <code>{{ ident.did }}</code> |
||||
|
</div> |
||||
|
</span> |
||||
|
</li> |
||||
|
</ul> |
||||
|
|
||||
|
<!-- Actions --> |
||||
|
<router-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" |
||||
|
> |
||||
|
Add Another Identity… |
||||
|
</router-link> |
||||
|
<a |
||||
|
href="#" |
||||
|
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md mb-8" |
||||
|
@click="switchAccount('0')" |
||||
|
> |
||||
|
No Identity |
||||
|
</a> |
||||
|
|
||||
|
<AlertMessage |
||||
|
:alertTitle="alertTitle" |
||||
|
:alertMessage="alertMessage" |
||||
|
></AlertMessage> |
||||
|
</section> |
||||
|
</template> |
||||
|
<script lang="ts"> |
||||
|
import { Component, Vue } from "vue-facing-decorator"; |
||||
|
import { AppString } from "@/constants/app"; |
||||
|
import { db, accountsDB } from "@/db"; |
||||
|
import { AccountsSchema } from "@/db/tables/accounts"; |
||||
|
import { MASTER_SETTINGS_KEY } from "@/db/tables/settings"; |
||||
|
import AlertMessage from "@/components/AlertMessage"; |
||||
|
import QuickNav from "@/components/QuickNav"; |
||||
|
|
||||
|
@Component({ components: { AlertMessage, QuickNav } }) |
||||
|
export default class IdentitySwitcherView extends Vue { |
||||
|
Constants = AppString; |
||||
|
public accounts: AccountsSchema; |
||||
|
public activeDid; |
||||
|
public firstName; |
||||
|
public lastName; |
||||
|
public alertTitle; |
||||
|
public alertMessage; |
||||
|
public otherIdentities = []; |
||||
|
|
||||
|
public async getIdentity(activeDid) { |
||||
|
await accountsDB.open(); |
||||
|
const account = await accountsDB.accounts |
||||
|
.where("did") |
||||
|
.equals(activeDid) |
||||
|
.first(); |
||||
|
const identity = JSON.parse(account?.identity || "null"); |
||||
|
return identity; |
||||
|
} |
||||
|
|
||||
|
async created() { |
||||
|
try { |
||||
|
await db.open(); |
||||
|
const settings = await db.settings.get(MASTER_SETTINGS_KEY); |
||||
|
this.activeDid = settings?.activeDid || ""; |
||||
|
this.apiServer = settings?.apiServer || ""; |
||||
|
this.apiServerInput = settings?.apiServer || ""; |
||||
|
this.firstName = settings?.firstName || "No"; |
||||
|
this.lastName = settings?.lastName || "Name"; |
||||
|
this.showContactGives = !!settings?.showContactGivesInline; |
||||
|
|
||||
|
const identity = await this.getIdentity(this.activeDid); |
||||
|
|
||||
|
if (identity) { |
||||
|
db.settings.update(MASTER_SETTINGS_KEY, { |
||||
|
activeDid: identity.did, |
||||
|
}); |
||||
|
} |
||||
|
await accountsDB.open(); |
||||
|
const accounts = await accountsDB.accounts.toArray(); |
||||
|
for (let n = 0; n < accounts.length; n++) { |
||||
|
const did = JSON.parse(accounts[n].identity)["did"]; |
||||
|
if (did && this.activeDid !== did) { |
||||
|
this.otherIdentities.push({ did: did }); |
||||
|
} |
||||
|
} |
||||
|
} catch (err) { |
||||
|
if ( |
||||
|
err.message === |
||||
|
"Attempted to load account records with no identity available." |
||||
|
) { |
||||
|
this.limitsMessage = "No identity."; |
||||
|
this.loadingLimits = false; |
||||
|
} else { |
||||
|
this.alertMessage = |
||||
|
"Clear your cache and start over (after data backup)."; |
||||
|
console.error( |
||||
|
"Telling user to clear cache at page create because:", |
||||
|
err, |
||||
|
); |
||||
|
this.alertTitle = "Error Creating Account"; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
async switchAccount(did: string) { |
||||
|
// 0 means none |
||||
|
if (did === "0") { |
||||
|
did = undefined; |
||||
|
} |
||||
|
await db.open(); |
||||
|
db.settings.update(MASTER_SETTINGS_KEY, { |
||||
|
activeDid: did, |
||||
|
}); |
||||
|
this.activeDid = did; |
||||
|
this.otherIdentities = []; |
||||
|
await accountsDB.open(); |
||||
|
const accounts = await accountsDB.accounts.toArray(); |
||||
|
for (let n = 0; n < accounts.length; n++) { |
||||
|
const did = JSON.parse(accounts[n].identity)["did"]; |
||||
|
if (did && this.activeDid !== did) { |
||||
|
this.otherIdentities.push({ did: did }); |
||||
|
} |
||||
|
} |
||||
|
this.$router.push({ name: "account" }); |
||||
|
} |
||||
|
} |
||||
|
</script> |
Loading…
Reference in new issue