diff options
Diffstat (limited to 'packages/merchant-backoffice-ui/src/paths')
4 files changed, 75 insertions, 33 deletions
diff --git a/packages/merchant-backoffice-ui/src/paths/admin/create/CreatePage.tsx b/packages/merchant-backoffice-ui/src/paths/admin/create/CreatePage.tsx index a28992a2f..6a94109a0 100644 --- a/packages/merchant-backoffice-ui/src/paths/admin/create/CreatePage.tsx +++ b/packages/merchant-backoffice-ui/src/paths/admin/create/CreatePage.tsx @@ -25,7 +25,7 @@ import { createRFC8959AccessTokenPlain, } from "@gnu-taler/taler-util"; import { useTranslationContext } from "@gnu-taler/web-util/browser"; -import { h, VNode } from "preact"; +import { VNode, h } from "preact"; import { useState } from "preact/hooks"; import { AsyncButton } from "../../../components/exception/AsyncButton.js"; import { @@ -34,6 +34,7 @@ import { } from "../../../components/form/FormProvider.js"; import { DefaultInstanceFormFields } from "../../../components/instance/DefaultInstanceFormFields.js"; import { SetTokenNewInstanceModal } from "../../../components/modal/index.js"; +import { usePreference } from "../../../hooks/preference.js"; import { INSTANCE_ID_REGEX } from "../../../utils/constants.js"; import { undefinedIfEmpty } from "../../../utils/table.js"; @@ -64,13 +65,13 @@ function with_defaults(id?: string): Partial<Entity> { } export function CreatePage({ onCreate, onBack, forceId }: Props): VNode { + const [pref, updatePref] = usePreference(); + const { i18n } = useTranslationContext(); const [value, valueHandler] = useState(with_defaults(forceId)); const [isTokenSet, updateIsTokenSet] = useState<boolean>(false); const [isTokenDialogActive, updateIsTokenDialogActive] = useState<boolean>(false); - const { i18n } = useTranslationContext(); - const errors: FormErrors<Entity> = { id: !value.id ? i18n.str`required` @@ -186,6 +187,34 @@ export function CreatePage({ onCreate, onBack, forceId }: Props): VNode { </div> <section class="section is-main-section"> + <div class="tabs is-toggle is-fullwidth is-small"> + <ul> + <li + class={!pref.advanceInstanceMode ? "is-active" : ""} + onClick={() => { + updatePref("advanceInstanceMode", false); + }} + > + <a> + <span> + <i18n.Translate>Simple</i18n.Translate> + </span> + </a> + </li> + <li + class={pref.advanceInstanceMode ? "is-active" : ""} + onClick={() => { + updatePref("advanceInstanceMode", true); + }} + > + <a> + <span> + <i18n.Translate>Advanced</i18n.Translate> + </span> + </a> + </li> + </ul> + </div>{" "} <div class="columns"> <div class="column" /> <div class="column is-four-fifths"> @@ -194,7 +223,11 @@ export function CreatePage({ onCreate, onBack, forceId }: Props): VNode { object={value} valueHandler={valueHandler} > - <DefaultInstanceFormFields readonlyId={!!forceId} showId={true} /> + <DefaultInstanceFormFields + readonlyId={!!forceId} + showId={true} + showLessFields={!pref.advanceInstanceMode} + /> </FormProvider> <div class="level"> diff --git a/packages/merchant-backoffice-ui/src/paths/instance/orders/create/CreatePage.tsx b/packages/merchant-backoffice-ui/src/paths/instance/orders/create/CreatePage.tsx index 7be3d23f6..29c50fb07 100644 --- a/packages/merchant-backoffice-ui/src/paths/instance/orders/create/CreatePage.tsx +++ b/packages/merchant-backoffice-ui/src/paths/instance/orders/create/CreatePage.tsx @@ -138,7 +138,7 @@ export function CreatePage({ const instance_default = with_defaults(instanceConfig, config.currency); const [value, valueHandler] = useState(instance_default); const zero = Amounts.zeroOfCurrency(config.currency); - const [settings, updateSettings] = usePreference(); + const [pref, updatePrefs] = usePreference(); const inventoryList = Object.values(value.inventoryProducts || {}); const productList = Object.values(value.products || {}); @@ -360,9 +360,9 @@ export function CreatePage({ <div class="tabs is-toggle is-fullwidth is-small"> <ul> <li - class={!settings.advanceOrderMode ? "is-active" : ""} + class={!pref.advanceOrderMode ? "is-active" : ""} onClick={() => { - updateSettings("advanceOrderMode", false); + updatePrefs("advanceOrderMode", false); }} > <a> @@ -372,9 +372,9 @@ export function CreatePage({ </a> </li> <li - class={settings.advanceOrderMode ? "is-active" : ""} + class={pref.advanceOrderMode ? "is-active" : ""} onClick={() => { - updateSettings("advanceOrderMode", true); + updatePrefs("advanceOrderMode", true); }} > <a> @@ -408,7 +408,7 @@ export function CreatePage({ inventory={instanceInventory} /> - {settings.advanceOrderMode && ( + {pref.advanceOrderMode && ( <NonInventoryProductFrom productToEdit={editingProduct} onAddProduct={(p) => { @@ -481,7 +481,7 @@ export function CreatePage({ tooltip={i18n.str`Title of the order to be shown to the customer`} /> - {settings.advanceOrderMode && ( + {pref.advanceOrderMode && ( <InputGroup name="shipping" label={i18n.str`Shipping and Fulfillment`} @@ -509,13 +509,13 @@ export function CreatePage({ </InputGroup> )} - {(settings.advanceOrderMode || requiresSomeTalerOptions) && ( + {(pref.advanceOrderMode || requiresSomeTalerOptions) && ( <InputGroup name="payments" label={i18n.str`Taler payment options`} tooltip={i18n.str`Override default Taler payment settings for this order`} > - {(settings.advanceOrderMode || noDefault_payDeadline) && ( + {(pref.advanceOrderMode || noDefault_payDeadline) && ( <InputDuration name="payments.pay_deadline" label={i18n.str`Payment time`} @@ -547,7 +547,7 @@ export function CreatePage({ } /> )} - {settings.advanceOrderMode && ( + {pref.advanceOrderMode && ( <InputDuration name="payments.refund_deadline" label={i18n.str`Refund time`} @@ -580,7 +580,7 @@ export function CreatePage({ } /> )} - {(settings.advanceOrderMode || noDefault_wireDeadline) && ( + {(pref.advanceOrderMode || noDefault_wireDeadline) && ( <InputDuration name="payments.wire_transfer_deadline" label={i18n.str`Wire transfer time`} @@ -614,7 +614,7 @@ export function CreatePage({ } /> )} - {settings.advanceOrderMode && ( + {pref.advanceOrderMode && ( <InputDuration name="payments.auto_refund_deadline" label={i18n.str`Auto-refund time`} @@ -628,21 +628,21 @@ export function CreatePage({ /> )} - {settings.advanceOrderMode && ( + {pref.advanceOrderMode && ( <InputCurrency name="payments.max_fee" label={i18n.str`Maximum fee`} tooltip={i18n.str`Maximum fees the merchant is willing to cover for this order. Higher deposit fees must be covered in full by the consumer.`} /> )} - {settings.advanceOrderMode && ( + {pref.advanceOrderMode && ( <InputToggle name="payments.createToken" label={i18n.str`Create token`} tooltip={i18n.str`If the order ID is easy to guess the token will prevent user to steal orders from others.`} /> )} - {settings.advanceOrderMode && ( + {pref.advanceOrderMode && ( <InputNumber name="payments.minimum_age" label={i18n.str`Minimum age required`} @@ -657,7 +657,7 @@ export function CreatePage({ </InputGroup> )} - {settings.advanceOrderMode && ( + {pref.advanceOrderMode && ( <InputGroup name="extra" label={i18n.str`Additional information`} diff --git a/packages/merchant-backoffice-ui/src/paths/instance/orders/create/index.tsx b/packages/merchant-backoffice-ui/src/paths/instance/orders/create/index.tsx index 861114014..04f0b2482 100644 --- a/packages/merchant-backoffice-ui/src/paths/instance/orders/create/index.tsx +++ b/packages/merchant-backoffice-ui/src/paths/instance/orders/create/index.tsx @@ -19,7 +19,12 @@ * @author Sebastian Javier Marchano (sebasjm) */ -import { HttpStatusCode, TalerError, TalerMerchantApi, assertUnreachable } from "@gnu-taler/taler-util"; +import { + HttpStatusCode, + TalerError, + TalerMerchantApi, + assertUnreachable, +} from "@gnu-taler/taler-util"; import { Fragment, VNode, h } from "preact"; import { useState } from "preact/hooks"; import { ErrorLoadingMerchant } from "../../../../components/ErrorLoadingMerchant.js"; @@ -41,24 +46,21 @@ interface Props { onBack?: () => void; onConfirm: (id: string) => void; } -export default function OrderCreate({ - onConfirm, - onBack, -}: Props): VNode { +export default function OrderCreate({ onConfirm, onBack }: Props): VNode { const { lib } = useSessionContext(); const [notif, setNotif] = useState<Notification | undefined>(undefined); const { state } = useSessionContext(); const detailsResult = useInstanceDetails(); const inventoryResult = useInstanceProducts(); - if (!detailsResult) return <Loading /> + if (!detailsResult) return <Loading />; if (detailsResult instanceof TalerError) { - return <ErrorLoadingMerchant error={detailsResult} /> + return <ErrorLoadingMerchant error={detailsResult} />; } if (detailsResult.type === "fail") { switch (detailsResult.case) { case HttpStatusCode.Unauthorized: { - return <LoginPage /> + return <LoginPage />; } case HttpStatusCode.NotFound: { return <NotFoundPageOrAdminCreate />; @@ -68,9 +70,9 @@ export default function OrderCreate({ } } } - if (!inventoryResult) return <Loading /> + if (!inventoryResult) return <Loading />; if (inventoryResult instanceof TalerError) { - return <ErrorLoadingMerchant error={inventoryResult} /> + return <ErrorLoadingMerchant error={inventoryResult} />; } if (inventoryResult.type === "fail") { switch (inventoryResult.case) { @@ -78,7 +80,7 @@ export default function OrderCreate({ return <NotFoundPageOrAdminCreate />; } case HttpStatusCode.Unauthorized: { - return <LoginPage /> + return <LoginPage />; } default: { assertUnreachable(inventoryResult); @@ -93,10 +95,11 @@ export default function OrderCreate({ <CreatePage onBack={onBack} onCreate={(request: TalerMerchantApi.PostOrderRequest) => { - lib.instance.createOrder(state.token, request) + lib.instance + .createOrder(state.token, request) .then((r) => { if (r.type === "ok") { - return onConfirm(r.body.order_id) + return onConfirm(r.body.order_id); } else { setNotif({ message: "could not create order", diff --git a/packages/merchant-backoffice-ui/src/paths/settings/index.tsx b/packages/merchant-backoffice-ui/src/paths/settings/index.tsx index 0c4b9dd1a..ac23f7f09 100644 --- a/packages/merchant-backoffice-ui/src/paths/settings/index.tsx +++ b/packages/merchant-backoffice-ui/src/paths/settings/index.tsx @@ -45,6 +45,7 @@ export function Settings({ onClose }: { onClose?: () => void }): VNode { const next = s(value); const v: Preferences = { advanceOrderMode: next.advanceOrderMode ?? false, + advanceInstanceMode: next.advanceInstanceMode ?? false, hideMissingAccountUntil: next.hideMissingAccountUntil ?? AbsoluteTime.never(), hideKycUntil: next.hideKycUntil ?? AbsoluteTime.never(), dateFormat: next.dateFormat ?? "ymd", @@ -101,6 +102,11 @@ export function Settings({ onClose }: { onClose?: () => void }): VNode { tooltip={i18n.str`Shows more options in the order creation form`} name="advanceOrderMode" /> + <InputToggle<Preferences> + label={i18n.str`Advance instance settings`} + tooltip={i18n.str`Shows more options in the instance settings form`} + name="advanceInstanceMode" + /> <InputSelector<Preferences> name="dateFormat" label={i18n.str`Date format`} |