@linktr.ee/linkapp 0.0.22 → 0.0.23

package/dist/commands/dev.js

@@ -1,68 +1,383 @@
 import pc from 'picocolors';
-import { createServer as createViteServer } from 'vite';
-import { dirname, resolve, join } from 'node:path';
+import { createRsbuild, logger } from '@rsbuild/core';
+import { pluginReact } from '@rsbuild/plugin-react';
+import { dirname, resolve, join, extname, relative, sep } from 'node:path';
 import { fileURLToPath } from 'node:url';
-import { existsSync, readFileSync, statSync } from 'node:fs';
-import { validateLayouts } from '../lib/build/detect-layouts.js';
+import { validateLayouts, detectLayouts } from '../lib/build/detect-layouts.js';
 import { loadConfig } from '../lib/config/load-config.js';
+import { detect } from 'detect-port';
+import { existsSync, readFileSync, statSync, writeFileSync, mkdirSync } from 'node:fs';
+import chokidar from 'chokidar';
+const writeLine = (message = '') => {
+    process.stdout.write(`${message}\n`);
+};
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
 /**
- * Creates a Vite plugin that watches linkapp.config.ts for changes
+ * Creates an Rsbuild plugin that watches linkapp.config.ts for changes
  * and triggers a full page reload when the config is updated
  */
