@nx/react-native 16.0.0-beta.1

package/src/generators/component-story/component-story.spec.ts

@@ -0,0 +1,433 @@
+import { getProjects, Tree, updateProjectConfiguration } from '@nx/devkit';
+import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
+import componentStoryGenerator from './component-story';
+import { Linter } from '@nx/linter';
+
+import { formatFile } from '../../utils/format-file';
+import libraryGenerator from '../library/library';
+import componentGenerator from '../component/component';
+
+describe('react-native:component-story', () => {
+  let appTree: Tree;
+  let cmpPath = 'libs/test-ui-lib/src/lib/test-ui-lib/test-ui-lib.tsx';
+  let storyFilePath =
+    'libs/test-ui-lib/src/lib/test-ui-lib/test-ui-lib.stories.tsx';
+
+  describe('default setup', () => {
+    beforeEach(async () => {
+      appTree = await createTestUILib('test-ui-lib');
+    });
+
+    describe('when file does not contain a component', () => {
+      beforeEach(() => {
+        appTree.write(
+          cmpPath,
+          `export const add = (a: number, b: number) => a + b;`
+        );
+      });
+
+      it('should fail with a descriptive error message', async () => {
+        try {
+          await componentStoryGenerator(appTree, {
+            componentPath: 'lib/test-ui-lib/test-ui-lib.tsx',
+            project: 'test-ui-lib',
+          });
+        } catch (e) {
+          expect(e.message).toContain(
+            'Could not find any React Native component in file libs/test-ui-lib/src/lib/test-ui-lib/test-ui-lib.tsx'
+          );
+        }
+      });
+    });
+
+    describe('default component setup', () => {
+      beforeEach(async () => {
+        await componentStoryGenerator(appTree, {
+          componentPath: 'lib/test-ui-lib/test-ui-lib.tsx',
+          project: 'test-ui-lib',
+        });
+      });
+
+      it('should create the story file', () => {
+        expect(appTree.exists(storyFilePath)).toBeTruthy();
+      });
+
+      it('should properly set up the story', () => {
+        expect(
+          formatFile`${appTree.read(storyFilePath, 'utf-8').replace('·', '')}`
+        ).toContain(formatFile`
+          import { storiesOf } from '@storybook/react-native';
+          import React from 'react';
+          import { TestUiLib, TestUiLibProps } from './test-ui-lib';
+          const props: TestUiLibProps = {};
+          storiesOf('TestUiLib', module)            
+            .add('Primary', () => <TestUiLib {...props} />);
+          `);
+      });
+    });
+
+    describe('when using plain JS components', () => {
+      let storyFilePathPlain =
+        'libs/test-ui-lib/src/lib/test-ui-libplain.stories.jsx';
+
+      beforeEach(async () => {
+        appTree.write(
+          'libs/test-ui-lib/src/lib/test-ui-libplain.jsx',
+          `import React from 'react';
+  
+          import './test.scss';
+          
+          export const Test = () => {
+            return (
+              <div>
+                <h1>Welcome to test component</h1>
+              </div>
+            );
+          };
+          
+          export default Test;        
+          `
+        );
+
+        await componentStoryGenerator(appTree, {
+          componentPath: 'lib/test-ui-libplain.jsx',
+          project: 'test-ui-lib',
+        });
+      });
+
+      it('should create the story file', () => {
+        expect(appTree.exists(storyFilePathPlain)).toBeTruthy();
+      });
+
+      it('should properly set up the story', () => {
+        expect(formatFile`${appTree.read(storyFilePathPlain, 'utf-8')}`)
+          .toContain(formatFile`
+    import { storiesOf } from '@storybook/react-native';
+    import React from 'react';
+    import { Test } from './test-ui-libplain';
+
+    const props = {};
+
+    storiesOf('Test', module)
+      .add('Primary', () => <Test {...props} />);
+          `);
+      });
+    });
+
+    describe('component without any props defined', () => {
+      beforeEach(async () => {
+        appTree.write(
+          cmpPath,
+          `import React from 'react';
+
+          import { View, Text } from 'react-native';
+          
+          export function Test() {
+            return (
+              <View>
+                <Text>Welcome to test!</Text>
+              </View>
+            );
+          }
+          
+          export default Test;   
+          `
+        );
+        await componentStoryGenerator(appTree, {
+          componentPath: 'lib/test-ui-lib/test-ui-lib.tsx',
+          project: 'test-ui-lib',
+        });
+      });
+
+      it('should create a story without controls', () => {
+        expect(formatFile`${appTree.read(storyFilePath, 'utf-8')}`)
+          .toContain(formatFile`
+          import { storiesOf } from '@storybook/react-native';
+          import React from 'react';
+          import { Test } from './test-ui-lib';
+          const props = {};
+          storiesOf('Test', module)
+            .add('Primary', () => <Test {...props} />);
+          `);
+      });
+    });
+
+    describe('component with props', () => {
+      beforeEach(async () => {
+        await componentStoryGenerator(appTree, {
+          componentPath: 'lib/test-ui-lib/test-ui-lib.tsx',
+          project: 'test-ui-lib',
+        });
+      });
+
+      it('should setup controls based on the component props', () => {
+        expect(
+          formatFile`${appTree.read(storyFilePath, 'utf-8').replace('·', '')}`
+        ).toContain(formatFile`
+          import { storiesOf } from '@storybook/react-native';
+          import React from 'react';
+          import { TestUiLib, TestUiLibProps } from './test-ui-lib';
+          const props: TestUiLibProps = {};
+          storiesOf('TestUiLib', module)
+            .add('Primary', () => <TestUiLib {...props} />);
+          `);
+      });
+    });
+
+    describe('component with props and actions', () => {
+      beforeEach(async () => {
+        appTree.write(
+          cmpPath,
+          `import React from 'react';
+
+          export type ButtonStyle = 'default' | 'primary' | 'warning';
+          
+          export interface TestProps {
+            name: string;
+            displayAge: boolean;
+            someAction: (e: unknown) => void;
+            style: ButtonStyle;
+          }
+          
+          export const Test = (props: TestProps) => {
+            return (
+              <div>
+                <h1>Welcome to test component, {props.name}</h1>
+                <button onClick={props.someAction}>Click me!</button>
+              </div>
+            );
+          };
+          
+          export default Test;        
+          `
+        );
+
+        await componentStoryGenerator(appTree, {
+          componentPath: 'lib/test-ui-lib/test-ui-lib.tsx',
+          project: 'test-ui-lib',
+        });
+      });
+
+      it('should setup controls based on the component props', () => {
+        expect(
+          formatFile`${appTree.read(storyFilePath, 'utf-8').replace('·', '')}`
+        ).toContain(formatFile`
+        import { action } from '@storybook/addon-actions';
+        import { storiesOf } from '@storybook/react-native';
+        import React from 'react';
+        import { Test, TestProps } from './test-ui-lib';
+        const actions = { someAction: action('someAction executed!') };
+        const props: TestProps = { name: '', displayAge: false };
+        storiesOf('Test', module)
+          .add('Primary', () => <Test {...props} {...actions} />);
+          `);
+      });
+    });
+
+    [
+      {
+        name: 'default export function',
+        src: `export default function Test(props: TestProps) {
+        return (
+          <div>
+            <h1>Welcome to test component, {props.name}</h1>
+          </div>
+        );
+      };
+      `,
+      },
+      {
+        name: 'function and then export',
+        src: `
+      function Test(props: TestProps) {
+        return (
+          <div>
+            <h1>Welcome to test component, {props.name}</h1>
+          </div>
+        );
+      };
+      export default Test;
+      `,
+      },
+      {
+        name: 'arrow function',
+        src: `
+      const Test = (props: TestProps) => {
+        return (
+          <div>
+            <h1>Welcome to test component, {props.name}</h1>
+          </div>
+        );
+      };
+      export default Test;
+      `,
+      },
+      {
+        name: 'arrow function without {..}',
+        src: `
+      const Test = (props: TestProps) => <div><h1>Welcome to test component, {props.name}</h1></div>;
+      export default Test
+      `,
+      },
+      {
+        name: 'direct export of component class',
+        src: `
+        export default class Test extends React.Component<TestProps> {
+          render() {
+            return <div><h1>Welcome to test component, {this.props.name}</h1></div>;
+          }
+        }
+        `,
+      },
+      {
+        name: 'component class & then default export',
+        src: `
+        class Test extends React.Component<TestProps> {
+          render() {
+            return <div><h1>Welcome to test component, {this.props.name}</h1></div>;
+          }
+        }
+        export default Test
+        `,
+      },
+      {
+        name: 'PureComponent class & then default export',
+        src: `
+        class Test extends React.PureComponent<TestProps> {
+          render() {
+            return <div><h1>Welcome to test component, {this.props.name}</h1></div>;
+          }
+        }
+        export default Test
+        `,
+      },
+      {
+        name: 'direct export of component class new JSX transform',
+        src: `
+        export default class Test extends Component<TestProps> {
+          render() {
+            return <div><h1>Welcome to test component, {this.props.name}</h1></div>;
+          }
+        }
+        `,
+      },
+      {
+        name: 'component class & then default export new JSX transform',
+        src: `
+        class Test extends Component<TestProps> {
+          render() {
+            return <div><h1>Welcome to test component, {this.props.name}</h1></div>;
+          }
+        }
+        export default Test
+        `,
+      },
+      {
+        name: 'PureComponent class & then default export new JSX transform',
+        src: `
+        class Test extends PureComponent<TestProps> {
+          render() {
+            return <div><h1>Welcome to test component, {this.props.name}</h1></div>;
+          }
+        }
+        export default Test
+        `,
+      },
+    ].forEach((config) => {
+      describe(`React Native component defined as:${config.name}`, () => {
+        beforeEach(async () => {
+          appTree.write(
+            cmpPath,
+            `import React from 'react';
+            
+            export interface TestProps {
+              name: string;
+              displayAge: boolean;
+            }
+            
+            ${config.src}
+            `
+          );
+
+          await componentStoryGenerator(appTree, {
+            componentPath: 'lib/test-ui-lib/test-ui-lib.tsx',
+            project: 'test-ui-lib',
+          });
+        });
+
+        it('should properly setup the controls based on the component props', () => {
+          expect(
+            formatFile`${appTree.read(storyFilePath, 'utf-8').replace('·', '')}`
+          ).toContain(formatFile`
+    import { storiesOf } from '@storybook/react-native';
+    import React from 'react';
+    import { Test, TestProps } from './test-ui-lib';
+    const props: TestProps = {
+      name: '',
+      displayAge: false,
+    };
+    storiesOf('Test', module)
+      .add('Primary', () => <Test {...props} />);
+          `);
+        });
+      });
+    });
+  });
+
+  describe('using eslint', () => {
+    beforeEach(async () => {
+      appTree = await createTestUILib('test-ui-lib');
+      await componentGenerator(appTree, {
+        name: 'test-ui-lib',
+        project: 'test-ui-lib',
+        export: true,
+      });
+      await componentStoryGenerator(appTree, {
+        componentPath: 'lib/test-ui-lib/test-ui-lib.tsx',
+        project: 'test-ui-lib',
+      });
+    });
+
+    it('should properly set up the story', () => {
+      expect(formatFile`${appTree.read(storyFilePath, 'utf-8')}`)
+        .toContain(formatFile`
+        import { storiesOf } from '@storybook/react-native';
+        import React from 'react';
+        import { TestUiLib, TestUiLibProps } from './test-ui-lib';
+
+        const props: TestUiLibProps = {};
+
+        storiesOf('TestUiLib', module)
+          .add('Primary', () => <TestUiLib {...props} />);
+        `);
+    });
+  });
+});
+
+export async function createTestUILib(libName: string): Promise<Tree> {
+  let appTree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
+  appTree.write('.gitignore', '');
+
+  await libraryGenerator(appTree, {
+    name: libName,
+    linter: Linter.EsLint,
+    skipFormat: true,
+    skipTsConfig: false,
+    unitTestRunner: 'jest',
+  });
+
+  await componentGenerator(appTree, {
+    name: libName,
+    project: libName,
+    export: true,
+  });
+
+  const currentWorkspaceJson = getProjects(appTree);
+
+  const projectConfig = currentWorkspaceJson.get(libName);
+  projectConfig.targets.lint.options.linter = 'eslint';
+
+  updateProjectConfiguration(appTree, libName, projectConfig);
+
+  return appTree;
+}

