Skip to content

Commit 6e67059

Browse files
committed
IdP app registration for #976
1 parent 622d428 commit 6e67059

6 files changed

Lines changed: 77 additions & 31 deletions

File tree

account-gui/src/locale/en.js

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -257,7 +257,11 @@ const en = {
257257
copy: "Copy the code",
258258
copied: "Copied",
259259
continue: "My code is safe. Continue",
260-
leaveConfirmation: "Are you sure you want to leave the page? Changes will not be saved."
260+
leaveConfirmation: "Are you sure you want to leave the page? Changes will not be saved.",
261+
finalizedRegistration: "Existing recovery method",
262+
finalizedRegistrationExplanation: "You are not allowed to register a phone number, as you already have an existing backup code as recovery method.",
263+
finalizedRegistrationBackupCode: "Your recovery code is: ",
264+
next: "Proceed"
261265
},
262266
phoneVerification: {
263267
header: "Add a recovery phone number",

account-gui/src/locale/nl.js

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -256,7 +256,11 @@ const nl = {
256256
copy: "Kopieer de code",
257257
copied: "Gekopieerd",
258258
continue: "Mijn code is veilig. Doorgaan",
259-
leaveConfirmation: "Weet je zeker dat je de pagina wilt verlaten? De registratie wordt afgebroken."
259+
leaveConfirmation: "Weet je zeker dat je de pagina wilt verlaten? De registratie wordt afgebroken.",
260+
finalizedRegistration: "Bestaande herstelmethode",
261+
finalizedRegistrationExplanation: "Je mag geen telefoonnummer registreren, omdat je al een bestaande back-upcode als herstelmethode hebt.",
262+
finalizedRegistrationBackupCode: "Je herstelcode is: ",
263+
next: "Doorgaan"
260264
},
261265
phoneVerification: {
262266
header: "Voeg een hersteltelefoonnummer toe",

account-gui/src/routes/PhoneVerification.svelte

Lines changed: 57 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -11,13 +11,19 @@
1111
import {user} from "../stores/user";
1212
import Modal from "../components/Modal.svelte";
1313
14+
const RECOVERY_CODE = "recovery-code";
15+
const REDIRECT = "redirect";
16+
1417
let showSpinner = true;
1518
let initial = true;
1619
let hash = null;
1720
let phoneNumber = "";
1821
let rateLimited = false;
1922
let showRateLimitedModal = false;
20-
23+
let finalizedRegistration = false;
24+
let recoveryCode = sessionStorage.getItem(RECOVERY_CODE);
25+
let redirect = sessionStorage.getItem(REDIRECT);
26+
2127
onMount(() => {
2228
$links.displayBackArrow = true;
2329
@@ -40,9 +46,13 @@
4046
$user.phoneNumber = phoneNumber;
4147
navigate(`phone-confirmation?h=${hash}`);
4248
})
43-
.catch(() => {
44-
rateLimited = true;
45-
showRateLimitedModal = true;
49+
.catch(e => {
50+
if (e.status === 406) {
51+
finalizedRegistration = true;
52+
} else {
53+
rateLimited = true;
54+
showRateLimitedModal = true;
55+
}
4656
showSpinner = false;
4757
})
4858
}
@@ -94,35 +104,56 @@
94104
outline: none;
95105
}
96106
107+
span.backup-code {
108+
font-weight: 600;
109+
}
97110
98111
</style>
99112
{#if showSpinner}
100113
<Spinner/>
101114
{/if}
102-
<h2 class="header">{I18n.t("PhoneVerification.Header.COPY")}</h2>
103-
<p class="explanation">{I18n.t("phoneVerification.info")}</p>
104-
<p class="methods">{I18n.t("PhoneVerification.Text.COPY")}</p>
105-
106-
<input class:error={phoneNumberIncorrect}
107-
autocomplete="current-password"
108-
id="password-field"
109-
spellcheck="false"
110-
on:keydown={handleEnter}
111-
placeholder={I18n.t("PhoneVerification.PlaceHolder.COPY")}
112-
use:init
113-
bind:value={phoneNumber}>
114-
{#if phoneNumberIncorrect}
115-
<div class="error">
116-
<span class="svg">{@html critical}</span>
117-
<span>{I18n.t("phoneVerification.phoneIncorrect")}</span>
118-
</div>
115+
{#if finalizedRegistration}
116+
<h2 class="header">{I18n.t("recovery.finalizedRegistration")}</h2>
117+
<p class="explanation">{I18n.t("recovery.finalizedRegistrationExplanation")}</p>
118+
{#if recoveryCode}
119+
<p class="explanation">{I18n.t("recovery.finalizedRegistrationBackupCode")}
120+
<span class="backup-code">{recoveryCode}</span>
121+
</p>
122+
{/if}
123+
124+
<Button onClick={() => navigate(`/congrats?h=${hash}&redirect=${encodeURIComponent(redirect)}`)}
125+
className="cancel full"
126+
href={"/next"}
127+
label={I18n.t("recovery.next")}/>
128+
{:else}
129+
<h2 class="header">{I18n.t("PhoneVerification.Header.COPY")}</h2>
130+
<p class="explanation">{I18n.t("phoneVerification.info")}</p>
131+
<p class="methods">{I18n.t("PhoneVerification.Text.COPY")}</p>
132+
133+
<input class:error={phoneNumberIncorrect}
134+
autocomplete="current-password"
135+
id="password-field"
136+
spellcheck="false"
137+
on:keydown={handleEnter}
138+
placeholder={I18n.t("PhoneVerification.PlaceHolder.COPY")}
139+
use:init
140+
bind:value={phoneNumber}>
141+
{#if phoneNumberIncorrect}
142+
<div class="error">
143+
<span class="svg">{@html critical}</span>
144+
<span>{I18n.t("phoneVerification.phoneIncorrect")}</span>
145+
</div>
146+
{/if}
147+
148+
<Button href="/next"
149+
disabled={showSpinner || !allowedNext || rateLimited}
150+
label={I18n.t("PhoneVerification.Verify.COPY")}
151+
className="full"
152+
onClick={next}/>
153+
119154
{/if}
120155

121-
<Button href="/next"
122-
disabled={showSpinner || !allowedNext || rateLimited}
123-
label={I18n.t("PhoneVerification.Verify.COPY")}
124-
className="full"
125-
onClick={next}/>
156+
126157

127158
{#if rateLimited && showRateLimitedModal}
128159
<Modal submit={() => showRateLimitedModal = false}

myconext-gui/src/locale/en.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -440,7 +440,8 @@ const en = {
440440
leaveConfirmation: "Are you sure you want to leave the page? Changes will not be saved.",
441441
finalizedRegistration: "Existing recovery method",
442442
finalizedRegistrationExplanation: "You are not allowed to register a phone number, as you already have an existing backup code as recovery method. You can change your recovery-method ",
443-
finalizedRegistrationHere: "here."
443+
finalizedRegistrationHere: "here.",
444+
finalizedRegistrationBackupCode: "Your recovery code is: "
444445
},
445446
phoneVerification: {
446447
header: "Add a recovery phone number",

myconext-gui/src/locale/nl.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -440,7 +440,8 @@ const nl = {
440440
leaveConfirmation: "Weet je zeker dat je deze pagina wilt verlaten? Wijzigingen worden niet opgeslagen.",
441441
finalizedRegistration: "Bestaande herstelmethode",
442442
finalizedRegistrationExplanation: "Je mag geen telefoonnummer registreren, omdat je al een bestaande back-upcode als herstelmethode hebt. Wijzig je herstelmethode ",
443-
finalizedRegistrationHere: "hier."
443+
finalizedRegistrationHere: "hier.",
444+
finalizedRegistrationBackupCode: "Je herstelcode is: "
444445
},
445446
phoneVerification: {
446447
header: "Voeg een hersteltelefoonnummer toe",

myconext-gui/src/routes/tiqr/PhoneVerification.svelte

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -106,6 +106,9 @@
106106
outline: none;
107107
}
108108
109+
span.backup-code {
110+
font-weight: 600;
111+
}
109112
110113
</style>
111114
{#if showSpinner}
@@ -121,7 +124,9 @@
121124
</a>
122125
</p>
123126
{#if recoveryCode}
124-
//TODO recovery code show + translation
127+
<p class="explanation">{I18n.t("recovery.finalizedRegistrationBackupCode")}
128+
<span class="backup-code">{recoveryCode}</span>
129+
</p>
125130
{/if}
126131
{:else}
127132
<h2 class="header">{I18n.t("PhoneVerification.Header.COPY")}</h2>

0 commit comments

Comments
 (0)