From c680f5aa71b08e978444df07f93c381f9d47ab82 Mon Sep 17 00:00:00 2001 From: Sebastian Date: Mon, 5 Jun 2023 10:04:09 -0300 Subject: rename aml --- packages/aml-backoffice-ui/.gitignore | 4 + packages/aml-backoffice-ui/Makefile | 17 + packages/aml-backoffice-ui/README.md | 4 + packages/aml-backoffice-ui/build.mjs | 28 + packages/aml-backoffice-ui/copyleft-header.js | 15 + packages/aml-backoffice-ui/dev.mjs | 40 + packages/aml-backoffice-ui/package.json | 67 ++ packages/aml-backoffice-ui/postcss.config.js | 6 + packages/aml-backoffice-ui/src/App.tsx | 12 + packages/aml-backoffice-ui/src/Dashboard.tsx | 599 +++++++++++++++ packages/aml-backoffice-ui/src/NiceForm.tsx | 59 ++ packages/aml-backoffice-ui/src/account.ts | 92 +++ .../aml-backoffice-ui/src/assets/logo-2021.svg | 9 + packages/aml-backoffice-ui/src/declaration.d.ts | 30 + packages/aml-backoffice-ui/src/forms/902_11e.ts | 154 ++++ packages/aml-backoffice-ui/src/forms/902_12e.ts | 440 +++++++++++ packages/aml-backoffice-ui/src/forms/902_13e.ts | 527 +++++++++++++ packages/aml-backoffice-ui/src/forms/902_15e.ts | 197 +++++ packages/aml-backoffice-ui/src/forms/902_1e.ts | 695 +++++++++++++++++ packages/aml-backoffice-ui/src/forms/902_4e.ts | 822 +++++++++++++++++++++ packages/aml-backoffice-ui/src/forms/902_5e.ts | 281 +++++++ packages/aml-backoffice-ui/src/forms/902_9e.ts | 138 ++++ packages/aml-backoffice-ui/src/forms/index.ts | 146 ++++ packages/aml-backoffice-ui/src/forms/simplest.ts | 103 +++ .../aml-backoffice-ui/src/handlers/Caption.tsx | 35 + .../src/handlers/FormProvider.tsx | 99 +++ packages/aml-backoffice-ui/src/handlers/Group.tsx | 41 + .../aml-backoffice-ui/src/handlers/InputAmount.tsx | 34 + .../aml-backoffice-ui/src/handlers/InputArray.tsx | 183 +++++ .../src/handlers/InputChoiceHorizontal.tsx | 86 +++ .../src/handlers/InputChoiceStacked.tsx | 111 +++ .../aml-backoffice-ui/src/handlers/InputDate.tsx | 37 + .../aml-backoffice-ui/src/handlers/InputFile.tsx | 101 +++ .../src/handlers/InputInteger.tsx | 23 + .../aml-backoffice-ui/src/handlers/InputLine.tsx | 282 +++++++ .../src/handlers/InputSelectMultiple.tsx | 151 ++++ .../src/handlers/InputSelectOne.tsx | 134 ++++ .../aml-backoffice-ui/src/handlers/InputText.tsx | 8 + .../src/handlers/InputTextArea.tsx | 8 + packages/aml-backoffice-ui/src/handlers/forms.ts | 135 ++++ .../aml-backoffice-ui/src/handlers/useField.ts | 93 +++ packages/aml-backoffice-ui/src/hooks/useOfficer.ts | 100 +++ packages/aml-backoffice-ui/src/i18n/bank.pot | 486 ++++++++++++ packages/aml-backoffice-ui/src/i18n/de.po | 486 ++++++++++++ packages/aml-backoffice-ui/src/i18n/en.po | 511 +++++++++++++ packages/aml-backoffice-ui/src/i18n/es.po | 497 +++++++++++++ packages/aml-backoffice-ui/src/i18n/fr.po | 486 ++++++++++++ packages/aml-backoffice-ui/src/i18n/it.po | 521 +++++++++++++ packages/aml-backoffice-ui/src/i18n/poheader | 26 + .../aml-backoffice-ui/src/i18n/strings-prelude | 19 + packages/aml-backoffice-ui/src/i18n/strings.ts | 510 +++++++++++++ packages/aml-backoffice-ui/src/index.html | 42 ++ packages/aml-backoffice-ui/src/index.tsx | 22 + packages/aml-backoffice-ui/src/pages.ts | 55 ++ .../src/pages/AntiMoneyLaunderingForm.tsx | 90 +++ .../aml-backoffice-ui/src/pages/CaseDetails.tsx | 447 +++++++++++ packages/aml-backoffice-ui/src/pages/Cases.tsx | 288 ++++++++ .../aml-backoffice-ui/src/pages/CreateAccount.tsx | 102 +++ .../src/pages/HandleAccountNotReady.tsx | 34 + packages/aml-backoffice-ui/src/pages/Home.tsx | 5 + .../aml-backoffice-ui/src/pages/NewFormEntry.tsx | 76 ++ packages/aml-backoffice-ui/src/pages/Officer.tsx | 55 ++ packages/aml-backoffice-ui/src/pages/Settings.tsx | 5 + .../aml-backoffice-ui/src/pages/UnlockAccount.tsx | 81 ++ packages/aml-backoffice-ui/src/pages/Welcome.tsx | 9 + packages/aml-backoffice-ui/src/route.ts | 167 +++++ packages/aml-backoffice-ui/src/scss/main.css | 3 + packages/aml-backoffice-ui/src/stories.test.ts | 56 ++ packages/aml-backoffice-ui/src/stories.tsx | 44 ++ packages/aml-backoffice-ui/src/types.ts | 81 ++ packages/aml-backoffice-ui/tailwind.config.js | 8 + packages/aml-backoffice-ui/test.mjs | 31 + packages/aml-backoffice-ui/tsconfig.json | 51 ++ 73 files changed, 11440 insertions(+) create mode 100644 packages/aml-backoffice-ui/.gitignore create mode 100644 packages/aml-backoffice-ui/Makefile create mode 100644 packages/aml-backoffice-ui/README.md create mode 100755 packages/aml-backoffice-ui/build.mjs create mode 100644 packages/aml-backoffice-ui/copyleft-header.js create mode 100755 packages/aml-backoffice-ui/dev.mjs create mode 100644 packages/aml-backoffice-ui/package.json create mode 100644 packages/aml-backoffice-ui/postcss.config.js create mode 100644 packages/aml-backoffice-ui/src/App.tsx create mode 100644 packages/aml-backoffice-ui/src/Dashboard.tsx create mode 100644 packages/aml-backoffice-ui/src/NiceForm.tsx create mode 100644 packages/aml-backoffice-ui/src/account.ts create mode 100644 packages/aml-backoffice-ui/src/assets/logo-2021.svg create mode 100644 packages/aml-backoffice-ui/src/declaration.d.ts create mode 100644 packages/aml-backoffice-ui/src/forms/902_11e.ts create mode 100644 packages/aml-backoffice-ui/src/forms/902_12e.ts create mode 100644 packages/aml-backoffice-ui/src/forms/902_13e.ts create mode 100644 packages/aml-backoffice-ui/src/forms/902_15e.ts create mode 100644 packages/aml-backoffice-ui/src/forms/902_1e.ts create mode 100644 packages/aml-backoffice-ui/src/forms/902_4e.ts create mode 100644 packages/aml-backoffice-ui/src/forms/902_5e.ts create mode 100644 packages/aml-backoffice-ui/src/forms/902_9e.ts create mode 100644 packages/aml-backoffice-ui/src/forms/index.ts create mode 100644 packages/aml-backoffice-ui/src/forms/simplest.ts create mode 100644 packages/aml-backoffice-ui/src/handlers/Caption.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/FormProvider.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/Group.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/InputAmount.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/InputArray.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/InputChoiceHorizontal.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/InputChoiceStacked.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/InputDate.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/InputFile.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/InputInteger.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/InputLine.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/InputSelectMultiple.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/InputSelectOne.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/InputText.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/InputTextArea.tsx create mode 100644 packages/aml-backoffice-ui/src/handlers/forms.ts create mode 100644 packages/aml-backoffice-ui/src/handlers/useField.ts create mode 100644 packages/aml-backoffice-ui/src/hooks/useOfficer.ts create mode 100644 packages/aml-backoffice-ui/src/i18n/bank.pot create mode 100644 packages/aml-backoffice-ui/src/i18n/de.po create mode 100644 packages/aml-backoffice-ui/src/i18n/en.po create mode 100644 packages/aml-backoffice-ui/src/i18n/es.po create mode 100644 packages/aml-backoffice-ui/src/i18n/fr.po create mode 100644 packages/aml-backoffice-ui/src/i18n/it.po create mode 100644 packages/aml-backoffice-ui/src/i18n/poheader create mode 100644 packages/aml-backoffice-ui/src/i18n/strings-prelude create mode 100644 packages/aml-backoffice-ui/src/i18n/strings.ts create mode 100644 packages/aml-backoffice-ui/src/index.html create mode 100644 packages/aml-backoffice-ui/src/index.tsx create mode 100644 packages/aml-backoffice-ui/src/pages.ts create mode 100644 packages/aml-backoffice-ui/src/pages/AntiMoneyLaunderingForm.tsx create mode 100644 packages/aml-backoffice-ui/src/pages/CaseDetails.tsx create mode 100644 packages/aml-backoffice-ui/src/pages/Cases.tsx create mode 100644 packages/aml-backoffice-ui/src/pages/CreateAccount.tsx create mode 100644 packages/aml-backoffice-ui/src/pages/HandleAccountNotReady.tsx create mode 100644 packages/aml-backoffice-ui/src/pages/Home.tsx create mode 100644 packages/aml-backoffice-ui/src/pages/NewFormEntry.tsx create mode 100644 packages/aml-backoffice-ui/src/pages/Officer.tsx create mode 100644 packages/aml-backoffice-ui/src/pages/Settings.tsx create mode 100644 packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx create mode 100644 packages/aml-backoffice-ui/src/pages/Welcome.tsx create mode 100644 packages/aml-backoffice-ui/src/route.ts create mode 100644 packages/aml-backoffice-ui/src/scss/main.css create mode 100644 packages/aml-backoffice-ui/src/stories.test.ts create mode 100644 packages/aml-backoffice-ui/src/stories.tsx create mode 100644 packages/aml-backoffice-ui/src/types.ts create mode 100644 packages/aml-backoffice-ui/tailwind.config.js create mode 100755 packages/aml-backoffice-ui/test.mjs create mode 100644 packages/aml-backoffice-ui/tsconfig.json (limited to 'packages/aml-backoffice-ui') diff --git a/packages/aml-backoffice-ui/.gitignore b/packages/aml-backoffice-ui/.gitignore new file mode 100644 index 000000000..30cb2774c --- /dev/null +++ b/packages/aml-backoffice-ui/.gitignore @@ -0,0 +1,4 @@ +node_modules +/build +/*.log +/demobank-ui-settings.js diff --git a/packages/aml-backoffice-ui/Makefile b/packages/aml-backoffice-ui/Makefile new file mode 100644 index 000000000..ddbef73b3 --- /dev/null +++ b/packages/aml-backoffice-ui/Makefile @@ -0,0 +1,17 @@ +# This Makefile has been placed in the public domain + +# Settings from "./configure" +include .config.mk + +all: + @echo run \'make install\' to install + +spa_dir=$(prefix)/share/taler/aml-backoffice-ui + +install: + pnpm install --frozen-lockfile --filter @gnu-taler/aml-backoffice-ui... + pnpm run check + pnpm run build + install -d $(spa_dir) + install ./dist/prod/* $(spa_dir) + diff --git a/packages/aml-backoffice-ui/README.md b/packages/aml-backoffice-ui/README.md new file mode 100644 index 000000000..855addd74 --- /dev/null +++ b/packages/aml-backoffice-ui/README.md @@ -0,0 +1,4 @@ +# Taler Exchange Backoffice UI + +Web-based user interface for the GNU Taler exchange. + diff --git a/packages/aml-backoffice-ui/build.mjs b/packages/aml-backoffice-ui/build.mjs new file mode 100755 index 000000000..ae38c193d --- /dev/null +++ b/packages/aml-backoffice-ui/build.mjs @@ -0,0 +1,28 @@ +#!/usr/bin/env node +/* + This file is part of GNU Taler + (C) 2022 Taler Systems S.A. + + GNU Taler is free software; you can redistribute it and/or modify it under the + terms of the GNU General Public License as published by the Free Software + Foundation; either version 3, or (at your option) any later version. + + GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY + WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR + A PARTICULAR PURPOSE. See the GNU General Public License for more details. + + You should have received a copy of the GNU General Public License along with + GNU Taler; see the file COPYING. If not, see + */ + +import { build } from "@gnu-taler/web-util/build"; + +await build({ + type: "production", + source: { + js: ["src/index.tsx"], + assets: [{base:"src",files:["src/index.html"]}], + }, + destination: "./dist/prod", + css: "postcss", +}); diff --git a/packages/aml-backoffice-ui/copyleft-header.js b/packages/aml-backoffice-ui/copyleft-header.js new file mode 100644 index 000000000..2635717c5 --- /dev/null +++ b/packages/aml-backoffice-ui/copyleft-header.js @@ -0,0 +1,15 @@ +/* + This file is part of GNU Taler + (C) 2022 Taler Systems S.A. + + GNU Taler is free software; you can redistribute it and/or modify it under the + terms of the GNU General Public License as published by the Free Software + Foundation; either version 3, or (at your option) any later version. + + GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY + WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR + A PARTICULAR PURPOSE. See the GNU General Public License for more details. + + You should have received a copy of the GNU General Public License along with + GNU Taler; see the file COPYING. If not, see + */ diff --git a/packages/aml-backoffice-ui/dev.mjs b/packages/aml-backoffice-ui/dev.mjs new file mode 100755 index 000000000..c8996b894 --- /dev/null +++ b/packages/aml-backoffice-ui/dev.mjs @@ -0,0 +1,40 @@ +#!/usr/bin/env node +/* + This file is part of GNU Taler + (C) 2022 Taler Systems S.A. + + GNU Taler is free software; you can redistribute it and/or modify it under the + terms of the GNU General Public License as published by the Free Software + Foundation; either version 3, or (at your option) any later version. + + GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY + WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR + A PARTICULAR PURPOSE. See the GNU General Public License for more details. + + You should have received a copy of the GNU General Public License along with + GNU Taler; see the file COPYING. If not, see + */ + +import { serve } from "@gnu-taler/web-util/node"; +import { initializeDev } from "@gnu-taler/web-util/build"; + +const devEntryPoints = ["src/stories.tsx", "src/index.tsx"]; + +const build = initializeDev({ + type: "development", + source: { + js: devEntryPoints, + assets: [{base:"src",files:["src/index.html"]}], + }, + destination: "./dist/dev", + css: "postcss", +}); + +await build(); + +serve({ + folder: "./dist/dev", + port: 8080, + source: "./src", + onSourceUpdate: build, +}); diff --git a/packages/aml-backoffice-ui/package.json b/packages/aml-backoffice-ui/package.json new file mode 100644 index 000000000..b953bf581 --- /dev/null +++ b/packages/aml-backoffice-ui/package.json @@ -0,0 +1,67 @@ +{ + "private": true, + "name": "@gnu-taler/aml-backoffice-ui", + "version": "0.1.0", + "author": "sebasjm", + "license": "AGPL-3.0-OR-LATER", + "description": "Back-office SPA for GNU Taler Exchange.", + "type": "module", + "scripts": { + "build": "./build.mjs", + "check": "tsc", + "compile": "tsc && ./build.mjs", + "test": "./test.mjs && mocha --require source-map-support/register 'dist/test/**/*.test.js' 'dist/test/**/test.js'", + "lint": "eslint 'src/**/*.{js,jsx,ts,tsx}'", + "i18n:extract": "pogen extract", + "i18n:merge": "pogen merge", + "i18n:emit": "pogen emit", + "i18n": "pnpm i18n:extract && pnpm i18n:merge && pnpm i18n:emit", + "pretty": "prettier --write src" + }, + "dependencies": { + "@gnu-taler/taler-util": "workspace:*", + "@gnu-taler/web-util": "workspace:*", + "@headlessui/react": "^1.7.14", + "@heroicons/react": "^2.0.17", + "date-fns": "2.29.3", + "history": "4.10.1", + "jed": "1.1.1", + "preact": "10.11.3", + "swr": "2.0.3" + }, + "eslintConfig": { + "plugins": [ + "header" + ], + "rules": { + "header/header": [ + 2, + "copyleft-header.js" + ] + }, + "extends": [ + "prettier" + ] + }, + "devDependencies": { + "@gnu-taler/pogen": "^0.0.5", + "@tailwindcss/forms": "^0.5.3", + "@tailwindcss/typography": "^0.5.9", + "@types/chai": "^4.3.0", + "@types/history": "^4.7.8", + "@types/mocha": "^10.0.1", + "autoprefixer": "^10.4.14", + "chai": "^4.3.6", + "esbuild": "^0.17.7", + "eslint-config-preact": "^1.2.0", + "mocha": "^9.2.0", + "po2json": "^0.4.5", + "postcss": "^8.4.23", + "postcss-cli": "^10.1.0", + "tailwindcss": "^3.3.2", + "typescript": "4.9.4" + }, + "pogen": { + "domain": "aml-backoffice" + } +} diff --git a/packages/aml-backoffice-ui/postcss.config.js b/packages/aml-backoffice-ui/postcss.config.js new file mode 100644 index 000000000..2e7af2b7f --- /dev/null +++ b/packages/aml-backoffice-ui/postcss.config.js @@ -0,0 +1,6 @@ +export default { + plugins: { + tailwindcss: {}, + autoprefixer: {}, + }, +} diff --git a/packages/aml-backoffice-ui/src/App.tsx b/packages/aml-backoffice-ui/src/App.tsx new file mode 100644 index 000000000..600131219 --- /dev/null +++ b/packages/aml-backoffice-ui/src/App.tsx @@ -0,0 +1,12 @@ +import { TranslationProvider } from "@gnu-taler/web-util/browser"; +import { h, VNode } from "preact"; +import { Dashboard } from "./Dashboard.js"; +import "./scss/main.css"; + +export function App(): VNode { + return ( + + + + ); +} diff --git a/packages/aml-backoffice-ui/src/Dashboard.tsx b/packages/aml-backoffice-ui/src/Dashboard.tsx new file mode 100644 index 000000000..6794ca1f8 --- /dev/null +++ b/packages/aml-backoffice-ui/src/Dashboard.tsx @@ -0,0 +1,599 @@ +import { useNotifications } from "@gnu-taler/web-util/browser"; +import { Dialog, Transition } from "@headlessui/react"; +import { UserIcon, XCircleIcon } from "@heroicons/react/20/solid"; +import { CheckCircleIcon, XMarkIcon } from "@heroicons/react/24/outline"; +import { InformationCircleIcon } from "@heroicons/react/24/solid"; +import { ComponentChildren, Fragment, VNode, h } from "preact"; +import { useState } from "preact/hooks"; +import logo from "./assets/logo-2021.svg"; +import { Pages } from "./pages.js"; +import { Router, useCurrentLocation } from "./route.js"; + +function classNames(...classes: string[]) { + return classes.filter(Boolean).join(" "); +} + +/** + * mapping route to view + * not found (error page) + * nested, index element, relative routes + * link interception + * form POST interception, call action + * fromData => Object.fromEntries + * segments in the URL + * navigationState: idle, submitting, loading + * form GET interception: does a navigateTo + * form GET Sync: + * 1.- back after submit: useEffect to sync URL to form + * 2.- refresh after submit: input default value + * useSubmit for form submission onChange, history replace + * + * post form without redirect + * + * + * @param param0 + * @returns + */ + +const GIT_HASH = typeof __GIT_HASH__ !== "undefined" ? __GIT_HASH__ : undefined; +const VERSION = typeof __VERSION__ !== "undefined" ? __VERSION__ : undefined; + +const versionText = VERSION + ? GIT_HASH + ? `v${VERSION} (${GIT_HASH.substring(0, 8)})` + : VERSION + : ""; + +/** + * TO BE FIXED: + * + * 1.- when the form change to other form and both form share the same structure + * the same input component may be rendered in the same place, + * since input are uncontrolled the are not re-rendered and since they are + * uncontrolled it will keep the value of the previous form. + * One solutions could be to remove the form when unloading and when the new + * form load it will start without previous vdom, preventing the cache + * to create this behavior. + * Other solutions could be using IDs in the fields that are constructed + * with the ID of the form, so two fields of different form will need to re-render + * cleaning up the state of the previous form. + * + * 2.- currently the design prop and the behavior prop of the flexible form + * are two side of the same coin. From the design point of view, it is important + * to design the form in a list-of-field manner and there may be additional + * content that is not directly mapped to the form structure (object) + * So maybe we want to change the current shape so the computation of the state + * of the form is in a field level, but this computation required the field value and + * the whole form values and state (since one field may be disabled/hidden) because + * of the value of other field. + * + * 3.- given the previous requirement, maybe the name of the field of the form could be + * a function (P: F -> V) where F is the form (or parent object) and V is the type of the + * property. That will help with the typing of the forms props + * + * 4.- tooltip are not placed correctly: the arrow should point the question mark + * and the text area should be bigger + * + * 5.- date field should have the calendar icon clickable so the user can select date without + * writing text with the correct format + */ + +function LeftMenu() { + const currentLocation = useCurrentLocation(pageList); + + return ( + + ); +} + +export function Dashboard({ + children, +}: { + children?: ComponentChildren; +}): VNode { + const [sidebarOpen, setSidebarOpen] = useState(false); + + return ( + + +
+
+
+

+ Exchange AML Backoffice +

+
+
+ +
+
+ +
+ { + setSidebarOpen(true); + }} + /> + +
+
+ { + return
not found
; + }} + /> +
+
+
+ + ); +} + +const pageList = Object.values(Pages); + +function NavigationBar({ + isOpen, + setOpen, + children, +}: { + isOpen: boolean; + setOpen: (v: boolean) => void; + children: ComponentChildren; +}) { + return ( + + + + +
+ + +
+ + + +
+ +
+ + {children} + + +
+
+ + + + + ); +} + +function TopBar({ onOpenSidebar }: { onOpenSidebar: () => void }) { + return ( +
+
+ +
+
+
+ Taler +
+
+ {/*
dd
*/} +
+ ); +} + +// return ( +//
+// + +// {/* Separator */} +//