package/src/generators/component-story/files/__componentFileName__.stories.__fileExt__

@@ -0,0 +1,24 @@
+<% if (hasActions) { %>
+  import { action } from '@storybook/addon-actions';
+<% } %>
+import { storiesOf } from '@storybook/react-native';
+import React from 'react';
+import {
+  <%= componentName %>
+  <% if ( propsTypeName ) { %>, <%= propsTypeName %> <% } %>
+} from './<%= componentImportFileName %>';
+
+<% if (hasActions) { %>
+  const actions = {<% for (let argType of argTypes) { %>
+    <%= argType.name %>: action('<%- argType.actionText %>'),
+  <% } %>};
+<% } %>
+
+const props <% if ( propsTypeName ) { %>:<%= propsTypeName %><% } %> = {<% for (let prop of props) { %>
+    <%= prop.name %>: <%- prop.defaultValue %>,
+<% } %>};
+
+storiesOf('<%= componentName %>', module)
+  .add('Primary', () => (
+    <<%= componentName %> {...props} <% if (hasActions) { %> {...actions} <% } %>/>
+  ));

package/src/generators/component-story/schema.d.ts

@@ -0,0 +1,5 @@
+export interface CreateComponentStoriesFileSchema {
+  project: string;
+  componentPath: string;
+  skipFormat?: boolean;
+}

