@nx/react 16.0.0-beta.1

package/src/rules/add-styled-dependencies.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addStyledModuleDependencies = void 0;
+const styled_1 = require("../utils/styled");
+const devkit_1 = require("@nx/devkit");
+function addStyledModuleDependencies(host, styledModule) {
+    const extraDependencies = styled_1.CSS_IN_JS_DEPENDENCIES[styledModule];
+    if (extraDependencies) {
+        return (0, devkit_1.addDependenciesToPackageJson)(host, extraDependencies.dependencies, extraDependencies.devDependencies);
+    }
+    else {
+        return () => { };
+    }
+}
+exports.addStyledModuleDependencies = addStyledModuleDependencies;
+//# sourceMappingURL=add-styled-dependencies.js.map

package/src/rules/add-styled-dependencies.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"add-styled-dependencies.js","sourceRoot":"","sources":["../../../../../packages/react/src/rules/add-styled-dependencies.ts"],"names":[],"mappings":";;;AAAA,4CAAyD;AACzD,uCAAgE;AAEhE,SAAgB,2BAA2B,CAAC,IAAU,EAAE,YAAoB;IAC1E,MAAM,iBAAiB,GAAG,+BAAsB,CAAC,YAAY,CAAC,CAAC;IAE/D,IAAI,iBAAiB,EAAE;QACrB,OAAO,IAAA,qCAA4B,EACjC,IAAI,EACJ,iBAAiB,CAAC,YAAY,EAC9B,iBAAiB,CAAC,eAAe,CAClC,CAAC;KACH;SAAM;QACL,OAAO,GAAG,EAAE,GAAE,CAAC,CAAC;KACjB;AACH,CAAC;AAZD,kEAYC"}

package/src/rules/update-module-federation-project.d.ts

@@ -0,0 +1,6 @@
+import { GeneratorCallback, Tree } from '@nx/devkit';
+export declare function updateModuleFederationProject(host: Tree, options: {
+    projectName: string;
+    appProjectRoot: string;
+    devServerPort?: number;
+}): GeneratorCallback;

package/src/rules/update-module-federation-project.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.updateModuleFederationProject = void 0;
+const devkit_1 = require("@nx/devkit");
+const versions_1 = require("../utils/versions");
+function updateModuleFederationProject(host, options) {
+    const projectConfig = (0, devkit_1.readProjectConfiguration)(host, options.projectName);
+    projectConfig.targets.build.options = Object.assign(Object.assign({}, projectConfig.targets.build.options), { main: `${options.appProjectRoot}/src/main.ts`, webpackConfig: `${options.appProjectRoot}/webpack.config.js` });
+    projectConfig.targets.build.configurations.production = Object.assign(Object.assign({}, projectConfig.targets.build.configurations.production), { webpackConfig: `${options.appProjectRoot}/webpack.config.prod.js` });
+    projectConfig.targets.serve.executor =
+        '@nrwl/react:module-federation-dev-server';
+    projectConfig.targets.serve.options.port = options.devServerPort;
+    // `serve-static` for remotes that don't need to be in development mode
+    projectConfig.targets['serve-static'] = {
+        executor: '@nrwl/web:file-server',
+        defaultConfiguration: 'development',
+        options: {
+            buildTarget: `${options.projectName}:build`,
+            port: options.devServerPort,
+        },
+        configurations: {
+            development: {
+                buildTarget: `${options.projectName}:build:development`,
+            },
+            production: {
+                buildTarget: `${options.projectName}:build:production`,
+            },
+        },
+    };
+    (0, devkit_1.updateProjectConfiguration)(host, options.projectName, projectConfig);
+    return (0, devkit_1.addDependenciesToPackageJson)(host, {}, { '@nrwl/web': versions_1.nxVersion });
+}
+exports.updateModuleFederationProject = updateModuleFederationProject;
+//# sourceMappingURL=update-module-federation-project.js.map

