fix: set correct import location for code sample (#203)

packages/studio-ui-codegen-react/lib/__tests__/__snapshots__/import-collection.test.ts.snap

@@ -34,7 +34,7 @@ import { User } from \\"../models\\";"
 
 exports[`ImportCollection buildImportStatements no imports 1`] = `"import React from \\"react\\";"`;
 
-exports[`ImportCollection buildSampleSnippetImports 1`] = `"import { MyButton } from \\"./studio-ui\\";"`;
+exports[`ImportCollection buildSampleSnippetImports 1`] = `"import { MyButton } from \\"./ui-components\\";"`;
 
 exports[`ImportCollection mergeCollections 1`] = `
 "import React from \\"react\\";

packages/studio-ui-codegen-react/lib/__tests__/__snapshots__/react-studio-template-renderer.test.ts.snap

@@ -0,0 +1,21 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ReactStudioTemplateRenderer renderSampleCodeSnippet component with name 1`] = `
+Object {
+  "compText": "export const App = () => {
+    return (<MyText></MyText>);
+};",
+  "importsText": "import { MyText } from \\"./ui-components\\";
+",
+}
+`;
+
+exports[`ReactStudioTemplateRenderer renderSampleCodeSnippet component without name 1`] = `
+Object {
+  "compText": "export const App = () => {
+    return (<unknown_component_name></unknown_component_name>);
+};",
+  "importsText": "import { unknown_component_name } from \\"./ui-components\\";
+",
+}
+`;

packages/studio-ui-codegen-react/lib/__tests__/__utils__/mock-classes.ts

@@ -0,0 +1,23 @@
+/*
+  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+
+  Licensed under the Apache License, Version 2.0 (the "License").
+  You may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+ */
+import { JsxFragment, factory } from 'typescript';
+import { ReactStudioTemplateRenderer } from '../../react-studio-template-renderer';
+
+export class MockTemplateRenderer extends ReactStudioTemplateRenderer {
+  renderJsx(): JsxFragment {
+    return factory.createJsxFragment(factory.createJsxOpeningFragment(), [], factory.createJsxJsxClosingFragment());
+  }
+}

packages/studio-ui-codegen-react/lib/__tests__/import-collection.test.ts

@@ -89,9 +89,6 @@ describe('ImportCollection', () => {
 
   test('buildSampleSnippetImports', () => {
     const importCollection = new ImportCollection();
-    importCollection.addImport('@aws-amplify/ui-react', 'Button');
-    importCollection.addImport('@aws-amplify/ui-react', 'getOverrideProps');
-    importCollection.addImport('../models', 'User');
     assertASTMatchesSnapshot(importCollection.buildSampleSnippetImports('MyButton'));
   });
 });

packages/studio-ui-codegen-react/lib/__tests__/react-studio-template-renderer.test.ts

@@ -0,0 +1,40 @@
+/*
+  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+
+  Licensed under the Apache License, Version 2.0 (the "License").
+  You may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+ */
+import { MockTemplateRenderer } from './__utils__/mock-classes';
+
+describe('ReactStudioTemplateRenderer', () => {
+  describe('renderSampleCodeSnippet', () => {
+    const component = {
+      componentType: 'Text',
+      bindingProperties: {},
+      properties: {
+        children: {
+          value: 'value',
+        },
+      },
+    };
+
+    test('component with name', () => {
+      const renderer = new MockTemplateRenderer({ ...component, name: 'MyText' }, {});
+      expect(renderer.renderSampleCodeSnippet()).toMatchSnapshot();
+    });
+
+    test('component without name', () => {
+      const renderer = new MockTemplateRenderer(component, {});
+      expect(renderer.renderSampleCodeSnippet()).toMatchSnapshot();
+    });
+  });
+});

packages/studio-ui-codegen-react/lib/import-collection.ts

@@ -41,7 +41,7 @@ export class ImportCollection {
 
   buildSampleSnippetImports(topComponentName: string): ImportDeclaration[] {
     const importDeclarations: ImportDeclaration[] = [];
-    const sampleStudioPath = './studio-ui';
+    const sampleStudioPath = './ui-components';
     const namedImports = factory.createNamedImports([
       factory.createImportSpecifier(undefined, factory.createIdentifier(topComponentName)),
     ]);