@aws-amplify/amplify-util-uibuilder 1.6.2 → 1.6.3-graphql15.0

package/lib/utils/prePushHandler.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.prePushHandler = void 0;
+const amplify_prompts_1 = require("amplify-prompts");
+const clients_1 = require("../clients");
+const utils_1 = require("../commands/utils");
+const prePushHandler = async (context) => {
+    if (!(await (0, utils_1.shouldRenderComponents)(context))) {
+        return;
+    }
+    try {
+        const studioClient = await clients_1.AmplifyStudioClient.setClientInfo(context);
+        const [formSchemas, localSchema] = await Promise.all([
+            studioClient.listForms(),
+            context.amplify.invokePluginMethod(context, 'codegen', undefined, 'getModelIntrospection', [context]),
+        ]);
+        if (!localSchema) {
+            amplify_prompts_1.printer.debug('Local schema not found');
+            return;
+        }
+        printDetachedFormsWarning(formSchemas, localSchema);
+    }
+    catch (error) {
+        amplify_prompts_1.printer.debug(error);
+    }
+};
+exports.prePushHandler = prePushHandler;
+const printDetachedFormsWarning = (formSchemas, localSchema) => {
+    const modelNames = new Set(Object.keys(localSchema.models));
+    const detachedCustomForms = [];
+    formSchemas.entities.forEach(form => {
+        if ((0, utils_1.isFormDetachedFromModel)(form, modelNames) && (0, utils_1.isFormSchemaCustomized)(form)) {
+            detachedCustomForms.push(form.name);
+        }
+    });
+    if (detachedCustomForms.length > 0) {
+        amplify_prompts_1.printer.warn(`The following form${detachedCustomForms.length === 1 ? '' : 's'} will no longer be available because the connected data model no longer exists: ${detachedCustomForms.join(', ')}`);
+    }
+};
+//# sourceMappingURL=prePushHandler.js.map

package/lib/utils/prePushHandler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prePushHandler.js","sourceRoot":"","sources":["../../src/utils/prePushHandler.ts"],"names":[],"mappings":";;;AAEA,qDAA0C;AAE1C,wCAAiD;AACjD,6CAA4G;AAKrG,MAAM,cAAc,GAAG,KAAK,EAAE,OAAmB,EAAiB,EAAE;IACzE,IAAI,CAAC,CAAC,MAAM,IAAA,8BAAsB,EAAC,OAAO,CAAC,CAAC,EAAE;QAC5C,OAAO;KACR;IACD,IAAI;QACF,MAAM,YAAY,GAAG,MAAM,6BAAmB,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QACtE,MAAM,CAAC,WAAW,EAAE,WAAW,CAAC,GAAG,MAAM,OAAO,CAAC,GAAG,CAE9B;YACpB,YAAY,CAAC,SAAS,EAAE;YACxB,OAAO,CAAC,OAAO,CAAC,kBAAkB,CAChC,OAAO,EACP,SAAS,EACT,SAAS,EACT,uBAAuB,EACvB,CAAC,OAAO,CAAC,CACV;SACF,CAAC,CAAC;QAEH,IAAI,CAAC,WAAW,EAAE;YAChB,yBAAO,CAAC,KAAK,CAAC,wBAAwB,CAAC,CAAC;YACxC,OAAO;SACR;QACD,yBAAyB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;KACrD;IAAC,OAAO,KAAK,EAAE;QACd,yBAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;KACtB;AACH,CAAC,CAAC;AA3BW,QAAA,cAAc,kBA2BzB;AAEF,MAAM,yBAAyB,GAAG,CAAC,WAAkD,EAAE,WAAmB,EAAQ,EAAE;IAClH,MAAM,UAAU,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC;IAC5D,MAAM,mBAAmB,GAAa,EAAE,CAAC;IAEzC,WAAW,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;QAGlC,IAAI,IAAA,+BAAuB,EAAC,IAAI,EAAE,UAAU,CAAC,IAAI,IAAA,8BAAsB,EAAC,IAAI,CAAC,EAAE;YAC7E,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SACrC;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,mBAAmB,CAAC,MAAM,GAAG,CAAC,EAAE;QAClC,yBAAO,CAAC,IAAI,CAAC,qBAAqB,mBAAmB,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,mFAAmF,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KACnM;AACH,CAAC,CAAC"}

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@aws-amplify/amplify-util-uibuilder",
-  "version": "1.6.2",
+  "version": "1.6.3-graphql15.0",
   "description": "",
   "main": "lib/index.js",
   "scripts": {
     "build": "tsc",
-    "test": "jest --logHeapUsage"
+    "test": "jest --logHeapUsage",
+    "extract-api": "ts-node ../../scripts/extract-api.ts"
   },
   "author": "Amazon Web Services",
   "license": "Apache-2.0",
