@agility/create-next-app 1.0.0-beta.2

package/src/config/packages/installAgilityPackages.ts

@@ -0,0 +1,63 @@
+import fs from 'fs';
+import path from 'path';
+import { spawn } from 'child_process';
+import ora from 'ora';
+import type { ProjectConfig } from '../../types';
+
+/**
+ * Installs Agility packages
+ */
+export async function installAgilityPackages(projectPath: string, config: ProjectConfig): Promise<void> {
+  const spinner = ora('Installing Agility packages...').start();
+
+  return new Promise((resolve, reject) => {
+    // Determine package manager
+    let packageManager = 'npm';
+    let installCommand = 'install';
+
+    if (fs.existsSync(path.join(projectPath, 'yarn.lock'))) {
+      packageManager = 'yarn';
+      installCommand = 'add';
+    } else if (fs.existsSync(path.join(projectPath, 'pnpm-lock.yaml'))) {
+      packageManager = 'pnpm';
+      installCommand = 'add';
+    } else if (fs.existsSync(path.join(projectPath, 'bun.lockb'))) {
+      packageManager = 'bun';
+      installCommand = 'add';
+    }
+
+    const packages = [
+      '@agility/nextjs@latest',
+      '@agility/content-fetch@latest'
+    ];
+
+    // Install latest versions of @agility/nextjs (v16+) and @agility/content-fetch
+    // @agility/nextjs v16+ supports Next.js 16
+    const installArgs = packageManager === 'npm'
+      ? [installCommand, ...packages]
+      : [installCommand, ...packages];
+
+    const child = spawn(packageManager, installArgs, {
+      stdio: 'inherit',
+      shell: true,
+      cwd: projectPath
+    });
+
+    child.on('error', (error: Error) => {
+      spinner.fail('Failed to install packages');
+      reject(error);
+    });
+
+    child.on('exit', (code: number | null) => {
+      if (code !== 0) {
+        spinner.fail('Failed to install packages');
+        reject(new Error(`Package installation exited with code ${code}`));
+        return;
+      }
+
+      spinner.succeed('Agility packages installed');
+      resolve();
+    });
+  });
+}
+

package/src/config/setupProject.ts

@@ -0,0 +1,31 @@
+import ora from 'ora';
+import type { ProjectConfig } from '../types';
+import { createEnvFile } from './env/createEnvFile';
+import { createMcpConfig } from './mcp/createMcpConfig';
+import { installAgilityPackages } from './packages/installAgilityPackages';
+
+/**
+ * Sets up the project configuration
+ * @param projectPath - Path to the project
+ * @param config - Configuration object
+ */
+export async function setupProject(projectPath: string, config: ProjectConfig): Promise<void> {
+  const spinner = ora('Configuring Agility CMS integration...').start();
+
+  try {
+    // Create .env.local file
+    await createEnvFile(projectPath, config);
+
+    // Create .vscode/mcp.json file
+    await createMcpConfig(projectPath);
+
+    // Install Agility packages
+    await installAgilityPackages(projectPath, config);
+
+    spinner.succeed('Project configured successfully');
+  } catch (error) {
+    spinner.fail('Failed to configure project');
+    throw error;
+  }
+}
+

package/src/create-next-app/createNextApp.ts

