fix: update conditional prop codegen (#917)

Co-authored-by: David Lopez <lopezbnd@amazon.com>
aws-amplify · Feb 13, 2023 · 4b47155 · 4b47155
1 parent 9a716a3
commit 4b47155
Show file tree

Hide file tree

Showing 4 changed files with 51 additions and 102 deletions.
diff --git a/...s/codegen-ui-react/lib/__tests__/__snapshots__/react-component-render-helper.test.ts.snap b/...s/codegen-ui-react/lib/__tests__/__snapshots__/react-component-render-helper.test.ts.snap
@@ -99,80 +99,42 @@ NodeObject {
     },
     "condition": NodeObject {
       "end": -1,
-      "expression": NodeObject {
+      "flags": 8,
+      "kind": 219,
+      "left": IdentifierObject {
         "end": -1,
+        "escapedText": "prop",
         "flags": 8,
-        "kind": 219,
-        "left": IdentifierObject {
-          "end": -1,
-          "escapedText": "prop",
-          "flags": 8,
-          "kind": 79,
-          "modifierFlagsCache": 0,
-          "originalKeywordKind": undefined,
-          "parent": undefined,
-          "pos": -1,
-          "transformFlags": 0,
-        },
+        "kind": 79,
         "modifierFlagsCache": 0,
-        "operatorToken": TokenObject {
-          "end": -1,
-          "flags": 8,
-          "kind": 55,
-          "modifierFlagsCache": 0,
-          "parent": undefined,
-          "pos": -1,
-          "transformFlags": 0,
-        },
+        "originalKeywordKind": undefined,
         "parent": undefined,
         "pos": -1,
-        "right": NodeObject {
-          "end": -1,
-          "flags": 8,
-          "kind": 219,
-          "left": IdentifierObject {
-            "end": -1,
-            "escapedText": "prop",
-            "flags": 8,
-            "kind": 79,
-            "modifierFlagsCache": 0,
-            "originalKeywordKind": undefined,
-            "parent": undefined,
-            "pos": -1,
-            "transformFlags": 0,
-          },
-          "modifierFlagsCache": 0,
-          "operatorToken": TokenObject {
-            "end": -1,
-            "flags": 8,
-            "kind": 34,
-            "modifierFlagsCache": 0,
-            "parent": undefined,
-            "pos": -1,
-            "transformFlags": 0,
-          },
-          "parent": undefined,
-          "pos": -1,
-          "right": TokenObject {
-            "end": -1,
-            "flags": 8,
-            "kind": 8,
-            "modifierFlagsCache": 0,
-            "numericLiteralFlags": 0,
-            "parent": undefined,
-            "pos": -1,
-            "text": "0",
-            "transformFlags": 0,
-          },
-          "transformFlags": 0,
-        },
         "transformFlags": 0,
       },
-      "flags": 8,
-      "kind": 210,
       "modifierFlagsCache": 0,
+      "operatorToken": TokenObject {
+        "end": -1,
+        "flags": 8,
+        "kind": 34,
+        "modifierFlagsCache": 0,
+        "parent": undefined,
+        "pos": -1,
+        "transformFlags": 0,
+      },
       "parent": undefined,
       "pos": -1,
+      "right": TokenObject {
+        "end": -1,
+        "flags": 8,
+        "kind": 8,
+        "modifierFlagsCache": 0,
+        "numericLiteralFlags": 0,
+        "parent": undefined,
+        "pos": -1,
+        "text": "0",
+        "transformFlags": 0,
+      },
       "transformFlags": 0,
     },
     "end": -1,
@@ -252,17 +214,17 @@ NodeObject {
 
 exports[`react-component-render-helper buildConcatExpression should build concat with userAttribute 1`] = `"\`\${authAttributes[\\"email\\"]}\${\\", welcome!\\"}\`"`;
 
-exports[`react-component-render-helper buildContionalExpression operandType does not exist 1`] = `"(user?.age && user?.age > \\"18\\") ? \\"Vote\\" : \\"Sorry you cannot vote\\""`;
+exports[`react-component-render-helper buildContionalExpression operandType does not exist 1`] = `"user?.age > \\"18\\" ? \\"Vote\\" : \\"Sorry you cannot vote\\""`;
 
-exports[`react-component-render-helper buildContionalExpression operandType does not exist 2`] = `"(user?.age && user?.age > \\"true\\") ? \\"Vote\\" : \\"Sorry you cannot vote\\""`;
+exports[`react-component-render-helper buildContionalExpression operandType does not exist 2`] = `"user?.age > \\"true\\" ? \\"Vote\\" : \\"Sorry you cannot vote\\""`;
 
-exports[`react-component-render-helper buildContionalExpression operandType does not exist 3`] = `"(user?.age && user?.age > \\"dlo\\") ? \\"Vote\\" : \\"Sorry you cannot vote\\""`;
+exports[`react-component-render-helper buildContionalExpression operandType does not exist 3`] = `"user?.age > \\"dlo\\" ? \\"Vote\\" : \\"Sorry you cannot vote\\""`;
 
-exports[`react-component-render-helper buildContionalExpression operandType exists 1`] = `"(user?.age && user?.age > 18) ? \\"Vote\\" : \\"Sorry you cannot vote\\""`;
+exports[`react-component-render-helper buildContionalExpression operandType exists 1`] = `"user?.age > 18 ? \\"Vote\\" : \\"Sorry you cannot vote\\""`;
 
-exports[`react-component-render-helper buildContionalExpression operandType exists 2`] = `"(user?.age && user?.age > true) ? \\"Vote\\" : \\"Sorry you cannot vote\\""`;
+exports[`react-component-render-helper buildContionalExpression operandType exists 2`] = `"user?.age > true ? \\"Vote\\" : \\"Sorry you cannot vote\\""`;
 
-exports[`react-component-render-helper buildContionalExpression operandType exists 3`] = `"(user?.age && user?.age > \\"true\\") ? \\"Vote\\" : \\"Sorry you cannot vote\\""`;
+exports[`react-component-render-helper buildContionalExpression operandType exists 3`] = `"user?.age > \\"true\\" ? \\"Vote\\" : \\"Sorry you cannot vote\\""`;
 
 exports[`react-component-render-helper buildFixedJsxExpression boolean 1`] = `"{true}"`;
 

diff --git a/packages/codegen-ui-react/lib/__tests__/__snapshots__/studio-ui-codegen-react.test.ts.snap b/packages/codegen-ui-react/lib/__tests__/__snapshots__/studio-ui-codegen-react.test.ts.snap
@@ -436,7 +436,7 @@ export default function ConditionalInMutation(
     useStateMutationAction(\\"Default Value\\");
   const conditionalPropertyMutationOnClick = () => {
     setMutatedValueChildren(
-      user?.age && user?.age == 45 ? \\"Conditional Value\\" : \\"Unconditional Value\\"
+      user?.age == 45 ? \\"Conditional Value\\" : \\"Unconditional Value\\"
     );
   };
   return (
@@ -1392,7 +1392,7 @@ export default function CollectionWithModelNameCollisions(
   const buttonModelFilterObj = {
     and: [
       { field: \\"age\\", operand: \\"10\\", operator: \\"gt\\" },
-      { field: \\"lastName\\", operand: \\"L\\", operator: \\"beginsWith\\" },
+      { field: \\"isActive\\", operand: true, operator: \\"eq\\" },
     ],
   };
   const buttonModelFilter =
@@ -5395,16 +5395,14 @@ export default function CustomButton(
     /* @ts-ignore: TS2322 */
     <Button
       labelWidth={width}
-      disabled={
-        buttonUser?.isLoggedIn && buttonUser?.isLoggedIn == true ? true : false
-      }
+      disabled={buttonUser?.isLoggedIn == true ? true : false}
       prompt={
-        buttonUser?.age && buttonUser?.age > 18
+        buttonUser?.age > 18
           ? \`\${buttonUser?.firstname}\${\\", cast your vote.\\"}\`
           : \\"Sorry you cannot vote\\"
       }
       backgroundColor={
-        buttonUser?.isLoggedIn && buttonUser?.isLoggedIn == true
+        buttonUser?.isLoggedIn == true
           ? buttonUser?.loggedInColor
           : buttonUser?.loggedOutColor
       }
@@ -5465,22 +5463,16 @@ export default function ConditionalComponentWithDataBinding(
     >
       <Text
         value={
-          student?.id && student?.id == \\"idstringuserinput\\"
-            ? student?.createdAt
-            : student?.id
+          student?.id == \\"idstringuserinput\\" ? student?.createdAt : student?.id
         }
         children={
-          student?.id && student?.id == \\"idstringuserinput\\"
-            ? student?.createdAt
-            : student?.id
+          student?.id == \\"idstringuserinput\\" ? student?.createdAt : student?.id
         }
         {...getOverrideProps(overrides, \\"Placeholder text\\")}
       ></Text>
       <Button
         value={
-          student?.id && student?.id == \\"idstringuserinput\\"
-            ? student?.createdAt
-            : student?.id
+          student?.id == \\"idstringuserinput\\" ? student?.createdAt : student?.id
         }
         {...getOverrideProps(overrides, \\"Placeholder Button\\")}
       ></Button>
@@ -5518,7 +5510,7 @@ export default function CustomButton(
   return (
     /* @ts-ignore: TS2322 */
     <Button
-      disabled={buttonColor && buttonColor == \\"red\\" ? true : false}
+      disabled={buttonColor == \\"red\\" ? true : false}
       {...getOverrideProps(overrides, \\"CustomButton\\")}
       {...rest}
     ></Button>
@@ -7205,12 +7197,12 @@ export default function InitialValueBindings(
     if (
       conditionalValueContentsChildren === undefined &&
       user !== undefined &&
-      (user?.lastName && user?.lastName == \\"Bound Value\\"
+      (user?.lastName == \\"Bound Value\\"
         ? \\"Conditional Value\\"
         : \\"Unconditional Value\\") !== undefined
     )
       setConditionalValueContentsChildren(
-        user?.lastName && user?.lastName == \\"Bound Value\\"
+        user?.lastName == \\"Bound Value\\"
           ? \\"Conditional Value\\"
           : \\"Unconditional Value\\"
       );

diff --git a/packages/codegen-ui-react/lib/react-component-render-helper.ts b/packages/codegen-ui-react/lib/react-component-render-helper.ts
@@ -514,16 +514,10 @@ export function buildConditionalExpression(
       : factory.createIdentifier(property);
 
   return factory.createConditionalExpression(
-    factory.createParenthesizedExpression(
-      factory.createBinaryExpression(
-        propertyAccess,
-        factory.createToken(SyntaxKind.AmpersandAmpersandToken),
-        factory.createBinaryExpression(
-          propertyAccess,
-          operatorToken,
-          getConditionalOperandExpression(operand, operandType),
-        ),
-      ),
+    factory.createBinaryExpression(
+      propertyAccess,
+      operatorToken,
+      getConditionalOperandExpression(operand, operandType),
     ),
     factory.createToken(SyntaxKind.QuestionToken),
     resolvePropToExpression(componentMetadata, then),

diff --git a/packages/codegen-ui/example-schemas/collectionWithModelNameCollisions.json b/packages/codegen-ui/example-schemas/collectionWithModelNameCollisions.json
@@ -51,9 +51,10 @@
             "operator": "gt"
           },
           {
-            "field": "lastName",
-            "operand": "L",
-            "operator": "beginsWith"
+            "field": "isActive",
+            "operand": "true",
+            "operator": "eq",
+            "operandType": "boolean"
           }
         ]
       }