@tanstack/cta-engine 0.10.0-alpha.17 → 0.10.0-alpha.19

package/src/environment.ts

@@ -6,7 +6,7 @@ import {
   unlink,
   writeFile,
 } from 'node:fs/promises'
-import { existsSync, readdirSync, statSync } from 'node:fs'
+import { existsSync } from 'node:fs'
 import { dirname } from 'node:path'
 import { execa } from 'execa'
 import { memfs } from 'memfs'
@@ -49,14 +49,18 @@ export function createDefaultEnvironment(): Environment {
       await unlink(path)
     },
 
-    readFile: (path: string, encoding?: BufferEncoding) =>
-      readFile(path, { encoding: encoding || 'utf8' }),
     exists: (path: string) => existsSync(path),
-    readdir: (path) => readdirSync(path),
-    isDirectory: (path) => {
-      const stat = statSync(path)
-      return stat.isDirectory()
-    },
+
+    intro: () => {},
+    outro: () => {},
+    info: () => {},
+    error: () => {},
+    warn: () => {},
+    confirm: () => Promise.resolve(true),
+    spinner: () => ({
+      start: () => {},
+      stop: () => {},
+    }),
   }
 }
 
@@ -101,12 +105,6 @@ export function createMemoryEnvironment() {
     })
     return Promise.resolve()
   }
-  environment.readFile = async (path: string, encoding?: BufferEncoding) => {
-    if (isTemplatePath(path)) {
-      return (await readFile(path, encoding)).toString()
-    }
-    return fs.readFileSync(path, 'utf8').toString()
-  }
   environment.writeFile = async (path: string, contents: string) => {
     fs.mkdirSync(dirname(path), { recursive: true })
     await fs.writeFileSync(path, contents)
@@ -120,19 +118,6 @@ export function createMemoryEnvironment() {
     }
     return fs.existsSync(path)
   }
-  environment.readdir = (path: string) => {
-    if (isTemplatePath(path)) {
-      return readdirSync(path)
-    }
-    return fs.readdirSync(path).map((file) => file.toString())
-  }
-  environment.isDirectory = (path) => {
-    if (isTemplatePath(path)) {
-      const stat = statSync(path)
-      return stat.isDirectory()
-    }
-    return fs.statSync(path).isDirectory()
-  }
   environment.finishRun = () => {
     output.files = vol.toJSON() as Record<string, string>
   }

package/src/file-helpers.ts

@@ -0,0 +1,73 @@
+import { readFileSync, readdirSync, statSync } from 'node:fs'
+import { basename, extname, resolve } from 'node:path'
+
+const BINARY_EXTENSIONS = ['.png', '.jpg', '.jpeg', '.gif', '.svg', '.ico']
+
+export function readFileHelper(path: string): string {
+  if (BINARY_EXTENSIONS.includes(extname(path))) {
+    return `base64::${readFileSync(path).toString('base64')}`
+  } else {
+    return readFileSync(path, 'utf-8').toString()
+  }
+}
+
+export function getBinaryFile(content: string): string | null {
+  if (content.startsWith('base64::')) {
+    const binaryContent = Buffer.from(content.replace('base64::', ''), 'base64')
+    return binaryContent as unknown as string
+  }
+  return null
+}
+
+export function relativePath(from: string, to: string) {
+  const cleanedFrom = from.startsWith('./') ? from.slice(2) : from
+  const cleanedTo = to.startsWith('./') ? to.slice(2) : to
+
+  const fromSegments = cleanedFrom.split('/')
+  const toSegments = cleanedTo.split('/')
+
+  fromSegments.pop()
+  toSegments.pop()
+
+  let commonIndex = 0
+  while (
+    commonIndex < fromSegments.length &&
+    commonIndex < toSegments.length &&
+    fromSegments[commonIndex] === toSegments[commonIndex]
+  ) {
+    commonIndex++
+  }
+
+  const upLevels = fromSegments.length - commonIndex
+  const downLevels = toSegments.slice(commonIndex)
+
+  if (upLevels === 0 && downLevels.length === 0) {
+    return `./${basename(to)}`
+  } else if (upLevels === 0 && downLevels.length > 0) {
+    return `./${downLevels.join('/')}/${basename(to)}`
+  } else {
+    const relativePath = [...Array(upLevels).fill('..'), ...downLevels].join(
+      '/',
+    )
+    return `${relativePath}/${basename(to)}`
+  }
+}
+
+export function isDirectory(path: string): boolean {
+  return statSync(path).isDirectory()
+}
+
+export function findFilesRecursively(
+  path: string,
+  files: Record<string, string>,
+) {
+  const dirFiles = readdirSync(path)
+  for (const file of dirFiles) {
+    const filePath = resolve(path, file)
+    if (isDirectory(filePath)) {
+      findFilesRecursively(filePath, files)
+    } else {
+      files[filePath] = readFileHelper(filePath)
+    }
+  }
+}