@@ -0,0 +1,75 @@
+import { spawn } from 'child_process';
+import path from 'path';
+import chalk from 'chalk';
+import type { CreateNextAppOptions } from '../types';
+
+/**
+ * Creates a Next.js app using create-next-app programmatically
+ * @param projectName - Name of the project
+ * @param options - Options to pass to create-next-app
+ * @returns Path to the created project
+ */
+export async function createNextApp(projectName: string, options: CreateNextAppOptions): Promise<string> {
+  // Show a simple message instead of a spinner to avoid conflicts with create-next-app output
+  console.log(chalk.blue('Setting up your Next.js project...\n'));
+
+  return new Promise((resolve, reject) => {
+    const args: string[] = [];
+
+    // Add project name if provided
+    if (projectName) {
+      args.push(projectName);
+    }
+
+    // Build create-next-app arguments
+    // Use the options provided (from prompts or flags)
+    if (options.typescript) args.push('--ts', '--typescript');
+    if (options.javascript) args.push('--js', '--javascript');
+    if (options.tailwind === true) args.push('--tailwind');
+    if (options.tailwind === false) args.push('--no-tailwind');
+    if (options.eslint === true) args.push('--eslint');
+    if (options.eslint === false) args.push('--no-eslint');
+    if (options.app) args.push('--app');
+    if (options.srcDir) args.push('--src-dir');
+    if (options.importAlias) args.push('--import-alias', options.importAlias);
+    if (options.useNpm) args.push('--use-npm');
+    if (options.usePnpm) args.push('--use-pnpm');
+    if (options.useYarn) args.push('--use-yarn');
+    if (options.useBun) args.push('--use-bun');
+    if (options.skipInstall) args.push('--skip-install');
+
+    // Always use latest version
+    // Use -y flag to auto-confirm package installation
+    const command = 'npx';
+    const createNextAppArgs = ['-y', 'create-next-app@latest', ...args];
+
+    const child = spawn(command, createNextAppArgs, {
+      stdio: 'inherit',
+      shell: true,
+      cwd: process.cwd()
+    });
+
+    child.on('error', (error: Error) => {
+      console.error(chalk.red('Failed to create Next.js app'));
+      reject(new Error(`Failed to create Next.js app: ${error.message}`));
+    });
+
+    child.on('exit', (code: number | null) => {
+      if (code !== 0) {
+        console.error(chalk.red('Failed to create Next.js app'));
+        reject(new Error(`create-next-app exited with code ${code}`));
+        return;
+      }
+
+      console.log(chalk.green('\n✓ Base Next.js project created successfully\n'));
+
+      // Determine project path
+      const projectPath = projectName
+        ? path.resolve(process.cwd(), projectName)
+        : path.resolve(process.cwd(), 'my-app');
+
+      resolve(projectPath);
+    });
+  });
+}
+

package/src/create-next-app/index.ts

@@ -0,0 +1,3 @@
+export { createNextApp } from './createNextApp';
+export { createNextApp as default } from './createNextApp';
+

package/src/scaffold/components/createPageComponents.ts

@@ -0,0 +1,74 @@
+import chalk from 'chalk';
+import type { ApiKeys } from '../../types';
+
+/**
+ * Creates basic page components
+ */
+export async function createPageComponents(instanceGuid: string, apiKeys: ApiKeys | null): Promise<void> {
+  interface Field {
+    type: string;
+    name: string;
+    label: string;
+    required?: boolean;
+  }
+
+  interface Component {
+    displayName: string;
+    referenceName: string;
+    description: string;
+    fields: Field[];
+  }
+
+  const components: Component[] = [
+    {
+      displayName: 'Hero',
+      referenceName: 'Hero',
+      description: 'Hero section component',
+      fields: [
+        { type: 'Text', name: 'headline', label: 'Headline', required: true },
+        { type: 'LongText', name: 'subheadline', label: 'Subheadline' },
+        { type: 'ImageAttachment', name: 'backgroundImage', label: 'Background Image' },
+        { type: 'Link', name: 'ctaLink', label: 'CTA Link' }
+      ]
+    },
+    {
+      displayName: 'RichTextArea',
+      referenceName: 'RichTextArea',
+      description: 'Rich text content component',
+      fields: [
+        { type: 'Html', name: 'content', label: 'Content', required: true }
+      ]
+    },
+    {
+      displayName: 'TextBlock',
+      referenceName: 'TextBlock',
+      description: 'Simple text block component',
+      fields: [
+        { type: 'Text', name: 'title', label: 'Title' },
+        { type: 'LongText', name: 'content', label: 'Content', required: true }
+      ]
+    },
+    {
+      displayName: 'Image',
+      referenceName: 'Image',
+      description: 'Image component',
+      fields: [
+        { type: 'ImageAttachment', name: 'image', label: 'Image', required: true },
+        { type: 'Text', name: 'altText', label: 'Alt Text' },
+        { type: 'Text', name: 'caption', label: 'Caption' }
+      ]
+    }
+  ];
+
+  // In a real implementation, this would use the MCP tool:
+  // for (const component of components) {
+  //   await mcp_Agility_CMS_save_component_model({ instanceGuid, model: component });
+  // }
+
+  console.log(chalk.cyan('\n🧩 Page components to create:'));
+  components.forEach(component => {
+    console.log(chalk.white(`  - ${component.displayName} (${component.referenceName})`));
+  });
+  console.log(chalk.yellow('\n⚠️  Please create these components in Agility CMS manually, or use the API.'));
+}
+

