> next-template@0.0.2 build C:\Users\philo\projects\Astral-Store
> next build

- info Loaded env from C:\Users\philo\projects\Astral-Store\.env.local
- info Creating an optimized production build
- info Compiled successfully
- info Linting and checking validity of types
- info Collecting page data
- info Generating static pages (4/4)
- info Finalizing page optimization

Route (app)                                Size     First Load JS
┌ ○ /                                      0 B                0 B
â”” â—‹ /api/items                             0 B                0 B
+ First Load JS shared by all              85.9 kB
  ├ chunks/106-d4a3cb813406ce7d.js         25.3 kB
  ├ chunks/58b30e71-cd52d4eb5faa369d.js    50.5 kB
  ├ chunks/798-41b1d96d0c1cde1a.js         8.19 kB
  ├ chunks/main-app-bbe35e5a4bef5747.js    215 B
  â”” chunks/webpack-cf3820b6dd6f5e92.js     1.74 kB

Route (pages)                              Size     First Load JS
─ ○ /404                                   182 B          74.9 kB
+ First Load JS shared by all              74.7 kB
  ├ chunks/framework-510ec8ffd65e1d01.js   45 kB
  ├ chunks/main-a5126d5d6f29e0b5.js        27.7 kB
  ├ chunks/pages/_app-cb21f3cd47a92abc.js  194 B
  â”” chunks/webpack-cf3820b6dd6f5e92.js     1.74 kB

â—‹  (Static)  automatically rendered as static HTML (uses no initial props)

TypeError: Failed to parse URL from astral-store-philo-l826er2r1-felopater-melika.vercel.app/api/items
    at new Request (node:internal/deps/undici/undici:7004:19)
    at r (/vercel/path0/.next/server/chunks/950.js:46244:65)
    at doOriginalFetch (/vercel/path0/node_modules/next/dist/server/lib/patch-fetch.js:273:24)
    at /vercel/path0/node_modules/next/dist/server/lib/patch-fetch.js:392:20 {
  [cause]: TypeError [ERR_INVALID_URL]: Invalid URL
      at new NodeError (node:internal/errors:399:5)
      at URL.onParseError (node:internal/url:566:9)
      at new URL (node:internal/url:646:5)
      at new Request (node:internal/deps/undici/undici:7002:25)
      at r (/vercel/path0/.next/server/chunks/950.js:46244:65)
      at doOriginalFetch (/vercel/path0/node_modules/next/dist/server/lib/patch-fetch.js:273:24)
      at /vercel/path0/node_modules/next/dist/server/lib/patch-fetch.js:392:20 {
    input: 'astral-store-philo-l826er2r1-felopater-melika.vercel.app/api/items',
    code: 'ERR_INVALID_URL'
  }
}
Error occurred prerendering page "/". Read more: https://nextjs.org/docs/messages/prerender-error
TypeError: Failed to parse URL from astral-store-philo-l826er2r1-felopater-melika.vercel.app/api/items
    at new Request (node:internal/deps/undici/undici:7004:19)
    at r (/vercel/path0/.next/server/chunks/950.js:46244:65)
    at doOriginalFetch (/vercel/path0/node_modules/next/dist/server/lib/patch-fetch.js:273:24)
    at /vercel/path0/node_modules/next/dist/server/lib/patch-fetch.js:392:20
- info Generating static pages (4/4)
> Export encountered errors on following paths:
    /page: /
 ELIFECYCLE  Command failed with exit code 1.
Error: Command "pnpm run build" exited with 1
BUILD_UTILS_SPAWN_1: Command "pnpm run build" exited with 1

import { NextResponse } from 'next/server';
import { gql, request } from 'graphql-request';

const getProducts = async (): Promise<any> => {
  const url = `https://${process.env.STORE_NAME}.myshopify.com/api/2023-04/graphql.json`;
  const headers = {
    'X-Shopify-Storefront-Access-Token': process.env
      .X_SHOPIFY_ACCESS_TOKEN as string,
  };

  const query = gql`
    query ProductsQuery {
      collections(
        first: 3
        query: "title:solars OR title:galaxies OR title:planets"
      ) {
        edges {
          node {
            title
            products(first: 10) {
              edges {
                node {
                  id
                  title
                  description
                  variants(first: 1) {
                    edges {
                      node {
                        price {
                          amount
                        }
                      }
                    }
                  }
                  images(first: 1) {
                    edges {
                      node {
                        url
                      }
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  `;

  return await request(url, query, undefined, headers);
};

export async function GET() {
  try {
    const { collections } = await getProducts();

    const solars = collections.edges
      .find(({ node }: any) => node.title.toLowerCase() === 'solars')
      .node.products.edges.map(({ node }: any) => node);

    const galaxies = collections.edges
      .find(({ node }: any) => node.title.toLowerCase() === 'galaxies')
      .node.products.edges.map(({ node }: any) => node);

    const planets = collections.edges
      .find(({ node }: any) => node.title.toLowerCase() === 'planets')
      .node.products.edges.map(({ node }: any) => node);
    return NextResponse.json({
      products: {

        solars,
        galaxies,
        planets,
      },
    });
  } catch (error) {
    console.error(error);
    NextResponse.json({ error: 'Failed to fetch products.tsx' });
  }
}

import { setGalaxies, setPlanets, setSolars } from '@/store/productsSlice';
import { store } from '@/store/store';

import Preloader from '@/components/preloader';
import Products from '@/components/products';
import Providers from '@/components/providers';

const processDataAndDispatch = (
  data: any,
  category: any,
  dispatchAction: any
) => {
  const processedData = data.products[category].map((item: any) => {
    return {
      id: item.id,
      title: item.title,
      description: item.description,
      price: item.variants.edges[0].node.price.amount,
      image: item.images.edges[0].node.url,
    };
  });

  store.dispatch(dispatchAction(processedData));
};

export default async function Page() {
  const response = await fetch('/api/items', { next: { revalidate: 20 } });

  const data = await response.json();

  processDataAndDispatch(data, 'planets', setPlanets);
  processDataAndDispatch(data, 'solars', setSolars);
  processDataAndDispatch(data, 'galaxies', setGalaxies);

  const products: any = store.getState().products;
  const planets: any = store.getState().products.planets;
  const solars: any = store.getState().products.solars;
  const galaxies: any = store.getState().products.galaxies;

  const allProducts: any = Object.values(products).flatMap(
    (category: any) => category
  );

  return (
    <Providers>
      <Preloader
        products={allProducts}
        planets={planets}
        solars={solars}
        galaxies={galaxies}
      />
      <Products products={allProducts} />
    </Providers>
  );
}