@@ -13,18 +14,20 @@
     "access": "public"
   },
   "dependencies": {
-    "@aws-amplify/codegen-ui": "2.5.5",
-    "@aws-amplify/codegen-ui-react": "2.5.5",
-    "amplify-cli-core": "3.4.0",
-    "amplify-prompts": "2.6.1",
+    "@aws-amplify/codegen-ui": "2.5.6",
+    "@aws-amplify/codegen-ui-react": "2.5.6",
+    "amplify-cli-core": "3.5.0-graphql15.0",
+    "amplify-prompts": "2.6.2-graphql15.0",
     "aws-sdk": "^2.1233.0",
     "fs-extra": "^8.1.0",
-    "ora": "^4.0.3"
+    "ora": "^4.0.3",
+    "tiny-async-pool": "^2.1.0"
   },
   "devDependencies": {
     "@types/fs-extra": "^8.0.1",
     "@types/jest": "^26.0.20",
-    "@types/semver": "^7.1.0"
+    "@types/semver": "^7.1.0",
+    "@types/tiny-async-pool": "^2.0.0"
   },
   "jest": {
     "testRunner": "jest-circus/runner",
@@ -68,5 +71,5 @@
     "usePathForSuiteName": "true",
     "addFileAttribute": "true"
   },
-  "gitHead": "256b180a8194463898cb71035441bad1f43472b2"
+  "gitHead": "a870ec62056ad90d3fdd4e85749158d981e8a7af"
 }

package/src/__tests__/createUiBuilderComponent.test.ts

@@ -69,6 +69,10 @@ describe('can create a ui builder component', () => {
     generateAmplifyUiBuilderIndexFile(context, [schema]);
     expect(new codegenMock.StudioTemplateRendererManager().renderSchemaToTemplate).toBeCalled();
   });