package/src/scaffold/containers/createContainers.ts

@@ -0,0 +1,55 @@
+import chalk from 'chalk';
+import type { ApiKeys } from '../../types';
+
+/**
+ * Creates containers for content
+ */
+export async function createContainers(instanceGuid: string, apiKeys: ApiKeys | null): Promise<void> {
+  interface Container {
+    displayName: string;
+    referenceName: string;
+    modelTypeID: number;
+    isShared: boolean;
+    isDynamicPageList: boolean;
+    modelID: number | null;
+  }
+
+  const containers: Container[] = [
+    {
+      displayName: 'Pages',
+      referenceName: 'pages',
+      modelTypeID: 0, // Single item
+      isShared: false,
+      isDynamicPageList: true,
+      modelID: null // Would be set after creating Page model
+    },
+    {
+      displayName: 'Posts',
+      referenceName: 'posts',
+      modelTypeID: 1, // List
+      isShared: true,
+      isDynamicPageList: false,
+      modelID: null // Would be set after creating Post model
+    },
+    {
+      displayName: 'Categories',
+      referenceName: 'categories',
+      modelTypeID: 1, // List
+      isShared: true,
+      isDynamicPageList: false,
+      modelID: null // Would be set after creating Category model
+    }
+  ];
+
+  // In a real implementation, this would use the MCP tool:
+  // for (const container of containers) {
+  //   await mcp_Agility_CMS_save_container({ instanceGuid, container });
+  // }
+
+  console.log(chalk.cyan('\n📦 Containers to create:'));
+  containers.forEach(container => {
+    console.log(chalk.white(`  - ${container.displayName} (${container.referenceName})`));
+  });
+  console.log(chalk.yellow('\n⚠️  Please create these containers in Agility CMS manually, or use the API.'));
+}
+

package/src/scaffold/index.ts

@@ -0,0 +1,2 @@
+export { createBlankInstance } from './instance/createBlankInstance';
+

package/src/scaffold/instance/createBlankInstance.ts

@@ -0,0 +1,55 @@
+import ora from 'ora';
+import chalk from 'chalk';
+import inquirer from 'inquirer';
+import type { ApiKeys } from '../../types';
+import { createContentModels } from '../models/createContentModels';
+import { createPageComponents } from '../components/createPageComponents';
+import { createContainers } from '../containers/createContainers';
+
+/**
+ * Creates a blank Agility instance with basic content models and components
+ * @param instanceGuid - Instance GUID
+ * @param apiKeys - API keys object
+ */
+export async function createBlankInstance(instanceGuid: string, apiKeys: ApiKeys | null): Promise<void> {
+  const spinner = ora('Scaffolding blank Agility instance...').start();
+
+  try {
+    // Ask user if they want to scaffold
+    const answer = await inquirer.prompt<{ scaffold: boolean }>([
+      {
+        type: 'confirm',
+        name: 'scaffold',
+        message: 'Would you like to scaffold a blank instance with basic content models and components?',
+        default: true
+      }
+    ]);
+
+    if (!answer.scaffold) {
+      spinner.info('Skipping instance scaffolding');
+      return;
+    }
+
+    spinner.text = 'Creating content models...';
+
+    // Create content models
+    await createContentModels(instanceGuid, apiKeys);
+
+    spinner.text = 'Creating page components...';
+
+    // Create page components
+    await createPageComponents(instanceGuid, apiKeys);
+
+    spinner.text = 'Creating containers...';
+
+    // Create containers
+    await createContainers(instanceGuid, apiKeys);
+
+    spinner.succeed('Blank instance scaffolded successfully');
+  } catch (error) {
+    spinner.fail('Failed to scaffold instance');
+    console.error(chalk.red((error as Error).message));
+    // Don't throw - allow project creation to continue
+  }
+}
+

package/src/scaffold/models/createContentModels.ts

