Updates

src/components/pages/admin/services/(sections)/services.tsx

@@ -0,0 +1,21 @@
+import { AppContext } from "@/src/pages/_app";
+import Row from "@/twui/components/layout/Row";
+import Stack from "@/twui/components/layout/Stack";
+import { useContext } from "react";
+
+export default function DeploymentServices() {
+    const { pageProps } = useContext(AppContext);
+    const { deployment, children_services } = pageProps;
+
+    const services = deployment?.services;
+
+    return (
+        <Stack className="w-full grid-cell col-span-1">
+            <Row className="grid-cell-content">
+                {services?.map((service, index) => {
+                    return <code key={index}>{service.service_name}</code>;
+                })}
+            </Row>
+        </Stack>
+    );
+}

src/components/pages/admin/services/index.tsx

@@ -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 DeploymentServices from "./(sections)/services";
 
 export default function Main() {
     const { pageProps } = useContext(AppContext);
@@ -12,7 +13,7 @@ export default function Main() {
     const deployment_name = deployment?.deployment_name;
 
     return (
-        <Stack>
+        <Fragment>
             <AdminHero
                 title={`${twuiSlugToNormalText(deployment_name)} Deplyoment Dashboard`}
                 description={
@@ -25,6 +26,7 @@ export default function Main() {
                 }
             />
             <Divider />
-        </Stack>
+            <DeploymentServices />
+        </Fragment>
     );
 }