Update React Editor integration and clean up template

hooks/use-shopify-collections.ts

@@ -4,26 +4,26 @@ import { useState, useEffect, useCallback, useRef } from 'react';
 import {
   getCollections,
   getCollectionProducts,
-} from '@/services/shopify/catalog';
+} from '@/services/shopify/shop';
 
 export {
   getCollections,
   getCollectionProducts,
   getCollectionProductsPage,
-} from '@/services/shopify/catalog';
+} from '@/services/shopify/shop';
 export type {
   Collection,
   CollectionWithProducts,
   CollectionSortKey,
   CollectionProductsPage,
   ProductFilterFacet,
-} from '@/services/shopify/catalog';
+} from '@/services/shopify/shop';
 
 import type {
   Collection,
   CollectionWithProducts,
   CollectionSortKey,
-} from '@/services/shopify/catalog';
+} from '@/services/shopify/shop';
 
 interface UseCollectionProductsOptions {
   first?: number;
@@ -33,7 +33,6 @@ interface UseCollectionProductsOptions {
   filterInputs?: string[];
 }
 
-// Hook for fetching all collections
 export function useCollections(first = 50) {
   const [collections, setCollections] = useState<Collection[]>([]);
   const [loading, setLoading] = useState(true);
@@ -60,9 +59,7 @@ export function useCollections(first = 50) {
   return { collections, loading, error, refetch: fetchCollections };
 }
 
-// Deferred variant of useCollections: nothing is requested until `load` runs,
-// so a menu can hold off until it's actually opened. The fetch happens once —
-// re-opening reuses what's already in state.
+// Fetch once on demand for menus that may never open.
 export function useCollectionsOnDemand(first = 50) {
   const [collections, setCollections] = useState<Collection[]>([]);
   const [loading, setLoading] = useState(false);
@@ -79,7 +76,6 @@ export function useCollectionsOnDemand(first = 50) {
       setCollections(await getCollections(first));
     } catch (err) {
       console.error('Error fetching collections:', err);
-      // Let the next open (or a retry) try again.
       requested.current = false;
       setError(err instanceof Error ? err.message : 'Failed to load collections');
     } finally {
@@ -90,7 +86,6 @@ export function useCollectionsOnDemand(first = 50) {
   return { collections, loading, error, load };
 }
 
-// Hook for fetching products in a collection
 export function useCollectionProducts(
   handle: string | null,
   options: UseCollectionProductsOptions = {}