package/src/rules/update-module-federation-project.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"update-module-federation-project.js","sourceRoot":"","sources":["../../../../../packages/react/src/rules/update-module-federation-project.ts"],"names":[],"mappings":";;;AAAA,uCAMoB;AACpB,gDAA8C;AAE9C,SAAgB,6BAA6B,CAC3C,IAAU,EACV,OAIC;IAED,MAAM,aAAa,GAAG,IAAA,iCAAwB,EAAC,IAAI,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;IAE1E,aAAa,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,mCAC9B,aAAa,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,KACtC,IAAI,EAAE,GAAG,OAAO,CAAC,cAAc,cAAc,EAC7C,aAAa,EAAE,GAAG,OAAO,CAAC,cAAc,oBAAoB,GAC7D,CAAC;IAEF,aAAa,CAAC,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,UAAU,mCAChD,aAAa,CAAC,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,UAAU,KACxD,aAAa,EAAE,GAAG,OAAO,CAAC,cAAc,yBAAyB,GAClE,CAAC;IAEF,aAAa,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ;QAClC,0CAA0C,CAAC;IAC7C,aAAa,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,GAAG,OAAO,CAAC,aAAa,CAAC;IAEjE,uEAAuE;IACvE,aAAa,CAAC,OAAO,CAAC,cAAc,CAAC,GAAG;QACtC,QAAQ,EAAE,uBAAuB;QACjC,oBAAoB,EAAE,aAAa;QACnC,OAAO,EAAE;YACP,WAAW,EAAE,GAAG,OAAO,CAAC,WAAW,QAAQ;YAC3C,IAAI,EAAE,OAAO,CAAC,aAAa;SAC5B;QACD,cAAc,EAAE;YACd,WAAW,EAAE;gBACX,WAAW,EAAE,GAAG,OAAO,CAAC,WAAW,oBAAoB;aACxD;YACD,UAAU,EAAE;gBACV,WAAW,EAAE,GAAG,OAAO,CAAC,WAAW,mBAAmB;aACvD;SACF;KACF,CAAC;IAEF,IAAA,mCAA0B,EAAC,IAAI,EAAE,OAAO,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;IAErE,OAAO,IAAA,qCAA4B,EAAC,IAAI,EAAE,EAAE,EAAE,EAAE,WAAW,EAAE,oBAAS,EAAE,CAAC,CAAC;AAC5E,CAAC;AA9CD,sEA8CC"}

package/src/utils/assertion.d.ts

@@ -0,0 +1 @@
+export declare function assertValidStyle(style: string): void;

package/src/utils/assertion.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.assertValidStyle = void 0;
+const VALID_STYLES = [
+    'css',
+    'scss',
+    'less',
+    'styl',
+    'styled-components',
+    '@emotion/styled',
+    'styled-jsx',
+    'none',
+];
+function assertValidStyle(style) {
+    if (VALID_STYLES.indexOf(style) === -1) {
+        throw new Error(`Unsupported style option found: ${style}. Valid values are: "${VALID_STYLES.join('", "')}"`);
+    }
+}
+exports.assertValidStyle = assertValidStyle;
+//# sourceMappingURL=assertion.js.map

package/src/utils/assertion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"assertion.js","sourceRoot":"","sources":["../../../../../packages/react/src/utils/assertion.ts"],"names":[],"mappings":";;;AAAA,MAAM,YAAY,GAAG;IACnB,KAAK;IACL,MAAM;IACN,MAAM;IACN,MAAM;IACN,mBAAmB;IACnB,iBAAiB;IACjB,YAAY;IACZ,MAAM;CACP,CAAC;AACF,SAAgB,gBAAgB,CAAC,KAAa;IAC5C,IAAI,YAAY,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE;QACtC,MAAM,IAAI,KAAK,CACb,mCAAmC,KAAK,wBAAwB,YAAY,CAAC,IAAI,CAC/E,MAAM,CACP,GAAG,CACL,CAAC;KACH;AACH,CAAC;AARD,4CAQC"}

package/src/utils/ast-utils.d.ts

