import { defineStore } from "pinia";
import { ref, watch } from "vue";
import { usePageStore } from "./page";

export const useVirtualSampleStore = defineStore("virtual-sample", () => {
  const { page } = usePageStore();
  const step = page.steps.find((step) => step.id === "virtualSample");
  const isCompareModeEnabled = ref(false);

  const activeTab = ref(step.files.dynamic ? "dynamic" : "static");
  const currentFile = ref(null);
  const isLoopAnimationEnabled = ref(false);

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

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