deps: react-bootstrap 0.31 -> 2 (Bootstrap 5 CSS deferred as debt)

Removes the largest batch of React-19-blocking warnings: the 0.31
components (Grid, FormGroup, ControlLabel, Navbar.Header/Brand, Checkbox,
SafeAnchor) all leaned on legacy context / defaultProps.

29 files converted: Grid->Container, FormGroup/ControlLabel/FormControl/
HelpBlock -> Form.Group/Label/Control/Text, Checkbox -> Form.Check (label
as prop), bsStyle->variant (default->secondary), bsSize->size,
pull-right->float-end. Custom Col.js now re-exports v2's Col; custom
NavItem.js rewritten self-contained (no SafeAnchor/createChainedFunction);
Navigation.js drops react-bootstrap Navbar (raw markup anyway).

CSS stays on Bootstrap 4 (alexwine:bootstrap-4) for now: the BS4->5 jump
is entangled with the jQuery carousel/swipe + navbar-collapse and is
tracked as separate debt in UPGRADE.md. Only .form-label needed a shim
(forms.scss). Browser-verified home carousel+navbar, signup form + terms
checkbox, login form; REST smoke byte-identical.
This commit is contained in:
vjrj 2026-07-21 12:44:46 +02:00
parent 12bdbe8fed
commit a1a1b9a801
30 changed files with 539 additions and 333 deletions

View file

@ -27,7 +27,7 @@ const Documents = ({ loading, documents, match, history }) => (!loading ? (
<div className="Documents">
<div className="page-header clearfix">
<h4 className="pull-left">Documents</h4>
<Link className="btn btn-success pull-right" to={`${match.url}/new`}>Add Document</Link>
<Link className="btn btn-success float-end" to={`${match.url}/new`}>Add Document</Link>
</div>
{documents.length ? <Table responsive>
<thead>
@ -47,14 +47,14 @@ const Documents = ({ loading, documents, match, history }) => (!loading ? (
<td>{monthDayYearAtTime(createdAt)}</td>
<td>
<Button
bsStyle="primary"
variant="primary"
onClick={() => history.push(`${match.url}/${_id}`)}
block
>View</Button>
</td>
<td>
<Button
bsStyle="danger"
variant="danger"
onClick={() => handleRemove(_id)}
block
>Delete</Button>
@ -62,7 +62,7 @@ const Documents = ({ loading, documents, match, history }) => (!loading ? (
</tr>
))}
</tbody>
</Table> : <Alert bsStyle="warning">No documents yet!</Alert>}
</Table> : <Alert variant="warning">No documents yet!</Alert>}
</div>
) : <Loading />);