@@ -0,0 +1,29 @@
+import type * as ts from 'typescript';
+import { StringChange } from '@nx/devkit';
+export declare function addImport(source: ts.SourceFile, statement: string): StringChange[];
+export declare function findMainRenderStatement(source: ts.SourceFile): ts.CallExpression | null;
+export declare function findDefaultExport(source: ts.SourceFile): ts.VariableDeclaration | ts.FunctionDeclaration | ts.ClassDeclaration | null;
+export declare function findDefaultExportDeclaration(source: ts.SourceFile): ts.VariableDeclaration | ts.FunctionDeclaration | ts.ClassDeclaration | null;
+export declare function findExportDeclarationsForJsx(source: ts.SourceFile): Array<ts.VariableDeclaration | ts.FunctionDeclaration | ts.ClassDeclaration> | null;
+export declare function findDefaultExportIdentifier(source: ts.SourceFile): ts.Identifier | null;
+export declare function findDefaultClassOrFunction(source: ts.SourceFile | null): ts.FunctionDeclaration | ts.ClassDeclaration | null;
+export declare function findComponentImportPath(componentName: string, source: ts.SourceFile): string;
+export declare function findElements(source: ts.SourceFile, tagName: string): ts.Node[];
+export declare function findClosestOpening(tagName: string, node: ts.Node): any;
+export declare function isTag(tagName: string, node: ts.Node): boolean;
+export declare function addInitialRoutes(sourcePath: string, source: ts.SourceFile): StringChange[];
+export declare function addRoute(sourcePath: string, source: ts.SourceFile, options: {
+    routePath: string;
+    componentName: string;
+    moduleName: string;
+}): StringChange[];
+export declare function addBrowserRouter(sourcePath: string, source: ts.SourceFile): StringChange[];
+export declare function addStaticRouter(sourcePath: string, source: ts.SourceFile): StringChange[];
+export declare function addReduxStoreToMain(sourcePath: string, source: ts.SourceFile): StringChange[];
+export declare function updateReduxStore(sourcePath: string, source: ts.SourceFile, feature: {
+    keyName: string;
+    reducerName: string;
+    modulePath: string;
+}): StringChange[];
+export declare function getComponentNode(sourceFile: ts.SourceFile): ts.Node | null;
+export declare function getComponentPropsInterface(sourceFile: ts.SourceFile, cmpDeclaration: ts.Node): ts.InterfaceDeclaration | null;

package/src/utils/ast-utils.js

