Add src/app/seller/dashboard/page.tsx

src/app/seller/dashboard/page.tsx

@@ -0,0 +1,111 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import ButtonTextUnderline from '@/components/button/ButtonTextUnderline';
+
+export default function SellerDashboardPage() {
+  const navItems = [
+    { name: "Home", id: "/" },
+    { name: "Products", id: "#products" },
+    { name: "Features", id: "#features" },
+    { name: "Testimonials", id: "#testimonials" },
+    { name: "Pricing", id: "#pricing" },
+    { name: "FAQ", id: "#faq" },
+    { name: "Contact", id: "#contact" },
+    { name: "Login", id: "/login" },
+    { name: "Register", id: "/register" },
+    { name: "Customer", id: "/customer/dashboard" },
+    { name: "Seller", id: "/seller/dashboard" }
+  ];
+
+  const uploadedDesigns = [
+    { id: "d1", name: "Modern Social Media Pack", status: "Active", sales: 15 },
+    { id: "d2", name: "Ultimate Instagram Kit", status: "Active", sales: 10 },
+    { id: "d3", name: "Professional Business Card", status: "Pending Review", sales: 0 }
+  ];
+
+  const handleUploadDesign = () => {
+    alert("Upload Design functionality coming soon!");
+  };
+
+  const handleManageDesign = (designId: string) => {
+    alert(`Manage design ${designId} functionality coming soon!`);
+  };
+
+  return (
+    <ThemeProvider
+        defaultButtonVariant="text-shift"
+        defaultTextAnimation="background-highlight"
+        borderRadius="soft"
+        contentWidth="mediumLarge"
+        sizing="medium"
+        background="circleGradient"
+        cardStyle="inset"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="bold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingInline
+            navItems={navItems}
+            brandName="DesignFlow"
+            button={{ text: "Get Started", href: "#products" }}
+            animateOnLoad={true}
+          />
+        </div>
+
+        <div className="min-h-[calc(100vh-80px)] p-8">
+          <div className="max-w-4xl mx-auto bg-card text-foreground p-8 rounded-lg shadow-xl">
+            <h1 className="text-4xl font-bold mb-8 text-center">Seller Dashboard</h1>
+
+            <section className="mb-8 flex justify-between items-center">
+              <h2 className="text-2xl font-semibold">Your Designs</h2>
+              <ButtonTextUnderline
+                text="Upload New Design"
+                onClick={handleUploadDesign}
+              />
+            </section>
+
+            <section>
+              {uploadedDesigns.length === 0 ? (
+                <p>You haven't uploaded any designs yet. Click "Upload New Design" to get started!</p>
+              ) : (
+                <div className="overflow-x-auto">
+                  <table className="min-w-full divide-y divide-accent-border">
+                    <thead>
+                      <tr>
+                        <th className="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider">Design Name</th>
+                        <th className="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider">Status</th>
+                        <th className="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider">Sales</th>
+                        <th className="px-6 py-3 text-left text-xs font-medium uppercase tracking-wider">Actions</th>
+                      </tr>
+                    </thead>
+                    <tbody className="divide-y divide-accent-border">
+                      {uploadedDesigns.map((design) => (
+                        <tr key={design.id}>
+                          <td className="px-6 py-4 whitespace-nowrap">{design.name}</td>
+                          <td className="px-6 py-4 whitespace-nowrap">{design.status}</td>
+                          <td className="px-6 py-4 whitespace-nowrap">{design.sales}</td>
+                          <td className="px-6 py-4 whitespace-nowrap">
+                            <ButtonTextUnderline
+                              text="Manage"
+                              onClick={() => handleManageDesign(design.id)}
+                              className="text-primary-cta hover:underline"
+                            />
+                          </td>
+                        </tr>
+                      ))}
+                    </tbody>
+                  </table>
+                </div>
+              )}
+            </section>
+          </div>
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}