onflyt-cli 1.0.1-beta.2 → 1.0.1-beta.3

package/dist/commands/deploy.js

@@ -0,0 +1,715 @@
+import React, { useEffect, useState, useCallback } from "react";
+import { Box, Text, useInput } from "ink";
+import { readFileSync, existsSync } from "fs";
+import { isLoggedIn } from "../lib/config.js";
+import { GitDetector } from "../lib/git.js";
+import { INSTANCE_OPTIONS, isPodProject, getProjectConfig, loadTeamsWithBalances, getTeamDetails, getTeamLimits, getTeamPlanLabel, findOrCreateProject, updateProjectSettings, getProjectDetails, startDeployment, getDeploymentStatus, streamLogs, } from "../lib/deploy-api.js";
+import { TIER_HOURLY_PRICE } from "../shared";
+import { api } from "../lib/api.js";
+const Deploy = ({ teamFlag }) => {
+    const [step, setStep] = useState("loading");
+    const [errorMsg, setErrorMsg] = useState("");
+    useEffect(() => {
+        const handleSigInt = () => process.exit(0);
+        process.on("SIGINT", handleSigInt);
+        return () => {
+            process.off("SIGINT", handleSigInt);
+        };
+    }, []);
+    useEffect(() => {
+        if (step === "done" || step === "error") {
+            const timer = setTimeout(() => process.exit(0), 500);
+            return () => clearTimeout(timer);
+        }
+    }, [step]);
+    const [teams, setTeams] = useState([]);
+    const [selectedTeamIndex, setSelectedTeamIndex] = useState(0);
+    const [balances, setBalances] = useState({});
+    const [projectConfig, setProjectConfig] = useState(null);
+    const [selectedInstanceIndex, setSelectedInstanceIndex] = useState(2);
+    const [replicas, setReplicas] = useState(1);
+    const [envVars, setEnvVars] = useState([]);
+    const [envMessage, setEnvMessage] = useState("");
+    const [deploymentId, setDeploymentId] = useState("");
+    const [deploymentStatus, setDeploymentStatus] = useState("queued");
+    const [liveLogs, setLiveLogs] = useState([]);
+    const [previewUrl, setPreviewUrl] = useState("");
+    const [liveUrl, setLiveUrl] = useState("");
+    const [projectId, setProjectId] = useState("");
+    const [dotCount, setDotCount] = useState(0);
+    const [existingProject, setExistingProject] = useState(null);
+    const [isNewProject, setIsNewProject] = useState(false);
+    const [projectInstanceSize, setProjectInstanceSize] = useState("");
+    const [projectReplicas, setProjectReplicas] = useState(1);
+    const [totalLifetimeSpend, setTotalLifetimeSpend] = useState(0);
+    const [currentBalance, setCurrentBalance] = useState({ balanceUSD: 0, balanceFormatted: "$0.00" });
+    const [hasGitRemote, setHasGitRemote] = useState(false);
+    const [deployStage, setDeployStage] = useState("starting");
+    const [uploadProgress, setUploadProgress] = useState({
+        uploaded: 0,
+        total: 0,
+    });
+    const [zipSize, setZipSize] = useState(null);
+    const selectedTeam = teams[selectedTeamIndex];
+    const limits = getTeamLimits(totalLifetimeSpend);
+    const planLabel = getTeamPlanLabel(totalLifetimeSpend);
+    const needsPod = isPodProject(projectConfig?.framework);
+    const selectedInstance = INSTANCE_OPTIONS[selectedInstanceIndex];
+    const estimatedHourlyCost = needsPod && selectedInstance
+        ? TIER_HOURLY_PRICE[selectedInstance.id] * replicas
+        : null;
+    const formatEstimatedCost = (cost) => {
+        if (cost === 0)
+            return "Free";
+        return `$${cost.toFixed(3)}/hr`;
+    };
+    useEffect(() => {
+        if (step !== "loading")
+            return;
+        if (!isLoggedIn()) {
+            setErrorMsg("Not logged in. Run 'onflyt login' first.");
+            setStep("error");
+            return;
+        }
+        const config = getProjectConfig();
+        if (!config) {
+            setErrorMsg("No onflyt.json found. Run 'onflyt init' first.");
+            setStep("error");
+            return;
+        }
+        setProjectConfig(config);
+        const loadData = async () => {
+            try {
+                const gitDetector = new GitDetector(process.cwd());
+                const gitInfo = await gitDetector.detect();
+                setHasGitRemote(gitInfo.isGitRepo && gitInfo.remotes.length > 0);
+                const { teams: loadedTeams, balances: loadedBalances } = await loadTeamsWithBalances();
+                setTeams(loadedTeams);
+                setBalances(loadedBalances);
+                const selectedIdx = teamFlag
+                    ? loadedTeams.findIndex((t) => t.team.id === teamFlag || t.team.slug === teamFlag)
+                    : 0;
+                if (selectedIdx >= 0)
+                    setSelectedTeamIndex(selectedIdx);
+                const selectedTeamForProject = loadedTeams[selectedIdx >= 0 ? selectedIdx : 0];
+                if (selectedTeamForProject) {
+                    try {
+                        const teamDetails = await getTeamDetails(selectedTeamForProject.team.id);
+                        setTotalLifetimeSpend(teamDetails.totalLifetimeSpend);
+                        setCurrentBalance({
+                            balanceUSD: teamDetails.balanceUSD,
+                            balanceFormatted: loadedBalances[selectedTeamForProject.team.id]
+                                ?.balanceFormatted || "$0.00",
+                        });
+                    }
+                    catch {
+                        setTotalLifetimeSpend(0);
+                        setCurrentBalance(loadedBalances[selectedTeamForProject.team.id] || {
+                            balanceUSD: 0,
+                            balanceFormatted: "$0.00",
+                        });
+                    }
+                    try {
+                        const projectsRes = await api.get(`/projects/team/${selectedTeamForProject.team.id}`);
+                        const existingProject = (projectsRes.projects || []).find((p) => p.name === config.name);
+                        if (existingProject) {
+                            const fullProject = await getProjectDetails(existingProject.id);
+                            setExistingProject(fullProject);
+                            setProjectId(fullProject.id);
+                            setIsNewProject(false);
+                            setProjectInstanceSize(fullProject.instanceSize || "micro");
+                            setProjectReplicas(fullProject.maxInstances || 1);
+                            const instanceIdx = INSTANCE_OPTIONS.findIndex((i) => i.id === (fullProject.instanceSize || "micro"));
+                            setSelectedInstanceIndex(instanceIdx >= 0 ? instanceIdx : 2);
+                        }
+                        else {
+                            setIsNewProject(true);
+                        }
+                    }
+                    catch {
+                        setIsNewProject(true);
+                    }
+                }
+                setStep("team");
+            }
+            catch (err) {
+                setErrorMsg(err.message || "Failed to load data");
+                setStep("error");
+            }
+        };
+        loadData();
+    }, [step, teamFlag]);
+    useEffect(() => {
+        if (step !== "deploying")
+            return;
+        if (deploymentStatus === "deployed" || deploymentStatus === "failed")
+            return;
+        const interval = setInterval(() => {
+            setDotCount((c) => (c + 1) % 4);
+        }, 500);
+        return () => clearInterval(interval);
+    }, [step, deploymentStatus]);
+    const handleDeploy = useCallback(async () => {
+        if (!selectedTeam || !projectConfig)
+            return;
+        try {
+            const project = await findOrCreateProject(selectedTeam.team.id, projectConfig.name, projectConfig.framework, projectConfig.gitRepoUrl);
+            if (!project.isNew) {
+                const fullProject = await getProjectDetails(project.id);
+                setExistingProject(fullProject);
+                setProjectId(project.id);
+                setIsNewProject(false);
+                const existingSize = fullProject.instanceSize || "micro";
+                const existingReplicas = fullProject.maxInstances || 1;
+                setProjectInstanceSize(existingSize);
+                setProjectReplicas(existingReplicas);
+                if (needsPod) {
+                    const instanceIdx = INSTANCE_OPTIONS.findIndex((i) => i.id === existingSize);
+                    setSelectedInstanceIndex(instanceIdx >= 0 ? instanceIdx : 2);
+                    setReplicas(existingReplicas);
+                    setStep("instance");
+                }
+                else {
+                    setStep("env");
+                }
+            }
+            else {
+                setProjectId(project.id);
+                setIsNewProject(true);
+                if (needsPod) {
+                    setStep("instance");
+                }
+                else {
+                    setStep("env");
+                }
+            }
+        }
+        catch (err) {
+            setErrorMsg(err.message);
+            setStep("error");
+        }
+    }, [selectedTeam, projectConfig, needsPod]);
+    const triggerDeployment = useCallback(async (projId) => {
+        setStep("deploying");
+        setDeployStage("starting");
+        setUploadProgress({ uploaded: 0, total: 0 });
+        setZipSize(null);
+        const hasConfiguredGit = !!projectConfig?.gitRepoUrl;
+        if (hasConfiguredGit) {
+            try {
+                const depId = await startDeployment(projId, projectConfig?.gitBranch || "main", needsPod ? selectedInstance?.id : undefined, needsPod ? replicas : undefined, envVars.length > 0 ? envVars : undefined);
+                setDeploymentId(depId);
+                pollStatus(depId);
+            }
+            catch (err) {
+                setStep("error");
+                setErrorMsg(err.message);
+            }
+            return;
+        }
+        const { join } = await import("path");
+        const { tmpdir } = await import("os");
+        const { statSync } = await import("fs");
+        const zipPath = join(tmpdir(), `onflyt-deploy-${Date.now()}.zip`);
+        setDeployStage("zipping");
+        setTimeout(async () => {
+            try {
+                const { createProjectZip } = await import("../lib/deploy-api.js");
+                await createProjectZip(process.cwd(), zipPath);
+                const size = statSync(zipPath).size;
+                setZipSize(size);
+                console.log(`\x1b[90m  Archive size: ${(size / 1024 / 1024).toFixed(1)} MB\x1b[0m`);
+                if (size > 100 * 1024 * 1024) {
+                    console.log(`\x1b[33m  Warning: File exceeds 100MB limit\x1b[0m`);
+                }
+                setDeployStage("uploading");
+                const { deployManual } = await import("../lib/deploy-api.js");
+                const depId = await deployManual(projId, zipPath, projectConfig?.framework, needsPod ? selectedInstance?.id : undefined, needsPod ? replicas : undefined, envVars.length > 0 ? envVars : undefined, (uploaded, total) => {
+                    setUploadProgress({ uploaded, total });
+                }, {
+                    buildCommand: projectConfig?.buildCommand,
+                    outputDirectory: projectConfig?.outputDirectory,
+                    installCommand: projectConfig?.installCommand,
+                });
+                setDeploymentId(depId);
+                pollStatus(depId);
+            }
+            catch (err) {
+                setStep("error");
+                setErrorMsg(err.message);
+            }
+        }, 100);
+    }, [projectConfig, selectedInstance, replicas, envVars, needsPod]);
+    const handleUpdateAndDeploy = useCallback(async () => {
+        try {
+            if (needsPod) {
+                const instanceToUse = selectedInstance?.id || projectInstanceSize;
+                const replicasToUse = replicas || projectReplicas;
+                if (instanceToUse || replicasToUse) {
+                    await updateProjectSettings(projectId, instanceToUse, replicasToUse);
+                }
+            }
+            setStep("deploying");
+            triggerDeployment(projectId);
+        }
+        catch (err) {
+            setErrorMsg(err.message);
+            setStep("error");
+        }
+    }, [
+        projectId,
+        projectInstanceSize,
+        projectReplicas,
+        selectedInstance,
+        replicas,
+        needsPod,
+        triggerDeployment,
+    ]);
+    const pollStatus = useCallback((depId) => {
+        const poll = async () => {
+            try {
+                const details = await getDeploymentStatus(depId);
+                setDeploymentStatus(details.status);
+                if (details.status === "building" && liveLogs.length === 0) {
+                    if (limits.enableLogStreaming) {
+                        streamLogs(depId, (log) => {
+                            setLiveLogs((prev) => [...prev.slice(-200), log]);
+                        }, () => {
+                            console.log("\x1b[33m⚠ Live logs unavailable\x1b[0m");
+                        });
+                    }
+                }
+                if (details.status === "live") {
+                    setLiveUrl(details.url || `https://${projectConfig?.name}.onflyt.dev`);
+                    setPreviewUrl(details.previewUrl || "");
+                    setStep("done");
+                    return;
+                }
+                if (details.status === "failed") {
+                    setErrorMsg("Deployment failed. Run 'onflyt logs " + depId + "' for details.");
+                    setStep("error");
+                    return;
+                }
+                setTimeout(() => poll(), 3000);
+            }
+            catch (err) {
+                setTimeout(() => poll(), 5000);
+            }
+        };
+        poll();
+    }, [liveLogs.length, limits.enableLogStreaming, projectConfig?.name]);
+    useInput((input, key) => {
+        if (input === "q" || input === "Q" || (key.ctrl && input === "c")) {
+            process.exit(0);
+        }
+        if (key.escape) {
+            if (step === "instance")
+                setStep("config");
+            if (step === "env")
+                setStep(needsPod ? "instance" : "config");
+            return;
+        }
+        if (key.return) {
+            if (step === "team") {
+                setStep("config");
+            }
+            else if (step === "config") {
+                handleDeploy();
+            }
+            else if (step === "instance") {
+                setStep("env");
+            }
+            else if (step === "env") {
+                triggerDeployment(projectId);
+            }
+            return;
+        }
+        if (step === "config" && input === "1" && needsPod) {
+            setStep("instance");
+            return;
+        }
+        if (step === "team") {
+            if (key.upArrow) {
+                setSelectedTeamIndex((i) => Math.max(0, i - 1));
+            }
+            else if (key.downArrow) {
+                setSelectedTeamIndex((i) => Math.min(teams.length - 1, i + 1));
+            }
+            return;
+        }
+        if (step === "instance") {
+            if (key.upArrow) {
+                setSelectedInstanceIndex((i) => Math.max(0, i - 1));
+            }
+            else if (key.downArrow) {
+                setSelectedInstanceIndex((i) => Math.min(INSTANCE_OPTIONS.length - 1, i + 1));
+            }
+            else if (key.leftArrow) {
+                setReplicas((r) => Math.max(1, r - 1));
+            }
+            else if (key.rightArrow) {
+                setReplicas((r) => Math.min(INSTANCE_OPTIONS[selectedInstanceIndex].maxReplicas, r + 1));
+            }
+            return;
+        }
+        if (step === "env") {
+            if (input === "1") {
+                handleImportEnv();
+            }
+            else if (input === "2") {
+                handleAddEnv();
+            }
+            else if (input === "3") {
+                handleAddEnv();
+            }
+            return;
+        }
+        if (input === "q" || input === "Q") {
+            process.exit(0);
+        }
+    });
+    const handleImportEnv = () => {
+        try {
+            const projectPath = process.cwd();
+            const envPath = `${projectPath}/.env`;
+            if (existsSync(envPath)) {
+                const content = readFileSync(envPath, "utf-8");
+                const vars = content
+                    .split("\n")
+                    .filter((line) => line.includes("=") && !line.startsWith("#"))
+                    .map((line) => {
+                    const [key, ...rest] = line.split("=");
+                    return { key: key.trim(), value: rest.join("=").trim() };
+                });
+                setEnvVars(vars);
+            }
+        }
+        catch { }
+        handleUpdateAndDeploy();
+    };
+    const handleAddEnv = () => {
+        handleUpdateAndDeploy();
+    };
+    if (step === "loading") {
+        return (React.createElement(Box, { flexDirection: "column" },
+            React.createElement(Text, { bold: true, color: "rgb(255,191,0)" },
+                React.createElement(Text, null, "DEPLOY")),
+            React.createElement(Box, { marginTop: 1 },
+                React.createElement(Text, null, "Loading..."))));
+    }
+    if (step === "team") {
+        return (React.createElement(Box, { flexDirection: "column", padding: 1 },
+            React.createElement(Text, { bold: true, color: "rgb(255,191,0)" },
+                React.createElement(Text, null, "DEPLOY")),
+            React.createElement(Box, { marginTop: 1, flexDirection: "column" },
+                React.createElement(Text, { bold: true }, "Select Team"),
+                React.createElement(Text, { dimColor: true }, "Use \u2191\u2193 to navigate, Enter to confirm"),
+                teams.map((team, idx) => (React.createElement(Box, { key: team.team.id, marginTop: 1 },
+                    React.createElement(Text, { color: idx === selectedTeamIndex ? "cyan" : "gray" }, idx === selectedTeamIndex ? "▶ " : "  "),
+                    React.createElement(Text, { bold: idx === selectedTeamIndex }, team.team.name),
+                    React.createElement(Text, { dimColor: true },
+                        " (",
+                        team.role,
+                        ")"))))),
+            React.createElement(Box, { marginTop: 2 },
+                React.createElement(Text, { dimColor: true }, "[Enter] Deploy to this team [Esc] Cancel"))));
+    }
+    if (step === "error") {
+        return (React.createElement(Box, { flexDirection: "column" },
+            React.createElement(Text, { bold: true, color: "rgb(255,191,0)" },
+                React.createElement(Text, null, "DEPLOY")),
+            React.createElement(Box, { marginTop: 1 },
+                React.createElement(Text, { bold: true, color: "red" }, "\u2716 Error")),
+            React.createElement(Box, { marginTop: 1 },
+                React.createElement(Text, { color: "red" }, errorMsg))));
+    }
+    if (step === "config") {
+        return (React.createElement(Box, { flexDirection: "column", padding: 1 },
+            React.createElement(Text, { bold: true, color: "rgb(255,191,0)" },
+                React.createElement(Text, null, "DEPLOY")),
+            React.createElement(Box, { marginTop: 1, flexDirection: "column" },
+                React.createElement(Text, { bold: true }, "\u250C\u2500 Project Configuration"),
+                React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { color: "cyan" }, " \u2502 Name: "),
+                    React.createElement(Text, { bold: true }, projectConfig?.name || "Unknown")),
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: "cyan" }, " \u2502 Type: "),
+                    React.createElement(Text, { bold: true, color: "yellow" }, projectConfig?.framework?.toUpperCase() || "STATIC"),
+                    needsPod && React.createElement(Text, { color: "magenta" }, " (Onflyt Pod)")),
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: "cyan" }, " \u2502 Deploy: "),
+                    React.createElement(Text, { color: hasGitRemote ? "green" : "yellow" }, hasGitRemote ? "Git-based" : "Manual (ZIP)")),
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: "cyan" }, " \u2514\u2500 Team: "),
+                    React.createElement(Text, null, selectedTeam?.team.name))),
+            React.createElement(Box, { marginTop: 2, flexDirection: "column" },
+                React.createElement(Text, { bold: true }, "\u250C\u2500 Usage Plan"),
+                React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { color: "cyan" }, " \u2502 Plan: "),
+                    React.createElement(Text, { bold: true, color: "yellow" }, planLabel)),
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: "cyan" }, " \u2502 Credits: "),
+                    React.createElement(Text, null, currentBalance.balanceFormatted)),
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: "cyan" }, " \u2502 Max Replicas: "),
+                    React.createElement(Text, null, limits.maxInstancesPerProject)),
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: "cyan" }, " \u2514\u2500 Build Time: "),
+                    React.createElement(Text, null,
+                        limits.maxBuildMinutes,
+                        " min"))),
+            needsPod && (React.createElement(Box, { marginTop: 2, flexDirection: "column" },
+                React.createElement(Text, { bold: true }, "\u250C\u2500 Onflyt Pod"),
+                React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { color: "cyan" }, " \u2502 Instance: "),
+                    React.createElement(Text, { color: "yellow" }, selectedInstance?.label || "not set")),
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: "cyan" }, " \u2502 Replicas: "),
+                    React.createElement(Text, { color: "yellow" }, replicas)),
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: "cyan" }, " \u2514\u2500 Est. Cost: "),
+                    React.createElement(Text, { color: "yellow" }, estimatedHourlyCost !== null
+                        ? formatEstimatedCost(estimatedHourlyCost)
+                        : "Free")))),
+            React.createElement(Box, { marginTop: 2 },
+                React.createElement(Text, { bold: true, color: "gray" },
+                    " ",
+                    "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500")),
+            React.createElement(Box, { marginTop: 2, flexDirection: "column" },
+                needsPod && (React.createElement(Box, { marginBottom: 1 },
+                    React.createElement(Text, { color: "gray" }, " "),
+                    React.createElement(Text, { bold: true, color: "cyan" }, "[1]"),
+                    React.createElement(Text, { color: "gray" }, " Configure Onflyt Pod"))),
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: "gray" }, " "),
+                    React.createElement(Text, { bold: true, color: "green" }, "\u25B8"),
+                    React.createElement(Text, { color: "gray" }, " "),
+                    React.createElement(Text, { bold: true, color: "green" }, "[Enter] Deploy now")),
+                React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { color: "gray" }, " "),
+                    React.createElement(Text, { color: "gray" }, "[q] Quit")))));
+    }
+    if (step === "instance") {
+        return (React.createElement(Box, { flexDirection: "column", padding: 1 },
+            React.createElement(Text, { bold: true, color: "rgb(255,191,0)" },
+                React.createElement(Text, null, "DEPLOY")),
+            React.createElement(Box, { marginTop: 1, flexDirection: "column" },
+                React.createElement(Text, { bold: true }, "\u250C\u2500 Onflyt Pod Configuration"),
+                React.createElement(Text, { color: "gray" }, " Choose instance size and replica count"),
+                React.createElement(Box, { marginTop: 1, flexDirection: "column" }, INSTANCE_OPTIONS.map((option, idx) => (React.createElement(Box, { key: option.id },
+                    React.createElement(Text, { color: "gray" }, " "),
+                    React.createElement(Text, { bold: selectedInstanceIndex === idx, color: selectedInstanceIndex === idx ? "cyan" : "gray" },
+                        selectedInstanceIndex === idx ? "▸" : " ",
+                        "[",
+                        idx + 1,
+                        "]",
+                        " ",
+                        option.label.padEnd(10)),
+                    React.createElement(Text, { color: "gray" },
+                        option.cpu,
+                        " CPU, ",
+                        option.ram,
+                        " RAM, ",
+                        option.disk,
+                        " Disk"),
+                    React.createElement(Text, { color: "yellow" },
+                        " - ",
+                        option.hourly))))),
+                React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { color: "cyan" }, " \u2502 Selected: "),
+                    React.createElement(Text, { bold: true, color: "cyan" }, INSTANCE_OPTIONS[selectedInstanceIndex].label),
+                    React.createElement(Text, { color: "gray" },
+                        " ",
+                        "(",
+                        INSTANCE_OPTIONS[selectedInstanceIndex].cpu,
+                        " CPU,",
+                        " ",
+                        INSTANCE_OPTIONS[selectedInstanceIndex].ram,
+                        " RAM)")),
+                React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { color: "cyan" }, " \u2514\u2500 Replicas: "),
+                    React.createElement(Text, { bold: true, color: "cyan" }, replicas),
+                    React.createElement(Text, { color: "gray" },
+                        " ",
+                        "(max",
+                        " ",
+                        Math.min(limits.maxInstancesPerProject, INSTANCE_OPTIONS[selectedInstanceIndex].maxReplicas),
+                        ")"))),
+            React.createElement(Box, { marginTop: 2 },
+                React.createElement(Text, { color: "gray" },
+                    " ",
+                    "\u2191\u2193 Change instance \u2190\u2192 Change replicas [Enter] Continue [Esc] Back"))));
+    }
+    if (step === "env") {
+        return (React.createElement(Box, { flexDirection: "column", padding: 1 },
+            React.createElement(Text, { bold: true, color: "rgb(255,191,0)" },
+                React.createElement(Text, null, "DEPLOY")),
+            React.createElement(Box, { marginTop: 1, flexDirection: "column" },
+                React.createElement(Text, { bold: true }, "\u250C\u2500 Environment Variables"),
+                React.createElement(Text, { color: "gray" }, " Import from .env or add manually"),
+                React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { color: "gray" }, " "),
+                    React.createElement(Text, { bold: true, color: "cyan" }, "[1]"),
+                    React.createElement(Text, { color: "gray" }, " Import from .env")),
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: "gray" }, " "),
+                    React.createElement(Text, { bold: true, color: "cyan" }, "[2]"),
+                    React.createElement(Text, { color: "gray" }, " Add manually")),
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: "gray" }, " "),
+                    React.createElement(Text, { bold: true, color: "cyan" }, "[3]"),
+                    React.createElement(Text, { color: "gray" }, " Skip (use existing)"))),
+            React.createElement(Box, { marginTop: 2 },
+                React.createElement(Text, { color: "gray" }, " [1/2/3] Select option [Esc] Back")),
+            envMessage && (React.createElement(Box, { marginTop: 1 },
+                React.createElement(Text, { color: envMessage.includes("✓") ? "green" : "yellow" }, envMessage)))));
+    }
+    if (step === "deploying") {
+        const dots = ".".repeat(dotCount);
+        const statusColors = {
+            queued: "yellow",
+            building: "cyan",
+            provisioning: "magenta",
+            deployed: "green",
+            failed: "red",
+        };
+        const statusLabels = {
+            queued: "QUEUED",
+            building: "BUILDING",
+            provisioning: "PROVISIONING",
+            deployed: "DEPLOYED",
+            failed: "FAILED",
+        };
+        const statusIcons = {
+            queued: "⏳",
+            building: "🔨",
+            provisioning: "⚙️",
+            deployed: "✅",
+            failed: "❌",
+        };
+        const progressPercent = uploadProgress.total > 0
+            ? Math.round((uploadProgress.uploaded / uploadProgress.total) * 100)
+            : 0;
+        const getStageInfo = () => {
+            switch (deployStage) {
+                case "starting":
+                    return { icon: "⏳", label: "Starting deployment", color: "cyan" };
+                case "zipping":
+                    return { icon: "📦", label: "Creating ZIP archive", color: "cyan" };
+                case "uploading":
+                    if (progressPercent >= 100) {
+                        return { icon: "✅", label: "Upload completed", color: "green" };
+                    }
+                    return {
+                        icon: "⬆️",
+                        label: `Uploading ${progressPercent}%`,
+                        color: "cyan",
+                    };
+                case "deployed":
+                    return { icon: "✅", label: "Deployed", color: "green" };
+                default:
+                    return { icon: "⏳", label: "Processing", color: "cyan" };
+            }
+        };
+        const stageInfo = getStageInfo();
+        const formatBytes = (bytes) => {
+            if (bytes === 0)
+                return "0 B";
+            const k = 1024;
+            const sizes = ["B", "KB", "MB", "GB"];
+            const i = Math.floor(Math.log(bytes) / Math.log(k));
+            return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + " " + sizes[i];
+        };
+        const progressBar = (percent, width = 30) => {
+            const filled = Math.round((percent / 100) * width);
+            const empty = width - filled;
+            return "█".repeat(filled) + "░".repeat(empty);
+        };
+        const showProgressBar = deployStage === "uploading" && zipSize && progressPercent < 100;
+        return (React.createElement(Box, { flexDirection: "column", padding: 1 },
+            React.createElement(Text, { bold: true, color: "rgb(255,191,0)" },
+                React.createElement(Text, null, "DEPLOY")),
+            React.createElement(Box, { marginTop: 2 },
+                React.createElement(Text, { bold: true, color: stageInfo.color },
+                    stageInfo.icon,
+                    " ",
+                    stageInfo.label),
+                React.createElement(Text, { dimColor: true }, dots)),
+            deployStage === "zipping" && (React.createElement(Box, { marginTop: 1 },
+                React.createElement(Text, { dimColor: true }, "Compressing files..."))),
+            showProgressBar && (React.createElement(Box, { marginTop: 1, flexDirection: "column" },
+                React.createElement(Box, null,
+                    React.createElement(Text, { dimColor: true },
+                        "[",
+                        progressBar(progressPercent),
+                        "]")),
+                React.createElement(Box, null,
+                    React.createElement(Text, { dimColor: true },
+                        formatBytes(uploadProgress.uploaded),
+                        " /",
+                        " ",
+                        formatBytes(uploadProgress.total))))),
+            React.createElement(Box, { marginTop: 2 },
+                React.createElement(Text, { bold: true, color: "cyan" },
+                    "Status:",
+                    " "),
+                React.createElement(Text, { bold: true, color: statusColors[deploymentStatus] },
+                    statusIcons[deploymentStatus],
+                    " ",
+                    statusLabels[deploymentStatus]),
+                React.createElement(Text, { dimColor: true }, dots)),
+            deploymentId && (React.createElement(Box, null,
+                React.createElement(Text, { bold: true, color: "cyan" }, "ID:"),
+                React.createElement(Text, null,
+                    " ",
+                    deploymentId))),
+            React.createElement(Box, null,
+                React.createElement(Text, { bold: true, color: "cyan" }, "Project:"),
+                React.createElement(Text, null,
+                    " ",
+                    projectConfig?.name)),
+            liveLogs.length > 0 && (React.createElement(Box, { marginTop: 2, flexDirection: "column" },
+                React.createElement(Text, { bold: true, color: "cyan" }, "Build Logs:"),
+                React.createElement(Box, { flexDirection: "column", marginTop: 1, padding: 1, borderStyle: "round", borderDimColor: true }, liveLogs.slice(-15).map((log, idx) => (React.createElement(Text, { key: idx, color: "white" }, log)))))),
+            deploymentId && (React.createElement(Box, { marginTop: 2 },
+                React.createElement(Text, { color: "gray" },
+                    "Run 'onflyt tail ",
+                    deploymentId,
+                    "' to watch logs")))));
+    }
+    if (step === "done") {
+        return (React.createElement(Box, { flexDirection: "column", padding: 1 },
+            React.createElement(Text, { bold: true, color: "rgb(255,191,0)" }, "DEPLOYED!"),
+            React.createElement(Box, { marginTop: 2, flexDirection: "column", borderStyle: "round", borderColor: "green", padding: 1 },
+                React.createElement(Text, { bold: true, color: "green" }, "\u2713 Deployment Successful"),
+                React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { bold: true, color: "cyan" }, "ID:"),
+                    React.createElement(Text, null,
+                        " ",
+                        deploymentId)),
+                React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { bold: true, color: "cyan" }, "Live URL:"),
+                    React.createElement(Text, { bold: true, color: "white" },
+                        " ",
+                        liveUrl)),
+                previewUrl && (React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { bold: true, color: "cyan" }, "Preview:"),
+                    React.createElement(Text, { color: "white" },
+                        " ",
+                        previewUrl))),
+                needsPod && (React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { bold: true, color: "magenta" }, "Onflyt Pod:"),
+                    React.createElement(Text, null,
+                        " ",
+                        replicas,
+                        "x ",
+                        INSTANCE_OPTIONS[selectedInstanceIndex].label)))),
+            React.createElement(Box, { marginTop: 2 },
+                React.createElement(Text, { color: "gray" },
+                    "Run 'onflyt logs ",
+                    deploymentId,
+                    "' to view logs"))));
+    }
+    return null;
+};
+export default Deploy;