@@ -0,0 +1,526 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getComponentPropsInterface = exports.getComponentNode = exports.updateReduxStore = exports.addReduxStoreToMain = exports.addStaticRouter = exports.addBrowserRouter = exports.addRoute = exports.addInitialRoutes = exports.isTag = exports.findClosestOpening = exports.findElements = exports.findComponentImportPath = exports.findDefaultClassOrFunction = exports.findDefaultExportIdentifier = exports.findExportDeclarationsForJsx = exports.findDefaultExportDeclaration = exports.findDefaultExport = exports.findMainRenderStatement = exports.addImport = void 0;
+const typescript_1 = require("nx/src/utils/typescript");
+const devkit_1 = require("@nx/devkit");
+const ensure_typescript_1 = require("@nx/js/src/utils/typescript/ensure-typescript");
+let tsModule;
+function addImport(source, statement) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    const allImports = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.ImportDeclaration);
+    if (allImports.length > 0) {
+        const lastImport = allImports[allImports.length - 1];
+        return [
+            {
+                type: devkit_1.ChangeType.Insert,
+                index: lastImport.end + 1,
+                text: `\n${statement}\n`,
+            },
+        ];
+    }
+    else {
+        return [
+            {
+                type: devkit_1.ChangeType.Insert,
+                index: 0,
+                text: `\n${statement}\n`,
+            },
+        ];
+    }
+}
+exports.addImport = addImport;
+function findMainRenderStatement(source) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    // 1. Try to find ReactDOM.render.
+    const calls = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.CallExpression);
+    for (const expr of calls) {
+        const inner = expr.expression;
+        // React 17 and below
+        if (tsModule.isPropertyAccessExpression(inner) &&
+            /ReactDOM/i.test(inner.expression.getText()) &&
+            inner.name.getText() === 'render') {
+            return expr;
+        }
+        // React 18
+        if (tsModule.isPropertyAccessExpression(inner) &&
+            /root/.test(inner.expression.getText()) &&
+            inner.name.getText() === 'render') {
+            return expr;
+        }
+    }
+    // 2. Try to find render from 'react-dom'.
+    const imports = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.ImportDeclaration);
+    const hasRenderImport = imports.some((i) => i.moduleSpecifier.getText().includes('react-dom') &&
+        /\brender\b/.test(i.importClause.namedBindings.getText()));
+    if (hasRenderImport) {
+        const calls = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.CallExpression);
+        for (const expr of calls) {
+            if (expr.expression.getText() === 'render') {
+                return expr;
+            }
+        }
+    }
+    return null;
+}
+exports.findMainRenderStatement = findMainRenderStatement;
+function findDefaultExport(source) {
+    return (findDefaultExportDeclaration(source) || findDefaultClassOrFunction(source));
+}
+exports.findDefaultExport = findDefaultExport;
+function findDefaultExportDeclaration(source) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    const identifier = findDefaultExportIdentifier(source);
+    if (identifier) {
+        const variables = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.VariableDeclaration);
+        const fns = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.FunctionDeclaration);
+        const cls = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.ClassDeclaration);
+        const all = [...variables, ...fns, ...cls];
+        const exported = all
+            .filter((x) => x.name.kind === tsModule.SyntaxKind.Identifier)
+            .find((x) => x.name.text === identifier.text);
+        return exported || null;
+    }
+    else {
+        return null;
+    }
+}
+exports.findDefaultExportDeclaration = findDefaultExportDeclaration;
+function findExportDeclarationsForJsx(source) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    const variables = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.VariableDeclaration);
+    const variableStatements = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.VariableStatement);
+    const fns = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.FunctionDeclaration);
+    const cls = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.ClassDeclaration);
+    const exportDeclarations = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.ExportDeclaration);
+    let componentNamesNodes = [];
+    exportDeclarations.forEach((node) => {
+        componentNamesNodes = [
+            ...componentNamesNodes,
+            ...(0, typescript_1.findNodes)(node, tsModule.SyntaxKind.ExportSpecifier),
+        ];
+    });
+    const componentNames = componentNamesNodes === null || componentNamesNodes === void 0 ? void 0 : componentNamesNodes.map((node) => node.getText());
+    const all = [...variables, ...variableStatements, ...fns, ...cls];
+    let foundExport;
+    let foundJSX;
+    const nodesContainingJSX = all.filter((x) => {
+        foundJSX = (0, typescript_1.findNodes)(x, [
+            tsModule.SyntaxKind.JsxSelfClosingElement,
+            tsModule.SyntaxKind.JsxOpeningElement,
+        ]);
+        return foundJSX === null || foundJSX === void 0 ? void 0 : foundJSX.length;
+    });
+    const exported = nodesContainingJSX.filter((x) => {
+        var _a, _b, _c;
+        foundExport = (0, typescript_1.findNodes)(x, tsModule.SyntaxKind.ExportKeyword);
+        if (x.kind === tsModule.SyntaxKind.VariableStatement) {
+            const nameNode = (_a = (0, typescript_1.findNodes)(x, tsModule.SyntaxKind.VariableDeclaration)) === null || _a === void 0 ? void 0 : _a[0];
+            return (((_b = nameNode === null || nameNode === void 0 ? void 0 : nameNode.name) === null || _b === void 0 ? void 0 : _b.kind) === tsModule.SyntaxKind.Identifier ||
+                (foundExport === null || foundExport === void 0 ? void 0 : foundExport.length) ||
+                (componentNames === null || componentNames === void 0 ? void 0 : componentNames.includes((_c = nameNode === null || nameNode === void 0 ? void 0 : nameNode.name) === null || _c === void 0 ? void 0 : _c.getText())));
+        }
+        else {
+            return ((x.name.kind === tsModule.SyntaxKind.Identifier &&
+                (foundExport === null || foundExport === void 0 ? void 0 : foundExport.length)) ||
+                (componentNames === null || componentNames === void 0 ? void 0 : componentNames.includes(x.name.getText())));
+        }
+    });
+    const exportedDeclarations = exported.map((x) => {
+        var _a;
+        if (x.kind === tsModule.SyntaxKind.VariableStatement) {
+            const nameNode = (_a = (0, typescript_1.findNodes)(x, tsModule.SyntaxKind.VariableDeclaration)) === null || _a === void 0 ? void 0 : _a[0];
+            return nameNode;
+        }
+        return x;
+    });
+    return exportedDeclarations || null;
+}
+exports.findExportDeclarationsForJsx = findExportDeclarationsForJsx;
+function findDefaultExportIdentifier(source) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    const exports = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.ExportAssignment);
+    const identifier = exports
+        .map((x) => x.expression)
+        .find((x) => x.kind === tsModule.SyntaxKind.Identifier);
+    return identifier || null;
+}
+exports.findDefaultExportIdentifier = findDefaultExportIdentifier;
+function findDefaultClassOrFunction(source) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    const fns = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.FunctionDeclaration);
+    const cls = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.ClassDeclaration);
+    return (fns.find(hasDefaultExportModifier) ||
+        cls.find(hasDefaultExportModifier) ||
+        null);
+}
+exports.findDefaultClassOrFunction = findDefaultClassOrFunction;
+function hasDefaultExportModifier(x) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    return (x.modifiers &&
+        x.modifiers.some((m) => m.kind === tsModule.SyntaxKind.ExportKeyword) &&
+        x.modifiers.some((m) => m.kind === tsModule.SyntaxKind.DefaultKeyword));
+}
+function findComponentImportPath(componentName, source) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    const allImports = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.ImportDeclaration);
+    const matching = allImports.filter((i) => {
+        return (i.importClause &&
+            i.importClause.name &&
+            i.importClause.name.getText() === componentName);
+    });
+    if (matching.length === 0) {
+        return null;
+    }
+    const appImport = matching[0];
+    return appImport.moduleSpecifier.getText().replace(/['"]/g, '');
+}
+exports.findComponentImportPath = findComponentImportPath;
+function findElements(source, tagName) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    const nodes = (0, typescript_1.findNodes)(source, [
+        tsModule.SyntaxKind.JsxSelfClosingElement,
+        tsModule.SyntaxKind.JsxOpeningElement,
+    ]);
+    return nodes.filter((node) => isTag(tagName, node));
+}
+exports.findElements = findElements;
+function findClosestOpening(tagName, node) {
+    if (!node) {
+        return null;
+    }
+    if (isTag(tagName, node)) {
+        return node;
+    }
+    else {
+        return findClosestOpening(tagName, node.parent);
+    }
+}
+exports.findClosestOpening = findClosestOpening;
+function isTag(tagName, node) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    if (tsModule.isJsxOpeningLikeElement(node)) {
+        return (node.tagName.kind === tsModule.SyntaxKind.Identifier &&
+            node.tagName.text === tagName);
+    }
+    if (tsModule.isJsxElement(node) && node.openingElement) {
+        return (node.openingElement.tagName.kind === tsModule.SyntaxKind.Identifier &&
+            node.openingElement.tagName.getText() === tagName);
+    }
+    return false;
+}
+exports.isTag = isTag;
+function addInitialRoutes(sourcePath, source) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    const jsxClosingElements = (0, typescript_1.findNodes)(source, [
+        tsModule.SyntaxKind.JsxClosingElement,
+        tsModule.SyntaxKind.JsxClosingFragment,
+    ]);
+    const outerMostJsxClosing = jsxClosingElements[jsxClosingElements.length - 1];
+    if (!outerMostJsxClosing) {
+        devkit_1.logger.warn(`Could not find JSX elements in ${sourcePath}; Skipping insert routes`);
+        return [];
+    }
+    const insertRoutes = {
+        type: devkit_1.ChangeType.Insert,
+        index: outerMostJsxClosing.getStart(),
+        text: `
+    {/* START: routes */}
+    {/* These routes and navigation have been generated for you */}
+    {/* Feel free to move and update them to fit your needs */}
+    <br/>
+    <hr/>
+    <br/>
+    <div role="navigation">
+      <ul>
+        <li><Link to="/">Home</Link></li>
+        <li><Link to="/page-2">Page 2</Link></li>
+      </ul>
+    </div>
+    <Routes>
+      <Route
+        path="/"
+        element={
+          <div>This is the generated root route. <Link to="/page-2">Click here for page 2.</Link></div>
+        }
+      />
+      <Route
+        path="/page-2"
+        element={
+          <div><Link to="/">Click here to go back to root page.</Link></div>
+        }
+      />
+    </Routes>
+    {/* END: routes */}
+    `,
+    };
+    return [
+        ...addImport(source, `import { Route, Routes, Link } from 'react-router-dom';`),
+        insertRoutes,
+    ];
+}
+exports.addInitialRoutes = addInitialRoutes;
+function addRoute(sourcePath, source, options) {
+    const routes = findElements(source, 'Route');
+    const links = findElements(source, 'Link');
+    if (routes.length === 0) {
+        devkit_1.logger.warn(`Could not find <Route/> components in ${sourcePath}; Skipping add route`);
+        return [];
+    }
+    else {
+        const changes = [];
+        const firstRoute = routes[0];
+        const firstLink = links[0];
+        changes.push(...addImport(source, `import { ${options.componentName} } from '${options.moduleName}';`));
+        changes.push({
+            type: devkit_1.ChangeType.Insert,
+            index: firstRoute.getEnd(),
+            text: `<Route path="${options.routePath}" element={<${options.componentName}/>} />`,
+        });
+        if (firstLink) {
+            const parentLi = findClosestOpening('li', firstLink);
+            if (parentLi) {
+                changes.push({
+                    type: devkit_1.ChangeType.Insert,
+                    index: parentLi.getEnd(),
+                    text: `<li><Link to="${options.routePath}">${options.componentName}</Link></li>`,
+                });
+            }
+            else {
+                changes.push({
+                    type: devkit_1.ChangeType.Insert,
+                    index: firstLink.parent.getEnd(),
+                    text: `<Link to="${options.routePath}">${options.componentName}</Link>`,
+                });
+            }
+        }
+        return changes;
+    }
+}
+exports.addRoute = addRoute;
+function addBrowserRouter(sourcePath, source) {
+    const app = findElements(source, 'App')[0];
+    if (app) {
+        return [
+            ...addImport(source, `import { BrowserRouter } from 'react-router-dom';`),
+            {
+                type: devkit_1.ChangeType.Insert,
+                index: app.getStart(),
+                text: `<BrowserRouter>`,
+            },
+            {
+                type: devkit_1.ChangeType.Insert,
+                index: app.getEnd(),
+                text: `</BrowserRouter>`,
+            },
+        ];
+    }
+    else {
+        devkit_1.logger.warn(`Could not find App component in ${sourcePath}; Skipping add <BrowserRouter>`);
+        return [];
+    }
+}
+exports.addBrowserRouter = addBrowserRouter;
+function addStaticRouter(sourcePath, source) {
+    const app = findElements(source, 'App')[0];
+    if (app) {
+        return [
+            ...addImport(source, `import { StaticRouter } from 'react-router-dom/server';`),
+            {
+                type: devkit_1.ChangeType.Insert,
+                index: app.getStart(),
+                text: `<StaticRouter location={req.originalUrl}>`,
+            },
+            {
+                type: devkit_1.ChangeType.Insert,
+                index: app.getEnd(),
+                text: `</StaticRouter>`,
+            },
+        ];
+    }
+    else {
+        devkit_1.logger.warn(`Could not find App component in ${sourcePath}; Skipping add <StaticRouter>`);
+        return [];
+    }
+}
+exports.addStaticRouter = addStaticRouter;
+function addReduxStoreToMain(sourcePath, source) {
+    const renderStmt = findMainRenderStatement(source);
+    if (!renderStmt) {
+        devkit_1.logger.warn(`Could not find render(...) in ${sourcePath}`);
+        return [];
+    }
+    const jsx = renderStmt.arguments[0];
+    return [
+        ...addImport(source, `import { configureStore } from '@reduxjs/toolkit';
+import { Provider } from 'react-redux';`),
+        {
+            type: devkit_1.ChangeType.Insert,
+            index: renderStmt.getStart(),
+            text: `
+const store = configureStore({
+  reducer: {},
+  // Additional middleware can be passed to this array
+  middleware: getDefaultMiddleware => getDefaultMiddleware(),
+  devTools: process.env.NODE_ENV !== 'production',
+  // Optional Redux store enhancers
+  enhancers: [],
+});
+
+`,
+        },
+        {
+            type: devkit_1.ChangeType.Insert,
+            index: jsx.getStart(),
+            text: `<Provider store={store}>`,
+        },
+        {
+            type: devkit_1.ChangeType.Insert,
+            index: jsx.getEnd(),
+            text: `</Provider>`,
+        },
+    ];
+}
+exports.addReduxStoreToMain = addReduxStoreToMain;
+function updateReduxStore(sourcePath, source, feature) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    const calls = (0, typescript_1.findNodes)(source, tsModule.SyntaxKind.CallExpression);
+    let reducerDescriptor;
+    // Look for configureStore call
+    for (const expr of calls) {
+        if (!expr.expression.getText().includes('configureStore')) {
+            continue;
+        }
+        const arg = expr.arguments[0];
+        if (tsModule.isObjectLiteralExpression(arg)) {
+            let found;
+            for (const prop of arg.properties) {
+                if (tsModule.isPropertyAssignment(prop) &&
+                    prop.name.getText() === 'reducer' &&
+                    tsModule.isObjectLiteralExpression(prop.initializer)) {
+                    found = prop.initializer;
+                    break;
+                }
+            }
+            if (found) {
+                reducerDescriptor = found;
+                break;
+            }
+        }
+    }
+    // Look for combineReducer call
+    if (!reducerDescriptor) {
+        for (const expr of calls) {
+            if (!expr.expression.getText().includes('combineReducer')) {
+                continue;
+            }
+            const arg = expr.arguments[0];
+            if (tsModule.isObjectLiteralExpression(arg)) {
+                reducerDescriptor = arg;
+                break;
+            }
+        }
+    }
+    if (!reducerDescriptor) {
+        devkit_1.logger.warn(`Could not find configureStore/combineReducer call in ${sourcePath}`);
+        return [];
+    }
+    return [
+        ...addImport(source, `import { ${feature.keyName}, ${feature.reducerName} } from '${feature.modulePath}';`),
+        {
+            type: devkit_1.ChangeType.Insert,
+            index: reducerDescriptor.getStart() + 1,
+            text: `[${feature.keyName}]: ${feature.reducerName}${reducerDescriptor.properties.length > 0 ? ',' : ''}`,
+        },
+    ];
+}
+exports.updateReduxStore = updateReduxStore;
+function getComponentNode(sourceFile) {
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    const defaultExport = findDefaultExport(sourceFile);
+    if (!(defaultExport &&
+        ((0, typescript_1.findNodes)(defaultExport, tsModule.SyntaxKind.JsxElement).length > 0 ||
+            (0, typescript_1.findNodes)(defaultExport, tsModule.SyntaxKind.JsxSelfClosingElement)
+                .length > 0))) {
+        return null;
+    }
+    return defaultExport;
+}
+exports.getComponentNode = getComponentNode;
+function getComponentPropsInterface(sourceFile, cmpDeclaration) {
+    var _a, _b, _c, _d;
+    if (!tsModule) {
+        tsModule = (0, ensure_typescript_1.ensureTypescript)();
+    }
+    let propsTypeName = null;
+    if (tsModule.isFunctionDeclaration(cmpDeclaration)) {
+        const propsParam = cmpDeclaration.parameters.find((x) => tsModule.isParameter(x) && x.name.text === 'props');
+        if ((_a = propsParam === null || propsParam === void 0 ? void 0 : propsParam.type) === null || _a === void 0 ? void 0 : _a['typeName']) {
+            propsTypeName = propsParam.type.typeName.text;
+        }
+    }
+    else if (cmpDeclaration.initializer &&
+        tsModule.isArrowFunction(cmpDeclaration.initializer)) {
+        const arrowFn = cmpDeclaration
+            .initializer;
+        const propsParam = arrowFn.parameters.find((x) => tsModule.isParameter(x) && x.name.text === 'props');
+        if ((_b = propsParam === null || propsParam === void 0 ? void 0 : propsParam.type) === null || _b === void 0 ? void 0 : _b['typeName']) {
+            propsTypeName = propsParam.type.typeName.text;
+        }
+    }
+    else if (
+    // do we have a class component extending from React.Component
+    tsModule.isClassDeclaration(cmpDeclaration) &&
+        cmpDeclaration.heritageClauses &&
+        cmpDeclaration.heritageClauses.length > 0) {
+        const heritageClause = cmpDeclaration.heritageClauses[0];
+        if (heritageClause) {
+            const propsTypeExpression = heritageClause.types.find((x) => {
+                const name = x.expression.escapedText ||
+                    x.expression.name.text;
+                return name === 'Component' || name === 'PureComponent';
+            });
+            if ((_d = (_c = propsTypeExpression === null || propsTypeExpression === void 0 ? void 0 : propsTypeExpression.typeArguments) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d['typeName']) {
+                propsTypeName = propsTypeExpression.typeArguments[0].typeName.getText();
+            }
+        }
+    }
+    else {
+        return null;
+    }
+    if (propsTypeName) {
+        return (0, typescript_1.findNodes)(sourceFile, tsModule.SyntaxKind.InterfaceDeclaration).find((x) => {
+            return x.name.getText() === propsTypeName;
+        });
+    }
+    else {
+        return null;
+    }
+}
+exports.getComponentPropsInterface = getComponentPropsInterface;
+//# sourceMappingURL=ast-utils.js.map