Add JSON Generator page for easier configuring of new metadata (#230)

* Update mariadb.json

* Update vaultwarden.json

* Update vaultwarden.json

* Update keycloak.json

* Update json/keycloak.json

Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com>

* Update mariadb.json

Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com>

* Add canonical link to layout for improved SEO and page indexing

* Fix image source fallback for script logos to use a consistent relative path

* Fix image source for script logos across components to consistently use the "/ProxmoxVE/logo.png" path

* Update image source for script logos to use basePath for consistent paths across all components

* Fix image source for script logos to ensure leading slash is consistent for all components' paths

* Add JSON generator component with validation and UI elements for managing scripts, categories, and installation methods

* Add calendar and label components; enhance JSON generator with date selection and script path updates for installation methods

* Enhance Alerts component with dynamic colored notes using AlertColors from config for better visibility and consistency

* Remove MultiSelect component

* Update JSON generator: streamline install methods, enhance note type selection, and refine button behavior for better UX

* Refactor AlertColors: unify warning and danger styles for consistency and improved visual hierarchy in alerts

* Enhance JSONGenerator: improve SelectItem layout with color indicators for better visual representation of alert types

* Refactor JSON schema definitions in JSONGenerator: separate InstallMethod and Note schemas for better structure and readability

* Fix JSONGenerator: streamline SelectItem markup and enhance JSON display layout for improved readability and user experience

* Refactor JSON schema handling: move schema definitions to separate file

* Enhance error handling in JSONGenerator: display Zod validation errors on user input for better feedback and debugging

* Export InstallMethodSchema and integrate into JSONGenerator for better validation of install method data input

* Add Categories and Note components to JSONGenerator for better organization and modularity in the JSON editing interface

* Remove unused imports

---------

Co-authored-by: CanbiZ <47820557+MickLesk@users.noreply.github.com>
Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com>
This commit is contained in:
Bram Suurd 2024-11-14 09:08:45 +01:00 committed by GitHub
parent 72bee44543
commit 4e1a2bde24
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
15 changed files with 1354 additions and 5 deletions

View file

@ -0,0 +1,59 @@
import * as React from "react"
import { cva, type VariantProps } from "class-variance-authority"
import { cn } from "@/lib/utils"
const alertVariants = cva(
"relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground",
{
variants: {
variant: {
default: "bg-background text-foreground",
destructive:
"border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive",
},
},
defaultVariants: {
variant: "default",
},
}
)
const Alert = React.forwardRef<
HTMLDivElement,
React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof alertVariants>
>(({ className, variant, ...props }, ref) => (
<div
ref={ref}
role="alert"
className={cn(alertVariants({ variant }), className)}
{...props}
/>
))
Alert.displayName = "Alert"
const AlertTitle = React.forwardRef<
HTMLParagraphElement,
React.HTMLAttributes<HTMLHeadingElement>
>(({ className, ...props }, ref) => (
<h5
ref={ref}
className={cn("mb-1 font-medium leading-none tracking-tight", className)}
{...props}
/>
))
AlertTitle.displayName = "AlertTitle"
const AlertDescription = React.forwardRef<
HTMLParagraphElement,
React.HTMLAttributes<HTMLParagraphElement>
>(({ className, ...props }, ref) => (
<div
ref={ref}
className={cn("text-sm [&_p]:leading-relaxed", className)}
{...props}
/>
))
AlertDescription.displayName = "AlertDescription"
export { Alert, AlertTitle, AlertDescription }