import { Text, View } from "react-native";
import { TouchableOpacity } from "react-native";
import { AppContext, IsPlatformIos } from "../../utils";
import { useContext } from "react";
import MyIcon from "../Icon";

export default function MyDropdown({ label, onPress, selectedItemLabel }) {
  const appContext = useContext(AppContext);

  return (
    <TouchableOpacity onPress={() => onPress()}>
      <View
        style={[
          {
            flexDirection: "row",
            alignItems: "center",
            justifyContent: "space-between",
          },
          //IsPlatformIos() && { marginBottom: 10 },
        ]}
      >
        <View>
          <Text style={{ color: appContext.appTheme.text }}>{label}</Text>
          <Text style={{ color: appContext.appTheme.colors.primary }}>
            {selectedItemLabel}
          </Text>
        </View>
        <MyIcon
          name="chevron-down"
          size={24}
          color={appContext.appTheme.icon}
        />
      </View>
    </TouchableOpacity>
  );
}
