Refresh Sites on add

This commit is contained in:
headlesdev 2025-05-18 12:50:56 +02:00
parent 911eec0c90
commit 05e61ae428
2 changed files with 22 additions and 6 deletions

View File

@ -4,7 +4,7 @@ import { Plus } from "lucide-react";
import AddSite from "@/components/dialogues/AddSite"; import AddSite from "@/components/dialogues/AddSite";
import Sites from "@/components/cards/Sites"; import Sites from "@/components/cards/Sites";
import axios from "axios"; import axios from "axios";
import { useEffect, useState } from "react"; import { useEffect, useState, useCallback } from "react";
import Pagination from "@/components/Pagination"; import Pagination from "@/components/Pagination";
interface SitesPageProps { interface SitesPageProps {
@ -12,7 +12,6 @@ interface SitesPageProps {
name: string; name: string;
} }
export default function SitesPage({ username, name }: SitesPageProps) { export default function SitesPage({ username, name }: SitesPageProps) {
const [sites, setSites] = useState([]); const [sites, setSites] = useState([]);
const [currentPage, setCurrentPage] = useState(1); const [currentPage, setCurrentPage] = useState(1);
@ -23,7 +22,8 @@ export default function SitesPage({ username, name }: SitesPageProps) {
const handlePageChange = (page: number) => { const handlePageChange = (page: number) => {
setCurrentPage(page); setCurrentPage(page);
}; };
useEffect(() => {
const loadSites = useCallback(() => {
axios.get('/api/sites/get_all', { axios.get('/api/sites/get_all', {
params: { params: {
currentPage, currentPage,
@ -35,7 +35,11 @@ export default function SitesPage({ username, name }: SitesPageProps) {
setTotal(response.data.total); setTotal(response.data.total);
}); });
}, [currentPage, itemPerPage, search]); }, [currentPage, itemPerPage, search]);
useEffect(() => {
loadSites();
}, [loadSites]);
return ( return (
<Sidebar <Sidebar
username={username} username={username}
@ -53,7 +57,7 @@ export default function SitesPage({ username, name }: SitesPageProps) {
Add Site Add Site
</button> </button>
</div> </div>
<AddSite /> <AddSite onSiteAdded={loadSites} />
<div className="flex gap-2 items-center pt-4"> <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)} /> <input type="text" placeholder="Search..." className="input input-bordered w-full" onChange={(e) => setSearch(e.target.value)} />

View File

@ -5,7 +5,11 @@ import axios from "axios";
import ErrorToast from "@/components/Error"; import ErrorToast from "@/components/Error";
import SuccessToast from "@/components/Success"; import SuccessToast from "@/components/Success";
export default function AddSite() { interface AddSiteProps {
onSiteAdded?: () => void;
}
export default function AddSite({ onSiteAdded }: AddSiteProps) {
const [name, setName] = useState(""); const [name, setName] = useState("");
const [description, setDescription] = useState(""); const [description, setDescription] = useState("");
const [error, setError] = useState(""); const [error, setError] = useState("");
@ -20,6 +24,14 @@ export default function AddSite() {
setName(""); setName("");
setDescription(""); setDescription("");
setSuccess("Site added successfully"); setSuccess("Site added successfully");
document.getElementById('add_site')?.querySelector('form')?.dispatchEvent(
new Event('submit', { cancelable: true })
);
if (onSiteAdded) {
onSiteAdded();
}
} else { } else {
setError("No site received"); setError("No site received");
} }