Skip to content

Commit 8562133

Browse files
fiskusfiskus
committed
Group each commit-dialog field with its violation so the error sits close
1 parent fdfb1ff commit 8562133

3 files changed

Lines changed: 70 additions & 54 deletions

File tree

‎quilt-sync/CHANGELOG.md‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,12 @@
99
<!-- markdownlint-disable MD013 -->
1010
# Changelog
1111

12-
## [v0.18.3-alpha10] - 2026-07-10
12+
## [v0.18.3-alpha10] - 2026-07-13
1313

1414
### Fixed
1515

1616
- The commit dialog's JSON metadata editor no longer disappears after the first dialog of a session (<https://github.com/quiltdata/quilt-rs/pull/763>)
17+
- Commit dialog field validation errors now sit directly beneath their field instead of a full row below (<https://github.com/quiltdata/quilt-rs/pull/763>)
1718

1819
## [v0.18.3-alpha9] - 2026-07-10
1920

‎quilt-sync/ui/assets/css/pages/commit.css‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,15 @@
3232
gap: var(--q-ui-size-4);
3333
}
3434

35+
/* Keeps a field and its advisory violation together as one unit, so the
36+
* form's inter-field `gap` falls between groups, not between a field and its
37+
* own error. */
38+
.field-group {
39+
display: flex;
40+
flex-direction: column;
41+
gap: var(--q-ui-size-0-5);
42+
}
43+
3544
.field {
3645
border: 1px solid var(--q-ui-palette-border);
3746
border-radius: 4px;
@@ -104,7 +113,7 @@
104113
color: var(--q-ui-palette-error);
105114
font-size: var(--q-ui-font-size-small);
106115
list-style: none;
107-
margin: var(--q-ui-size-0-5) 0 0;
116+
margin: 0;
108117
padding: 0;
109118
}
110119

‎quilt-sync/ui/src/pages/commit.rs‎

Lines changed: 58 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -373,62 +373,68 @@ fn CommitContent(
373373
/>
374374

375375
// ── Namespace (readonly) ──
376-
<p class="field">
377-
<label class="label" for="namespace">"Name"</label>
378-
<input
379-
class="input"
380-
id="namespace"
381-
name="namespace"
382-
readonly
383-
prop:value=namespace.clone()
384-
/>
385-
</p>
386-
{move || field_violation_view(&live_violations.get(), ViolationField::Name)}
376+
<div class="field-group">
377+
<p class="field">
378+
<label class="label" for="namespace">"Name"</label>
379+
<input
380+
class="input"
381+
id="namespace"
382+
name="namespace"
383+
readonly
384+
prop:value=namespace.clone()
385+
/>
386+
</p>
387+
{move || field_violation_view(&live_violations.get(), ViolationField::Name)}
388+
</div>
387389

388390
// ── Message ──
389-
<p class="field">
390-
<label class="label" for="message">"Message"</label>
391-
<input
392-
autofocus
393-
class="input"
394-
id="message"
395-
name="message"
396-
required
397-
prop:value=move || message.get()
398-
on:input=move |ev| {
399-
message_dirty.set(true);
400-
message.set(event_target_value(&ev));
401-
}
402-
/>
403-
</p>
404-
{move || field_violation_view(&live_violations.get(), ViolationField::Message)}
391+
<div class="field-group">
392+
<p class="field">
393+
<label class="label" for="message">"Message"</label>
394+
<input
395+
autofocus
396+
class="input"
397+
id="message"
398+
name="message"
399+
required
400+
prop:value=move || message.get()
401+
on:input=move |ev| {
402+
message_dirty.set(true);
403+
message.set(event_target_value(&ev));
404+
}
405+
/>
406+
</p>
407+
{move || field_violation_view(&live_violations.get(), ViolationField::Message)}
408+
</div>
405409

406410
// ── Metadata (textarea + JSON editor) ──
407-
<p class="field">
408-
<label class="label" for="metadata">"User metadata"</label>
409-
<textarea
410-
node_ref=textarea_ref
411-
class="textarea"
412-
id="metadata"
413-
name="metadata"
414-
placeholder="{ \"key\": \"value\" }"
415-
on:input=move |ev| {
416-
metadata_dirty.set(true);
417-
metadata_text.set(event_target_value(&ev));
418-
}
419-
>
420-
{user_meta}
421-
</textarea>
422-
{user_meta_error.map(|err| view! {
423-
<span class="error">{err}</span>
424-
})}
425-
</p>
426-
{move || field_violation_view(&live_violations.get(), ViolationField::Metadata)}
427-
<JsonEditor
428-
node_ref=editor_ref
429-
textarea_ref=textarea_ref
430-
initial_value=user_meta_for_editor
431-
/>
411+
<div class="field-group">
412+
<p class="field">
413+
<label class="label" for="metadata">"User metadata"</label>
414+
<textarea
415+
node_ref=textarea_ref
416+
class="textarea"
417+
id="metadata"
418+
name="metadata"
419+
placeholder="{ \"key\": \"value\" }"
420+
on:input=move |ev| {
421+
metadata_dirty.set(true);
422+
metadata_text.set(event_target_value(&ev));
423+
}
424+
>
425+
{user_meta}
426+
</textarea>
427+
{user_meta_error.map(|err| view! {
428+
<span class="error">{err}</span>
429+
})}
430+
</p>
431+
{move || field_violation_view(&live_violations.get(), ViolationField::Metadata)}
432+
<JsonEditor
433+
node_ref=editor_ref
434+
textarea_ref=textarea_ref
435+
initial_value=user_meta_for_editor
436+
/>
437+
</div>
432438
</div>
433439
</div>
434440

0 commit comments

Comments
 (0)