This repository has been archived by the owner on Jun 24, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 106
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Moving the ExposureHistory to its own navigator and folder (#1554)
* move the recent exposures screen to its own folder * split out NoExposureHistoryScreen * put the exposure history pages in their own navigation stack * changed toolbar * reverted change for testing * renamed Toolbar2
- Loading branch information
Showing
10 changed files
with
147 additions
and
121 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,78 @@ | ||
import React, {useCallback} from 'react'; | ||
import {StyleSheet, TouchableOpacity} from 'react-native'; | ||
import {useI18n} from 'locale'; | ||
import {CombinedExposureHistoryData} from 'shared/qr'; | ||
import {useNavigation} from '@react-navigation/native'; | ||
import {Box, Text, Icon} from 'components'; | ||
import {formatExposedDate} from 'shared/date-fns'; | ||
|
||
export const ExposureList = ({exposureHistoryData}: {exposureHistoryData: CombinedExposureHistoryData[]}) => { | ||
const i18n = useI18n(); | ||
const dateLocale = i18n.locale === 'fr' ? 'fr-CA' : 'en-CA'; | ||
const navigation = useNavigation(); | ||
const onDetails = useCallback( | ||
({id, exposureType}) => navigation.navigate('RecentExposureScreen', {id, exposureType}), | ||
[navigation], | ||
); | ||
|
||
return ( | ||
<> | ||
{exposureHistoryData.map((item, index) => { | ||
return ( | ||
<Box key={item.timestamp}> | ||
<Box backgroundColor="gray5" style={styles.radius}> | ||
<Box paddingHorizontal="m" style={[exposureHistoryData.length !== index + 1 && styles.bottomBorder]}> | ||
<TouchableOpacity | ||
style={styles.chevronIcon} | ||
onPress={() => { | ||
onDetails({id: `${item.id}-${item.timestamp}`, exposureType: item.type}); | ||
}} | ||
> | ||
<Box paddingVertical="m" style={styles.exposureList}> | ||
<Box style={styles.typeIconBox}> | ||
<Icon size={20} name={item.type === 'proximity' ? 'exposure-proximity' : 'exposure-outbreak'} /> | ||
</Box> | ||
<Box style={styles.boxFlex}> | ||
<Text fontWeight="bold">{formatExposedDate(new Date(item.timestamp), dateLocale)}</Text> | ||
<Text>{item.subtitle}</Text> | ||
</Box> | ||
<Box style={styles.chevronIconBox}> | ||
<Icon size={30} name="icon-chevron" /> | ||
</Box> | ||
</Box> | ||
</TouchableOpacity> | ||
</Box> | ||
</Box> | ||
</Box> | ||
); | ||
})} | ||
</> | ||
); | ||
}; | ||
|
||
const styles = StyleSheet.create({ | ||
bottomBorder: { | ||
borderBottomColor: '#8a8a8a', | ||
borderBottomWidth: 1, | ||
}, | ||
radius: { | ||
borderRadius: 10, | ||
}, | ||
exposureList: { | ||
flexDirection: 'row', | ||
}, | ||
boxFlex: { | ||
flex: 4, | ||
}, | ||
chevronIcon: { | ||
alignItems: 'flex-end', | ||
}, | ||
chevronIconBox: { | ||
flex: 1, | ||
justifyContent: 'center', | ||
}, | ||
typeIconBox: { | ||
flex: 1, | ||
justifyContent: 'center', | ||
}, | ||
}); |
24 changes: 24 additions & 0 deletions
24
src/screens/exposureHistory/views/NoExposureHistoryScreen.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
import React from 'react'; | ||
import {StyleSheet} from 'react-native'; | ||
import {useI18n} from 'locale'; | ||
import {Box, Text, Icon} from 'components'; | ||
|
||
export const NoExposureHistoryScreen = () => { | ||
const i18n = useI18n(); | ||
|
||
return ( | ||
<Box style={styles.noExposureHistoryScreen} marginTop="xl"> | ||
<Icon height={120} width={150} name="exposure-history-thumb" /> | ||
<Text paddingTop="s" fontWeight="bold"> | ||
{i18n.translate('ExposureHistory.NoExposures')} | ||
</Text> | ||
</Box> | ||
); | ||
}; | ||
|
||
const styles = StyleSheet.create({ | ||
noExposureHistoryScreen: { | ||
flex: 1, | ||
alignItems: 'center', | ||
}, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.