import { View, Text } from "react-native";
import React from "react";
import AppActionSheet from "../AppActionSheet";
import { Palette } from "../../styles";
import { FONT_FAMILY } from "../../styles/Fonts";
import BorderGradientButton from "../BorderGradientButton";
import GradientButton from "../GradientButton";
import { SheetManager } from "react-native-actions-sheet";

const DeleteAudioModal = () => {
  const onClose = () => {
    SheetManager.hide("DeleteAudio");
  };

  return (
    <AppActionSheet id="DeleteAudio">
      <View style={{ gap: 20 }}>
        <View style={{ gap: 2 }}>
          <Text
            style={{
              fontSize: 20,
              color: Palette.white,
              fontFamily: FONT_FAMILY.HelveticaNeueMedium,
              textAlign: "center",
            }}
          >
            Supprimer mon audio
          </Text>
          <Text
            style={{
              fontSize: 16,
              color: Palette.white,
              fontFamily: FONT_FAMILY.HelveticaNeueRegular,
              textAlign: "center",
            }}
          >
            Es-tu sur de vouloir supprimer ton audio?{"\n"}
            Attention, cette action est irréversible!
          </Text>
        </View>
        <View style={{ width: "80%", alignSelf: "center", gap: 12 }}>
          <BorderGradientButton title="Oui, supprimer" onPress={onClose} />
          <GradientButton title="Non, annuler" onPress={onClose} />
        </View>
      </View>
    </AppActionSheet>
  );
};

export default DeleteAudioModal;
