vrr/HelperScripts-for-ProxmoxVE
2
0
Fork 0
mirror of https://github.com/community-scripts/ProxmoxVE.git synced 2025-09-11 18:04:38 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 8

Refactor Buttons component to use a ButtonLink for cleaner code, simplifying the source URL generation and layout (#371)

Browse source 
* Refactor Buttons component to use a ButtonLink for cleaner code, simplifying the source URL generation and layout

* Refactor DefaultPassword component to simplify credential handling and enhance code readability with map function

* Refactor DefaultSettings component to improve resource display logic and enhance readability using a new ResourceDisplay subcomponent
This commit is contained in:
Bram Suurd 2024-11-19 22:21:00 +01:00 • committed by GitHub
parent 9f80cec2d9
commit 6e71047570
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 104 additions and 118 deletions
Download patch file Download diff file Expand all files Collapse all files

76
frontend/src/app/scripts/_components/ScriptItems/Buttons.tsx
View file

@ -5,45 +5,53 @@ import { BookOpenText, Code, Globe } from "lucide-react";
import Link from "next/link";
const generateSourceUrl = (slug: string, type: string) => {
if (type === "ct") {
return `https://raw.githubusercontent.com/community-scripts/${basePath}/main/install/${slug}-install.sh`;
} else {
return `https://raw.githubusercontent.com/community-scripts/${basePath}/main/${type}/${slug}.sh`;
}
const baseUrl = `https://raw.githubusercontent.com/community-scripts/${basePath}/main`;
return type === "ct"
? `${baseUrl}/install/${slug}-install.sh`
: `${baseUrl}/${type}/${slug}.sh`;
};
interface ButtonLinkProps {
href: string;
icon: React.ReactNode;
text: string;
}
const ButtonLink = ({ href, icon, text }: ButtonLinkProps) => (
<Button variant="secondary" asChild>
<Link target="_blank" href={href}>
<span className="flex items-center gap-2">
{icon}
{text}
</span>
</Link>
</Button>
);
export default function Buttons({ item }: { item: Script }) {
const buttons = [
item.website && {
href: item.website,
icon: <Globe className="h-4 w-4" />,
text: "Website",
},
item.documentation && {
href: item.documentation,
icon: <BookOpenText className="h-4 w-4" />,
text: "Documentation",
},
{
href: generateSourceUrl(item.slug, item.type),
icon: <Code className="h-4 w-4" />,
text: "Source Code",
},
].filter(Boolean) as ButtonLinkProps[];
return (
<div className="flex flex-wrap justify-end gap-2">
{item.website && (
<Button variant="secondary" asChild>
<Link target="_blank" href={item.website}>
<span className="flex items-center gap-2">
<Globe className="h-4 w-4" /> Website
</span>
</Link>
</Button>
)}
{item.documentation && (
<Button variant="secondary" asChild>
<Link target="_blank" href={item.documentation}>
<span className="flex items-center gap-2">
<BookOpenText className="h-4 w-4" />
Documentation
</span>
</Link>
</Button>
)}
{
<Button variant="secondary" asChild>
<Link target="_blank" href={generateSourceUrl(item.slug, item.type)}>
<span className="flex items-center gap-2">
<Code className="h-4 w-4" />
Source Code
</span>
</Link>
</Button>
}
{buttons.map((props, index) => (
<ButtonLink key={index} {...props} />
))}
</div>
);
}