From 05e61ae42800dcf05dc4b9d914455f3a01ca8462 Mon Sep 17 00:00:00 2001
From: headlesdev <damian.bergemann@outlook.com>
Date: Sun, 18 May 2025 12:50:56 +0200
Subject: [PATCH] Refresh Sites on add

---
 app/dashboard/sites/SitesPage.tsx | 14 +++++++++-----
 components/dialogues/AddSite.tsx  | 14 +++++++++++++-
 2 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/app/dashboard/sites/SitesPage.tsx b/app/dashboard/sites/SitesPage.tsx
index 9a73612..d7a87a7 100644
--- a/app/dashboard/sites/SitesPage.tsx
+++ b/app/dashboard/sites/SitesPage.tsx
@@ -4,7 +4,7 @@ import { Plus } from "lucide-react";
 import AddSite from "@/components/dialogues/AddSite";
 import Sites from "@/components/cards/Sites";
 import axios from "axios";
-import { useEffect, useState } from "react";
+import { useEffect, useState, useCallback } from "react";
 import Pagination from "@/components/Pagination";
 
 interface SitesPageProps {
@@ -12,7 +12,6 @@ interface SitesPageProps {
     name: string;
 }
 
-
 export default function SitesPage({ username, name }: SitesPageProps) {
     const [sites, setSites] = useState([]);
     const [currentPage, setCurrentPage] = useState(1);
@@ -23,7 +22,8 @@ export default function SitesPage({ username, name }: SitesPageProps) {
     const handlePageChange = (page: number) => {
         setCurrentPage(page);
     };
-    useEffect(() => {
+
+    const loadSites = useCallback(() => {
         axios.get('/api/sites/get_all', {
             params: {
                 currentPage,
@@ -35,7 +35,11 @@ export default function SitesPage({ username, name }: SitesPageProps) {
             setTotal(response.data.total);
         });
     }, [currentPage, itemPerPage, search]);
-    
+
+    useEffect(() => {
+        loadSites();
+    }, [loadSites]);
+
     return (
         <Sidebar 
             username={username} 
@@ -53,7 +57,7 @@ export default function SitesPage({ username, name }: SitesPageProps) {
                         Add Site
                     </button>
                 </div>
-                <AddSite />
+                <AddSite onSiteAdded={loadSites} />
 
                 <div className="flex gap-2 items-center pt-4">
                     <input type="text" placeholder="Search..." className="input input-bordered w-full" onChange={(e) => setSearch(e.target.value)} />
diff --git a/components/dialogues/AddSite.tsx b/components/dialogues/AddSite.tsx
index 9bd8282..5f15db8 100644
--- a/components/dialogues/AddSite.tsx
+++ b/components/dialogues/AddSite.tsx
@@ -5,7 +5,11 @@ import axios from "axios";
 import ErrorToast from "@/components/Error";
 import SuccessToast from "@/components/Success";
 
-export default function AddSite() {
+interface AddSiteProps {
+    onSiteAdded?: () => void;
+}
+
+export default function AddSite({ onSiteAdded }: AddSiteProps) {
     const [name, setName] = useState("");
     const [description, setDescription] = useState("");
     const [error, setError] = useState("");
@@ -20,6 +24,14 @@ export default function AddSite() {
                     setName("");
                     setDescription("");
                     setSuccess("Site added successfully");
+                    
+                    document.getElementById('add_site')?.querySelector('form')?.dispatchEvent(
+                        new Event('submit', { cancelable: true })
+                    );
+                    
+                    if (onSiteAdded) {
+                        onSiteAdded();
+                    }
                 } else {
                     setError("No site received");
                 }