1import { Button, Heading, Row, Spacer, View } from 'expo-dev-client-components';
2import * as React from 'react';
3
4import { BaseModal } from './BaseModal';
5
6export function LogoutConfirmationModal({ onLogoutPress, onClosePress }) {
7  return (
8    <BaseModal title="Confirm logout">
9      <Heading weight="medium">Are you sure you want to log out?</Heading>
10
11      <Spacer.Vertical size="medium" />
12
13      <Row>
14        <View flex="1" grow="1">
15          <Button.FadeOnPressContainer
16            bg="tertiary"
17            rounded="medium"
18            onPress={onLogoutPress}
19            accessibilityLabel="Log out">
20            <View padding="small" rounded="medium">
21              <Button.Text color="tertiary" weight="bold" align="center">
22                Log Out
23              </Button.Text>
24            </View>
25          </Button.FadeOnPressContainer>
26        </View>
27
28        <Spacer.Horizontal size="medium" />
29
30        <View flex="1" grow="1">
31          <Button.FadeOnPressContainer
32            bg="ghost"
33            border="ghost"
34            rounded="medium"
35            onPress={onClosePress}>
36            <View padding="small" rounded="medium">
37              <Button.Text color="ghost" weight="bold" align="center">
38                Nevermind
39              </Button.Text>
40            </View>
41          </Button.FadeOnPressContainer>
42        </View>
43      </Row>
44    </BaseModal>
45  );
46}
47