mirror of https://git.lenooby09.tech/LeNooby09/social-app.git
lenooby09.tech
1/**
2 * Copyright (c) JOB TODAY S.A. and its affiliates.
3 *
4 * This source code is licensed under the MIT license found in the
5 * LICENSE file in the root directory of this source tree.
6 *
7 */
8import {
9 SafeAreaView,
10 StyleSheet,
11 TouchableOpacity,
12 ViewStyle,
13} from 'react-native'
14import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
15import {msg} from '@lingui/macro'
16import {useLingui} from '@lingui/react'
17
18import {createHitslop} from '#/lib/constants'
19
20type Props = {
21 onRequestClose: () => void
22}
23
24const HIT_SLOP = createHitslop(16)
25
26const ImageDefaultHeader = ({onRequestClose}: Props) => {
27 const {_} = useLingui()
28 return (
29 <SafeAreaView style={styles.root}>
30 <TouchableOpacity
31 style={[styles.closeButton, styles.blurredBackground]}
32 onPress={onRequestClose}
33 hitSlop={HIT_SLOP}
34 accessibilityRole="button"
35 accessibilityLabel={_(msg`Close image`)}
36 accessibilityHint={_(msg`Closes viewer for header image`)}
37 onAccessibilityEscape={onRequestClose}>
38 <FontAwesomeIcon icon="close" color={'#fff'} size={22} />
39 </TouchableOpacity>
40 </SafeAreaView>
41 )
42}
43
44const styles = StyleSheet.create({
45 root: {
46 alignItems: 'flex-end',
47 pointerEvents: 'box-none',
48 },
49 closeButton: {
50 marginRight: 10,
51 marginTop: 10,
52 width: 44,
53 height: 44,
54 alignItems: 'center',
55 justifyContent: 'center',
56 borderRadius: 22,
57 backgroundColor: '#00000077',
58 },
59 blurredBackground: {
60 backdropFilter: 'blur(10px)',
61 WebkitBackdropFilter: 'blur(10px)',
62 } as ViewStyle,
63})
64
65export default ImageDefaultHeader