martin/ProxmoxVE
1
0
Fork 0
mirror of https://github.com/community-scripts/ProxmoxVE synced 2025-01-30 12:30:15 +00:00
Code Issues Actions 7 Packages Projects Releases Wiki Activity

Update page.tsx

Browse Source
This commit is contained in:
CanbiZ 2025-01-23 11:20:10 +01:00
parent ef60152ae0
commit 9b9b02d9a7
1 changed files with 30 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
frontend/src/app/category-view/page.tsx
View File

@ -10,20 +10,19 @@ const CategoryView = () => {
const [selectedCategory, setSelectedCategory] = useState<Category | null>(null); const [selectedCategory, setSelectedCategory] = useState<Category | null>(null);
useEffect(() => { useEffect(() => {
const fetchCategories = async () => { const fetchCategories = async () => {
try { try {
const basePath = process.env.NODE_ENV === "production" ? "/ProxmoxVE" : ""; // Passe den Basis-Pfad an const response = await fetch("/api/categories");
const response = await fetch(`${basePath}/api/categories`); if (!response.ok) {
if (!response.ok) { throw new Error("Failed to fetch categories");
throw new Error("Failed to fetch categories"); }
} const data = await response.json();
const data = await response.json(); console.log("Fetched categories:", data); // Debugging
console.log("Fetched categories:", data); // Debugging setCategories(data);
setCategories(data); } catch (error) {
} catch (error) { console.error("Error fetching categories:", error);
console.error("Error fetching categories:", error); }
} };
};
fetchCategories(); fetchCategories();
}, []); }, []);
@ -70,9 +69,24 @@ const CategoryView = () => {
<Card <Card
key={category.name} key={category.name}
onClick={() => handleCategoryClick(category)} onClick={() => handleCategoryClick(category)}
className="cursor-pointer hover:shadow-lg" className="cursor-pointer hover:shadow-lg flex flex-col items-center justify-center"
> >
<CardHeader title={category.name} className="text-lg font-semibold" /> <CardContent className="flex flex-col items-center">
<div className="flex flex-wrap justify-center gap-1 mb-2">
{category.scripts && category.scripts.slice(0, 4).map((script, index) => (
<img
key={index}
src={script.logo}
alt={script.name}
className="h-6 w-6 object-contain"
/>
))}
</div>
<h3 className="text-lg font-bold mb-1">{category.name}</h3>
{category.description && (
<p className="text-sm text-gray-500 text-center">{category.description}</p>
)}
</CardContent>
</Card> </Card>
))} ))}
</div> </div>