Feat/get products

.env.example

@@ -1,7 +1,4 @@
-COMPANY_NAME="Vercel Inc."
-TWITTER_CREATOR="@vercel"
+TWITTER_CREATOR="@DuvCharles"
 TWITTER_SITE="https://nextjs.org/commerce"
 SITE_NAME="Next.js Commerce"
-SHOPIFY_REVALIDATION_SECRET=""
-SHOPIFY_STOREFRONT_ACCESS_TOKEN=""
-SHOPIFY_STORE_DOMAIN="[your-shopify-store-subdomain].myshopify.com"
+SYLIUS_STORE_DOMAIN=localhost:8001

app/[page]/opengraph-image.tsx

@@ -1,5 +1,5 @@
 import OpengraphImage from 'components/opengraph-image';
-import { getPage } from 'lib/shopify';
+import { getPage } from 'lib/sylius';
 
 export const runtime = 'edge';
 

app/[page]/page.tsx

@@ -1,7 +1,7 @@
 import type { Metadata } from 'next';
 
 import Prose from 'components/prose';
-import { getPage } from 'lib/shopify';
+import { getPage } from 'lib/sylius';
 import { notFound } from 'next/navigation';
 
 export const runtime = 'edge';

app/product/[handle]/page.tsx

@@ -7,8 +7,8 @@ import Footer from 'components/layout/footer';
 import { Gallery } from 'components/product/gallery';
 import { ProductDescription } from 'components/product/product-description';
 import { HIDDEN_PRODUCT_TAG } from 'lib/constants';
-import { getProduct, getProductRecommendations } from 'lib/shopify';
-import { Image } from 'lib/shopify/types';
+import { getProduct, getProductRecommendations } from 'lib/sylius';
+import { Image } from 'lib/sylius/types';
 import Link from 'next/link';
 
 export const runtime = 'edge';

app/search/[collection]/opengraph-image.tsx

@@ -1,5 +1,5 @@
 import OpengraphImage from 'components/opengraph-image';
-import { getCollection } from 'lib/shopify';
+import { getCollection } from 'lib/sylius';
 
 export const runtime = 'edge';
 

app/search/[collection]/page.tsx

@@ -1,4 +1,4 @@
-import { getCollection, getCollectionProducts } from 'lib/shopify';
+import { getCollection, getCollectionProducts } from 'lib/sylius';
 import { Metadata } from 'next';
 import { notFound } from 'next/navigation';
 

app/search/page.tsx

@@ -1,7 +1,7 @@
 import Grid from 'components/grid';
 import ProductGridItems from 'components/layout/product-grid-items';
 import { defaultSort, sorting } from 'lib/constants';
-import { getProducts } from 'lib/shopify';
+import { getProducts } from 'lib/sylius';
 
 export const runtime = 'edge';
 

app/sitemap.ts