package/src/generators/component-story/schema.json

@@ -0,0 +1,34 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "cli": "nx",
+  "$id": "NxReactNativeComponentStory",
+  "title": "React native component story",
+  "description": "Generate storybook story for a react-native component.",
+  "type": "object",
+  "properties": {
+    "project": {
+      "type": "string",
+      "aliases": ["name", "projectName"],
+      "description": "The project where to add the components.",
+      "examples": ["shared-ui-component"],
+      "$default": {
+        "$source": "projectName",
+        "index": 0
+      },
+      "x-prompt": "What's the name of the project where the component lives?"
+    },
+    "componentPath": {
+      "type": "string",
+      "description": "Relative path to the component file from the library root.",
+      "examples": ["lib/components"],
+      "x-prompt": "What's path of the component relative to the project's lib root?"
+    },
+    "skipFormat": {
+      "description": "Skip formatting files.",
+      "type": "boolean",
+      "default": false,
+      "x-priority": "internal"
+    }
+  },
+  "required": ["project", "componentPath"]
+}

package/src/generators/init/init.d.ts

@@ -0,0 +1,6 @@
+import { GeneratorCallback, Tree } from '@nx/devkit';
+import { Schema } from './schema';
+export declare function reactNativeInitGenerator(host: Tree, schema: Schema): Promise<GeneratorCallback>;
+export declare function updateDependencies(host: Tree): GeneratorCallback;
+export default reactNativeInitGenerator;
+export declare const reactNativeInitSchematic: (generatorOptions: Schema) => (tree: any, context: any) => Promise<any>;

