refactor: Replace deprecated project builder web components with ui components #465
Conversation
…-web - Modal - Button - Sidebar
🦋 Changeset detectedLatest commit: 95774ef The changes in this PR will be included in the next version bump. This PR includes changesets to release 3 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
WalkthroughThis pull request introduces a new changeset document outlining a patch and updates the project by removing an obsolete dependency. Multiple files have been refactored to consolidate and update import paths, switching from relative paths to an alias. Several legacy UI components and their subcomponents have been removed, with many components now replaced by updated versions from the new UI library. Additionally, export declarations have been reorganized, and minor style or class name adjustments have been made across various forms and pages. Changes
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
packages/project-builder-web/src/pages/apps/edit/admin/crud/AdminCrudEmbeddedForm.tsx (1)
123-125: Error handling improved with toast notificationsThe error handling has been improved by using
toast.errorinstead ofsetError. This provides a better user experience with visual feedback.However, consider adding more specific error messages based on the type of error encountered.
- toast.error(logAndFormatError(error)); + toast.error(logAndFormatError(error, 'Failed to save embedded form'));
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Lite
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (54)
.changeset/smooth-ducks-crash.md(1 hunks)packages/project-builder-web/package.json(0 hunks)packages/project-builder-web/src/app/App.tsx(1 hunks)packages/project-builder-web/src/app/AppLayout/ProjectSyncModal.tsx(1 hunks)packages/project-builder-web/src/app/ClientVersionProvider/ClientVersionProvider.test.tsx(1 hunks)packages/project-builder-web/src/app/ProjectDefinitionProvider/ProjectDefinitionProvider.tsx(1 hunks)packages/project-builder-web/src/app/ProjectSelectorGate/ProjectSelectorDialog.tsx(1 hunks)packages/project-builder-web/src/app/ProjectSelectorGate/ProjectSelectorGate.tsx(1 hunks)packages/project-builder-web/src/components/Alert/index.tsx(0 hunks)packages/project-builder-web/src/components/AlertIcon/index.tsx(0 hunks)packages/project-builder-web/src/components/Button/index.tsx(0 hunks)packages/project-builder-web/src/components/CheckedArrayInput/index.tsx(0 hunks)packages/project-builder-web/src/components/CheckedInput/index.tsx(0 hunks)packages/project-builder-web/src/components/CollapsibleRow/CollapsibleRow.tsx(3 hunks)packages/project-builder-web/src/components/EmbeddedListInput/EmbeddedListInput.tsx(5 hunks)packages/project-builder-web/src/components/ErrorBoundary/ErrorBoundary.tsx(1 hunks)packages/project-builder-web/src/components/FormActionBar/FormActionBar.tsx(1 hunks)packages/project-builder-web/src/components/FormError/index.tsx(0 hunks)packages/project-builder-web/src/components/FormLabel/index.tsx(0 hunks)packages/project-builder-web/src/components/LinkButton/index.tsx(0 hunks)packages/project-builder-web/src/components/Modal/index.tsx(0 hunks)packages/project-builder-web/src/components/NotFoundCard/NotFoundCard.tsx(1 hunks)packages/project-builder-web/src/components/SelectInput/index.tsx(0 hunks)packages/project-builder-web/src/components/Sidebar/index.tsx(0 hunks)packages/project-builder-web/src/components/Table/index.tsx(0 hunks)packages/project-builder-web/src/components/TextInput/index.tsx(0 hunks)packages/project-builder-web/src/components/index.ts(1 hunks)packages/project-builder-web/src/hooks/useStatus.ts(0 hunks)packages/project-builder-web/src/pages/NotFound.page.tsx(1 hunks)packages/project-builder-web/src/pages/apps/edit.page.tsx(2 hunks)packages/project-builder-web/src/pages/apps/edit/AdminAppForm.tsx(1 hunks)packages/project-builder-web/src/pages/apps/edit/BackendAppForm.tsx(2 hunks)packages/project-builder-web/src/pages/apps/edit/WebAppForm.tsx(2 hunks)packages/project-builder-web/src/pages/apps/edit/admin/AdminEditSectionForm.tsx(2 hunks)packages/project-builder-web/src/pages/apps/edit/admin/AdminGeneralForm.tsx(2 hunks)packages/project-builder-web/src/pages/apps/edit/admin/AdminSectionsForm.tsx(3 hunks)packages/project-builder-web/src/pages/apps/edit/admin/crud/AdminCrudEmbeddedForm.tsx(6 hunks)packages/project-builder-web/src/pages/apps/edit/admin/crud/AdminCrudSectionForm.tsx(2 hunks)packages/project-builder-web/src/pages/apps/edit/admin/crud/CrudFormFieldsForm.tsx(2 hunks)packages/project-builder-web/src/pages/apps/edit/admin/crud/CrudTableColumnsForm.tsx(3 hunks)packages/project-builder-web/src/pages/data/enums/edit/EnumEditLayout.tsx(1 hunks)packages/project-builder-web/src/pages/data/enums/edit/edit.page.tsx(1 hunks)packages/project-builder-web/src/pages/data/enums/edit/sections/EnumValuesSection.tsx(1 hunks)packages/project-builder-web/src/pages/data/models/edit/[id]/_components/fields/ModelFieldsForm.tsx(1 hunks)packages/project-builder-web/src/pages/data/models/edit/[id]/_components/service/ServiceEmbeddedRelationForm.tsx(1 hunks)packages/project-builder-web/src/pages/data/models/edit/[id]/_layout.tsx(1 hunks)packages/project-builder-web/src/pages/data/models/edit/[id]/graphql.page.tsx(1 hunks)packages/project-builder-web/src/pages/data/models/edit/[id]/index.page.tsx(1 hunks)packages/project-builder-web/src/pages/data/models/edit/[id]/service.page.tsx(1 hunks)packages/project-builder-web/src/pages/features/auth/RoleEditorForm.tsx(2 hunks)packages/project-builder-web/src/pages/features/auth/index.tsx(5 hunks)packages/project-builder-web/src/pages/settings/project-settings.tsx(1 hunks)packages/project-builder-web/src/services/error-formatter.ts(1 hunks)packages/ui-components/src/styles/button.ts(1 hunks)
💤 Files with no reviewable changes (15)
- packages/project-builder-web/package.json
- packages/project-builder-web/src/components/FormError/index.tsx
- packages/project-builder-web/src/components/FormLabel/index.tsx
- packages/project-builder-web/src/components/Sidebar/index.tsx
- packages/project-builder-web/src/components/AlertIcon/index.tsx
- packages/project-builder-web/src/components/TextInput/index.tsx
- packages/project-builder-web/src/components/Alert/index.tsx
- packages/project-builder-web/src/hooks/useStatus.ts
- packages/project-builder-web/src/components/Button/index.tsx
- packages/project-builder-web/src/components/CheckedInput/index.tsx
- packages/project-builder-web/src/components/CheckedArrayInput/index.tsx
- packages/project-builder-web/src/components/Table/index.tsx
- packages/project-builder-web/src/components/Modal/index.tsx
- packages/project-builder-web/src/components/SelectInput/index.tsx
- packages/project-builder-web/src/components/LinkButton/index.tsx
🧰 Additional context used
🧬 Code Definitions (1)
packages/project-builder-web/src/pages/apps/edit/admin/crud/AdminCrudEmbeddedForm.tsx (2)
packages/project-builder-lib/src/schema/apps/admin/sections/crud.ts (2) (2)
adminCrudEmbeddedFormSchema(101-113)AdminCrudEmbeddedFormConfig(115-117)packages/project-builder-web/src/services/error-formatter.ts (1) (1)
logAndFormatError(34-37)
🔇 Additional comments (81)
.changeset/smooth-ducks-crash.md (1)
1-6: Changeset looks good!The changeset correctly specifies a patch version update for the project-builder-web package, which is appropriate for this type of refactoring change. The description clearly communicates the purpose of the changes.
packages/ui-components/src/styles/button.ts (1)
18-18: Good addition of destructiveLink variantThe new destructiveLink variant follows the same pattern as the existing link variant but with destructive styling, providing a consistent way to implement link-style buttons with warning/danger semantics.
packages/project-builder-web/src/pages/NotFound.page.tsx (1)
4-4: Import path standardization looks goodChanging from relative imports to using the '@src' alias helps maintain consistency across the codebase and makes imports more maintainable, especially when files are moved around.
packages/project-builder-web/src/pages/data/models/edit/[id]/_components/fields/ModelFieldsForm.tsx (1)
11-12: Import path standardization is appropriateChanging the SortableList import from a relative path to the '@src/components' alias is consistent with the project-wide refactoring effort. This improves maintainability and makes imports more consistent throughout the codebase.
packages/project-builder-web/src/pages/apps/edit/AdminAppForm.tsx (1)
29-29: Styling update looks good.The change from a background color to a top margin with border provides a cleaner visual separation between the navigation tabs and content area.
packages/project-builder-web/src/pages/data/models/edit/[id]/graphql.page.tsx (1)
7-7: Good import consolidation.Converting from a direct import to a barrel import improves maintainability and is consistent with the project-wide import standardization effort.
packages/project-builder-web/src/pages/data/enums/edit/EnumEditLayout.tsx (1)
9-10: Import path standardization looks good.Using the
@srcalias instead of relative imports provides better consistency across the project and makes the codebase more maintainable when files are reorganized.packages/project-builder-web/src/components/NotFoundCard/NotFoundCard.tsx (1)
3-3: Great component migration to shared UI library.Replacing the local Button component with the one from
@halfdomelabs/ui-componentsaligns perfectly with the PR objective of standardizing UI components across the project.packages/project-builder-web/src/pages/data/enums/edit/sections/EnumValuesSection.tsx (1)
16-16: Import path update looks good.The import path change from relative to the
@srcalias aligns with the standardization effort across the codebase. This improves consistency and maintainability.packages/project-builder-web/src/services/error-formatter.ts (1)
5-5: Import path standardization looks good.The update from relative import to the
@srcalias is consistent with the project's refactoring direction, making imports more maintainable.packages/project-builder-web/src/pages/data/models/edit/[id]/_layout.tsx (1)
8-8: Import path refactor is correct.The change to use the
@srcalias instead of a relative path follows the standardization pattern throughout this PR. This makes the codebase more consistent.packages/project-builder-web/src/pages/data/models/edit/[id]/_components/service/ServiceEmbeddedRelationForm.tsx (1)
19-19: Import path update is appropriate.Moving from a relative path to the
@srcalias for the usePrevious hook maintains consistency with the other import standardization changes in this PR.packages/project-builder-web/src/components/ErrorBoundary/ErrorBoundary.tsx (1)
11-11: Import path standardization is correct.The update to use the
@srcalias for the logError import is consistent with the project's import standardization pattern throughout this PR.packages/project-builder-web/src/app/ProjectSelectorGate/ProjectSelectorDialog.tsx (1)
12-14: Absolute Imports for Hooks and Error Logging Updated.
The changes update the import paths for bothuseProjectsandlogErrorto use the alias (@src). This improves consistency and maintainability across the project.packages/project-builder-web/src/pages/data/enums/edit/edit.page.tsx (1)
7-7: Consolidated Component Imports.
Consolidating the imports forErrorBoundaryandFormActionBarinto a single statement from@src/componentssimplifies the code and aligns with the broader refactoring effort.packages/project-builder-web/src/app/ClientVersionProvider/ClientVersionProvider.test.tsx (1)
5-5: Re-activating thegetVersionInfoImport.
Reintroducing thegetVersionInfoimport from@src/services/apiensures that version information is correctly fetched during tests. This change is essential for the test suite’s coverage of version handling.packages/project-builder-web/src/pages/data/models/edit/[id]/index.page.tsx (1)
12-13: Refined Imports and Utility Registration.
The consolidation ofErrorBoundaryandFormActionBarimports enhances clarity, and adding theregisterEntityTypeUrlimport supports the standardized registration of entity types. This refactor helps maintain consistency across pages and ensures proper functionality.packages/project-builder-web/src/app/AppLayout/ProjectSyncModal.tsx (1)
16-17: Updated Absolute Imports for API Functions.
Switching the imports forstartSyncandformatErrorto use the absolute alias (@src) is a positive move for code organization. Make sure that these functions behave as intended after the update.packages/project-builder-web/src/pages/apps/edit.page.tsx (3)
6-6: Good import update to use ErrorDisplay from UI componentsThe import change properly adds the ErrorDisplay component from the UI components library, aligning with the PR objective to replace deprecated components.
9-9: Clean import path refactoringUsing the alias
@srcfor importing components is a good practice that improves code maintainability by avoiding relative paths.
100-102: Good implementation of ErrorDisplay componentThe replacement of the previous Alert component with ErrorDisplay is a good improvement. The template string for the error message provides more specific information about the error type.
packages/project-builder-web/src/pages/data/models/edit/[id]/service.page.tsx (1)
10-10: Improved import structure for FormActionBarChanging from a direct import to a named import from the components barrel file is a good practice that simplifies imports and improves maintainability.
packages/project-builder-web/src/pages/settings/project-settings.tsx (1)
15-15: Consistent import refactoring for FormActionBarUpdated import pattern aligns with the project-wide effort to standardize imports from component barrel files instead of direct paths.
packages/project-builder-web/src/app/App.tsx (1)
9-9: Well-organized import consolidationConsolidating multiple imports from the same source into a single import statement is a good practice that reduces code verbosity and improves readability.
packages/project-builder-web/src/components/FormActionBar/FormActionBar.tsx (1)
14-14: Good refactoring to named exportSwitching from default export to named export improves maintainability by enabling better IDE support, making refactoring easier, and ensuring consistent importing patterns across the codebase.
packages/project-builder-web/src/app/ProjectSelectorGate/ProjectSelectorGate.tsx (1)
6-8: Good import path improvementsThe changes to use absolute imports with the
@srcalias instead of relative paths improves code maintainability and readability. Explicit import oflogErrorproperly documents the dependency.packages/project-builder-web/src/pages/apps/edit/WebAppForm.tsx (2)
10-15: Good migration to new UI component librarySuccessfully replaced the deprecated components with the standardized
@halfdomelabs/ui-componentslibrary imports, which should provide better consistency and maintainability.
54-97: Clean implementation of new form componentsThe form fields have been properly migrated from deprecated components to their new equivalents in the UI component library:
TextInput.LabelledController→InputField.ControllerCheckedInput.LabelledController→CheckboxField.ControllerCheckedArrayInput.LabelledController→MultiComboboxField.ControllerAll props have been maintained correctly, preserving the original functionality while using the new component architecture.
packages/project-builder-web/src/components/CollapsibleRow/CollapsibleRow.tsx (4)
3-3: Good migration to standardized UI libraryProperly replaced custom
LinkButtoncomponent with the standardButtoncomponent from the UI library.
15-15: Good refactoring to named exportSwitching to a named export is consistent with the broader refactoring effort in the codebase and improves maintainability.
29-40: Appropriate Button configurationThe
LinkButtonhas been properly replaced withButtonusing appropriate props (variant="link"andsize="none") to maintain the same visual appearance and functionality.
46-58: Consistent Button replacement patternThe replacement pattern is consistently applied to all instances of the
LinkButtoncomponent, maintaining the original functionality while using the standardized UI components.packages/project-builder-web/src/pages/features/auth/RoleEditorForm.tsx (3)
9-9: LGTM! Components updated correctly.The import statement now correctly includes
InputFieldfrom the@halfdomelabs/ui-componentslibrary as part of the larger refactoring effort.
33-38: LGTM! Component replaced properly.The
TextInput.LabelledControllerhas been successfully replaced withInputField.Controllerwhile maintaining the same props and functionality.
39-43: LGTM! Component replaced properly.The
TextInput.LabelledControllerfor the "Comment" field has been successfully replaced withInputField.Controllerwhile maintaining the same props and functionality.packages/project-builder-web/src/pages/apps/edit/admin/AdminEditSectionForm.tsx (5)
17-23: LGTM! Component imports updated correctly.The import statements have been updated to include all necessary components from the
@halfdomelabs/ui-componentslibrary, aligning with the PR objective of replacing deprecated components.
147-155: LGTM! LinkButton replaced with Button component.The
LinkButtonhas been correctly replaced withButtonusing appropriate props (variant="link"andsize="none") to maintain the same visual appearance and functionality.
157-157: LGTM! TextInput replaced with InputField.The
TextInput.LabelledControllerhas been successfully replaced withInputField.Controllerfor the "Name" field.
164-164: LGTM! TextInput replaced with InputField.The
TextInput.LabelledControllerhas been successfully replaced withInputField.Controllerfor the "Icon" field.
165-170: LGTM! SelectInput replaced with SelectField.The
SelectInput.LabelledControllerhas been successfully replaced withSelectField.Controllerfor the "Type" field, including the necessaryoptionsprop.packages/project-builder-web/src/pages/features/auth/index.tsx (5)
16-21: LGTM! Component imports updated correctly.The import statements have been updated to include all necessary components from the
@halfdomelabs/ui-componentslibrary, following the PR's refactoring objective.
135-167: LGTM! Alert component updated correctly.The
UiAlertcomponent has been successfully replaced with the newAlertcomponent from the UI library, using the appropriate subcomponents (Alert.TitleandAlert.Description) to maintain the same structure and functionality.
170-203: LGTM! Alert component updated correctly.The second instance of
UiAlertcomponent has been successfully replaced with the newAlertcomponent, maintaining consistent structure with the previous alert.
205-210: LGTM! CheckedInput replaced with CheckboxField.The
CheckedInput.LabelledControllerhas been correctly replaced withCheckboxField.Controllerfor the "Use Auth0?" checkbox, preserving all the original props.
235-239: LGTM! CheckedInput replaced with CheckboxField.The
CheckedInput.LabelledControllerhas been correctly replaced withCheckboxField.Controllerfor the "Enable Password Auth?" checkbox.packages/project-builder-web/src/pages/apps/edit/admin/crud/AdminCrudSectionForm.tsx (4)
6-6: LGTM! Component imports updated correctly.The import statement has been updated to include
CheckboxFieldandSelectFieldfrom the@halfdomelabs/ui-componentslibrary.
10-10: LGTM! Import path updated to use alias.The import for
EmbeddedListInputnow correctly uses the@src/componentsalias, which is consistent with the project's import structure.
53-58: LGTM! SelectInput replaced with SelectField.The
SelectInput.LabelledControllerhas been successfully replaced withSelectField.Controllerfor the "Model" field, including the necessary props.
59-63: LGTM! CheckedInput replaced with CheckboxField.The
CheckedInput.LabelledControllerhas been correctly replaced withCheckboxField.Controllerfor the "Disable Create?" checkbox.packages/project-builder-web/src/pages/apps/edit/admin/crud/CrudTableColumnsForm.tsx (5)
10-14: Import updates look good.The changes replace deprecated components with their counterparts from the UI components library and update the import path for CollapsibleRow to use the alias.
44-49: Component replacement is properly implemented.SelectInput.LabelledController has been correctly replaced with SelectField.Controller, maintaining all necessary props.
50-54: InputField properly replaces TextInput.The change from TextInput.LabelledController to InputField.Controller maintains the same interface with the required props.
57-63: SelectField implementation looks good.The SelectField.Controller replacement correctly preserves all the props from the original SelectInput component.
66-81: UI component replacements are consistently applied.All form fields in the foreign type condition have been properly updated to use the new component library, maintaining functionality.
packages/project-builder-web/src/pages/apps/edit/admin/AdminGeneralForm.tsx (3)
13-17: Import structure has been improved.The import statement now correctly pulls components from the UI components library, which aligns with the project's refactoring goals.
63-68: InputField replacement looks good.TextInput.LabelledController has been properly replaced with InputField.Controller, maintaining all necessary props.
70-76: MultiComboboxField correctly replaces CheckedArrayInput.The MultiComboboxField.Controller component is an appropriate replacement for CheckedArrayInput.LabelledController when dealing with multiple selectable options.
packages/project-builder-web/src/pages/apps/edit/BackendAppForm.tsx (3)
10-10: Import has been updated correctly.The import statement now pulls components from the UI components library instead of the deprecated project components.
42-47: Text field replacements look good.InputField.Controller properly replaces TextInput.LabelledController, maintaining the same interface and functionality.
48-82: Checkbox replacements are consistently applied.All CheckedInput.LabelledController components have been systematically replaced with CheckboxField.Controller, maintaining the same props and functionality throughout the form.
packages/project-builder-web/src/pages/apps/edit/admin/crud/CrudFormFieldsForm.tsx (2)
10-14: Import statements have been properly updated.The changes replace deprecated component imports with UI components library imports and update the CollapsibleRow import to use the alias.
66-76: Form field components have been properly replaced.Both SelectField.Controller and InputField.Controller are correctly implemented as replacements for their deprecated counterparts, maintaining the same props and functionality.
packages/project-builder-web/src/pages/apps/edit/admin/AdminSectionsForm.tsx (3)
5-5: Great update to UI component imports.The change from custom sidebar components to standardized UI components from
@halfdomelabs/ui-componentsaligns with the PR's objective of replacing deprecated components.
7-7: Approve import path change.Directly importing from 'react-router-dom' is cleaner than using a relative import.
29-67: Improved navigation structure with modern components.The refactoring from a custom Sidebar to SidebarLayout and NavigationMenu provides:
- Better semantic structure with proper list elements
- Clear separation between sidebar and content
- More maintainable component hierarchy
This implementation correctly uses the new UI component library pattern while maintaining the same functionality.
packages/project-builder-web/src/app/ProjectDefinitionProvider/ProjectDefinitionProvider.tsx (1)
25-29: Good import path standardization.Changing from relative imports (
src/...) to alias imports (@src/...) improves consistency across the codebase. This makes imports more maintainable and prevents path confusion when files are moved.packages/project-builder-web/src/components/EmbeddedListInput/EmbeddedListInput.tsx (6)
10-10: Good refactoring to standard UI components.Updating imports to use
@halfdomelabs/ui-componentsaligns with the PR's objective of replacing deprecated components with UI components.
40-40: Export style improvement.Changed from default export to named export, which is better for tree-shaking and more explicit imports.
71-72: Updated button size prop to new format.Changed from "small" to "sm" to match the new UI component library's size prop format.
92-93: Updated Alert component props.Changed from
type="info"tovariant="default"to match the new UI component library's prop structure.
94-111: Properly replaced Modal with Dialog component.Good refactoring that:
- Changes from
isOpentoopenprop- Adds
onOpenChangefor better state management- Updates component hierarchy to use Dialog.Content and Dialog.Header
- Maintains the same functionality with a more modern component structure
129-134: Improved form structure with FormItem components.The update to use FormItem.Label and FormItem.Error provides a more consistent pattern for form elements and improves accessibility.
packages/project-builder-web/src/components/index.ts (1)
3-10: Good export structure modernization.Switching to wildcard exports (
export * from) is more maintainable and provides a cleaner index file. This change properly exports the components that were refactored as part of the UI component upgrade.packages/project-builder-web/src/pages/apps/edit/admin/crud/AdminCrudEmbeddedForm.tsx (8)
4-26: Import refactoring looks good!The refactoring of imports aligns well with the PR objective. Notable improvements include:
- Adding
zPluginWrapperfor enhanced form schema validation- Switching to aliased imports (
@src/components) instead of relative paths- Using the toast system from ui-components for error handling
- Properly importing form-related hooks from react-hook-form
These changes make the code more maintainable and follow modern import practices.
41-49: Table component structure successfully updatedThe Table component structure has been properly updated to match the new UI component library conventions:
Table.Head→Table.HeaderTable.HeadRow→Table.RowTable.HeadCell→Table.HeadThis maintains the same visual structure while aligning with the new component API.
59-77: Button components properly replaced LinkButtonThe LinkButton components have been successfully replaced with the Button component from the UI library, using the appropriate semantic variants:
variant="link"for edit actionsvariant="destructiveLink"for remove actionsThis change improves consistency with the rest of the application and provides better semantic meaning.
99-103: Schema enhancement with plugin supportGood addition of the
zPluginWrapperto extend the form schema validation with plugin support. This allows for dynamic validation rules based on the current project configuration.
104-107: Form hook properly updatedThe change from the previous form hook to
useFormwith zodResolver is well implemented. This provides better type safety and validation using Zod schemas.
117-128: Form accessibility improved with unique IDGood use of
useId()to generate a unique form ID that connects the form element with its submit button. This improves accessibility and follows React best practices.
130-147: Form field components properly updatedThe form field components have been properly updated to use the new UI component library:
TextInput.LabelledController→InputField.ControllerSelectInput.LabelledController→SelectField.ControllerCheckedInput.LabelledController→CheckboxField.ControllerThese components provide better integration with react-hook-form and improved styling.
161-163: Submit button properly connected to formGood implementation of the submit button with proper form connection using the form ID. This follows accessibility best practices by allowing the button to be placed anywhere while still being associated with the form.
Summary by CodeRabbit
New Features
Refactor
Chores