From 8ff282f5a5b2f42dbbb20737d1060a3f5e60cc90 Mon Sep 17 00:00:00 2001
From: Charles Shin <charlshi@amazon.com>
Date: Tue, 6 Jun 2023 14:47:59 -0700
Subject: [PATCH] fix: add getOverrideProps to StorageManager (#1020)

* fix: add getOverrideProps to StorageManager

* fix: add overrideProps to Field component

* Revert "fix: add overrideProps to Field component"

This reverts commit 63937188fa2575f0e781d96bac73d937a0cf113d.
---
 ...studio-ui-codegen-react-forms.test.ts.snap |  3 +++
 .../lib/react-component-renderer.ts           |  2 +-
 .../utils/forms/storage-field-component.ts    | 24 +++++++++----------
 3 files changed, 16 insertions(+), 13 deletions(-)

diff --git a/packages/codegen-ui-react/lib/__tests__/__snapshots__/studio-ui-codegen-react-forms.test.ts.snap b/packages/codegen-ui-react/lib/__tests__/__snapshots__/studio-ui-codegen-react-forms.test.ts.snap
index c9eecf0b..525b5d51 100644
--- a/packages/codegen-ui-react/lib/__tests__/__snapshots__/studio-ui-codegen-react-forms.test.ts.snap
+++ b/packages/codegen-ui-react/lib/__tests__/__snapshots__/studio-ui-codegen-react-forms.test.ts.snap
@@ -25021,6 +25021,7 @@ export default function CreateProductForm(props) {
           showThumbnails={false}
           maxFileCount={5}
           maxSize={1024}
+          {...getOverrideProps(overrides, \\"imgKeys\\")}
         ></StorageManager>
       </Field>
       <Flex
@@ -25248,6 +25249,7 @@ export default function UpdateProductForm(props) {
             acceptedFileTypes={[\\".doc\\", \\".pdf\\"]}
             isResumable={false}
             showThumbnails={true}
+            {...getOverrideProps(overrides, \\"imgKeys\\")}
           ></StorageManager>
         )}
       </Field>
@@ -25525,6 +25527,7 @@ export default function UpdateProductForm(props) {
             showThumbnails={false}
             maxFileCount={1}
             maxSize={1024}
+            {...getOverrideProps(overrides, \\"singleImgKey\\")}
           ></StorageManager>
         )}
       </Field>
diff --git a/packages/codegen-ui-react/lib/react-component-renderer.ts b/packages/codegen-ui-react/lib/react-component-renderer.ts
index 530fc0a5..12c4999f 100644
--- a/packages/codegen-ui-react/lib/react-component-renderer.ts
+++ b/packages/codegen-ui-react/lib/react-component-renderer.ts
@@ -89,8 +89,8 @@ export class ReactComponentRenderer<TPropIn> extends ComponentRendererBase<
       if (this.component.componentType === 'StorageField') {
         this.importCollection.addImport(ImportSource.REACT_STORAGE, 'StorageManager');
         this.importCollection.addImport(ImportSource.UI_REACT_INTERNAL, 'Field');
+        this.importCollection.addImport(ImportSource.UI_REACT_INTERNAL, ImportValue.GET_OVERRIDE_PROPS);
         this.importCollection.addImport(ImportSource.UTILS, 'processFile');
-
         return renderStorageFieldComponent(
           this.component,
           this.componentMetadata,
diff --git a/packages/codegen-ui-react/lib/utils/forms/storage-field-component.ts b/packages/codegen-ui-react/lib/utils/forms/storage-field-component.ts
index ff3ef314..c1a479ad 100644
--- a/packages/codegen-ui-react/lib/utils/forms/storage-field-component.ts
+++ b/packages/codegen-ui-react/lib/utils/forms/storage-field-component.ts
@@ -22,16 +22,7 @@ import {
   ComponentMetadata,
   isValidVariableName,
 } from '@aws-amplify/codegen-ui';
-import {
-  factory,
-  JsxAttribute,
-  JsxAttributeLike,
-  JsxChild,
-  JsxElement,
-  JsxExpression,
-  NodeFlags,
-  SyntaxKind,
-} from 'typescript';
+import { factory, JsxAttributeLike, JsxChild, JsxElement, JsxExpression, NodeFlags, SyntaxKind } from 'typescript';
 import { getDecoratedLabel } from '../../forms/form-renderer-helper';
 import { buildStorageManagerOnChangeStatement } from '../../forms/form-renderer-helper/event-handler-props';
 import { propertyToExpression } from '../../react-component-render-helper';
@@ -339,8 +330,8 @@ export const renderStorageFieldComponent = (
   const lowerCaseDataTypeName = lowerCaseFirst(dataTypeName);
   const lowerCaseDataTypeNameRecord = `${lowerCaseDataTypeName}Record`;
   const storageManagerComponentName = factory.createIdentifier('StorageManager');
-  const storageManagerAttributes: JsxAttribute[] = [];
-  const fieldAttributes: JsxAttribute[] = [];
+  const storageManagerAttributes: JsxAttributeLike[] = [];
+  const fieldAttributes: JsxAttributeLike[] = [];
 
   if (componentMetadata.formMetadata) {
     const errorKey =
@@ -494,6 +485,15 @@ export const renderStorageFieldComponent = (
     }
   });
 
+  storageManagerAttributes.push(
+    factory.createJsxSpreadAttribute(
+      factory.createCallExpression(factory.createIdentifier('getOverrideProps'), undefined, [
+        factory.createIdentifier('overrides'),
+        factory.createStringLiteral(componentName),
+      ]),
+    ),
+  );
+
   const storageManager = factory.createJsxElement(
     factory.createJsxOpeningElement(
       storageManagerComponentName,