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 {StyleSheet, TouchableOpacity, ViewStyle} from 'react-native'
9import {SafeAreaView} from 'react-native-safe-area-context'
10import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
11import {msg} from '@lingui/macro'
12import {useLingui} from '@lingui/react'
13
14import {createHitslop} from '#/lib/constants'
15
16type Props = {
17 onRequestClose: () => void
18}
19
20const HIT_SLOP = createHitslop(16)
21
22const ImageDefaultHeader = ({onRequestClose}: Props) => {
23 const {_} = useLingui()
24 return (
25 <SafeAreaView style={styles.root}>
26 <TouchableOpacity
27 style={[styles.closeButton, styles.blurredBackground]}
28 onPress={onRequestClose}
29 hitSlop={HIT_SLOP}
30 accessibilityRole="button"
31 accessibilityLabel={_(msg`Close image`)}
32 accessibilityHint={_(msg`Closes viewer for header image`)}
33 onAccessibilityEscape={onRequestClose}>
34 <FontAwesomeIcon icon="close" color={'#fff'} size={22} />
35 </TouchableOpacity>
36 </SafeAreaView>
37 )
38}
39
40const styles = StyleSheet.create({
41 root: {
42 alignItems: 'flex-end',
43 pointerEvents: 'box-none',
44 },
45 closeButton: {
46 marginRight: 10,
47 marginTop: 10,
48 width: 44,
49 height: 44,
50 alignItems: 'center',
51 justifyContent: 'center',
52 borderRadius: 22,
53 backgroundColor: '#00000077',
54 },
55 blurredBackground: {
56 backdropFilter: 'blur(10px)',
57 WebkitBackdropFilter: 'blur(10px)',
58 } as ViewStyle,
59})
60
61export default ImageDefaultHeader