src/components/camera/FlashButton.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

import React, {Dispatch, SetStateAction} from 'react';
import {Text, TouchableOpacity} from 'react-native';
import {FlashMode} from 'react-native-camera';
import FlashOffIcon from '../../assets/icons/camera/flash-off.svg';
import FlashOnIcon from '../../assets/icons/camera/flash-on.svg';
import {styles} from './styles';

interface FlashButtonProps {
  flashMode: keyof FlashMode;
  setFlashMode: Dispatch<SetStateAction<keyof FlashMode>>;
}

/*
 * Toggles between flash on/off modes
 */
export const FlashButton: React.FC<FlashButtonProps> = ({
  flashMode,
  setFlashMode,
}) => (
  <TouchableOpacity
    onPress={() => setFlashMode(flashMode === 'on' ? 'off' : 'on')}
    style={styles.flashButtonContainer}>
    {flashMode === 'on' ? (
      <FlashOnIcon
        height={30}
        width={20}
        color={'white'}
        style={styles.flashIcon}
      />
    ) : (
      <FlashOffIcon
        height={30}
        width={20}
        color={'white'}
        style={styles.flashIcon}
      />
    )}
    <Text style={styles.saveButtonLabel}>Flash</Text>
  </TouchableOpacity>
);

export default FlashButton;