Add Site modal & sites page

app/dashboard/sites/SitesPage.tsx

@@ -0,0 +1,35 @@
+"use client";
+import Sidebar from "@/components/Sidebar";
+import { Plus } from "lucide-react";
+import AddSite from "@/components/dialogues/AddSite";
+
+interface SitesPageProps {
+    username: string;
+    name: string;
+}
+
+
+export default function SitesPage({ username, name }: SitesPageProps) {
+    return (
+        <Sidebar 
+            username={username} 
+            fullName={name} 
+            breadcrumbPath={['/', 'Dashboard', 'Ressources', 'Sites']}
+        >
+            <main>
+                <div className="flex gap-4 items-center">
+                    <div className="flex-1">
+                        <h1 className="text-2xl font-bold">Sites</h1>
+                        <p className="text-sm opacity-70">Manage your sites. Sites are real-world locations where you can monitor your assets & add networks.</p>
+                    </div>
+                    <button className="btn btn-primary" onClick={() => document.getElementById('add_site')?.showModal()}>
+                        <Plus className="w-5 h-5" />
+                        Add Site
+                    </button>
+                </div>
+
+                <AddSite />
+            </main>
+        </Sidebar>
+    )
+}