@hapico/cli 0.0.2

package/index.ts

@@ -0,0 +1,553 @@
+#!/usr/bin/env node
+
+import { program } from "commander";
+import axios from "axios";
+import * as fs from "fs";
+import * as path from "path";
+import unzipper from "unzipper";
+import ora, { Ora } from "ora";
+import { WebSocket } from "ws";
+import * as Babel from "@babel/standalone";
+import QRCode from "qrcode-terminal";
+import open from "open";
+
+// Directory to store the token and project config
+const CONFIG_DIR = path.join(
+  process.env.HOME || process.env.USERPROFILE || ".",
+  ".hapico"
+);
+const TOKEN_FILE = path.join(CONFIG_DIR, "auth_token.json");
+
+// Ensure config directory exists
+if (!fs.existsSync(CONFIG_DIR)) {
+  fs.mkdirSync(CONFIG_DIR, { recursive: true });
+}
+
+// Function to save token
+const saveToken = (token: string) => {
+  fs.writeFileSync(
+    TOKEN_FILE,
+    JSON.stringify({ access_token: token }, null, 2),
+    {
+      encoding: "utf8",
+    }
+  );
+};
+
+// Function to get stored token
+const getStoredToken = (): string | null => {
+  if (fs.existsSync(TOKEN_FILE)) {
+    const data = fs.readFileSync(TOKEN_FILE, { encoding: "utf8" });
+    const json = JSON.parse(data);
+    return json.access_token || null;
+  }
+  return null;
+};
+
+// Function to save project ID
+const saveProjectId = (projectDir: string, id: string) => {
+  const configFile = path.join(projectDir, "hapico.config.json");
+  fs.writeFileSync(
+    configFile,
+    JSON.stringify({ projectId: id }, null, 2),
+    { encoding: "utf8" }
+  );
+};
+
+// Function to get stored project ID
+const getStoredProjectId = (projectDir: string): string | null => {
+  const configFile = path.join(projectDir, "hapico.config.json");
+  if (fs.existsSync(configFile)) {
+    const data = fs.readFileSync(configFile, { encoding: "utf8" });
+    const json = JSON.parse(data);
+    return json.projectId || null;
+  }
+  return null;
+};
+
+// Khởi tạo cache bằng Map để lưu trữ kết quả compile
+const compileCache = new Map<string, string>();
+
+interface FileContent {
+  path: string;
+  content: string;
+  es5?: string;
+}
+
+interface ApiResponse {
+  data: {
+    files?: FileContent[];
+  };
+}
+
+interface RoomStateData {
+  [key: string]: any;
+}
+
+interface WebSocketMessage {
+  type: string;
+  state?: RoomStateData;
+}
+
+export const compileES5 = (code: string, filePath?: string) => {
+  if (filePath && !filePath.endsWith(".ts") && !filePath.endsWith(".tsx")) {
+    return code;
+  }
+
+  if (compileCache.has(code)) {
+    return compileCache.get(code)!;
+  }
+  try {
+    const result = Babel.transform(code, {
+      presets: [
+        ["env", { targets: { esmodules: false } }],
+        "typescript",
+        "react",
+      ],
+      filename: "file.tsx",
+    });
+
+    compileCache.set(code, result.code || "");
+    return result.code;
+  } catch (error) {
+    return "";
+  }
+};
+
+class FileManager {
+  private basePath: string;
+  private onFileChange?: (filePath: string, content: string) => void;
+  private watcher?: fs.FSWatcher;
+
+  constructor(
+    basePath: string,
+    onFileChange?: (filePath: string, content: string) => void
+  ) {
+    this.basePath = basePath;
+    this.onFileChange = onFileChange;
+  }
+
+  public syncFiles(files: FileContent[]): void {
+    for (const file of files) {
+      this.writeFile(file);
+    }
+  }
+
+  public listFiles(): FileContent[] {
+    const files: FileContent[] = [];
+    const traverseDirectory = (dir: string) => {
+      fs.readdirSync(dir, { withFileTypes: true }).forEach((entry) => {
+        const fullPath = path.join(dir, entry.name);
+        if (entry.isDirectory()) {
+          traverseDirectory(fullPath);
+        } else if (entry.isFile()) {
+          const content = fs.readFileSync(fullPath, { encoding: "utf8" });
+          files.push({
+            path: fullPath.replace(this.basePath + path.sep, "./"),
+            content,
+            es5: compileES5(content, fullPath) ?? "",
+          });
+        }
+      });
+    };
+    traverseDirectory(this.basePath);
+    return files;
+  }
+
+  private writeFile(file: FileContent): void {
+    try {
+      const fullPath = path.join(this.basePath, file.path);
+      const dir = path.dirname(fullPath);
+      fs.mkdirSync(dir, { recursive: true });
+
+      let hasChanged = true;
+      if (fs.existsSync(fullPath)) {
+        try {
+          const existingContent = fs.readFileSync(fullPath, {
+            encoding: "utf8",
+          });
+          hasChanged = existingContent !== file.content;
+        } catch (readError) {
+          console.warn(
+            `Warning: Could not read existing file ${fullPath}, treating as changed:`,
+            readError
+          );
+          hasChanged = true;
+        }
+      }
+
+      if (hasChanged) {
+        fs.writeFileSync(fullPath, file.content, { encoding: "utf8" });
+      }
+    } catch (error) {
+      console.error(`Error processing file ${file.path}:`, error);
+      throw error;
+    }
+  }
+
+  private startWatching(): void {
+    if (!this.onFileChange) {
+      return;
+    }
+
+    try {
+      this.watcher = fs.watch(
+        this.basePath,
+        { recursive: true },
+        (eventType, filename) => {
+          if (filename && eventType === "change") {
+            const fullPath = path.join(this.basePath, filename);
+            try {
+              const stats = fs.statSync(fullPath);
+              if (stats.isFile()) {
+                const content = fs.readFileSync(fullPath, { encoding: "utf8" });
+                this.onFileChange!(fullPath, content);
+              }
+            } catch (error) {
+              console.warn(`Error reading changed file ${fullPath}:`, error);
+            }
+          }
+        }
+      );
+    } catch (error) {
+      // console.error(`Error setting up file watcher for ${this.basePath}:`, error);
+    }
+  }
+
+  public setOnFileChange(
+    callback: (filePath: string, content: string) => void
+  ): void {
+    this.onFileChange = callback;
+    if (!this.watcher && (callback as any)) {
+      this.startWatching();
+    }
+  }
+
+  public stopWatching(): void {
+    if (this.watcher) {
+      this.watcher.close();
+      this.watcher = undefined;
+    }
+  }
+}
+
+class RoomState {
+  private roomId: string;
+  private state: RoomStateData;
+  private isConnected: boolean;
+  private ws: WebSocket | null;
+  private reconnectTimeout: NodeJS.Timeout | null;
+  private reconnectAttempts: number;
+
+  public files: FileContent[] = [];
+
+  constructor(roomId: string) {
+    this.roomId = roomId;
+    this.state = {};
+    this.isConnected = false;
+    this.ws = null;
+    this.reconnectTimeout = null;
+    this.reconnectAttempts = 0;
+  }
+
+  connect(onConnected?: () => void): void {
+    if (this.ws && this.ws.readyState === WebSocket.OPEN) return;
+
+    if (this.reconnectTimeout) {
+      clearTimeout(this.reconnectTimeout);
+    }
+
+    this.ws = new WebSocket(
+      `https://base.myworkbeast.com/ws?room=${this.roomId}`
+    );
+
+    this.ws.on("open", () => {
+      this.isConnected = true;
+      this.reconnectAttempts = 0;
+      onConnected?.();
+    });
+
+    this.ws.on("close", () => {
+      this.isConnected = false;
+
+      this.reconnectAttempts++;
+      const delay = Math.min(1000 * Math.pow(2, this.reconnectAttempts), 30000);
+      console.log(`Attempting to reconnect in ${delay / 1000}s...`);
+
+      this.reconnectTimeout = setTimeout(() => this.connect(), delay);
+    });
+
+    this.ws.on("message", (data: Buffer) => {
+      try {
+        const message: WebSocketMessage = JSON.parse(data.toString());
+        if (message.type === "state" && message.state) {
+          this.state = message.state;
+          const view = this.state.view as Array<FileContent>;
+          this.files = view;
+        }
+      } catch (e) {
+        console.error("Error processing message:", e);
+      }
+    });
+
+    this.ws.on("error", (err: Error) => {
+      console.error("WebSocket error:", err);
+      this.ws?.close();
+    });
+  }
+
+  updateState(key: string, value: any): void {
+    if (this.ws && this.ws.readyState === WebSocket.OPEN) {
+      this.ws.send(
+        JSON.stringify({
+          type: "update",
+          state: { [key]: value },
+        })
+      );
+    } else {
+      console.log("Cannot update state: Not connected");
+    }
+  }
+
+  disconnect(): void {
+    if (this.reconnectTimeout) {
+      clearTimeout(this.reconnectTimeout);
+    }
+    if (this.ws) {
+      this.ws.removeAllListeners("close");
+      this.ws.close();
+    }
+  }
+
+  getState(): RoomStateData {
+    return this.state;
+  }
+
+  getIsConnected(): boolean {
+    return this.isConnected;
+  }
+}
+
+program.version("1.0.0").description("Hapico CLI for project management");
+
+program
+  .command("clone <id>")
+  .description("Clone a project by ID")
+  .action(async (id: string) => {
+    const token = getStoredToken();
+    if (!token) {
+      console.error("You need to login first. Use 'hapico login' command.");
+      return;
+    }
+    const projectDir: string = path.resolve(process.cwd(), id);
+    if (fs.existsSync(projectDir)) {
+      console.error(`Project directory "${id}" already exists.`);
+      return;
+    }
+
+    let files: FileContent[] = [];
+    const apiSpinner: Ora = ora("Fetching project data...").start();
+
+    try {
+      const response: ApiResponse = await axios.get(
+        `https://base.myworkbeast.com/api/views/${id}`
+      );
+      files = response.data.files || [];
+      apiSpinner.succeed("Project data fetched successfully!");
+
+      const templateSpinner: Ora = ora("Downloading template...").start();
+      const TEMPLATE_URL: string =
+        "https://files.hcm04.vstorage.vngcloud.vn/assets/template_zalominiapp_devmode.zip";
+      const templateResponse = await axios.get(TEMPLATE_URL, {
+        responseType: "arraybuffer",
+      });
+      templateSpinner.succeed("Template downloaded successfully!");
+
+      const outputDir: string = path.resolve(process.cwd(), id);
+      if (!fs.existsSync(outputDir)) {
+        fs.mkdirSync(outputDir);
+      }
+
+      const unzipSpinner: Ora = ora("Extracting template...").start();
+      await unzipper.Open.buffer(templateResponse.data).then((directory) =>
+        directory.extract({ path: outputDir })
+      );
+      unzipSpinner.succeed("Template extracted successfully!");
+
+      const macosxDir: string = path.join(process.cwd(), id, "__MACOSX");
+      if (fs.existsSync(macosxDir)) {
+        fs.rmSync(macosxDir, { recursive: true, force: true });
+      }
+
+      // Save project ID to hapico.config.json
+      saveProjectId(outputDir, id);
+
+      console.log("Project cloned successfully!");
+
+      const saveSpinner: Ora = ora("Saving project files...").start();
+      files.forEach((file: FileContent) => {
+        const filePath: string = path.join(process.cwd(), id, "src", file.path);
+        const dir: string = path.dirname(filePath);
+
+        if (!fs.existsSync(dir)) {
+          fs.mkdirSync(dir, { recursive: true });
+        }
+
+        fs.writeFileSync(filePath, file.content);
+      });
+      saveSpinner.succeed("Project files saved successfully!");
+      console.log(
+        `Run 'cd ${id} && npm install && hapico dev' to start the project.`
+      );
+    } catch (error: any) {
+      apiSpinner.fail(`Error cloning project: ${error.message}`);
+    }
+  });
+
+program
+  .command("dev")
+  .description("Start the project in development mode")
+  .action(() => {
+    const token = getStoredToken();
+    if (!token) {
+      console.error("You need to login first. Use 'hapico login' command.");
+      return;
+    }
+    const devSpinner: Ora = ora(
+      "Starting the project in development mode..."
+    ).start();
+    const pwd: string = process.cwd();
+    const srcDir: string = path.join(pwd, "src");
+    if (!fs.existsSync(srcDir)) {
+      devSpinner.fail(
+        "Source directory 'src' does not exist. Please clone a project first."
+      );
+      return;
+    }
+    const projectId = getStoredProjectId(pwd);
+    if (!projectId) {
+      devSpinner.fail(
+        "Project ID not found. Please ensure hapico.config.json exists in the project directory."
+      );
+      return;
+    }
+    console.log(`Connecting to WebSocket server for room: ${projectId}`);
+    const room = new RoomState(`view_${projectId}`);
+
+    room.connect(async () => {
+      devSpinner.succeed("Project started in development mode!");
+
+      const fileManager = new FileManager(srcDir);
+
+      const initialFiles = fileManager.listFiles();
+      room.updateState("view", initialFiles);
+
+      fileManager.setOnFileChange((filePath: string, content: string) => {
+        const es5 = compileES5(content, filePath);
+        console.log(`File changed: ${filePath?.replace(srcDir, ".")}`);
+        const updatedView = room.files.map((file) => {
+          if (path.join(srcDir, file.path) === filePath) {
+            return { ...file, content, es5 };
+          }
+          return file;
+        });
+        room.updateState("view", updatedView);
+      });
+
+      QRCode.generate(
+        `https://zalo.me/s/3218692650896662017/player/${projectId}`,
+        { small: true },
+        (qrcode: string) => {
+          console.log("Scan this QR code to connect to the project:");
+          console.log(qrcode);
+        }
+      );
+    });
+  });
+
+program
+  .command("publish")
+  .description("Publish the project source code to the server")
+  .action(() => {
+    const token = getStoredToken();
+    if (!token) {
+      console.error("You need to login first. Use 'hapico login' command.");
+      return;
+    }
+    const saveSpinner: Ora = ora("Saving project source code...").start();
+    const pwd = process.cwd();
+    const projectId = getStoredProjectId(pwd);
+    if (!projectId) {
+      saveSpinner.fail(
+        "Project ID not found. Please ensure hapico.config.json exists in the project directory."
+      );
+      return;
+    }
+    const srcDir: string = path.join(pwd, "src");
+    if (!fs.existsSync(srcDir)) {
+      saveSpinner.fail(
+        "Source directory 'src' does not exist. Please clone a project first."
+      );
+      return;
+    }
+    const fileManager = new FileManager(srcDir);
+    const files = fileManager.listFiles();
+    const apiUrl = `https://base.myworkbeast.com/api/views/${projectId}`;
+    axios
+      .put(
+        apiUrl,
+        {
+          code: JSON.stringify({
+            files,
+          }),
+        },
+        {
+          headers: {
+            Authorization: `Bearer ${token}`,
+            "Content-Type": "application/json",
+          },
+        }
+      )
+      .then(() => {
+        saveSpinner.succeed("Project source code saved successfully!");
+      })
+      .catch((error) => {
+        saveSpinner.fail(`Error saving project: ${error.message}`);
+      });
+  });
+
+program
+  .command("login")
+  .description("Login to the system")
+  .action(() => {
+    const token = getStoredToken();
+    if (token) {
+      console.log("You are already logged in.");
+      return;
+    }
+    const readline = require("readline").createInterface({
+      input: process.stdin,
+      output: process.stdout,
+    });
+
+    readline.question("Please enter your token: ", (inputToken: string) => {
+      saveToken(inputToken);
+      console.log("Login successful!");
+      readline.close();
+    });
+  });
+
+program
+  .command("logout")
+  .description("Logout from the system")
+  .action(() => {
+    const token = getStoredToken();
+    if (!token) {
+      console.log("You are not logged in.");
+      return;
+    }
+    fs.unlinkSync(TOKEN_FILE);
+    console.log("Logout successful!");
+  });
+
+program.parse(process.argv);

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@hapico/cli",
+  "version": "0.0.2",
+  "description": "A simple CLI tool for project management",
+  "main": "index.js",
+  "bin": {
+    "hapico": "./bin/index.js"
+  },
+  "scripts": {
+    "build": "tsc && cp -r dist/* ./bin/",
+    "start": "node dist/index.js"
+  },
+  "keywords": [
+    "cli",
+    "hapico",
+    "project-management"
+  ],
+  "author": "Your Name",
+  "license": "MIT",
+  "dependencies": {
+    "@babel/standalone": "^7.28.2",
+    "axios": "^1.11.0",
+    "commander": "^14.0.0",
+    "open": "^10.2.0",
+    "ora": "^8.2.0",
+    "qrcode-terminal": "^0.12.0",
+    "unzipper": "^0.12.3",
+    "ws": "^8.18.3"
+  },
+  "devDependencies": {
+    "@types/commander": "^2.12.5",
+    "@types/node": "^24.1.0",
+    "@types/unzipper": "^0.10.11",
+    "typescript": "^5.8.3"
+  }
+}

package/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "target": "es2018",
+    "module": "commonjs",
+    "outDir": "./dist",
+    "rootDir": "./",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true
+  },
+  "include": ["**/*.ts"],
+  "exclude": ["node_modules", "dist"]
+}