mirror of
				https://github.com/community-scripts/ProxmoxVE.git
				synced 2025-11-04 10:22:50 +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:
		@@ -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." }
 | 
			
		||||
	]
 | 
			
		||||
  "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">
 | 
			
		||||
                {category.name}
 | 
			
		||||
                {" "}
 | 
			
		||||
              </span>
 | 
			
		||||
              <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,10 +118,9 @@ 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
 | 
			
		||||
                        ? "rounded-lg bg-accent font-semibold dark:bg-accent/30 dark:text-white"
 | 
			
		||||
                        : ""
 | 
			
		||||
                    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"
 | 
			
		||||
                      : ""
 | 
			
		||||
                    }`}
 | 
			
		||||
                    onClick={() => {
 | 
			
		||||
                      handleSelected(script.slug);
 | 
			
		||||
 
 | 
			
		||||
@@ -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