diff options
author | Sebastian <sebasjm@gmail.com> | 2021-10-22 01:31:46 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2021-10-22 01:31:46 -0300 |
commit | 2ec2161a7e1c0787b5e9ea14311f19c6b6a52d63 (patch) | |
tree | ef06a4edcb6b35f1743878f3a4cd77edc752a76f /packages/anastasis-webui/src/pages/home/ChallengeOverviewScreen.tsx | |
parent | 3740010117df56c0ab8cfa97c983d9cf0143daf1 (diff) | |
download | wallet-core-2ec2161a7e1c0787b5e9ea14311f19c6b6a52d63.tar.xz |
some storybook exmaples
Diffstat (limited to 'packages/anastasis-webui/src/pages/home/ChallengeOverviewScreen.tsx')
-rw-r--r-- | packages/anastasis-webui/src/pages/home/ChallengeOverviewScreen.tsx | 39 |
1 files changed, 28 insertions, 11 deletions
diff --git a/packages/anastasis-webui/src/pages/home/ChallengeOverviewScreen.tsx b/packages/anastasis-webui/src/pages/home/ChallengeOverviewScreen.tsx index 1f108ce6d..c9b52e91b 100644 --- a/packages/anastasis-webui/src/pages/home/ChallengeOverviewScreen.tsx +++ b/packages/anastasis-webui/src/pages/home/ChallengeOverviewScreen.tsx @@ -1,10 +1,21 @@ import { h, VNode } from "preact"; -import { RecoveryReducerProps, AnastasisClientFrame } from "./index"; +import { useAnastasisContext } from "../../context/anastasis"; +import { AnastasisClientFrame } from "./index"; + +export function ChallengeOverviewScreen(): VNode { + const reducer = useAnastasisContext() + + if (!reducer) { + return <div>no reducer in context</div> + } + if (!reducer.currentReducerState || reducer.currentReducerState.recovery_state === undefined) { + return <div>invalid state</div> + } + + const policies = reducer.currentReducerState.recovery_information?.policies ?? []; + const chArr = reducer.currentReducerState.recovery_information?.challenges ?? []; + const challengeFeedback = reducer.currentReducerState?.challenge_feedback; -export function ChallengeOverviewScreen(props: RecoveryReducerProps): VNode { - const { recoveryState, reducer } = props; - const policies = recoveryState.recovery_information!.policies; - const chArr = recoveryState.recovery_information!.challenges; const challenges: { [uuid: string]: { type: string; @@ -22,15 +33,21 @@ export function ChallengeOverviewScreen(props: RecoveryReducerProps): VNode { return ( <AnastasisClientFrame title="Recovery: Solve challenges"> <h2>Policies</h2> - {policies.map((x, i) => { + {!policies.length && <p> + No policies found + </p>} + {policies.map((row, i) => { return ( <div key={i}> <h3>Policy #{i + 1}</h3> - {x.map((x, j) => { - const ch = challenges[x.uuid]; - const feedback = recoveryState.challenge_feedback?.[x.uuid]; + {row.map(column => { + const ch = challenges[column.uuid]; + if (!ch) return <div> + There is no challenge for this policy + </div> + const feedback = challengeFeedback?.[column.uuid]; return ( - <div key={j} + <div key={column.uuid} style={{ borderLeft: "2px solid gray", paddingLeft: "0.5em", @@ -46,7 +63,7 @@ export function ChallengeOverviewScreen(props: RecoveryReducerProps): VNode { {feedback?.state !== "solved" ? ( <button onClick={() => reducer.transition("select_challenge", { - uuid: x.uuid, + uuid: column.uuid, })} > Solve |