From 381a994081b3e14e71ac94e50ba63f455008969d Mon Sep 17 00:00:00 2001 From: Sebastian Date: Mon, 27 Nov 2023 10:02:11 -0300 Subject: settings --- packages/demobank-ui/src/pages/BankFrame.tsx | 4 +- .../src/pages/PaytoWireTransferForm.tsx | 49 +++++++++++++++----- packages/demobank-ui/src/pages/admin/AdminHome.tsx | 44 ++++++------------ packages/demobank-ui/src/settings.json | 13 +++--- packages/demobank-ui/src/settings.ts | 54 +++++++++++++--------- 5 files changed, 91 insertions(+), 73 deletions(-) (limited to 'packages/demobank-ui') diff --git a/packages/demobank-ui/src/pages/BankFrame.tsx b/packages/demobank-ui/src/pages/BankFrame.tsx index 24012cd2b..a21ba4b27 100644 --- a/packages/demobank-ui/src/pages/BankFrame.tsx +++ b/packages/demobank-ui/src/pages/BankFrame.tsx @@ -17,7 +17,7 @@ import { Amounts, TalerError, TranslatedString } from "@gnu-taler/taler-util"; import { Footer, GlobalNotificationsBanner, Header, Loading, notifyError, notifyException, useTranslationContext } from "@gnu-taler/web-util/browser"; import { ComponentChildren, Fragment, VNode, h } from "preact"; -import { useEffect, useErrorBoundary } from "preact/hooks"; +import { useEffect, useErrorBoundary, useState } from "preact/hooks"; import { useAccountDetails } from "../hooks/access.js"; import { useBackendState } from "../hooks/backend.js"; import { getAllBooleanPreferences, getLabelForPreferences, usePreferences } from "../hooks/preferences.js"; @@ -65,7 +65,7 @@ export function BankFrame({ backend.logOut() updatePreferences("currentWithdrawalOperationId", undefined); }} - sites={settings.demoSites ?? new Array>(new Array())} + sites={!settings.topNavSites ? [] : Object.entries(settings.topNavSites)} supportedLangs={["en", "es", "de"]} >
  • diff --git a/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx b/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx index 33bf18abc..c93388d57 100644 --- a/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx +++ b/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx @@ -415,8 +415,6 @@ export function doAutoFocus(element: HTMLElement | null) { } } -const FRAC_SEPARATOR = "." - export function InputAmount( { currency, @@ -471,21 +469,48 @@ export function InputAmount( ); } -export function RenderAmount({ value, spec, negative, withColor }: { spec: CurrencySpecification; value: AmountJson, negative?: boolean, withColor?: boolean }): VNode { +const FRAC_SEPARATOR = "." +export function RenderAmount({ value, spec, negative, withColor, allowShort }: { spec: CurrencySpecification; value: AmountJson, allowShort?: boolean, negative?: boolean, withColor?: boolean }): VNode { const neg = !!negative //convert to true or false const str = Amounts.stringifyValue(value) - const sep_pos = str.indexOf(FRAC_SEPARATOR) - if (sep_pos !== -1 && str.length - sep_pos - 1 > spec.num_fractional_normal_digits) { + const pos = str.indexOf(FRAC_SEPARATOR) + const sep_pos = pos < 0 ? 0 : pos; + + let currency = value.currency + const names = Object.keys(spec.alt_unit_names) + let smallerIndex: string = "0" + if (names.length > 1) { + let indexSize = sep_pos + Object.keys(spec.alt_unit_names).forEach(index => { + const i = Number.parseInt(index, 10) + if (Number.isNaN(i)) return; + if (sep_pos - i < indexSize) { + indexSize = sep_pos - i; + smallerIndex = index + } + }) + currency = spec.alt_unit_names[smallerIndex] + } else if (names.length === 1) { + currency = names[0] + } + + let normal: string; + let small: string | undefined; + if (sep_pos && str.length - sep_pos - 1 > spec.num_fractional_normal_digits) { const limit = sep_pos + spec.num_fractional_normal_digits + 1 - const normal = str.substring(0, limit) - const small = str.substring(limit) - return - {negative ? "-" : undefined} - {value.currency} {normal} {small} - + normal = str.substring(0, limit) + small = str.substring(limit) + } else { + normal = str + small = undefined + } + + + if (allowShort) { + // const int_part = str.substring(0, sep_pos) } return {negative ? "-" : undefined} - {value.currency} {str} + {currency} {normal} {small && {small}} } \ No newline at end of file diff --git a/packages/demobank-ui/src/pages/admin/AdminHome.tsx b/packages/demobank-ui/src/pages/admin/AdminHome.tsx index d1b48fb6d..22090f83a 100644 --- a/packages/demobank-ui/src/pages/admin/AdminHome.tsx +++ b/packages/demobank-ui/src/pages/admin/AdminHome.tsx @@ -136,32 +136,8 @@ function Metrics(): VNode {

    Trading volume on {getDateForTimeframe(params.current, metricType)} compared to {getDateForTimeframe(params.previous, metricType)}

    -
    - {/* - - ASD - - */} - -
    - -
    +
    {resp.current.body.type !== "with-conversions" || resp.previous.body.type !== "with-conversions" ? undefined : @@ -222,12 +198,22 @@ function MetricValue({ current, previous }: { current: AmountString | undefined, const negative = cmp === 0 ? undefined : cmp === -1 const rateStr = `${(Math.abs(rate) * 100).toFixed(2)}%` + const pepe = "QWEQWEQWEWw:111111174523848.85229681" + function size(s: string = ""): "lg" | "md" | "sm" { + return s.length < 10 ? "sm" : s.length > 20 ? "lg" : "md"; + } return - -
    -
    - {!current ? "-" : } +
    +
    + {!current ? "-" : }
    + {pepe.length} +
    diff --git a/packages/demobank-ui/src/settings.json b/packages/demobank-ui/src/settings.json index 9c0f1f001..a9246bc93 100644 --- a/packages/demobank-ui/src/settings.json +++ b/packages/demobank-ui/src/settings.json @@ -1,12 +1,11 @@ { "backendBaseURL": "http://bank.taler.test:1180/", - "showDemoNav": true, "simplePasswordForRandomAccounts": true, "allowRandomAccountCreation": true, "bankName": "Taler DEVELOPMENT Bank", - "demoSites": [ - ["Exchange", "http://Exchnage.taler.test:1180/"], - ["Bank", "http://bank-ui.taler.test:1180/"], - ["Merchant", "http://merchant.taler.test:1180/"] - ] -} + "topNavSites": { + "Exchange": "http://Exchnage.taler.test:1180/", + "Bank": "http://bank-ui.taler.test:1180/", + "Merchant": "http://merchant.taler.test:1180/" + } +} \ No newline at end of file diff --git a/packages/demobank-ui/src/settings.ts b/packages/demobank-ui/src/settings.ts index 3a60c48a5..67f926e7f 100644 --- a/packages/demobank-ui/src/settings.ts +++ b/packages/demobank-ui/src/settings.ts @@ -14,23 +14,32 @@ GNU Taler; see the file COPYING. If not, see */ -import { Codec, buildCodecForObject, codecForBoolean, codecForList, codecForString, codecOptional } from "@gnu-taler/taler-util"; +import { Codec, buildCodecForObject, codecForBoolean, codecForList, codecForMap, codecForString, codecOptional } from "@gnu-taler/taler-util"; export interface BankUiSettings { - // location of the backend API + // Where libeufin backend is localted + // default: window.origin without "webui/" backendBaseURL?: string; - // where the user is going to be redirected after clicking the Taler icon - iconLinkURL?: string; - // show demo nav - showDemoNav?: boolean; - // links of the demo nav. Array of tuples that contains [name,url] - demoSites?: Array>; - // show a button "create random account" + // Shows a button "create random account" in the registration form + // Useful for testing + // default: false allowRandomAccountCreation?: boolean; - // every random account will have password "123" + // Create all random accounts with password "123" + // Useful for testing + // default: false simplePasswordForRandomAccounts?: boolean; - // bank name in the top + // Bank name shown in the header + // default: "Taler Bank" bankName?: string; + // URL where the user is going to be redirected after + // clicking in Taler Logo + // default: home page + iconLinkURL?: string; + // Mapping for every link shown in the top navitation bar + // - key: link label, what the user will read + // - value: link target, where the user is going to be redirected + // default: empty list + topNavSites?: Record; } /** @@ -39,31 +48,30 @@ export interface BankUiSettings { const defaultSettings: BankUiSettings = { backendBaseURL: undefined, iconLinkURL: undefined, - bankName: "Taler TESTING Bank", - showDemoNav: false, - simplePasswordForRandomAccounts: true, - allowRandomAccountCreation: true, - demoSites: [ - ["Demo", "https://demo.taler.net/"], - ], + bankName: "Taler Bank", + simplePasswordForRandomAccounts: false, + allowRandomAccountCreation: false, + topNavSites: {}, }; const codecForBankUISettings = (): Codec => buildCodecForObject() - .property("allowRandomAccountCreation", codecOptional(codecForBoolean())) .property("backendBaseURL", codecOptional(codecForString())) + .property("allowRandomAccountCreation", codecOptional(codecForBoolean())) + .property("simplePasswordForRandomAccounts", codecOptional(codecForBoolean())) .property("bankName", codecOptional(codecForString())) - .property("demoSites", codecOptional(codecForList(codecForList(codecForString())))) .property("iconLinkURL", codecOptional(codecForString())) - .property("showDemoNav", codecOptional(codecForBoolean())) - .property("simplePasswordForRandomAccounts", codecOptional(codecForBoolean())) + .property("topNavSites", codecOptional(codecForMap(codecForString()))) .build("BankUiSettings"); export function fetchSettings(listener: (s: BankUiSettings) => void): void { fetch("./settings.json") .then(resp => resp.json()) .then(json => codecForBankUISettings().decode(json)) - .then(listener) + .then(result => listener({ + ...defaultSettings, + ...result, + })) .catch(e => { console.log("failed to fetch settings", e) listener(defaultSettings) -- cgit v1.2.3