diff --git a/node_modules b/node_modules new file mode 120000 index 0000000000..d6af08994d --- /dev/null +++ b/node_modules @@ -0,0 +1 @@ +/home/diegosouzapw/dev/proxys/OmniRoute/node_modules \ No newline at end of file diff --git a/src/app/(dashboard)/dashboard/settings/components/FeatureFlagCard.tsx b/src/app/(dashboard)/dashboard/settings/components/FeatureFlagCard.tsx index eb364be7d7..58ead505cc 100644 --- a/src/app/(dashboard)/dashboard/settings/components/FeatureFlagCard.tsx +++ b/src/app/(dashboard)/dashboard/settings/components/FeatureFlagCard.tsx @@ -1,5 +1,4 @@ -import React from "react"; -import { AlertTriangle, Loader2, RefreshCw, RotateCcw } from "lucide-react"; +"use client"; interface FeatureFlagCardProps { flag: { @@ -8,7 +7,7 @@ interface FeatureFlagCardProps { description: string; category: "security" | "network" | "policies" | "runtime" | "cli" | "health"; type: "boolean" | "enum"; - enumValues?: string[]; + enumValues?: string[] | null; effectiveValue: string; source: "db" | "env" | "default"; requiresRestart: boolean; @@ -19,167 +18,161 @@ interface FeatureFlagCardProps { saving?: boolean; } -const categoryStyles = { - security: "bg-red-500/15 text-red-500", - network: "bg-blue-500/15 text-blue-500", - policies: "bg-amber-500/15 text-amber-500", - runtime: "bg-purple-500/15 text-purple-500", - cli: "bg-green-500/15 text-green-500", - health: "bg-cyan-500/15 text-cyan-500", +const CATEGORY_STYLES: Record< + FeatureFlagCardProps["flag"]["category"], + { bg: string; text: string; label: string } +> = { + security: { bg: "bg-red-500/15", text: "text-red-400", label: "Security" }, + network: { bg: "bg-blue-500/15", text: "text-blue-400", label: "Network" }, + policies: { bg: "bg-amber-500/15", text: "text-amber-400", label: "Policies" }, + runtime: { bg: "bg-purple-500/15", text: "text-purple-400", label: "Runtime" }, + cli: { bg: "bg-green-500/15", text: "text-green-400", label: "CLI" }, + health: { bg: "bg-cyan-500/15", text: "text-cyan-400", label: "Health" }, }; -const sourceBadgeConfig = { - db: { label: "DB", className: "bg-blue-500/20 text-blue-400" }, - env: { label: "ENV", className: "bg-amber-500/20 text-amber-400" }, - default: { label: "DEF", className: "bg-slate-500/20 text-slate-400" }, +const SOURCE_STYLES: Record< + FeatureFlagCardProps["flag"]["source"], + { bg: string; text: string; label: string } +> = { + db: { bg: "bg-blue-500/20", text: "text-blue-300", label: "DB" }, + env: { bg: "bg-amber-500/20", text: "text-amber-300", label: "ENV" }, + default: { bg: "bg-slate-500/20", text: "text-slate-400", label: "DEF" }, }; -export const FeatureFlagCard: React.FC = ({ - flag, - onToggle, - onReset, - saving = false, -}) => { - const isEnabled = - flag.effectiveValue === "true" || flag.effectiveValue === "1" || flag.effectiveValue === "yes"; +function isEnabled(value: string): boolean { + return value === "true" || value === "1" || value === "yes"; +} - // Base glassmorphism + hover + active states - let cardClass = `feature-flag-card relative flex flex-col justify-between p-4 rounded-xl border bg-black/40 backdrop-blur-md transition-all duration-200 group`; +function Spinner() { + return ( +