refactor: Script Library and Builder design critique fixes
Library: - Clear CTA hierarchy: "Build New Script" primary, "Import Script" ghost, "Manage" demoted to text link - "New from Script" → "Import Script" (clearer label) Script Builder: - Add suggestion chips for first-time users (4 common MSP tasks) - Chips auto-hide after first message Design system normalization: - ScriptPreviewModal: bg-black/80 → bg-black/40, text-blue-400 → text-accent-text, emerald save button → primary, inline rgba → CSS variables - ScriptCodeBlock: bg-[rgba(0,0,0,0.3)] → bg-code, text-blue-400 → text-accent-text, text-text-muted typo fixed, emerald button → ghost style - TemplateCard: emerald/amber/rose badges → success-dim/warning-dim/danger-dim, ShieldAlert amber → warning token - ParameterDetectorStepper: blue focus ring → orange, amber → warning token, "Candidate" → "Variable" in stepper progress Jargon clarification: - "Detect Parameters" → "Find Variables" - "Detected Parameters" → "Configurable Variables" - "Parameters (N)" → "Variables (N)" - Detection summary copy reworded for clarity Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -92,7 +92,7 @@ export function ParameterizeAndSavePanel({
|
||||
if (detected.length > 0) {
|
||||
setShowStepper(true)
|
||||
} else {
|
||||
setDetectionSummary('No parameters detected — script will be saved as-is. Parameter detection currently supports PowerShell only.')
|
||||
setDetectionSummary('No configurable values found — the script will be saved as-is. Variable detection currently supports PowerShell only.')
|
||||
}
|
||||
}, [])
|
||||
|
||||
@@ -298,7 +298,7 @@ export function ParameterizeAndSavePanel({
|
||||
'disabled:opacity-50 disabled:cursor-not-allowed'
|
||||
)}
|
||||
>
|
||||
Detect Parameters
|
||||
Find Variables
|
||||
</button>
|
||||
</section>
|
||||
)}
|
||||
@@ -313,7 +313,7 @@ export function ParameterizeAndSavePanel({
|
||||
<pre className="p-3 text-xs font-mono text-foreground whitespace-pre-wrap break-all">
|
||||
{workingScript.split(/({{.*?}})/).map((part, i) =>
|
||||
/^{{.*}}$/.test(part)
|
||||
? <span key={i} className="text-amber-400 font-semibold">{part}</span>
|
||||
? <span key={i} className="text-warning font-semibold">{part}</span>
|
||||
: <span key={i}>{part}</span>
|
||||
)}
|
||||
</pre>
|
||||
@@ -332,7 +332,7 @@ export function ParameterizeAndSavePanel({
|
||||
{showStepper && candidates.length > 0 && (
|
||||
<section className="space-y-2">
|
||||
<p className="font-sans text-xs uppercase tracking-widest text-muted-foreground">
|
||||
Detected Parameters
|
||||
Configurable Variables
|
||||
</p>
|
||||
<ParameterDetectorStepper
|
||||
candidates={candidates}
|
||||
@@ -348,7 +348,7 @@ export function ParameterizeAndSavePanel({
|
||||
{parameters.length > 0 && !showStepper && (
|
||||
<section className="space-y-2">
|
||||
<p className="font-sans text-xs uppercase tracking-widest text-muted-foreground">
|
||||
Parameters ({parameters.length})
|
||||
Variables ({parameters.length})
|
||||
</p>
|
||||
<div className="space-y-1">
|
||||
{parameters.map((p) => (
|
||||
@@ -357,7 +357,7 @@ export function ParameterizeAndSavePanel({
|
||||
className="flex items-center justify-between rounded-lg bg-elevated px-3 py-2"
|
||||
>
|
||||
<div className="flex items-center gap-2">
|
||||
<code className="text-xs font-mono text-amber-400">{`{{${p.key}}}`}</code>
|
||||
<code className="text-xs font-mono text-warning">{`{{${p.key}}}`}</code>
|
||||
<span className="text-xs text-muted-foreground">{p.label}</span>
|
||||
</div>
|
||||
<span className="text-[0.625rem] text-muted-foreground uppercase tracking-wide">
|
||||
|
||||
Reference in New Issue
Block a user