import { useContext } from "react";
import {
  AppContext,
  DevDeviceId,
  NewEmptyDeviceScene,
} from "../../../../../utils";
import { FlatList, View } from "react-native";
import { MyPickerModalListItem } from "../../../../../Components/Modal";

export default function CreateSceneModalContent({ closeChooseSceneModals }) {
  const appContext = useContext(AppContext);

  const options = [
    {
      id: 0,
      name: "Leere Szene erstellen",
    },
    {
      id: 1,
      name: "Standard Szene erstellen",
    },
    {
      id: 2,
      name: "Vorhandene Szene kopieren",
    },
  ];

  return (
    <FlatList
      data={options}
      keyExtractor={(item) => item.id}
      renderItem={({ item }) => (
        <MyPickerModalListItem
          itemName={item.name}
          onPress={() => {
            console.log("pressed", item);

            appContext.setDevices((arr) => {
              const newArr = [...arr];

              newArr[arr.findIndex((d) => d.id === DevDeviceId)].scenes.push(
                NewEmptyDeviceScene()
              );

              return newArr;
            });

            closeChooseSceneModals();
          }}
        />
      )}
    />
  );
}
