import type {
  DataCollectionItemBase,
  ProjectsCollectionItem,
} from "@nuxt/content";
import gsap from "gsap";

export const useProjectsStore = defineStore("projects", {
  state: () => ({
    projects: [] as (Omit<
      ProjectsCollectionItem,
      keyof DataCollectionItemBase
    > & { id: string })[],
    currentProject: 0,
    loading: true,
    offsetX: 0,
  }),

  actions: {
    async loadProjects() {
      this.loading = true;

      const { data: projects } = await useAsyncData("projects", () =>
        queryCollection("projects")
          .order("order", "ASC")
          .select(
            "id",
            "order",
            "scope",
            "title",
            "link",
            "description",
            "summary",
            "technologies",
            "tasks",
          )
          .all(),
      );
      if (!projects.value) throw "Cannot load projects";
      this.projects = projects.value.map((project) => ({
        ...project,
        id: project.id.split("/")[2]!,
      }));

      console.log(this.projects);

      this.loading = false;
    },

    visitProject() {
      const link = this.projects[this.currentProject]?.link;
      if (link) navigateTo(link, { open: { target: "_blank" } });
    },

    scrollProjects(direction: "left" | "right") {
      let offset = 0;

      if (
        direction === "right" &&
        this.currentProject < this.projects.length - 1
      ) {
        this.currentProject += 1;
        offset = 69;
      } else if (direction === "left" && this.currentProject > 0) {
        this.currentProject -= 1;
        offset = -69;
      }

      if (offset !== 0) {
        gsap.fromTo(
          this,
          { offsetX: offset },
          {
            offsetX: 0,
            duration: 0.1,
            ease: "none",
          },
        );
      }
    },

    // TODO: not used anymore
    scrollToProject(index: number) {
      if (index === this.currentProject) return;

      const offset = (index - this.currentProject) * 69;
      this.currentProject = index;

      gsap.fromTo(
        this,
        { offsetX: offset },
        {
          offsetX: 0,
          duration: 0.1,
          ease: "none",
        },
      );
    },
  },
});