import React from "react";
import { Pressable, Text, ViewStyle } from "react-native";
import { useTheme } from "../../contexts/ThemeContext";

interface IconButtonProps {
  onPress: () => void;
  label: string;
  size?: number;
  style?: ViewStyle;
}

export function IconButton({
  onPress,
  label,
  size = 24,
}: IconButtonProps) {
  const { colors } = useTheme();

  return (
    <Pressable
      onPress={onPress}
      style={{ width: size, height: size, alignItems: "center", justifyContent: "center" }}
      hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}
    >
      <Text style={{ color: colors.textSecondary, fontSize: size * 0.7 }}>
        {label}
      </Text>
    </Pressable>
  );
}