diff --git a/packages/codegen-ui-react/lib/__tests__/__utils__/amplify-renderer-generator.ts b/packages/codegen-ui-react/lib/__tests__/__utils__/amplify-renderer-generator.ts
index 624274a8b..bdf85ec75 100644
--- a/packages/codegen-ui-react/lib/__tests__/__utils__/amplify-renderer-generator.ts
+++ b/packages/codegen-ui-react/lib/__tests__/__utils__/amplify-renderer-generator.ts
@@ -70,6 +70,24 @@ export const generateWithAmplifyFormRenderer = (
   return renderer.renderComponent();
 };
 
+export const generateComponentOnlyWithAmplifyFormRenderer = (
+  formJsonFile: string,
+  dataSchemaJsonFile: string | undefined,
+  renderConfig: ReactRenderConfig = defaultCLIRenderConfig,
+) => {
+  let dataSchema: GenericDataSchema | undefined;
+  if (dataSchemaJsonFile) {
+    const dataStoreSchema = loadSchemaFromJSONFile<Schema>(dataSchemaJsonFile);
+    dataSchema = getGenericFromDataStore(dataStoreSchema);
+  }
+  const rendererFactory = new StudioTemplateRendererFactory(
+    (component: StudioForm) => new AmplifyFormRenderer(component, dataSchema, renderConfig),
+  );
+
+  const renderer = rendererFactory.buildRenderer(loadSchemaFromJSONFile<StudioForm>(formJsonFile));
+  return renderer.renderComponentOnly();
+};
+
 export const renderWithAmplifyViewRenderer = (
   viewJsonFile: string,
   dataSchemaJsonFile: string | undefined,
diff --git a/packages/codegen-ui-react/lib/forms/react-form-renderer.ts b/packages/codegen-ui-react/lib/forms/react-form-renderer.ts
index 4a40c8681..0ec7f025d 100644
--- a/packages/codegen-ui-react/lib/forms/react-form-renderer.ts
+++ b/packages/codegen-ui-react/lib/forms/react-form-renderer.ts
@@ -89,6 +89,15 @@ import {
   validationResponseType,
 } from './type-helper';
 
+type RenderComponentOnlyResponse = {
+  compText: string;
+  /**
+   * @deprecated Use {@link RenderComponentOnlyResponse.importCollection} instead.
+   */
+  importsText: string;
+  requiredDataModels: string[];
+  importCollection: ImportCollection;
+};
 export abstract class ReactFormTemplateRenderer extends StudioTemplateRenderer<
   string,
   StudioForm,
@@ -110,6 +119,8 @@ export abstract class ReactFormTemplateRenderer extends StudioTemplateRenderer<
 
   public fileName: string;
 
+  protected requiredDataModels: string[] = [];
+
   constructor(component: StudioForm, dataSchema: GenericDataSchema | undefined, renderConfig: ReactRenderConfig) {
     super(component, new ReactOutputManager(), renderConfig);
     this.renderConfig = {
@@ -130,10 +141,9 @@ export abstract class ReactFormTemplateRenderer extends StudioTemplateRenderer<
   }
 
   @handleCodegenErrors
-  renderComponentOnly() {
+  renderComponentOnly(): RenderComponentOnlyResponse {
     const variableStatements = this.buildVariableStatements();
     const jsx = this.renderJsx(this.formComponent);
-    const requiredDataModels = [];
 
     const { printer, file } = buildPrinter(this.fileName, this.renderConfig);
 
@@ -158,12 +168,12 @@ export abstract class ReactFormTemplateRenderer extends StudioTemplateRenderer<
     // do not produce declaration becuase it is not used
     const { componentText: compText } = transpile(result, { ...this.renderConfig, renderTypeDeclarations: false });
 
-    if (this.component.dataType.dataSourceType === 'DataStore') {
-      requiredDataModels.push(this.component.dataType.dataTypeName);
-      // TODO: require other models if form is handling querying relational models
-    }
-
-    return { compText, importsText, requiredDataModels };
+    return {
+      compText,
+      importsText,
+      requiredDataModels: this.requiredDataModels,
+      importCollection: this.importCollection,
+    };
   }
 
   renderComponentInternal() {
@@ -356,6 +366,7 @@ export abstract class ReactFormTemplateRenderer extends StudioTemplateRenderer<
 
     // add model import for datastore type
     if (dataSourceType === 'DataStore') {
+      this.requiredDataModels.push(dataTypeName);
       modelName = this.importCollection.addImport(ImportSource.LOCAL_MODELS, dataTypeName);
     }