@@ -0,0 +1,83 @@
+import chalk from 'chalk';
+import type { ApiKeys } from '../../types';
+
+/**
+ * Creates basic content models
+ */
+export async function createContentModels(instanceGuid: string, apiKeys: ApiKeys | null): Promise<void> {
+  // Note: This would use the MCP Agility CMS tools or direct API calls
+  // For now, we'll provide instructions to the user
+
+  interface Field {
+    type: string;
+    name: string;
+    label: string;
+    required?: boolean;
+  }
+
+  interface Model {
+    displayName: string;
+    referenceName: string;
+    description: string;
+    fields: Field[];
+  }
+
+  const models: Model[] = [
+    {
+      displayName: 'Page',
+      referenceName: 'Page',
+      description: 'Page content model with SEO fields',
+      fields: [
+        { type: 'Text', name: 'title', label: 'Title', required: true },
+        { type: 'LongText', name: 'description', label: 'Description' },
+        { type: 'Html', name: 'content', label: 'Content' },
+        { type: 'Text', name: 'seoTitle', label: 'SEO Title' },
+        { type: 'LongText', name: 'seoDescription', label: 'SEO Description' },
+        { type: 'Text', name: 'seoKeywords', label: 'SEO Keywords' }
+      ]
+    },
+    {
+      displayName: 'Post',
+      referenceName: 'Post',
+      description: 'Blog post content model',
+      fields: [
+        { type: 'Text', name: 'title', label: 'Title', required: true },
+        { type: 'LongText', name: 'excerpt', label: 'Excerpt' },
+        { type: 'Html', name: 'content', label: 'Content' },
+        { type: 'Date', name: 'publishDate', label: 'Publish Date' },
+        { type: 'ImageAttachment', name: 'featuredImage', label: 'Featured Image' }
+      ]
+    },
+    {
+      displayName: 'Category',
+      referenceName: 'Category',
+      description: 'Category content model',
+      fields: [
+        { type: 'Text', name: 'title', label: 'Title', required: true },
+        { type: 'LongText', name: 'description', label: 'Description' }
+      ]
+    },
+    {
+      displayName: 'Author',
+      referenceName: 'Author',
+      description: 'Author content model',
+      fields: [
+        { type: 'Text', name: 'name', label: 'Name', required: true },
+        { type: 'LongText', name: 'bio', label: 'Bio' },
+        { type: 'ImageAttachment', name: 'avatar', label: 'Avatar' }
+      ]
+    }
+  ];
+
+  // In a real implementation, this would use the MCP tool:
+  // for (const model of models) {
+  //   await mcp_Agility_CMS_save_content_model({ instanceGuid, model });
+  // }
+
+  console.log(chalk.cyan('\n📋 Content models to create:'));
+  models.forEach(model => {
+    console.log(chalk.white(`  - ${model.displayName} (${model.referenceName})`));
+  });
+  console.log(chalk.yellow('\n⚠️  Please create these content models in Agility CMS manually, or use the API.'));
+}
+

package/src/templates/copyDirectory.ts

@@ -0,0 +1,24 @@
+import fs from 'fs';
+import path from 'path';
+
+/**
+ * Recursively copies a directory
+ */
+export async function copyDirectory(src: string, dest: string): Promise<void> {
+  const entries = fs.readdirSync(src, { withFileTypes: true });
+
+  for (const entry of entries) {
+    const srcPath = path.join(src, entry.name);
+    const destPath = path.join(dest, entry.name);
+
+    if (entry.isDirectory()) {
+      if (!fs.existsSync(destPath)) {
+        fs.mkdirSync(destPath, { recursive: true });
+      }
+      await copyDirectory(srcPath, destPath);
+    } else {
+      fs.copyFileSync(srcPath, destPath);
+    }
+  }
+}
+

package/src/templates/copyTemplates.ts

@@ -0,0 +1,57 @@
+import fs from 'fs';
+import path from 'path';
+import ora from 'ora';
+import type { CliOptions } from '../types';
+import { copyDirectory } from './copyDirectory';
+
+/**
+ * Copies template files to the project
+ * @param projectPath - Path to the project
+ * @param options - Options
+ */
+export async function copyTemplates(projectPath: string, options: CliOptions): Promise<void> {
+  const spinner = ora('Adding Agility CMS template files...').start();
+
+  try {
+    const templatesDir = path.join(__dirname, '..', '..', 'templates');
+    const srcDir = path.join(projectPath, 'src');
+
+    // Ensure src directory exists
+    if (!fs.existsSync(srcDir)) {
+      fs.mkdirSync(srcDir, { recursive: true });
+    }
+
+    // Copy all template files to src directory, except .claude
+    const entries = fs.readdirSync(templatesDir, { withFileTypes: true });
+
+    for (const entry of entries) {
+      const srcPath = path.join(templatesDir, entry.name);
+
+      // .claude folder should be copied to project root, not src
+      if (entry.name === '.claude') {
+        const destPath = path.join(projectPath, '.claude');
+        if (!fs.existsSync(destPath)) {
+          fs.mkdirSync(destPath, { recursive: true });
+        }
+        await copyDirectory(srcPath, destPath);
+      } else {
+        // All other files go to src directory
+        const destPath = path.join(srcDir, entry.name);
+        if (entry.isDirectory()) {
+          if (!fs.existsSync(destPath)) {
+            fs.mkdirSync(destPath, { recursive: true });
+          }
+          await copyDirectory(srcPath, destPath);
+        } else {
+          fs.copyFileSync(srcPath, destPath);
+        }
+      }
+    }
+
+    spinner.succeed('Template files copied');
+  } catch (error) {
+    spinner.fail('Failed to copy template files');
+    throw error;
+  }
+}
+