-function createConfigWatcherPlugin(userProjectPath, viteServerRef) {
-    const configPaths = [
+function createConfigWatcherPlugin(userProjectPath) {
+    const configCandidates = [
         join(userProjectPath, 'linkapp.config.ts'),
         join(userProjectPath, '.config', 'linkapp.config.ts'),
     ];
+    const handleConfigReload = (server) => {
+        writeLine(pc.cyan('  ○ linkapp.config.ts changed, reloading...'));
+        try {
+            loadConfig(userProjectPath);
+            server.sockWrite('static-changed');
+            writeLine(pc.green('  ✓ Config reloaded'));
+        }
+        catch (error) {
+            writeLine(pc.red('  ✗ Failed to reload config'));
+            writeLine(pc.dim(`    ${error instanceof Error ? error.message : error}`));
+        }
+    };
     return {
         name: 'linkapp-config-watcher',
-        configureServer(server) {
-            viteServerRef.current = server;
-            // Watch for changes to linkapp.config.ts
-            configPaths.forEach((configPath) => {
-                if (existsSync(configPath)) {
-                    server.watcher.add(configPath);
+        setup(api) {
+            let watchers = [];
+            const pendingTimers = new Map();
+            const disposeWatchers = async () => {
+                for (const watcher of watchers) {
+                    try {
+                        await watcher.close();
+                    }
+                    catch (error) {
+                        writeLine(pc.red('  ✗ Failed to close config watcher'));
+                        writeLine(pc.dim(`    ${error instanceof Error ? error.message : error}`));
+                    }
+                }
+                watchers = [];
+                for (const timeout of pendingTimers.values()) {
+                    clearTimeout(timeout);
+                }
+                pendingTimers.clear();
+            };
+            api.onBeforeStartDevServer(async ({ server }) => {
+                await disposeWatchers();
+                const filesToWatch = configCandidates.filter((candidatePath) => existsSync(candidatePath));
+                if (filesToWatch.length === 0) {
+                    return;
                 }
+                const scheduleReload = (targetPath) => {
+                    const normalizedPath = targetPath.toString();
+                    const existingTimeout = pendingTimers.get(normalizedPath);
+                    if (existingTimeout) {
+                        clearTimeout(existingTimeout);
+                    }
+                    const timeout = setTimeout(() => {
+                        pendingTimers.delete(normalizedPath);
+                        handleConfigReload(server);
+                    }, 120);
+                    pendingTimers.set(normalizedPath, timeout);
+                };
+                try {
+                    const watcher = chokidar.watch(filesToWatch, {
+                        ignoreInitial: true,
+                        awaitWriteFinish: {
+                            stabilityThreshold: 200,
+                            pollInterval: 50,
+                        },
+                    });
+                    watcher.on('all', (event, changedPath) => {
+                        if (!changedPath) {
+                            return;
+                        }
+                        const normalizedChangedPath = changedPath.toString();
+                        if (!configCandidates.includes(normalizedChangedPath)) {
+                            return;
+                        }
+                        switch (event) {
+                            case 'add':
+                            case 'change':
+                            case 'unlink':
+                                scheduleReload(normalizedChangedPath);
+                                break;
+                            default:
+                                break;
+                        }
+                    });
+                    watcher.on('error', (error) => {
+                        writeLine(pc.red('  ✗ Config watcher encountered an error'));
+                        writeLine(pc.dim(`    ${error instanceof Error ? error.message : error}`));
+                    });
+                    watchers.push(watcher);
+                }
+                catch (error) {
+                    writeLine(pc.red('  ✗ Failed to watch config file'));
+                    writeLine(pc.dim(`    ${error instanceof Error ? error.message : error}`));
+                }
+                return async () => {
+                    await disposeWatchers();
+                };
             });
-            server.watcher.on('change', (file) => {
-                // Check if the changed file is the config file
-                if (configPaths.some((configPath) => file === configPath)) {
-                    console.log(pc.cyan('  ○ linkapp.config.ts changed, reloading...'));
+            api.onCloseDevServer(async () => {
+                await disposeWatchers();
+            });
+        },
+    };
+}
+/**
+ * Creates middleware to serve static assets from the user's public directory
+ * while matching the legacy Vite dev server behavior.
+ */
+function createPublicDirPlugin(userPublicDir) {
+    const contentTypes = {
+        css: 'text/css',
+        gif: 'image/gif',
+        html: 'text/html',
+        ico: 'image/x-icon',
+        jpeg: 'image/jpeg',
+        jpg: 'image/jpeg',
+        js: 'application/javascript',
+        json: 'application/json',
+        png: 'image/png',
+        svg: 'image/svg+xml',
+        txt: 'text/plain',
+        webp: 'image/webp',
+    };
+    return {
+        name: 'linkapp:public-dir',
+        setup(api) {
+            api.onBeforeStartDevServer(async ({ server }) => {
+                if (!existsSync(userPublicDir)) {
+                    return;
+                }
+                const publicDirRoot = resolve(userPublicDir);
+                server.middlewares.use((req, res, next) => {
+                    if (!req.url) {
+                        next();
+                        return;
+                    }
+                    const method = req.method ?? 'GET';
+                    if (method !== 'GET' && method !== 'HEAD') {
+                        next();
+                        return;
+                    }
+                    const [rawPath] = req.url.split('?');
+                    if (!rawPath || rawPath === '/' || rawPath === '') {
+                        next();
+                        return;
+                    }
+                    let decodedPath;
+                    try {
+                        decodedPath = decodeURIComponent(rawPath);
+                    }
+                    catch {
+                        next();
+                        return;
+                    }
+                    const normalizedPath = decodedPath.startsWith('/') ? decodedPath : `/${decodedPath}`;
+                    const targetPath = resolve(publicDirRoot, `.${normalizedPath}`);
+                    const relativePath = relative(publicDirRoot, targetPath);
+                    if (relativePath.startsWith('..') ||
+                        relativePath.includes(`..${sep}`) ||
+                        targetPath === publicDirRoot) {
+                        next();
+                        return;
+                    }
+                    let stats;
                     try {
-                        // Reload the config to validate it
-                        loadConfig(userProjectPath);
-                        // Trigger a full page reload for all connected clients
-                        // This will cause the server to re-evaluate the config on the next request
-                        server.ws.send({
-                            type: 'full-reload',
-                            path: '*',
-                        });
-                        console.log(pc.green('  ✓ Config reloaded'));
+                        stats = statSync(targetPath);
+                    }
+                    catch {
+                        next();
+                        return;
+                    }
+                    if (!stats.isFile()) {
+                        next();
+                        return;
+                    }
+                    const extension = extname(targetPath).slice(1).toLowerCase();
+                    const contentType = (extension && contentTypes[extension]) || 'application/octet-stream';
+                    res.setHeader('Content-Type', contentType);
+                    res.setHeader('Cache-Control', 'no-cache');
+                    if (method === 'HEAD') {
+                        res.end();
+                        return;
+                    }
+                    try {
+                        const content = readFileSync(targetPath);
+                        res.end(content);
                     }
                     catch (error) {
-                        console.log(pc.red('  ✗ Failed to reload config'));
-                        console.log(pc.dim(`    ${error instanceof Error ? error.message : error}`));
+                        next(error);
                     }
-                }
+                });
             });
         },
     };
 }
+/**
+ * Generates the sheet entry point dynamically
+ */
+function generateSheetEntryPoint(devServerPath) {
+    // Use absolute paths to shared theme files in the dev-server directory
+    const themePresetsPath = resolve(devServerPath, 'shared/theme-presets');
+    const themeUtilsPath = resolve(devServerPath, 'shared/theme-utils');
+    return `import Sheet from "@/app/sheet";
+import { StrictMode } from "react";
+import { createRoot } from "react-dom/client";
+import "@/app/globals.css";
+import { THEME_PRESETS } from "${themePresetsPath}";
+import { getThemeFromUrl, mergeThemeProps } from "${themeUtilsPath}";
+
+// Declare global window property for theme application
+declare global {
+  interface Window {
+    __linkapp_applyTheme?: (variables: Record<string, string>) => void
+  }
+}
+
+// Preview props injected by dev server via Vite define
+declare const __PREVIEW_PROPS__: Record<string, unknown>;
+
+// Extract just the variables from THEME_PRESETS for theme lookups
+const THEME_VARS = Object.fromEntries(
+  Object.entries(THEME_PRESETS).map(([key, { variables }]) => [key, variables])
+);
+
+// Get theme variables from URL
+const themeVariables = getThemeFromUrl(THEME_VARS);
+
+// Merge with preview props
+const previewProps = __PREVIEW_PROPS__ || {};
+const mergedProps = mergeThemeProps(themeVariables, previewProps);
+
+// Apply theme CSS variables on mount
+if (themeVariables && window.__linkapp_applyTheme) {
+  window.__linkapp_applyTheme(themeVariables);
+}
+
+const rootElement = document.getElementById("root");
+if (!rootElement) {
+  throw new Error("Root element not found");
+}
+
+createRoot(rootElement).render(
+  <StrictMode>
+    <Sheet {...mergedProps} />
+  </StrictMode>,
+);
+`;
+}
+/**
+ * Generates the featured entry point dynamically based on available layouts
+ */
+function generateFeaturedEntryPoint(devServerPath, hasFeaturedCarousel) {
+    // Use absolute paths to shared theme files in the dev-server directory
+    const themePresetsPath = resolve(devServerPath, 'shared/theme-presets');
+    const themeUtilsPath = resolve(devServerPath, 'shared/theme-utils');
+    const featuredCarouselImport = hasFeaturedCarousel
+        ? `import FeaturedCarousel from "@/app/featured-carousel";`
+        : '';
+    const componentSelection = hasFeaturedCarousel
+        ? `// Select the appropriate component based on groupLayoutOption parameter
+const LayoutComponent = (groupLayoutOptionParam === 'carousel' && FeaturedCarousel)
+  ? FeaturedCarousel
+  : Featured;
+
+console.log('[Featured Dev Server] Rendering:', {
+  groupLayoutOption: groupLayoutOptionParam,
+  component: groupLayoutOptionParam === 'carousel' && FeaturedCarousel ? 'FeaturedCarousel' : 'Featured',
+  hasFeaturedCarousel: true,
+});`
+        : `// Only Featured layout is available
+const LayoutComponent = Featured;
+
+console.log('[Featured Dev Server] Rendering:', {
+  groupLayoutOption: groupLayoutOptionParam,
+  component: 'Featured',
+  hasFeaturedCarousel: false,
+});`;
+    return `import Featured from "@/app/featured";
+${featuredCarouselImport}
+import { StrictMode } from "react";
+import { createRoot } from "react-dom/client";
+import "@/app/globals.css";
+import { THEME_PRESETS } from "${themePresetsPath}";
+import { getThemeFromUrl, mergeThemeProps } from "${themeUtilsPath}";
+
+// Declare global window property for theme application
+declare global {
+  interface Window {
+    __linkapp_applyTheme?: (variables: Record<string, string>) => void
+  }
+}
+
+// Preview props injected by dev server via Vite define
+declare const __PREVIEW_PROPS__: Record<string, unknown>;
+
+// Extract just the variables from THEME_PRESETS for theme lookups
+const THEME_VARS = Object.fromEntries(
+  Object.entries(THEME_PRESETS).map(([key, { variables }]) => [key, variables])
+);
+
+// Get theme variables and groupLayoutOption from URL
+const params = new URLSearchParams(window.location.search);
+const groupLayoutOptionParam = params.get('groupLayoutOption');
+const themeVariables = getThemeFromUrl(THEME_VARS);
+
+// Merge with preview props and add groupLayoutOption
+const previewProps = __PREVIEW_PROPS__ || {};
+const mergedProps = mergeThemeProps(themeVariables, previewProps, {
+  groupLayoutOption: groupLayoutOptionParam || undefined,
+});
+
+// Apply theme CSS variables on mount
+if (themeVariables && window.__linkapp_applyTheme) {
+  window.__linkapp_applyTheme(themeVariables);
+}
+
+const rootElement = document.getElementById("root");
+if (!rootElement) {
+  throw new Error("Root element not found");
+}
+
+${componentSelection}
+
+createRoot(rootElement).render(
+  <StrictMode>
+    <LayoutComponent {...mergedProps} />
+  </StrictMode>,
+);
+`;
+}
 export async function devCommand(options) {
     const userProjectPath = process.cwd();
+    process.env.LINKAPP_USER_PROJECT_PATH = userProjectPath;
+    // Suppress Rsbuild's built-in logging messages
+    logger.override({
+        start: () => { }, // Suppress "start build started..." messages
+        ready: () => { }, // Suppress "ready built in..." messages
+    });
     try {
         const startTime = Date.now();
         // Validate layouts exist
         const validation = validateLayouts(userProjectPath);
         if (!validation.valid) {
-            console.log(pc.red('✗ Invalid project structure'));
+            writeLine(pc.red('✗ Invalid project structure'));
             for (const error of validation.errors) {
-                console.log(pc.red(`  ${error}`));
+                writeLine(pc.red(`  ${error}`));
             }
             process.exit(1);
         }
+        // Get dev server path (needed for generating entry points and later for Rsbuild config)
+        const devServerPath = resolve(__dirname, '../../dev-server');
+        // Detect available layouts for dynamic entry generation
+        const layoutDetection = detectLayouts(userProjectPath);
+        const hasFeaturedCarousel = layoutDetection.layouts.some(l => l.name === 'featured-carousel');
+        // Generate dynamic entry points in .linkapp directory
+        const linkappDir = join(userProjectPath, '.linkapp');
+        if (!existsSync(linkappDir)) {
+            mkdirSync(linkappDir, { recursive: true });
+        }
+        const sheetEntryPath = join(linkappDir, 'dev-sheet-main.tsx');
+        const featuredEntryPath = join(linkappDir, 'dev-featured-main.tsx');
+        writeFileSync(sheetEntryPath, generateSheetEntryPoint(devServerPath), 'utf-8');
+        writeFileSync(featuredEntryPath, generateFeaturedEntryPoint(devServerPath, hasFeaturedCarousel), 'utf-8');
         // Load config and extract preview_props and settings
         let previewProps = {};
         let settingsConfig = {};
@@ -72,114 +387,212 @@ export async function devCommand(options) {
             settingsConfig = config.settings || {};
         }
         catch (error) {
-            console.log(pc.yellow('⚠ Warning: Could not load config, using default preview props'));
-            console.log(pc.dim(`  ${error instanceof Error ? error.message : error}`));
+            writeLine(pc.yellow('⚠ Warning: Could not load config, using default preview props'));
+            writeLine(pc.dim(`  ${error instanceof Error ? error.message : error}`));
         }
-        const port = options.port || 3000;
-        const devServerPath = resolve(__dirname, '../../dev-server');
+        const requestedPort = options.port || 3000;
+        const availablePort = await detect(requestedPort);
+        // Show warning if the requested port was occupied
+        if (requestedPort !== availablePort) {
+            writeLine(pc.yellow(`  ⚠ Port ${requestedPort} is in use, using ${availablePort} instead`));
+            writeLine();
+        }
+        const port = availablePort;
         const userPublicDir = join(userProjectPath, 'public');
-        // Create a ref to hold the Vite server instance for the config watcher
-        const viteServerRef = { current: null };
-        // Create Vite server - inject preview props directly via define
-        const viteServer = await createViteServer({
-            configFile: resolve(devServerPath, 'vite.config.ts'),
-            root: devServerPath,
-            publicDir: userPublicDir,
-            resolve: {
-                alias: {
-                    '@': userProjectPath,
+        const printReadyMessage = (readyTime, urls) => {
+            writeLine();
+            writeLine(pc.bold(pc.cyan('  LinkApp')) + pc.dim(' ready'));
+            writeLine();
+            if (urls.length > 0) {
+                writeLine(`  ${pc.green('➜')}  ${pc.bold('Local:')}   ${pc.cyan(urls[0])}`);
+            }
+            writeLine();
+            writeLine(pc.green(`  ✓ Ready in ${readyTime}s`));
+        };
+        const setupKeyboardShortcuts = (handlers) => {
+            if (!process.stdin.isTTY) {
+                return () => { };
+            }
+            const handleData = (data) => {
+                if (data === '\u0003') {
+                    void handlers.exit();
+                    return;
+                }
+                const key = data.trim().toLowerCase();
+                if (key === '') {
+                    return;
+                }
+                switch (key) {
+                    case 'r':
+                        void handlers.restart();
+                        break;
+                    case 'u':
+                        handlers.showUrls();
+                        break;
+                    case 'c':
+                        handlers.clear();
+                        break;
+                    case 'q':
+                        void handlers.exit();
+                        break;
+                    default:
+                        break;
+                }
+            };
+            process.stdin.setRawMode(true);
+            process.stdin.resume();
+            process.stdin.setEncoding('utf8');
+            process.stdin.on('data', handleData);
+            return () => {
+                process.stdin.off('data', handleData);
+                if (process.stdin.isTTY) {
+                    process.stdin.setRawMode(false);
+                }
+                process.stdin.pause();
+            };
+        };
+        // Create Rsbuild server - inject preview props directly via define
+        const rsbuild = await createRsbuild({
+            rsbuildConfig: {
+                dev: {
+                    progressBar: false,
                 },
-                // Dedupe React to avoid "Invalid hook call" errors from multiple React instances
-                dedupe: ['react', 'react-dom'],
-            },
-            define: {
-                __PREVIEW_PROPS__: JSON.stringify(previewProps),
-                __SETTINGS_CONFIG__: JSON.stringify(settingsConfig),
-            },
-            server: {
-                port,
-                host: 'localhost',
-                open: false,
-                strictPort: false,
-            },
-            logLevel: 'error',
-            plugins: [
-                // Watch for config changes and reload
-                createConfigWatcherPlugin(userProjectPath, viteServerRef),
-                // Custom plugin to serve user's public directory
-                {
-                    name: 'serve-user-public',
-                    configureServer(server) {
-                        // Only serve if public directory exists
-                        if (existsSync(userPublicDir)) {
-                            // Return middleware that runs early in the stack
-                            return () => {
-                                server.middlewares.use((req, res, next) => {
-                                    if (!req.url) {
-                                        next();
-                                        return;
-                                    }
-                                    // Parse URL and remove query params
-                                    const url = new URL(req.url, `http://${req.headers.host || 'localhost'}`);
-                                    const pathname = url.pathname;
-                                    // Try to serve file from public directory
-                                    const filePath = join(userPublicDir, pathname);
-                                    try {
-                                        if (existsSync(filePath) && statSync(filePath).isFile()) {
-                                            // Determine content type
-                                            const ext = pathname.split('.').pop()?.toLowerCase();
-                                            const contentTypes = {
-                                                'png': 'image/png',
-                                                'jpg': 'image/jpeg',
-                                                'jpeg': 'image/jpeg',
-                                                'gif': 'image/gif',
-                                                'svg': 'image/svg+xml',
-                                                'webp': 'image/webp',
-                                                'ico': 'image/x-icon',
-                                                'json': 'application/json',
-                                                'txt': 'text/plain',
-                                                'html': 'text/html',
-                                                'css': 'text/css',
-                                                'js': 'application/javascript',
-                                            };
-                                            const contentType = (ext && contentTypes[ext]) || 'application/octet-stream';
-                                            const content = readFileSync(filePath);
-                                            res.setHeader('Content-Type', contentType);
-                                            res.setHeader('Cache-Control', 'no-cache');
-                                            res.end(content);
-                                            return;
-                                        }
-                                    }
-                                    catch (error) {
-                                        // File doesn't exist or error reading, continue to next middleware
-                                    }
-                                    next();
-                                });
-                            };
-                        }
+                plugins: [
+                    pluginReact(),
+                    createConfigWatcherPlugin(userProjectPath),
+                    createPublicDirPlugin(userPublicDir),
+                ],
+                source: {
+                    entry: {
+                        index: resolve(devServerPath, 'preview/main.tsx'),
+                        sheet: sheetEntryPath,
+                        featured: featuredEntryPath,
+                    },
+                    define: {
+                        __PREVIEW_PROPS__: JSON.stringify(previewProps),
+                        __SETTINGS_CONFIG__: JSON.stringify(settingsConfig),
                     },
                 },
-            ],
+                resolve: {
+                    alias: {
+                        '@': userProjectPath,
+                    },
+                    dedupe: ['react', 'react-dom'],
+                },
+                html: {
+                    template({ entryName }) {
+                        const templates = {
+                            index: resolve(devServerPath, 'index.html'),
+                            sheet: resolve(devServerPath, 'sheet.html'),
+                            featured: resolve(devServerPath, 'featured.html'),
+                        };
+                        return templates[entryName] || resolve(devServerPath, 'index.html');
+                    },
+                },
+                server: {
+                    port,
+                    host: 'localhost',
+                    open: false,
+                    strictPort: false,
+                    printUrls: false,
+                    publicDir: {
+                        name: userPublicDir,
+                        watch: true,
+                    },
+                },
+                tools: {
+                    postcss: (opts) => {
+                        // Load PostCSS config from dev-server directory
+                        opts.postcssOptions = {
+                            ...opts.postcssOptions,
+                            config: resolve(devServerPath, 'postcss.config.mjs'),
+                        };
+                        return opts;
+                    },
+                },
+            },
+        });
+        let currentServer;
+        let cleanupShortcuts;
+        let isRestarting = false;
+        let isShuttingDown = false;
+        let currentUrls = [];
+        let lastReadyTime = '';
+        const startServer = async (startedAt) => {
+            const result = await rsbuild.startDevServer();
+            currentServer = result;
+            currentUrls = result.urls;
+            lastReadyTime = ((Date.now() - startedAt) / 1000).toFixed(1);
+            printReadyMessage(lastReadyTime, currentUrls);
+        };
+        const restartServer = async () => {
+            if (isShuttingDown || isRestarting || !currentServer) {
+                return;
+            }
+            isRestarting = true;
+            writeLine();
+            writeLine(pc.cyan('  ↻ Restarting dev server...'));
+            try {
+                await currentServer.server.close();
+                const restartStart = Date.now();
+                await startServer(restartStart);
+            }
+            catch (error) {
+                currentServer = undefined;
+                writeLine(pc.red('✗ Failed to restart dev server'));
+                writeLine(pc.dim(`  ${error instanceof Error ? error.message : error}`));
+            }
+            finally {
+                isRestarting = false;
+            }
+        };
+        const showUrls = () => {
+            writeLine();
+            if (currentUrls.length > 0) {
+                writeLine(`  ${pc.green('➜')}  ${pc.bold('Local:')}   ${pc.cyan(currentUrls[0])}`);
+            }
+            writeLine();
+        };
+        const clearConsole = () => {
+            console.clear();
+            if (lastReadyTime) {
+                printReadyMessage(lastReadyTime, currentUrls);
+            }
+        };
+        const shutdown = async () => {
+            if (isShuttingDown) {
+                return;
+            }
+            isShuttingDown = true;
+            cleanupShortcuts?.();
+            try {
+                if (currentServer) {
+                    await currentServer.server.close();
+                }
+            }
+            catch (closeError) {
+                writeLine(pc.red('✗ Error while closing dev server'));
+                writeLine(pc.dim(`  ${closeError instanceof Error ? closeError.message : closeError}`));
+            }
+            finally {
+                process.exit(0);
+            }
+        };
+        await startServer(startTime);
+        cleanupShortcuts = setupKeyboardShortcuts({
+            restart: restartServer,
+            showUrls,
+            clear: clearConsole,
+            exit: shutdown,
         });
-        await viteServer.listen();
-        const readyTime = ((Date.now() - startTime) / 1000).toFixed(1);
-        console.log(pc.bold(pc.cyan('  LinkApp')) + pc.dim(' ready'));
-        console.log();
-        console.log(pc.green('  ➜') + pc.bold('  Local:   ') + pc.cyan(`http://localhost:${port}`));
-        console.log();
-        viteServer.bindCLIShortcuts({ print: true });
-        console.log(pc.dim(`  ✓ Ready in ${readyTime}s`));
-        // Handle Ctrl+C
-        process.on('SIGINT', async () => {
-            console.log('\n');
-            await viteServer.close();
-            process.exit(0);
+        process.on('SIGINT', () => {
+            void shutdown();
         });
         // Keep alive
         await new Promise(() => { });
     }
     catch (error) {
-        console.log(pc.red('✗ Failed to start server'));
+        writeLine(pc.red('✗ Failed to start server'));
         console.error(pc.red('✗ Error:'), error);
         process.exit(1);
     }