-
Notifications
You must be signed in to change notification settings - Fork 53
Studio: Refactor CreateSiteForm to reduce props drilling #2309
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: trunk
Are you sure you want to change the base?
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull request overview
This PR refactors the CreateSiteForm component to manage its own state internally instead of receiving numerous value and setter props, reducing props drilling. The form now accepts defaultValues for initialization and an onSubmit callback that receives all form values, simplifying the component hierarchy and data flow.
Key Changes
- The
CreateSiteFormnow owns its form state internally (site name, path, PHP/WP versions, custom domain settings) instead of relying on lifted state - The
useAddSitehook has been restructured to expose path validation functions (selectPath,generateProposedPath) and a site creation function (handleCreateSite) instead of managing form state - The form submission mechanism now uses native form submission with a form ID, allowing the stepper's "Add site" button to submit the form via the
formattribute
Reviewed changes
Copilot reviewed 8 out of 8 changed files in this pull request and generated 8 comments.
Show a summary per file
| File | Description |
|---|---|
| src/modules/add-site/index.tsx | Refactored to pass defaultValues and callback functions to CreateSite instead of managing form state; added logic to build default values with blueprint preferred versions |
| src/modules/add-site/components/create-site.tsx | Updated props interface to accept defaultValues and callbacks instead of individual state values and setters |
| src/modules/add-site/components/create-site-form.tsx | Major refactor to internalize form state management; now accepts defaultValues for initialization and onSubmit callback that receives complete form values |
| src/modules/add-site/components/stepper.tsx | Modified action button to use native form submission with createFormId for create paths instead of onClick handler |
| src/modules/add-site/hooks/use-stepper.ts | Added isCreatePath boolean to identify when the form is on a create path |
| src/modules/add-site/components/index.ts | Added exports for new types: CreateSiteFormValues, CreateSiteFormProps, and PathValidationResult |
| src/hooks/use-add-site.ts | Significantly refactored to remove form state management and expose path validation and site creation functions instead; added type definitions for CreateSiteFormValues and PathValidationResult |
| src/hooks/tests/use-add-site.test.tsx | Updated tests to work with new API that uses handleCreateSite with form values instead of individual setters |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
…r-create-site-form
📊 Performance Test ResultsComparing 5e677bd vs trunk site-editor
site-startup
Results are median values from multiple test runs. Legend: 🟢 Improvement (faster) | 🔴 Regression (slower) | ⚪ No change |
Related issues
Closes STU-1099
Proposed Changes
This PR refactors
CreateSiteFormto takefeaturesprop and anonSubmitprop instead of all the value and setter props that it currently does.Testing Instructions
npm startAdd sitein the sidebarPre-merge Checklist