prettier

1 files changed, 61 insertions, 46 deletions

diff --git a/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx b/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx
index 557718458..0918c2db5 100644
--- a/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx
+++ b/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx
@@ -9,24 +9,32 @@ import { useAnastasisContext } from "../../context/anastasis";
 import { AnastasisClientFrame, withProcessLabel } from "./index";
 
 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);
+  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>
+    return <div>no reducer in context</div>;
   }
-  if (!reducer.currentReducerState || !("required_attributes" in reducer.currentReducerState)) {
-    return <div>invalid state</div>
+  if (
+    !reducer.currentReducerState ||
+    !("required_attributes" in reducer.currentReducerState)
+  ) {
+    return <div>invalid state</div>;
   }
-  const reqAttr = reducer.currentReducerState.required_attributes || []
+  const reqAttr = reducer.currentReducerState.required_attributes || [];
   let hasErrors = false;
 
   const fieldList: VNode[] = reqAttr.map((spec, i: number) => {
-    const value = attrs[spec.name]
-    const error = checkIfValid(value, spec)
-    hasErrors = hasErrors || error !== undefined
+    const value = attrs[spec.name];
+    const error = checkIfValid(value, spec);
+    hasErrors = hasErrors || error !== undefined;
     return (
       <AttributeEntryField
         key={i}
@@ -34,23 +42,24 @@ export function AttributeEntryScreen(): VNode {
         setValue={(v: string) => setAttrs({ ...attrs, [spec.name]: v })}
         spec={spec}
         errorMessage={error}
-        value={value} />
+        value={value}
+      />
     );
-  })
+  });
 
   return (
     <AnastasisClientFrame
       title={withProcessLabel(reducer, "Who are you?")}
       hideNext={hasErrors ? "Complete the form." : undefined}
-      onNext={() => reducer.transition("enter_user_attributes", {
-        identity_attributes: attrs,
-      })}
+      onNext={() =>
+        reducer.transition("enter_user_attributes", {
+          identity_attributes: attrs,
+        })
+      }
     >
-      <div class="columns" style={{ maxWidth: 'unset' }}>
+      <div class="columns" style={{ maxWidth: "unset" }}>
+        <div class="column">{fieldList}</div>
         <div class="column">
-          {fieldList}
-        </div>
-        <div class="column" >
           <p>This personal information will help to locate your secret.</p>
           <h1 class="title">This stays private</h1>
           <p>The information you have entered here:</p>
@@ -61,9 +70,12 @@ export function AttributeEntryScreen(): VNode {
               </span>
               Will be hashed, and therefore unreadable
             </li>
-            <li><span class="icon is-right">
-              <i class="mdi mdi-circle-small" />
-            </span>The non-hashed version is not shared</li>
+            <li>
+              <span class="icon is-right">
+                <i class="mdi mdi-circle-small" />
+              </span>
+              The non-hashed version is not shared
+            </li>
           </ul>
         </div>
       </div>
@@ -78,22 +90,22 @@ interface AttributeEntryFieldProps {
   spec: UserAttributeSpec;
   errorMessage: string | undefined;
 }
-const possibleBirthdayYear: Array<number> = []
+const possibleBirthdayYear: Array<number> = [];
 for (let i = 0; i < 100; i++) {
-  possibleBirthdayYear.push(2020 - i)
+  possibleBirthdayYear.push(2020 - i);
 }
 function AttributeEntryField(props: AttributeEntryFieldProps): VNode {
-
   return (
     <div>
-      {props.spec.type === 'date' &&
+      {props.spec.type === "date" &&
         <DateInput
           grabFocus={props.isFirst}
           label={props.spec.label}
           years={possibleBirthdayYear}
           error={props.errorMessage}
           bind={[props.value, props.setValue]}
-        />}
+        />
+      }
       {props.spec.type === 'number' &&
         <PhoneNumberInput
           grabFocus={props.isFirst}
@@ -102,14 +114,14 @@ function AttributeEntryField(props: AttributeEntryFieldProps): VNode {
           bind={[props.value, props.setValue]}
         />
       }
-      {props.spec.type === 'string' &&
+      {props.spec.type === "string" && (
         <TextInput
           grabFocus={props.isFirst}
           label={props.spec.label}
           error={props.errorMessage}
           bind={[props.value, props.setValue]}
         />
-      }
+      )}
       <div class="block">
         This stays private
         <span class="icon is-right">
@@ -119,40 +131,43 @@ function AttributeEntryField(props: AttributeEntryFieldProps): VNode {
     </div>
   );
 }
-const YEAR_REGEX = /^[0-9]+-[0-9]+-[0-9]+$/
-
+const YEAR_REGEX = /^[0-9]+-[0-9]+-[0-9]+$/;
 
-function checkIfValid(value: string, spec: UserAttributeSpec): string | undefined {
-  const pattern = spec['validation-regex']
+function checkIfValid(
+  value: string,
+  spec: UserAttributeSpec,
+): string | undefined {
+  const pattern = spec["validation-regex"];
   if (pattern) {
-    const re = new RegExp(pattern)
-    if (!re.test(value)) return 'The value is invalid'
+    const re = new RegExp(pattern);
+    if (!re.test(value)) return "The value is invalid";
   }
-  const logic = spec['validation-logic']
+  const logic = spec["validation-logic"];
   if (logic) {
     const func = (validators as any)[logic];
-    if (func && typeof func === 'function' && !func(value)) return 'Please check the value'
+    if (func && typeof func === "function" && !func(value))
+      return "Please check the value";
   }
-  const optional = spec.optional
+  const optional = spec.optional;
   if (!optional && !value) {
-    return 'This value is required'
+    return "This value is required";
   }
   if ("date" === spec.type) {
     if (!YEAR_REGEX.test(value)) {
-      return "The date doesn't follow the format"
+      return "The date doesn't follow the format";
     }
 
     try {
-      const v = parse(value, 'yyyy-MM-dd', new Date());
+      const v = parse(value, "yyyy-MM-dd", new Date());
       if (Number.isNaN(v.getTime())) {
-        return "Some numeric values seems out of range for a date"
+        return "Some numeric values seems out of range for a date";
       }
       if ("birthdate" === spec.name && isAfter(v, new Date())) {
-        return "A birthdate cannot be in the future"
+        return "A birthdate cannot be in the future";
       }
     } catch (e) {
-      return "Could not parse the date"
+      return "Could not parse the date";
     }
   }
-  return undefined
+  return undefined;
 }