@@ -8,8 +8,6 @@ import MiniBackButton from './MiniBackButton';
88import { useHistory } from 'store/history';
99import NavHeader from './NavHeader';
1010
11−const EXPECT_LOGOUT_WHEN_POPPING_AT_DEPTH = 2;
12−
1311// View is a top-level component that all Views must render to inherit styling
1412function View({
1513 className,
@@ -19,7 +17,7 @@ function View({
1917 pop,
2018 ...rest
2119}) {
22− const { size } = useHistory();
20+ const { reset } = useHistory();
2321 const isMobile = useBreakpoints([true, false, false]);
2422 const shouldInset = inset && !isMobile;
2523
@@ -30,17 +28,19 @@ function View({
3028
3129 const goBack = useCallback(() => pop(), [pop]);
3230
33− const goLogout = useCallback(() => pop(size - 1), [pop, size]);
31+ const goLogout = reset;
3432
35− const showBackButton = size > 1 && !!pop;
36− const backIsLogout = size === EXPECT_LOGOUT_WHEN_POPPING_AT_DEPTH;
33+ const showBackButton = !!pop;
3734
3835 const Header = useCallback(
3936 ({ logout }) => {
4037 return showBackButton ? (
4138 <Flex.Item
4239 as={Flex}
43− className={cn(insetPadding, 'flex-row-r justify-between pb5')}>
40+ className={cn(
41+ insetPadding,
42+ 'flex-row-r justify-between pb5 align-center'
43+ )}>
4444 <Flex.Item
4545 onClick={goLogout}
4646 as="a"
@@ -75,12 +75,12 @@ function View({
7575 col
7676 style={{ width: '48px' }}
7777 className={cn(insetPadding)}>
78− {showBackButton && !backIsLogout && (
78+ {showBackButton && (
7979 <MiniBackButton
8080 hpadding={!isMobile}
8181 vpadding={isMobile}
82− isExit={backIsLogout}
8382 onClick={goBack}
83+ className="mt2"
8484 />
8585 )}
8686 </Flex.Item>