aml ui

8 files changed, 44 insertions, 55 deletions

diff --git a/packages/aml-backoffice-ui/src/pages/Cases.tsx b/packages/aml-backoffice-ui/src/pages/Cases.tsx
index 5f79db71e..624f2c985 100644
--- a/packages/aml-backoffice-ui/src/pages/Cases.tsx
+++ b/packages/aml-backoffice-ui/src/pages/Cases.tsx
@@ -4,17 +4,16 @@ import { VNode, h } from "preact";
 import { useState } from "preact/hooks";
 import { createNewForm } from "../handlers/forms.js";
 import { useCases } from "../hooks/useCases.js";
-import { useOfficer } from "../hooks/useOfficer.js";
 import { Pages } from "../pages.js";
 import { AmlExchangeBackend } from "../types.js";
 import { amlStateConverter } from "./CaseDetails.js";
+import { Officer } from "./Officer.js";
 
 export function Cases() {
   const { i18n } = useTranslationContext();
 
   const form = createNewForm<{ state: AmlExchangeBackend.AmlState }>();
 
-
   const initial = AmlExchangeBackend.AmlState.pending;
   const [stateFilter, setStateFilter] = useState(initial);
 
@@ -23,16 +22,15 @@ export function Cases() {
   if (!list) {
     return <Loading />
   }
-
   if (list instanceof TalerError) {
     return <ErrorLoading error={list} />
   }
 
   if (list.data.type === "fail") {
     switch (list.data.case) {
-      case "unauthorized":
-      case "officer-not-found":
-      case "officer-disabled": return <div />
+      case "unauthorized": return <Officer />
+      case "officer-not-found": return <Officer />
+      case "officer-disabled": return <Officer />
       default: assertUnreachable(list.data)
     }
   }
@@ -116,7 +114,7 @@ export function Cases() {
                           <td class="whitespace-nowrap px-3 py-5 text-sm text-gray-500 ">
                             <div class="text-gray-900">
                               <a
-                                href={Pages.details.url({ account: r.h_payto })}
+                                href={Pages.account.url({ account: r.h_payto })}
                                 class="text-indigo-600 hover:text-indigo-900"
                               >
                                 {r.h_payto}
diff --git a/packages/aml-backoffice-ui/src/pages/CreateAccount.tsx b/packages/aml-backoffice-ui/src/pages/CreateAccount.tsx
index 5dcb8b21d..9b8c3c046 100644
--- a/packages/aml-backoffice-ui/src/pages/CreateAccount.tsx
+++ b/packages/aml-backoffice-ui/src/pages/CreateAccount.tsx
@@ -5,6 +5,7 @@ import {
 } from "@gnu-taler/web-util/browser";
 import { VNode, h } from "preact";
 import { createNewForm } from "../handlers/forms.js";
+import { useSettings } from "../hooks/useSettings.js";
 
 export function CreateAccount({
   onNewAccount,
@@ -16,12 +17,13 @@ export function CreateAccount({
     password: string;
     repeat: string;
   }>();
+  const [settings] = useSettings()
 
   return (
     <div class="flex min-h-full flex-col ">
       <div class="sm:mx-auto sm:w-full sm:max-w-md">
         <h2 class="mt-6 text-center text-2xl font-bold leading-9 tracking-tight text-gray-900">
-          Create account
+          <i18n.Translate>Create account</i18n.Translate>
         </h2>
       </div>
 
@@ -33,29 +35,29 @@ export function CreateAccount({
                 password: {
                   error: !v.password
                     ? i18n.str`required`
-                    : v.password.length < 8
-                    ? i18n.str`should have at least 8 characters`
-                    : !v.password.match(/[a-z]/) && v.password.match(/[A-Z]/)
-                    ? i18n.str`should have lowercase and uppercase characters`
-                    : !v.password.match(/\d/)
-                    ? i18n.str`should have numbers`
-                    : !v.password.match(/[^a-zA-Z\d]/)
-                    ? i18n.str`should have at least one character which is not a number or letter`
-                    : undefined,
+                    : settings.allowInsecurePassword
+                      ? undefined
+                      : v.password.length < 8
+                        ? i18n.str`should have at least 8 characters`
+                        : !v.password.match(/[a-z]/) && v.password.match(/[A-Z]/)
+                          ? i18n.str`should have lowercase and uppercase characters`
+                          : !v.password.match(/\d/)
+                            ? i18n.str`should have numbers`
+                            : !v.password.match(/[^a-zA-Z\d]/)
+                              ? i18n.str`should have at least one character which is not a number or letter`
+                              : undefined,
                 },
                 repeat: {
                   error: !v.repeat
                     ? i18n.str`required`
                     : v.repeat !== v.password
-                    ? i18n.str`doesn't match`
-                    : undefined,
+                      ? i18n.str`doesn't match`
+                      : undefined,
                 },
               };
             }}
             onSubmit={async (v, s) => {
-              console.log(v, s);
               const error = s?.password?.error ?? s?.repeat?.error;
-              console.log(error);
               if (error) {
                 notifyError(
                   "Can't create account" as TranslatedString,
@@ -72,7 +74,9 @@ export function CreateAccount({
                 name="password"
                 type="password"
                 help={
-                  "lower and upper case letters, number and special character" as TranslatedString
+                  settings.allowInsecurePassword
+                    ? i18n.str`short password are insecure, turn off insecure password in settings`
+                    : i18n.str`lower and upper case letters, number and special character`
                 }
                 required
               />
@@ -91,7 +95,7 @@ export function CreateAccount({
                 type="submit"
                 class="flex w-full justify-center rounded-md bg-indigo-600 px-3 py-1.5 text-sm font-semibold leading-6 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"
               >
-                Create
+                <i18n.Translate>Create</i18n.Translate>
               </button>
             </div>
           </Form.Provider>
diff --git a/packages/aml-backoffice-ui/src/pages/HandleAccountNotReady.tsx b/packages/aml-backoffice-ui/src/pages/HandleAccountNotReady.tsx
index 05fd0a019..b3d04d97e 100644
--- a/packages/aml-backoffice-ui/src/pages/HandleAccountNotReady.tsx
+++ b/packages/aml-backoffice-ui/src/pages/HandleAccountNotReady.tsx
@@ -30,5 +30,8 @@ export function HandleAccountNotReady({
       />
     );
   }
+  return <div>
+    some
+  </div>
   throw Error(`unexpected account state ${(officer as any).state}`);
 }
diff --git a/packages/aml-backoffice-ui/src/pages/Home.tsx b/packages/aml-backoffice-ui/src/pages/Home.tsx
deleted file mode 100644
index 838032d63..000000000
--- a/packages/aml-backoffice-ui/src/pages/Home.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { h } from "preact";
-
-export function Home() {
-  return <div>Home</div>;
-}
diff --git a/packages/aml-backoffice-ui/src/pages/Officer.tsx b/packages/aml-backoffice-ui/src/pages/Officer.tsx
index 4af34805a..abada3725 100644
--- a/packages/aml-backoffice-ui/src/pages/Officer.tsx
+++ b/packages/aml-backoffice-ui/src/pages/Officer.tsx
@@ -1,9 +1,11 @@
 import { Fragment, h } from "preact";
 import { useOfficer } from "../hooks/useOfficer.js";
 import { HandleAccountNotReady } from "./HandleAccountNotReady.js";
+import { useTranslationContext } from "@gnu-taler/web-util/browser";
 
 export function Officer() {
   const officer = useOfficer();
+  const { i18n } = useTranslationContext()
   if (officer.state !== "ready") {
     return <HandleAccountNotReady officer={officer} />;
   }
@@ -11,7 +13,7 @@ export function Officer() {
   return (
     <div>
       <h1 class="my-2 text-3xl font-bold tracking-tight text-gray-900 ">
-        Public key
+        <i18n.Translate>Public key</i18n.Translate>
       </h1>
       <div class="max-w-xl text-base leading-7 text-gray-700 lg:max-w-lg">
         <p class="mt-6 font-mono break-all">{officer.account.id}</p>
@@ -25,7 +27,7 @@ export function Officer() {
           rel="noreferrer"
           class="m-4 block rounded-md w-fit border-0 px-3 py-2 text-center text-sm bg-indigo-700 text-white shadow-sm hover:bg-indigo-700"
         >
-          Request account activation
+          <i18n.Translate>Request account activation</i18n.Translate>
         </a>
       </p>
       <p>
@@ -36,7 +38,7 @@ export function Officer() {
           }}
           class="m-4 block rounded-md border-0 bg-gray-200 px-3 py-2 text-center text-sm text-black shadow-sm "
         >
-          Lock account
+          <i18n.Translate>Lock account</i18n.Translate>
         </button>
       </p>
       <p>
@@ -47,7 +49,7 @@ export function Officer() {
           }}
           class="m-4 block rounded-md bg-red-600 px-3 py-2 text-center text-sm  text-white shadow-sm hover:bg-red-500 "
         >
-          Remove account
+          <i18n.Translate>Forget account</i18n.Translate>
         </button>
       </p>
     </div>
diff --git a/packages/aml-backoffice-ui/src/pages/Settings.tsx b/packages/aml-backoffice-ui/src/pages/Settings.tsx
deleted file mode 100644
index ccff3b210..000000000
--- a/packages/aml-backoffice-ui/src/pages/Settings.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { h } from "preact";
-
-export function Settings() {
-  return <div>Settings</div>;
-}
diff --git a/packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx b/packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx
index 83d8767fb..a6570ffcc 100644
--- a/packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx
+++ b/packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx
@@ -1,5 +1,5 @@
 import { TranslatedString, UnwrapKeyError } from "@gnu-taler/taler-util";
-import { notifyError, notifyInfo } from "@gnu-taler/web-util/browser";
+import { notifyError, notifyInfo, useTranslationContext } from "@gnu-taler/web-util/browser";
 import { VNode, h } from "preact";
 import { createNewForm } from "../handlers/forms.js";
 
@@ -10,6 +10,7 @@ export function UnlockAccount({
   onAccountUnlocked: (password: string) => void;
   onRemoveAccount: () => void;
 }): VNode {
+  const { i18n } = useTranslationContext()
   const Form = createNewForm<{
     password: string;
   }>();
@@ -17,12 +18,12 @@ export function UnlockAccount({
   return (
     <div class="flex min-h-full flex-col ">
       <div class="sm:mx-auto sm:w-full sm:max-w-md">
-        <h2 class="mt-6 text-center text-2xl font-bold leading-9 tracking-tight text-gray-900">
-          Account locked
-        </h2>
+        <h1 class="mt-6 text-center text-2xl font-bold leading-9 tracking-tight text-gray-900">
+          <i18n.Translate>Account locked</i18n.Translate>
+        </h1>
         <p class="mt-6 text-lg leading-8 text-gray-600">
-          Your account is normally locked anytime you reload. To unlock type
-          your password again.
+          <i18n.Translate>Your account is normally locked anytime you reload. To unlock type
+            your password again.</i18n.Translate>
         </p>
       </div>
 
@@ -30,7 +31,7 @@ export function UnlockAccount({
         <div class="bg-gray-100 px-6 py-6 shadow sm:rounded-lg sm:px-12">
           <Form.Provider
             initialValue={{
-              password: "welcometo.5146",
+              password: "qwe",
             }}
             onSubmit={async (v) => {
               try {
@@ -63,7 +64,7 @@ export function UnlockAccount({
                 type="submit"
                 class="flex w-full justify-center rounded-md bg-indigo-600 px-3 py-1.5 text-sm font-semibold leading-6 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"
               >
-                Unlock
+                <i18n.Translate>Unlock</i18n.Translate>
               </button>
             </div>
           </Form.Provider>
@@ -75,7 +76,7 @@ export function UnlockAccount({
           }}
           class="m-4 block rounded-md bg-red-600 px-3 py-2 text-center text-sm  text-white shadow-sm hover:bg-red-500 "
         >
-          Remove account
+          <i18n.Translate>Forget account</i18n.Translate>
         </button>
       </div>
     </div>
diff --git a/packages/aml-backoffice-ui/src/pages/Welcome.tsx b/packages/aml-backoffice-ui/src/pages/Welcome.tsx
deleted file mode 100644
index 433fbcf59..000000000
--- a/packages/aml-backoffice-ui/src/pages/Welcome.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import { h } from "preact";
-
-export function Welcome({ name, asd }: { asd?: string; name?: string }) {
-  return (
-    <div>
-      {asd} Hello {name}
-    </div>
-  );
-}