From 3a879956ca18a3cb79ac3d3883e7ab90d37e3e85 Mon Sep 17 00:00:00 2001 From: headlesdev Date: Tue, 20 May 2025 20:23:08 +0200 Subject: [PATCH] useSite merge to useSites --- app/dashboard/sites/SitesPage.tsx | 4 +- app/dashboard/sites/[siteId]/SitePage.tsx | 2 +- app/setup/SetupPage.tsx | 2 +- components/dialogues/AddSite.tsx | 2 +- components/dialogues/DeleteSite.tsx | 2 +- components/dialogues/EditSite.tsx | 2 +- hooks/useSite.ts | 94 -------------------- hooks/useSites.ts | 101 +++++++++++++++++++--- 8 files changed, 98 insertions(+), 111 deletions(-) delete mode 100644 hooks/useSite.ts diff --git a/app/dashboard/sites/SitesPage.tsx b/app/dashboard/sites/SitesPage.tsx index 6751236..4c3599e 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 Pagination from "@/components/Pagination"; -import useSites from "@/hooks/useSites"; +import useSite from "@/hooks/useSites"; import SearchAndLayout from "@/components/SearchAndLayout"; import Loading from "@/components/Loading"; @@ -25,7 +25,7 @@ export default function SitesPage({ username, name }: SitesPageProps) { setItemPerPage, loadSites, loading - } = useSites(); + } = useSite(); return ( void; diff --git a/components/dialogues/DeleteSite.tsx b/components/dialogues/DeleteSite.tsx index 03911a4..5dc2515 100644 --- a/components/dialogues/DeleteSite.tsx +++ b/components/dialogues/DeleteSite.tsx @@ -2,7 +2,7 @@ import axios from "axios" import { useRouter } from "next/navigation" import { Trash2, AlertTriangle } from "lucide-react"; -import useSite from "@/hooks/useSite"; +import useSite from "@/hooks/useSites"; interface DeleteSiteProps { siteId: string; diff --git a/components/dialogues/EditSite.tsx b/components/dialogues/EditSite.tsx index 958f220..2432464 100644 --- a/components/dialogues/EditSite.tsx +++ b/components/dialogues/EditSite.tsx @@ -5,7 +5,7 @@ import { Site } from "@/app/types" import { PencilLine, Building2, FileText } from "lucide-react" import ErrorToast from "@/components/Error" import SuccessToast from "@/components/Success" -import useSite from "@/hooks/useSite" +import useSite from "@/hooks/useSites" interface EditSiteProps { site: Site diff --git a/hooks/useSite.ts b/hooks/useSite.ts deleted file mode 100644 index 150a47c..0000000 --- a/hooks/useSite.ts +++ /dev/null @@ -1,94 +0,0 @@ -import { useState, useEffect, useCallback } from "react"; -import axios from "axios"; -import { Site } from "@/app/types"; - -const useSite = () => { - const [site, setSite] = useState({ - id: "", - name: "", - description: "", - networks: [] - }); - const [siteId, setSiteId] = useState(""); - const [loading, setLoading] = useState(false); - - const loadSite = useCallback(() => { - if (!siteId) return; - setLoading(true); - axios.get('/api/sites/get', { - params: { siteId } - }).then((response) => { - setSite(response.data.site); - setLoading(false); - }); - }, [siteId]); - - const updateSite = useCallback(() => { - if (!siteId) return; - axios.get('/api/sites/get', { - params: { siteId } - }).then((response) => { - setSite(response.data.site); - }); - }, [siteId]); - - - useEffect(() => { - loadSite(); - }, [loadSite]); - - const editSite = (site: Site): Promise | string => { - if (!site.id) { - return 'Site ID is required'; - } - - if(site.name.length < 3) { - return 'Site name must be at least 3 characters long'; - } - return axios.post('/api/sites/edit', site) - .then(() => { - return "Site edited successfully"; - }) - .catch(err => { - throw err.response?.data?.error || 'An error occurred'; - }); - }; - - const addSite = (site: Site): Promise | string => { - if(site.name.length < 3) { - return 'Site name must be at least 3 characters long'; - } - - return axios.post('/api/sites/add', site) - .then((response) => { - return response.data.site; - }) - .catch(err => { - throw err.response?.data?.error || 'An error occurred'; - }); - }; - - const deleteSite = (siteId: string) => { - axios.delete('/api/sites/delete', { - params: { siteId } - }) - .then(() => { - setSiteId(''); - }) - .catch(err => { - console.error(err); - }) - }; - return { - site, - loadSite, - setSiteId, - updateSite, - editSite, - addSite, - deleteSite, - loading - }; -}; - -export default useSite; \ No newline at end of file diff --git a/hooks/useSites.ts b/hooks/useSites.ts index 5d611b8..69e5ff0 100644 --- a/hooks/useSites.ts +++ b/hooks/useSites.ts @@ -1,17 +1,90 @@ import { useState, useEffect, useCallback } from "react"; import axios from "axios"; +import { Site } from "@/app/types"; import Cookies from "js-cookie"; -const useSites = () => { - const savedLayout = Cookies.get('sites-itemPerPage'); - const defaultLayout = savedLayout ? Number(savedLayout) : 5; - - const [sites, setSites] = useState([]); +const useSite = () => { + const [site, setSite] = useState({ + id: "", + name: "", + description: "", + networks: [] + }); + const [siteId, setSiteId] = useState(""); + const [loading, setLoading] = useState(false); const [currentPage, setCurrentPage] = useState(1); - const [itemPerPage, setItemPerPage] = useState(defaultLayout); + const [itemPerPage, setItemPerPage] = useState(5); const [total, setTotal] = useState(0); const [search, setSearch] = useState(""); - const [loading, setLoading] = useState(false); + const [sites, setSites] = useState([]); + + const loadSite = useCallback(() => { + if (!siteId) return; + setLoading(true); + axios.get('/api/sites/get', { + params: { siteId } + }).then((response) => { + setSite(response.data.site); + setLoading(false); + }); + }, [siteId]); + + const updateSite = useCallback(() => { + if (!siteId) return; + axios.get('/api/sites/get', { + params: { siteId } + }).then((response) => { + setSite(response.data.site); + }); + }, [siteId]); + + + useEffect(() => { + loadSite(); + }, [loadSite]); + + const editSite = (site: Site): Promise | string => { + if (!site.id) { + return 'Site ID is required'; + } + + if(site.name.length < 3) { + return 'Site name must be at least 3 characters long'; + } + return axios.post('/api/sites/edit', site) + .then(() => { + return "Site edited successfully"; + }) + .catch(err => { + throw err.response?.data?.error || 'An error occurred'; + }); + }; + + const addSite = (site: Site): Promise | string => { + if(site.name.length < 3) { + return 'Site name must be at least 3 characters long'; + } + + return axios.post('/api/sites/add', site) + .then((response) => { + return response.data.site; + }) + .catch(err => { + throw err.response?.data?.error || 'An error occurred'; + }); + }; + + const deleteSite = (siteId: string) => { + axios.delete('/api/sites/delete', { + params: { siteId } + }) + .then(() => { + setSiteId(''); + }) + .catch(err => { + console.error(err); + }) + }; const loadSites = useCallback(() => { setLoading(true); @@ -35,7 +108,16 @@ const useSites = () => { const handlePageChange = (page: number) => setCurrentPage(page); + return { + site, + loadSite, + setSiteId, + updateSite, + editSite, + addSite, + deleteSite, + loading, sites, currentPage, itemPerPage, @@ -44,9 +126,8 @@ const useSites = () => { setSearch, handlePageChange, setItemPerPage, - loadSites, - loading + loadSites }; }; -export default useSites; \ No newline at end of file +export default useSite; \ No newline at end of file