@@ -1,4 +1,4 @@
-import { getCollections, getPages, getProducts } from 'lib/shopify';
+import { getCollections, getPages, getProducts } from 'lib/sylius';
 import { MetadataRoute } from 'next';
 
 type Route = {

components/carousel.tsx

@@ -1,10 +1,10 @@
-import { getCollectionProducts } from 'lib/shopify';
+import { getCollectionProducts } from 'lib/sylius';
 import Link from 'next/link';
 import { GridTileImage } from './grid/tile';
 
 export async function Carousel() {
   // Collections that start with `hidden-*` are hidden from the search page.
-  const products = await getCollectionProducts({ collection: 'hidden-homepage-carousel' });
+  const products = await getCollectionProducts({});
 
   if (!products?.length) return null;
 

components/cart/actions.ts

@@ -1,6 +1,6 @@
 'use server';
 
-import { addToCart, createCart, getCart, removeFromCart, updateCart } from 'lib/shopify';
+import { addToCart, createCart, getCart, removeFromCart, updateCart } from 'lib/sylius';
 import { cookies } from 'next/headers';
 
 export const addItem = async (variantId: string | undefined): Promise<String | undefined> => {

components/cart/add-to-cart.tsx

@@ -4,7 +4,7 @@ import { PlusIcon } from '@heroicons/react/24/outline';
 import clsx from 'clsx';
 import { addItem } from 'components/cart/actions';
 import LoadingDots from 'components/loading-dots';
-import { ProductVariant } from 'lib/shopify/types';
+import { ProductVariant } from 'lib/sylius/types';
 import { useRouter, useSearchParams } from 'next/navigation';
 import { useTransition } from 'react';
 

components/cart/delete-item-button.tsx

@@ -3,9 +3,7 @@ import LoadingDots from 'components/loading-dots';
 import { useRouter } from 'next/navigation';
 
 import clsx from 'clsx';
-import { removeItem } from 'components/cart/actions';
-import type { CartItem } from 'lib/shopify/types';
-import { useTransition } from 'react';
+import type { CartItem } from 'lib/sylius/types';
 
 export default function DeleteItemButton({ item }: { item: CartItem }) {
   const router = useRouter();

components/cart/edit-item-quantity-button.tsx

@@ -3,9 +3,8 @@ import { useTransition } from 'react';
 
 import { MinusIcon, PlusIcon } from '@heroicons/react/24/outline';
 import clsx from 'clsx';
-import { removeItem, updateItemQuantity } from 'components/cart/actions';
-import LoadingDots from 'components/loading-dots';
-import type { CartItem } from 'lib/shopify/types';
+import type { CartItem } from 'lib/sylius/types';
+import LoadingDots from '../loading-dots';
 
 export default function EditItemQuantityButton({
   item,

components/cart/index.tsx

@@ -1,4 +1,4 @@
-import { getCart } from 'lib/shopify';
+import { getCart } from 'lib/sylius';
 import { cookies } from 'next/headers';
 import CartModal from './modal';
 

components/cart/modal.tsx

@@ -4,7 +4,7 @@ import { Dialog, Transition } from '@headlessui/react';
 import { ShoppingCartIcon } from '@heroicons/react/24/outline';
 import Price from 'components/price';
 import { DEFAULT_OPTION } from 'lib/constants';
-import type { Cart } from 'lib/shopify/types';
+import type { Cart } from 'lib/sylius/types';
 import { createUrl } from 'lib/utils';
 import Image from 'next/image';
 import Link from 'next/link';

components/grid/three-items.tsx

@@ -1,6 +1,6 @@
 import { GridTileImage } from 'components/grid/tile';
-import { getCollectionProducts } from 'lib/shopify';
-import type { Product } from 'lib/shopify/types';
+import { getCollectionProducts } from 'lib/sylius';
+import type { Product } from 'lib/sylius/types';
 import Link from 'next/link';
 
 function ThreeItemGridItem({
@@ -39,9 +39,7 @@ function ThreeItemGridItem({
 
 export async function ThreeItemGrid() {
   // Collections that start with `hidden-*` are hidden from the search page.
-  const homepageItems = await getCollectionProducts({
-    collection: 'hidden-homepage-featured-items'
-  });
+  const homepageItems = await getCollectionProducts({});
 
   if (!homepageItems[0] || !homepageItems[1] || !homepageItems[2]) return null;
 

components/layout/footer-menu.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import clsx from 'clsx';
-import { Menu } from 'lib/shopify/types';
+import { Menu } from 'lib/sylius/types';
 import Link from 'next/link';
 import { usePathname } from 'next/navigation';
 import { useEffect, useState } from 'react';

components/layout/footer.tsx

@@ -2,7 +2,7 @@ import Link from 'next/link';
 
 import FooterMenu from 'components/layout/footer-menu';
 import LogoSquare from 'components/logo-square';
-import { getMenu } from 'lib/shopify';
+import { getMenu } from 'lib/sylius';
 import { Suspense } from 'react';
 
 const { COMPANY_NAME, SITE_NAME } = process.env;
@@ -11,7 +11,7 @@ export default async function Footer() {
   const currentYear = new Date().getFullYear();
   const copyrightDate = 2023 + (currentYear > 2023 ? `-${currentYear}` : '');
   const skeleton = 'w-full h-6 animate-pulse rounded bg-neutral-200 dark:bg-neutral-700';
-  const menu = await getMenu('next-js-frontend-footer-menu');
+  const menu = await getMenu();
   const copyrightName = COMPANY_NAME || SITE_NAME || '';
 
   return (

components/layout/navbar/index.tsx

@@ -1,16 +1,16 @@
 import Cart from 'components/cart';
 import OpenCart from 'components/cart/open-cart';
 import LogoSquare from 'components/logo-square';
-import { getMenu } from 'lib/shopify';
-import { Menu } from 'lib/shopify/types';
+import { getMenu } from 'lib/sylius';
+import { Menu } from 'lib/sylius/types';
 import Link from 'next/link';
 import { Suspense } from 'react';
 import MobileMenu from './mobile-menu';
 import Search from './search';
 const { SITE_NAME } = process.env;
 
 export default async function Navbar() {
-  const menu = await getMenu('next-js-frontend-header-menu');
+  const menu = await getMenu();
 
   return (
     <nav className="relative flex items-center justify-between p-4 lg:px-6">

components/layout/navbar/mobile-menu.tsx

@@ -6,7 +6,7 @@ import { usePathname, useSearchParams } from 'next/navigation';
 import { Fragment, useEffect, useState } from 'react';
 
 import { Bars3Icon, XMarkIcon } from '@heroicons/react/24/outline';
-import { Menu } from 'lib/shopify/types';
+import { Menu } from 'lib/sylius/types';
 import Search from './search';
 
 export default function MobileMenu({ menu }: { menu: Menu[] }) {

components/layout/product-grid-items.tsx

@@ -1,6 +1,6 @@
 import Grid from 'components/grid';
 import { GridTileImage } from 'components/grid/tile';
-import { Product } from 'lib/shopify/types';
+import { Product } from 'lib/sylius/types';
 import Link from 'next/link';
 
 export default function ProductGridItems({ products }: { products: Product[] }) {

components/layout/search/collections.tsx

@@ -1,7 +1,7 @@
 import clsx from 'clsx';
 import { Suspense } from 'react';
 
-import { getCollections } from 'lib/shopify';
+import { getCollections } from 'lib/sylius';
 import FilterList from './filter';
 
 async function CollectionList() {

components/product/product-description.tsx

@@ -1,7 +1,7 @@
 import { AddToCart } from 'components/cart/add-to-cart';
 import Price from 'components/price';
 import Prose from 'components/prose';
-import { Product } from 'lib/shopify/types';
+import { Product } from 'lib/sylius/types';
 import { VariantSelector } from './variant-selector';
 
 export function ProductDescription({ product }: { product: Product }) {

components/product/variant-selector.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import clsx from 'clsx';
-import { ProductOption, ProductVariant } from 'lib/shopify/types';
+import { ProductOption, ProductVariant } from 'lib/sylius/types';
 import { createUrl } from 'lib/utils';
 import { usePathname, useRouter, useSearchParams } from 'next/navigation';
 

lib/constants.ts

@@ -25,6 +25,15 @@ export const TAGS = {
   products: 'products'
 };
 
-export const HIDDEN_PRODUCT_TAG = 'nextjs-frontend-hidden';
 export const DEFAULT_OPTION = 'Default Title';
-export const SHOPIFY_GRAPHQL_API_ENDPOINT = '/api/2023-01/graphql.json';
+
+export const HIDDEN_PRODUCT_TAG = 'nextjs-frontend-hidden';
+
+export const SYLIUS_API_ENDPOINT = '/api/v2/shop';
+
+export const REST_METHODS = {
+  GET: 'GET',
+  POST: 'POST',
+  PUT: 'PUT',
+  DELETE: 'DELETE'
+};