cleanup files and imports

frontend/src/pages/dashboard/components/recently-viewed.tsx

@@ -1,5 +1,5 @@
 import { useRead, useUser } from "@hooks";
-import { BuildCard } from "@resources/build/card";
+import { BuildCard } from "@resources/build";
 import { useState } from "react";
 import {
   DropdownMenu,
@@ -12,14 +12,14 @@ import {
 } from "@ui/dropdown";
 import { Button } from "@ui/button";
 import { ChevronDown, History, PlusCircle } from "lucide-react";
-import { DeploymentCard } from "@resources/deployment/card";
+import { DeploymentCard } from "@resources/deployment";
 import { NewDeployment } from "@resources/deployment/new";
-import { ServerCard } from "@resources/server/card";
+import { ServerCard } from "@resources/server";
 import { NewBuild } from "@resources/build/new";
 import { Types } from "@monitor/client";
 import { NewBuilder } from "@resources/builder/new";
 import { ResourceTarget } from "@monitor/client/dist/types";
-import { BuilderCard } from "@resources/builder/card";
+import { BuilderCard } from "@resources/builder";
 
 const NewResource = () => {
   const [open, set] = useState<Types.ResourceTarget["type"] | false>(false);

frontend/src/resources/alerter/index.tsx

@@ -1,3 +1,4 @@
+import { ResourceUpdates } from "@components/updates/resource";
 import { useRead, useWrite } from "@hooks";
 import { Resource } from "@layouts/resource";
 import { useEffect } from "react";
@@ -30,6 +31,9 @@ export const Alerter = () => {
     <Resource
       title={<AlerterName id={id} />}
       info={<AlerterInfo id={id} />}
-    ></Resource>
+      actions={<></>}
+    >
+      <ResourceUpdates type="Alerter" id={id} />
+    </Resource>
   );
 };

frontend/src/resources/build/card.tsx

@@ -1,24 +0,0 @@
-import { useRead } from "@hooks";
-import { version_to_string } from "@util/helpers";
-import { Link } from "react-router-dom";
-import { BuildInfo } from "./util";
-import { Hammer } from "lucide-react";
-import { ResourceCard } from "@layouts/card";
-
-export const BuildCard = ({ id }: { id: string }) => {
-  const builds = useRead("ListBuilds", {}).data;
-  const build = builds?.find((server) => server.id === id);
-  if (!build) return null;
-
-  return (
-    <Link to={`/builds/${build.id}`} key={build.id}>
-      <ResourceCard
-        title={build.name}
-        description={version_to_string(build.version) ?? "not built"}
-        statusIcon={<Hammer className="w-4 h-4" />}
-      >
-        <BuildInfo id={id} />
-      </ResourceCard>
-    </Link>
-  );
-};

frontend/src/resources/build/index.tsx

@@ -3,10 +3,13 @@ import { Resource } from "@layouts/resource";
 import { BuildName, BuildVersion } from "./util";
 import { Link, useParams } from "react-router-dom";
 import { RebuildBuild } from "./components/actions";
-import { Button } from "@ui/button";
-import { Settings } from "lucide-react";
 import { BuildConfig } from "./config";
 import { useEffect } from "react";
+import { useRead } from "@hooks";
+import { version_to_string } from "@util/helpers";
+import { BuildInfo } from "./util";
+import { Hammer } from "lucide-react";
+import { ResourceCard } from "@layouts/card";
 
 export const BuildPage = () => {
   const id = useParams().buildId;
@@ -25,18 +28,27 @@ export const BuildPage = () => {
           <BuildVersion id={id} />
         </div>
       }
-      actions={
-        <div className="flex gap-4">
-          <RebuildBuild buildId={id} />
-          <Link to={`/builds/${id}/config`}>
-            <Button variant="outline">
-              <Settings className="w-4 h-4" />
-            </Button>
-          </Link>
-        </div>
-      }
+      actions={<RebuildBuild buildId={id} />}
     >
       <BuildConfig />
     </Resource>
   );
 };
+
+export const BuildCard = ({ id }: { id: string }) => {
+  const builds = useRead("ListBuilds", {}).data;
+  const build = builds?.find((server) => server.id === id);
+  if (!build) return null;
+
+  return (
+    <Link to={`/builds/${build.id}`} key={build.id}>
+      <ResourceCard
+        title={build.name}
+        description={version_to_string(build.version) ?? "not built"}
+        statusIcon={<Hammer className="w-4 h-4" />}
+      >
+        <BuildInfo id={id} />
+      </ResourceCard>
+    </Link>
+  );
+};

frontend/src/resources/builder/card.tsx

