import { View, Text, Image, TouchableOpacity } from "react-native";
import { SimpleSwitch } from "./SimpleSwitch";
export const TripleSwitchArea = ({
  str,
  bool,
  setBool,
  firstItem: { firstImage, firstText, firstValue },
  secondItem: { secondImage, secondText, secondValue },
  thirdItem: { thirdImage, thirdText, thirdValue },
}) => {
  return (
    <View style={{ flexDirection: "column", padding: 10 }}>
      <Text
        style={{
          fontSize: 20,
          alignItems: "center",
          alignContent: "center",
          textAlign: "center",
          textAlignVertical: "center",
        }}
      >
        {str}
      </Text>
      <View style={{ flexDirection: "row", padding: 10 }}>
        <SimpleSwitch
          bool={bool}
          setBool={setBool}
          color="red"
          value={firstValue}
          image={firstImage}
          subText={firstText}
        />
        <SimpleSwitch
          bool={bool}
          setBool={setBool}
          color="red"
          value={secondValue}
          image={secondImage}
          subText={secondText}
        />
        <SimpleSwitch
          bool={bool}
          setBool={setBool}
          color="red"
          value={thirdValue}
          image={thirdImage}
          subText={thirdText}
        />
      </View>
    </View>
  );
};