import React from 'react';
import {Pressable} from 'react-native';
import {useTranslation} from 'react-i18next';
import {useCameraPermission} from 'react-native-vision-camera';
import {useDispatch} from 'react-redux';
import {useNavigation} from '@react-navigation/native';
import {IconAccessPoint} from '@tabler/icons-react-native';
import {Button} from '@components';
import Icon from '@components/Icon';
import {showSettingsDialog} from '@modules/app/redux';
import {GettingReadyType} from '@modules/commons/interfaces';
import {COLORS} from '@shared/colors';
import {Screens} from '@shared/constants';
import {useTheme} from '@shared/theme';

import {styles} from './styles';

interface Props {
  type: GettingReadyType;
  onPress?: () => void;
}

function InactiveFeatureButton({type, onPress: onPressProp}: Props) {
  const {t} = useTranslation();
  const dispatch = useDispatch();
  const navigation = useNavigation();
  const {theme} = useTheme();
  const {hasPermission, requestPermission} = useCameraPermission();
  const isAudioCall = type === GettingReadyType.AudioCall;

  const onNavigate = () => navigation.navigate(Screens.GETTING_READY, {type});

  const onPress = async () => {
    onPressProp?.();
    if (isAudioCall || hasPermission) {
      onNavigate();
    } else {
      const granted = await requestPermission();
      if (granted) {
        onNavigate();
      } else {
        dispatch(
          showSettingsDialog({
            text: t('post.no_camera_permission_error'),
          }),
        );
      }
    }
  };

  return type === GettingReadyType.Streaming ? (
    <Button
      IconLeft={IconAccessPoint}
      size="sm"
      variant="secondary"
      text={t('livestream.start_stream')}
      onPress={onPress}
      style={[styles.featureButton, {borderColor: theme.border.neutral.brand}]}
    />
  ) : (
    <Pressable onPress={onPress} hitSlop={8}>
      <Icon
        name={isAudioCall ? 'call' : 'videocam'}
        size="md"
        color={COLORS.GRAY_TWENTY_EIGHT}
      />
    </Pressable>
  );
}

export default InactiveFeatureButton;