@hapico/cli 0.0.29 → 0.0.31

package/bin/index.js

@@ -56,6 +56,7 @@ const util_1 = require("util");
 const chalk_1 = __importDefault(require("chalk"));
 const pako_1 = __importDefault(require("pako"));
 const vibe_1 = require("./tools/vibe");
+const nativewind_1 = require("./tools/nativewind");
 // Promisify exec for async usage
 const execPromise = (0, util_1.promisify)(child_process_1.exec);
 // Directory to store the token and project config
@@ -113,7 +114,7 @@ const getStoredProjectId = (projectDir) => {
         replicate: [],
     };
 };
-// Khởi tạo cache bằng Map để lưu trữ kết quả compile
+// Initialize cache using Map to store compilation results
 const compileCache = new Map();
 const tryJSONParse = (str) => {
     try {
@@ -173,7 +174,7 @@ class FileManager {
         }
     }
     replaceSplashWithSeparator(filePath) {
-        // Thay thế dấu "\" với dấu "/" trong đường dẫn file
+        // Replace "\" with "/" in the file path
         return filePath.replace(/\\/g, "/");
     }
     listFiles() {
@@ -186,11 +187,11 @@ class FileManager {
                     traverseDirectory(fullPath);
                 }
                 else if (entry.isFile()) {
-                    // skip các file trong thư mục bị ignore
+                    // skip files in ignored folders
                     if (ignoreFolders.some((folder) => fullPath.includes(folder))) {
                         return;
                     }
-                    // chỉ hổ trợ các files nằm trong ./src
+                    // only support files located in ./src
                     if (!fullPath.includes("/src/") && !fullPath.includes("\\src\\")) {
                         return;
                     }
@@ -310,7 +311,9 @@ class RoomState {
         // Set binaryType to 'arraybuffer' to handle binary data
         this.ws.binaryType = "arraybuffer";
         this.ws.on("open", () => {
-            console.log(chalk_1.default.green(`Connected to room: ${this.roomId}`));
+            if (this.reconnectAttempts > 0) {
+                console.log(chalk_1.default.greenBright(`\n✨ Sync connection restored for session: ${this.roomId}`));
+            }
             this.isConnected = true;
             this.reconnectAttempts = 0;
             onConnected === null || onConnected === void 0 ? void 0 : onConnected(); // Call the onConnected callback if provided
@@ -336,7 +339,7 @@ class RoomState {
                     jsonStr = pako_1.default.inflate(data, { to: "string" });
                 }
                 else {
-                    jsonStr = data.toString(); // Fallback nếu không nén
+                    jsonStr = data.toString(); // Fallback if not compressed
                 }
                 const parsedData = JSON.parse(jsonStr);
                 const includes = [
@@ -391,8 +394,8 @@ class RoomState {
                 type: "update",
                 state: { [key]: value },
             });
-            const compressed = pako_1.default.deflate(message); // Nén dữ liệu
-            this.ws.send(compressed); // Gửi binary
+            const compressed = pako_1.default.deflate(message); // Compress state data
+            this.ws.send(compressed); // Send binary payload
         }
     }
     disconnect() {
@@ -411,92 +414,84 @@ class RoomState {
         return this.isConnected;
     }
 }
-commander_1.program.version("0.0.29").description("Hapico CLI for project management");
+commander_1.program.version("0.0.31").description("Hapico CLI for project management");
 commander_1.program
     .command("clone <id>")
     .description("Clone a project by ID")
     .action(async (id) => {
     var _a, _b, _c, _d;
+    console.clear();
+    console.log(chalk_1.default.bold.blue("\n📦 HAPICO CLONE PIPELINE"));
+    console.log(chalk_1.default.gray("──────────────────────────────────────────────────────────────────"));
     const { accessToken } = getStoredToken();
     if (!accessToken) {
-        console.error(chalk_1.default.red("✗ You need to login first. Use 'hapico login' command."));
+        console.log(chalk_1.default.red("✗ Authentication required. Please run 'hapico login' first."));
         return;
     }
-    const projectDir = path.resolve(process.cwd(), id);
-    if (fs.existsSync(projectDir)) {
-        console.error(chalk_1.default.red(`✗ Project directory "${id}" already exists.`));
+    const outputDir = path.resolve(process.cwd(), id);
+    if (fs.existsSync(outputDir)) {
+        console.log(chalk_1.default.red(`✗ Destination directory "${id}" already exists.`));
         return;
     }
-    let files = [];
-    const apiSpinner = (0, ora_1.default)(chalk_1.default.blue("Fetching project data...")).start();
+    const statusSpinner = (0, ora_1.default)(chalk_1.default.blue("Fetching project metadata...")).start();
     try {
-        // ===== 1. Lấy version public/published (giữ nguyên như cũ) =====
+        // 1. Fetch metadata and initial files
         const response = await axios_1.default.get(`https://base.myworkbeast.com/api/views/${id}`);
+        const projectType = response.data.type || "view";
         const code = (_a = response === null || response === void 0 ? void 0 : response.data) === null || _a === void 0 ? void 0 : _a.code;
         const decompressedCode = pako_1.default.inflate(Uint8Array.from(atob(code), (c) => c.charCodeAt(0)), { to: "string" });
-        files = ((_b = (0, exports.tryJSONParse)(decompressedCode)) === null || _b === void 0 ? void 0 : _b.files) || [];
-        apiSpinner.succeed(chalk_1.default.green("Project data fetched successfully!"));
-        // ===== 2. Download + extract template =====
-        const templateSpinner = (0, ora_1.default)(chalk_1.default.blue("Downloading template...")).start();
+        const publicFiles = ((_b = (0, exports.tryJSONParse)(decompressedCode)) === null || _b === void 0 ? void 0 : _b.files) || [];
+        statusSpinner.succeed(chalk_1.default.green("Project metadata retrieved."));
+        console.log(chalk_1.default.bold.white("Project Details:"));
+        console.log(`${chalk_1.default.gray("├─")} ${chalk_1.default.bold("ID     :")} ${chalk_1.default.cyan(id)}`);
+        console.log(`${chalk_1.default.gray("└─")} ${chalk_1.default.bold("Type   :")} ${chalk_1.default.magenta(projectType.toUpperCase())}\n`);
+        // 2. Setup Template
+        statusSpinner.start(chalk_1.default.blue("Initializing project template..."));
         const TEMPLATE_URL = "https://files.hcm04.vstorage.vngcloud.vn/assets/template_zalominiapp_devmode.zip";
-        const templateResponse = await axios_1.default.get(TEMPLATE_URL, {
-            responseType: "arraybuffer",
-        });
-        templateSpinner.succeed(chalk_1.default.green("Template downloaded successfully!"));
-        const outputDir = path.resolve(process.cwd(), id);
-        if (!fs.existsSync(outputDir)) {
-            fs.mkdirSync(outputDir);
-        }
-        const unzipSpinner = (0, ora_1.default)(chalk_1.default.blue("Extracting template...")).start();
+        const templateResponse = await axios_1.default.get(TEMPLATE_URL, { responseType: "arraybuffer" });
+        if (!fs.existsSync(outputDir))
+            fs.mkdirSync(outputDir, { recursive: true });
         await unzipper_1.default.Open.buffer(templateResponse.data).then((directory) => directory.extract({ path: outputDir }));
-        unzipSpinner.succeed(chalk_1.default.green("Template extracted successfully!"));
-        const macosxDir = path.join(process.cwd(), id, "__MACOSX");
-        if (fs.existsSync(macosxDir)) {
+        const macosxDir = path.join(outputDir, "__MACOSX");
+        if (fs.existsSync(macosxDir))
             fs.rmSync(macosxDir, { recursive: true, force: true });
-        }
-        // Save project ID
         saveProjectId(outputDir, id);
-        console.log(chalk_1.default.green("Project cloned successfully!"));
-        // ===== 3. Save file từ version public =====
-        const saveSpinner = (0, ora_1.default)(chalk_1.default.blue("Saving project files...")).start();
-        files.forEach((file) => {
-            const filePath = path.join(process.cwd(), id, "src", file.path);
-            const dir = path.dirname(filePath);
-            if (!fs.existsSync(dir)) {
-                fs.mkdirSync(dir, { recursive: true });
-            }
-            fs.writeFileSync(filePath, file.content);
-        });
-        saveSpinner.succeed(chalk_1.default.green("Project files saved successfully!"));
-        // ===== 4. TỰ ĐỘNG PULL PHIÊN BẢN MỚI NHẤT (draft) – ĐÂY LÀ PHẦN MỚI =====
-        const pullSpinner = (0, ora_1.default)(chalk_1.default.blue("Pulling latest changes from server...")).start();
+        statusSpinner.succeed(chalk_1.default.green("Base template initialized."));
+        // 3. Sync Source Files
+        statusSpinner.start(chalk_1.default.blue("Syncing source files..."));
+        const srcPath = path.join(outputDir, "src");
+        const fileManager = new FileManager(srcPath);
+        fileManager.syncFiles(publicFiles);
+        statusSpinner.succeed(chalk_1.default.green(`${publicFiles.length} files synchronized from production.`));
+        // 4. Pull Latest Draft (v3)
+        statusSpinner.start(chalk_1.default.blue("Checking for latest development changes..."));
         try {
             const pullResponse = await axios_1.default.get(`https://base.myworkbeast.com/api/views/v3/${id}`, {
-                headers: {
-                    Authorization: `Bearer ${accessToken}`,
-                    "Content-Type": "application/json",
-                },
+                headers: { Authorization: `Bearer ${accessToken}` },
             });
             const pullCode = (_c = pullResponse === null || pullResponse === void 0 ? void 0 : pullResponse.data) === null || _c === void 0 ? void 0 : _c.code;
-            if (!pullCode) {
-                pullSpinner.info(chalk_1.default.cyan("No draft version found – using published version."));
-            }
-            else {
+            if (pullCode) {
                 const pullDecompressed = pako_1.default.inflate(Uint8Array.from(atob(pullCode), (c) => c.charCodeAt(0)), { to: "string" });
                 const latestFiles = ((_d = (0, exports.tryJSONParse)(pullDecompressed)) === null || _d === void 0 ? void 0 : _d.files) || [];
-                const fileManager = new FileManager(path.join(outputDir, "src"));
                 fileManager.syncFiles(latestFiles);
-                pullSpinner.succeed(chalk_1.default.green("✓ Latest changes pulled successfully!"));
+                statusSpinner.succeed(chalk_1.default.green("Latest development changes integrated."));
+            }
+            else {
+                statusSpinner.info(chalk_1.default.gray("No draft version found, using published code."));
             }
         }
-        catch (pullErr) {
-            pullSpinner.warn(chalk_1.default.yellow(`⚠ Could not pull latest changes: ${pullErr.message}\n   Run "hapico pull" manually later.`));
+        catch (e) {
+            statusSpinner.warn(chalk_1.default.yellow("Draft sync skipped (using production code)."));
         }
-        // ===== 5. Hướng dẫn chạy dev =====
-        console.log(chalk_1.default.cyan(`💡 Run ${chalk_1.default.bold("cd ${id} && npm install && hapico dev")} to start the project.`));
+        console.log(chalk_1.default.gray("──────────────────────────────────────────────────────────────────"));
+        console.log(`\n${chalk_1.default.bold.white.bgGreen(" SUCCESS ")} ${chalk_1.default.green("Project cloned successfully!\n")}`);
+        console.log(chalk_1.default.bold.white("Next steps:"));
+        console.log(`${chalk_1.default.gray("1.")} ${chalk_1.default.cyan(`cd ${id}`)}`);
+        console.log(`${chalk_1.default.gray("2.")} ${chalk_1.default.cyan("npm install")}`);
+        console.log(`${chalk_1.default.gray("3.")} ${chalk_1.default.cyan("hapico dev")}\n`);
     }
     catch (error) {
-        apiSpinner.fail(chalk_1.default.red(`Error cloning project: ${error.message}`));
+        statusSpinner.fail(chalk_1.default.red(`Clone failed: ${error.message}`));
     }
 });
 commander_1.program
@@ -510,71 +505,75 @@ commander_1.program
     .command("dev")
     .description("Start the project in development mode")
     .option("--zversion <version>", "Zalo version for QR code")
-    .action((options) => {
-    var _a;
+    .action(async (options) => {
     const { accessToken } = getStoredToken();
     if (!accessToken) {
         console.error(chalk_1.default.red("✗ You need to login first. Use 'hapico login' command."));
         return;
     }
-    const devSpinner = (0, ora_1.default)(chalk_1.default.blue("Starting the project in development mode...")).start();
+    console.clear();
+    console.log(chalk_1.default.bold.cyan("\n🚀 HAPICO DEVELOPMENT SERVER"));
+    console.log(chalk_1.default.gray("─────────────────────────────────────────"));
+    const devSpinner = (0, ora_1.default)(chalk_1.default.blue("Initializing environment...")).start();
     const pwd = process.cwd();
     const srcDir = path.join(pwd, "src");
     if (!fs.existsSync(srcDir)) {
-        devSpinner.fail(chalk_1.default.red("✗ Source directory 'src' does not exist. Please clone a project first."));
+        devSpinner.fail(chalk_1.default.red("Source directory 'src' not found. Ensure you are in a valid project folder."));
         return;
     }
-    // Directory to store session config
     const tmpDir = path.join(pwd, ".tmp");
     const sessionConfigFile = path.join(tmpDir, "config.json");
-    // Ensure .tmp directory exists
-    if (!fs.existsSync(tmpDir)) {
+    if (!fs.existsSync(tmpDir))
         fs.mkdirSync(tmpDir, { recursive: true });
-    }
-    // Function to get stored session ID
     const getStoredSessionId = () => {
         if (fs.existsSync(sessionConfigFile)) {
-            const data = fs.readFileSync(sessionConfigFile, { encoding: "utf8" });
-            const json = JSON.parse(data);
-            return json.sessionId || null;
+            try {
+                return JSON.parse(fs.readFileSync(sessionConfigFile, "utf8")).sessionId;
+            }
+            catch (_a) {
+                return null;
+            }
         }
         return null;
     };
-    // Function to save session ID
-    const saveSessionId = (sessionId) => {
-        fs.writeFileSync(sessionConfigFile, JSON.stringify({ sessionId }, null, 2), { encoding: "utf8" });
-    };
-    // Get or generate session ID
-    let sessionId = getStoredSessionId();
-    if (!sessionId) {
-        sessionId = (0, crypto_1.randomUUID)();
-        saveSessionId(sessionId);
-    }
+    let sessionId = getStoredSessionId() || (0, crypto_1.randomUUID)();
+    fs.writeFileSync(sessionConfigFile, JSON.stringify({ sessionId }, null, 2));
+    const projectConfig = getStoredProjectId(pwd);
     const info = JSON.stringify({
         id: sessionId,
         createdAt: new Date().toISOString(),
-        viewId: (_a = getStoredProjectId(pwd)) === null || _a === void 0 ? void 0 : _a.projectId,
+        viewId: projectConfig === null || projectConfig === void 0 ? void 0 : projectConfig.projectId,
     });
-    // Convert info to base64
     const projectId = Buffer.from(info).toString("base64");
-    if (!projectId) {
-        devSpinner.fail(chalk_1.default.red("✗ Project ID not found. Please ensure hapico.config.json exists in the project directory."));
+    if (!(projectConfig === null || projectConfig === void 0 ? void 0 : projectConfig.projectId)) {
+        devSpinner.fail(chalk_1.default.red("Project ID missing in hapico.config.json"));
         return;
     }
-    console.log(chalk_1.default.cyan("🔗 Connecting to WebSocket server"));
-    const room = new RoomState(`view_${projectId}`, []);
+    devSpinner.text = chalk_1.default.blue("Scanning project directory...");
     const fileManager = new FileManager(srcDir);
     const initialFiles = fileManager.listFiles();
-    // get tsconfig.json
-    const tsconfigPath = path.join(srcDir, "..", "tsconfig.json");
-    if (fs.existsSync(tsconfigPath)) {
-        const content = fs.readFileSync(tsconfigPath, { encoding: "utf8" });
-        initialFiles.push({
-            path: "./tsconfig.json",
-            content,
-        });
-    }
-    // Remove All binary files
+    // Supported files outside src
+    const SUPPORT_FILES = [
+        "./.env",
+        "./.env.local",
+        "./.env.development",
+        "./.env.production",
+        "./package.json",
+        "./tsconfig.json",
+        "./nativewind.json"
+    ];
+    SUPPORT_FILES.forEach((relativePath) => {
+        var _a;
+        const fullPath = path.join(pwd, relativePath);
+        if (fs.existsSync(fullPath)) {
+            const content = fs.readFileSync(fullPath, { encoding: "utf8" });
+            initialFiles.push({
+                path: relativePath,
+                content,
+                es5: (_a = (0, exports.compileES5)(content, fullPath)) !== null && _a !== void 0 ? _a : "",
+            });
+        }
+    });
     const supportExtensions = [
         ".ts",
         ".tsx",
@@ -587,100 +586,118 @@ commander_1.program
         ".env.development",
         ".env.production",
     ];
-    const filteredFiles = initialFiles.filter((file) => {
-        return supportExtensions.some((ext) => file.path.endsWith(ext));
-    });
+    const filteredFiles = initialFiles.filter((file) => supportExtensions.some((ext) => file.path.endsWith(ext)));
+    devSpinner.text = chalk_1.default.blue("Establishing WebSocket connection...");
+    const room = new RoomState(`view_${projectId}`, []);
     room.files = filteredFiles;
     room.connect(async () => {
-        devSpinner.succeed(chalk_1.default.green("Project started in development mode!"));
+        devSpinner.succeed(chalk_1.default.greenBright("Sync Engine Ready"));
+        console.log(`\n${chalk_1.default.bold.white.bgGreen(" SUCCESS ")} ${chalk_1.default.green("Connection established with workspace.\n")}`);
+        console.log(chalk_1.default.bold.white("Workspace Configuration:"));
+        console.log(`${chalk_1.default.gray("├─")} ${chalk_1.default.bold("Project ID :")} ${chalk_1.default.cyan(projectConfig.projectId)}`);
+        console.log(`${chalk_1.default.gray("├─")} ${chalk_1.default.bold("Session    :")} ${chalk_1.default.gray(sessionId)}`);
+        console.log(`${chalk_1.default.gray("└─")} ${chalk_1.default.bold("Local Path :")} ${chalk_1.default.gray(pwd)}`);
+        console.log("");
         room.updateState("view", filteredFiles);
-        // Debounce the state update to avoid overwhelming the server while typing/saving
-        const debouncedUpdate = (0, lodash_1.debounce)((updatedFiles) => {
-            room.updateState("view", updatedFiles);
-        }, 200);
-        fileManager.setOnFileChange((filePath, content) => {
-            var _a;
-            const es5 = (_a = (0, exports.compileES5)(content, filePath)) !== null && _a !== void 0 ? _a : "";
-            console.log(chalk_1.default.yellow(`📝 File changed: ${filePath === null || filePath === void 0 ? void 0 : filePath.replace(srcDir, ".")}`));
-            const updatedFiles = room.files.map((file) => {
-                if (path.join(srcDir, file.path) === filePath) {
-                    return { ...file, content, es5 };
-                }
-                return file;
+        try {
+            const project = await axios_1.default.get(`https://base.myworkbeast.com/api/views/${projectConfig.projectId}`, {
+                headers: { Authorization: `Bearer ${accessToken}` }
             });
-            room.files = updatedFiles;
-            debouncedUpdate(updatedFiles);
-        });
-        // Fetch project info
-        const store = getStoredProjectId(pwd);
-        if (!store.projectId) {
-            console.error(chalk_1.default.red("✗ Project ID not found. Please ensure hapico.config.json exists in the project directory."));
-            return;
-        }
-        const project = await axios_1.default.get(`https://base.myworkbeast.com/api/views/${store.projectId}`, {
-            headers: {
-                Authorization: `Bearer ${accessToken}`,
-                "Content-Type": "application/json",
-            },
-        });
-        if (project.status !== 200) {
-            console.error(chalk_1.default.red(`✗ Error fetching project info: ${project.statusText}`));
-            return;
-        }
-        const projectType = project.data.type || "view";
-        const zversion = options.zversion;
-        if (projectType === "expo_app" || projectType === "emg_edu_lesson") {
-            const BASE_EXPO_LINK = `exp://u.expo.dev/e362c6df-abe8-4503-8723-1362f015d167/group/e5d6b96e-3c78-485a-a170-1d8aa8b2c47e`;
-            const link = `${BASE_EXPO_LINK}?sessionKey=${projectId}&mode=development`;
-            qrcode_terminal_1.default.generate(link, { small: true }, (qrcode) => {
-                console.log(chalk_1.default.cyan("📱 Scan this QR code with Expo Go to connect to the project:"));
-                console.log(qrcode);
+            const projectType = project.data.type || "view";
+            const isExpo = projectType === "expo_app" || projectType === "emg_edu_lesson";
+            console.log(chalk_1.default.bold.white("Environment Status:"));
+            console.log(`${chalk_1.default.gray("├─")} ${chalk_1.default.bold("Type       :")} ${chalk_1.default.magenta(projectType.toUpperCase())}`);
+            console.log(`${chalk_1.default.gray("└─")} ${chalk_1.default.bold("Watcher    :")} ${chalk_1.default.greenBright("Active & Synchronizing")}`);
+            console.log(chalk_1.default.gray("──────────────────────────────────────────────────────────────────\n"));
+            if (isExpo) {
+                try {
+                    await (0, nativewind_1.compileAndSaveToFolder)("src", "nativewind.json");
+                }
+                catch (e) { }
+            }
+            const debouncedNativeWind = (0, lodash_1.debounce)(async () => {
+                if (isExpo) {
+                    process.stdout.write(chalk_1.default.gray("  [System] Style assets synchronized successfully.\r"));
+                    try {
+                        await (0, nativewind_1.compileAndSaveToFolder)("src", "nativewind.json");
+                    }
+                    catch (e) { }
+                }
+            }, 500);
+            const debouncedUpdate = (0, lodash_1.debounce)((updatedFiles) => {
+                room.updateState("view", updatedFiles);
+            }, 200);
+            fileManager.setOnFileChange((filePath, content) => {
+                var _a;
+                const timestamp = new Date().toLocaleTimeString([], { hour12: false });
+                const relativePath = filePath.replace(srcDir, ".");
+                console.log(`${chalk_1.default.gray(`[${timestamp}]`)} ${chalk_1.default.yellow.bold("CHANGE")} ${chalk_1.default.white(relativePath)}`);
+                const es5 = (_a = (0, exports.compileES5)(content, filePath)) !== null && _a !== void 0 ? _a : "";
+                const updatedFiles = room.files.map((file) => {
+                    if (path.join(srcDir, file.path) === filePath)
+                        return { ...file, content, es5 };
+                    return file;
+                });
+                room.files = updatedFiles;
+                debouncedUpdate(updatedFiles);
+                if (isExpo)
+                    debouncedNativeWind();
             });
-            return;
-        }
-        else if (projectType === "zalominiapp") {
-            console.log("zversion", zversion);
-            if (!zversion) {
-                qrcode_terminal_1.default.generate(`https://zalo.me/s/3218692650896662017/player/${projectId}`, { small: true }, (qrcode) => {
-                    console.log(chalk_1.default.cyan("📱 Scan this QR code to connect to the project:"));
-                    console.log(qrcode);
+            // UI Access Section
+            if (isExpo) {
+                const EXPO_GROUP_ID = "6f033d8b-7ed5-48dc-ab6f-f8348cf6993b";
+                const link = `exp://u.expo.dev/e362c6df-abe8-4503-8723-1362f015d167/group/${EXPO_GROUP_ID}?sessionKey=${projectId}&mode=development`;
+                console.log(chalk_1.default.bold.black.bgCyan(" 📱 EXPO GO ACCESS "));
+                qrcode_terminal_1.default.generate(link, { small: true }, (code) => {
+                    console.log(chalk_1.default.white(code));
                 });
+                console.log(chalk_1.default.cyan(`   Link: ${chalk_1.default.underline(link)}\n`));
             }
-            else {
-                qrcode_terminal_1.default.generate(`https://zalo.me/s/3218692650896662017/player/${projectId}?env=TESTING&version=${zversion}`, { small: true }, (qrcode) => {
-                    console.log(chalk_1.default.cyan("📱 Scan this QR code to connect to the project:"));
-                    console.log(qrcode);
+            else if (projectType === "zalominiapp" || projectType === "zalominiapp2") {
+                const zversion = options.zversion;
+                const zaloUrl = zversion
+                    ? `https://zalo.me/s/3218692650896662017/player/${projectId}?env=TESTING&version=${zversion}`
+                    : `https://zalo.me/s/3218692650896662017/player/${projectId}`;
+                const label = projectType === "zalominiapp2" ? " 🧩 ZALO MINI APP 2.0 " : " 🧩 ZALO MINI APP ";
+                console.log(chalk_1.default.bold.black.bgBlue(label));
+                qrcode_terminal_1.default.generate(zaloUrl, { small: true }, (code) => {
+                    console.log(chalk_1.default.white(code));
                 });
+                console.log(chalk_1.default.blue(`   Link: ${chalk_1.default.underline(zaloUrl)}\n`));
             }
-            return;
+            else {
+                const previewUrl = `https://com.ai.vn/dev_preview/${projectId}`;
+                const label = projectType === "web2" ? " 🌐 WEB 2.0 PREVIEW " : " 🌐 BROWSER PREVIEW ";
+                console.log(chalk_1.default.bold.black.bgGreen(label));
+                console.log(chalk_1.default.green(`   URL: ${chalk_1.default.underline(previewUrl)}\n`));
+                await (0, open_1.default)(previewUrl);
+            }
+            console.log(chalk_1.default.gray("👀 Monitoring file changes... (Press Ctrl+C to exit)"));
         }
-        else {
-            const previewUrl = `https://com.ai.vn/dev_preview/${projectId}`;
-            console.log(chalk_1.default.cyan(`🌐 Open this URL in your browser to preview the project:\n${previewUrl}`));
-            await (0, open_1.default)(previewUrl);
+        catch (err) {
+            console.log(chalk_1.default.yellow(`\n⚠️  Environment metadata could not be fetched: ${err.message}`));
+            console.log(chalk_1.default.gray("──────────────────────────────────────────────────────────────────\n"));
         }
     });
 });
-// Hàm tái sử dụng để push mã nguồn lên server
-async function pushProject(spinner, projectId) {
+// Chuyên nghiệp hóa việc push source code lên server
+async function pushProject(projectId) {
     const data = getStoredToken();
     const { accessToken } = data || {};
     if (!accessToken) {
-        spinner.fail(chalk_1.default.red("✗ You need to login first. Use 'hapico login' command."));
-        return false;
+        return { success: false, projectId, totalSize: 0, fileCount: 0, error: "Authentication required. Please run 'hapico login'." };
     }
     const pwd = process.cwd();
     const srcDir = path.join(pwd, "src");
     if (!fs.existsSync(srcDir)) {
-        spinner.fail(chalk_1.default.red("✗ Source directory 'src' does not exist. Please clone a project first."));
-        return false;
+        return { success: false, projectId, totalSize: 0, fileCount: 0, error: "Source directory 'src' not found. Ensure you are in a valid project folder." };
     }
     const fileManager = new FileManager(srcDir);
     const files = fileManager.listFiles().filter((file) => {
         const extname = path.extname(file.path);
         return supportedExtensions.includes(extname);
     });
-    // Supported files
+    // Supported extra files at root
     const SUPPORT_FILES = [
         "./.env",
         "./.env.local",
@@ -688,13 +705,12 @@ async function pushProject(spinner, projectId) {
         "./.env.production",
         "./package.json",
         "./tsconfig.json",
+        "./nativewind.json"
     ];
-    // Include supported files
     SUPPORT_FILES.forEach((relativePath) => {
         var _a;
         const fullPath = path.join(pwd, relativePath);
         if (fs.existsSync(fullPath)) {
-            console.log(chalk_1.default.green(`Including ${relativePath} in push for project ${projectId}.`));
             const content = fs.readFileSync(fullPath, { encoding: "utf8" });
             files.push({
                 path: relativePath,
@@ -703,79 +719,112 @@ async function pushProject(spinner, projectId) {
             });
         }
     });
-    // Show ra thông tin dung lượng mã nguồn
     const totalSize = files.reduce((acc, file) => acc + file.content.length, 0);
-    console.log(chalk_1.default.cyan(`Total source code size for project ${projectId}: ${(totalSize / 1024).toFixed(2)} KB`));
-    spinner.text = `Pushing project source code to server for project ${projectId}...`;
     const apiUrl = `https://base.myworkbeast.com/api/views/${projectId}`;
     try {
-        await axios_1.default.put(apiUrl, {
-            code: JSON.stringify({
-                files,
-            }),
-        }, {
+        await axios_1.default.put(apiUrl, { code: JSON.stringify({ files }) }, {
+            headers: {
+                Authorization: `Bearer ${accessToken}`,
+                "Content-Type": "application/json",
+            },
+        });
+        return { success: true, projectId, totalSize, fileCount: files.length };
+    }
+    catch (error) {
+        return { success: false, projectId, totalSize, fileCount: files.length, error: error.message };
+    }
+}
+async function publishProjectApi(projectId) {
+    const { accessToken } = getStoredToken();
+    const apiUrl = "https://base.myworkbeast.com/api/views/publish/v2";
+    try {
+        await axios_1.default.post(apiUrl, { view_id: parseInt(projectId, 10) }, {
             headers: {
                 Authorization: `Bearer ${accessToken}`,
                 "Content-Type": "application/json",
             },
         });
-        return true;
+        return { success: true };
     }
     catch (error) {
-        spinner.fail(chalk_1.default.red(`✗ Error saving project ${projectId}: ${error.message}`));
-        return false;
+        return { success: false, error: error.message };
     }
 }
 commander_1.program
     .command("push")
     .description("Push the project source code to the server")
     .action(async () => {
-    const saveSpinner = (0, ora_1.default)(chalk_1.default.blue("Saving project source code...")).start();
+    console.clear();
+    console.log(chalk_1.default.bold.cyan("\n🚀 HAPICO PUSH PIPELINE"));
+    console.log(chalk_1.default.gray("──────────────────────────────────────────────────────────────────"));
     const pwd = process.cwd();
     const { projectId, replicate } = getStoredProjectId(pwd);
     if (!projectId) {
-        saveSpinner.fail(chalk_1.default.red("✗ Project ID not found. Please ensure hapico.config.json exists in the project directory."));
+        console.log(chalk_1.default.red("✗ Project ID not found. Ensure hapico.config.json exists."));
+        return;
+    }
+    console.log(chalk_1.default.bold.white("Target Environments:"));
+    console.log(`${chalk_1.default.gray("├─")} ${chalk_1.default.bold("Main Project :")} ${chalk_1.default.cyan(projectId)}`);
+    if (replicate && replicate.length > 0) {
+        console.log(`${chalk_1.default.gray("└─")} ${chalk_1.default.bold("Replicas     :")} ${chalk_1.default.cyan(replicate.join(", "))}`);
+    }
+    else {
+        console.log(`${chalk_1.default.gray("└─")} ${chalk_1.default.bold("Replicas     :")} ${chalk_1.default.gray("None")}`);
+    }
+    console.log("");
+    const pushSpinner = (0, ora_1.default)(chalk_1.default.blue("Syncing source code with main project...")).start();
+    const mainResult = await pushProject(projectId);
+    if (mainResult.success) {
+        pushSpinner.succeed(chalk_1.default.green(`Main Project [${projectId}] code synced successfully.`));
+        console.log(`${chalk_1.default.gray("   ├─")} ${chalk_1.default.bold("Files :")} ${chalk_1.default.white(mainResult.fileCount)}`);
+        console.log(`${chalk_1.default.gray("   └─")} ${chalk_1.default.bold("Size  :")} ${chalk_1.default.white((mainResult.totalSize / 1024).toFixed(2) + " KB")}\n`);
+    }
+    else {
+        pushSpinner.fail(chalk_1.default.red(`Main Project [${projectId}] sync failed: ${mainResult.error}`));
         return;
     }
-    // Push to the main project
-    const mainSuccess = await pushProject(saveSpinner, projectId);
-    let allSuccess = mainSuccess;
-    // Push to replicated projects if replicate array exists
-    if (replicate && Array.isArray(replicate) && replicate.length > 0) {
-        saveSpinner.text = chalk_1.default.blue("Pushing to replicated projects...");
+    let allSuccess = true;
+    if (replicate && replicate.length > 0) {
         for (const repId of replicate) {
-            const success = await pushProject(saveSpinner, repId);
-            if (!success) {
-                allSuccess = false;
-                console.warn(chalk_1.default.yellow(`⚠ Failed to push to replicated project ${repId}. Continuing...`));
+            const repSpinner = (0, ora_1.default)(chalk_1.default.blue(`Syncing replica [${repId}]...`)).start();
+            const repResult = await pushProject(repId);
+            if (repResult.success) {
+                repSpinner.succeed(chalk_1.default.green(`Replica [${repId}] code synced successfully.`));
+                console.log(`${chalk_1.default.gray("   ├─")} ${chalk_1.default.bold("Files :")} ${chalk_1.default.white(repResult.fileCount)}`);
+                console.log(`${chalk_1.default.gray("   └─")} ${chalk_1.default.bold("Size  :")} ${chalk_1.default.white((repResult.totalSize / 1024).toFixed(2) + " KB")}\n`);
             }
             else {
-                console.log(chalk_1.default.green(`✓ Successfully pushed to replicated project ${repId}.`));
+                repSpinner.fail(chalk_1.default.red(`Replica [${repId}] sync failed: ${repResult.error}`));
+                allSuccess = false;
             }
         }
     }
+    console.log(chalk_1.default.gray("──────────────────────────────────────────────────────────────────"));
     if (allSuccess) {
-        saveSpinner.succeed(chalk_1.default.green("Project source code saved successfully to all projects!"));
+        console.log(`\n${chalk_1.default.bold.white.bgGreen(" SUCCESS ")} ${chalk_1.default.green("All source codes pushed successfully!\n")}`);
     }
     else {
-        saveSpinner.warn(chalk_1.default.yellow("Project source code saved with some errors."));
+        console.log(`\n${chalk_1.default.bold.white.bgYellow(" WARNING ")} ${chalk_1.default.yellow("Push completed with some replica errors.\n")}`);
     }
 });
 commander_1.program
     .command("login")
-    .description("Login to the system")
+    .description("Authenticate Hapico CLI with your account")
     .action(async () => {
-    console.log(chalk_1.default.cyan("🔐 Logging in to the system..."));
-    const loginSpinner = (0, ora_1.default)(chalk_1.default.blue("Initiating login...")).start();
+    console.clear();
+    console.log(chalk_1.default.bold.yellow("\n🔐 HAPICO SECURE LOGIN"));
+    console.log(chalk_1.default.gray("──────────────────────────────────────────────────────────────────"));
+    const loginSpinner = (0, ora_1.default)(chalk_1.default.blue("Requesting device authorization...")).start();
     try {
         const response = await axios_1.default.post("https://auth.myworkbeast.com/auth/device");
         const { device_code, user_code, verification_url, expires_in, interval } = response.data;
-        loginSpinner.succeed(chalk_1.default.green("Login initiated!"));
-        console.log(chalk_1.default.cyan(`🌐 Please open this URL in your browser: ${verification_url}`));
-        console.log(chalk_1.default.yellow(`🔑 And enter this code: ${user_code}`));
-        console.log(chalk_1.default.blue("⏳ Waiting for authentication..."));
+        loginSpinner.succeed(chalk_1.default.green("Authorization request created."));
+        console.log(`\n${chalk_1.default.bold.white("ACTION REQUIRED")}`);
+        console.log(`${chalk_1.default.gray("1.")} Open URL : ${chalk_1.default.underline.cyan(verification_url)}`);
+        console.log(`${chalk_1.default.gray("2.")} Enter Code: ${chalk_1.default.bold.bgWhite.black(` ${user_code} `)}`);
+        console.log(chalk_1.default.gray(`\n(Code expires in ${Math.floor(expires_in / 60)} minutes)`));
         await (0, open_1.default)(verification_url);
-        const pollSpinner = (0, ora_1.default)(chalk_1.default.blue("Waiting for authentication...")).start();
+        const pollSpinner = (0, ora_1.default)(chalk_1.default.blue("Waiting for browser confirmation...")).start();
         let tokens = null;
         const startTime = Date.now();
         while (Date.now() - startTime < expires_in * 1000) {
@@ -786,21 +835,22 @@ commander_1.program
                     break;
                 }
             }
-            catch (error) {
-                // Ignore temporary errors and continue polling
-            }
+            catch (e) { /* Poll interval logic */ }
             await new Promise((resolve) => setTimeout(resolve, interval * 1000));
         }
         if (tokens) {
-            pollSpinner.succeed(chalk_1.default.green("Login successful!"));
             saveToken(tokens);
+            pollSpinner.succeed(chalk_1.default.green("Authentication successful."));
+            console.log(chalk_1.default.gray("──────────────────────────────────────────────────────────────────"));
+            console.log(`\n${chalk_1.default.bold.white.bgGreen(" SUCCESS ")} ${chalk_1.default.green("You are now logged in.")}`);
+            console.log(`${chalk_1.default.gray("Token stored at:")} ${chalk_1.default.gray(TOKEN_FILE)}\n`);
         }
         else {
-            pollSpinner.fail(chalk_1.default.red("✗ Login failed: Timeout or user did not complete authentication."));
+            pollSpinner.fail(chalk_1.default.red("Login timed out or was cancelled."));
         }
     }
     catch (error) {
-        loginSpinner.fail(chalk_1.default.red(`✗ Login error: ${error.message}`));
+        loginSpinner.fail(chalk_1.default.red(`Login failed: ${error.message}`));
     }
 });
 commander_1.program
@@ -851,329 +901,171 @@ commander_1.program
         apiSpinner.fail(chalk_1.default.red(`✗ Error fetching project files: ${error.message}`));
     }
 });
-// be {{id}} --be --port {{port}}
 commander_1.program
     .command("fetch <id>")
-    .option("--port <port>", "Port to run the backend", "3000")
-    .option("--serve", "Flag to indicate serving the backend")
-    .option("--libs <libs>", "Additional libraries to install (comma-separated)", "")
-    .option("--be", "Flag to indicate backend")
-    .description("Open backend for the project")
-    .action(async (id, options) => {
-    var _a;
+    .description("Fetch Zalo Mini App template for the project")
+    .action(async (id) => {
     const { accessToken } = getStoredToken();
     if (!accessToken) {
         console.error(chalk_1.default.red("✗ You need to login first. Use 'hapico login' command."));
         return;
     }
-    console.log(chalk_1.default.cyan(`🌐 PORT = ${options.port}`));
-    // Chọn hỏi user port để vận hành
-    let port = 3000;
-    const response = await axios_1.default.get(`https://base.myworkbeast.com/api/views/${id}`);
-    const portInput = options.port;
-    if (portInput) {
-        const parsedPort = parseInt(portInput, 10);
-        if (!isNaN(parsedPort)) {
-            port = parsedPort;
-        }
-    }
-    const projectDir = path.resolve(process.cwd(), id);
-    if (!fs.existsSync(projectDir)) {
-        // create folder
-        fs.mkdirSync(projectDir);
-    }
-    // download template https://main.hcm04.vstorage.vngcloud.vn/templates/hapico/hapico-basic.zip
-    const TEMPLATE_URL = `https://main.hcm04.vstorage.vngcloud.vn/templates/hapico/be.zip?t=${Date.now()}`;
-    let templateResponse = undefined;
+    const apiSpinner = (0, ora_1.default)(chalk_1.default.blue("Fetching project data...")).start();
     try {
-        templateResponse = await axios_1.default.get(TEMPLATE_URL, {
+        const response = await axios_1.default.get(`https://base.myworkbeast.com/api/views/${id}`);
+        const projectType = response.data.type;
+        if (projectType !== "zalominiapp" && projectType !== "zalominiapp2") {
+            apiSpinner.fail(chalk_1.default.red(`✗ Error: Project type is "${projectType}". Only "zalominiapp" and "zalominiapp2" are supported for fetch command.`));
+            return;
+        }
+        apiSpinner.succeed(chalk_1.default.green("Project data fetched successfully!"));
+        const outputDir = path.resolve(process.cwd(), id);
+        const zaloDir = path.join(outputDir, "zalo");
+        const backendDir = path.join(outputDir, "backend");
+        const templateSpinner = (0, ora_1.default)(chalk_1.default.blue("Downloading Zalo template...")).start();
+        const TEMPLATE_URL = "https://hapico.hcm04.vstorage.vngcloud.vn/templates/zalominiapp_v0.zip";
+        const templateResponse = await axios_1.default.get(TEMPLATE_URL, {
             responseType: "arraybuffer",
         });
-    }
-    catch (error) {
-        console.error(chalk_1.default.red("✗ Error downloading template:"), error.message);
-        return;
-    }
-    const outputDir = path.resolve(process.cwd(), id);
-    if (!fs.existsSync(outputDir)) {
-        fs.mkdirSync(outputDir);
-    }
-    await unzipper_1.default.Open.buffer(templateResponse.data).then((directory) => directory.extract({ path: outputDir }));
-    const macosxDir = path.join(process.cwd(), id, "__MACOSX");
-    if (fs.existsSync(macosxDir)) {
-        fs.rmSync(macosxDir, { recursive: true, force: true });
-    }
-    // outputPath/src/server.ts có dòng (3006) thay thành port
-    const serverFile = path.join(process.cwd(), id, "src", "index.ts");
-    if (fs.existsSync(serverFile)) {
-        let serverContent = fs.readFileSync(serverFile, { encoding: "utf8" });
-        serverContent = serverContent.split("(3006)").join(`(${port})`);
-        fs.writeFileSync(serverFile, serverContent, { encoding: "utf8" });
-    }
-    // lấy danh sách migrations
-    const MIGRATIONS_URL = `https://base.myworkbeast.com/api/client/query?dbCode=${response.data.dbCode || response.data.db_code}&table=migration_logs&operation=select&columns=%5B%22*%22%5D`;
-    // Lấy danh sách các migration đã chạy
-    let migrations = [];
-    const migrationsResponse = await axios_1.default.get(MIGRATIONS_URL, {
-        headers: {
-            Authorization: `Bearer ${accessToken}`,
-            "Content-Type": "application/json",
-            "x-db-code": response.data.dbCode || response.data.db_code,
-        },
-    });
-    if (migrationsResponse.status === 200) {
-        migrations = (((_a = migrationsResponse.data.data) === null || _a === void 0 ? void 0 : _a.rows) || []).map((item) => ({
-            created_at: item.created_at,
-            sql: item.sql_statement,
-        }));
-    }
-    console.log(chalk_1.default.cyan(`🔍 Found ${migrations.length} migrations.`));
-    // Tạo thư mục migrations nếu chưa tồn tại
-    const migrationsDir = path.join(process.cwd(), id, "migrations");
-    if (!fs.existsSync(migrationsDir)) {
-        fs.mkdirSync(migrationsDir);
-    }
-    // Lưu từng migration vào file
-    migrations.forEach((migration, index) => {
-        const timestamp = new Date(migration.created_at)
-            .toISOString()
-            .replace(/[-:]/g, "")
-            .replace(/\..+/, "");
-        const filename = path.join(migrationsDir, `${index + 1}_migration_${timestamp}.sql`);
-        fs.writeFileSync(filename, migration.sql, {
-            encoding: "utf8",
+        templateSpinner.succeed(chalk_1.default.green("Zalo template downloaded successfully!"));
+        const backendSpinner = (0, ora_1.default)(chalk_1.default.blue("Downloading backend template...")).start();
+        const BACKEND_URL = "https://hapico.hcm04.vstorage.vngcloud.vn/templates/backend_v0.zip";
+        const backendResponse = await axios_1.default.get(BACKEND_URL, {
+            responseType: "arraybuffer",
         });
-    });
-    console.log(chalk_1.default.green("✓ Migrations saved successfully!"));
-    // Download project files and save to project
-    let files = [];
-    const apiSpinner = (0, ora_1.default)(chalk_1.default.blue("Fetching project data...")).start();
-    try {
-        apiSpinner.succeed(chalk_1.default.green("Project data fetched successfully!"));
-        const saveSpinner = (0, ora_1.default)(chalk_1.default.blue("Saving project files...")).start();
-        files.forEach((file) => {
-            // skip ./app, ./components
-            if (file.path.startsWith("./app") ||
-                file.path.startsWith("./components")) {
-                return;
-            }
-            // hoặc các file có đuôi là .tsx
-            if (file.path.endsWith(".tsx")) {
-                return;
-            }
-            try {
-                if (file.content.trim().length == 0)
-                    return;
-                const filePath = path.join(process.cwd(), id, "src", file.path);
-                const dir = path.dirname(filePath);
-                if (!fs.existsSync(dir)) {
-                    fs.mkdirSync(dir, { recursive: true });
-                }
-                fs.writeFileSync(filePath, file.content);
-            }
-            catch (error) {
-                console.log(chalk_1.default.red("✗ Error writing file"), file.path, error);
+        backendSpinner.succeed(chalk_1.default.green("Backend template downloaded successfully!"));
+        if (!fs.existsSync(outputDir)) {
+            fs.mkdirSync(outputDir, { recursive: true });
+        }
+        if (!fs.existsSync(zaloDir))
+            fs.mkdirSync(zaloDir, { recursive: true });
+        if (!fs.existsSync(backendDir))
+            fs.mkdirSync(backendDir, { recursive: true });
+        const unzipZaloSpinner = (0, ora_1.default)(chalk_1.default.blue("Extracting Zalo template...")).start();
+        await unzipper_1.default.Open.buffer(templateResponse.data).then((directory) => directory.extract({ path: zaloDir }));
+        unzipZaloSpinner.succeed(chalk_1.default.green("Zalo template extracted successfully!"));
+        const unzipBackendSpinner = (0, ora_1.default)(chalk_1.default.blue("Extracting backend template...")).start();
+        await unzipper_1.default.Open.buffer(backendResponse.data).then((directory) => directory.extract({ path: backendDir }));
+        unzipBackendSpinner.succeed(chalk_1.default.green("Backend template extracted successfully!"));
+        [zaloDir, backendDir].forEach((dir) => {
+            const macosxDir = path.join(dir, "__MACOSX");
+            if (fs.existsSync(macosxDir)) {
+                fs.rmSync(macosxDir, { recursive: true, force: true });
             }
-        });
-        saveSpinner.succeed(chalk_1.default.green("Project files saved successfully!"));
-    }
-    catch (error) {
-        apiSpinner.fail(chalk_1.default.red(`✗ Error cloning project: ${error.message}`));
-    }
-    // Download project files and save to project
-    console.log(chalk_1.default.green("✓ Project cloned successfully!"));
-    // Save project ID to hapico.config.json
-    saveProjectId(outputDir, id);
-    console.log(chalk_1.default.green("✓ Project setup successfully!"));
-    let serveProcess = null;
-    if (options.serve) {
-        // Run bun install
-        const { exec } = require("child_process");
-        const installSpinner = (0, ora_1.default)(chalk_1.default.blue("Installing dependencies...")).start();
-        // create a loop to check if there is new version of project
-        // https://main.hcm04.vstorage.vngcloud.vn/statics/{{id}}/version.json
-        let currentVersionStr = fs.existsSync(path.join(outputDir, "version.json"))
-            ? JSON.parse(fs.readFileSync(path.join(outputDir, "version.json"), {
-                encoding: "utf8",
-            })).version
-            : "0.0.1";
-        const checkVersion = async () => {
-            var _a, _b;
-            try {
-                // check if file version.json exists
-                const flyCheck = await axios_1.default.head(`https://statics.hcm04.vstorage.vngcloud.vn/${id}/version.json`);
-                if (flyCheck.status !== 200) {
-                    return;
-                }
-                // get file version.json
-                const versionResponse = await axios_1.default.get(`https://statics.hcm04.vstorage.vngcloud.vn/${id}/version.json`);
-                const latestVersionData = versionResponse.data;
-                const latestVersion = latestVersionData.version;
-                if (latestVersion !== currentVersionStr) {
-                    console.log(chalk_1.default.yellow(`📦 New version available: ${latestVersion}`));
-                    // Save new version.json
-                    fs.writeFileSync(path.join(outputDir, "version.json"), JSON.stringify(latestVersionData, null, 2), { encoding: "utf8" });
-                    // Install external libraries if any
-                    if (latestVersionData.external_libraries &&
-                        latestVersionData.external_libraries.length > 0) {
-                        console.log(chalk_1.default.blue("Installing new external libraries..."));
-                        for (const lib of latestVersionData.external_libraries) {
-                            try {
-                                await execPromise(`bun add ${lib}`, { cwd: outputDir });
-                                console.log(chalk_1.default.green(`Added ${lib}`));
-                            }
-                            catch (addError) {
-                                console.error(chalk_1.default.red(`✗ Error adding ${lib}:`), addError.message);
+            // Replace {{APP_ID}} in .ts and .tsx files
+            const traverseAndReplace = (currentDir) => {
+                fs.readdirSync(currentDir, { withFileTypes: true }).forEach((entry) => {
+                    const fullPath = path.join(currentDir, entry.name);
+                    if (entry.isDirectory()) {
+                        traverseAndReplace(fullPath);
+                    }
+                    else if (entry.isFile()) {
+                        const ext = path.extname(fullPath);
+                        if (ext === ".ts" || ext === ".tsx") {
+                            const content = fs.readFileSync(fullPath, { encoding: "utf8" });
+                            if (content.includes("{{APP_ID}}")) {
+                                const updatedContent = content.replace(/{{APP_ID}}/g, id);
+                                fs.writeFileSync(fullPath, updatedContent, {
+                                    encoding: "utf8",
+                                });
                             }
                         }
                     }
-                    // Rerun bun install
-                    try {
-                        await execPromise("bun install", { cwd: outputDir });
-                        console.log(chalk_1.default.green("Dependencies reinstalled successfully!"));
-                    }
-                    catch (installError) {
-                        console.error(chalk_1.default.red("✗ Error reinstalling dependencies:"), installError.message);
-                    }
-                    // Restart the process
-                    if (serveProcess && !serveProcess.killed) {
-                        console.log(chalk_1.default.blue("Restarting backend..."));
-                        serveProcess.kill("SIGTERM");
-                    }
-                    // Start new process
-                    const newServeProcess = exec("bun run start", { cwd: outputDir });
-                    (_a = newServeProcess.stdout) === null || _a === void 0 ? void 0 : _a.on("data", (data) => {
-                        process.stdout.write(data);
-                    });
-                    (_b = newServeProcess.stderr) === null || _b === void 0 ? void 0 : _b.on("data", (data) => {
-                        process.stderr.write(data);
-                    });
-                    newServeProcess.on("close", (code) => {
-                        console.log(chalk_1.default.yellow(`⚠ backend exited with code ${code}`));
-                    });
-                    serveProcess = newServeProcess;
-                    currentVersionStr = latestVersion;
-                }
-            }
-            catch (error) {
-                // If the remote version.json does not exist, do not update
-                console.error(chalk_1.default.yellow("⚠ Error checking for updates (skipping update):"), error.message);
-            }
-        };
-        // check every 3 seconds
-        setInterval(async () => await checkVersion(), 10 * 1000);
-        exec("bun install", { cwd: outputDir }, async (error, stdout, stderr) => {
-            if (error) {
-                installSpinner.fail(chalk_1.default.red(`✗ Error installing dependencies: ${error.message}`));
-                return;
-            }
-            if (stderr) {
-                console.error(chalk_1.default.red(`stderr: ${stderr}`));
-            }
-            installSpinner.succeed(chalk_1.default.green("Dependencies installed successfully!"));
-            // Install additional libraries if --libs is provided
-            if (options.libs && options.libs.trim()) {
-                const libsSpinner = (0, ora_1.default)(chalk_1.default.blue("Installing additional libraries...")).start();
-                const additionalLibs = options.libs
-                    .split(",")
-                    .map((lib) => lib.trim())
-                    .filter((lib) => lib);
-                for (const lib of additionalLibs) {
-                    try {
-                        await execPromise(`bun add ${lib}`, { cwd: outputDir });
-                        console.log(chalk_1.default.green(`Added ${lib}`));
-                    }
-                    catch (addError) {
-                        console.error(chalk_1.default.red(`✗ Error adding ${lib}:`), addError.message);
-                    }
-                }
-                libsSpinner.succeed(chalk_1.default.green("Additional libraries installed successfully!"));
-            }
-            // Run cd ${id} && bun run serve-be
-            console.log(chalk_1.default.blue("🚀 Starting backend"));
-            serveProcess = exec("bun run start", { cwd: outputDir });
-            serveProcess.stdout.on("data", (data) => {
-                process.stdout.write(data);
-            });
-            serveProcess.stderr.on("data", (data) => {
-                process.stderr.write(data);
-            });
-            serveProcess.on("close", (code) => {
-                console.log(chalk_1.default.yellow(`⚠ backend exited with code ${code}`));
-            });
+                });
+            };
+            traverseAndReplace(dir);
         });
+        // Save project ID
+        saveProjectId(outputDir, id);
+        console.log(chalk_1.default.green(`✓ Project "${id}" fetched and setup successfully!`));
+    }
+    catch (error) {
+        apiSpinner.fail(chalk_1.default.red(`✗ Error: ${error.message}`));
     }
 });
 // hapico publish
-commander_1.program.command("publish").action(async () => {
-    const publishSpinner = (0, ora_1.default)(chalk_1.default.blue("Publishing to Hapico...")).start();
+commander_1.program
+    .command("publish")
+    .description("Publish the project to production environment")
+    .action(async () => {
+    console.clear();
+    console.log(chalk_1.default.bold.magenta("\n🚀 HAPICO PUBLISH PIPELINE"));
+    console.log(chalk_1.default.gray("──────────────────────────────────────────────────────────────────"));
     const pwd = process.cwd();
     const { projectId, replicate } = getStoredProjectId(pwd);
     if (!projectId) {
-        publishSpinner.fail(chalk_1.default.red("✗ Project ID not found. Please ensure hapico.config.json exists in the project directory."));
+        console.log(chalk_1.default.red("✗ Project ID not found. Ensure hapico.config.json exists."));
         return;
     }
-    // Step 1: Push source code to main project and replicas
-    const pushSuccess = await pushProject(publishSpinner, projectId);
-    if (!pushSuccess) {
-        return; // Stop if push to main project fails
+    console.log(chalk_1.default.bold.white("Target Environments:"));
+    console.log(`${chalk_1.default.gray("├─")} ${chalk_1.default.bold("Main Project :")} ${chalk_1.default.magenta(projectId)}`);
+    if (replicate && replicate.length > 0) {
+        console.log(`${chalk_1.default.gray("└─")} ${chalk_1.default.bold("Replicas     :")} ${chalk_1.default.magenta(replicate.join(", "))}`);
+    }
+    else {
+        console.log(`${chalk_1.default.gray("└─")} ${chalk_1.default.bold("Replicas     :")} ${chalk_1.default.gray("None")}`);
+    }
+    console.log("");
+    const pushSpinner = (0, ora_1.default)(chalk_1.default.blue("Phase 1/2: Syncing source code with main project...")).start();
+    // Step 1: Push Main
+    const mainResult = await pushProject(projectId);
+    if (mainResult.success) {
+        pushSpinner.succeed(chalk_1.default.green(`Main Project [${projectId}] code synced successfully.`));
+        console.log(`${chalk_1.default.gray("   ├─")} ${chalk_1.default.bold("Files :")} ${chalk_1.default.white(mainResult.fileCount)}`);
+        console.log(`${chalk_1.default.gray("   └─")} ${chalk_1.default.bold("Size  :")} ${chalk_1.default.white((mainResult.totalSize / 1024).toFixed(2) + " KB")}\n`);
     }
-    // Push to replicated projects
+    else {
+        pushSpinner.fail(chalk_1.default.red(`Main Project [${projectId}] sync failed: ${mainResult.error}`));
+        return; // Stop if push to main fails
+    }
+    // Push Replicas
     let allPushSuccess = true;
-    if (replicate && Array.isArray(replicate) && replicate.length > 0) {
-        publishSpinner.text = chalk_1.default.blue("Pushing to replicated projects...");
+    if (replicate && replicate.length > 0) {
         for (const repId of replicate) {
-            const success = await pushProject(publishSpinner, repId);
-            if (!success) {
-                allPushSuccess = false;
-                console.warn(chalk_1.default.yellow(`⚠ Failed to push to replicated project ${repId}. Continuing...`));
+            const repSpinner = (0, ora_1.default)(chalk_1.default.blue(`Phase 1/2: Syncing replica code [${repId}]...`)).start();
+            const repResult = await pushProject(repId);
+            if (repResult.success) {
+                repSpinner.succeed(chalk_1.default.green(`Replica [${repId}] code synced successfully.`));
+                console.log(`${chalk_1.default.gray("   ├─")} ${chalk_1.default.bold("Files :")} ${chalk_1.default.white(repResult.fileCount)}`);
+                console.log(`${chalk_1.default.gray("   └─")} ${chalk_1.default.bold("Size  :")} ${chalk_1.default.white((repResult.totalSize / 1024).toFixed(2) + " KB")}\n`);
             }
             else {
-                console.log(chalk_1.default.green(`✓ Successfully pushed to replicated project ${repId}.`));
+                repSpinner.fail(chalk_1.default.red(`Replica [${repId}] sync failed: ${repResult.error}`));
+                allPushSuccess = false;
             }
         }
     }
-    // Step 2: Publish main project
-    const { accessToken } = getStoredToken();
-    const apiUrl = "https://base.myworkbeast.com/api/views/publish/v2";
+    // Step 2: Publish Main
+    const publishSpinner = (0, ora_1.default)(chalk_1.default.blue(`Phase 2/2: Publishing main project [${projectId}]...`)).start();
+    const pubMainResult = await publishProjectApi(projectId);
     let allPublishSuccess = true;
-    try {
-        await axios_1.default.post(apiUrl, { view_id: parseInt(projectId, 10) }, {
-            headers: {
-                Authorization: `Bearer ${accessToken}`,
-                "Content-Type": "application/json",
-            },
-        });
-        publishSpinner.succeed(chalk_1.default.green(`Project ${projectId} published successfully!`));
+    if (pubMainResult.success) {
+        publishSpinner.succeed(chalk_1.default.green(`Main Project [${projectId}] published successfully.`));
     }
-    catch (error) {
+    else {
+        publishSpinner.fail(chalk_1.default.red(`Main Project [${projectId}] publish failed: ${pubMainResult.error}`));
         allPublishSuccess = false;
-        publishSpinner.fail(chalk_1.default.red(`✗ Error publishing project ${projectId}: ${error.message}`));
     }
-    // Step 3: Publish replicated projects
-    if (replicate && Array.isArray(replicate) && replicate.length > 0) {
-        publishSpinner.text = chalk_1.default.blue("Publishing replicated projects...");
+    // Publish Replicas
+    if (replicate && replicate.length > 0) {
         for (const repId of replicate) {
-            try {
-                await axios_1.default.post(apiUrl, { view_id: parseInt(repId, 10) }, {
-                    headers: {
-                        Authorization: `Bearer ${accessToken}`,
-                        "Content-Type": "application/json",
-                    },
-                });
-                console.log(chalk_1.default.green(`✓ Successfully published replicated project ${repId}.`));
+            const repPubSpinner = (0, ora_1.default)(chalk_1.default.blue(`Phase 2/2: Publishing replica [${repId}]...`)).start();
+            const pubRepResult = await publishProjectApi(repId);
+            if (pubRepResult.success) {
+                repPubSpinner.succeed(chalk_1.default.green(`Replica [${repId}] published successfully.`));
             }
-            catch (error) {
+            else {
+                repPubSpinner.fail(chalk_1.default.red(`Replica [${repId}] publish failed: ${pubRepResult.error}`));
                 allPublishSuccess = false;
-                console.warn(chalk_1.default.yellow(`⚠ Error publishing replicated project ${repId}: ${error.message}`));
             }
         }
     }
+    console.log(chalk_1.default.gray("──────────────────────────────────────────────────────────────────"));
     if (allPushSuccess && allPublishSuccess) {
-        publishSpinner.succeed(chalk_1.default.green("All projects published successfully!"));
+        console.log(`\n${chalk_1.default.bold.white.bgGreen(" SUCCESS ")} ${chalk_1.default.green("Deployment pipeline completed successfully!\n")}`);
     }
     else {
-        publishSpinner.warn(chalk_1.default.yellow("Publishing completed with some errors."));
+        console.log(`\n${chalk_1.default.bold.white.bgYellow(" WARNING ")} ${chalk_1.default.yellow("Deployment pipeline completed with some errors.\n")}`);
     }
 });
 commander_1.program.command("mirror").action(() => {
@@ -1186,7 +1078,7 @@ commander_1.program.command("mirror").action(() => {
     }
     const fileManager = new FileManager(srcDir);
     const initialFiles = fileManager.listFiles();
-    // Lấy danh sách file và viết ra 1 file .txt
+    // Collect project files and generate a single summary document
     let content = ``;
     (0, lodash_1.map)(initialFiles, (file) => {
         content += `\`\`\`typescript