From 5883d42d800c7b444c59d626bcaa5abca7dc83d0 Mon Sep 17 00:00:00 2001
From: Sebastian <sebasjm@gmail.com>
Date: Tue, 19 Oct 2021 10:56:52 -0300
Subject: add template from merchant backoffice

---
 .../src/pages/home/AuthMethodQuestionSetup.tsx     | 45 ++++++++++++++++++++++
 1 file changed, 45 insertions(+)
 create mode 100644 packages/anastasis-webui/src/pages/home/AuthMethodQuestionSetup.tsx

(limited to 'packages/anastasis-webui/src/pages/home/AuthMethodQuestionSetup.tsx')

diff --git a/packages/anastasis-webui/src/pages/home/AuthMethodQuestionSetup.tsx b/packages/anastasis-webui/src/pages/home/AuthMethodQuestionSetup.tsx
new file mode 100644
index 000000000..7a0da7ebf
--- /dev/null
+++ b/packages/anastasis-webui/src/pages/home/AuthMethodQuestionSetup.tsx
@@ -0,0 +1,45 @@
+/* eslint-disable @typescript-eslint/camelcase */
+import {
+  encodeCrock,
+  stringToBytes
+} from "@gnu-taler/taler-util";
+import { h, VNode } from "preact";
+import { useState } from "preact/hooks";
+import { AuthMethodSetupProps, AnastasisClientFrame, LabeledInput } from "./index";
+
+export function AuthMethodQuestionSetup(props: AuthMethodSetupProps): VNode {
+  const [questionText, setQuestionText] = useState("");
+  const [answerText, setAnswerText] = useState("");
+  const addQuestionAuth = (): void => props.addAuthMethod({
+    authentication_method: {
+      type: "question",
+      instructions: questionText,
+      challenge: encodeCrock(stringToBytes(answerText)),
+    },
+  });
+  return (
+    <AnastasisClientFrame hideNav title="Add Security Question">
+      <div>
+        <p>
+          For security question authentication, you need to provide a question
+          and its answer. When recovering your secret, you will be shown the
+          question and you will need to type the answer exactly as you typed it
+          here.
+        </p>
+        <div>
+          <LabeledInput
+            label="Security question"
+            grabFocus
+            bind={[questionText, setQuestionText]} />
+        </div>
+        <div>
+          <LabeledInput label="Answer" bind={[answerText, setAnswerText]} />
+        </div>
+        <div>
+          <button onClick={() => props.cancel()}>Cancel</button>
+          <button onClick={() => addQuestionAuth()}>Add</button>
+        </div>
+      </div>
+    </AnastasisClientFrame>
+  );
+}
-- 
cgit v1.2.3