package/src/generators/init/init.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.reactNativeInitSchematic = exports.updateDependencies = exports.reactNativeInitGenerator = void 0;
+const tslib_1 = require("tslib");
+const devkit_1 = require("@nx/devkit");
+const add_babel_inputs_1 = require("@nx/js/src/utils/add-babel-inputs");
+const jest_1 = require("@nx/jest");
+const detox_1 = require("@nx/detox");
+const versions_1 = require("@nx/react/src/utils/versions");
+const js_1 = require("@nx/js");
+const versions_2 = require("../../utils/versions");
+const add_git_ignore_entry_1 = require("./lib/add-git-ignore-entry");
+function reactNativeInitGenerator(host, schema) {
+    return tslib_1.__awaiter(this, void 0, void 0, function* () {
+        (0, add_git_ignore_entry_1.addGitIgnoreEntry)(host);
+        yield (0, add_babel_inputs_1.addBabelInputs)(host);
+        const tasks = [];
+        tasks.push(yield (0, js_1.initGenerator)(host, Object.assign(Object.assign({}, schema), { skipFormat: true })));
+        if (!schema.skipPackageJson) {
+            const installTask = updateDependencies(host);
+            tasks.push(moveDependency(host));
+            tasks.push(installTask);
+        }
+        if (!schema.unitTestRunner || schema.unitTestRunner === 'jest') {
+            const jestTask = yield (0, jest_1.jestInitGenerator)(host, schema);
+            tasks.push(jestTask);
+        }
+        if (!schema.e2eTestRunner || schema.e2eTestRunner === 'detox') {
+            const detoxTask = yield (0, detox_1.detoxInitGenerator)(host, Object.assign(Object.assign({}, schema), { skipFormat: true }));
+            tasks.push(detoxTask);
+        }
+        if (!schema.skipFormat) {
+            yield (0, devkit_1.formatFiles)(host);
+        }
+        return (0, devkit_1.runTasksInSerial)(...tasks);
+    });
+}
+exports.reactNativeInitGenerator = reactNativeInitGenerator;
+function updateDependencies(host) {
+    const isPnpm = (0, devkit_1.detectPackageManager)(host.root) === 'pnpm';
+    return (0, devkit_1.addDependenciesToPackageJson)(host, {
+        react: versions_2.reactVersion,
+        'react-dom': versions_2.reactDomVersion,
+        'react-native': versions_2.reactNativeVersion,
+    }, Object.assign({ '@nrwl/react-native': versions_2.nxVersion, '@types/node': versions_2.typesNodeVersion, '@types/react': versions_2.typesReactVersion, '@types/react-native': versions_2.typesReactNativeVersion, '@react-native-community/cli': versions_2.reactNativeCommunityCli, '@react-native-community/cli-platform-android': versions_2.reactNativeCommunityCliAndroid, '@react-native-community/cli-platform-ios': versions_2.reactNativeCommunityCliIos, '@testing-library/react-native': versions_2.testingLibraryReactNativeVersion, '@testing-library/jest-native': versions_2.testingLibraryJestNativeVersion, 'jest-react-native': versions_2.jestReactNativeVersion, metro: versions_2.metroVersion, 'metro-resolver': versions_2.metroVersion, 'metro-babel-register': versions_2.metroVersion, 'metro-react-native-babel-preset': versions_2.metroVersion, 'metro-react-native-babel-transformer': versions_2.metroVersion, 'react-test-renderer': versions_2.reactTestRendererVersion, 'react-native-svg-transformer': versions_2.reactNativeSvgTransformerVersion, 'react-native-svg': versions_2.reactNativeSvgVersion, 'react-native-config': versions_2.reactNativeConfigVersion, '@react-native-async-storage/async-storage': versions_2.reactNativeAsyncStorageAsyncStorageVersion, '@babel/preset-react': versions_1.babelPresetReactVersion }, (isPnpm
+        ? {
+            'metro-config': versions_2.metroVersion,
+            '@babel/runtime': versions_2.babelRuntimeVersion, // @babel/runtime is used by react-native-svg
+        }
+        : {})));
+}
+exports.updateDependencies = updateDependencies;
+function moveDependency(host) {
+    return (0, devkit_1.removeDependenciesFromPackageJson)(host, ['@nrwl/react-native'], []);
+}
+exports.default = reactNativeInitGenerator;
+exports.reactNativeInitSchematic = (0, devkit_1.convertNxGenerator)(reactNativeInitGenerator);
+//# sourceMappingURL=init.js.map