+  it('does not call renderSchemaToTemplate for index file if no schema', () => {
+    generateAmplifyUiBuilderIndexFile(context, []);
+    expect(new codegenMock.StudioTemplateRendererManager().renderSchemaToTemplate).not.toBeCalled();
+  })
   it('calls the renderManager for utils file w/ validation, formatter, and fetchByPath helpers if there is a form', () => {
     generateAmplifyUiBuilderUtilFile(context, { hasForms: true, hasViews: false });
     expect(new codegenMock.StudioTemplateRendererManager().renderSchemaToTemplate).toBeCalledWith(expect.arrayContaining(['validation', 'formatter', 'fetchByPath']));

package/src/__tests__/detachedFormCleanup.test.ts

@@ -0,0 +1,78 @@
+// @aws-amplify/codegen-ui is in project dependencies
+import { StudioSchema } from '@aws-amplify/codegen-ui'; // eslint-disable-line import/no-extraneous-dependencies
+import {AmplifyStudioClient} from '../clients'; // eslint-disable-line import/no-extraneous-dependencies
+import {
+  isFormDetachedFromModel, isFormSchemaCustomized, isStudioForm, deleteDetachedForms
+} from '../commands/utils';
+
+const amplifyStudioClientMock = AmplifyStudioClient as any;
+
+const formWithNoCustomization: StudioSchema = {
+  id: 'f-123456',
+  name: 'BlogCreateForm',
+  formActionType: 'create',
+  dataType: {
+    dataSourceType: 'DataStore',
+    dataTypeName: 'Blog',
+  },
+  fields: {},
+  sectionalElements: {},
+  style: {},
+  cta: {},
+};
+
+const formWithStyle: StudioSchema = {
+  ...formWithNoCustomization,
+  dataType: { dataSourceType: 'Custom', dataTypeName: 'Blog' },
+  style: {
+    horizontalGap: { value: '20px' },
+  },
+};
+
+const formWithFields: StudioSchema = {
+  ...formWithNoCustomization,
+  dataType: { dataSourceType: 'Custom', dataTypeName: 'Blog' },
+  fields: {
+    name: { inputType: { type: 'TextField' } },
+  },
+};
+
+describe('detachedFormCleanup', () => {
+
+  it('isStudioForm should return true', () => {
+    expect(isStudioForm(formWithNoCustomization)).toBe(true);
+  });
+
+  it('isStudioForm should return false', () => {
+    expect(isStudioForm(undefined)).toBe(false);
+  });
+
+  it('isFormSchemaCustomized should return false', () => {
+    expect(isFormSchemaCustomized(formWithNoCustomization)).toBe(false);
+  });
+
+  it('isFormSchemaCustomized should return true', () => {
+    expect(isFormSchemaCustomized(formWithStyle)).toBe(true);
+    expect(isFormSchemaCustomized(formWithFields)).toBe(true);
+  });
+
+  it('isFormDetachedFromModel should return true for a DataStore form with detached model', () => {
+    expect(isFormDetachedFromModel(formWithNoCustomization, new Set<string>())).toBe(true);
+  });
+
+  it('isFormDetachedFromModel should return false for a Custom form', () => {
+    expect(isFormDetachedFromModel(formWithStyle, new Set<string>())).toBe(false);
+  });
+
+  it('isFormDetachedFromModel should return false for a DataStore form with an attached model', () => {
+    expect(isFormDetachedFromModel(formWithNoCustomization, new Set<string>().add('Blog'))).toBe(false);
+  });
+
+  it('should delete detached forms', async () => {
+    const mockedDeleteForm = jest.fn().mockReturnValue(undefined);
+    amplifyStudioClientMock.deleteForm = mockedDeleteForm;
+    await deleteDetachedForms([{id: '12345', name: 'BlogCreateForm'}], amplifyStudioClientMock);
+    expect(mockedDeleteForm).toBeCalledTimes(1);
+    expect(mockedDeleteForm).toHaveBeenCalledWith('12345');
+  });
+});

package/src/__tests__/generateComponents.test.ts

@@ -9,8 +9,10 @@ const utilsMock = utils as any;
 
 utilsMock.shouldRenderComponents = jest.fn().mockReturnValue(true);
 utilsMock.notifyMissingPackages = jest.fn().mockReturnValue(true);
+utilsMock.getAmplifyDataSchema = jest.fn().mockReturnValue(({}));
+
 jest.mock('../commands/utils/featureFlags', () => ({
-  getTransformerVersion: jest.fn().mockImplementation(() => 2),
+  getTransformerVersion: jest.fn().mockReturnValue(2),
 }));
 
 describe('can generate components', () => {
@@ -37,6 +39,13 @@ describe('can generate components', () => {
           name: 'testSchema',
           schemaVersion: '1.0',
         },
+        {
+          resultType: 'FAILURE',
+          schemaName: 'testSchema',
+          name: 'testSchema',
+          schemaVersion: '1.0',
+          schema: { id: 'f-123456', name: 'testSchema' },
+        },
       ],
     };
     mockedExport = jest.fn().mockReturnValue({
@@ -70,22 +79,15 @@ describe('can generate components', () => {
     utilsMock.getAmplifyDataSchema = jest.fn().mockReturnValue(undefined);
     utilsMock.generateAmplifyUiBuilderIndexFile = jest.fn().mockReturnValue(true);
     utilsMock.generateAmplifyUiBuilderUtilFile = jest.fn().mockReturnValue(true);
+    utilsMock.deleteDetachedForms = jest.fn();
   });
 
   it('runs generateComponents', async () => {
-    await run(context);
+    await run(context, 'PostPull');
     expect(mockedExport).toBeCalledTimes(3);
     expect(utilsMock.generateUiBuilderComponents).toBeCalledTimes(1);
     expect(utilsMock.generateUiBuilderThemes).toBeCalledTimes(1);
     expect(utilsMock.generateUiBuilderForms).toBeCalledTimes(1);
-  });
-
-  it('does not run generateComponents if not Amplify Admin app', async () => {
-    utilsMock.shouldRenderComponents = jest.fn().mockReturnValue(false);
-    await run(context);
-    expect(mockedExport).toBeCalledTimes(0);
-    expect(utilsMock.generateUiBuilderComponents).toBeCalledTimes(0);
-    expect(utilsMock.generateUiBuilderThemes).toBeCalledTimes(0);
-    expect(utilsMock.generateUiBuilderForms).toBeCalledTimes(0);
+    expect(utilsMock.deleteDetachedForms).toBeCalledTimes(1);
   });
 });

package/src/__tests__/handleEvents.test.ts

@@ -0,0 +1,27 @@
+import { run as runPostPull } from '../event-handlers/handle-PostPull';
+import { run as runPostPush } from '../event-handlers/handle-PostPush';
+import { run as generateComponents } from '../commands/generateComponents';
+
+jest.mock('../commands/generateComponents');
+
+describe('can handle events', () => {
+  let context: any;
+
+  beforeEach(() => {
+    context = {
+      amplify: {
+        invokePluginMethod: jest.fn(),
+      },
+    };
+  });
+
+  it('handles postPull', async () => {
+    await runPostPull(context);
+    expect(generateComponents).toHaveBeenCalledWith(context, 'PostPull');
+  });
+
+  it('handles postPush', async () => {
+    await runPostPush(context);
+    expect(generateComponents).toHaveBeenCalledWith(context, 'PostPush');
+  });
+});

package/src/__tests__/prePushHandler.test.ts

@@ -0,0 +1,105 @@
+// aws-sdk, amplify-cli-core, amplify-prompts are in package dependencies
+import aws from 'aws-sdk'; // eslint-disable-line import/no-extraneous-dependencies
+import { Form } from 'aws-sdk/clients/amplifyuibuilder'; // eslint-disable-line import/no-extraneous-dependencies
+import { printer } from 'amplify-prompts'; // eslint-disable-line import/no-extraneous-dependencies
+import * as utils from '../commands/utils';
+import { prePushHandler } from '../utils/prePushHandler';
+
+jest.mock('../commands/utils');
+jest.mock('amplify-cli-core');
+jest.mock('../commands/utils/featureFlags', () => ({
+  getTransformerVersion: jest.fn().mockImplementation(() => 2),
+}));
+
+const awsMock = aws as any;
+const utilsMock = utils as any;
+
+utilsMock.shouldRenderComponents = jest.fn().mockImplementation(() => true);
+
+describe('handlePrePush', () => {
+  let context: any;
+  let mockedExport: jest.Mock<any, any>;
+  let exportedForms: Form[];
+
+  beforeEach(() => {
+    context = {
+      amplify: {
+        invokePluginMethod: () => ({ models: { Comment: {} } }),
+      },
+      input: {
+        options: {
+          appId: 'testAppId',
+          envName: 'testEnvName',
+        },
+      },
+    };
+
+    exportedForms = [
+      {
+        name: 'BlogCreateForm',
+        formActionType: 'create',
+        fields: {},
+        style: {},
+        schemaVersion: '1.0',
+        sectionalElements: {},
+        appId: '1234',
+        environmentName: 'staging',
+        dataType: {
+          dataSourceType: 'DataStore',
+          dataTypeName: 'Blog',
+        },
+        id: '12345',
+      },
+      {
+        name: 'BlogUpdateForm',
+        formActionType: 'update',
+        fields: {},
+        style: {},
+        schemaVersion: '1.0',
+        sectionalElements: {},
+        appId: '1234',
+        environmentName: 'staging',
+        dataType: {
+          dataSourceType: 'DataStore',
+          dataTypeName: 'Blog',
+        },
+        id: '12345',
+      },
+    ];
+
+    mockedExport = jest.fn(() => ({
+      entities: exportedForms,
+    }));
+
+    awsMock.AmplifyUIBuilder = jest.fn(() => ({
+      exportForms: jest.fn(() => ({
+        promise: () => mockedExport(),
+      })),
+      getMetadata: jest.fn(() => ({
+        promise: jest.fn(() => ({
+          features: {
+            autoGenerateForms: 'true',
+            autoGenerateViews: 'true',
+          },
+        })),
+      })),
+    }));
+  });
+
+  it('runs handlePrePush', async () => {
+    utilsMock.isFormDetachedFromModel = jest.fn().mockImplementation(() => true);
+    utilsMock.isFormSchemaCustomized = jest.fn().mockImplementation(() => true);
+    const spy = jest.spyOn(printer, 'warn');
+    await prePushHandler(context);
+    expect(spy).toHaveBeenCalledWith('The following forms will no longer be available because the connected data model no longer exists: BlogCreateForm, BlogUpdateForm');
+  });
+
+  it('runs handlePrePush without schema', async () => {
+    context.amplify.invokePluginMethod = jest.fn()
+      .mockImplementation(() => ({ models: { Comment: {} } }))
+      .mockImplementation(() => (null));
+    const spy = jest.spyOn(printer, 'debug');
+    await prePushHandler(context);
+    expect(spy).toHaveBeenCalledWith('Local schema not found');
+  });
+});

package/src/__tests__/shouldRenderComponents.test.ts

@@ -1,7 +1,5 @@
 // eslint-disable-next-line import/no-extraneous-dependencies
-import {
-  $TSContext, AmplifyCategories, AmplifySupportedService, CloudformationProviderFacade,
-} from 'amplify-cli-core';
+import {$TSContext} from 'amplify-cli-core';
 import aws from 'aws-sdk'; // eslint-disable-line import/no-extraneous-dependencies
 import { shouldRenderComponents } from '../commands/utils/shouldRenderComponents';
 
@@ -10,26 +8,21 @@ const awsMock = aws as any;
 jest.mock('amplify-cli-core', () => ({
   ...jest.requireActual('amplify-cli-core'),
   stateManager: {
-    getMeta: jest.fn(() => ({
-      [AmplifyCategories.API]: {
-        MyResourceName: {
-          service: AmplifySupportedService.APPSYNC,
-        },
+    getProjectConfig: jest.fn().mockReturnValue({
+      providers: ['awscloudformation'],
+      frontend: 'javascript',
+      javascript: {
+        framework: 'react',
       },
-    })),
-    // eslint-disable-next-line spellcheck/spell-checker
-    getCLIJSON: jest.fn().mockReturnValue({ features: { graphqltransformer: { transformerversion: 2 } } }),
-    setCLIJSON: jest.fn(),
-  },
-  FeatureFlags: {
-    getBoolean: () => true,
-    getNumber: jest.fn().mockReturnValue(2),
-    reloadValues: jest.fn(),
+    })
   },
 }));
-CloudformationProviderFacade.isAmplifyAdminApp = jest.fn().mockReturnValue({
-  isAdminApp: true,
-});
+
+jest.mock('../clients', () => ({
+  AmplifyStudioClient: {
+    isAmplifyApp: jest.fn().mockReturnValue(true)
+  }
+}));
 
 describe('should render components', () => {
   let context: $TSContext | any;
@@ -47,9 +40,6 @@ describe('should render components', () => {
       })),
     }));
     context = {
-      amplify: {
-        invokePluginMethod: () => ({}),
-      },
       input: {
         options: {
           'no-codegen': false,
@@ -57,38 +47,61 @@ describe('should render components', () => {
           envName: 'testEnvName',
         },
       },
-      exeInfo: {
-        projectConfig: {
-          providers: ['awscloudformation'],
-          frontend: 'javascript',
-          javascript: {
-            framework: 'react',
-          },
-        },
-      },
     };
   });
+
   it('works with a valid config', async () => {
     const shouldIt = await shouldRenderComponents(context);
     expect(shouldIt).toBe(true);
   });
+
   it("doesn't work if --no-codegen flag is set", async () => {
     context.input.options['no-codegen'] = true;
     const shouldIt = await shouldRenderComponents(context);
     expect(shouldIt).toBe(false);
   });
+
   it("doesn't work if provider is not awscloudformation", async () => {
-    context.exeInfo.projectConfig.providers = [];
+    jest.mock('amplify-cli-core', () => ({
+      stateManager: {
+        getProjectConfig: jest.fn().mockReturnValue({
+          providers: [],
+          frontend: 'javascript',
+          javascript: {
+            framework: 'react',
+          },
+        })
+      }
+    }));
     const shouldIt = await shouldRenderComponents(context);
     expect(shouldIt).toBe(false);
   });
+
   it('should return false if frontend is ios', async () => {
-    context.exeInfo.projectConfig.frontend = 'ios';
+    jest.mock('amplify-cli-core', () => ({
+      stateManager: {
+        getProjectConfig: jest.fn().mockReturnValue({
+          providers: [],
+          frontend: 'ios',
+        })
+      },
+    }));
     const shouldIt = await shouldRenderComponents(context);
     expect(shouldIt).toBe(false);
   });
+
   it('should return false if frontend is vue', async () => {
-    context.exeInfo.projectConfig.javascript.framework = 'vue';
+    jest.mock('amplify-cli-core', () => ({
+      stateManager: {
+        getProjectConfig: jest.fn().mockReturnValue({
+          providers: [],
+          frontend: 'javascript',
+          javascript: {
+            framework: 'vue',
+          },
+        })
+      },
+    }));
     const shouldIt = await shouldRenderComponents(context);
     expect(shouldIt).toBe(false);
   });

package/src/__tests__/syncAmplifyUiComponents.test.ts

@@ -262,7 +262,7 @@ describe('should sync amplify ui builder components', () => {
     const forms = generateUiBuilderForms(context, [{}, {}]);
     expect(forms.every(form => form.resultType === 'FAILURE')).toBeTruthy();
   });
-  it('can generate uibuilder forms from data schema if autogen true', async () => {
+  it('can generate uibuilder forms from data schema if autogenerate true', async () => {
     createUiBuilderComponentDependencyMock.createUiBuilderForm = jest.fn().mockImplementation(() => ({}));
     const forms = generateUiBuilderForms(context, [], exampleSchema, true);
     expect(forms.every(form => form.resultType === 'SUCCESS')).toBeTruthy();
@@ -270,7 +270,7 @@ describe('should sync amplify ui builder components', () => {
     expect(forms.length).toEqual(2);
   });
 
-  it('should not autogen forms for join tables or unsupported models', async () => {
+  it('should not autogenerate forms for join tables or unsupported models', async () => {
     expect(Object.keys(exampleSchema.models)).toStrictEqual(['Author', 'JoinTable', 'EmptyModel']);
     createUiBuilderComponentDependencyMock.createUiBuilderForm = jest.fn().mockImplementation(
       // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -282,7 +282,7 @@ describe('should sync amplify ui builder components', () => {
     expect(forms.map(f => (f.schema as any).name)).toStrictEqual(['Author', 'Author']);
   });
 
-  it('does not generate uibuilder forms from data schema if autogen false', async () => {
+  it('does not generate uibuilder forms from data schema if autogenerate false', async () => {
     createUiBuilderComponentDependencyMock.createUiBuilderForm = jest.fn().mockImplementation(() => ({}));
     const forms = generateUiBuilderForms(context, [], exampleSchema, false);
     expect(forms.length).toEqual(0);

package/src/clients/amplify-studio-client.ts

@@ -230,6 +230,19 @@ export default class AmplifyStudioClient {
     }
   };
 
+  deleteForm = async (formId: string, envName?: string, appId?: string): Promise<void> => {
+    const environmentName = envName || this.#envName;
+    const resolvedAppId = appId || this.#appId;
+    try {
+      await this.#amplifyUiBuilder
+        .deleteForm({ id: formId, environmentName, appId: resolvedAppId })
+        .promise();
+    } catch (err) {
+      printer.debug(err.toString());
+      throw err;
+    }
+  }
+
   getModels = async (resourceName: string, envName?: string, appId?: string): Promise<string | undefined> => {
     try {
       const environmentName = envName || this.#envName;

package/src/commands/cloneComponentsFromEnv.ts

@@ -11,7 +11,7 @@ export const run = async (context: $TSContext): Promise<void> => {
   const args = extractArgs(context);
   const sourceEnvName = args.sourceEnvName ? args.sourceEnvName : context.exeInfo.sourceEnvName;
   const newEnvName = args.newEnvName ? args.newEnvName : context.exeInfo.localEnvInfo.envName;
-  const appId = args.appId ?? context.exeInfo.teamProviderInfo[sourceEnvName].awscloudformation.AmplifyAppId;
+  const appId = args.appId ?? context.exeInfo?.teamProviderInfo?.[sourceEnvName]?.awscloudformation?.AmplifyAppId;
   const studioClient = await AmplifyStudioClient.setClientInfo(context, sourceEnvName, appId);
 
   const [existingComponents, existingComponentsNewEnv] = await Promise.all([

package/src/commands/generateComponents.ts

@@ -13,12 +13,15 @@ import {
   generateAmplifyUiBuilderIndexFile,
   generateUiBuilderForms,
   generateAmplifyUiBuilderUtilFile,
+  isStudioForm,
+  isFormDetachedFromModel,
+  deleteDetachedForms,
 } from './utils';
 
 /**
  * Pulls ui components from Studio backend and generates the code in the user's file system
  */
-export const run = async (context: $TSContext): Promise<void> => {
+export const run = async (context: $TSContext, eventType: 'PostPush' | 'PostPull'): Promise<void> => {
   if (!(await shouldRenderComponents(context))) {
     return;
   }
@@ -32,9 +35,9 @@ export const run = async (context: $TSContext): Promise<void> => {
       getAmplifyDataSchema(studioClient),
     ]);
 
-    const nothingWouldAutogen = !dataSchema || !studioClient.metadata.autoGenerateForms || !studioClient.isGraphQLSupported;
+    const nothingWouldAutogenerate = !dataSchema || !studioClient.metadata.autoGenerateForms || !studioClient.isGraphQLSupported;
 
-    if (nothingWouldAutogen && [componentSchemas, themeSchemas, formSchemas].every(group => !group.entities.length)) {
+    if (nothingWouldAutogenerate && [componentSchemas, themeSchemas, formSchemas].every(group => !group.entities.length)) {
       printer.debug('Skipping UI component generation since none are found.');
       return;
     }
@@ -44,13 +47,18 @@ export const run = async (context: $TSContext): Promise<void> => {
       component: generateUiBuilderComponents(context, componentSchemas.entities, dataSchema),
       theme: generateUiBuilderThemes(context, themeSchemas.entities),
       form: generateUiBuilderForms(
-        context, formSchemas.entities, dataSchema, studioClient.metadata.autoGenerateForms && studioClient.isGraphQLSupported,
+        context,
+        formSchemas.entities,
+        dataSchema,
+        studioClient.metadata.autoGenerateForms && studioClient.isGraphQLSupported,
       ),
     };
 
     const successfulSchemas: StudioSchema[] = [];
+    const detachedForms: {id: string, name: string}[] = [];
     let hasSuccessfulForm = false;
     const failedResponseNames: string[] = [];
+    const modelNames = dataSchema?.models ? new Set(Object.keys(dataSchema.models)) : new Set<string>();
 
     Object.entries(generatedResults).forEach(([key, results]) => {
       results.forEach(result => {
@@ -60,6 +68,22 @@ export const run = async (context: $TSContext): Promise<void> => {
             hasSuccessfulForm = true;
           }
         } else {
+          const failedSchema = result.schema;
+          /**
+           * A form resource may fail to generate because it's DataStore model type
+           * no longer exists.
+           */
+          if (
+            isStudioForm(failedSchema)
+            && failedSchema.id
+            && dataSchema
+            && eventType === 'PostPush'
+            && isFormDetachedFromModel(failedSchema, modelNames)
+          ) {
+            // Don't need to add form to failedResponseNames if it is going to be deleted
+            detachedForms.push({id: failedSchema.id, name: failedSchema.name});
+            return;
+          }
           failedResponseNames.push(result.schemaName);
         }
       });
@@ -88,6 +112,8 @@ export const run = async (context: $TSContext): Promise<void> => {
     }
 
     notifyMissingPackages(context);
+
+    deleteDetachedForms(detachedForms, studioClient);
   } catch (e) {
     printer.debug(e);
     spinner.fail('Failed to sync UI components');

package/src/commands/utils/codegenResources.ts

@@ -145,7 +145,9 @@ export const generateAmplifyUiBuilderIndexFile = (context: $TSContext, schemas:
   });
 
   try {
-    rendererManager.renderSchemaToTemplate(schemas);
+    if(schemas.length) {
+      rendererManager.renderSchemaToTemplate(schemas);
+    }
   } catch (e) {
     printer.debug(e);
     printer.debug('Failed to generate component index file');