Add modular dashboard widgets and layout editor

Introduces a modular dashboard system with draggable, configurable widgets including revenue, low stock, recent customers, and pending chats. Adds a dashboard editor for layout customization, widget visibility, and settings. Refactors dashboard content to use the new widget system and improves UI consistency and interactivity.

components/tables/product-table.tsx

@@ -6,6 +6,7 @@ import {
   TableHeader,
   TableRow,
 } from "@/components/ui/table";
+import Image from "next/image";
 import {
   Edit,
   Trash,
@@ -93,10 +94,13 @@ const ProductTable = ({
         <div className="flex items-center gap-2">
           <div className="h-8 w-8 rounded bg-muted/50 flex items-center justify-center text-muted-foreground overflow-hidden relative">
             {getProductImageUrl(product) ? (
-              <img
+              <Image
                 src={getProductImageUrl(product)!}
                 alt={product.name}
+                width={32}
+                height={32}
                 className="h-full w-full object-cover"
+                unoptimized={getProductImageUrl(product)?.startsWith('data:')}
               />
             ) : (
               <span className="text-xs font-bold">{product.name.charAt(0).toUpperCase()}</span>