package/src/frameworks.ts

@@ -0,0 +1,114 @@
+import { existsSync, readFileSync, readdirSync } from 'node:fs'
+import { resolve } from 'node:path'
+
+import {
+  findFilesRecursively,
+  isDirectory,
+  readFileHelper,
+} from './file-helpers.js'
+
+import type { AddOn, Framework, FrameworkDefinition } from './types.js'
+
+const frameworks: Array<Framework> = []
+
+function getAddOns(framework: FrameworkDefinition) {
+  const addOns: Array<AddOn> = []
+
+  for (const addOnsBase of framework.addOnsDirectories) {
+    for (const dir of readdirSync(addOnsBase).filter((file) =>
+      isDirectory(resolve(addOnsBase, file)),
+    )) {
+      const filePath = resolve(addOnsBase, dir, 'info.json')
+      const fileContent = readFileSync(filePath, 'utf-8')
+      const info = JSON.parse(fileContent)
+
+      let packageAdditions: Record<string, string> = {}
+      if (existsSync(resolve(addOnsBase, dir, 'package.json'))) {
+        packageAdditions = JSON.parse(
+          readFileSync(resolve(addOnsBase, dir, 'package.json'), 'utf-8'),
+        )
+      }
+
+      let readme: string | undefined
+      if (existsSync(resolve(addOnsBase, dir, 'README.md'))) {
+        readme = readFileSync(resolve(addOnsBase, dir, 'README.md'), 'utf-8')
+      }
+
+      const absoluteFiles: Record<string, string> = {}
+      const assetsDir = resolve(addOnsBase, dir, 'assets')
+      if (existsSync(assetsDir)) {
+        findFilesRecursively(assetsDir, absoluteFiles)
+      }
+      const files: Record<string, string> = {}
+      for (const file of Object.keys(absoluteFiles)) {
+        files[file.replace(assetsDir, '.')] = readFileHelper(file)
+      }
+
+      const getFiles = () => {
+        return Promise.resolve(Object.keys(files))
+      }
+      const getFileContents = (path: string) => {
+        return Promise.resolve(files[path])
+      }
+
+      addOns.push({
+        ...info,
+        id: dir,
+        packageAdditions,
+        readme,
+        files,
+        deletedFiles: [],
+        getFiles,
+        getFileContents,
+      })
+    }
+  }
+
+  return addOns
+}
+
+export function registerFramework(framework: FrameworkDefinition) {
+  const baseAssetsDirectory = resolve(framework.baseDirectory, 'base')
+
+  const basePackageJSON = JSON.parse(
+    readFileSync(resolve(baseAssetsDirectory, 'package.json'), 'utf8'),
+  )
+  const optionalPackages = JSON.parse(
+    readFileSync(resolve(framework.baseDirectory, 'packages.json'), 'utf8'),
+  )
+
+  const addOns = getAddOns(framework)
+
+  const frameworkWithBundler: Framework = {
+    ...framework,
+    getFiles: () => {
+      const files: Record<string, string> = {}
+      findFilesRecursively(baseAssetsDirectory, files)
+      return Promise.resolve(
+        Object.keys(files).map((path) =>
+          path.replace(baseAssetsDirectory, '.'),
+        ),
+      )
+    },
+    getFileContents: (path: string) => {
+      return Promise.resolve(readFileHelper(resolve(baseAssetsDirectory, path)))
+    },
+    basePackageJSON,
+    optionalPackages,
+    getAddOns: () => addOns,
+  }
+
+  frameworks.push(frameworkWithBundler)
+}
+
+export function getFrameworkById(id: string) {
+  return frameworks.find((framework) => framework.id === id)
+}
+
+export function getFrameworkByName(name: string) {
+  return frameworks.find((framework) => framework.name === name)
+}
+
+export function getFrameworks() {
+  return frameworks
+}

package/src/index.ts