package/src/templates/index.ts

@@ -0,0 +1,2 @@
+export { copyTemplates } from './copyTemplates';
+

package/src/types/index.ts

@@ -0,0 +1,55 @@
+export interface Instance {
+  name: string;
+  guid: string;
+  org?: string;
+}
+
+export interface ApiKeys {
+  fetchKey: string;
+  previewKey: string;
+  securityKey: string;
+}
+
+export interface InstanceData {
+  guid: string;
+  name: string;
+  apiKeys: ApiKeys;
+}
+
+export interface CliOptions {
+  typescript?: boolean;
+  javascript?: boolean;
+  tailwind?: boolean;
+  eslint?: boolean;
+  app?: boolean;
+  srcDir?: boolean;
+  importAlias?: string;
+  useNpm?: boolean;
+  usePnpm?: boolean;
+  useYarn?: boolean;
+  useBun?: boolean;
+  skipInstall?: boolean;
+  [key: string]: unknown;
+}
+
+export interface ProjectConfig {
+  instanceGuid?: string;
+  apiKeys?: ApiKeys | null;
+  [key: string]: unknown;
+}
+
+export interface CreateNextAppOptions {
+  typescript?: boolean;
+  javascript?: boolean;
+  tailwind?: boolean;
+  eslint?: boolean;
+  app?: boolean;
+  srcDir?: boolean;
+  importAlias?: string;
+  useNpm?: boolean;
+  usePnpm?: boolean;
+  useYarn?: boolean;
+  useBun?: boolean;
+  skipInstall?: boolean;
+}
+

package/src/utils/git.ts

@@ -0,0 +1,74 @@
+import { spawn } from 'child_process';
+import chalk from 'chalk';
+import ora from 'ora';
+
+/**
+ * Initialize a git repository
+ */
+export async function initializeGit(projectPath: string): Promise<boolean> {
+  const spinner = ora('Initializing git repository...').start();
+
+  try {
+    // Initialize git
+    await runGitCommand(['init'], projectPath);
+
+    // Add all files
+    await runGitCommand(['add', '.'], projectPath);
+
+    // Create initial commit
+    await runGitCommand(
+      ['commit', '-m', 'Initial commit from create-next-agility-app'],
+      projectPath
+    );
+
+    spinner.succeed('Git repository initialized');
+    return true;
+  } catch (error) {
+    spinner.fail('Failed to initialize git repository');
+    console.log(chalk.yellow('  You can initialize git manually later with: git init'));
+    return false;
+  }
+}
+
+/**
+ * Run a git command
+ */
+function runGitCommand(args: string[], cwd: string): Promise<void> {
+  return new Promise((resolve, reject) => {
+    const child = spawn('git', args, {
+      cwd,
+      stdio: 'pipe',
+    });
+
+    let stderr = '';
+
+    child.stderr?.on('data', (data) => {
+      stderr += data.toString();
+    });
+
+    child.on('error', (error) => {
+      reject(error);
+    });
+
+    child.on('exit', (code) => {
+      if (code !== 0) {
+        reject(new Error(stderr || `Git command failed with code ${code}`));
+      } else {
+        resolve();
+      }
+    });
+  });
+}
+
+/**
+ * Check if git is available
+ */
+export function isGitAvailable(): boolean {
+  try {
+    const { execSync } = require('child_process');
+    execSync('git --version', { stdio: 'ignore' });
+    return true;
+  } catch {
+    return false;
+  }
+}