fix: arrayfield items prop fallback to empty array when record is null

aws-amplify · Oct 10, 2022 · bbe5574 · bbe5574
1 parent cafc15d
commit bbe5574
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 17 deletions.
diff --git a/...s/codegen-ui-react/lib/__tests__/__snapshots__/studio-ui-codegen-react-forms.test.ts.snap b/...s/codegen-ui-react/lib/__tests__/__snapshots__/studio-ui-codegen-react-forms.test.ts.snap
@@ -891,9 +891,9 @@ export default function CustomDataForm(props) {
   const [errors, setErrors] = React.useState({});
   const resetStateValues = () => {
     setName(initialValues.name);
-    setEmail(initialValues.email);
+    setEmail(initialValues.email ?? []);
     setCurrentEmailValue(undefined);
-    setPhone(initialValues.phone);
+    setPhone(initialValues.phone ?? []);
     setCurrentPhoneValue(undefined);
     setErrors({});
   };
@@ -1307,7 +1307,7 @@ export default function MyPostForm(props) {
   const resetStateValues = () => {
     setUsername(initialValues.username);
     setCaption(initialValues.caption);
-    setCustomtags(initialValues.Customtags);
+    setCustomtags(initialValues.Customtags ?? []);
     setCurrentCustomtagsValue(undefined);
     setPost_url(initialValues.post_url);
     setProfile_url(initialValues.profile_url);
@@ -1801,9 +1801,9 @@ export default function NestedJson(props) {
     setFirstName(initialValues[\\"first-Name\\"]);
     setLastName(initialValues.lastName);
     setBio(initialValues.bio);
-    setNicknames1(initialValues.Nicknames1);
+    setNicknames1(initialValues.Nicknames1 ?? []);
     setCurrentNicknames1Value(undefined);
-    setNicknames(initialValues[\\"nick-names2\\"]);
+    setNicknames(initialValues[\\"nick-names2\\"] ?? []);
     setCurrentNicknamesValue(undefined);
     setFirstName1(initialValues[\\"first Name\\"]);
     setErrors({});
@@ -2353,7 +2353,7 @@ export default function NestedJson(props) {
     const cleanValues = { ...initialValues, ...initialData };
     setFirstName(cleanValues.firstName);
     setLastName(cleanValues[\\"last-Name\\"]);
-    setLastName1(cleanValues.lastName);
+    setLastName1(cleanValues.lastName ?? []);
     setCurrentLastName1Value(undefined);
     setBio(cleanValues.bio);
     setErrors({});
@@ -3962,7 +3962,7 @@ export default function InputGalleryCreateForm(props) {
     setAttend(initialValues.attend);
     setMaybeSlide(initialValues.maybeSlide);
     setMaybeCheck(initialValues.maybeCheck);
-    setArrayTypeField(initialValues.arrayTypeField);
+    setArrayTypeField(initialValues.arrayTypeField ?? []);
     setCurrentArrayTypeFieldValue(undefined);
     setTimestamp(initialValues.timestamp);
     setIppy(initialValues.ippy);
@@ -4664,7 +4664,7 @@ export default function InputGalleryUpdateForm(props) {
     setAttend(cleanValues.attend);
     setMaybeSlide(cleanValues.maybeSlide);
     setMaybeCheck(cleanValues.maybeCheck);
-    setArrayTypeField(cleanValues.arrayTypeField);
+    setArrayTypeField(cleanValues.arrayTypeField ?? []);
     setCurrentArrayTypeFieldValue(undefined);
     setTimestamp(cleanValues.timestamp);
     setIppy(cleanValues.ippy);

diff --git a/packages/codegen-ui-react/lib/forms/form-state.ts b/packages/codegen-ui-react/lib/forms/form-state.ts
@@ -217,18 +217,26 @@ export const resetStateFunction = (fieldConfigs: Record<string, FieldConfigMetad
       const stateName = name.split('.')[0];
       const renderedName = sanitizedFieldName || stateName;
       if (!stateNames.has(stateName)) {
+        const accessExpression = isValidVariableName(stateName)
+          ? factory.createPropertyAccessExpression(
+              factory.createIdentifier(cleanValues),
+              factory.createIdentifier(stateName),
+            )
+          : factory.createElementAccessExpression(
+              factory.createIdentifier(cleanValues),
+              factory.createStringLiteral(stateName),
+            );
+
         acc.push(
           setStateExpression(
             renderedName,
-            isValidVariableName(stateName)
-              ? factory.createPropertyAccessExpression(
-                  factory.createIdentifier(cleanValues),
-                  factory.createIdentifier(stateName),
+            isArray
+              ? factory.createBinaryExpression(
+                  accessExpression,
+                  factory.createToken(SyntaxKind.QuestionQuestionToken),
+                  factory.createArrayLiteralExpression([], false),
                 )
-              : factory.createElementAccessExpression(
-                  factory.createIdentifier(cleanValues),
-                  factory.createStringLiteral(stateName),
-                ),
+              : accessExpression,
           ),
         );
         if (isArray) {

diff --git a/packages/codegen-ui-react/lib/imports/import-collection.ts b/packages/codegen-ui-react/lib/imports/import-collection.ts
@@ -92,7 +92,7 @@ export class ImportCollection {
             undefined,
             factory.createImportClause(
               false,
-              // use module name as defualt import name
+              // use module name as default import name
               [...imports].indexOf('default') >= 0 ? factory.createIdentifier(path.basename(moduleName)) : undefined,
               factory.createNamedImports(
                 namedImports.map((item) => {