@@ -1,40 +0,0 @@
-import { useRead } from "@hooks";
-import {
-  Card,
-  CardHeader,
-  CardTitle,
-  CardDescription,
-  CardContent,
-} from "@ui/card";
-import { Link } from "react-router-dom";
-import { Bot, Cloud, Factory } from "lucide-react";
-
-export const BuilderCard = ({ id }: { id: string }) => {
-  const builders = useRead("ListBuilders", {}).data;
-  const builder = builders?.find((builder) => builder._id?.$oid === id);
-  if (!builder) return null;
-
-  return (
-    <Link to={`/builders/${builder._id?.$oid}`} key={builder._id?.$oid}>
-      <Card hoverable>
-        <CardHeader className="flex flex-row justify-between">
-          <div>
-            <CardTitle>{builder.name}</CardTitle>
-            <CardDescription> some description</CardDescription>
-          </div>
-          <Factory className="w-4 h-4" />
-        </CardHeader>
-        <CardContent className="flex flex-col text-sm text-muted-foreground">
-          <div className="flex items-center gap-2">
-            <Cloud className="w-4 h-4" />
-            AWS
-          </div>
-          <div className="flex items-center gap-2">
-            <Bot className="w-4 h-4" />
-            C5x Large
-          </div>
-        </CardContent>
-      </Card>
-    </Link>
-  );
-};

frontend/src/resources/builder/index.tsx

@@ -0,0 +1,56 @@
+import { ResourceCard } from "@layouts/card";
+import { Bot, Cloud, Factory } from "lucide-react";
+import { ResourceUpdates } from "@components/updates/resource";
+import { useRead, useWrite } from "@hooks";
+import { Resource } from "@layouts/resource";
+import { useEffect } from "react";
+import { Link, useParams } from "react-router-dom";
+
+const BuilderName = ({ id }: { id: string }) => {
+  const builders = useRead("ListBuilders", {}).data;
+  const builder = builders?.find((b) => b._id?.$oid === id);
+  return <>{builder?.name}</>;
+};
+
+export const BuilderPage = () => {
+  const id = useParams().builderId;
+  const push = useWrite("PushRecentlyViewed").mutate;
+
+  if (!id) return null;
+  useEffect(() => {
+    push({ resource: { type: "Builder", id } });
+  }, []);
+
+  return (
+    <Resource title={<BuilderName id={id} />} info={<></>} actions={<></>}>
+      <ResourceUpdates type="Builder" id={id} />
+      <div>builder page</div>
+    </Resource>
+  );
+};
+
+export const BuilderCard = ({ id }: { id: string }) => {
+  const builders = useRead("ListBuilders", {}).data;
+  const builder = builders?.find((b) => b._id?.$oid === id);
+  if (!builder) return null;
+  return (
+    <Link to={`/builders/${builder._id?.$oid}`}>
+      <ResourceCard
+        title={builder.name}
+        description={"some description"}
+        statusIcon={<Factory className="w-4 h-4" />}
+      >
+        <div className="flex flex-col text-muted-foreground text-sm">
+          <div className="flex items-center gap-2">
+            <Cloud className="w-4 h-4" />
+            AWS
+          </div>
+          <div className="flex items-center gap-2">
+            <Bot className="w-4 h-4" />
+            C5x Large
+          </div>
+        </div>
+      </ResourceCard>
+    </Link>
+  );
+};

frontend/src/resources/builder/page.tsx

@@ -1,28 +0,0 @@
-import { ResourceUpdates } from "@components/updates/resource";
-import { useRead, useWrite } from "@hooks";
-import { Resource } from "@layouts/resource";
-import { useEffect } from "react";
-import { useParams } from "react-router-dom";
-
-const BuilderName = ({ id }: { id: string }) => {
-  const builders = useRead("ListBuilders", {}).data;
-  const builder = builders?.find((b) => b._id?.$oid === id);
-  return <>{builder?.name}</>;
-};
-
-export const BuilderPage = () => {
-  const id = useParams().builderId;
-  const push = useWrite("PushRecentlyViewed").mutate;
-
-  if (!id) return null;
-  useEffect(() => {
-    push({ resource: { type: "Builder", id } });
-  }, []);
-
-  return (
-    <Resource title={<BuilderName id={id} />} info={<></>} actions={<></>}>
-      <ResourceUpdates type="Builder" id={id} />
-      <div>builder page</div>
-    </Resource>
-  );
-};

frontend/src/resources/deployment/card.tsx

