Skip to content

feat(frontend): upgrade linked fields selector#46

Open
ivanskv2000 wants to merge 5 commits into
mainfrom
feat(frontend)/upgrade-linked-fields-selector
Open

feat(frontend): upgrade linked fields selector#46
ivanskv2000 wants to merge 5 commits into
mainfrom
feat(frontend)/upgrade-linked-fields-selector

Conversation

@ivanskv2000
Copy link
Copy Markdown
Owner

✨ Overview

This PR significantly upgrades the event management experience by introducing a sleek, paginated interface for linking fields and standardizing form behavior across the application. It also addresses critical developer experience issues with Docker synchronization.

Key Changes:

1. LinkedFieldsSelector Upgrade

  • New Interface: Replaced the simple checkbox list with a professional TanStack Table-based interface.
  • Improved Interaction: Added a full-width search bar for instant filtering.
  • Paginated View: Implemented compact 5-row pagination to maintain a clean form layout.
  • Standardized Styling: ID and header formatting now strictly follow project-wide patterns (removing excessive custom formatting).
  • "Select All" Logic: Added a global checkbox that toggles all filtered rows across all pages.
  • Fixed Layout: Disabled column hiding to ensure the selector remains predictable and stable.

2. Security & UX (Form Attributes)

  • Password Manager Fix: Added autocomplete="off" and unique name attributes to all metadata inputs in EventForm, FieldForm, TagForm, and the field search bar. This prevents password managers from incorrectly identifying these as login fields.
  • Standardized Auth Forms: Verified and maintained correct autocomplete values for LoginForm and SignupForm.

3. Core Component & Layout Improvements

  • DataTable Enhancements: Added hideHeader prop support and refined meta.class application to ensure reliable column truncation.
  • Responsive Layout: Relaxed the EventCreatePage card width to max-w-2xl to better accommodate the new table-based selection interfaces.
  • EventForm Reactivity: Refactored field selection to use v-slot="{ componentField }" pattern, ensuring perfect synchronization with vee-validate state.

4. Developer Experience

  • Docker HMR Fix: Enabled file polling in vite.config.ts to resolve issues where local changes were not propagating to the Docker container on macOS.

🛠️ Scope & Verification

Workspace:

  • frontend
  • backend
  • common/config

Checklist:

  • Manually tested and verified locally
  • Automated suite passes cleanly (formatting, linting, tests)
  • New/updated unit tests included (if applicable)

@sonarqubecloud
Copy link
Copy Markdown

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant