diff --git a/src/app/scripts/page.tsx b/src/app/scripts/page.tsx index a271c42..7cac4bd 100644 --- a/src/app/scripts/page.tsx +++ b/src/app/scripts/page.tsx @@ -10,43 +10,10 @@ import { Suspense, useEffect, useState } from "react"; import Sidebar from "./_components/Sidebar"; function ScriptContent() { - const [links, setLinks] = useState([]); const [selectedScript, setSelectedScript] = useState(null); - const [loading, setLoading] = useState(true); + const [links, setLinks] = useState([]); const searchParams = useSearchParams(); - useEffect(() => { - const fetchCategories = async (): Promise => { - try { - const response = await fetch("api/categories"); - if (!response.ok) { - throw new Error("Failed to fetch categories"); - } - const categories: Category[] = await response.json(); - if (categories.length === 0) { - throw new Error("Empty response"); - } - const sortedCategories = sortCategories(categories); - setLinks(sortedCategories); - setLoading(false); - } catch (error) { - console.error(error); - setLoading(false); - } - }; - - fetchCategories(); - }, []); - - useEffect(() => { - const id = searchParams.get("id"); - if (id) { - setSelectedScript(id); - } else { - setSelectedScript(null); - } - }, [searchParams, setSelectedScript]); - const sortCategories = (categories: Category[]): Category[] => { return categories.sort((a: Category, b: Category) => { if ( @@ -65,6 +32,25 @@ function ScriptContent() { }); }; + useEffect(() => { + fetch('/api/categories') + .then(response => response.json()) + .then(categories => { + const sortedCategories = sortCategories(categories); + setLinks(sortedCategories); + }) + .catch(error => console.error(error)); + }, []); + + useEffect(() => { + const id = searchParams.get("id"); + if (id) { + setSelectedScript(id); + } else { + setSelectedScript(null); + } + }, [searchParams, setSelectedScript]); + return (