|
-
{container.name}
@@ -180,13 +141,9 @@ export default function ContainersPage() {
{container.image}
|
-
- |
+ {container.node} | -
- |
+ {/* {container.status} */} |
{container.uptime}
@@ -226,16 +183,16 @@ export default function ContainersPage() {
{/* ================= MOBILE CARDS ================= */}
-
+
{containers.map((container) => (
{/* Header */}
-
-
@@ -249,9 +206,7 @@ export default function ContainersPage() {
Node
-
-
+ {container.node}
Uptime
diff --git a/src/app/deployments/page.tsx b/src/app/deployments/page.tsx
index 311fe46..0938bda 100644
--- a/src/app/deployments/page.tsx
+++ b/src/app/deployments/page.tsx
@@ -4,7 +4,6 @@ import { DashboardLayout } from "@/components/dashboard/DashboardLayout";
import { Card, CardContent } from "@/components/ui/card";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
-import { StatusIndicator } from "@/components/dashboard/StatusIndicator";
import {
Rocket,
RotateCcw,
@@ -153,9 +152,7 @@ export default function DeploymentsPage() {
|
-
- |
+ {dep.status} |
{dep.replicas}
@@ -201,7 +198,7 @@ export default function DeploymentsPage() {
diff --git a/src/app/monitoring/page.tsx b/src/app/monitoring/page.tsx
index 2aa6d3e..ead99e9 100644
--- a/src/app/monitoring/page.tsx
+++ b/src/app/monitoring/page.tsx
@@ -56,8 +56,8 @@ export default function MonitoringPage() {
const fetchNodes = async () => {
const nodes = await getLiveNodes();
setLiveData({
- cpuUsage: average(nodes, (n) => n.liveData.cpu.usage),
- ramUsage: average(nodes, (n) => n.liveData.memory.usage),
+ cpuUsage: average(nodes, (n) => n.liveData?.cpu.usage || 0),
+ ramUsage: average(nodes, (n) => n.liveData?.memory.usage || 0),
});
};
fetchNodes();
diff --git a/src/app/nodes/page.tsx b/src/app/nodes/page.tsx
index 7516e5f..28820b7 100644
--- a/src/app/nodes/page.tsx
+++ b/src/app/nodes/page.tsx
@@ -8,12 +8,15 @@ import { Server, Plus, Settings, Trash2 } from "lucide-react";
import { Progress } from "@/components/ui/progress";
import { Docker, Node, NodeLiveData } from "@/lib/types";
import { useEffect, useState } from "react";
-import { getDockerNode, getLiveNodes } from "@/core/node";
+import { getLiveNodes } from "@/core/node";
import { formatBytes } from "@/lib/format";
import { setNodes as updateNodes } from "@/core/node";
import AddNode from "@/components/dialogs/AddNode";
+import { getDocker } from "@/core/docker";
function DiskUsage({ liveData }: NodeLiveData) {
+ if (!liveData) return null;
+
const usage = (liveData.disk.used / liveData.disk.size) * 100;
return (
@@ -44,7 +47,7 @@ export default function NodesPage() {
useEffect(() => {
const fetchDocker = async () => {
- setDockerNodes(await Promise.all(nodes.map(getDockerNode)));
+ setDockerNodes(await getDocker(nodes));
};
fetchDocker();
}, [nodes]);
@@ -54,9 +57,7 @@ export default function NodesPage() {
-
- {/*
{node.ip} • {node.ip}
@@ -135,13 +140,13 @@ export default function NodesPage() {
{/* CPU */}
- CPU ({node.liveData.cpu.cores} cores)
+ CPU ({node.liveData?.cpu.cores} cores)
- {node.liveData.cpu.usage.toFixed(0)}%
+ {node.liveData?.cpu.usage.toFixed(0)}%
- {node.liveData.memory.usage.toFixed(0)}%
+ {node.liveData?.memory.usage.toFixed(0)}%
- {formatBytes(node.liveData.memory.used)} /{" "}
- {formatBytes(node.liveData.memory.total)}
+ {node.liveData &&
+ formatBytes(node.liveData?.memory.used) +
+ "/" +
+ formatBytes(node.liveData?.memory.total)}
-
+ {app.status}
))}
@@ -205,7 +205,7 @@ export default function OverviewPage() {
className="flex flex-col sm:flex-row sm:items-center sm:justify-between py-2 border-b border-border last:border-0"
>
- {dep.app}
@@ -235,7 +235,11 @@ export default function OverviewPage() {
-
@@ -246,21 +250,21 @@ export default function OverviewPage() {
CPU
- {node.liveData.cpu.usage.toFixed(0)}%
+ {node.liveData?.cpu.usage.toFixed(0)}%
Memory
- {node.liveData.memory.usage.toFixed(0)}%
+ {node.liveData?.memory.usage.toFixed(0)}%
diff --git a/src/components/dashboard/StatusIndicator.tsx b/src/components/dashboard/StatusIndicator.tsx
deleted file mode 100644
index 6f3b752..0000000
--- a/src/components/dashboard/StatusIndicator.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import { cn } from "@/lib/utils";
-
-interface StatusIndicatorProps {
- status: "running" | "stopped" | "error" | "pending";
- showLabel?: boolean;
- size?: "sm" | "md";
-}
-
-const statusConfig = {
- running: { label: "Running", className: "status-running" },
- stopped: { label: "Stopped", className: "status-stopped" },
- error: { label: "Error", className: "status-error" },
- pending: { label: "Pending", className: "status-pending" },
-};
-
-export function StatusIndicator({ status, showLabel = false, size = "md" }: StatusIndicatorProps) {
- const config = statusConfig[status];
-
- return (
-
-
- {showLabel && (
- {config.label}
- )}
-
- );
-}
diff --git a/src/components/dialogs/DeployApplication.tsx b/src/components/dialogs/DeployApplication.tsx
new file mode 100644
index 0000000..2fef292
--- /dev/null
+++ b/src/components/dialogs/DeployApplication.tsx
@@ -0,0 +1,103 @@
+"use client";
+
+import { useState, ReactNode, useEffect } from "react";
+import { Button } from "@/components/ui/button";
+import {
+ Dialog,
+ DialogClose,
+ DialogContent,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle,
+ DialogTrigger,
+} from "@/components/ui/dialog";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { getLiveNodes } from "@/core/node";
+import { Combobox } from "../ui/combobox";
+import { Node, NodeLiveData } from "@/lib/types";
+import { deployNewApp } from "@/core/application";
+
+export default function DeployApplication({
+ children,
+}: {
+ children: ReactNode;
+}) {
+ const [nodeList, setNodeList] = useState<(NodeLiveData & Node)[]>([]);
+ const [name, setName] = useState("");
+ const [repo, setRepo] = useState("");
+ const [node, setNode] = useState("");
+
+ useEffect(() => {
+ const fetchNodes = async () => {
+ setNodeList(await getLiveNodes());
+ };
+ fetchNodes();
+ }, []);
+
+ const deploy = async () => {
+ console.log(await deployNewApp(name, repo, node));
+ };
+
+ return (
+
+ );
+}
diff --git a/src/components/ui/combobox.tsx b/src/components/ui/combobox.tsx
new file mode 100644
index 0000000..6c6c953
--- /dev/null
+++ b/src/components/ui/combobox.tsx
@@ -0,0 +1,82 @@
+"use client";
+
+import { Check, ChevronsUpDown } from "lucide-react";
+
+import { cn } from "@/lib/utils";
+import { Button } from "@/components/ui/button";
+import {
+ Command,
+ CommandEmpty,
+ CommandGroup,
+ CommandInput,
+ CommandItem,
+ CommandList,
+} from "@/components/ui/command";
+import {
+ Popover,
+ PopoverContent,
+ PopoverTrigger,
+} from "@/components/ui/popover";
+import { useState } from "react";
+
+export type ComboData = { value: string; label: string }[];
+
+export function Combobox({
+ data,
+ value,
+ setValue,
+ placeholder,
+ listPlaceholder,
+}: {
+ data: ComboData;
+ value: string;
+ setValue: (v: string) => void;
+ placeholder?: string;
+ listPlaceholder?: string;
+}) {
+ const [open, setOpen] = useState(false);
+
+ return (
+
+
+ )
+}
+
+function CommandList({
+ className,
+ ...props
+}: React.ComponentProps |