mirror of
https://github.com/community-scripts/ProxmoxVE.git
synced 2025-11-05 19:02:50 +00:00
Switch from Pocketbase data retrieval to JSON (#100)
* Add new animation for switching themes. * Remove unused metadata files from testing * increase duration on theme switch * Reduce animation duration for view transition effect to improve responsiveness * Fetch categories and scripts from external sources, updating `GET` endpoint to aggregate data. Adjust type definitions for Script and Category * Refactor all components to use data from new API * Refactor `InterFaces` component to use updated `Script` type and streamline interface/port handling for better clarity * Refactor `CommandMenu` component to utilize updated `Category` and `Script` types, simplifying the sorting logic and enhancing clarity * Fix animation duration in `globals.css` to ensure proper view transition functionality across the application * Remove unnecessary console log for file name in `fetchAllMetaDataFiles` to clean up code * Refactor category fetching in `ScriptContent` and `CommandMenu` to utilize centralized `fetchCategories` for improved maintainability * Use `formattedBadge` in `ScriptAccordion` and `CommandMenu` for consistent badge rendering across script types * Refactor source URL generation in `Buttons` component to enhance clarity and streamline the installation script logic * Check default settings availability in `DefaultSettings` component and handle undefined values more gracefully in rendering * Fix install command generation to handle optional script parameter and update copy button logic for improved functionality * Add most popular scripts feature and update script rendering logic in `ScriptInfoBlocks` component * Enhance `ScriptItem` component to display correct type naming alongside script name for better clarity in the UI * Add conversion utility to display RAM in GB for better readability in `DefaultSettings` component * Refactor Next.js config to use dynamic basePath and update sitemap URLs for improved adaptability and host configuration * Refactor site configuration to utilize centralized settings for analytics and base path; replace PocketBase imports with new data module * Refactor sitemap generation to use centralized basePath from config, enhancing adaptability for URL management * Refactor to replace PocketBase with a new data module across components * Refactor layout to use centralized analytics configuration * Update deployment workflow to include JSON files for GitHub Pages publishing * Remove caching step from GitHub Pages deploy workflow to avoid caching * Remove basePath from Next.js config to simplify configuration and avoid potential issues with path resolution * Add category sorting and fetching logic in data.ts * Add analytics configuration and basePath to siteConfig * Remove obsolete environment files for analytics and PocketBase * Update sitemap to use a fixed domain for the generated sitemap instead of deriving from headers * Refactor layout to utilize basePath for metadata base URL and image links for better configurability * use cleaner `basePath` variable around codebase for easier management * Update frontend/src/app/api/categories/route.ts Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update frontend/src/app/api/categories/route.ts Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update frontend/src/app/api/categories/route.ts Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update frontend/src/components/CommandMenu.tsx Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update frontend/src/components/ui/theme-toggle.tsx Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update frontend/src/components/CommandMenu.tsx Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update frontend/src/app/api/categories/route.ts Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update frontend/src/app/api/categories/route.ts Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update frontend/src/app/scripts/_components/ScriptItems/DefaultPassword.tsx Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update frontend/src/app/scripts/_components/ScriptItems/DefaultSettings.tsx Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update src/lib/data.ts with necessary changes. Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update src/app/api/categories/route.ts with necessary modifications * Update frontend/src/app/scripts/_components/ScriptItems/InstallCommand.tsx Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update src/components/CommandMenu.tsx with necessary improvements * Add renamed themetoggle * Update frontend/src/app/scripts/_components/ScriptInfoBlocks.tsx Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update frontend/src/app/scripts/_components/ScriptItems/DefaultSettings.tsx Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update frontend/src/app/scripts/_components/ScriptItems/DefaultSettings.tsx with new settings configuration * Update src/app/scripts/_components/ScriptInfoBlocks.tsx with enhancements and fixes * Update src/app/scripts/_components/ScriptItems/InstallCommand.tsx * Update src/app/scripts/_components/ScriptItem.tsx * Update src/app/scripts/_components/ScriptAccordion.tsx with necessary adjustments and improvements * Update Interfaces to use strict check * updated interfaces to use normal string label instead of jsx * Update configuration to use environment variable for BASE_PATH and reflect changes in siteConfig * force static base path * Update CommandMenu.tsx Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update DefaultSettings.tsx Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Update DefaultSettings.tsx Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com> * Ensure fetchScripts returns a typed Script array by specifying return type in map function * Remove commented-out import for unused Category type in CommandMenu component * Fix fetch URLs by removing unnecessary slashes and ensure proper return type in fetchScripts map function * Refactor MostViewedScripts to ensure proper type annotations and improve array concatenation method for better readability * Update BASE_PATH handling in next.config and fix fetch URLs to ensure correct path structure in API routes --------- Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com>
This commit is contained in:
Bram Suurd
GitHub
@@ -6,30 +6,28 @@ import {
|
||||
CommandItem,
|
||||
CommandList,
|
||||
} from "@/components/ui/command";
|
||||
import { fetchCategories } from "@/lib/data";
|
||||
import { Category } from "@/lib/types";
|
||||
import { cn } from "@/lib/utils";
|
||||
import Image from "next/image";
|
||||
import { useRouter } from "next/navigation";
|
||||
import React, { useEffect } from "react";
|
||||
import React from "react";
|
||||
import { Badge } from "./ui/badge";
|
||||
import { Button } from "./ui/button";
|
||||
import { DialogTitle } from "./ui/dialog";
|
||||
|
||||
const sortCategories = (categories: Category[]): Category[] => {
|
||||
return categories.sort((a: Category, b: Category) => {
|
||||
if (
|
||||
a.catagoryName === "Proxmox VE Tools" &&
|
||||
b.catagoryName !== "Proxmox VE Tools"
|
||||
) {
|
||||
return -1;
|
||||
} else if (
|
||||
a.catagoryName !== "Proxmox VE Tools" &&
|
||||
b.catagoryName === "Proxmox VE Tools"
|
||||
) {
|
||||
return 1;
|
||||
} else {
|
||||
return a.catagoryName.localeCompare(b.catagoryName);
|
||||
}
|
||||
});
|
||||
export const formattedBadge = (type: string) => {
|
||||
switch (type) {
|
||||
case "vm":
|
||||
return <Badge className="text-blue-500/75 border-blue-500/75">VM</Badge>;
|
||||
case "ct":
|
||||
return (
|
||||
<Badge className="text-yellow-500/75 border-yellow-500/75">LXC</Badge>
|
||||
);
|
||||
case "misc":
|
||||
return <Badge className="text-red-500/75 border-red-500/75">MISC</Badge>;
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
export default function CommandMenu() {
|
||||
@@ -50,21 +48,17 @@ export default function CommandMenu() {
|
||||
return () => document.removeEventListener("keydown", down);
|
||||
}, []);
|
||||
|
||||
const fetchCategories = async () => {
|
||||
const fetchSortedCategories = () => {
|
||||
setIsLoading(true);
|
||||
fetch(
|
||||
`api/categories?_=${process.env.NEXT_PUBLIC_BUILD_TIME || Date.now()}`,
|
||||
)
|
||||
.then((response) => response.json())
|
||||
.then((categories) => {
|
||||
const sortedCategories = sortCategories(categories);
|
||||
setLinks(sortedCategories);
|
||||
setIsLoading(false);
|
||||
})
|
||||
.catch((error) => {
|
||||
setIsLoading(false);
|
||||
console.error(error);
|
||||
});
|
||||
fetchCategories()
|
||||
.then((categories) => {
|
||||
setLinks(categories);
|
||||
setIsLoading(false);
|
||||
})
|
||||
.catch((error) => {
|
||||
setIsLoading(false);
|
||||
console.error(error);
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
@@ -75,8 +69,8 @@ export default function CommandMenu() {
|
||||
"relative h-9 w-full justify-start rounded-[0.5rem] bg-muted/50 text-sm font-normal text-muted-foreground shadow-none sm:pr-12 md:w-40 lg:w-64",
|
||||
)}
|
||||
onClick={() => {
|
||||
fetchCategories();
|
||||
setOpen(true)
|
||||
fetchSortedCategories();
|
||||
setOpen(true);
|
||||
}}
|
||||
>
|
||||
<span className="inline-flex">Search scripts...</span>
|
||||
@@ -85,41 +79,40 @@ export default function CommandMenu() {
|
||||
</kbd>
|
||||
</Button>
|
||||
<CommandDialog open={open} onOpenChange={setOpen}>
|
||||
<DialogTitle className="sr-only">Search scripts</DialogTitle>
|
||||
<CommandInput placeholder="search for a script..." />
|
||||
<DialogTitle className="sr-only">Search scripts</DialogTitle>
|
||||
<CommandInput placeholder="Search for a script..." />
|
||||
<CommandList>
|
||||
<CommandEmpty>{isLoading ? "Loading..." : "No scripts found."}</CommandEmpty>
|
||||
<CommandEmpty>
|
||||
{isLoading ? "Loading..." : "No scripts found."}
|
||||
</CommandEmpty>
|
||||
{links.map((category) => (
|
||||
<CommandGroup
|
||||
key={"category:" + category.catagoryName}
|
||||
heading={category.catagoryName}
|
||||
key={`category:${category.name}`}
|
||||
heading={category.name}
|
||||
>
|
||||
{category.expand.items.map((script) => (
|
||||
{category.scripts.map((script) => (
|
||||
<CommandItem
|
||||
key={"script:" + script.id}
|
||||
value={script.title}
|
||||
key={`script:${script.name}`}
|
||||
value={script.name}
|
||||
onSelect={() => {
|
||||
setOpen(false);
|
||||
router.push(`/scripts?id=${script.title}`);
|
||||
router.push(`/scripts?id=${script.name}`);
|
||||
}}
|
||||
>
|
||||
<div className="flex gap-2" onClick={() => setOpen(false)}>
|
||||
<Image
|
||||
src={script.logo}
|
||||
unoptimized
|
||||
height={16}
|
||||
src={script.logo || "/logo.png"}
|
||||
onError={(e) =>
|
||||
((e.currentTarget as HTMLImageElement).src =
|
||||
"/logo.png")
|
||||
}
|
||||
width={16}
|
||||
height={16}
|
||||
alt=""
|
||||
className="h-5 w-5"
|
||||
/>
|
||||
<span>{script.title}</span>
|
||||
<span className="text-sm text-muted-foreground">
|
||||
{script.item_type}
|
||||
</span>
|
||||
<span>{script.name}</span>
|
||||
<span>{formattedBadge(script.type)}</span>
|
||||
</div>
|
||||
</CommandItem>
|
||||
))}
|
||||
|
||||
Reference in New Issue
Block a user