1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
|
/* eslint-disable @typescript-eslint/camelcase */
import { h, VNode } from "preact";
import { useState } from "preact/hooks";
import { useAnastasisContext } from "../../context/anastasis";
import { AnastasisClientFrame } from "./index";
export function SecretSelectionScreen(): VNode {
const [selectingVersion, setSelectingVersion] = useState<boolean>(false);
const [otherProvider, setOtherProvider] = useState<string>("");
const reducer = useAnastasisContext()
const currentVersion = reducer?.currentReducerState
&& ("recovery_document" in reducer.currentReducerState)
&& reducer.currentReducerState.recovery_document?.version;
const [otherVersion, setOtherVersion] = useState<number>(currentVersion || 0);
if (!reducer) {
return <div>no reducer in context</div>
}
if (!reducer.currentReducerState || reducer.currentReducerState.recovery_state === undefined) {
return <div>invalid state</div>
}
function selectVersion(p: string, n: number): void {
if (!reducer) return;
reducer.runTransaction(async (tx) => {
await tx.transition("change_version", {
version: n,
provider_url: p,
});
});
setSelectingVersion(false);
}
const providerList = Object.keys(reducer.currentReducerState.authentication_providers ?? {})
const recoveryDocument = reducer.currentReducerState.recovery_document
if (!recoveryDocument) {
return (
<AnastasisClientFrame hideNext="Recovery document not found" title="Recovery: Problem">
<p>No recovery document found, try with another provider</p>
<table class="table">
<tr>
<td><b>Provider</b></td>
<td>
<select onChange={(e) => setOtherProvider((e.target as any).value)}>
<option key="none" disabled selected > Choose another provider </option>
{providerList.map(prov => (
<option key={prov} value={prov}>
{prov}
</option>
))}
</select>
</td>
</tr>
</table>
</AnastasisClientFrame>
)
}
if (selectingVersion) {
return (
<AnastasisClientFrame hideNav title="Recovery: Select secret">
<p>Select a different version of the secret</p>
<table class="table">
<tr>
<td><b>Provider</b></td>
<td>
<select onChange={(e) => setOtherProvider((e.target as any).value)}>
{providerList.map(prov => (
<option key={prov} selected={prov === recoveryDocument.provider_url} value={prov}>
{prov}
</option>
))}
</select>
</td>
</tr>
<tr>
<td><b>Version</b></td>
<td>
<input
value={otherVersion}
onChange={(e) => setOtherVersion(Number((e.target as HTMLInputElement).value))}
type="number" />
</td>
<td>
<a onClick={() => setOtherVersion(0)}>set to latest version</a>
</td>
</tr>
</table>
<div style={{ marginTop: '2em', display: 'flex', justifyContent: 'space-between' }}>
<button class="button" onClick={() => setSelectingVersion(false)}>Cancel</button>
<button class="button is-info" onClick={() => selectVersion(otherProvider, otherVersion)}>Confirm</button>
</div>
</AnastasisClientFrame>
);
}
return (
<AnastasisClientFrame title="Recovery: Select secret">
<p>Secret found, you can select another version or continue to the challenges solving</p>
<table class="table">
<tr>
<td>
<b>Provider</b>
<span class="icon has-tooltip-right" data-tooltip="Service provider backing up your secret">
<i class="mdi mdi-information" />
</span>
</td>
<td>{recoveryDocument.provider_url}</td>
<td><a onClick={() => setSelectingVersion(true)}>use another provider</a></td>
</tr>
<tr>
<td>
<b>Secret version</b>
<span class="icon has-tooltip-right" data-tooltip="Secret version to be recovered">
<i class="mdi mdi-information" />
</span>
</td>
<td>{recoveryDocument.version}</td>
<td><a onClick={() => setSelectingVersion(true)}>use another version</a></td>
</tr>
<tr>
<td>
<b>Secret name</b>
<span class="icon has-tooltip-right" data-tooltip="Secret identifier">
<i class="mdi mdi-information" />
</span>
</td>
<td>{recoveryDocument.secret_name}</td>
<td> </td>
</tr>
</table>
</AnastasisClientFrame>
);
}
|
