@djangocfg/nextjs 1.0.6 → 2.1.1

package/src/config/packages/updater.ts

@@ -0,0 +1,469 @@
+/**
+ * Package Updater
+ *
+ * Checks for outdated @djangocfg/* packages and offers to update them.
+ */
+
+import { spawn } from 'child_process';
+import { createInterface } from 'readline';
+import { createRequire } from 'module';
+import { join } from 'path';
+import chalk from 'chalk';
+import consola from 'consola';
+import Conf from 'conf';
+import semver from 'semver';
+import { DJANGOCFG_PACKAGES, PACKAGE_NAME } from '../constants';
+import { isCI } from '../utils/env';
+import { detectPackageManager } from './installer';
+
+// Updater preferences cache
+const updaterCache = new Conf<{
+  autoUpdate?: boolean;
+  lastCheck?: number;
+  skippedVersions?: Record<string, string>;
+}>({
+  projectName: 'djangocfg-nextjs-updater',
+  projectVersion: '1.0.0',
+});
+
+// Check for updates once per hour
+const UPDATE_CHECK_COOLDOWN_MS = 60 * 60 * 1000;
+
+// Spinner frames
+const SPINNER_FRAMES = ['⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧', '⠇', '⠏'];
+
+export interface PackageVersion {
+  name: string;
+  current: string | null;
+  latest: string | null;
+  hasUpdate: boolean;
+}
+
+export interface UpdateOptions {
+  /** Auto-update without prompting */
+  autoUpdate?: boolean;
+  /** Force check even if recently checked (ignores cooldown) */
+  force?: boolean;
+  /** Force check even for workspace:* packages (for testing) */
+  forceCheckWorkspace?: boolean;
+}
+
+/**
+ * Check if package is a workspace dependency
+ */
+function isWorkspacePackage(packageName: string): boolean {
+  try {
+    const fs = require('fs');
+    const pkgJsonPath = join(process.cwd(), 'package.json');
+    const pkgJson = JSON.parse(fs.readFileSync(pkgJsonPath, 'utf-8'));
+
+    const deps = { ...pkgJson.dependencies, ...pkgJson.devDependencies };
+    const version = deps[packageName];
+
+    return version?.startsWith('workspace:') || false;
+  } catch {
+    return false;
+  }
+}
+
+/**
+ * Get installed version of a package from consumer's project
+ * Uses multiple fallback strategies for monorepo compatibility
+ */
+export function getInstalledVersion(packageName: string): string | null {
+  const fs = require('fs');
+  const cwd = process.cwd();
+
+  // Strategy 1: Direct read from node_modules (works with symlinks)
+  try {
+    const directPath = join(cwd, 'node_modules', packageName, 'package.json');
+    if (fs.existsSync(directPath)) {
+      const pkg = JSON.parse(fs.readFileSync(directPath, 'utf-8'));
+      return pkg.version || null;
+    }
+  } catch {
+    // Continue to next strategy
+  }
+
+  // Strategy 2: Use createRequire from cwd
+  try {
+    const consumerRequire = createRequire(join(cwd, 'package.json'));
+    const pkgPath = consumerRequire.resolve(`${packageName}/package.json`);
+    const pkg = require(pkgPath);
+    return pkg.version || null;
+  } catch {
+    // Continue to next strategy
+  }
+
+  // Strategy 3: Try global require
+  try {
+    const pkgPath = require.resolve(`${packageName}/package.json`);
+    const pkg = require(pkgPath);
+    return pkg.version || null;
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * Check if we should skip update checking for this package
+ * (e.g., workspace packages shouldn't be checked against npm)
+ */
+export function shouldCheckUpdates(packageName: string): boolean {
+  return !isWorkspacePackage(packageName);
+}
+
+/**
+ * Fetch latest version from npm registry
+ */
+async function fetchLatestVersion(packageName: string): Promise<string | null> {
+  try {
+    const https = await import('https');
+    return new Promise((resolve) => {
+      const req = https.get(
+        `https://registry.npmjs.org/${packageName}/latest`,
+        { timeout: 5000 },
+        (res: any) => {
+          let data = '';
+          res.on('data', (chunk: string) => { data += chunk; });
+          res.on('end', () => {
+            try {
+              const json = JSON.parse(data);
+              resolve(json.version || null);
+            } catch {
+              resolve(null);
+            }
+          });
+        }
+      );
+      req.on('error', () => resolve(null));
+      req.on('timeout', () => { req.destroy(); resolve(null); });
+    });
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * Check all @djangocfg packages for updates
+ * All packages are aligned to the version of @djangocfg/nextjs (master package)
+ * Skips workspace:* packages unless forceCheckWorkspace is true
+ */
+export async function checkForUpdates(options: { forceCheckWorkspace?: boolean } = {}): Promise<PackageVersion[]> {
+  const results: PackageVersion[] = [];
+
+  // First, get the latest version of master package (@djangocfg/nextjs)
+  // All other packages should align to this version
+  const masterLatest = await fetchLatestVersion(PACKAGE_NAME);
+  if (!masterLatest) {
+    // Can't determine target version, skip update check
+    return results;
+  }
+
+  // Check packages against master version
+  const checks = DJANGOCFG_PACKAGES.map(async (name) => {
+    // Skip workspace packages unless force mode
+    const isWorkspace = !shouldCheckUpdates(name);
+    if (!options.forceCheckWorkspace && isWorkspace) {
+      return null;
+    }
+
+    const current = getInstalledVersion(name);
+    if (!current) {
+      return null;
+    }
+
+    // All packages should update to master package version
+    const hasUpdate = !!(masterLatest && current && semver.gt(masterLatest, current));
+
+    return { name, current, latest: masterLatest, hasUpdate };
+  });
+
+  const checkResults = await Promise.all(checks);
+
+  for (const result of checkResults) {
+    if (result) {
+      results.push(result);
+    }
+  }
+
+  return results;
+}
+
+/**
+ * Get packages that need updating
+ */
+export async function getOutdatedPackages(options: { forceCheckWorkspace?: boolean } = {}): Promise<PackageVersion[]> {
+  const all = await checkForUpdates(options);
+  const skipped = updaterCache.get('skippedVersions') || {};
+
+  return all.filter(pkg => {
+    if (!pkg.hasUpdate) return false;
+    // Skip if user chose to skip this specific version
+    if (skipped[pkg.name] === pkg.latest) return false;
+    return true;
+  });
+}
+
+/**
+ * Create a simple spinner
+ */
+function createSpinner(text: string) {
+  let frameIndex = 0;
+  let interval: NodeJS.Timeout | null = null;
+  let currentText = text;
+
+  const render = () => {
+    const frame = SPINNER_FRAMES[frameIndex];
+    process.stdout.write(`\r${chalk.cyan(frame)} ${currentText}`);
+    frameIndex = (frameIndex + 1) % SPINNER_FRAMES.length;
+  };
+
+  return {
+    start() {
+      if (process.stdout.isTTY) {
+        interval = setInterval(render, 80);
+        render();
+      } else {
+        console.log(`  ${currentText}`);
+      }
+      return this;
+    },
+    text(newText: string) {
+      currentText = newText;
+      return this;
+    },
+    succeed(text?: string) {
+      if (interval) clearInterval(interval);
+      if (process.stdout.isTTY) {
+        process.stdout.write(`\r${chalk.green('✓')} ${text || currentText}\n`);
+      } else {
+        console.log(`  ${chalk.green('✓')} ${text || currentText}`);
+      }
+      return this;
+    },
+    fail(text?: string) {
+      if (interval) clearInterval(interval);
+      if (process.stdout.isTTY) {
+        process.stdout.write(`\r${chalk.red('✗')} ${text || currentText}\n`);
+      } else {
+        console.log(`  ${chalk.red('✗')} ${text || currentText}`);
+      }
+      return this;
+    },
+    stop() {
+      if (interval) clearInterval(interval);
+      if (process.stdout.isTTY) {
+        process.stdout.write('\r\x1b[K');
+      }
+      return this;
+    },
+  };
+}
+
+/**
+ * Ask user for confirmation
+ */
+async function askConfirmation(question: string): Promise<boolean> {
+  if (isCI || !process.stdin.isTTY) {
+    return false;
+  }
+
+  return new Promise((resolve) => {
+    const rl = createInterface({
+      input: process.stdin,
+      output: process.stdout,
+    });
+
+    rl.question(question, (answer) => {
+      rl.close();
+      const normalized = answer.toLowerCase().trim();
+      resolve(normalized === '' || normalized === 'y' || normalized === 'yes');
+    });
+  });
+}
+
+/**
+ * Update a single package with progress
+ */
+async function updateSinglePackage(
+  pkg: PackageVersion,
+  pm: 'pnpm' | 'yarn' | 'npm',
+  index: number,
+  total: number
+): Promise<boolean> {
+  const progress = `[${index + 1}/${total}]`;
+  const versionInfo = `${chalk.red(pkg.current)} → ${chalk.green(pkg.latest)}`;
+  const spinner = createSpinner(
+    `${chalk.dim(progress)} Updating ${chalk.cyan(pkg.name)} ${versionInfo}`
+  );
+
+  spinner.start();
+
+  const command = pm === 'pnpm'
+    ? `pnpm add ${pkg.name}@${pkg.latest}`
+    : pm === 'yarn'
+    ? `yarn add ${pkg.name}@${pkg.latest}`
+    : `npm install ${pkg.name}@${pkg.latest}`;
+
+  return new Promise((resolve) => {
+    const proc = spawn(command, {
+      shell: true,
+      cwd: process.cwd(),
+      stdio: ['ignore', 'pipe', 'pipe'],
+    });
+
+    proc.on('close', (code) => {
+      if (code === 0) {
+        spinner.succeed(
+          `${chalk.dim(progress)} ${chalk.cyan(pkg.name)} ${chalk.green(pkg.latest!)}`
+        );
+        resolve(true);
+      } else {
+        spinner.fail(
+          `${chalk.dim(progress)} ${chalk.cyan(pkg.name)} ${chalk.red('failed')}`
+        );
+        resolve(false);
+      }
+    });
+
+    proc.on('error', () => {
+      spinner.fail(`${chalk.dim(progress)} ${chalk.cyan(pkg.name)} ${chalk.red('failed')}`);
+      resolve(false);
+    });
+  });
+}
+
+/**
+ * Update packages with progress
+ */
+export async function updatePackagesWithProgress(packages: PackageVersion[]): Promise<boolean> {
+  if (packages.length === 0) return true;
+
+  const pm = detectPackageManager();
+  const total = packages.length;
+
+  console.log('');
+  console.log(chalk.bold(`  Updating ${total} package${total > 1 ? 's' : ''}...`));
+  console.log('');
+
+  let successCount = 0;
+  const failedPackages: string[] = [];
+
+  for (let i = 0; i < packages.length; i++) {
+    const success = await updateSinglePackage(packages[i], pm, i, total);
+    if (success) {
+      successCount++;
+    } else {
+      failedPackages.push(packages[i].name);
+    }
+  }
+
+  console.log('');
+
+  if (failedPackages.length === 0) {
+    consola.success(`All ${total} packages updated successfully!`);
+    return true;
+  } else if (successCount > 0) {
+    consola.warn(`${successCount}/${total} packages updated. Failed: ${failedPackages.join(', ')}`);
+    return false;
+  } else {
+    consola.error(`Failed to update packages: ${failedPackages.join(', ')}`);
+    return false;
+  }
+}
+
+/**
+ * Check and prompt for package updates
+ */
+export async function checkAndUpdatePackages(options: UpdateOptions = {}): Promise<boolean> {
+  // Check cooldown
+  const lastCheck = updaterCache.get('lastCheck') || 0;
+  if (!options.force && (Date.now() - lastCheck) < UPDATE_CHECK_COOLDOWN_MS) {
+    return true;
+  }
+
+  updaterCache.set('lastCheck', Date.now());
+
+  // Check for updates
+  const spinner = createSpinner('Checking for updates...');
+  spinner.start();
+
+  const outdated = await getOutdatedPackages({
+    forceCheckWorkspace: options.forceCheckWorkspace,
+  });
+
+  spinner.stop();
+
+  console.log(chalk.dim(`  Found ${outdated.length} outdated package(s)`));
+
+  if (outdated.length === 0) {
+    console.log(chalk.green('  ✓ All packages are up to date'));
+    return true;
+  }
+
+  // Auto-update if configured
+  if (options.autoUpdate || updaterCache.get('autoUpdate')) {
+    return updatePackagesWithProgress(outdated);
+  }
+
+  // Show outdated packages
+  console.log('');
+  consola.box('📦 Updates Available');
+  console.log('');
+
+  for (const pkg of outdated) {
+    console.log(
+      `  ${chalk.yellow('•')} ${chalk.bold(pkg.name)}  ` +
+      `${chalk.red(pkg.current)} → ${chalk.green(pkg.latest)}`
+    );
+  }
+  console.log('');
+
+  // Ask for confirmation
+  const shouldUpdate = await askConfirmation(
+    `${chalk.green('?')} Update these packages now? ${chalk.dim('[Y/n]')} `
+  );
+
+  if (shouldUpdate) {
+    const success = await updatePackagesWithProgress(outdated);
+
+    if (success) {
+      const enableAuto = await askConfirmation(
+        `${chalk.green('?')} Enable auto-update for future? ${chalk.dim('[y/N]')} `
+      );
+      if (enableAuto) {
+        updaterCache.set('autoUpdate', true);
+        consola.info('Auto-update enabled.');
+      }
+    }
+
+    return success;
+  }
+
+  // User declined, ask if they want to skip these versions
+  const skipVersions = await askConfirmation(
+    `${chalk.green('?')} Skip these versions in future? ${chalk.dim('[y/N]')} `
+  );
+
+  if (skipVersions) {
+    const skipped = updaterCache.get('skippedVersions') || {};
+    for (const pkg of outdated) {
+      if (pkg.latest) {
+        skipped[pkg.name] = pkg.latest;
+      }
+    }
+    updaterCache.set('skippedVersions', skipped);
+    consola.info('Versions skipped. Will prompt again for newer versions.');
+  }
+
+  return false;
+}
+
+/**
+ * Reset updater preferences
+ */
+export function resetUpdaterPreferences(): void {
+  updaterCache.clear();
+  consola.success('Updater preferences reset');
+}

package/src/config/plugins/compression.ts

@@ -0,0 +1,97 @@
+/**
+ * Compression Plugin Setup
+ *
+ * Adds Gzip and Brotli compression for static builds.
+ */
+
+import type { Configuration as WebpackConfig } from 'webpack';
+import { isPackageInstalled } from '../packages/checker';
+
+export interface CompressionPluginOptions {
+  /** Enable gzip compression */
+  gzip?: boolean;
+  /** Enable brotli compression */
+  brotli?: boolean;
+  /** Minimum file size to compress (default: 8192) */
+  threshold?: number;
+  /** Minimum compression ratio (default: 0.8) */
+  minRatio?: number;
+  /** Brotli compression level (default: 8) */
+  brotliLevel?: number;
+}
+
+const DEFAULT_OPTIONS: Required<CompressionPluginOptions> = {
+  gzip: true,
+  brotli: true,
+  threshold: 8192,
+  minRatio: 0.8,
+  brotliLevel: 8,
+};
+
+/**
+ * Add compression plugins to webpack config
+ *
+ * Returns true if plugins were added, false if compression-webpack-plugin is not installed
+ */
+export function addCompressionPlugins(
+  config: WebpackConfig,
+  options: CompressionPluginOptions = {}
+): boolean {
+  // Check if compression-webpack-plugin is installed
+  if (!isPackageInstalled('compression-webpack-plugin')) {
+    return false;
+  }
+
+  const opts = { ...DEFAULT_OPTIONS, ...options };
+
+  try {
+    // Dynamic import to avoid bundling if not installed
+    // eslint-disable-next-line @typescript-eslint/no-require-imports
+    const CompressionPlugin = require('compression-webpack-plugin');
+
+    if (!config.plugins) {
+      config.plugins = [];
+    }
+
+    // Gzip compression
+    if (opts.gzip) {
+      config.plugins.push(
+        new CompressionPlugin({
+          filename: '[path][base].gz',
+          algorithm: 'gzip',
+          test: /\.(js|css|html|svg|json)$/,
+          threshold: opts.threshold,
+          minRatio: opts.minRatio,
+        })
+      );
+    }
+
+    // Brotli compression
+    if (opts.brotli) {
+      config.plugins.push(
+        new CompressionPlugin({
+          filename: '[path][base].br',
+          algorithm: 'brotliCompress',
+          test: /\.(js|css|html|svg|json)$/,
+          threshold: opts.threshold,
+          minRatio: opts.minRatio,
+          compressionOptions: {
+            level: opts.brotliLevel,
+          },
+        })
+      );
+    }
+
+    return true;
+  } catch (error) {
+    // compression-webpack-plugin failed to load
+    return false;
+  }
+}
+
+/**
+ * Check if compression is available
+ */
+export function isCompressionAvailable(): boolean {
+  return isPackageInstalled('compression-webpack-plugin');
+}

package/src/config/plugins/devStartup.ts

@@ -0,0 +1,123 @@
+/**
+ * Dev Startup Webpack Plugin
+ *
+ * Handles banner display, version checking, package updates, and browser auto-open.
+ */
+
+import type { Compiler } from 'webpack';
+import chalk from 'chalk';
+import { DJANGO_CFG_BANNER } from '../constants';
+import { getCurrentVersion } from '../utils/version';
+import { checkAndInstallPackages } from '../packages/installer';
+import { checkAndUpdatePackages } from '../packages/updater';
+
+// Track if startup tasks were already run (persists across HMR)
+let startupDone = false;
+let browserOpened = false;
+
+export interface DevStartupPluginOptions {
+  /** Auto-open browser */
+  openBrowser?: boolean;
+  /** Check for missing optional packages (default: true) */
+  checkPackages?: boolean;
+  /** Auto-install missing packages without prompting */
+  autoInstall?: boolean;
+  /** Check for @djangocfg/* package updates (default: true) */
+  checkUpdates?: boolean;
+  /** Auto-update packages without prompting */
+  autoUpdate?: boolean;
+  /** Force check workspace:* packages (for testing in monorepo) */
+  forceCheckWorkspace?: boolean;
+}
+
+/**
+ * Webpack plugin for dev startup tasks
+ */
+export class DevStartupPlugin {
+  private options: DevStartupPluginOptions;
+
+  constructor(options: DevStartupPluginOptions = {}) {
+    this.options = options;
+  }
+
+  apply(compiler: Compiler): void {
+    // Use tapPromise for proper async handling
+    compiler.hooks.done.tapPromise('DevStartupPlugin', async () => {
+      // Run startup tasks only once
+      if (!startupDone) {
+        startupDone = true;
+        await this.runStartupTasks();
+      }
+
+      // Auto-open browser if enabled
+      if (this.options.openBrowser && !browserOpened) {
+        browserOpened = true;
+        this.openBrowser();
+      }
+    });
+  }
+
+  private async runStartupTasks(): Promise<void> {
+    // 1. Print banner
+    console.log('\n' + chalk.yellowBright.bold(DJANGO_CFG_BANNER));
+
+    // 2. Print current version
+    const version = getCurrentVersion();
+    if (version) {
+      console.log(chalk.dim(`  📦 @djangocfg/nextjs v${version}\n`));
+    }
+
+    // 3. Check for package updates
+    if (this.options.checkUpdates !== false) {
+      try {
+        await checkAndUpdatePackages({
+          autoUpdate: this.options.autoUpdate,
+          forceCheckWorkspace: this.options.forceCheckWorkspace,
+          force: true, // Force check ignoring cooldown
+        });
+      } catch (err) {
+        console.log(chalk.red('  Update check failed:'), err);
+      }
+    }
+
+    // 4. Check for missing optional packages
+    if (this.options.checkPackages !== false) {
+      await checkAndInstallPackages({
+        autoInstall: this.options.autoInstall,
+      });
+    }
+  }
+
+  private openBrowser(): void {
+    // Delay to ensure server is ready
+    setTimeout(async () => {
+      try {
+        const { exec } = await import('child_process');
+        const port = process.env.PORT || '3000';
+        const url = `http://localhost:${port}`;
+
+        const command = process.platform === 'darwin'
+          ? 'open'
+          : process.platform === 'win32'
+          ? 'start'
+          : 'xdg-open';
+
+        exec(`${command} ${url}`, (error) => {
+          if (error) {
+            console.warn(`Failed to open browser: ${error.message}`);
+          }
+        });
+      } catch (error) {
+        console.warn('Failed to open browser');
+      }
+    }, 2000);
+  }
+}
+
+/**
+ * Reset plugin state (useful for tests)
+ */
+export function resetDevStartupState(): void {
+  startupDone = false;
+  browserOpened = false;
+}

package/src/config/plugins/index.ts

@@ -0,0 +1,6 @@
+/**
+ * Plugins module exports
+ */
+
+export { DevStartupPlugin, resetDevStartupState, type DevStartupPluginOptions } from './devStartup';
+export { addCompressionPlugins, isCompressionAvailable, type CompressionPluginOptions } from './compression';