Revert "Merge pull request Shopify#85 from Shopify/hl-update-2024-10-1"

This reverts commit f7571e5, reversing changes made to 35965f4.
therealhexi · Jan 31, 2025 · 396712f · 396712f
1 parent bcf8099
commit 396712f
Show file tree

Hide file tree

Showing 7 changed files with 359 additions and 538 deletions.
diff --git a/app/components/AddToCartButton.tsx b/app/components/AddToCartButton.tsx
@@ -1,4 +1,5 @@
-import {CartForm, type OptimisticCartLineInput} from '@shopify/hydrogen';
+import type {CartLineInput} from '@shopify/hydrogen/storefront-api-types';
+import {CartForm} from '@shopify/hydrogen';
 import type {FetcherWithComponents} from '@remix-run/react';
 
 import {Button} from '~/components/Button';
@@ -13,7 +14,7 @@ export function AddToCartButton({
   ...props
 }: {
   children: React.ReactNode;
-  lines: Array<OptimisticCartLineInput>;
+  lines: CartLineInput[];
   className?: string;
   variant?: 'primary' | 'secondary' | 'inline';
   width?: 'auto' | 'full';

diff --git a/app/lib/seo.server.ts b/app/lib/seo.server.ts
@@ -87,12 +87,14 @@ type ProductRequiredFields = Pick<
   Product,
   'title' | 'description' | 'vendor' | 'seo'
 > & {
-  variants: Array<
-    Pick<
-      ProductVariant,
-      'sku' | 'price' | 'selectedOptions' | 'availableForSale'
-    >
-  >;
+  variants: {
+    nodes: Array<
+      Pick<
+        ProductVariant,
+        'sku' | 'price' | 'selectedOptions' | 'availableForSale'
+      >
+    >;
+  };
 };
 
 function productJsonLd({
@@ -105,7 +107,7 @@ function productJsonLd({
   url: Request['url'];
 }): SeoConfig['jsonLd'] {
   const origin = new URL(url).origin;
-  const variants = product.variants;
+  const variants = product.variants.nodes;
   const description = truncate(
     product?.seo?.description ?? product?.description,
   );

diff --git a/app/routes/($locale).cart.tsx b/app/routes/($locale).cart.tsx
@@ -1,4 +1,4 @@
-import {useLoaderData} from '@remix-run/react';
+import {Await, useRouteLoaderData} from '@remix-run/react';
 import invariant from 'tiny-invariant';
 import {
   type LoaderFunctionArgs,
@@ -9,6 +9,7 @@ import {CartForm, type CartQueryDataReturn, Analytics} from '@shopify/hydrogen';
 
 import {isLocalPath} from '~/lib/utils';
 import {Cart} from '~/components/Cart';
+import type {RootLoader} from '~/root';
 
 export async function action({request, context}: ActionFunctionArgs) {
   const {cart} = context;
@@ -83,13 +84,18 @@ export async function loader({context}: LoaderFunctionArgs) {
 }
 
 export default function CartRoute() {
-  const cart = useLoaderData<typeof loader>();
+  const rootData = useRouteLoaderData<RootLoader>('root');
+  if (!rootData) return null;
 
+  // @todo: finish on a separate PR
   return (
-    <div className="cart">
-      <h1>Cart</h1>
-      <Cart layout="page" cart={cart} />
+    <>
+      <div className="grid w-full gap-8 p-6 py-8 md:p-8 lg:p-12 justify-items-start">
+        <Await resolve={rootData?.cart}>
+          {(cart) => <Cart layout="page" cart={cart} />}
+        </Await>
+      </div>
       <Analytics.CartView />
-    </div>
+    </>
   );
 }