feat: add swarm tab and dashboard page for managing Docker swarm

This commit is contained in:
djknaeckebrot
2024-12-17 12:05:02 +01:00
parent b592a025e4
commit 04d3eb9ec0
2 changed files with 235 additions and 144 deletions

View File

@@ -21,7 +21,8 @@ export type TabState =
| "settings" | "settings"
| "traefik" | "traefik"
| "requests" | "requests"
| "docker"; | "docker"
| "swarm";
const getTabMaps = (isCloud: boolean) => { const getTabMaps = (isCloud: boolean) => {
const elements: TabInfo[] = [ const elements: TabInfo[] = [
@@ -60,6 +61,15 @@ const getTabMaps = (isCloud: boolean) => {
}, },
type: "docker", type: "docker",
}, },
{
label: "Swarm",
description: "Manage your docker swarm",
index: "/dashboard/swarm",
isShow: ({ rol, user }) => {
return Boolean(rol === "admin" || user?.canAccessToDocker);
},
type: "swarm",
},
{ {
label: "Requests", label: "Requests",
description: "Manage your requests", description: "Manage your requests",
@@ -68,7 +78,7 @@ const getTabMaps = (isCloud: boolean) => {
return Boolean(rol === "admin" || user?.canAccessToDocker); return Boolean(rol === "admin" || user?.canAccessToDocker);
}, },
type: "requests", type: "requests",
}, }
); );
} }
@@ -101,7 +111,7 @@ export const NavigationTabs = ({ tab, children }: Props) => {
}, },
{ {
enabled: !!data?.id && data?.rol === "user", enabled: !!data?.id && data?.rol === "user",
}, }
); );
useEffect(() => { useEffect(() => {

View File

@@ -0,0 +1,81 @@
import { ShowSwarm } from "@/components/dashboard/swarm/show/node-list";
import ShowSwarmNodes from "@/components/dashboard/swarm/show/show-nodes";
import { DashboardLayout } from "@/components/layouts/dashboard-layout";
import { appRouter } from "@/server/api/root";
import { IS_CLOUD, validateRequest } from "@dokploy/server";
import { createServerSideHelpers } from "@trpc/react-query/server";
import type { GetServerSidePropsContext } from "next";
import React, { type ReactElement } from "react";
import superjson from "superjson";
const Dashboard = () => {
return <ShowSwarmNodes />;
};
export default Dashboard;
Dashboard.getLayout = (page: ReactElement) => {
return <DashboardLayout tab={"swarm"}>{page}</DashboardLayout>;
};
export async function getServerSideProps(
ctx: GetServerSidePropsContext<{ serviceId: string }>
) {
if (IS_CLOUD) {
return {
redirect: {
permanent: true,
destination: "/dashboard/projects",
},
};
}
const { user, session } = await validateRequest(ctx.req, ctx.res);
if (!user) {
return {
redirect: {
permanent: true,
destination: "/",
},
};
}
const { req, res } = ctx;
const helpers = createServerSideHelpers({
router: appRouter,
ctx: {
req: req as any,
res: res as any,
db: null as any,
session: session,
user: user,
},
transformer: superjson,
});
try {
await helpers.project.all.prefetch();
const auth = await helpers.auth.get.fetch();
if (auth.rol === "user") {
const user = await helpers.user.byAuthId.fetch({
authId: auth.id,
});
if (!user.canAccessToDocker) {
return {
redirect: {
permanent: true,
destination: "/",
},
};
}
}
return {
props: {
trpcState: helpers.dehydrate(),
},
};
} catch (error) {
return {
props: {},
};
}
}