From 2ec2161a7e1c0787b5e9ea14311f19c6b6a52d63 Mon Sep 17 00:00:00 2001
From: Sebastian <sebasjm@gmail.com>
Date: Fri, 22 Oct 2021 01:31:46 -0300
Subject: some storybook exmaples

---
 .../src/pages/home/AttributeEntryScreen.tsx        | 25 +++++++++++++++-------
 1 file changed, 17 insertions(+), 8 deletions(-)

(limited to 'packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx')

diff --git a/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx b/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx
index 6f87a3358..2f804f940 100644
--- a/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx
+++ b/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx
@@ -1,15 +1,24 @@
 /* eslint-disable @typescript-eslint/camelcase */
 import { h, VNode } from "preact";
 import { useState } from "preact/hooks";
-import { ReducerStateRecovery, ReducerStateBackup } from "../../../../anastasis-core/lib";
+import { ReducerStateRecovery, ReducerStateBackup, UserAttributeSpec } from "anastasis-core/lib";
+import { useAnastasisContext } from "../../context/anastasis";
 import { AnastasisReducerApi } from "../../hooks/use-anastasis-reducer";
 import { AnastasisClientFrame, withProcessLabel, LabeledInput } from "./index";
 
-export function AttributeEntryScreen(props: AttributeEntryProps): VNode {
-  const { reducer, reducerState: backupState } = props;
-  const [attrs, setAttrs] = useState<Record<string, string>>(
-    props.reducerState.identity_attributes ?? {}
-  );
+export function AttributeEntryScreen(): VNode {
+  const reducer = useAnastasisContext()
+  const state = reducer?.currentReducerState
+  const currentIdentityAttributes = state && "identity_attributes" in state ? (state.identity_attributes || {}) : {}
+  const [attrs, setAttrs] = useState<Record<string, string>>(currentIdentityAttributes);
+
+  if (!reducer) {
+    return <div>no reducer in context</div>
+  }
+  if (!reducer.currentReducerState || !("required_attributes" in reducer.currentReducerState)) {
+    return <div>invalid state</div>
+  }
+  
   return (
     <AnastasisClientFrame
       title={withProcessLabel(reducer, "Select Country")}
@@ -17,7 +26,7 @@ export function AttributeEntryScreen(props: AttributeEntryProps): VNode {
         identity_attributes: attrs,
       })}
     >
-      {backupState.required_attributes.map((x: any, i: number) => {
+      {reducer.currentReducerState.required_attributes?.map((x, i: number) => {
         return (
           <AttributeEntryField
             key={i}
@@ -40,7 +49,7 @@ export interface AttributeEntryFieldProps {
   isFirst: boolean;
   value: string;
   setValue: (newValue: string) => void;
-  spec: any;
+  spec: UserAttributeSpec;
 }
 
 export function AttributeEntryField(props: AttributeEntryFieldProps): VNode {
-- 
cgit v1.2.3