import React, { useCallback } from "react";
import { BlurView } from "expo-blur";
import { Pressable } from "react-native";
import { Entypo } from "@expo/vector-icons";
import { openShareSheet } from "../../utils/shareSheet";

export default function ShareBtn({ style, onPress = null }) {
  const handlePress = useCallback(() => {
    if (typeof onPress === "function") {
      onPress();
      return;
    }

    openShareSheet();
  }, [onPress]);

  return (
    <Pressable
      onPress={handlePress}
      style={{
        ...style,
      }}
    >
      <BlurView
        intensity={20}
        tint="dark"
        style={{
          padding: 12,
          borderRadius: 15,
          overflow: "hidden",
          flexDirection: "row",
          alignItems: "center",
          justifyContent: "center",
        }}
      >
        <Entypo name="share-alternative" size={18} color="white" />
      </BlurView>
    </Pressable>
  );
}