mirror of
https://github.com/community-scripts/ProxmoxVE.git
synced 2025-11-07 20:02:49 +00:00
Enhance category metadata in JSON and update script accordion to display icons. Added 'icon' property to categories in metadata.json and modified script-accordion component to render corresponding icons for each category. (#7894)
This commit is contained in:
Bram Suurd
GitHub
@@ -1,31 +1,186 @@
|
||||
{
|
||||
"categories": [
|
||||
{ "name": "Proxmox & Virtualization", "id": 1, "sort_order": 1.0, "description": "Tools and scripts to manage Proxmox VE and virtualization platforms effectively." },
|
||||
{ "name": "Operating Systems", "id": 2, "sort_order": 2.0, "description": "Scripts for deploying and managing various operating systems." },
|
||||
{ "name": "Containers & Docker", "id": 3, "sort_order": 3.0, "description": "Solutions for containerization using Docker and related technologies." },
|
||||
{ "name": "Network & Firewall", "id": 4, "sort_order": 4.0, "description": "Enhance network security and configure firewalls with ease." },
|
||||
{ "name": "Adblock & DNS", "id": 5, "sort_order": 5.0, "description": "Optimize your network with DNS and ad-blocking solutions." },
|
||||
{ "name": "Authentication & Security", "id": 6, "sort_order": 6.0, "description": "Secure your infrastructure with authentication and security tools." },
|
||||
{ "name": "Backup & Recovery", "id": 7, "sort_order": 7.0, "description": "Reliable backup and recovery scripts to protect your data." },
|
||||
{ "name": "Databases", "id": 8, "sort_order": 8.0, "description": "Deploy and manage robust database systems with ease." },
|
||||
{ "name": "Monitoring & Analytics", "id": 9, "sort_order": 9.0, "description": "Monitor system performance and analyze data seamlessly." },
|
||||
{ "name": "Dashboards & Frontends", "id": 10, "sort_order": 10.0, "description": "Create interactive dashboards and user-friendly frontends." },
|
||||
{ "name": "Files & Downloads", "id": 11, "sort_order": 11.0, "description": "Manage file sharing and downloading solutions efficiently." },
|
||||
{ "name": "Documents & Notes", "id": 12, "sort_order": 12.0, "description": "Organize and manage documents and note-taking tools." },
|
||||
{ "name": "Media & Streaming", "id": 13, "sort_order": 13.0, "description": "Stream and manage media effortlessly across devices." },
|
||||
{ "name": "*Arr Suite", "id": 14, "sort_order": 14.0, "description": "Automated media management with the popular *Arr suite tools." },
|
||||
{ "name": "NVR & Cameras", "id": 15, "sort_order": 15.0, "description": "Manage network video recorders and camera setups." },
|
||||
{ "name": "IoT & Smart Home", "id": 16, "sort_order": 16.0, "description": "Control and automate IoT devices and smart home systems." },
|
||||
{ "name": "ZigBee, Z-Wave & Matter", "id": 17, "sort_order": 17.0, "description": "Solutions for ZigBee, Z-Wave, and Matter-based device management." },
|
||||
{ "name": "MQTT & Messaging", "id": 18, "sort_order": 18.0, "description": "Set up reliable messaging and MQTT-based communication systems." },
|
||||
{ "name": "Automation & Scheduling", "id": 19, "sort_order": 19.0, "description": "Automate tasks and manage scheduling with powerful tools." },
|
||||
{ "name": "AI / Coding & Dev-Tools", "id": 20, "sort_order": 20.0, "description": "Leverage AI and developer tools for smarter coding workflows." },
|
||||
{ "name": "Webservers & Proxies", "id": 21, "sort_order": 21.0, "description": "Deploy and configure web servers and proxy solutions." },
|
||||
{ "name": "Bots & ChatOps", "id": 22, "sort_order": 22.0, "description": "Enhance collaboration with bots and ChatOps integrations." },
|
||||
{ "name": "Finance & Budgeting", "id": 23, "sort_order": 23.0, "description": "Track expenses and manage budgets efficiently." },
|
||||
{ "name": "Gaming & Leisure", "id": 24, "sort_order": 24.0, "description": "Scripts for gaming servers and leisure-related tools." },
|
||||
{ "name": "Business & ERP", "id": 25, "sort_order": 25.0, "description": "Streamline business operations with ERP and management tools." },
|
||||
{ "name": "Miscellaneous", "id": 0, "sort_order": 99.0, "description": "General scripts and tools that don't fit into other categories." }
|
||||
{
|
||||
"name": "Proxmox & Virtualization",
|
||||
"id": 1,
|
||||
"sort_order": 1.0,
|
||||
"description": "Tools and scripts to manage Proxmox VE and virtualization platforms effectively.",
|
||||
"icon": "server"
|
||||
},
|
||||
{
|
||||
"name": "Operating Systems",
|
||||
"id": 2,
|
||||
"sort_order": 2.0,
|
||||
"description": "Scripts for deploying and managing various operating systems.",
|
||||
"icon": "monitor"
|
||||
},
|
||||
{
|
||||
"name": "Containers & Docker",
|
||||
"id": 3,
|
||||
"sort_order": 3.0,
|
||||
"description": "Solutions for containerization using Docker and related technologies.",
|
||||
"icon": "box"
|
||||
},
|
||||
{
|
||||
"name": "Network & Firewall",
|
||||
"id": 4,
|
||||
"sort_order": 4.0,
|
||||
"description": "Enhance network security and configure firewalls with ease.",
|
||||
"icon": "shield"
|
||||
},
|
||||
{
|
||||
"name": "Adblock & DNS",
|
||||
"id": 5,
|
||||
"sort_order": 5.0,
|
||||
"description": "Optimize your network with DNS and ad-blocking solutions.",
|
||||
"icon": "ban"
|
||||
},
|
||||
{
|
||||
"name": "Authentication & Security",
|
||||
"id": 6,
|
||||
"sort_order": 6.0,
|
||||
"description": "Secure your infrastructure with authentication and security tools.",
|
||||
"icon": "lock"
|
||||
},
|
||||
{
|
||||
"name": "Backup & Recovery",
|
||||
"id": 7,
|
||||
"sort_order": 7.0,
|
||||
"description": "Reliable backup and recovery scripts to protect your data.",
|
||||
"icon": "archive"
|
||||
},
|
||||
{
|
||||
"name": "Databases",
|
||||
"id": 8,
|
||||
"sort_order": 8.0,
|
||||
"description": "Deploy and manage robust database systems with ease.",
|
||||
"icon": "database"
|
||||
},
|
||||
{
|
||||
"name": "Monitoring & Analytics",
|
||||
"id": 9,
|
||||
"sort_order": 9.0,
|
||||
"description": "Monitor system performance and analyze data seamlessly.",
|
||||
"icon": "bar-chart"
|
||||
},
|
||||
{
|
||||
"name": "Dashboards & Frontends",
|
||||
"id": 10,
|
||||
"sort_order": 10.0,
|
||||
"description": "Create interactive dashboards and user-friendly frontends.",
|
||||
"icon": "layout"
|
||||
},
|
||||
{
|
||||
"name": "Files & Downloads",
|
||||
"id": 11,
|
||||
"sort_order": 11.0,
|
||||
"description": "Manage file sharing and downloading solutions efficiently.",
|
||||
"icon": "download"
|
||||
},
|
||||
{
|
||||
"name": "Documents & Notes",
|
||||
"id": 12,
|
||||
"sort_order": 12.0,
|
||||
"description": "Organize and manage documents and note-taking tools.",
|
||||
"icon": "file-text"
|
||||
},
|
||||
{
|
||||
"name": "Media & Streaming",
|
||||
"id": 13,
|
||||
"sort_order": 13.0,
|
||||
"description": "Stream and manage media effortlessly across devices.",
|
||||
"icon": "play"
|
||||
},
|
||||
{
|
||||
"name": "*Arr Suite",
|
||||
"id": 14,
|
||||
"sort_order": 14.0,
|
||||
"description": "Automated media management with the popular *Arr suite tools.",
|
||||
"icon": "tv"
|
||||
},
|
||||
{
|
||||
"name": "NVR & Cameras",
|
||||
"id": 15,
|
||||
"sort_order": 15.0,
|
||||
"description": "Manage network video recorders and camera setups.",
|
||||
"icon": "camera"
|
||||
},
|
||||
{
|
||||
"name": "IoT & Smart Home",
|
||||
"id": 16,
|
||||
"sort_order": 16.0,
|
||||
"description": "Control and automate IoT devices and smart home systems.",
|
||||
"icon": "home"
|
||||
},
|
||||
{
|
||||
"name": "ZigBee, Z-Wave & Matter",
|
||||
"id": 17,
|
||||
"sort_order": 17.0,
|
||||
"description": "Solutions for ZigBee, Z-Wave, and Matter-based device management.",
|
||||
"icon": "radio"
|
||||
},
|
||||
{
|
||||
"name": "MQTT & Messaging",
|
||||
"id": 18,
|
||||
"sort_order": 18.0,
|
||||
"description": "Set up reliable messaging and MQTT-based communication systems.",
|
||||
"icon": "message-circle"
|
||||
},
|
||||
{
|
||||
"name": "Automation & Scheduling",
|
||||
"id": 19,
|
||||
"sort_order": 19.0,
|
||||
"description": "Automate tasks and manage scheduling with powerful tools.",
|
||||
"icon": "clock"
|
||||
},
|
||||
{
|
||||
"name": "AI / Coding & Dev-Tools",
|
||||
"id": 20,
|
||||
"sort_order": 20.0,
|
||||
"description": "Leverage AI and developer tools for smarter coding workflows.",
|
||||
"icon": "code"
|
||||
},
|
||||
{
|
||||
"name": "Webservers & Proxies",
|
||||
"id": 21,
|
||||
"sort_order": 21.0,
|
||||
"description": "Deploy and configure web servers and proxy solutions.",
|
||||
"icon": "globe"
|
||||
},
|
||||
{
|
||||
"name": "Bots & ChatOps",
|
||||
"id": 22,
|
||||
"sort_order": 22.0,
|
||||
"description": "Enhance collaboration with bots and ChatOps integrations.",
|
||||
"icon": "bot"
|
||||
},
|
||||
{
|
||||
"name": "Finance & Budgeting",
|
||||
"id": 23,
|
||||
"sort_order": 23.0,
|
||||
"description": "Track expenses and manage budgets efficiently.",
|
||||
"icon": "dollar-sign"
|
||||
},
|
||||
{
|
||||
"name": "Gaming & Leisure",
|
||||
"id": 24,
|
||||
"sort_order": 24.0,
|
||||
"description": "Scripts for gaming servers and leisure-related tools.",
|
||||
"icon": "gamepad-2"
|
||||
},
|
||||
{
|
||||
"name": "Business & ERP",
|
||||
"id": 25,
|
||||
"sort_order": 25.0,
|
||||
"description": "Streamline business operations with ERP and management tools.",
|
||||
"icon": "building"
|
||||
},
|
||||
{
|
||||
"name": "Miscellaneous",
|
||||
"id": 0,
|
||||
"sort_order": 99.0,
|
||||
"description": "General scripts and tools that don't fit into other categories.",
|
||||
"icon": "more-horizontal"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { useCallback, useEffect, useRef, useState } from "react";
|
||||
import * as Icons from "lucide-react";
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
|
||||
@@ -9,6 +10,17 @@ import { formattedBadge } from "@/components/command-menu";
|
||||
import { basePath } from "@/config/site-config";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
function getCategoryIcon(iconName: string) {
|
||||
// Convert kebab-case to PascalCase for Lucide icon names
|
||||
const pascalCaseName = iconName
|
||||
.split("-")
|
||||
.map(word => word.charAt(0).toUpperCase() + word.slice(1))
|
||||
.join("");
|
||||
|
||||
const IconComponent = (Icons as any)[pascalCaseName];
|
||||
return IconComponent ? <IconComponent className="size-4 text-[#0083c3] mr-2" /> : null;
|
||||
}
|
||||
|
||||
export default function ScriptAccordion({
|
||||
items,
|
||||
selectedScript,
|
||||
@@ -81,10 +93,13 @@ export default function ScriptAccordion({
|
||||
)}
|
||||
>
|
||||
<div className="mr-2 flex w-full items-center justify-between">
|
||||
<span className="pl-2 text-left">
|
||||
<div className="flex items-center pl-2 text-left">
|
||||
{getCategoryIcon(category.icon)}
|
||||
<span>
|
||||
{category.name}
|
||||
{" "}
|
||||
</span>
|
||||
</div>
|
||||
<span className="rounded-full bg-gray-200 px-2 py-1 text-xs text-muted-foreground hover:no-underline dark:bg-blue-800/20">
|
||||
{category.scripts.length}
|
||||
</span>
|
||||
@@ -103,8 +118,7 @@ export default function ScriptAccordion({
|
||||
query: { id: script.slug, category: category.name },
|
||||
}}
|
||||
prefetch={false}
|
||||
className={`flex cursor-pointer items-center justify-between gap-1 px-1 py-1 text-muted-foreground hover:rounded-lg hover:bg-accent/60 hover:dark:bg-accent/20 ${
|
||||
selectedScript === script.slug
|
||||
className={`flex cursor-pointer items-center justify-between gap-1 px-1 py-1 text-muted-foreground hover:rounded-lg hover:bg-accent/60 hover:dark:bg-accent/20 ${selectedScript === script.slug
|
||||
? "rounded-lg bg-accent font-semibold dark:bg-accent/30 dark:text-white"
|
||||
: ""
|
||||
}`}
|
||||
|
||||
@@ -41,6 +41,8 @@ export type Category = {
|
||||
name: string;
|
||||
id: number;
|
||||
sort_order: number;
|
||||
description: string;
|
||||
icon: string;
|
||||
scripts: Script[];
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user