taler/wallet-core
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Activity

fix example of successful recovery so the content of the secret can be decoded correctly

Browse Source
This commit is contained in:
Sebastian 2021-11-12 13:44:10 -03:00
parent 162e17cf3d
commit d6beefe6e0
No known key found for this signature in database
GPG Key ID: BE4FF68352439FC1
2 changed files with 31 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
packages/anastasis-webui/src/pages/home/RecoveryFinishedScreen.stories.tsx
View File

@ -1,4 +1,3 @@
/* eslint-disable @typescript-eslint/camelcase */
/* /*
This file is part of GNU Taler This file is part of GNU Taler
(C) 2021 Taler Systems S.A. (C) 2021 Taler Systems S.A.
@ -20,6 +19,7 @@
* @author Sebastian Javier Marchano (sebasjm) * @author Sebastian Javier Marchano (sebasjm)
*/ */
import { encodeCrock, stringToBytes } from "@gnu-taler/taler-util";
import { ReducerState } from "anastasis-core"; import { ReducerState } from "anastasis-core";
import { createExample, reducerStatesExample } from "../../utils"; import { createExample, reducerStatesExample } from "../../utils";
import { RecoveryFinishedScreen as TestedComponent } from "./RecoveryFinishedScreen"; import { RecoveryFinishedScreen as TestedComponent } from "./RecoveryFinishedScreen";
@ -38,7 +38,15 @@ export default {
export const GoodEnding = createExample(TestedComponent, { export const GoodEnding = createExample(TestedComponent, {
...reducerStatesExample.recoveryFinished, ...reducerStatesExample.recoveryFinished,
core_secret: { mime: "text/plain", value: "hello" }, recovery_document: {
secret_name: "the_name_of_the_secret",
},
core_secret: {
mime: "text/plain",
value: encodeCrock(
stringToBytes("hello this is my secret, don't tell anybody"),
),
},
} as ReducerState); } as ReducerState);
export const BadEnding = createExample( export const BadEnding = createExample(

38
packages/anastasis-webui/src/pages/home/RecoveryFinishedScreen.tsx
View File

@ -1,18 +1,19 @@
import { bytesToString, decodeCrock } from "@gnu-taler/taler-util"; import { bytesToString, decodeCrock, encodeCrock } from "@gnu-taler/taler-util";
import { h, VNode } from "preact"; import { h, VNode } from "preact";
import { useEffect, useState } from "preact/hooks"; import { useEffect, useState } from "preact/hooks";
import { stringToBytes } from "qrcode-generator";
import { QR } from "../../components/QR"; import { QR } from "../../components/QR";
import { useAnastasisContext } from "../../context/anastasis"; import { useAnastasisContext } from "../../context/anastasis";
import { AnastasisClientFrame } from "./index"; import { AnastasisClientFrame } from "./index";
export function RecoveryFinishedScreen(): VNode { export function RecoveryFinishedScreen(): VNode {
const reducer = useAnastasisContext(); const reducer = useAnastasisContext();
const [copied, setCopied] = useState(false) const [copied, setCopied] = useState(false);
useEffect(() => { useEffect(() => {
setTimeout(() => { setTimeout(() => {
setCopied(false) setCopied(false);
},1000) }, 1000);
}, [copied]) }, [copied]);
if (!reducer) { if (!reducer) {
return <div>no reducer in context</div>; return <div>no reducer in context</div>;
@ -44,29 +45,32 @@ export function RecoveryFinishedScreen(): VNode {
); );
} }
const secret = bytesToString(decodeCrock(encodedSecret.value)); const secret = bytesToString(decodeCrock(encodedSecret.value));
const contentURI = `data:${encodedSecret.mime},${secret}` const contentURI = `data:${encodedSecret.mime},${secret}`;
// const fileName = encodedSecret['filename'] // const fileName = encodedSecret['filename']
// data:plain/text;base64,asdasd // data:plain/text;base64,asdasd
return ( return (
<AnastasisClientFrame title="Recovery Success" hideNav> <AnastasisClientFrame title="Recovery Success" hideNav>
<h2 class="subtitle">Your secret was recovered</h2> <h2 class="subtitle">Your secret was recovered</h2>
{secretName && <p class="block"> {secretName && (
<b>Secret name:</b> {secretName} <p class="block">
</p>} <b>Secret name:</b> {secretName}
</p>
)}
<div class="block buttons" disabled={copied}> <div class="block buttons" disabled={copied}>
<button class="button" onClick={() => { <button
navigator.clipboard.writeText(secret); class="button"
setCopied(true) onClick={() => {
}}> navigator.clipboard.writeText(secret);
{ !copied ? 'Copy' : 'Copied'} setCopied(true);
}}
>
{!copied ? "Copy" : "Copied"}
</button> </button>
<a class="button is-info" download="secret.txt" href={contentURI}> <a class="button is-info" download="secret.txt" href={contentURI}>
<div class="icon is-small "> <div class="icon is-small ">
<i class="mdi mdi-download" /> <i class="mdi mdi-download" />
</div> </div>
<span> <span>Save as</span>
Save as
</span>
</a> </a>
</div> </div>
<div class="block"> <div class="block">