Convert `Modal`s with forms in them to `ModalForm`
Nobody has claimed this yet.
Assessment
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Newbie friendliness
- 68/100
- Issue type
- Refactor
- Clarity
- Mostly clear
- Activity status
- Quiet
- Tech stack
- typescript
- Domain
- frontend
Research direction
Start by reading the existing ModalForm usage in the side-modal forms, then inspect the seven listed candidate files at their referenced locations. Convert only the form-submission modals, preserving the listed exclusions; done means the candidates use ModalForm with inline errors and submit loading feedback, with the checklist updated.
Written by the indexing model from the issue text.
Description
Follow-up to #3192 and #3197. These modals use raw Modal + Modal.Footer + useApiMutation with onError → addToast. Converting to ModalForm gives them inline submit errors and a loading spinner on the submit button, matching the side-modal forms.
Candidates for ModalForm
-
ResizeInstanceModal—app/pages/project/instances/InstancePage.tsx:274. Has an inline<p className="text-error">at :389 that the shell replaces. -
SiloSubnetPoolsTabLink pool —app/pages/system/silos/SiloSubnetPoolsTab.tsx:297 -
SiloIpPoolsTabLink pool —app/pages/system/silos/SiloIpPoolsTab.tsx:311 -
IpPoolPageLink silo —app/pages/system/networking/IpPoolPage.tsx:493 -
SubnetPoolPageLink silo —app/pages/system/networking/SubnetPoolPage.tsx:475 -
AntiAffinityCardAdd member —app/pages/project/instances/AntiAffinityCard.tsx:241 -
anti-affinity-group-member-addAdd instance —app/forms/anti-affinity-group-member-add.tsx:67
ModalForm hardcodes <Message title="Error"> inline — simplest to drop the custom titles, matching #3197. Or we could add the ability to pass a custom error title.
Doesn't fit — not form submissions
These have no inputs and would need a throwaway useForm just to satisfy ModalForm's signature:
SiloScimTabCreate token —app/pages/system/silos/SiloScimTab.tsx:220. Informational body; Create fires the mutation andonSuccesshands the token to a second modal.ImagesPagePromote image —app/pages/project/images/ImagesPage.tsx:189. "Are you sure you want to promote X?"
Leave as-is or refactor toward confirmAction.
- Dominant language
- TypeScript
- Stars
- 228
- Forks
- 22
- Avg merge
- 19h 42m
- Merged PRs (30d)
- 32
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from oxidecomputer/console
-
Disks: Disable 'Size' field when selecting 'Make disk read-only' and 'Image'/'Snapshot' as a source Open
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
oxidecomputer/console#3391 · 1 comment ·
-
Alerting > Receivers: Error message for subscriptions gets hidden by empty dropdown when zoomed out Open
Difficulty 2/5 1-3 hours Newbie friendliness 68/100
oxidecomputer/console#3390 ·
-
Difficulty 2/5 Half a day Newbie friendliness 72/100
oxidecomputer/console#3375 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 65/100
oxidecomputer/console#3338 · 1 comment ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
oxidecomputer/console#3327 · 2 comments ·
All issues in oxidecomputer/console
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 65/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
-
bug v2
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
modelcontextprotocol/inspector#2458 · 1 comment ·
-
Difficulty 1/5 Under an hour Newbie friendliness 75/100
railmapgen/rmp-gallery#4068 ·
-
Mend: dependency security vulnerability status: needs triage 🕵️♀️
Difficulty 2/5 1-3 hours Newbie friendliness 70/100
carbon-design-system/ibm-products#9907 ·