diff --git a/src/app/waves/create/preview/wavePreview.tsx b/src/app/waves/create/preview/wavePreview.tsx
index b0f7778e..0782a3c6 100644
--- a/src/app/waves/create/preview/wavePreview.tsx
+++ b/src/app/waves/create/preview/wavePreview.tsx
@@ -6,7 +6,6 @@ import { urls } from "@/constants/urls";
import { cn } from "@/lib/cn";
import { formatDate } from "@/lib/dates";
import { LOCAL_STORAGE_KEYS } from "@/lib/localStorage";
-import { Badge } from "@/components/ui/badge";
import { Button, buttonVariants } from "@/components/ui/button";
import {
Card,
@@ -15,6 +14,7 @@ import {
CardHeader,
CardTitle,
} from "@/components/ui/card";
+import { CategoryBadge } from "@/components/ui/categories/categoryBadge";
import { PageHeader } from "@/components/ui/pageHeader";
import { Separator } from "@/components/ui/separator";
import { CalendarIcon } from "@/components/icons/calendarIcon";
@@ -56,9 +56,9 @@ export default function PreviewApplication() {
Categories:
- {validatedWaveData.categories.map(({ name, color }, index) => (
- -
- {name}
+ {validatedWaveData.categories.map((category, index) => (
+
-
+
))}
diff --git a/src/components/ui/categories/categoryBadge.tsx b/src/components/ui/categories/categoryBadge.tsx
index c73d1dd9..87819ab6 100644
--- a/src/components/ui/categories/categoryBadge.tsx
+++ b/src/components/ui/categories/categoryBadge.tsx
@@ -1,22 +1,23 @@
-import { type CategoryColor } from "@/types/CategoryColor";
+import { Category } from "@/types/Category";
import { Badge } from "../badge";
+import { Tooltip, TooltipContent, TooltipTrigger } from "../tooltip";
import { getCategoryIcon } from "./getCategoryIcon";
-interface Category {
- color: CategoryColor;
- name: string;
-}
-
interface CategoryBadgeProps {
- category: Category;
+ category: Omit
;
}
export function CategoryBadge({ category }: CategoryBadgeProps) {
return (
-
- {getCategoryIcon(category.color)}
- {category.name}
-
+
+
+
+ {getCategoryIcon(category.color)}
+ {category.name}
+
+
+ {category.description}
+
);
}
diff --git a/src/drizzle/queries/waves.ts b/src/drizzle/queries/waves.ts
index b30a6e87..62c76660 100644
--- a/src/drizzle/queries/waves.ts
+++ b/src/drizzle/queries/waves.ts
@@ -32,6 +32,7 @@ export const getWaves = cache(async () => {
id: true,
name: true,
color: true,
+ description: true,
},
},
},