@botonic/nx-plugin 2.23.0

package/src/generators/bot-app/files/src/shared/constants.ts.template

@@ -0,0 +1,12 @@
+export const CUSTOM_MESSAGE_TYPES = {
+  // Add your custom message types here
+} as const
+
+export const WEBVIEWS = {
+  // Add your webviews here
+} as const
+
+export const PAYLOADS = {
+  // Add your payloads here
+} as const
+

package/src/generators/bot-app/files/vite/base-client.config.ts.template

@@ -0,0 +1,14 @@
+import react from '@vitejs/plugin-react-swc'
+import { mergeConfig, type UserConfig } from 'vite'
+
+import { getBaseConfig } from './base.config'
+
+export function getBaseClientConfig(): UserConfig {
+  const baseConfig = getBaseConfig()
+
+  const clientConfig: UserConfig = {
+    plugins: [react()],
+  }
+
+  return mergeConfig(baseConfig, clientConfig)
+}

package/src/generators/bot-app/files/vite/base.config.ts.template

@@ -0,0 +1,20 @@
+import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin'
+
+export function getBaseConfig() {
+  return {
+    plugins: [nxViteTsPaths()],
+
+    test: {
+      watch: false,
+      globals: true,
+      environment: 'jsdom',
+      include: ['src/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
+      reporters: ['default'],
+      coverage: {
+        reportsDirectory: '../../coverage/apps/<%= projectName %>',
+        provider: 'v8',
+      },
+    },
+  }
+}
+

package/src/generators/bot-app/files/vite/build.config.ts.template

@@ -0,0 +1,65 @@
+export const BUILD_CONFIG = {
+  // Target apps
+  TARGET_APPS: {
+    WEBCHAT: 'webchat',
+    WEBVIEWS: 'webviews',
+    NODE: 'node',
+  } as const,
+
+  // Input paths (source)
+  INPUT: {
+    webchat: {
+      root: 'src/client/webchat',
+      html: 'src/client/webchat/index.html',
+      entry: 'src/client/webchat/index.tsx',
+    },
+    webviews: {
+      root: 'src/client/webviews',
+      html: 'src/client/webviews/index.html',
+      entry: 'src/client/webviews/index.tsx',
+    },
+    node: {
+      root: 'src/server',
+      entry: 'src/server/bot/index.ts',
+    },
+  } as const,
+
+  // Output paths (build artifacts)
+  OUTPUT: {
+    webchat: {
+      dir: 'dist/webchat',
+      html: 'index.html',
+      js: 'webchat.botonic.js',
+      css: 'webchat.botonic.css',
+    },
+    webviews: {
+      dir: 'dist/webviews',
+      html: 'index.html',
+      js: 'webviews.botonic.js',
+      css: 'webviews.botonic.css',
+    },
+    node: {
+      dir: 'src/server/lambda/dist',
+      js: 'index.js',
+    },
+  } as const,
+
+  // Cache & build settings
+  CACHE_DIR: {
+    webchat: '../../node_modules/.vite/apps/<%= projectName %>-webchat',
+    webviews: '../../node_modules/.vite/apps/<%= projectName %>-webviews',
+    node: '../../node_modules/.vite/apps/<%= projectName %>-node',
+  },
+  PUBLIC_DIR: 'public',
+
+  // Server ports
+  SERVER: {
+    webchat: { port: 4201, preview: 4300 },
+    webviews: { port: 4202, preview: 4301 },
+  } as const,
+}
+
+export type TargetApp =
+  (typeof BUILD_CONFIG.TARGET_APPS)[keyof typeof BUILD_CONFIG.TARGET_APPS]
+
+export type ClientTargetApp = 'webchat' | 'webviews'

package/src/generators/bot-app/files/vite/node.config.ts.template

@@ -0,0 +1,41 @@
+import { resolve } from 'path'
+import type { UserConfig } from 'vite'
+
+import { BUILD_CONFIG } from './build.config'
+
+const projectRoot = resolve(__dirname, '..')
+const input = BUILD_CONFIG.INPUT.node
+const output = BUILD_CONFIG.OUTPUT.node
+
+export function getNodeConfig(): UserConfig {
+  return {
+    root: projectRoot,
+    cacheDir: resolve(projectRoot, BUILD_CONFIG.CACHE_DIR.node),
+
+    // SSR configuration - bundle @botonic/* packages into the lambda
+    // By default, Vite externalizes node_modules in SSR mode, but we need
+    // @botonic packages bundled since they won't be available at runtime in Lambda
+    ssr: {
+      noExternal: [/@botonic\/.*/],
+    },
+
+    build: {
+      // Server build configuration
+      outDir: resolve(projectRoot, output.dir),
+      emptyOutDir: true,
+      ssr: true,
+      target: 'node20',
+      lib: {
+        entry: resolve(projectRoot, input.entry),
+        name: 'bot',
+        fileName: output.js,
+        formats: ['es'],
+      },
+      rollupOptions: {
+        output: {
+          exports: 'named',
+        },
+      },
+    },
+  }
+}

package/src/generators/bot-app/files/vite/plugins/move-html.plugin.ts.template

@@ -0,0 +1,36 @@
+import { copyFileSync, existsSync, rmSync } from 'fs'
+import { resolve } from 'path'
+import type { Plugin } from 'vite'
+
+import { BUILD_CONFIG, type ClientTargetApp } from '../build.config'
+
+export function moveHtmlToRootPlugin(
+  projectRoot: string,
+  targetApp: ClientTargetApp
+): Plugin {
+  return {
+    name: 'move-html-to-root',
+    apply: 'build',
+    closeBundle() {
+      const outputConfig = BUILD_CONFIG.OUTPUT[targetApp]
+      const inputConfig = BUILD_CONFIG.INPUT[targetApp]
+
+      const distDir = resolve(projectRoot, outputConfig.dir)
+      const srcDir = resolve(distDir, 'src')
+
+      if (existsSync(srcDir)) {
+        const nestedHtml = resolve(distDir, inputConfig.html)
+        const targetHtml = resolve(distDir, outputConfig.html)
+
+        if (existsSync(nestedHtml)) {
+          // Move the HTML file to root
+          copyFileSync(nestedHtml, targetHtml)
+          // Remove the src directory
+          rmSync(srcDir, { recursive: true, force: true })
+          console.log(`✓ Moved ${outputConfig.html} to ${outputConfig.dir}/`)
+        }
+      }
+    },
+  }
+}
+

package/src/generators/bot-app/files/vite/webchat.config.ts.template

@@ -0,0 +1,58 @@
+import { resolve } from 'path'
+import type { UserConfig } from 'vite'
+
+import { BUILD_CONFIG } from './build.config'
+import { moveHtmlToRootPlugin } from './plugins/move-html.plugin'
+
+const projectRoot = resolve(__dirname, '..')
+const output = BUILD_CONFIG.OUTPUT.webchat
+const server = BUILD_CONFIG.SERVER.webchat
+
+export function getWebchatConfig(command: 'serve' | 'build'): UserConfig {
+  return {
+    // For serve mode, use the webchat directory as root so dev server finds index.html
+    // For build mode, use project root to avoid relative path issues
+    root:
+      command === 'serve'
+        ? resolve(projectRoot, BUILD_CONFIG.INPUT.webchat.root)
+        : projectRoot,
+
+    cacheDir: resolve(projectRoot, BUILD_CONFIG.CACHE_DIR.webchat),
+    publicDir: resolve(projectRoot, BUILD_CONFIG.PUBLIC_DIR),
+    appType: 'spa',
+    base: '/',
+
+    server: {
+      port: server.port,
+      host: 'localhost',
+      open: '/',
+    },
+
+    preview: {
+      port: server.preview,
+      host: 'localhost',
+    },
+
+    build: {
+      outDir: resolve(projectRoot, output.dir),
+      emptyOutDir: true,
+      reportCompressedSize: true,
+      cssCodeSplit: false,
+      commonjsOptions: {
+        transformMixedEsModules: true,
+      },
+      rollupOptions: {
+        input: resolve(projectRoot, BUILD_CONFIG.INPUT.webchat.html),
+        output: {
+          entryFileNames: output.js,
+          chunkFileNames: output.js,
+          assetFileNames: 'webchat.botonic.[ext]',
+        },
+      },
+    },
+
+    plugins: [
+      moveHtmlToRootPlugin(projectRoot, BUILD_CONFIG.TARGET_APPS.WEBCHAT),
+    ],
+  }
+}

package/src/generators/bot-app/files/vite/webviews.config.ts.template

@@ -0,0 +1,57 @@
+import { resolve } from 'path'
+import type { UserConfig } from 'vite'
+
+import { BUILD_CONFIG } from './build.config'
+import { moveHtmlToRootPlugin } from './plugins/move-html.plugin'
+
+const projectRoot = resolve(__dirname, '..')
+const output = BUILD_CONFIG.OUTPUT.webviews
+const server = BUILD_CONFIG.SERVER.webviews
+
+export function getWebviewsConfig(command: 'serve' | 'build'): UserConfig {
+  return {
+    // For serve mode, use the webviews directory as root so dev server finds index.html
+    // For build mode, use project root to avoid relative path issues
+    root:
+      command === 'serve'
+        ? resolve(projectRoot, BUILD_CONFIG.INPUT.webviews.root)
+        : projectRoot,
+
+    cacheDir: resolve(projectRoot, BUILD_CONFIG.CACHE_DIR.webviews),
+    publicDir: resolve(projectRoot, BUILD_CONFIG.PUBLIC_DIR),
+    appType: 'spa',
+    base: '/webviews/',
+
+    server: {
+      port: server.port,
+      host: 'localhost',
+    },
+
+    preview: {
+      port: server.preview,
+      host: 'localhost',
+    },
+
+    build: {
+      outDir: resolve(projectRoot, output.dir),
+      emptyOutDir: true,
+      reportCompressedSize: true,
+      cssCodeSplit: false,
+      commonjsOptions: {
+        transformMixedEsModules: true,
+      },
+      rollupOptions: {
+        input: resolve(projectRoot, BUILD_CONFIG.INPUT.webviews.html),
+        output: {
+          entryFileNames: output.js,
+          chunkFileNames: output.js,
+          assetFileNames: 'webviews.botonic.[ext]',
+        },
+      },
+    },
+
+    plugins: [
+      moveHtmlToRootPlugin(projectRoot, BUILD_CONFIG.TARGET_APPS.WEBVIEWS),
+    ],
+  }
+}

package/src/generators/bot-app/files/vite.config.ts.template

@@ -0,0 +1,36 @@
+/// <reference types='vitest' />
+import { mergeConfig } from 'vite'
+import { defineConfig, type UserConfig } from 'vitest/config'
+
+import { getBaseConfig } from './vite/base.config'
+import { getBaseClientConfig } from './vite/base-client.config'
+import { BUILD_CONFIG } from './vite/build.config'
+import { getNodeConfig } from './vite/node.config'
+import { getWebchatConfig } from './vite/webchat.config'
+import { getWebviewsConfig } from './vite/webviews.config'
+
+const isNodeAppBuild = process.env.BUILD_TARGET === 'node'
+const targetApp = process.env.TARGET_APP || 'webchat'
+const isTestMode =
+  process.env.VITEST === 'true' || process.env.NODE_ENV === 'test'
+
+export default defineConfig(({ command }): UserConfig => {
+  // Test mode - use base config only to avoid root directory issues
+  if (isTestMode) {
+    return getBaseConfig() as UserConfig
+  }
+
+  // Server/Node build
+  if (isNodeAppBuild) {
+    return mergeConfig(getBaseConfig(), getNodeConfig()) as UserConfig
+  }
+
+  // Client builds - baseClientConfig already includes base config
+  const baseClientConfig = getBaseClientConfig()
+  const clientConfig =
+    targetApp === BUILD_CONFIG.TARGET_APPS.WEBVIEWS
+      ? getWebviewsConfig(command)
+      : getWebchatConfig(command)
+
+  return mergeConfig(baseClientConfig, clientConfig) as UserConfig
+})

package/src/generators/bot-app/generator.d.ts

@@ -0,0 +1,4 @@
+import { GeneratorCallback, Tree } from '@nx/devkit';
+import type { BotAppGeneratorSchema } from './schema';
+export default function (tree: Tree, options: BotAppGeneratorSchema): Promise<GeneratorCallback>;
+export { BotAppGeneratorSchema };

package/src/generators/bot-app/generator.js

@@ -0,0 +1,294 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var generator_exports = {};
+__export(generator_exports, {
+  default: () => generator_default
+});
+module.exports = __toCommonJS(generator_exports);
+var import_devkit = require("@nx/devkit");
+var fs = __toESM(require("fs"));
+var path = __toESM(require("path"));
+const MODULE_DIR = __dirname;
+function getBotonicVersion(options) {
+  const version = options.botonicVersion;
+  if (version && version !== "{{WORKSPACE_VERSION}}" && version !== "latest") {
+    return version.replace(/^[\^~]/, "");
+  }
+  try {
+    const packageJsonPath = path.resolve(
+      MODULE_DIR,
+      "..",
+      "..",
+      "..",
+      "package.json"
+    );
+    const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, "utf-8"));
+    return packageJson.version || "latest";
+  } catch (error) {
+    console.warn("Could not read plugin version, using latest:", error);
+    return "latest";
+  }
+}
+function normalizeOptions(tree, options) {
+  let appName = options.name;
+  let directory = options.directory;
+  if (options.name.includes("/")) {
+    const parts = options.name.split("/");
+    appName = parts.pop();
+    if (!directory) {
+      directory = parts.join("/");
+    }
+  }
+  const name = (0, import_devkit.names)(appName).fileName;
+  if (!name) {
+    throw new Error(`Failed to normalize app name: ${appName}`);
+  }
+  let projectDirectory;
+  if (directory) {
+    const directoryName = (0, import_devkit.names)(directory).fileName;
+    if (!directoryName) {
+      throw new Error(`Failed to normalize directory name: ${directory}`);
+    }
+    projectDirectory = `${directoryName}/${name}`;
+  } else {
+    projectDirectory = name;
+  }
+  if (!projectDirectory) {
+    throw new Error(
+      `Failed to determine project directory for app name: ${appName}`
+    );
+  }
+  const projectName = projectDirectory.replace(new RegExp("/", "g"), "-");
+  const projectRoot = `${(0, import_devkit.getWorkspaceLayout)(tree).appsDir}/${projectDirectory}`;
+  return {
+    ...options,
+    name: appName,
+    // Use the parsed app name
+    directory,
+    // Use the parsed directory
+    projectName,
+    projectRoot,
+    projectDirectory
+  };
+}
+function createProjectConfiguration(tree, options) {
+  const projectConfig = {
+    name: options.projectName,
+    root: options.projectRoot,
+    sourceRoot: `${options.projectRoot}/src`,
+    projectType: "application",
+    tags: ["type:app", "botonic:bot-app"]
+    // Note: targets are now inferred by the @botonic/nx-plugin based on the 'botonic:bot-app' tag
+    // and the presence of configuration files (vite.config.ts, bot-config.ts, etc.)
+  };
+  (0, import_devkit.addProjectConfiguration)(tree, options.projectName, projectConfig);
+}
+function createPackageJson(tree, options, botonicVersion) {
+  const packageJson = {
+    name: options.projectName,
+    version: "1.0.0",
+    type: "module",
+    private: true,
+    description: `Botonic bot application: ${options.projectName}`,
+    main: "dist/src/index.js",
+    scripts: {},
+    dependencies: {
+      "@botonic/core": botonicVersion,
+      "@botonic/shared": botonicVersion,
+      "@botonic/webchat-core": botonicVersion,
+      "@botonic/webchat-react": botonicVersion,
+      "@botonic/webviews": botonicVersion,
+      "@botonic/plugin-hubtype-analytics": botonicVersion,
+      "@botonic/plugin-flow-builder": botonicVersion,
+      "@botonic/plugin-ai-agents": botonicVersion,
+      react: "18.3.1",
+      "react-dom": "18.3.1"
+    },
+    devDependencies: {
+      "@nx/vite": "21.0.3",
+      "@types/node": "18.16.9",
+      "@types/react": "18.3.1",
+      "@types/react-dom": "18.3.0",
+      "@vitejs/plugin-react": "^4.2.0",
+      "@vitejs/plugin-react-swc": "^3.5.0",
+      typescript: "5.7.3",
+      vite: "^5.0.0",
+      vitest: "^1.3.1"
+    }
+  };
+  (0, import_devkit.writeJson)(tree, `${options.projectRoot}/package.json`, packageJson);
+}
+function createTsConfigs(tree, options) {
+  const tsconfig = {
+    compilerOptions: {
+      jsx: "react-jsx",
+      allowJs: false,
+      esModuleInterop: true,
+      allowSyntheticDefaultImports: true,
+      resolveJsonModule: true,
+      strict: true,
+      types: ["vite/client", "vitest"]
+    },
+    files: [],
+    include: ["src/**/*.ts", "src/**/*.tsx"],
+    references: [
+      { path: "./tsconfig.app.json" },
+      { path: "./tsconfig.spec.json" }
+    ],
+    extends: "../../tsconfig.base.json"
+  };
+  const tsconfigApp = {
+    extends: "./tsconfig.json",
+    compilerOptions: {
+      outDir: "./dist/out-tsc",
+      types: ["node", "vite/client"],
+      composite: true,
+      noEmit: false,
+      declaration: true
+    },
+    files: [
+      "../../node_modules/@nx/react/typings/cssmodule.d.ts",
+      "../../node_modules/@nx/react/typings/image.d.ts"
+    ],
+    exclude: [
+      "jest.config.ts",
+      "src/**/*.spec.ts",
+      "src/**/*.test.ts",
+      "src/**/*.spec.tsx",
+      "src/**/*.test.tsx",
+      "src/**/*.spec.js",
+      "src/**/*.test.js",
+      "src/**/*.spec.jsx",
+      "src/**/*.test.jsx"
+    ],
+    include: ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"]
+  };
+  const tsconfigSpec = {
+    extends: "./tsconfig.json",
+    compilerOptions: {
+      outDir: "./dist/out-tsc",
+      module: "commonjs",
+      types: ["vitest/globals", "vitest/importMeta", "vite/client", "node"],
+      composite: true,
+      noEmit: false,
+      declaration: true
+    },
+    include: [
+      "vite.config.ts",
+      "vitest.config.ts",
+      "src/**/*.test.ts",
+      "src/**/*.spec.ts",
+      "src/**/*.test.tsx",
+      "src/**/*.spec.tsx",
+      "src/**/*.test.js",
+      "src/**/*.spec.js",
+      "src/**/*.test.jsx",
+      "src/**/*.spec.jsx",
+      "src/**/*.d.ts"
+    ]
+  };
+  (0, import_devkit.writeJson)(tree, `${options.projectRoot}/tsconfig.json`, tsconfig);
+  (0, import_devkit.writeJson)(tree, `${options.projectRoot}/tsconfig.app.json`, tsconfigApp);
+  (0, import_devkit.writeJson)(tree, `${options.projectRoot}/tsconfig.spec.json`, tsconfigSpec);
+}
+function addBotonicDependencies(tree, botonicVersion) {
+  return (0, import_devkit.addDependenciesToPackageJson)(
+    tree,
+    // dependencies
+    {
+      react: "18.3.1",
+      "react-dom": "18.3.1"
+    },
+    // devDependencies
+    {
+      "@nx/vite": "21.0.3",
+      "@types/node": "18.16.9",
+      "@types/react": "18.3.1",
+      "@types/react-dom": "18.3.0",
+      "@vitejs/plugin-react": "4.2.0",
+      "@vitejs/plugin-react-swc": "3.5.0",
+      typescript: "5.7.3",
+      vite: "5.0.0",
+      vitest: "1.3.1"
+    }
+  );
+}
+function addBotonicFiles(tree, options, botonicVersion) {
+  const templateOptions = {
+    ...options,
+    ...(0, import_devkit.names)(options.name),
+    botonicVersion
+  };
+  (0, import_devkit.generateFiles)(
+    tree,
+    (0, import_devkit.joinPathFragments)(MODULE_DIR, "files"),
+    options.projectRoot,
+    templateOptions
+  );
+}
+async function generator_default(tree, options) {
+  const botonicVersion = getBotonicVersion(options);
+  const tasks = [];
+  console.log(`\u{1F916} Using Botonic version: ${botonicVersion}`);
+  console.log(`\u{1F50D} Creating project using programmatic configuration...`);
+  const normalizedOptions = normalizeOptions(tree, options);
+  console.log(`\u{1F50D} Normalized options:`, {
+    projectName: normalizedOptions.projectName,
+    projectRoot: normalizedOptions.projectRoot,
+    projectDirectory: normalizedOptions.projectDirectory
+  });
+  createProjectConfiguration(tree, normalizedOptions);
+  createPackageJson(tree, normalizedOptions, botonicVersion);
+  createTsConfigs(tree, normalizedOptions);
+  const depsTask = addBotonicDependencies(tree, botonicVersion);
+  tasks.push(depsTask);
+  tasks.push(() => (0, import_devkit.installPackagesTask)(tree));
+  tasks.push(
+    () => (0, import_devkit.installPackagesTask)(
+      tree,
+      true,
+      `${normalizedOptions.projectRoot}/src/server/lambda/`
+    )
+  );
+  addBotonicFiles(tree, normalizedOptions, botonicVersion);
+  await (0, import_devkit.formatFiles)(tree);
+  tasks.push(() => {
+    console.log(
+      `
+\u{1F389} Successfully created Botonic bot app: ${normalizedOptions.projectName}`
+    );
+    console.log(`\u{1F4C1} Project location: ${normalizedOptions.projectRoot}`);
+    console.log(`
+\u{1F4CB} Next step:`);
+    console.log(`   npx nx run ${normalizedOptions.projectName}:serve`);
+    console.log(`
+\u{1F680} Happy bot building!`);
+  });
+  return (0, import_devkit.runTasksInSerial)(...tasks);
+}

package/src/generators/bot-app/schema.d.ts

@@ -0,0 +1,6 @@
+export interface BotAppGeneratorSchema {
+    name: string;
+    directory?: string;
+    packageManager?: 'pnpm' | 'npm';
+    botonicVersion?: string;
+}

package/src/generators/bot-app/schema.js

@@ -0,0 +1,16 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var schema_exports = {};
+module.exports = __toCommonJS(schema_exports);