diff --git a/frontend/src/app/scripts/_components/ScriptAccordion.tsx b/frontend/src/app/scripts/_components/ScriptAccordion.tsx index e5592284..ed693aff 100644 --- a/frontend/src/app/scripts/_components/ScriptAccordion.tsx +++ b/frontend/src/app/scripts/_components/ScriptAccordion.tsx @@ -13,6 +13,7 @@ import Image from "next/image"; import Link from "next/link"; import { useState } from "react"; import { Badge } from "../../../components/ui/badge"; +import { formattedBadge } from "@/components/CommandMenu"; export default function ScriptAccordion({ items, @@ -122,19 +123,7 @@ export default function ScriptAccordion({ {script.name} - - {script.type} - + {formattedBadge(script.type)} ))} diff --git a/frontend/src/components/CommandMenu.tsx b/frontend/src/components/CommandMenu.tsx index d64e5d8f..a1b8efd2 100644 --- a/frontend/src/components/CommandMenu.tsx +++ b/frontend/src/components/CommandMenu.tsx @@ -7,13 +7,27 @@ import { CommandList, } from "@/components/ui/command"; import { fetchCategories } from "@/lib/pocketbase"; -import { Category } from "@/lib/types"; +import { Category, Script } from "@/lib/types"; import { cn } from "@/lib/utils"; import Image from "next/image"; import { useRouter } from "next/navigation"; import React from "react"; import { Button } from "./ui/button"; import { DialogTitle } from "./ui/dialog"; +import { Badge } from "./ui/badge"; + +export const formattedBadge = (type: string) => { + switch (type) { + case "vm": + return VM; + case "ct": + return ( + LXC + ); + case "misc": + return MISC; + } +}; export default function CommandMenu() { const [open, setOpen] = React.useState(false); @@ -55,7 +69,7 @@ export default function CommandMenu() { )} onClick={() => { fetchSortedCategories(); - setOpen(true) + setOpen(true); }} > Search scripts... @@ -64,10 +78,12 @@ export default function CommandMenu() { - Search scripts - + Search scripts + - {isLoading ? "Loading..." : "No scripts found."} + + {isLoading ? "Loading..." : "No scripts found."} + {links.map((category) => ( {script.name} - - {script.type} - + {formattedBadge(script.type)} ))}