refactor(ui): replace inline INPUT_CLS/LABEL_CLS/BTN_DANGER constants and action link classes with CSS component classes

Remove duplicated Tailwind class string constants from 15 component files.
Use app-input, app-select, app-label, app-action-danger-btn, and
app-action-delete CSS component classes from globals.css instead.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-04-10 09:21:03 +02:00
parent 9ba49c9ab8
commit 05aa864359
15 changed files with 159 additions and 197 deletions
@@ -39,9 +39,6 @@ interface ResourceListView {
resources: ResourceOption[];
}
const INPUT_CLS = "app-input";
const LABEL_CLS = "app-label";
function toNumber(value: string) {
const parsed = Number.parseFloat(value);
return Number.isFinite(parsed) ? parsed : 0;
@@ -474,27 +471,27 @@ export function EstimateWorkspaceDraftEditor({
<section className="space-y-5 rounded-3xl border border-gray-200 bg-white p-6 shadow-sm">
<div className="grid gap-4 md:grid-cols-2">
<label>
<span className={LABEL_CLS}>Estimate name</span>
<input className={INPUT_CLS} value={name} onChange={(event) => setName(event.target.value)} />
<span className="app-label">Estimate name</span>
<input className="app-input" value={name} onChange={(event) => setName(event.target.value)} />
</label>
<label>
<span className={LABEL_CLS}>Opportunity ID</span>
<input className={INPUT_CLS} value={opportunityId} onChange={(event) => setOpportunityId(event.target.value)} />
<span className="app-label">Opportunity ID</span>
<input className="app-input" value={opportunityId} onChange={(event) => setOpportunityId(event.target.value)} />
</label>
<label>
<span className={LABEL_CLS}>Base currency</span>
<input className={INPUT_CLS} maxLength={3} value={baseCurrency} onChange={(event) => setBaseCurrency(event.target.value.toUpperCase())} />
<span className="app-label">Base currency</span>
<input className="app-input" maxLength={3} value={baseCurrency} onChange={(event) => setBaseCurrency(event.target.value.toUpperCase())} />
</label>
<label>
<span className={LABEL_CLS}>Version label</span>
<input className={INPUT_CLS} value={versionLabel} onChange={(event) => setVersionLabel(event.target.value)} />
<span className="app-label">Version label</span>
<input className="app-input" value={versionLabel} onChange={(event) => setVersionLabel(event.target.value)} />
</label>
</div>
<label className="block">
<span className={LABEL_CLS}>Version notes</span>
<span className="app-label">Version notes</span>
<textarea
className={`${INPUT_CLS} min-h-32`}
className="app-input min-h-32"
value={versionNotes}
onChange={(event) => setVersionNotes(event.target.value)}
/>