mirror of https://git.lenooby09.tech/LeNooby09/social-app.git
lenooby09.tech
1import React from 'react'
2import {StyleSheet, View} from 'react-native'
3import {
4 FontAwesomeIcon,
5 FontAwesomeIconStyle,
6} from '@fortawesome/react-native-fontawesome'
7import {IconProp} from '@fortawesome/fontawesome-svg-core'
8import {Text} from './text/Text'
9import {Button} from './forms/Button'
10import {usePalette} from 'lib/hooks/usePalette'
11import {s} from 'lib/styles'
12
13interface Props {
14 testID?: string
15 icon: IconProp
16 message: string
17 buttonLabel: string
18 onPress: () => void
19}
20
21export function EmptyStateWithButton(props: Props) {
22 const pal = usePalette('default')
23 const palInverted = usePalette('inverted')
24
25 return (
26 <View testID={props.testID} style={styles.container}>
27 <View style={styles.iconContainer}>
28 <FontAwesomeIcon
29 icon={props.icon}
30 style={[styles.icon, pal.text]}
31 size={62}
32 />
33 </View>
34 <Text type="xl-medium" style={[s.textCenter, pal.text]}>
35 {props.message}
36 </Text>
37 <View style={styles.btns}>
38 <Button
39 testID={props.testID ? `${props.testID}-button` : undefined}
40 type="inverted"
41 style={styles.btn}
42 onPress={props.onPress}>
43 <FontAwesomeIcon
44 icon="plus"
45 style={palInverted.text as FontAwesomeIconStyle}
46 size={14}
47 />
48 <Text type="lg-medium" style={palInverted.text}>
49 {props.buttonLabel}
50 </Text>
51 </Button>
52 </View>
53 </View>
54 )
55}
56const styles = StyleSheet.create({
57 container: {
58 height: '100%',
59 paddingVertical: 40,
60 paddingHorizontal: 30,
61 },
62 iconContainer: {
63 marginBottom: 16,
64 },
65 icon: {
66 marginLeft: 'auto',
67 marginRight: 'auto',
68 },
69 btns: {
70 flexDirection: 'row',
71 justifyContent: 'center',
72 },
73 btn: {
74 gap: 10,
75 marginVertical: 20,
76 flexDirection: 'row',
77 alignItems: 'center',
78 paddingVertical: 14,
79 paddingHorizontal: 24,
80 borderRadius: 30,
81 },
82 notice: {
83 borderRadius: 12,
84 paddingHorizontal: 12,
85 paddingVertical: 10,
86 marginHorizontal: 30,
87 },
88})