|
|
@ -33,30 +33,65 @@ |
|
|
|
<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> |
|
|
|
Reveal it when you are somewhere private, when only you can see your |
|
|
|
screen, and record it somewhere only you have access. A password manager |
|
|
|
is a good idea, and so is a piece of paper in a vault. |
|
|
|
<i |
|
|
|
>We recommend you do NOT 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. |
|
|
|
current identifier, this one backup is sufficient, as long as you also |
|
|
|
record the derivation path. 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"> |
|
|
|
<p v-if="showSeed" class="text-center text-slate-700 mt-2"> |
|
|
|
{{ activeAccount.mnemonic }} |
|
|
|
<button |
|
|
|
v-show="!showCopiedSeed" |
|
|
|
@click=" |
|
|
|
doCopyTwoSecRedo( |
|
|
|
activeAccount.mnemonic as string, |
|
|
|
() => (showCopiedSeed = !showCopiedSeed), |
|
|
|
) |
|
|
|
" |
|
|
|
> |
|
|
|
<fa icon="copy" class="text-slate-400 fa-fw"></fa> |
|
|
|
</button> |
|
|
|
<span v-show="showCopiedSeed" class="text-sm text-green-500"> |
|
|
|
Copied |
|
|
|
</span> |
|
|
|
<br /> |
|
|
|
<br /> |
|
|
|
Derivation Path: {{ activeAccount.derivationPath }} |
|
|
|
<button |
|
|
|
v-show="!showCopiedDeri" |
|
|
|
@click=" |
|
|
|
doCopyTwoSecRedo( |
|
|
|
activeAccount.derivationPath as string, |
|
|
|
() => (showCopiedDeri = !showCopiedDeri), |
|
|
|
) |
|
|
|
" |
|
|
|
> |
|
|
|
<fa icon="copy" class="text-slate-400 fa-fw"></fa> |
|
|
|
</button> |
|
|
|
<span v-show="showCopiedDeri" class="text-sm text-green-500" |
|
|
|
>Copied</span |
|
|
|
> |
|
|
|
</p> |
|
|
|
<button |
|
|
|
v-else |
|
|
|
class="block w-full text-center text-md uppercase bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-2 rounded-md" |
|
|
|
@click="showSeedPhrase" |
|
|
|
@click="showSeed = true" |
|
|
|
> |
|
|
|
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> |
|
|
@ -64,8 +99,9 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script lang="ts"> |
|
|
|
import { Component, Vue } from "vue-facing-decorator"; |
|
|
|
import * as R from "ramda"; |
|
|
|
import { Component, Vue } from "vue-facing-decorator"; |
|
|
|
import { useClipboard } from "@vueuse/core"; |
|
|
|
|
|
|
|
import QuickNav from "@/components/QuickNav.vue"; |
|
|
|
import { NotificationIface } from "@/constants/app"; |
|
|
@ -79,6 +115,8 @@ export default class SeedBackupView extends Vue { |
|
|
|
|
|
|
|
activeAccount: Account | null | undefined = null; |
|
|
|
numAccounts = 0; |
|
|
|
showCopiedDeri = false; |
|
|
|
showCopiedSeed = false; |
|
|
|
showSeed = false; |
|
|
|
|
|
|
|
// 'created' hook runs when the Vue instance is first created |
|
|
@ -106,8 +144,12 @@ export default class SeedBackupView extends Vue { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
showSeedPhrase() { |
|
|
|
this.showSeed = true; |
|
|
|
// call fn, copy text to the clipboard, then redo fn after 2 seconds |
|
|
|
doCopyTwoSecRedo(text: string, fn: () => void) { |
|
|
|
fn(); |
|
|
|
useClipboard() |
|
|
|
.copy(text) |
|
|
|
.then(() => setTimeout(fn, 2000)); |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|