diff options
author | Sebastian <sebasjm@gmail.com> | 2022-09-20 16:04:51 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2022-09-20 16:05:59 -0300 |
commit | 52ec740c825d4e94fd59ef0a5cd8e8b73f4dfc06 (patch) | |
tree | dd65f9852005097c2cd8975b14ccbd198bef57e8 /packages/taler-wallet-webextension/src/utils | |
parent | a5525eab1e96d5b08fbb6442275b1e92f7f8d806 (diff) | |
download | wallet-core-52ec740c825d4e94fd59ef0a5cd8e8b73f4dfc06.tar.xz |
new compose feature: sub-states
implemented in withdraw page, WIP
Diffstat (limited to 'packages/taler-wallet-webextension/src/utils')
-rw-r--r-- | packages/taler-wallet-webextension/src/utils/index.ts | 49 |
1 files changed, 33 insertions, 16 deletions
diff --git a/packages/taler-wallet-webextension/src/utils/index.ts b/packages/taler-wallet-webextension/src/utils/index.ts index 8fe1f2a44..3535910cf 100644 --- a/packages/taler-wallet-webextension/src/utils/index.ts +++ b/packages/taler-wallet-webextension/src/utils/index.ts @@ -19,7 +19,7 @@ import { Amounts, GetExchangeTosResult, } from "@gnu-taler/taler-util"; -import { VNode } from "preact"; +import { VNode, createElement } from "preact"; function getJsonIfOk(r: Response): Promise<any> { if (r.ok) { @@ -31,8 +31,7 @@ function getJsonIfOk(r: Response): Promise<any> { } throw new Error( - `Try another server: (${r.status}) ${ - r.statusText || "internal server error" + `Try another server: (${r.status}) ${r.statusText || "internal server error" }`, ); } @@ -103,10 +102,10 @@ export function buildTermsOfServiceStatus( return !content ? "notfound" : !acceptedVersion - ? "new" - : acceptedVersion !== currentVersion - ? "changed" - : "accepted"; + ? "new" + : acceptedVersion !== currentVersion + ? "changed" + : "accepted"; } function parseTermsOfServiceContent( @@ -198,17 +197,35 @@ export type StateViewMap<StateType extends { status: string }> = { [S in StateType as S["status"]]: StateFunc<S>; }; +type RecursiveState<S extends object> = S | (() => RecursiveState<S>) + export function compose<SType extends { status: string }, PType>( name: string, - hook: (p: PType) => SType, - vs: StateViewMap<SType>, + hook: (p: PType) => RecursiveState<SType>, + viewMap: StateViewMap<SType>, ): (p: PType) => VNode { - const Component = (p: PType): VNode => { - const state = hook(p); - const s = state.status as unknown as SType["status"]; - const c = vs[s] as unknown as StateFunc<SType>; - return c(state); + + function withHook(stateHook: () => RecursiveState<SType>): () => VNode { + + function TheComponent(): VNode { + const state = stateHook(); + + if (typeof state === "function") { + const subComponent = withHook(state) + return createElement(subComponent, {}); + } + + const statusName = state.status as unknown as SType["status"]; + const viewComponent = viewMap[statusName] as unknown as StateFunc<SType>; + return createElement(viewComponent, state); + } + TheComponent.name = `${name}`; + + return TheComponent; + } + + return (p: PType) => { + const h = withHook(() => hook(p)) + return h() }; - Component.name = `${name}`; - return Component; } |