designtopack/src/stores/api.js

import { defineStore } from "pinia";

export const useApiStore = defineStore("counter", () => {
  async function fetchPageData() {
    const isHomePage = window.location.pathname === "/";
    const url = isHomePage
      ? `${window.location.href}home.json`
      : `${window.location.href}.json`;

    try {
      const response = await fetch(url);
      if (!response.ok) {
        throw new Error(`HTTP error! status: ${response.status}`);
      }
      const data = await response.json();
      return data;
    } catch (error) {
      console.error(
        "Une erreur s'est produite lors de la récupération des données :",
        error
      );
      throw error;
    }
  }

  function fetchDataThroughKQL() {
    const api = "/api/query";

    const username = import.meta.env.VITE_USERNAME;
    const password = import.meta.env.VITE_PASSWORD;

    const token = btoa(`${username}:${password}`);

    const headers = {
      Authorization: `Basic ${token}`,
    };

    const request = {
      method: "post",
      body: JSON.stringify({
        query: `page('home')`,
        select: {
          testImages: {
            query: "page.testImages.toFiles",
            select: {
              url: true,
            },
          },
          blocks: {
            query: "page.testBlocks.toBlocks",
          },
        },
      }),
      headers,
    };

    fetch(api, request)
      .then((response) => response.json())
      .then((response) => {
        console.log(response);
      })
      .catch((error) => {
        console.log(error);
      });
  }

  return { fetchDataThroughKQL, fetchPageData };
});