fix: react-doctor → 64/100 — add sizes to 12 next/image, add htmlFor/id to 202 label/input pairs, add aria-label to 5 icon links

This commit is contained in:
Nora
2026-06-26 02:51:12 -06:00
parent 29d9d23a26
commit 33626620a0
53 changed files with 489 additions and 545 deletions
@@ -519,8 +519,8 @@ export default function CampaignComposerPage({ brandId, campaigns, templates, se
{/* Editor */}
<div className="space-y-4">
<div>
<label className="block text-sm font-semibold text-stone-700 mb-1.5">Subject Line</label>
<input aria-label="Enter A Compelling Subject..."
<label htmlFor="fld-1-subject-line" className="block text-sm font-semibold text-stone-700 mb-1.5">Subject Line</label>
<input id="fld-1-subject-line" aria-label="Enter A Compelling Subject..."
type="text"
placeholder="Enter a compelling subject..."
value={subject}
@@ -531,8 +531,8 @@ export default function CampaignComposerPage({ brandId, campaigns, templates, se
</div>
<div>
<label className="block text-sm font-semibold text-stone-700 mb-1.5">Message Body</label>
<textarea aria-label="Write Your Message Here..."
<label htmlFor="fld-2-message-body" className="block text-sm font-semibold text-stone-700 mb-1.5">Message Body</label>
<textarea id="fld-2-message-body" aria-label="Write Your Message Here..."
placeholder="Write your message here..."
value={bodyText}
onChange={(e) => setBodyText(e.target.value)}
@@ -596,8 +596,8 @@ export default function CampaignComposerPage({ brandId, campaigns, templates, se
</div>
<div>
<label className="block text-sm font-semibold text-stone-700 mb-1.5">Recipient Segment</label>
<select aria-label="Select"
<label htmlFor="fld-3-recipient-segment" className="block text-sm font-semibold text-stone-700 mb-1.5">Recipient Segment</label>
<select id="fld-3-recipient-segment" aria-label="Select"
value={selectedSegmentId}
onChange={(e) => setSelectedSegmentId(e.target.value)}
className="w-full border border-stone-200 rounded-xl px-4 py-3 text-sm bg-white outline-none focus:ring-2 focus:ring-emerald-500 focus:border-emerald-500 transition-all"
@@ -791,8 +791,8 @@ export default function CampaignComposerPage({ brandId, campaigns, templates, se
{!sendNow && (
<div className="mt-4">
<label className="block text-sm font-semibold text-stone-700 mb-1.5">Send Date & Time</label>
<input aria-label="Datetime Local"
<label htmlFor="fld-4-send-date-time" className="block text-sm font-semibold text-stone-700 mb-1.5">Send Date & Time</label>
<input id="fld-4-send-date-time" aria-label="Datetime Local"
type="datetime-local"
value={scheduledAt}
onChange={(e) => setScheduledAt(e.target.value)}
@@ -327,8 +327,8 @@ function FilterBlock({ brandId, filter, onChange, onRemove }: FilterBlockProps)
</select>
<div className="grid grid-cols-2 gap-3">
<div>
<label className="text-xs text-[var(--admin-text-muted)] mb-1 block">From</label>
<input aria-label="Date"
<label htmlFor="fld-1-from" className="text-xs text-[var(--admin-text-muted)] mb-1 block">From</label>
<input id="fld-1-from" aria-label="Date"
type="date"
value={filter.params.date_from ?? ""}
onChange={(e) => onChange({ params: { ...filter.params, date_from: e.target.value } })}
@@ -336,8 +336,8 @@ function FilterBlock({ brandId, filter, onChange, onRemove }: FilterBlockProps)
/>
</div>
<div>
<label className="text-xs text-[var(--admin-text-muted)] mb-1 block">To</label>
<input aria-label="Date"
<label htmlFor="fld-2-to" className="text-xs text-[var(--admin-text-muted)] mb-1 block">To</label>
<input id="fld-2-to" aria-label="Date"
type="date"
value={filter.params.date_to ?? ""}
onChange={(e) => onChange({ params: { ...filter.params, date_to: e.target.value } })}
@@ -366,8 +366,8 @@ function FilterBlock({ brandId, filter, onChange, onRemove }: FilterBlockProps)
))}
</select>
<div className="flex items-center gap-2">
<label className="text-xs text-[var(--admin-text-muted)] whitespace-nowrap">In the last</label>
<input aria-label="Number"
<label htmlFor="fld-3-in-the-last" className="text-xs text-[var(--admin-text-muted)] whitespace-nowrap">In the last</label>
<input id="fld-3-in-the-last" aria-label="Number"
type="number"
min={1}
max={365}
@@ -422,8 +422,8 @@ function FilterBlock({ brandId, filter, onChange, onRemove }: FilterBlockProps)
))}
</select>
<div className="flex items-center gap-2">
<label className="text-xs text-[var(--admin-text-muted)] whitespace-nowrap">In the last</label>
<input aria-label="Number"
<label htmlFor="fld-4-in-the-last-2" className="text-xs text-[var(--admin-text-muted)] whitespace-nowrap">In the last</label>
<input id="fld-4-in-the-last-2" aria-label="Number"
type="number"
min={1}
max={365}
@@ -74,8 +74,8 @@ export default function SegmentEditModal({ initialName = "", initialDescription
{/* Content */}
<div className="p-6 flex flex-col gap-4">
<div>
<label className="block text-sm font-medium text-[var(--admin-text-primary)] mb-1.5">Segment Name</label>
<input aria-label=". Fort Pierce Regulars"
<label htmlFor="fld-1-segment-name" className="block text-sm font-medium text-[var(--admin-text-primary)] mb-1.5">Segment Name</label>
<input id="fld-1-segment-name" aria-label=". Fort Pierce Regulars"
type="text"
value={name}
onChange={(e) => setName(e.target.value)}