Canvas: Consistent icons
Change-Id: Ib33a4bb8c0dbafefae7a600b86900b60f6118340
diff --git a/apps/canvas/front/src/components/icon.tsx b/apps/canvas/front/src/components/icon.tsx
index c56a69e..02be282 100644
--- a/apps/canvas/front/src/components/icon.tsx
+++ b/apps/canvas/front/src/components/icon.tsx
@@ -1,4 +1,4 @@
-import { NodeType } from "@/lib/state";
+import { accessSchema, NodeType } from "@/lib/state";
import { ReactElement } from "react";
import { SiGithub, SiMongodb, SiPostgresql } from "react-icons/si";
import { GrServices } from "react-icons/gr";
@@ -6,6 +6,8 @@
import { TbWorldWww } from "react-icons/tb";
import { PiNetwork } from "react-icons/pi";
import { AiOutlineGlobal } from "react-icons/ai";
+import { Terminal } from "lucide-react";
+import { z } from "zod";
type Props = {
type: NodeType | undefined;
@@ -34,3 +36,19 @@
throw new Error(`MUST NOT REACH! ${type}`);
}
}
+
+export function AccessType({ type, className }: { type: z.infer<typeof accessSchema>["type"]; className?: string }) {
+ switch (type) {
+ case "https":
+ return <TbWorldWww className={className} />;
+ case "ssh":
+ return <Terminal className={className} />;
+ case "tcp":
+ case "udp":
+ return <PiNetwork className={className} />;
+ case "postgresql":
+ return <SiPostgresql className={className} />;
+ case "mongodb":
+ return <SiMongodb className={className} />;
+ }
+}