Merge pull request #99 from artemis-prime/feat/support-for-data-conso…

…lidation-in-client fix: AllVariantsCarousel: next / prev show even if only one item; others
hanzoai · May 1, 2024 · 2122917 · 2122917
2 parents db8d895 + 8ee3708
commit 2122917
Show file tree

Hide file tree

Showing 7 changed files with 19 additions and 14 deletions.
diff --git a/packages/commerce/components/buy/carousel-buy-card.tsx b/packages/commerce/components/buy/carousel-buy-card.tsx
@@ -203,7 +203,7 @@ const CarouselBuyCard: React.FC<{
     <div className={clx}>
       <AddToCartWidget 
         item={cmmc.currentItem}
-        registerAdd={false}
+        registerAdd={true}
         onQuantityChanged={onQuantityChanged} 
         variant={cmmc.cartEmpty ? 'primary' : 'outline'}
         className={addBtnClx} 

diff --git a/packages/commerce/components/buy/multi-family/all-variants-carousel.tsx b/packages/commerce/components/buy/multi-family/all-variants-carousel.tsx
@@ -242,8 +242,10 @@ const AllVariantsCarousel: React.FC<MultiFamilySelectorProps> = ({
             </CarouselItem>
           ))}
           </CarouselContent>
-          <CarouselPrevious className='left-1'/>
-          <CarouselNext className='right-1'/>
+          {r.current.items.length > 1 && (<>
+            <CarouselPrevious className='left-1'/>
+            <CarouselNext className='right-1'/>
+          </>)}
         </Carousel>
       )}
       <ItemInfo labelClx='!text-base font-medium'/>

diff --git a/packages/commerce/components/cart/cart-panel/cart-line-item.tsx b/packages/commerce/components/cart/cart-panel/cart-line-item.tsx
@@ -61,7 +61,7 @@ const CartLineItem: React.FC<{
       </div>
       <div className='flex flex-row items-center justify-between w-full'>
         <div className='flex flex-row items-center'>
-          <AddToCartWidget variant='minimal' item={item} buttonClx='!h-8 md:!h-6' />
+          <AddToCartWidget variant='minimal' registerAdd={false} item={item} buttonClx='!h-8 md:!h-6' />
           {item.quantity > 1 && (<span className='pl-2.5'>{'@' + formatCurrencyValue(item.price)}</span>)}
         </div>
         <div className='flex flex-row gap-1 items-center justify-end'>

diff --git a/packages/commerce/context/commerce-ui.ts b/packages/commerce/context/commerce-ui.ts
@@ -4,22 +4,20 @@ import {
   makeObservable, 
   observable, 
 } from 'mobx'
-import type { CommerceService, LineItem } from '../types'
+import type { CommerceService, LineItem, ObsLineItemRef } from '../types'
 
 
-
-interface CommerceUI {
+interface CommerceUI extends ObsLineItemRef {
   showBuyOptions: (skuPath: string) => void
   hideBuyOptions: () => void
   get buyOptionsSkuPath(): string | undefined
 
-  itemQuantityChanged(item: LineItem, val: number, prevVal: number): void 
-  get activeItem(): LineItem | undefined
+  itemQuantityChanged(item: LineItem, val: number, prevVal: number): void
 }
 
 class CommerceUIStore implements CommerceUI {
 
-  static readonly TIMEOUT = 2500
+  static readonly TIMEOUT = 1500
   _buyOptionsSkuPath: string | undefined = undefined
   _paused: boolean = false
   _activeItem: LineItem | undefined = undefined
@@ -36,7 +34,7 @@ class CommerceUIStore implements CommerceUI {
       buyOptionsSkuPath: computed,
       itemQuantityChanged: action,
       tick: action,
-      activeItem: computed
+      item: computed
     })
   }
 
@@ -92,7 +90,7 @@ class CommerceUIStore implements CommerceUI {
     }
   } 
 
-  get activeItem(): LineItem | undefined {
+  get item(): LineItem | undefined {
     return this._activeItem
   }
 }

diff --git a/packages/commerce/context/index.tsx b/packages/commerce/context/index.tsx
@@ -37,19 +37,22 @@ const CommerceProvider: React.FC<PropsWithChildren & {
   rootNode: CategoryNode
   options?: ServiceOptions
   uiSpecs?: Record<string, SelectionUISpecifier>
+  DEBUG_NO_TICK?: boolean
 }> = ({ 
   children,
   families,
   rootNode,
   options,
-  uiSpecs
+  uiSpecs,
+  DEBUG_NO_TICK=false
 }) => {
 
   useEffect(() => {
+    if (DEBUG_NO_TICK) return
     const intervalId = setInterval(() => {
       (valueRef.current.ui as CommerceUIStore).tick()   
     }, 250)  
-    return () => {clearInterval(intervalId)}
+    return () => { clearInterval(intervalId) }
   }, [])
 
     // TODO: Inject Promo fixture here from siteDef

diff --git a/packages/commerce/index.ts b/packages/commerce/index.ts
@@ -1,5 +1,6 @@
 export * from './context'
 export * from './components'
+  // Impl-dependent, so leave w impl
 export type { StandaloneServiceOptions as ServiceOptions } from './service/impls/standalone/standalone-service'
 export { 
   useSyncSkuParamWithCurrentItem, 

diff --git a/packages/commerce/util/line-item-ref.ts b/packages/commerce/util/line-item-ref.ts
@@ -16,6 +16,7 @@ class LineItemRef implements ObsLineItemRef {
   }
 
   get item(): LineItem | undefined { return this._item  }
+
   set = (v: LineItem | undefined): void => { this._item = v  }
 }