on 6bcb9e8 help sign in
bridge/src/components/Header.js
54 lines 1.3 kB history raw
1import React from 'react'
2import { Button, Chevron } from '../components/Base'
4import { renderRoute } from '../lib/router'
5import { isLast } from '../lib/lib'
7const Crumbs = (props) => {
8 const { routeCrumbs, skipRoute } = props
9 const history = routeCrumbs.reverse()
11 // FIXME probably more straightforward to render them normally and just
12 // return the reversed array of renders
13 const rendered = history.map((route, idx) => {
15 return (
16 <div className={'flex items-center'} key={ `history-${idx}` }>
21 <Button
22 prop-type={'link'}
23 prop-size={'sm'}
24 key={ `history-button-${idx}` }
25 onClick={ () => skipRoute(history.size - idx - 1) }>
26 { `${renderRoute(props, route)}` }
27 </Button>
29 {
30 isLast(history.size, idx)
31 ? <div />
32 : <Chevron className={'h-4 mh-2'} />
33 }
36 </div>
37 )
38 })
40 return rendered
43const Header = (props) =>
44 <div className={'flex items-center h-10'}>
45 <Crumbs
46 routeCrumbs={ props.routeCrumbs }
47 skipRoute={ props.skipRoute }
48 networkType={ props.networkType }
49 wallet={ props.wallet }
50 pointCursor={ props.pointCursor }
51 />
52 </div>
54export default Header