You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
121 lines
3.5 KiB
121 lines
3.5 KiB
<template>
|
|
<QuickNav selected="Profile"></QuickNav>
|
|
<!-- CONTENT -->
|
|
<section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
|
|
<!-- Back -->
|
|
<div class="text-lg text-center font-light relative px-7">
|
|
<h1
|
|
class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
|
|
@click="$router.back()"
|
|
>
|
|
<fa icon="chevron-left" class="fa-fw"></fa>
|
|
</h1>
|
|
</div>
|
|
|
|
<!-- Heading -->
|
|
<h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
|
|
Seed Backup
|
|
</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>
|
|
|
|
<div v-if="activeAccount">
|
|
<p class="text-center mb-4">
|
|
<b class="text-red-600">BEWARE!</b> Anyone who has this seed phrase will
|
|
be able impersonate you and take over any digital holdings based on it.
|
|
Reveal it when you are somewhere only you can see your screen, and
|
|
record it somewhere only you have access.
|
|
<i>Don't take a screenshot or send it to any online service.</i>
|
|
</p>
|
|
|
|
<p v-if="numAccounts > 1">
|
|
<b class="text-orange-600">Note:</b> You have more than one identifier
|
|
stored in this browser. If they are all based on the same seed as the
|
|
current identifier, this one backup is sufficient; however, if you have
|
|
different seeds for other identifiers, you will have to back them up
|
|
separately.
|
|
</p>
|
|
|
|
<div class="bg-slate-100 rounded-md overflow-hidden p-4 mb-4">
|
|
<button
|
|
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md"
|
|
@click="showSeedPhrase"
|
|
>
|
|
Reveal my Seed Phrase
|
|
</button>
|
|
|
|
<p v-if="showSeed" class="text-center text-slate-700 mt-2">
|
|
{{ activeAccount.mnemonic }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div v-else>You do not have an active identifier.</div>
|
|
</section>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { Component, Vue } from "vue-facing-decorator";
|
|
import { accountsDB, db } from "@/db/index";
|
|
import * as R from "ramda";
|
|
import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
|
|
import QuickNav from "@/components/QuickNav.vue";
|
|
|
|
interface Account {
|
|
mnemonic: string;
|
|
}
|
|
|
|
interface Notification {
|
|
group: string;
|
|
type: string;
|
|
title: string;
|
|
text: string;
|
|
}
|
|
|
|
@Component({ components: { QuickNav } })
|
|
export default class SeedBackupView extends Vue {
|
|
$notify!: (notification: Notification, timeout?: number) => void;
|
|
|
|
activeAccount: Account | null | undefined = null;
|
|
numAccounts = 0;
|
|
showSeed = false;
|
|
|
|
// 'created' hook runs when the Vue instance is first created
|
|
async created() {
|
|
try {
|
|
await db.open();
|
|
const settings = await db.settings.get(MASTER_SETTINGS_KEY);
|
|
const activeDid = settings?.activeDid || "";
|
|
|
|
await accountsDB.open();
|
|
const accounts = await accountsDB.accounts.toArray();
|
|
this.numAccounts = accounts.length;
|
|
this.activeAccount = R.find((acc) => acc.did === activeDid, accounts);
|
|
} catch (err: unknown) {
|
|
console.error("Got an error loading an identifier:", err);
|
|
this.$notify(
|
|
{
|
|
group: "alert",
|
|
type: "danger",
|
|
title: "Error Loading Account",
|
|
text: "Got an error loading your seed data.",
|
|
},
|
|
-1,
|
|
);
|
|
}
|
|
}
|
|
|
|
showSeedPhrase() {
|
|
this.showSeed = true;
|
|
}
|
|
}
|
|
</script>
|
|
|