import { defineStore } from 'pinia';
import { computed, ref } from 'vue';
import { KsVideoGroupService } from '../service/KsVideoGroupService';

export const KsVideoGroupStore = defineStore('ksvideogroup_store', () => {
    const lstKsVideoGroup = ref([]);
    const selectedKsVideoGroup = ref(null);

    async function fetchKsVideoGroup(projectId) {
        try {
            const response = await KsVideoGroupService.getKsVideoGroups(projectId);
            lstKsVideoGroup.value = response.data;
        } catch (error) {
            console.error('Error fetching video groups:', error);
        } finally {
        }
    }

    const ksVideoGroup = computed(() => {
        return lstKsVideoGroup.value;
    });

    const getSelectedKsVideoGroup = computed(() => {
        return selectedKsVideoGroup.value;
    });

    async function setSelectedKsVideoGroup(group) {
        selectedKsVideoGroup.value = group;
        console.log('selectedVideoGroup', selectedKsVideoGroup.value);
    }

    return {
        fetchKsVideoGroup,
        selectedKsVideoGroup,
        lstKsVideoGroup,
        ksVideoGroup,
        getSelectedKsVideoGroup,
        setSelectedKsVideoGroup
    };
});