package/src/generators/init/init.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"init.js","sourceRoot":"","sources":["../../../../../../packages/react-native/src/generators/init/init.ts"],"names":[],"mappings":"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"}

package/src/generators/init/init.spec.ts

@@ -0,0 +1,81 @@
+import { NxJsonConfiguration } from '@nx/devkit';
+import { Tree, readJson, updateJson } from '@nx/devkit';
+import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
+import { reactNativeInitGenerator } from './init';
+
+describe('init', () => {
+  let tree: Tree;
+
+  beforeEach(() => {
+    tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
+    tree.write('.gitignore', '');
+  });
+
+  it('should add react native dependencies', async () => {
+    await reactNativeInitGenerator(tree, { e2eTestRunner: 'none' });
+    const packageJson = readJson(tree, 'package.json');
+    expect(packageJson.dependencies['react']).toBeDefined();
+    expect(packageJson.dependencies['react-native']).toBeDefined();
+    expect(packageJson.devDependencies['@types/node']).toBeDefined();
+    expect(packageJson.devDependencies['@types/react']).toBeDefined();
+    expect(packageJson.devDependencies['@types/react-native']).toBeDefined();
+  });
+
+  it('should add .gitignore entries for React native files and directories', async () => {
+    tree.write(
+      '/.gitignore',
+      `
+/node_modules
+`
+    );
+    await reactNativeInitGenerator(tree, { e2eTestRunner: 'none' });
+
+    const content = tree.read('/.gitignore').toString();
+
+    expect(content).toMatch(/# React Native/);
+    expect(content).toMatch(/# Nested node_modules/);
+  });
+
+  describe('babel config', () => {
+    it('should create babel config if not present', async () => {
+      updateJson<NxJsonConfiguration>(tree, 'nx.json', (json) => {
+        json.namedInputs = {
+          sharedGlobals: ['{workspaceRoot}/exiting-file.json'],
+        };
+        return json;
+      });
+
+      await reactNativeInitGenerator(tree, {
+        unitTestRunner: 'none',
+        e2eTestRunner: 'none',
+      });
+
+      expect(tree.exists('babel.config.json')).toBe(true);
+      const sharedGloabls = readJson<NxJsonConfiguration>(tree, 'nx.json')
+        .namedInputs.sharedGlobals;
+      expect(sharedGloabls).toContain('{workspaceRoot}/exiting-file.json');
+      expect(sharedGloabls).toContain('{workspaceRoot}/babel.config.json');
+    });
+
+    it('should not overwrite existing babel config', async () => {
+      tree.write('babel.config.json', '{ "preset": ["preset-awesome"] }');
+
+      await reactNativeInitGenerator(tree, {
+        unitTestRunner: 'none',
+        e2eTestRunner: 'none',
+      });
+
+      const existing = readJson(tree, 'babel.config.json');
+      expect(existing).toEqual({ preset: ['preset-awesome'] });
+    });
+
+    it('should not overwrite existing babel config (.js)', async () => {
+      tree.write('/babel.config.js', 'module.exports = () => {};');
+      await reactNativeInitGenerator(tree, {
+        unitTestRunner: 'none',
+        e2eTestRunner: 'none',
+      });
+      expect(tree.exists('babel.config.json')).toBe(false);
+    });
+  });
+});

package/src/generators/init/lib/add-git-ignore-entry.d.ts

@@ -0,0 +1,2 @@
+import { Tree } from '@nx/devkit';
+export declare function addGitIgnoreEntry(host: Tree): void;

package/src/generators/init/lib/add-git-ignore-entry.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addGitIgnoreEntry = void 0;
+const devkit_1 = require("@nx/devkit");
+const ignore_1 = require("ignore");
+const gitignore_entries_1 = require("./gitignore-entries");
+function addGitIgnoreEntry(host) {
+    if (!host.exists('.gitignore')) {
+        devkit_1.logger.warn(`Couldn't find .gitignore file to update`);
+        return;
+    }
+    let content = host.read('.gitignore', 'utf-8').trimEnd();
+    const ig = (0, ignore_1.default)();
+    ig.add(host.read('.gitignore', 'utf-8'));
+    if (!ig.ignores('apps/example/ios/Pods/Folly')) {
+        content = `${content}\n${gitignore_entries_1.gitIgnoreEntriesForReactNative}\n`;
+    }
+    // also ignore nested node_modules folders due to symlink for React Native
+    if (!ig.ignores('apps/example/node_modules')) {
+        content = `${content}\n## Nested node_modules\n\nnode_modules/\n`;
+    }
+    host.write('.gitignore', content);
+}
+exports.addGitIgnoreEntry = addGitIgnoreEntry;
+//# sourceMappingURL=add-git-ignore-entry.js.map