git.iko.soy/bridge
on master help sign in
refactor: slight refactor of header component for best practices & clarity
0591411Matt Condon (shrugs)
src/bridge/components/Header.js+23−23
compare with master
unifiedsplit
@@ -9,29 +9,29 @@ import { isLast } from '../lib/lib';
9function Crumbs(props) {
9function Crumbs(props) {
10 const history = useHistory();
10 const history = useHistory();
11
11
12− // FIXME probably more straightforward to render them normally and just
12+ return (
13− // return the reversed array of renders
13+ <>
14− const rendered = history.routes.map((route, idx) => {
14+ {history.routes.map((route, idx) => {
15− return (
15+ return (
16− <div className={'flex items-center'} key={`history-${idx}`}>
16+ <div key={`history-${idx}`} className={'flex items-center'}>
17− <Button
17+ <Button
18− prop-type={'link'}
18+ prop-type={'link'}
19− prop-size={'sm'}
19+ prop-size={'sm'}
20− key={`history-button-${idx}`}
20+ key={`history-button-${idx}`}
21− onClick={() => history.pop(history.size - idx - 1)}>
21+ onClick={() => history.pop(history.size - idx - 1)}>
22− {getRouteBreadcrumb(props, route)}
22+ {getRouteBreadcrumb(props, route)}
23− </Button>
23+ </Button>
24−
24+
25− {isLast(history.size, idx) ? (
25+ {isLast(history.size, idx) ? (
26− <div />
26+ <div />
27− ) : (
27+ ) : (
28− <Chevron className={'h-4 mh-2'} />
28+ <Chevron className={'h-4 mh-2'} />
29− )}
29+ )}
30− </div>
30+ </div>
31− );
31+ );
32− });
32+ })}
33−
33+ </>
34− return rendered;
34+ );
35}
35}
36
36
37function Header(props) {
37function Header(props) {