fix: ESLint/TypeScript fixes - nullish coalescing, regexp-exec, optional-chain, unescaped-entities, unused-vars, type-safety
This commit is contained in:
CanbiZ
@@ -1,9 +1,9 @@
|
||||
'use client';
|
||||
"use client";
|
||||
|
||||
import { useState } from 'react';
|
||||
import type { Script, ScriptInstallMethod } from '../../types/script';
|
||||
import { Button } from './ui/button';
|
||||
import { useRegisterModal } from './modal/ModalStackProvider';
|
||||
import { useState } from "react";
|
||||
import type { Script } from "../../types/script";
|
||||
import { Button } from "./ui/button";
|
||||
import { useRegisterModal } from "./modal/ModalStackProvider";
|
||||
|
||||
interface ScriptVersionModalProps {
|
||||
isOpen: boolean;
|
||||
@@ -12,16 +12,29 @@ interface ScriptVersionModalProps {
|
||||
script: Script | null;
|
||||
}
|
||||
|
||||
export function ScriptVersionModal({ isOpen, onClose, onSelectVersion, script }: ScriptVersionModalProps) {
|
||||
useRegisterModal(isOpen, { id: 'script-version-modal', allowEscape: true, onClose });
|
||||
export function ScriptVersionModal({
|
||||
isOpen,
|
||||
onClose,
|
||||
onSelectVersion,
|
||||
script,
|
||||
}: ScriptVersionModalProps) {
|
||||
useRegisterModal(isOpen, {
|
||||
id: "script-version-modal",
|
||||
allowEscape: true,
|
||||
onClose,
|
||||
});
|
||||
const [selectedVersion, setSelectedVersion] = useState<string | null>(null);
|
||||
|
||||
if (!isOpen || !script) return null;
|
||||
|
||||
// Get available install methods
|
||||
const installMethods = script.install_methods || [];
|
||||
const defaultMethod = installMethods.find(method => method.type === 'default');
|
||||
const alpineMethod = installMethods.find(method => method.type === 'alpine');
|
||||
const defaultMethod = installMethods.find(
|
||||
(method) => method.type === "default",
|
||||
);
|
||||
const alpineMethod = installMethods.find(
|
||||
(method) => method.type === "alpine",
|
||||
);
|
||||
|
||||
const handleConfirm = () => {
|
||||
if (selectedVersion) {
|
||||
@@ -35,19 +48,29 @@ export function ScriptVersionModal({ isOpen, onClose, onSelectVersion, script }:
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 backdrop-blur-sm bg-black/50 flex items-center justify-center z-50 p-4">
|
||||
<div className="bg-card rounded-lg shadow-xl max-w-2xl w-full border border-border">
|
||||
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4 backdrop-blur-sm">
|
||||
<div className="bg-card border-border w-full max-w-2xl rounded-lg border shadow-xl">
|
||||
{/* Header */}
|
||||
<div className="flex items-center justify-between p-6 border-b border-border">
|
||||
<h2 className="text-xl font-bold text-foreground">Select Version</h2>
|
||||
<div className="border-border flex items-center justify-between border-b p-6">
|
||||
<h2 className="text-foreground text-xl font-bold">Select Version</h2>
|
||||
<Button
|
||||
onClick={onClose}
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="text-muted-foreground hover:text-foreground"
|
||||
>
|
||||
<svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
|
||||
<svg
|
||||
className="h-6 w-6"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M6 18L18 6M6 6l12 12"
|
||||
/>
|
||||
</svg>
|
||||
</Button>
|
||||
</div>
|
||||
@@ -55,11 +78,12 @@ export function ScriptVersionModal({ isOpen, onClose, onSelectVersion, script }:
|
||||
{/* Content */}
|
||||
<div className="p-6">
|
||||
<div className="mb-6">
|
||||
<h3 className="text-lg font-medium text-foreground mb-2">
|
||||
<h3 className="text-foreground mb-2 text-lg font-medium">
|
||||
Choose a version for "{script.name}"
|
||||
</h3>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
Select the version you want to install. Each version has different resource requirements.
|
||||
<p className="text-muted-foreground text-sm">
|
||||
Select the version you want to install. Each version has different
|
||||
resource requirements.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -67,25 +91,29 @@ export function ScriptVersionModal({ isOpen, onClose, onSelectVersion, script }:
|
||||
{/* Default Version */}
|
||||
{defaultMethod && (
|
||||
<div
|
||||
onClick={() => handleVersionSelect('default')}
|
||||
onClick={() => handleVersionSelect("default")}
|
||||
className={`cursor-pointer rounded-lg border-2 p-4 transition-all ${
|
||||
selectedVersion === 'default'
|
||||
? 'border-primary bg-primary/10'
|
||||
: 'border-border bg-card hover:border-primary/50'
|
||||
selectedVersion === "default"
|
||||
? "border-primary bg-primary/10"
|
||||
: "border-border bg-card hover:border-primary/50"
|
||||
}`}
|
||||
>
|
||||
<div className="flex items-start justify-between">
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center space-x-3 mb-3">
|
||||
<div className="mb-3 flex items-center space-x-3">
|
||||
<div
|
||||
className={`w-5 h-5 rounded-full border-2 flex items-center justify-center ${
|
||||
selectedVersion === 'default'
|
||||
? 'border-primary bg-primary'
|
||||
: 'border-border'
|
||||
className={`flex h-5 w-5 items-center justify-center rounded-full border-2 ${
|
||||
selectedVersion === "default"
|
||||
? "border-primary bg-primary"
|
||||
: "border-border"
|
||||
}`}
|
||||
>
|
||||
{selectedVersion === 'default' && (
|
||||
<svg className="w-3 h-3 text-white" fill="currentColor" viewBox="0 0 20 20">
|
||||
{selectedVersion === "default" && (
|
||||
<svg
|
||||
className="h-3 w-3 text-white"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 20 20"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
|
||||
@@ -94,27 +122,34 @@ export function ScriptVersionModal({ isOpen, onClose, onSelectVersion, script }:
|
||||
</svg>
|
||||
)}
|
||||
</div>
|
||||
<h4 className="text-base font-semibold text-foreground capitalize">
|
||||
<h4 className="text-foreground text-base font-semibold capitalize">
|
||||
{defaultMethod.type}
|
||||
</h4>
|
||||
</div>
|
||||
<div className="grid grid-cols-2 gap-3 text-sm ml-8">
|
||||
<div className="ml-8 grid grid-cols-2 gap-3 text-sm">
|
||||
<div>
|
||||
<span className="text-muted-foreground">CPU: </span>
|
||||
<span className="text-foreground font-medium">{defaultMethod.resources.cpu} cores</span>
|
||||
<span className="text-foreground font-medium">
|
||||
{defaultMethod.resources.cpu} cores
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-muted-foreground">RAM: </span>
|
||||
<span className="text-foreground font-medium">{defaultMethod.resources.ram} MB</span>
|
||||
<span className="text-foreground font-medium">
|
||||
{defaultMethod.resources.ram} MB
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-muted-foreground">HDD: </span>
|
||||
<span className="text-foreground font-medium">{defaultMethod.resources.hdd} GB</span>
|
||||
<span className="text-foreground font-medium">
|
||||
{defaultMethod.resources.hdd} GB
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-muted-foreground">OS: </span>
|
||||
<span className="text-foreground font-medium">
|
||||
{defaultMethod.resources.os} {defaultMethod.resources.version}
|
||||
{defaultMethod.resources.os}{" "}
|
||||
{defaultMethod.resources.version}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -126,25 +161,29 @@ export function ScriptVersionModal({ isOpen, onClose, onSelectVersion, script }:
|
||||
{/* Alpine Version */}
|
||||
{alpineMethod && (
|
||||
<div
|
||||
onClick={() => handleVersionSelect('alpine')}
|
||||
onClick={() => handleVersionSelect("alpine")}
|
||||
className={`cursor-pointer rounded-lg border-2 p-4 transition-all ${
|
||||
selectedVersion === 'alpine'
|
||||
? 'border-primary bg-primary/10'
|
||||
: 'border-border bg-card hover:border-primary/50'
|
||||
selectedVersion === "alpine"
|
||||
? "border-primary bg-primary/10"
|
||||
: "border-border bg-card hover:border-primary/50"
|
||||
}`}
|
||||
>
|
||||
<div className="flex items-start justify-between">
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center space-x-3 mb-3">
|
||||
<div className="mb-3 flex items-center space-x-3">
|
||||
<div
|
||||
className={`w-5 h-5 rounded-full border-2 flex items-center justify-center ${
|
||||
selectedVersion === 'alpine'
|
||||
? 'border-primary bg-primary'
|
||||
: 'border-border'
|
||||
className={`flex h-5 w-5 items-center justify-center rounded-full border-2 ${
|
||||
selectedVersion === "alpine"
|
||||
? "border-primary bg-primary"
|
||||
: "border-border"
|
||||
}`}
|
||||
>
|
||||
{selectedVersion === 'alpine' && (
|
||||
<svg className="w-3 h-3 text-white" fill="currentColor" viewBox="0 0 20 20">
|
||||
{selectedVersion === "alpine" && (
|
||||
<svg
|
||||
className="h-3 w-3 text-white"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 20 20"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
|
||||
@@ -153,27 +192,34 @@ export function ScriptVersionModal({ isOpen, onClose, onSelectVersion, script }:
|
||||
</svg>
|
||||
)}
|
||||
</div>
|
||||
<h4 className="text-base font-semibold text-foreground capitalize">
|
||||
<h4 className="text-foreground text-base font-semibold capitalize">
|
||||
{alpineMethod.type}
|
||||
</h4>
|
||||
</div>
|
||||
<div className="grid grid-cols-2 gap-3 text-sm ml-8">
|
||||
<div className="ml-8 grid grid-cols-2 gap-3 text-sm">
|
||||
<div>
|
||||
<span className="text-muted-foreground">CPU: </span>
|
||||
<span className="text-foreground font-medium">{alpineMethod.resources.cpu} cores</span>
|
||||
<span className="text-foreground font-medium">
|
||||
{alpineMethod.resources.cpu} cores
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-muted-foreground">RAM: </span>
|
||||
<span className="text-foreground font-medium">{alpineMethod.resources.ram} MB</span>
|
||||
<span className="text-foreground font-medium">
|
||||
{alpineMethod.resources.ram} MB
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-muted-foreground">HDD: </span>
|
||||
<span className="text-foreground font-medium">{alpineMethod.resources.hdd} GB</span>
|
||||
<span className="text-foreground font-medium">
|
||||
{alpineMethod.resources.hdd} GB
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-muted-foreground">OS: </span>
|
||||
<span className="text-foreground font-medium">
|
||||
{alpineMethod.resources.os} {alpineMethod.resources.version}
|
||||
{alpineMethod.resources.os}{" "}
|
||||
{alpineMethod.resources.version}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -184,12 +230,8 @@ export function ScriptVersionModal({ isOpen, onClose, onSelectVersion, script }:
|
||||
</div>
|
||||
|
||||
{/* Action Buttons */}
|
||||
<div className="flex justify-end space-x-3 mt-6">
|
||||
<Button
|
||||
onClick={onClose}
|
||||
variant="outline"
|
||||
size="default"
|
||||
>
|
||||
<div className="mt-6 flex justify-end space-x-3">
|
||||
<Button onClick={onClose} variant="outline" size="default">
|
||||
Cancel
|
||||
</Button>
|
||||
<Button
|
||||
@@ -197,7 +239,9 @@ export function ScriptVersionModal({ isOpen, onClose, onSelectVersion, script }:
|
||||
disabled={!selectedVersion}
|
||||
variant="default"
|
||||
size="default"
|
||||
className={!selectedVersion ? 'bg-muted-foreground cursor-not-allowed' : ''}
|
||||
className={
|
||||
!selectedVersion ? "bg-muted-foreground cursor-not-allowed" : ""
|
||||
}
|
||||
>
|
||||
Continue
|
||||
</Button>
|
||||
@@ -207,4 +251,3 @@ export function ScriptVersionModal({ isOpen, onClose, onSelectVersion, script }:
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user