diff --git a/frontend/src/app/scripts/_components/ScriptItems/Alerts.tsx b/frontend/src/app/scripts/_components/ScriptItems/Alerts.tsx index e4c56e16..8d84a52a 100644 --- a/frontend/src/app/scripts/_components/ScriptItems/Alerts.tsx +++ b/frontend/src/app/scripts/_components/ScriptItems/Alerts.tsx @@ -1,14 +1,26 @@ import TextCopyBlock from "@/components/TextCopyBlock"; +import { AlertColors } from "@/config/siteConfig"; import { Script } from "@/lib/types"; +import { cn } from "@/lib/utils"; import { Info } from "lucide-react"; +type NoteProps = { + text: string; + type: keyof typeof AlertColors; +} + export default function Alerts({ item }: { item: Script }) { return ( <> {item?.notes?.length > 0 && - item.notes.map((note: any, index: number) => ( + item.notes.map((note: NoteProps, index: number) => (
-

+

{TextCopyBlock(note.text)}

diff --git a/frontend/src/config/siteConfig.tsx b/frontend/src/config/siteConfig.tsx index 301a08c6..5fa0a8ed 100644 --- a/frontend/src/config/siteConfig.tsx +++ b/frontend/src/config/siteConfig.tsx @@ -34,3 +34,10 @@ export const analytics = { url: "analytics.proxmoxve-scripts.com", token: "b60d3032-1a11-4244-a100-81d26c5c49a7", }; + +export const AlertColors = { + warning: + "border-yellow-400 bg-yellow-50 dark:border-yellow-900 dark:bg-yellow-900", + danger: "border-red-500/25 bg-destructive/25", + info: "border-cyan-500/25 bg-cyan-50 dark:border-cyan-900/25 dark:bg-cyan-900", +}; \ No newline at end of file diff --git a/frontend/src/lib/types.ts b/frontend/src/lib/types.ts index 4f8d2ef2..3541d86a 100644 --- a/frontend/src/lib/types.ts +++ b/frontend/src/lib/types.ts @@ -1,3 +1,5 @@ +import { AlertColors } from "@/config/siteConfig"; + export type Script = { name: string; slug: string; @@ -29,7 +31,7 @@ export type Script = { notes: [ { text: string; - type: string; + type: keyof typeof AlertColors; }, ]; };