import { defineStore, storeToRefs } from 'pinia';
import { ref, computed, watch } from 'vue';
import { usePageStore } from './page';
import { useDialogStore } from './dialog';

export const useVirtualSampleStore = defineStore('virtual-sample', () => {
  const { page } = storeToRefs(usePageStore());
  const { openedFile } = storeToRefs(useDialogStore());

  const isCompareModeEnabled = ref(false);
  const currentFile = ref(null);
  const isLoopAnimationEnabled = ref(false);
  const isDownloadTriggered = ref(false);

  const step = computed(() => {
    return page.value.steps.find((step) => step.id === 'virtualSample');
  });

  const activeTab = computed(() =>
    step.value.files.dynamic ? 'dynamic' : 'static'
  );

  const allVariations = computed(() =>
    Object.values(step.value.files?.dynamic).flat(1)
  );

  watch(activeTab, () => (currentFile.value = null));

  return {
    activeTab,
    currentFile,
    step,
    allVariations,
    isLoopAnimationEnabled,
    isCompareModeEnabled,
    isDownloadTriggered,
  };
});