@@ -1 +1,42 @@
-export { cli } from './cli.js'
+export { createApp } from './create-app.js'
+export { addToApp } from './add-to-app.js'
+
+export { finalizeAddOns, getAllAddOns, loadRemoteAddOn } from './add-ons.js'
+export {
+  createMemoryEnvironment,
+  createDefaultEnvironment,
+} from './environment.js'
+export { CODE_ROUTER, CONFIG_FILE, FILE_ROUTER } from './constants.js'
+export {
+  DEFAULT_PACKAGE_MANAGER,
+  SUPPORTED_PACKAGE_MANAGERS,
+  getPackageManager,
+  getPackageManagerInstallCommand,
+  getPackageManagerExecuteCommand,
+  getPackageManagerScriptCommand,
+  packageManagerInstall,
+  packageManagerExecute,
+} from './package-manager.js'
+export {
+  registerFramework,
+  getFrameworkById,
+  getFrameworkByName,
+  getFrameworks,
+} from './frameworks.js'
+export { formatCommand, jsSafeName, sortObject } from './utils.js'
+export { writeConfigFile, readConfigFile } from './config-file.js'
+export { readFileHelper, getBinaryFile, relativePath } from './file-helpers.js'
+
+export type {
+  AddOn,
+  Environment,
+  FileBundleHandler,
+  FrameworkDefinition,
+  Mode,
+  Options,
+  Starter,
+  TemplateOptions,
+  Variable,
+} from './types.js'
+export type { PersistedOptions } from './config-file.js'
+export type { PackageManager } from './package-manager.js'

package/src/integrations/git.ts

@@ -0,0 +1,7 @@
+import { resolve } from 'node:path'
+
+import type { Environment } from '../types.js'
+
+export async function setupGit(environment: Environment, targetDir: string) {
+  await environment.execute('git', ['init'], resolve(targetDir))
+}

package/src/integrations/shadcn.ts

@@ -0,0 +1,44 @@
+import { resolve } from 'node:path'
+import { packageManagerExecute } from '../package-manager.js'
+import type { Environment, Options } from '../types.js'
+
+export async function installShadcnComponents(
+  environment: Environment,
+  targetDir: string,
+  options: Options,
+  silent: boolean,
+) {
+  const s = silent ? null : environment.spinner()
+
+  if (options.chosenAddOns.find((a) => a.id === 'shadcn')) {
+    const shadcnComponents = new Set<string>()
+    for (const addOn of options.chosenAddOns) {
+      if (addOn.shadcnComponents) {
+        for (const component of addOn.shadcnComponents) {
+          shadcnComponents.add(component)
+        }
+      }
+    }
+    if (options.starter) {
+      if (options.starter.shadcnComponents) {
+        for (const component of options.starter.shadcnComponents) {
+          shadcnComponents.add(component)
+        }
+      }
+    }
+
+    if (shadcnComponents.size > 0) {
+      s?.start(
+        `Installing shadcn components (${Array.from(shadcnComponents).join(', ')})...`,
+      )
+      await packageManagerExecute(
+        environment,
+        resolve(targetDir),
+        options.packageManager,
+        'shadcn@latest',
+        ['add', '--silent', '--yes', ...Array.from(shadcnComponents)],
+      )
+      s?.stop(`Installed additional shadcn components`)
+    }
+  }
+}

package/src/package-json.ts

@@ -0,0 +1,62 @@
+import { FILE_ROUTER } from './constants.js'
+import { sortObject } from './utils.js'
+
+import type { Options } from './types.js'
+
+function mergePackageJSON(
+  packageJSON: Record<string, any>,
+  overlayPackageJSON: Record<string, any>,
+) {
+  return {
+    ...packageJSON,
+    dependencies: {
+      ...packageJSON.dependencies,
+      ...overlayPackageJSON.dependencies,
+    },
+    devDependencies: {
+      ...packageJSON.devDependencies,
+      ...overlayPackageJSON.devDependencies,
+    },
+    scripts: {
+      ...packageJSON.scripts,
+      ...overlayPackageJSON.scripts,
+    },
+  }
+}
+
+export function createPackageJSON(options: Options) {
+  let packageJSON = {
+    ...JSON.parse(JSON.stringify(options.framework.basePackageJSON)),
+    name: options.projectName,
+  }
+
+  const additions: Array<Record<string, any> | undefined> = [
+    options.typescript
+      ? options.framework.optionalPackages.typescript
+      : undefined,
+    options.tailwind
+      ? options.framework.optionalPackages.tailwindcss
+      : undefined,
+    options.mode === FILE_ROUTER
+      ? options.framework.optionalPackages['file-router']
+      : undefined,
+  ]
+  for (const addition of additions.filter(Boolean)) {
+    packageJSON = mergePackageJSON(packageJSON, addition!)
+  }
+
+  for (const addOn of options.chosenAddOns.map(
+    (addOn) => addOn.packageAdditions,
+  )) {
+    packageJSON = mergePackageJSON(packageJSON, addOn)
+  }
+
+  packageJSON.dependencies = sortObject(
+    (packageJSON.dependencies ?? {}) as Record<string, string>,
+  )
+  packageJSON.devDependencies = sortObject(
+    (packageJSON.devDependencies ?? {}) as Record<string, string>,
+  )
+
+  return packageJSON
+}

