Skip to content

refactor(frontend): Extract shared form primitives (#114)#122

Merged
enko merged 1 commit intomainfrom
refactor/extract-shared-form-primitives
Mar 8, 2026
Merged

refactor(frontend): Extract shared form primitives (#114)#122
enko merged 1 commit intomainfrom
refactor/extract-shared-form-primitives

Conversation

@enko
Copy link
Copy Markdown
Member

@enko enko commented Mar 7, 2026

Summary

  • Create reusable UI components (FormInput, FormSelect, FormCheckbox, FormTextarea), shared Tailwind class constants (formClasses), and a dirty-tracking utility (createDirtyTracker) in apps/frontend/src/lib/components/ui/
  • Refactor all 9 subresource edit forms to use the shared primitives, eliminating ~280 lines of structural duplication (311 insertions vs 589 deletions)
  • Add optional enabled parameter to autoFocus action to support conditional autofocus in form components

Closes #114

Test plan

  • pnpm --filter @freundebuch/frontend check passes (0 errors, 23 pre-existing warnings)
  • pnpm --filter @freundebuch/frontend build succeeds
  • Pre-commit hooks pass (Biome lint, type-check, build)
  • Pre-push hooks pass (full CI suite including backend tests)
  • Manual smoke test: open each of the 9 subresource add/edit modals, verify fields render, autofocus works, dirty tracking fires, save produces correct data

🤖 Generated with Claude Code

<div>
<label for={id} class={formClasses.label}>
{label}
{#if required}<span class="text-red-500">*</span>{/if}
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Accessibility: Add aria-hidden to required asterisk indicator

Screen readers will announce the * character as "asterisk", which can be confusing since the semantic "required" information is already conveyed by the required attribute on the <input> element.

Suggested fix:

{#if required}<span class="text-red-500" aria-hidden="true">*</span>{/if}

Copy link
Copy Markdown

@github-actions github-actions bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code review complete. No critical or important issues found. One minor accessibility suggestion on FormInput.svelte (aria-hidden on required asterisk indicator). Changes look good overall - solid refactoring with proper Svelte 5 runes usage, i18n compliance maintained, and backward-compatible autoFocus enhancement.

@github-actions
Copy link
Copy Markdown

github-actions bot commented Mar 7, 2026

Automated Code Review | Commit: 4f02183 | Reviewed: 2026-03-08 | Status: Approved | Critical: 0 | Important: 0 | Suggestion: 0 | Previous aria-hidden suggestion resolved (already in code at FormInput.svelte:35) | AGENTS.md: Security pass, Architecture pass, i18n pass, Testing pass | Summary: Clean refactor - shared form primitives, createDirtyTracker, and 9 migrated forms eliminate ~280 lines of duplication. autoFocus backward-compatible. No issues found. | CI: https://github.com/datenknoten/freundebuch/actions/runs/22818235915

…source duplication (#114)

Create reusable UI components (FormInput, FormSelect, FormCheckbox, FormTextarea),
a shared Tailwind class constants module (formClasses), and a dirty-tracking utility
(createDirtyTracker) to replace ~700 lines of structural duplication across 9
subresource edit forms.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@enko enko force-pushed the refactor/extract-shared-form-primitives branch from e1c9788 to 4f02183 Compare March 8, 2026 09:24
Copy link
Copy Markdown

@github-actions github-actions bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code review passed at commit 4f02183. No critical or important issues. The previous accessibility suggestion (aria-hidden on required asterisk in FormInput.svelte) is already addressed. The refactor is clean and follows all project conventions.

@enko enko merged commit 2134168 into main Mar 8, 2026
5 checks passed
@enko enko deleted the refactor/extract-shared-form-primitives branch March 8, 2026 09:31
@github-actions
Copy link
Copy Markdown

github-actions bot commented Mar 8, 2026

🎉 This PR is included in version 2.65.5 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

refactor(frontend): Extract shared form primitives from 9 duplicate edit forms

1 participant