djEban

Я забыл запятые между аргументами....

А ок

window.AppleID.init({
  response_type: "code",
  response_mode: "query",
})

не указывайте scope, не указывайте id_token в response_type

Ну что сказать, это жоска, 6 часов убитого времени и вот в чем лично у меня была проблема , может кто столкнется

Былая функция-обертка, условно такая

async function withHost(getStaticPropsData) {
    const getStaticProps = async (ctx) => {
        const response = await getHost(ctx.params.host);
        const gspData = await getStaticPropsData(ctx);
        return {
            props: { host: response.data, ...gpsData.props }
        }
    };

    const getStaticPaths = async () => {
        const response = await ServerCache.get("hosts");
        return {
            paths: response.data.map(...), 
            fallback: "blocking" 
        };
    }

    return { getStaticPaths, getStaticProps };
};

Здесь все просто: каждую хост-страницу оборачиваю в данную обертку, чтобы получить статические пути + для каждой страницы базовую информацию о хосте

Проблема была, не догадаетесь, в том, что я экспортировал getStaticPaths (!!!) и использовал вот так:

// index.tsx

export const { getStaticPaths, getStaticProps } = withHost(() => ({
    props: {}
}))

Достаточно было вынести gsp в отдельную функцию и использовать ее лично для каждого роута

export const getStaticProps  = withHost(() => ({
    props: {}
}))

export const getStaticPaths = getHostsPaths();

Если кому интересно, сделал так:

function hexToRgb(hex) {
    const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);

    if (!result) {
      throw new Error("Expected a hex value. Received " + hex);
    }

    return {
      r: parseInt(result[1], 16),
      g: parseInt(result[2], 16),
      b: parseInt(result[3], 16),
    };
  }

  function componentToHex(c) {
    const hex = c.toString(16);
    return hex.length === 1 ? "0" + hex : hex;
  }

  function rgbToHex(r, g, b) {
    return (
      "#" +
      this.componentToHex(r) +
      this.componentToHex(g) +
      this.componentToHex(b)
    );
  }

  function lerpRGB(startRGB, endRGB, t) {
    const rgb = { r: 0, g: 0, b: 0 };

    ["r", "g", "b"].forEach((channel) => {
      const startValue = startRGB[channel];
      const endValue = endRGB[channel];
      rgb[channel] = Math.ceil(t * (endValue - startValue) + startValue);
    });

    return rgb;
  }

  const scrollX = element.scrollTop;
  const range = ["#7c4830", "#311609"];
  const start = 0;
  const end = 300;

  const t = scrollX / (end - start);

  const startRGB = hexToRgb(range[0]);
  const endRGB = hexToRgb(range[1]);
  const { r, g, b } = lerpRGB(startRGB, endRGB, t);
  const hex = rgbToHex(r, g, b);

  element.style.backgroundColor = hex

Пока вижу только один способ: локалку через ngrok запускать и добавлять этот домен при создании