[dyad] Replaced the status badge with a dot indicator - wrote 1 file(s)

src/components/stock/columns.tsx

@@ -13,7 +13,6 @@ import {
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu"
-import { Badge } from "@/components/ui/badge"
 
 export type StockItem = {
   id: string
@@ -99,10 +98,20 @@ export const columns: ColumnDef<StockItem>[] = [
     accessorKey: "status",
     header: "Status",
     cell: ({ row }) => {
-      const status = row.getValue("status") as string
-      const variant = status === "In Stock" ? "default" : status === "Low Stock" ? "secondary" : "destructive"
+      const status = row.getValue("status") as "In Stock" | "Low Stock" | "Out of Stock"
       
-      return <Badge variant={variant}>{status}</Badge>
+      const statusColor = {
+        "In Stock": "bg-green-500",
+        "Low Stock": "bg-yellow-500",
+        "Out of Stock": "bg-red-500",
+      };
+
+      return (
+        <div className="flex items-center">
+          <span className={`h-2.5 w-2.5 rounded-full mr-2 ${statusColor[status]}`} />
+          <span>{status}</span>
+        </div>
+      )
     }
   },
   {