Remove react-bootstrap dependency from `Form` component
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 140
- Forks
- 100
- Avg merge
- 1h 3m
- Merged PRs (30d)
- 30
Description
This issue has the same rationale as #2484, i.e. we extend Form component when we really shouldn't be doing that anymore. However, this task is a bit more complicated as some of the consumers use react-bootstrap's Form API instead of Paragon's, we'll need to address that too in order not to make a breaking change. Judging by the list of compound components that react-bootstrap's Form has, Paragon currently does not provide the following
Form.Row, which is used by consumers and is present on our docs site, we'll need to implement our own version of this componentForm.Check, which is replaced by ourForm.Checkbox, but is still available and used by consumers, we'll need to updated consuming MFEs to useForm.CheckboxinsteadForm.File, I don't see it being used by consumers and it is not present on our docs site, should be safe to remove
### Tasks
- [ ] Implement `FormRow` component that has the same functionality as react-bootstrap's `Form.Row`, make it available as a standalone export under `FormRow` name and as a compound component `Form.Row`
- [ ] Open PRs to consuming MFEs that replace `Form.Check` usage with `Form.Checkbox`, validate that this does not break the UI. (you can use this [link](https://github.com/search?q=org%3Aopenedx%20Form.Check&type=code) to find usages of `Form.Check` across consuming MFEs)
- [ ] Implement our own `Form` component that behaves the same way as react-bootstrap's one and replace usages of react-bootstrap's `Form` with newly created component
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.
Research direction
Start by reviewing Paragon's existing Form component and the react-bootstrap Form compound-component list linked in the issue, then search consuming MFEs for Form.Check usages. Done means FormRow is available as both a standalone export and Form.Row, consumers use Form.Checkbox, and Paragon's Form replaces react-bootstrap's Form without breaking those consumers.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- developer-experience, frontend
- Issue type
- Refactor
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 25/100