This commit is contained in:
Benjamin Toby 2026-03-09 17:29:26 +00:00
parent 4c7321f560
commit ab4722af74
8 changed files with 113 additions and 19 deletions

View File

@ -1,8 +1,10 @@
import { AppContext } from "@/src/pages/_app";
import Breadcrumbs from "@/twui/components/elements/Breadcrumbs";
import H1 from "@/twui/components/layout/H1";
import Row from "@/twui/components/layout/Row";
import Span from "@/twui/components/layout/Span";
import Stack from "@/twui/components/layout/Stack";
import { ReactNode } from "react";
import { ReactNode, useContext } from "react";
type Props = {
title: string | ReactNode;
@ -11,6 +13,10 @@ type Props = {
};
export default function AdminHero({ title, ctas, description }: Props) {
const { pageProps } = useContext(AppContext);
console.log("pageProps.pageUrl", pageProps.pageUrl);
return (
<Row className="w-full grid-cell-content justify-between">
<Stack className="gap-2">
@ -18,6 +24,10 @@ export default function AdminHero({ title, ctas, description }: Props) {
{description ? (
<Span variant="faded">{description}</Span>
) : null}
<Breadcrumbs
pageUrl={pageProps.pageUrl || undefined}
skipHome
/>
</Stack>
<Row>{ctas}</Row>
</Row>

View File

@ -0,0 +1,32 @@
import Stack from "@/twui/components/layout/Stack";
import { useContext } from "react";
import { AppContext } from "@/src/pages/_app";
import {
NormalizedServerObject,
ParsedDeploymentServiceConfig,
} from "@/src/types";
type Props = {
service: ParsedDeploymentServiceConfig;
server: NormalizedServerObject;
};
export default function ServiceClusterServer({ service, server }: Props) {
const { pageProps } = useContext(AppContext);
const { deployment, children_services } = pageProps;
const all_services = [service, ...(children_services || [])];
const deployment_name = deployment?.deployment_name;
const service_name = service?.service_name;
const cluster_servers = service.servers;
return (
<Stack className="w-full grid-cell col-span-1">
{cluster_servers?.map((server, index) => {
return null;
})}
</Stack>
);
}

View File

@ -0,0 +1,31 @@
import Stack from "@/twui/components/layout/Stack";
import { useContext } from "react";
import { AppContext } from "@/src/pages/_app";
import { ParsedDeploymentServiceConfig } from "@/src/types";
import Row from "@/twui/components/layout/Row";
type Props = {
service: ParsedDeploymentServiceConfig;
};
export default function ServiceCluster({ service }: Props) {
const { pageProps } = useContext(AppContext);
const { deployment, children_services } = pageProps;
const all_services = [service, ...(children_services || [])];
const deployment_name = deployment?.deployment_name;
const service_name = service?.service_name;
const cluster_servers = service.servers;
return (
<Stack className="w-full grid-cell col-span-1">
<Row className="grid-cell-content">
{cluster_servers?.map((server, index) => {
return <code>{server.private_ip}</code>;
})}
</Row>
</Stack>
);
}

View File

@ -0,0 +1,20 @@
import Stack from "@/twui/components/layout/Stack";
import { useContext } from "react";
import { AppContext } from "@/src/pages/_app";
import ServiceCluster from "../(partials)/cluster";
export default function ServiceClusters() {
const { pageProps } = useContext(AppContext);
const { service, deployment, children_services } = pageProps;
const all_services = [service, ...(children_services || [])];
return (
<Stack className="w-full nested-grid-frame grid-cols-1 xl:grid-cols-2">
{all_services.map((srv, index) => {
if (!srv) return null;
return <ServiceCluster key={index} service={srv} />;
})}
</Stack>
);
}

View File

@ -1,9 +1,10 @@
import Stack from "@/twui/components/layout/Stack";
import { useContext } from "react";
import { Fragment, useContext } from "react";
import { AppContext } from "@/src/pages/_app";
import twuiSlugToNormalText from "@/twui/components/utils/slug-to-normal-text";
import Divider from "@/twui/components/layout/Divider";
import AdminHero from "@/src/components/general/admin/hero";
import ServiceClusters from "./(sections)/clusters";
export default function Main() {
const { pageProps } = useContext(AppContext);
@ -13,7 +14,7 @@ export default function Main() {
const service_name = service?.service_name;
return (
<Stack>
<Fragment>
<AdminHero
title={`${twuiSlugToNormalText(service_name)} Service`}
description={
@ -25,6 +26,7 @@ export default function Main() {
}
/>
<Divider />
</Stack>
<ServiceClusters />
</Fragment>
);
}

View File

@ -13,7 +13,7 @@ export default function Layout({ children }: Props) {
<Main className="w-screen h-screen overflow-hidden p-4 lg:p-10">
<div className="grid-frame grid-cols-6 w-full h-full grid-rows-[64px_47px] xl:grid-rows-[64px_auto]">
<Header />
<Stack className="grid-cell col-span-6 xl:col-span-1">
<Stack className="grid-cell col-span-6 xl:col-span-1 gap-0">
<LinkList
links={AdminAsideLinks}
className="w-full xl:flex-col"
@ -22,7 +22,7 @@ export default function Layout({ children }: Props) {
}}
/>
</Stack>
<Stack className="grid-cell col-span-6 xl:col-span-5">
<Stack className="grid-cell col-span-6 xl:col-span-5 gap-0">
{children}
</Stack>
</div>

View File

@ -42,14 +42,11 @@
}
.nested-grid-frame .grid-cell {
@apply relative z-2;
@apply relative z-2 h-full;
}
.grid-frame.nested-grid-frame .grid-cell {
@apply h-full;
}
.grid-frame > .grid-cell {
.grid-frame > .grid-cell,
.nested-grid-frame .grid-cell {
@apply bg-background-light dark:bg-background-dark;
}
@ -105,3 +102,11 @@ code {
@apply bg-slate-100 dark:bg-white/10 px-3 py-1 rounded-default;
@apply my-1;
}
.twui-a {
@apply border-none;
}
.twui-breadcrumbs-divider {
@apply rotate-12;
}

View File

@ -9,13 +9,7 @@ export default function parsePageUrl(url?: string, admin?: boolean) {
.split("/")
.filter((item) => item !== "");
if (admin) {
finalAdminUrlArray?.splice(1, 1);
}
const finalAdminUrl = finalAdminUrlArray
? "/" + finalAdminUrlArray?.join("/") || ""
: null;
const finalAdminUrl = "/" + finalAdminUrlArray?.join("/") || "";
return finalAdminUrl;
}