Generated
+203
-17
@@ -21,6 +21,7 @@
|
||||
"@types/dockerode": "^3.3.47",
|
||||
"@types/js-cookie": "^3.0.6",
|
||||
"@types/simple-oauth2": "^5.0.8",
|
||||
"@types/tar-fs": "^2.0.4",
|
||||
"axios": "^1.13.2",
|
||||
"class-variance-authority": "^0.7.1",
|
||||
"clsx": "^2.1.1",
|
||||
@@ -39,7 +40,8 @@
|
||||
"simple-git": "^3.30.0",
|
||||
"simple-oauth2": "^5.1.0",
|
||||
"systeminformation": "^5.28.2",
|
||||
"tailwind-merge": "^3.4.0"
|
||||
"tailwind-merge": "^3.4.0",
|
||||
"tar-fs": "^3.1.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/postcss": "^4",
|
||||
@@ -2989,6 +2991,25 @@
|
||||
"integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@types/tar-fs": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmjs.org/@types/tar-fs/-/tar-fs-2.0.4.tgz",
|
||||
"integrity": "sha512-ipPec0CjTmVDWE+QKr9cTmIIoTl7dFG/yARCM5MqK8i6CNLIG1P8x4kwDsOQY1ChZOZjH0wO9nvfgBvWl4R3kA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@types/node": "*",
|
||||
"@types/tar-stream": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/tar-stream": {
|
||||
"version": "3.1.4",
|
||||
"resolved": "https://registry.npmjs.org/@types/tar-stream/-/tar-stream-3.1.4.tgz",
|
||||
"integrity": "sha512-921gW0+g29mCJX0fRvqeHzBlE/XclDaAG0Ousy1LCghsOhvaKacDeRGEVzQP9IPfKn8Vysy7FEXAIxycpc/CMg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@types/node": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/ansi-regex": {
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
|
||||
@@ -3051,6 +3072,111 @@
|
||||
"proxy-from-env": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/b4a": {
|
||||
"version": "1.7.4",
|
||||
"resolved": "https://registry.npmjs.org/b4a/-/b4a-1.7.4.tgz",
|
||||
"integrity": "sha512-u20zJLDaSWpxaZ+zaAkEIB2dZZ1o+DF4T/MRbmsvGp9nletHOyiai19OzX1fF8xUBYsO1bPXxODvcd0978pnug==",
|
||||
"license": "Apache-2.0",
|
||||
"peerDependencies": {
|
||||
"react-native-b4a": "*"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"react-native-b4a": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/bare-events": {
|
||||
"version": "2.8.2",
|
||||
"resolved": "https://registry.npmjs.org/bare-events/-/bare-events-2.8.2.tgz",
|
||||
"integrity": "sha512-riJjyv1/mHLIPX4RwiK+oW9/4c3TEUeORHKefKAKnZ5kyslbN+HXowtbaVEqt4IMUB7OXlfixcs6gsFeo/jhiQ==",
|
||||
"license": "Apache-2.0",
|
||||
"peerDependencies": {
|
||||
"bare-abort-controller": "*"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"bare-abort-controller": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/bare-fs": {
|
||||
"version": "4.5.4",
|
||||
"resolved": "https://registry.npmjs.org/bare-fs/-/bare-fs-4.5.4.tgz",
|
||||
"integrity": "sha512-POK4oplfA7P7gqvetNmCs4CNtm9fNsx+IAh7jH7GgU0OJdge2rso0R20TNWVq6VoWcCvsTdlNDaleLHGaKx8CA==",
|
||||
"license": "Apache-2.0",
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"bare-events": "^2.5.4",
|
||||
"bare-path": "^3.0.0",
|
||||
"bare-stream": "^2.6.4",
|
||||
"bare-url": "^2.2.2",
|
||||
"fast-fifo": "^1.3.2"
|
||||
},
|
||||
"engines": {
|
||||
"bare": ">=1.16.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"bare-buffer": "*"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"bare-buffer": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/bare-os": {
|
||||
"version": "3.6.2",
|
||||
"resolved": "https://registry.npmjs.org/bare-os/-/bare-os-3.6.2.tgz",
|
||||
"integrity": "sha512-T+V1+1srU2qYNBmJCXZkUY5vQ0B4FSlL3QDROnKQYOqeiQR8UbjNHlPa+TIbM4cuidiN9GaTaOZgSEgsvPbh5A==",
|
||||
"license": "Apache-2.0",
|
||||
"optional": true,
|
||||
"engines": {
|
||||
"bare": ">=1.14.0"
|
||||
}
|
||||
},
|
||||
"node_modules/bare-path": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/bare-path/-/bare-path-3.0.0.tgz",
|
||||
"integrity": "sha512-tyfW2cQcB5NN8Saijrhqn0Zh7AnFNsnczRcuWODH0eYAXBsJ5gVxAUuNr7tsHSC6IZ77cA0SitzT+s47kot8Mw==",
|
||||
"license": "Apache-2.0",
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"bare-os": "^3.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/bare-stream": {
|
||||
"version": "2.7.0",
|
||||
"resolved": "https://registry.npmjs.org/bare-stream/-/bare-stream-2.7.0.tgz",
|
||||
"integrity": "sha512-oyXQNicV1y8nc2aKffH+BUHFRXmx6VrPzlnaEvMhram0nPBrKcEdcyBg5r08D0i8VxngHFAiVyn1QKXpSG0B8A==",
|
||||
"license": "Apache-2.0",
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"streamx": "^2.21.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"bare-buffer": "*",
|
||||
"bare-events": "*"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"bare-buffer": {
|
||||
"optional": true
|
||||
},
|
||||
"bare-events": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/bare-url": {
|
||||
"version": "2.3.2",
|
||||
"resolved": "https://registry.npmjs.org/bare-url/-/bare-url-2.3.2.tgz",
|
||||
"integrity": "sha512-ZMq4gd9ngV5aTMa5p9+UfY0b3skwhHELaDkhEHetMdX0LRkW9kzaym4oo/Eh+Ghm0CCDuMTsRIGM/ytUc1ZYmw==",
|
||||
"license": "Apache-2.0",
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"bare-path": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/base64-js": {
|
||||
"version": "1.5.1",
|
||||
"resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
|
||||
@@ -3504,6 +3630,34 @@
|
||||
"node": ">= 8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/dockerode/node_modules/tar-fs": {
|
||||
"version": "2.1.4",
|
||||
"resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.4.tgz",
|
||||
"integrity": "sha512-mDAjwmZdh7LTT6pNleZ05Yt65HC3E+NiQzl672vQG38jIrehtJk/J3mNwIg+vShQPcLF/LV7CMnDW6vjj6sfYQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"chownr": "^1.1.1",
|
||||
"mkdirp-classic": "^0.5.2",
|
||||
"pump": "^3.0.0",
|
||||
"tar-stream": "^2.1.4"
|
||||
}
|
||||
},
|
||||
"node_modules/dockerode/node_modules/tar-stream": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-2.2.0.tgz",
|
||||
"integrity": "sha512-ujeqbceABgwMZxEJnk2HDY2DlnUZ+9oEcb1KzTVfYHio0UE6dG71n60d8D2I4qNvleWrrXpmjpt7vZeF1LnMZQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"bl": "^4.0.3",
|
||||
"end-of-stream": "^1.4.1",
|
||||
"fs-constants": "^1.0.0",
|
||||
"inherits": "^2.0.3",
|
||||
"readable-stream": "^3.1.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/dom-helpers": {
|
||||
"version": "5.2.1",
|
||||
"resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz",
|
||||
@@ -3617,6 +3771,15 @@
|
||||
"integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/events-universal": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/events-universal/-/events-universal-1.0.1.tgz",
|
||||
"integrity": "sha512-LUd5euvbMLpwOF8m6ivPCbhQeSiYVNb8Vs0fQ8QjXo0JTkEHpz8pxdQf0gStltaPpw0Cca8b39KxvK9cfKRiAw==",
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"bare-events": "^2.7.0"
|
||||
}
|
||||
},
|
||||
"node_modules/execa": {
|
||||
"version": "8.0.1",
|
||||
"resolved": "https://registry.npmjs.org/execa/-/execa-8.0.1.tgz",
|
||||
@@ -3649,6 +3812,12 @@
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/fast-fifo": {
|
||||
"version": "1.3.2",
|
||||
"resolved": "https://registry.npmjs.org/fast-fifo/-/fast-fifo-1.3.2.tgz",
|
||||
"integrity": "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/follow-redirects": {
|
||||
"version": "1.15.11",
|
||||
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.11.tgz",
|
||||
@@ -5014,6 +5183,17 @@
|
||||
"nan": "^2.23.0"
|
||||
}
|
||||
},
|
||||
"node_modules/streamx": {
|
||||
"version": "2.23.0",
|
||||
"resolved": "https://registry.npmjs.org/streamx/-/streamx-2.23.0.tgz",
|
||||
"integrity": "sha512-kn+e44esVfn2Fa/O0CPFcex27fjIL6MkVae0Mm6q+E6f0hWv578YCERbv+4m02cjxvDsPKLnmxral/rR6lBMAg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"events-universal": "^1.0.0",
|
||||
"fast-fifo": "^1.3.2",
|
||||
"text-decoder": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/string_decoder": {
|
||||
"version": "1.3.0",
|
||||
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
|
||||
@@ -5142,31 +5322,37 @@
|
||||
}
|
||||
},
|
||||
"node_modules/tar-fs": {
|
||||
"version": "2.1.4",
|
||||
"resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.4.tgz",
|
||||
"integrity": "sha512-mDAjwmZdh7LTT6pNleZ05Yt65HC3E+NiQzl672vQG38jIrehtJk/J3mNwIg+vShQPcLF/LV7CMnDW6vjj6sfYQ==",
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.1.1.tgz",
|
||||
"integrity": "sha512-LZA0oaPOc2fVo82Txf3gw+AkEd38szODlptMYejQUhndHMLQ9M059uXR+AfS7DNo0NpINvSqDsvyaCrBVkptWg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"chownr": "^1.1.1",
|
||||
"mkdirp-classic": "^0.5.2",
|
||||
"pump": "^3.0.0",
|
||||
"tar-stream": "^2.1.4"
|
||||
"tar-stream": "^3.1.5"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"bare-fs": "^4.0.1",
|
||||
"bare-path": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/tar-stream": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-2.2.0.tgz",
|
||||
"integrity": "sha512-ujeqbceABgwMZxEJnk2HDY2DlnUZ+9oEcb1KzTVfYHio0UE6dG71n60d8D2I4qNvleWrrXpmjpt7vZeF1LnMZQ==",
|
||||
"version": "3.1.7",
|
||||
"resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.1.7.tgz",
|
||||
"integrity": "sha512-qJj60CXt7IU1Ffyc3NJMjh6EkuCFej46zUqJ4J7pqYlThyd9bO0XBTmcOIhSzZJVWfsLks0+nle/j538YAW9RQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"bl": "^4.0.3",
|
||||
"end-of-stream": "^1.4.1",
|
||||
"fs-constants": "^1.0.0",
|
||||
"inherits": "^2.0.3",
|
||||
"readable-stream": "^3.1.1"
|
||||
"b4a": "^1.6.4",
|
||||
"fast-fifo": "^1.2.0",
|
||||
"streamx": "^2.15.0"
|
||||
}
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6"
|
||||
"node_modules/text-decoder": {
|
||||
"version": "1.2.6",
|
||||
"resolved": "https://registry.npmjs.org/text-decoder/-/text-decoder-1.2.6.tgz",
|
||||
"integrity": "sha512-27FeW5GQFDfw0FpwMQhMagB7BztOOlmjcSRi97t2oplhKVTZtp0DZbSegSaXS5IIC6mxMvBG4AR1Sgc6BX3CQg==",
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"b4a": "^1.6.4"
|
||||
}
|
||||
},
|
||||
"node_modules/tiny-invariant": {
|
||||
|
||||
+3
-1
@@ -21,6 +21,7 @@
|
||||
"@types/dockerode": "^3.3.47",
|
||||
"@types/js-cookie": "^3.0.6",
|
||||
"@types/simple-oauth2": "^5.0.8",
|
||||
"@types/tar-fs": "^2.0.4",
|
||||
"axios": "^1.13.2",
|
||||
"class-variance-authority": "^0.7.1",
|
||||
"clsx": "^2.1.1",
|
||||
@@ -39,7 +40,8 @@
|
||||
"simple-git": "^3.30.0",
|
||||
"simple-oauth2": "^5.1.0",
|
||||
"systeminformation": "^5.28.2",
|
||||
"tailwind-merge": "^3.4.0"
|
||||
"tailwind-merge": "^3.4.0",
|
||||
"tar-fs": "^3.1.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/postcss": "^4",
|
||||
|
||||
@@ -1,16 +1,18 @@
|
||||
import axios from "axios";
|
||||
import { StatusCodes } from "http-status-codes";
|
||||
import { cookies } from "next/headers";
|
||||
import { NextResponse } from "next/server";
|
||||
import { NextRequest, NextResponse } from "next/server";
|
||||
|
||||
export async function GET(request: Request) {
|
||||
export async function GET(request: NextRequest) {
|
||||
const { searchParams } = new URL(request.url);
|
||||
const code = searchParams.get("code");
|
||||
|
||||
console.log(request.url, request.nextUrl);
|
||||
|
||||
if (!code) {
|
||||
return NextResponse.json(
|
||||
{ error: "No code provided" },
|
||||
{ status: StatusCodes.BAD_REQUEST }
|
||||
{ status: StatusCodes.BAD_REQUEST },
|
||||
);
|
||||
}
|
||||
|
||||
@@ -26,7 +28,7 @@ export async function GET(request: Request) {
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
},
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
const accessToken = response.data.access_token;
|
||||
@@ -38,12 +40,12 @@ export async function GET(request: Request) {
|
||||
secure: process.env.NODE_ENV === "production",
|
||||
});
|
||||
|
||||
return NextResponse.redirect(new URL("/overview", request.url));
|
||||
return NextResponse.redirect(`${request.nextUrl.origin}/overview`);
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
return NextResponse.json(
|
||||
{ error: "Error exchanging code for access token" },
|
||||
{ status: StatusCodes.INTERNAL_SERVER_ERROR }
|
||||
{ status: StatusCodes.INTERNAL_SERVER_ERROR },
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { NextRequest, NextResponse } from "next/server";
|
||||
import testAuth from "../auth";
|
||||
import { StatusCodes } from "http-status-codes";
|
||||
import { deployApp } from "@/core/deployment";
|
||||
import { deployApp, toggleDeployment } from "@/core/deployment";
|
||||
import { Application, Port } from "@/lib/types";
|
||||
|
||||
export async function POST(req: NextRequest): Promise<NextResponse> {
|
||||
@@ -15,14 +15,14 @@ export async function POST(req: NextRequest): Promise<NextResponse> {
|
||||
if (auth) {
|
||||
return NextResponse.json(
|
||||
{ message: auth },
|
||||
{ status: StatusCodes.UNAUTHORIZED }
|
||||
{ status: StatusCodes.UNAUTHORIZED },
|
||||
);
|
||||
}
|
||||
|
||||
if (!name || !app) {
|
||||
return NextResponse.json(
|
||||
{ message: "Body missing name, appId, nodeId" },
|
||||
{ status: StatusCodes.BAD_REQUEST }
|
||||
{ status: StatusCodes.BAD_REQUEST },
|
||||
);
|
||||
}
|
||||
|
||||
@@ -33,3 +33,29 @@ export async function POST(req: NextRequest): Promise<NextResponse> {
|
||||
deployId,
|
||||
});
|
||||
}
|
||||
|
||||
export async function PUT(req: NextRequest): Promise<NextResponse> {
|
||||
const auth = await testAuth(req);
|
||||
const { deployId, action }: { deployId: string; action: "start" | "stop" } =
|
||||
await req.json();
|
||||
|
||||
if (auth) {
|
||||
return NextResponse.json(
|
||||
{ message: auth },
|
||||
{ status: StatusCodes.UNAUTHORIZED },
|
||||
);
|
||||
}
|
||||
|
||||
if (!deployId || !action) {
|
||||
return NextResponse.json(
|
||||
{ message: "Body missing deployId or action" },
|
||||
{ status: StatusCodes.BAD_REQUEST },
|
||||
);
|
||||
}
|
||||
|
||||
await toggleDeployment(deployId, action);
|
||||
|
||||
return NextResponse.json({
|
||||
message: "ok",
|
||||
});
|
||||
}
|
||||
|
||||
@@ -20,9 +20,10 @@ import { useAsyncInterval } from "@/hooks/use-async";
|
||||
|
||||
export default function ApplicationsPage() {
|
||||
const { value: apps, setValue: setApps } = useAsyncInterval(
|
||||
"apps",
|
||||
[],
|
||||
getApps,
|
||||
3000
|
||||
3000,
|
||||
);
|
||||
|
||||
const remove = async (appId: string) => {
|
||||
|
||||
@@ -1,17 +1,23 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import { useMemo } from "react";
|
||||
import { DashboardLayout } from "@/components/dashboard/DashboardLayout";
|
||||
import { Card, CardContent } from "@/components/ui/card";
|
||||
import {
|
||||
Card,
|
||||
CardContent,
|
||||
CardDescription,
|
||||
CardTitle,
|
||||
} from "@/components/ui/card";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Rocket, RotateCcw, Eye, MoreVertical, Plus } from "lucide-react";
|
||||
import { Application, Deployment } from "@/lib/types";
|
||||
import { getDeployments } from "@/lib/dockship/deploy";
|
||||
import { Plus, Play, Pause, Square, RotateCcw } from "lucide-react";
|
||||
import { getDeployments, toggleDeployment } from "@/lib/dockship/deploy";
|
||||
import { getApps } from "@/lib/dockship/application";
|
||||
import { cn } from "@/lib/utils";
|
||||
import DeployAppDialog from "@/components/dialogs/DeployApp";
|
||||
import { useAsync } from "@/hooks/use-async";
|
||||
import { useAsync, useAsyncInterval } from "@/hooks/use-async";
|
||||
import RemoveDialog from "@/components/dialogs/Remove";
|
||||
import { Application } from "@/lib/types";
|
||||
|
||||
const statusDot = {
|
||||
running: "bg-chart-2",
|
||||
@@ -20,20 +26,33 @@ const statusDot = {
|
||||
} as const;
|
||||
|
||||
export default function DeploymentsPage() {
|
||||
const { value: apps } = useAsync([], getApps);
|
||||
const { value: apps } = useAsyncInterval("apps", [], getApps, 5000);
|
||||
|
||||
const { value: deployments, loading } = useAsync([], getDeployments, [apps]);
|
||||
const { value: deployments, loading } = useAsync(
|
||||
"deployments",
|
||||
[],
|
||||
getDeployments,
|
||||
[apps],
|
||||
);
|
||||
|
||||
const appNameByContainer = useMemo(() => {
|
||||
const map = new Map<string, string>();
|
||||
const appByContainer = useMemo(() => {
|
||||
const map = new Map<string, Application>();
|
||||
for (const app of apps) {
|
||||
for (const container of app.deployments) {
|
||||
map.set(container, app.name);
|
||||
map.set(container, app);
|
||||
}
|
||||
}
|
||||
return map;
|
||||
}, [apps]);
|
||||
|
||||
const changeDeploymentStatus = async (
|
||||
deployId: string,
|
||||
action: "start" | "stop",
|
||||
) => {
|
||||
console.log(`Toggling deployment ${deployId} with action ${action}`);
|
||||
await toggleDeployment(deployId, action);
|
||||
};
|
||||
|
||||
return (
|
||||
<DashboardLayout
|
||||
title="Deployments"
|
||||
@@ -44,7 +63,7 @@ export default function DeploymentsPage() {
|
||||
<Badge>
|
||||
{loading
|
||||
? "Loading…"
|
||||
: `${deployments.length} deployment${deployments.length > 0 && 's'}`}
|
||||
: `${deployments.length} deployment${deployments.length > 0 && "s"}`}
|
||||
</Badge>
|
||||
|
||||
<DeployAppDialog>
|
||||
@@ -55,79 +74,75 @@ export default function DeploymentsPage() {
|
||||
</DeployAppDialog>
|
||||
</div>
|
||||
|
||||
{/* Desktop */}
|
||||
<div className="hidden md:block space-y-3">
|
||||
<div className="divide-y divide-border flex flex-col gap-5">
|
||||
{deployments.map((dep) => {
|
||||
const appName =
|
||||
appNameByContainer.get(dep.container) ?? "Unknown app";
|
||||
|
||||
return (
|
||||
<div
|
||||
key={`${dep.image}-${dep.container ?? "latest"}`}
|
||||
className="flex items-center justify-between py-2 border-b border-border last:border-0"
|
||||
>
|
||||
<div className="flex items-center gap-3">
|
||||
<span
|
||||
className={cn(
|
||||
"size-2 rounded-full",
|
||||
statusDot[dep.status as keyof typeof statusDot] ??
|
||||
statusDot.stopped
|
||||
)}
|
||||
/>
|
||||
<div>
|
||||
<div className="font-mono text-sm">{appName}</div>
|
||||
<div className="text-xs text-muted-foreground">
|
||||
{dep.image}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-1">
|
||||
<Button variant="ghost" size="icon-sm">
|
||||
<Eye className="w-3 h-3" />
|
||||
</Button>
|
||||
<Button variant="ghost" size="icon-sm">
|
||||
<RotateCcw className="w-3 h-3" />
|
||||
</Button>
|
||||
<Button variant="ghost" size="icon-sm">
|
||||
<MoreVertical className="w-3 h-3" />
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
|
||||
{/* Mobile */}
|
||||
<div className="md:hidden divide-y divide-border">
|
||||
{deployments.map((dep) => {
|
||||
const appName =
|
||||
appNameByContainer.get(dep.container) ?? "Unknown app";
|
||||
|
||||
return (
|
||||
<div key={`${dep.container}-mobile`} className="p-4 space-y-3">
|
||||
<Card key={`${dep.image}-${dep.container ?? "latest"}`}>
|
||||
<CardContent>
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex items-center gap-2">
|
||||
<Rocket className="w-4 h-4 text-muted-foreground" />
|
||||
<span className="font-mono text-sm">{appName}</span>
|
||||
</div>
|
||||
<span className="text-xs text-muted-foreground">
|
||||
{dep.status}
|
||||
<span
|
||||
className={cn(
|
||||
"size-2 rounded-full animate-pulse",
|
||||
statusDot[dep.status as keyof typeof statusDot] ??
|
||||
statusDot.stopped,
|
||||
)}
|
||||
/>
|
||||
<CardTitle>
|
||||
{dep.name} @{" "}
|
||||
<span className="text-primary-foreground">
|
||||
{appByContainer.get(dep.container)?.name ??
|
||||
"Unknown app"}
|
||||
</span>
|
||||
</CardTitle>
|
||||
<CardDescription className="flex gap-3">
|
||||
{dep.ports.map(([to, from]) => (
|
||||
<span key={`${from}-${to}`}>
|
||||
{from} → {to}
|
||||
</span>
|
||||
))}
|
||||
</CardDescription>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-end gap-1 pt-2">
|
||||
<Button variant="ghost" size="icon-sm">
|
||||
<Eye className="w-3 h-3" />
|
||||
<p className="hidden xl:block text-muted-foreground">
|
||||
{dep.image}
|
||||
</p>
|
||||
<div className="flex justify-end gap-1">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon-sm"
|
||||
onClick={async () =>
|
||||
await changeDeploymentStatus(
|
||||
dep.container,
|
||||
dep.status === "stopped" ? "start" : "stop",
|
||||
)
|
||||
}
|
||||
>
|
||||
{dep.status === "stopped" ? (
|
||||
<Play className="w-3 h-3" />
|
||||
) : dep.status === "running" ? (
|
||||
<Square className="w-3 h-3" />
|
||||
) : (
|
||||
<Square className="w-3 h-3 text-primary" />
|
||||
)}
|
||||
</Button>
|
||||
<DeployAppDialog
|
||||
defaultApp={appByContainer.get(dep.container)?.id}
|
||||
ports={dep.ports.map(([to, from]) => ({
|
||||
containerPort: from.toString(),
|
||||
hostPort: to.toString(),
|
||||
protocol: "tcp",
|
||||
}))}
|
||||
nodeId={dep.nodeId}
|
||||
>
|
||||
<Button variant="ghost" size="icon-sm">
|
||||
<RotateCcw className="w-3 h-3" />
|
||||
</Button>
|
||||
<Button variant="ghost" size="icon-sm">
|
||||
<MoreVertical className="w-3 h-3" />
|
||||
</Button>
|
||||
</DeployAppDialog>
|
||||
<RemoveDialog remove={() => {}} />
|
||||
</div>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
|
||||
@@ -21,11 +21,16 @@ import { useAsync } from "@/hooks/use-async";
|
||||
export default function EnvironmentPage() {
|
||||
const [isSaving, setIsSaving] = useState(false);
|
||||
const [showSecrets, setShowSecrets] = useState<Record<string, boolean>>({});
|
||||
const { value: envGroups, setValue: setEnvGroups } = useAsync({}, getEnv);
|
||||
const { value: envGroups, setValue: setEnvGroups } = useAsync(
|
||||
"env",
|
||||
{},
|
||||
getEnv,
|
||||
);
|
||||
const { value: selectedApp, setValue: setSelectedApp } = useAsync(
|
||||
"selectedApp",
|
||||
"",
|
||||
async () => Object.keys(envGroups)[0] || "",
|
||||
[envGroups]
|
||||
[envGroups],
|
||||
);
|
||||
|
||||
const handleSave = async () => {
|
||||
|
||||
+37
-6
@@ -1,6 +1,6 @@
|
||||
"use client";
|
||||
|
||||
import { useState } from "react";
|
||||
import { useEffect, useRef, useState } from "react";
|
||||
import { DashboardLayout } from "@/components/dashboard/DashboardLayout";
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
import { Button } from "@/components/ui/button";
|
||||
@@ -14,19 +14,43 @@ import { AnsiText } from "@/components/ansi/Ansi";
|
||||
|
||||
export default function LogsPage() {
|
||||
const [isPaused, setIsPaused] = useState(false);
|
||||
const containerRef = useRef<HTMLDivElement>(null);
|
||||
const bottomRef = useRef<HTMLDivElement>(null);
|
||||
const shouldAutoScroll = useRef(true);
|
||||
|
||||
const [filter, setFilter] = useState<"all" | "info" | "warn" | "error">(
|
||||
"all"
|
||||
"all",
|
||||
);
|
||||
const { value: logs, setValue: setLogs } = useAsyncInterval(
|
||||
"logs",
|
||||
[],
|
||||
async () => (isPaused ? ([] as Log[]) : getAllContainerLogs()),
|
||||
1000
|
||||
1000,
|
||||
);
|
||||
|
||||
const filteredLogs = logs.filter((log) =>
|
||||
filter === "all" ? true : log.level === filter
|
||||
filter === "all" ? true : log.level === filter,
|
||||
);
|
||||
|
||||
const handleScroll = () => {
|
||||
const el = containerRef.current;
|
||||
if (!el) return;
|
||||
|
||||
const threshold = 20; // px from bottom
|
||||
const isAtBottom =
|
||||
el.scrollHeight - el.scrollTop - el.clientHeight < threshold;
|
||||
|
||||
shouldAutoScroll.current = isAtBottom;
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (!shouldAutoScroll.current || isPaused) return;
|
||||
|
||||
bottomRef.current?.scrollIntoView({
|
||||
behavior: "smooth",
|
||||
});
|
||||
}, [filteredLogs, isPaused]);
|
||||
|
||||
const handleExport = () => {
|
||||
// Convert data to JSON string
|
||||
const json = JSON.stringify(filteredLogs, null, 2);
|
||||
@@ -155,7 +179,11 @@ export default function LogsPage() {
|
||||
</div>
|
||||
</CardHeader>
|
||||
|
||||
<CardContent className="p-0 overflow-auto h-[calc(100%-48px)]">
|
||||
<CardContent
|
||||
className="p-0 overflow-auto h-[calc(100%-48px)]"
|
||||
ref={containerRef}
|
||||
onScroll={handleScroll}
|
||||
>
|
||||
<div className="font-mono text-xs px-3 md:px-6 space-y-2 md:space-y-0">
|
||||
{filteredLogs.map((log, index) => (
|
||||
<div
|
||||
@@ -171,7 +199,7 @@ export default function LogsPage() {
|
||||
<span
|
||||
className={cn(
|
||||
"uppercase md:w-12 md:shrink-0 md:mx-3",
|
||||
getLevelClass(log.level)
|
||||
getLevelClass(log.level),
|
||||
)}
|
||||
>
|
||||
[{log.level}]
|
||||
@@ -187,6 +215,9 @@ export default function LogsPage() {
|
||||
{log.message}
|
||||
</span> */}
|
||||
<AnsiText text={log.message} />
|
||||
|
||||
{/* Scroll anchor */}
|
||||
<div ref={bottomRef} />
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
@@ -31,10 +31,17 @@ export default function MonitoringPage() {
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
// Metrics polling every 30 seconds
|
||||
const { value: metrics } = useAsyncInterval([], getMetrics, 30000, []);
|
||||
const { value: metrics } = useAsyncInterval(
|
||||
"metrics",
|
||||
[],
|
||||
getMetrics,
|
||||
30000,
|
||||
[],
|
||||
);
|
||||
|
||||
// Live nodes polling every 3 seconds
|
||||
const { value: liveData } = useAsyncInterval(
|
||||
"liveNodes",
|
||||
{ cpuUsage: 0, ramUsage: 0 },
|
||||
async () => {
|
||||
const nodes = await getLiveNodes();
|
||||
@@ -44,11 +51,12 @@ export default function MonitoringPage() {
|
||||
};
|
||||
},
|
||||
3000,
|
||||
[]
|
||||
[],
|
||||
);
|
||||
|
||||
// Container stats
|
||||
const { value: containerStats } = useAsync(
|
||||
"containerStats",
|
||||
[],
|
||||
async () => {
|
||||
const nodes = await getNodes();
|
||||
@@ -61,18 +69,18 @@ export default function MonitoringPage() {
|
||||
const stats = await getContainerStats(c.Id);
|
||||
if (!stats) return undefined;
|
||||
return { ...stats, name: c.Names[0] };
|
||||
})
|
||||
)
|
||||
}),
|
||||
),
|
||||
)
|
||||
).filter((s): s is SimpleStats & { name: string } => s !== undefined);
|
||||
},
|
||||
[]
|
||||
[],
|
||||
);
|
||||
|
||||
const containerCPU = containerStats.reduce((acc, val) => acc + val.cpu, 0);
|
||||
const containerMemory = containerStats.reduce(
|
||||
(acc, val) => acc + val.memory,
|
||||
0
|
||||
0,
|
||||
);
|
||||
|
||||
return (
|
||||
|
||||
@@ -35,14 +35,18 @@ function DiskUsage({ liveData }: NodeLiveData) {
|
||||
|
||||
export default function NodesPage() {
|
||||
const { value: nodes, setValue: setNodes } = useAsyncInterval(
|
||||
"liveNodes",
|
||||
[],
|
||||
getLiveNodes,
|
||||
3000
|
||||
3000,
|
||||
);
|
||||
|
||||
const { value: dockerNodes } = useAsync([], async () => getDocker(nodes), [
|
||||
nodes,
|
||||
]);
|
||||
const { value: dockerNodes } = useAsync(
|
||||
"docker",
|
||||
[],
|
||||
async () => getDocker(nodes),
|
||||
[nodes],
|
||||
);
|
||||
|
||||
return (
|
||||
<DashboardLayout title="Nodes" subtitle="Cluster node management">
|
||||
|
||||
+26
-28
@@ -5,26 +5,11 @@ import { StatCard } from "@/components/dashboard/StatCard";
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import {
|
||||
Box,
|
||||
Server,
|
||||
Container,
|
||||
Activity,
|
||||
ArrowRight,
|
||||
Clock,
|
||||
Rocket,
|
||||
} from "lucide-react";
|
||||
import { Box, Server, Container, ArrowRight, Rocket } from "lucide-react";
|
||||
import { Progress } from "@/components/ui/progress";
|
||||
import Link from "next/link";
|
||||
import { getLiveNodes } from "@/lib/dockship/node";
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import {
|
||||
Application,
|
||||
Deployment,
|
||||
Docker,
|
||||
Node,
|
||||
NodeLiveData,
|
||||
} from "@/lib/types";
|
||||
import { useMemo } from "react";
|
||||
import { getDocker } from "@/lib/dockship/docker";
|
||||
import { getApps } from "@/lib/dockship/application";
|
||||
import { cn } from "@/lib/utils";
|
||||
@@ -32,15 +17,24 @@ import { getDeployments } from "@/lib/dockship/deploy";
|
||||
import { useAsync, useAsyncInterval } from "@/hooks/use-async";
|
||||
|
||||
export default function OverviewPage() {
|
||||
const { value: nodes } = useAsyncInterval([], getLiveNodes, 3000);
|
||||
const { value: dockerNodes } = useAsync([], async () => getDocker(nodes), [
|
||||
nodes,
|
||||
]);
|
||||
const { value: apps } = useAsyncInterval([], getApps, 3000);
|
||||
const { value: nodes } = useAsyncInterval(
|
||||
"liveNodes",
|
||||
[],
|
||||
getLiveNodes,
|
||||
3000,
|
||||
);
|
||||
const { value: dockerNodes } = useAsync(
|
||||
"docker",
|
||||
[],
|
||||
async () => getDocker(nodes),
|
||||
[nodes],
|
||||
);
|
||||
const { value: apps } = useAsyncInterval("apps", [], getApps, 3000);
|
||||
const { value: deployments } = useAsyncInterval(
|
||||
"deployments",
|
||||
[],
|
||||
async () => (await getDeployments()).filter((d) => d !== null),
|
||||
3000
|
||||
3000,
|
||||
);
|
||||
|
||||
const appNameByContainer = useMemo(() => {
|
||||
@@ -67,8 +61,8 @@ export default function OverviewPage() {
|
||||
/>
|
||||
<StatCard
|
||||
title="Deployments"
|
||||
value="0"
|
||||
subtitle="0 running"
|
||||
value={deployments.length}
|
||||
subtitle={`${deployments.filter((d) => d.status === "running").length} running`}
|
||||
icon={<Rocket className="w-4 h-4" />}
|
||||
/>
|
||||
<StatCard
|
||||
@@ -82,7 +76,7 @@ export default function OverviewPage() {
|
||||
value={dockerNodes.reduce(
|
||||
(sum, n) =>
|
||||
sum + n.containers.filter((c) => c.State === "running").length,
|
||||
0
|
||||
0,
|
||||
)}
|
||||
subtitle="running"
|
||||
icon={<Container className="w-4 h-4" />}
|
||||
@@ -164,12 +158,16 @@ export default function OverviewPage() {
|
||||
"size-2 rounded-full",
|
||||
(dep.status === "running" && "bg-chart-2") ||
|
||||
(dep.status === "pending" && "bg-chart-1") ||
|
||||
"bg-slate-400 dark:bg-slate-600"
|
||||
"bg-slate-400 dark:bg-slate-600",
|
||||
)}
|
||||
/>
|
||||
<div>
|
||||
<div className="font-mono text-sm">
|
||||
{appNameByContainer.get(dep.container)}
|
||||
{dep.name} @{" "}
|
||||
<span className="text-primary-foreground">
|
||||
{appNameByContainer.get(dep.container) ??
|
||||
"Unknown app"}
|
||||
</span>
|
||||
</div>
|
||||
<div className="text-xs text-muted-foreground">
|
||||
{dep.image.slice(7, 19)}
|
||||
|
||||
@@ -24,17 +24,21 @@ import { Plus } from "lucide-react";
|
||||
export default function DeployAppDialog({
|
||||
defaultApp,
|
||||
children,
|
||||
ports: initialPorts,
|
||||
nodeId: defaultNode,
|
||||
}: {
|
||||
defaultApp?: string;
|
||||
nodeId?: string;
|
||||
ports?: Port[];
|
||||
children: ReactNode;
|
||||
}) {
|
||||
const { value: nodes } = useAsync([], getLiveNodes);
|
||||
const { value: apps } = useAsync<Application[]>([], getApps);
|
||||
const { value: nodes } = useAsync("liveNodes", [], getLiveNodes);
|
||||
const { value: apps } = useAsync<Application[]>("apps", [], getApps);
|
||||
const [name, setName] = useState("");
|
||||
const [app, setApp] = useState(defaultApp || "");
|
||||
const [node, setNode] = useState("");
|
||||
const [node, setNode] = useState(defaultNode || "");
|
||||
|
||||
const [ports, setPorts] = useState<Port[]>([]);
|
||||
const [ports, setPorts] = useState<Port[]>(initialPorts || []);
|
||||
const [newPort, setNewPort] = useState<Port>({
|
||||
containerPort: "",
|
||||
hostPort: "",
|
||||
|
||||
@@ -13,10 +13,7 @@ import {
|
||||
} from "@/components/ui/dialog";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { getLiveNodes } from "@/lib/dockship/node";
|
||||
import { Combobox } from "../ui/combobox";
|
||||
import { registerApp } from "@/lib/dockship/application";
|
||||
import { useAsync } from "@/hooks/use-async";
|
||||
|
||||
export default function RegisterAppDialog({
|
||||
children,
|
||||
|
||||
+32
-18
@@ -7,8 +7,8 @@ import path from "path";
|
||||
import fs from "fs";
|
||||
import pLimit from "p-limit";
|
||||
import { randomUUID } from "crypto";
|
||||
import simpleGit from "simple-git";
|
||||
import { cloneRepo } from "./git";
|
||||
import tar from "tar-fs";
|
||||
|
||||
const docker = new Docker();
|
||||
|
||||
@@ -35,7 +35,7 @@ function formatPorts(ports: Port[]) {
|
||||
}
|
||||
|
||||
export async function getDeployments(
|
||||
apps: Application[]
|
||||
apps: Application[],
|
||||
): Promise<Deployment[]> {
|
||||
const limit = pLimit(5);
|
||||
|
||||
@@ -84,6 +84,7 @@ export async function getDeployments(
|
||||
}
|
||||
|
||||
return {
|
||||
name: containerInfo.Name.replace(/^\//, ""),
|
||||
image: containerInfo.Image,
|
||||
container: containerInfo.Id,
|
||||
cpu,
|
||||
@@ -91,27 +92,27 @@ export async function getDeployments(
|
||||
status: containerInfo.State?.Running ? "running" : "stopped",
|
||||
ports: [...ports.entries()].map(
|
||||
([publicPort, privatePort]) =>
|
||||
[publicPort, privatePort] as [number, number]
|
||||
[publicPort, privatePort] as [number, number],
|
||||
),
|
||||
};
|
||||
} catch {
|
||||
// Container may have stopped / been removed
|
||||
return null;
|
||||
}
|
||||
})
|
||||
)
|
||||
}),
|
||||
),
|
||||
);
|
||||
|
||||
// Remove failed containers
|
||||
return results.filter(
|
||||
(deployment: any): deployment is Deployment => deployment !== null
|
||||
(deployment: any): deployment is Deployment => deployment !== null,
|
||||
);
|
||||
}
|
||||
|
||||
export async function deployApp(
|
||||
name: string,
|
||||
app: Application,
|
||||
ports: Port[]
|
||||
ports: Port[],
|
||||
): Promise<string | undefined> {
|
||||
const deployId = randomUUID();
|
||||
const deployPath = path.join("data", "deploys", deployId);
|
||||
@@ -129,17 +130,13 @@ export async function deployApp(
|
||||
}
|
||||
|
||||
try {
|
||||
const stream = await docker.buildImage(
|
||||
{
|
||||
context: deployPath,
|
||||
src: ["Dockerfile", "."],
|
||||
},
|
||||
{ t: imageTag }
|
||||
);
|
||||
const stream = await docker.buildImage(tar.pack(deployPath), {
|
||||
t: imageTag,
|
||||
});
|
||||
|
||||
await new Promise<void>((resolve, reject) => {
|
||||
docker.modem.followProgress(stream, (err: Error | null) =>
|
||||
err ? reject(err) : resolve()
|
||||
err ? reject(err) : resolve(),
|
||||
);
|
||||
});
|
||||
|
||||
@@ -151,13 +148,13 @@ export async function deployApp(
|
||||
RestartPolicy: { Name: "unless-stopped" },
|
||||
PortBindings: formatPorts(ports),
|
||||
},
|
||||
Env: Object.entries(app.env).map(
|
||||
([key, { value }]) => `${key}="${value.replaceAll('"', '\\"')}"`
|
||||
),
|
||||
Env: Object.entries(app.env).map(([key, { value }]) => `${key}=${value}`),
|
||||
});
|
||||
|
||||
await container.start();
|
||||
|
||||
await docker.pruneImages();
|
||||
|
||||
return container.id;
|
||||
} catch (err) {
|
||||
console.error("Failed to deploy app:", err);
|
||||
@@ -166,3 +163,20 @@ export async function deployApp(
|
||||
fs.rmSync(deployPath, { recursive: true, force: true });
|
||||
}
|
||||
}
|
||||
|
||||
export async function toggleDeployment(
|
||||
containerId: string,
|
||||
action: "start" | "stop",
|
||||
) {
|
||||
const container = docker.getContainer(containerId);
|
||||
|
||||
try {
|
||||
if (action === "start") {
|
||||
await container.start();
|
||||
} else {
|
||||
await container.stop();
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(`Failed to ${action} container ${containerId}:`, err);
|
||||
}
|
||||
}
|
||||
|
||||
+35
-17
@@ -1,20 +1,31 @@
|
||||
import { useState, useEffect } from "react";
|
||||
|
||||
export function useAsync<T>(
|
||||
cacheKey: string,
|
||||
defaultValue: T,
|
||||
asyncFunction: () => Promise<T>,
|
||||
dependencies: any[] = []
|
||||
dependencies: any[] = [],
|
||||
) {
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState<null | Error>(null);
|
||||
const [value, setValue] = useState<T>(defaultValue);
|
||||
const [value, setValue] = useState<T>(() => {
|
||||
try {
|
||||
const cached = localStorage.getItem(cacheKey);
|
||||
return cached ? (JSON.parse(cached) as T) : defaultValue;
|
||||
} catch {
|
||||
return defaultValue;
|
||||
}
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
let isMounted = true;
|
||||
setLoading(true);
|
||||
|
||||
asyncFunction()
|
||||
.then((result) => {
|
||||
if (isMounted) setValue(result);
|
||||
if (!isMounted) return;
|
||||
setValue(result);
|
||||
localStorage.setItem(cacheKey, JSON.stringify(result));
|
||||
})
|
||||
.catch((err) => {
|
||||
if (isMounted) setError(err);
|
||||
@@ -32,35 +43,42 @@ export function useAsync<T>(
|
||||
}
|
||||
|
||||
export function useAsyncInterval<T>(
|
||||
cacheKey: string,
|
||||
defaultValue: T,
|
||||
asyncFunction: () => Promise<T>,
|
||||
interval: number,
|
||||
dependencies: any[] = []
|
||||
dependencies: any[] = [],
|
||||
) {
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState<null | Error>(null);
|
||||
const [value, setValue] = useState<T>(defaultValue);
|
||||
const [value, setValue] = useState<T>(() => {
|
||||
try {
|
||||
const cached = localStorage.getItem(cacheKey);
|
||||
return cached ? (JSON.parse(cached) as T) : defaultValue;
|
||||
} catch {
|
||||
return defaultValue;
|
||||
}
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
let isMounted = true;
|
||||
|
||||
const run = () => {
|
||||
const run = async () => {
|
||||
setLoading(true);
|
||||
asyncFunction()
|
||||
.then((result) => {
|
||||
if (isMounted) setValue(result);
|
||||
})
|
||||
.catch((err) => {
|
||||
if (isMounted) setError(err);
|
||||
})
|
||||
.finally(() => {
|
||||
try {
|
||||
const result = await asyncFunction();
|
||||
if (!isMounted) return;
|
||||
setValue(result);
|
||||
localStorage.setItem(cacheKey, JSON.stringify(result));
|
||||
} catch (err) {
|
||||
if (isMounted) setError(err as Error);
|
||||
} finally {
|
||||
if (isMounted) setLoading(false);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const iid = setInterval(run, interval);
|
||||
|
||||
run();
|
||||
const iid = setInterval(run, interval);
|
||||
|
||||
return () => {
|
||||
isMounted = false;
|
||||
|
||||
@@ -1,21 +1,11 @@
|
||||
"use server";
|
||||
|
||||
import { client } from "@/core/auth/oauth";
|
||||
import { cookies, headers } from "next/headers";
|
||||
import { cookies } from "next/headers";
|
||||
import { redirect } from "next/navigation";
|
||||
|
||||
export async function redirectAuth() {
|
||||
// Get headers of the incoming request
|
||||
const hdrs = await headers();
|
||||
|
||||
// Get protocol and host
|
||||
const host = hdrs.get("host");
|
||||
const proto = hdrs.get("x-forwarded-proto") || "http";
|
||||
|
||||
const baseUrl = `${proto}://${host}`;
|
||||
|
||||
const authorizationUri = client.authorizeURL({
|
||||
redirect_uri: `${baseUrl}/api/auth/callback`,
|
||||
scope: "user:email",
|
||||
state: "random_state_string",
|
||||
});
|
||||
|
||||
@@ -5,7 +5,9 @@ import { getNodes } from "./node";
|
||||
import axios from "axios";
|
||||
import { editApp, getApp, getApps } from "./application";
|
||||
|
||||
export async function getDeployments(): Promise<Deployment[]> {
|
||||
export async function getDeployments(): Promise<
|
||||
(Deployment & { nodeId: string })[]
|
||||
> {
|
||||
const nodes = await getNodes();
|
||||
const apps = await getApps();
|
||||
|
||||
@@ -17,8 +19,8 @@ export async function getDeployments(): Promise<Deployment[]> {
|
||||
await axios.post(`http://${n.ip}:3000/api/get-deployments`, apps, {
|
||||
headers: { Authorization: `ApiKey ${n.key}` },
|
||||
})
|
||||
).data.deployments
|
||||
)
|
||||
).data.deployments.map((d: any) => ({ ...d, nodeId: n.node_id })),
|
||||
),
|
||||
)
|
||||
).flat();
|
||||
}
|
||||
@@ -27,7 +29,7 @@ export async function deployApp(
|
||||
name: string,
|
||||
appId: string,
|
||||
nodeId: string,
|
||||
ports: Port[]
|
||||
ports: Port[],
|
||||
): Promise<string | undefined> {
|
||||
const nodes = await getNodes();
|
||||
|
||||
@@ -44,7 +46,7 @@ export async function deployApp(
|
||||
{ name, app, ports },
|
||||
{
|
||||
headers: { Authorization: `ApiKey ${node.key}` },
|
||||
}
|
||||
},
|
||||
)
|
||||
).data.deployId;
|
||||
|
||||
@@ -54,3 +56,25 @@ export async function deployApp(
|
||||
|
||||
return deployId;
|
||||
}
|
||||
|
||||
export async function toggleDeployment(
|
||||
deployId: string,
|
||||
action: "start" | "stop",
|
||||
) {
|
||||
const nodes = await getNodes();
|
||||
|
||||
await Promise.all(
|
||||
nodes.map(
|
||||
async (node) =>
|
||||
await axios.put(
|
||||
`http://${node.ip}:3000/api/deploy`,
|
||||
{ deployId, action },
|
||||
{
|
||||
headers: { Authorization: `ApiKey ${node.key}` },
|
||||
},
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
return "ok";
|
||||
}
|
||||
|
||||
@@ -58,6 +58,7 @@ export interface Application {
|
||||
}
|
||||
|
||||
export interface Deployment {
|
||||
name: string;
|
||||
image: string;
|
||||
container: string;
|
||||
cpu: number;
|
||||
|
||||
Reference in New Issue
Block a user