package/src/package-manager.ts

@@ -24,23 +24,94 @@ export function getPackageManager(): PackageManager | undefined {
   return packageManager
 }
 
-export function packageManagerExecute(
-  environment: Environment,
+export function getPackageManagerScriptCommand(
+  packagerManager: PackageManager,
+  args: Array<string> = [],
+) {
+  switch (packagerManager) {
+    case 'yarn':
+      return { command: 'yarn', args: ['run', ...args] }
+    case 'pnpm':
+      return { command: 'pnpm', args: [...args] }
+    case 'bun':
+      return { command: 'bunx', args: ['--bun', 'run', ...args] }
+    case 'deno':
+      return { command: 'deno', args: ['task', ...args] }
+    default:
+      return { command: 'npm', args: ['run', ...args] }
+  }
+}
+
+export function getPackageManagerExecuteCommand(
   packagerManager: PackageManager,
   pkg: string,
-  args: Array<string>,
-  cwd: string,
+  args: Array<string> = [],
 ) {
   switch (packagerManager) {
     case 'yarn':
-      return environment.execute('yarn', ['dlx', pkg, ...args], cwd)
+      return { command: 'yarn', args: ['dlx', pkg, ...args] }
     case 'pnpm':
-      return environment.execute('pnpx', [pkg, ...args], cwd)
+      return { command: 'pnpx', args: [pkg, ...args] }
     case 'bun':
-      return environment.execute('bunx', ['--bun', pkg, ...args], cwd)
+      return { command: 'bunx', args: ['--bun', pkg, ...args] }
     case 'deno':
-      return environment.execute('deno', ['run', `npm:${pkg}`, ...args], cwd)
+      return { command: 'deno', args: ['run', `npm:${pkg}`, ...args] }
     default:
-      return environment.execute('npx', [pkg, ...args], cwd)
+      return { command: 'npx', args: [pkg, ...args] }
   }
 }
+
+export function getPackageManagerInstallCommand(
+  packagerManager: PackageManager,
+  pkg?: string,
+  isDev: boolean = false,
+) {
+  if (pkg) {
+    switch (packagerManager) {
+      case 'yarn':
+      case 'pnpm':
+        return {
+          command: packagerManager,
+          args: ['add', pkg, isDev ? '--dev' : ''],
+        }
+      default:
+        return {
+          command: packagerManager,
+          args: ['install', pkg, isDev ? '-D' : ''],
+        }
+    }
+  } else {
+    return {
+      command: packagerManager,
+      args: ['install'],
+    }
+  }
+}
+
+export function packageManagerInstall(
+  environment: Environment,
+  cwd: string,
+  packagerManager: PackageManager,
+  pkg?: string,
+) {
+  const { command, args: commandArgs } = getPackageManagerInstallCommand(
+    packagerManager,
+    pkg,
+  )
+  return environment.execute(command, commandArgs, cwd)
+}
+
+export function packageManagerExecute(
+  environment: Environment,
+  cwd: string,
+  packagerManager: PackageManager,
+  pkg: string,
+  args: Array<string>,
+) {
+  const { command, args: commandArgs } = getPackageManagerExecuteCommand(
+    packagerManager,
+    pkg,
+    args,
+  )
+  return environment.execute(command, commandArgs, cwd)
+}

package/src/template-file.ts

@@ -0,0 +1,165 @@
+import { resolve } from 'node:path'
+import { render } from 'ejs'
+import { format } from 'prettier'
+
+import { CODE_ROUTER, FILE_ROUTER } from './constants.js'
+import { formatCommand } from './utils.js'
+import {
+  getPackageManagerInstallCommand,
+  getPackageManagerScriptCommand,
+} from './package-manager.js'
+import { relativePath } from './file-helpers.js'
+
+import type { AddOn, Environment, Options } from './types.js'
+
+function convertDotFilesAndPaths(path: string) {
+  return path
+    .split('/')
+    .map((segment) => segment.replace(/^_dot_/, '.'))
+    .join('/')
+}
+
+export function createTemplateFile(
+  environment: Environment,
+  options: Options,
+  targetDir: string,
+) {
+  function getPackageManagerAddScript(
+    packageName: string,
+    isDev: boolean = false,
+  ) {
+    return formatCommand(
+      getPackageManagerInstallCommand(
+        options.packageManager,
+        packageName,
+        isDev,
+      ),
+    )
+  }
+  function getPackageManagerRunScript(
+    scriptName: string,
+    args: Array<string> = [],
+  ) {
+    return formatCommand(
+      getPackageManagerScriptCommand(options.packageManager, [
+        scriptName,
+        ...args,
+      ]),
+    )
+  }
+
+  class IgnoreFileError extends Error {
+    constructor() {
+      super('ignoreFile')
+      this.name = 'IgnoreFileError'
+    }
+  }
+
+  const integrations: Array<Required<AddOn>['integrations'][number]> = []
+  for (const addOn of options.chosenAddOns) {
+    if (addOn.integrations) {
+      for (const integration of addOn.integrations) {
+        integrations.push(integration)
+      }
+    }
+  }
+
+  const routes: Array<Required<AddOn>['routes'][number]> = []
+  for (const addOn of options.chosenAddOns) {
+    if (addOn.routes) {
+      routes.push(...addOn.routes)
+    }
+  }
+
+  const variables = {
+    ...options.variableValues,
+    ...options.chosenAddOns.reduce<Record<string, any>>((acc, addOn) => {
+      return {
+        ...acc,
+        ...addOn.variables,
+      }
+    }, {}),
+  }
+
+  const addOnEnabled = options.chosenAddOns.reduce<Record<string, boolean>>(
+    (acc, addOn) => {
+      acc[addOn.id] = true
+      return acc
+    },
+    {},
+  )
+
+  return async function templateFile(file: string, content: string) {
+    const templateValues = {
+      packageManager: options.packageManager,
+      projectName: options.projectName,
+      typescript: options.typescript,
+      tailwind: options.tailwind,
+      js: options.typescript ? 'ts' : 'js',
+      jsx: options.typescript ? 'tsx' : 'jsx',
+      fileRouter: options.mode === FILE_ROUTER,
+      codeRouter: options.mode === CODE_ROUTER,
+      addOnEnabled,
+      addOns: options.chosenAddOns,
+      integrations,
+      routes,
+      variables,
+
+      getPackageManagerAddScript,
+      getPackageManagerRunScript,
+
+      relativePath: (path: string) => relativePath(file, path),
+
+      ignoreFile: () => {
+        throw new IgnoreFileError()
+      },
+    }
+
+    let ignoreFile = false
+
+    if (file.endsWith('.ejs')) {
+      try {
+        content = render(content, templateValues)
+      } catch (error) {
+        if (error instanceof IgnoreFileError) {
+          ignoreFile = true
+        } else {
+          console.error(file, error)
+          environment.error(`EJS error in file ${file}`, error?.toString())
+          process.exit(1)
+        }
+      }
+    }
+
+    if (ignoreFile) {
+      return
+    }
+
+    let target = convertDotFilesAndPaths(file.replace('.ejs', ''))
+
+    let append = false
+    if (target.endsWith('.append')) {
+      append = true
+      target = target.replace('.append', '')
+    }
+
+    if (target.endsWith('.ts') || target.endsWith('.tsx')) {
+      content = await format(content, {
+        semi: false,
+        singleQuote: true,
+        trailingComma: 'all',
+        parser: 'typescript',
+      })
+    }
+
+    if (!options.typescript) {
+      target = target.replace(/\.tsx$/, '.jsx').replace(/\.ts$/, '.js')
+    }
+
+    if (append) {
+      await environment.appendFile(resolve(targetDir, target), content)
+    } else {
+      await environment.writeFile(resolve(targetDir, target), content)
+    }
+  }
+}