@@ -1,28 +0,0 @@
-import { useRead } from "@hooks";
-import { Link } from "react-router-dom";
-import {
-  DeploymentBuild,
-  DeploymentServer,
-  DeploymentStatusIcon,
-} from "./util";
-import { ResourceCard } from "@layouts/card";
-
-export const DeploymentCard = ({ id }: { id: string }) => {
-  const deployments = useRead("ListDeployments", {}).data;
-  const deployment = deployments?.find((d) => d.id === id);
-  if (!deployment) return null;
-  return (
-    <Link to={`/deployments/${deployment.id}`}>
-      <ResourceCard
-        title={deployment.name}
-        description={deployment.status ?? "not deployed"}
-        statusIcon={<DeploymentStatusIcon deploymentId={id} />}
-      >
-        <div className="flex flex-col text-muted-foreground text-sm">
-          <DeploymentServer deploymentId={id} />
-          <DeploymentBuild deploymentId={id} />
-        </div>
-      </ResourceCard>
-    </Link>
-  );
-};

frontend/src/resources/pages.tsx

@@ -1,10 +1,10 @@
 import { Factory, Hammer, Rocket, Server } from "lucide-react";
 import { useRead } from "@hooks";
 import { Resources } from "@layouts/resources";
-import { DeploymentCard } from "./deployment/card";
-import { BuildCard } from "./build/card";
-import { ServerCard } from "./server/card";
-import { BuilderCard } from "./builder/card";
+import { DeploymentCard } from "@resources/deployment";
+import { BuildCard } from "@resources/build";
+import { ServerCard } from "@resources/server";
+import { BuilderCard } from "@resources/builder";
 
 const DeploymentsSummary = () => {
   const summary = useRead("GetDeploymentsSummary", {}).data;

frontend/src/resources/server/card.tsx

@@ -1,26 +0,0 @@
-import { useRead } from "@hooks";
-import { Link } from "react-router-dom";
-import { ServerStatusIcon, ServerSpecs, ServerRegion } from "./util";
-import { ResourceCard } from "@layouts/card";
-
-export const ServerCard = ({ id }: { id: string }) => {
-  const servers = useRead("ListServers", {}).data;
-  const server = servers?.find((server) => server.id === id);
-  if (!server) return null;
-
-  return (
-    <Link to={`/servers/${server.id}`} key={server.id}>
-      <ResourceCard
-        title={server.name}
-        description={server.status}
-        statusIcon={<ServerStatusIcon serverId={server.id} />}
-        // icon={<Server className="w-4 h-4" />}
-      >
-        <div className="flex flex-col text-sm">
-          <ServerSpecs server_id={server.id} />
-          <ServerRegion />
-        </div>
-      </ResourceCard>
-    </Link>
-  );
-};

frontend/src/resources/server/index.tsx

@@ -1,16 +1,18 @@
 import { ResourceUpdates } from "@components/updates/resource";
-import { useWrite } from "@hooks";
+import { useWrite, useRead } from "@hooks";
+import { ResourceCard } from "@layouts/card";
 import { Resource } from "@layouts/resource";
-import { ServerConfig } from "@resources/server/config";
-import { ServerStats } from "@resources/server/stats";
+import { CardDescription } from "@ui/card";
+import { useEffect } from "react";
+import { useParams, Link } from "react-router-dom";
+import { ServerConfig } from "./config";
+import { ServerStats } from "./stats";
 import {
   ServerName,
   ServerStatusIcon,
   ServerSpecs,
-} from "@resources/server/util";
-import { CardDescription } from "@ui/card";
-import { useEffect } from "react";
-import { useParams } from "react-router-dom";
+  ServerRegion,
+} from "./util";
 
 export const ServerPage = () => {
   const id = useParams().serverId;
@@ -39,3 +41,25 @@ export const ServerPage = () => {
     </Resource>
   );
 };
+
+export const ServerCard = ({ id }: { id: string }) => {
+  const servers = useRead("ListServers", {}).data;
+  const server = servers?.find((server) => server.id === id);
+  if (!server) return null;
+
+  return (
+    <Link to={`/servers/${server.id}`} key={server.id}>
+      <ResourceCard
+        title={server.name}
+        description={server.status}
+        statusIcon={<ServerStatusIcon serverId={server.id} />}
+        // icon={<Server className="w-4 h-4" />}
+      >
+        <div className="flex flex-col text-sm">
+          <ServerSpecs server_id={server.id} />
+          <ServerRegion />
+        </div>
+      </ResourceCard>
+    </Link>
+  );
+};

frontend/src/router.tsx

@@ -8,7 +8,7 @@ import { Deployments, Builds, Servers, Builders } from "@resources/pages";
 import { ServerPage } from "@resources/server";
 import { DeploymentPage } from "@resources/deployment";
 import { BuildPage } from "@resources/build";
-import { BuilderPage } from "@resources/builder/page";
+import { BuilderPage } from "@resources/builder";
 
 const router = createBrowserRouter([
   {