1 files changed, 56 insertions, 16 deletions
diff --git a/packages/aml-backoffice-ui/src/pages/AntiMoneyLaunderingForm.tsx b/packages/aml-backoffice-ui/src/pages/AntiMoneyLaunderingForm.tsx
index c3fb7dafe..5d2a3dffe 100644
--- a/packages/aml-backoffice-ui/src/pages/AntiMoneyLaunderingForm.tsx
+++ b/packages/aml-backoffice-ui/src/pages/AntiMoneyLaunderingForm.tsx
@@ -1,3 +1,5 @@
+import { AbsoluteTime, AmountJson, Amounts } from "@gnu-taler/taler-util";
+import { useTranslationContext } from "@gnu-taler/web-util/browser";
 import { h } from "preact";
 import { NiceForm } from "../NiceForm.js";
 import { v1 as form_902_11e_v1 } from "../forms/902_11e.js";
@@ -9,30 +11,63 @@ import { v1 as form_902_4e_v1 } from "../forms/902_4e.js";
 import { v1 as form_902_5e_v1 } from "../forms/902_5e.js";
 import { v1 as form_902_9e_v1 } from "../forms/902_9e.js";
 import { v1 as simplest } from "../forms/simplest.js";
-import { DocumentDuplicateIcon } from "@heroicons/react/24/solid";
-import { AbsoluteTime } from "@gnu-taler/taler-util";
-import { AmountJson, Amounts } from "@gnu-taler/taler-util";
+import { Pages } from "../pages.js";
 import { AmlExchangeBackend } from "../types.js";
 
-export function AntiMoneyLaunderingForm({ number }: { number?: string }) {
-  const selectedForm = Number.parseInt(number ?? "0", 10);
-  if (Number.isNaN(selectedForm)) {
-    return <div>WHAT! {number}</div>;
-  }
+export type Justification = {
+  // form index in the list of forms
+  index: number;
+  // form name
+  name: string;
+  // form values
+  value: any;
+}
+
+export function AntiMoneyLaunderingForm({ account, selectedForm, onSubmit }: { account: string, selectedForm: number, onSubmit: (justification: Justification, state: AmlExchangeBackend.AmlState, threshold: AmountJson) => Promise<void>; }) {
+  const { i18n } = useTranslationContext()
   const showingFrom = allForms[selectedForm].impl;
-  const storedValue = {
+  const formName = allForms[selectedForm].name
+  const initial = {
     fullName: "loggedIn_user_fullname",
     when: AbsoluteTime.now(),
+    state: AmlExchangeBackend.AmlState.pending,
+    threshold: Amounts.parseOrThrow("KUDOS:1000"),
   };
   return (
     <NiceForm
-      initial={storedValue}
-      form={showingFrom({
-        state: AmlExchangeBackend.AmlState.pending,
-        threshold: Amounts.parseOrThrow("USD:10"),
-      })}
-      onUpdate={() => {}}
-    />
+      initial={initial}
+      form={showingFrom(initial)}
+      onUpdate={() => { }}
+      onSubmit={(formValue) => {
+        if (formValue.state === undefined || formValue.threshold === undefined) return;
+        const st = formValue.state;
+        const amount = formValue.threshold;
+
+        const justification = {
+          index: selectedForm,
+          name: formName,
+          value: formValue
+        }
+
+        onSubmit(justification, st, amount);
+      }}
+    >
+      <div class="mt-6 flex items-center justify-end gap-x-6">
+        <a
+          //   type="button"
+          href={Pages.account.url({ account })}
+          class="text-sm font-semibold leading-6 text-gray-900"
+        >
+          <i18n.Translate>Cancel</i18n.Translate>
+        </a>
+        <button
+          type="submit"
+          class="rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
+        >
+          <i18n.Translate>Confirm</i18n.Translate>
+        </button>
+      </div>
+    </NiceForm>
   );
 }
 
@@ -41,6 +76,11 @@ export interface State {
   threshold: AmountJson;
 }
 
+const DocumentDuplicateIcon = <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 17.25v3.375c0 .621-.504 1.125-1.125 1.125h-9.75a1.125 1.125 0 01-1.125-1.125V7.875c0-.621.504-1.125 1.125-1.125H6.75a9.06 9.06 0 011.5.124m7.5 10.376h3.375c.621 0 1.125-.504 1.125-1.125V11.25c0-4.46-3.243-8.161-7.5-8.876a9.06 9.06 0 00-1.5-.124H9.375c-.621 0-1.125.504-1.125 1.125v3.5m7.5 10.375H9.375a1.125 1.125 0 01-1.125-1.125v-9.25m12 6.625v-1.875a3.375 3.375 0 00-3.375-3.375h-1.5a1.125 1.125 0 01-1.125-1.125v-1.5a3.375 3.375 0 00-3.375-3.375H9.75" />
+</svg>
+
+
 export const allForms = [
   {
     name: "Simple comment",