Conversation
- Delete utils/getSdk.ts — no longer needed - Replace all local getSdk imports with getSdk from @commercelayer/core - Remove endpoint from CommerceLayerContext usage across all components/reducers - Derive org slug/domain from JWT instead of endpoint string - Fix Price.tsx TS return type (wrap loader/pricesComponent in fragments) - Update @commercelayer/sdk to 7.9.0 to align with @commercelayer/core peer dep - Fix Storybook prices: stale hooks/core dist was root cause of missing prices fetch - Fix HostedCart: move jwt() decode inside async handlers to avoid invalid token error - Update hosted-cart.spec.tsx to use valid JWT structure
Will be removed in a future major release. Replacement: use <Price skuCode="MY-SKU" /> standalone, or usePrices hook for batched multi-SKU requests.
Replace PricesContainer-required pattern with a provider-free batching architecture so <Price> works standalone and auto-batches SKU requests. - Add pricesBatchStore.ts: module-level Map keyed by accessToken; collects SKU codes via registerSku/unregisterSku with 50 ms debounce; notifies useSyncExternalStore listeners on each flush; cleans up store entry when last subscriber unmounts - Rewrite usePrices: subscribe to batch store via useSyncExternalStore; auto-call fetchPrices when snapshot changes; expose registerSku/unregisterSku wrappers; SWR deduplicates identical param calls to one HTTP request - Add 'DOM' to hooks/tsconfig.json lib (required for setTimeout types) - Update Price.tsx: detect standalone mode (setSkuCodes == null); call usePrices directly with real token; filter batchPrices by sku_code - Add pricesBatchStore.test.ts (11 tests, 100 % coverage) - Add/extend usePrices.test.ts (20 tests, 100 % coverage) - Rewrite price.spec.tsx: mock @commercelayer/hooks to avoid React 19 act() deadlock from useSyncExternalStore + SWR; 5 tests cover all branches including filter callback and accessToken ?? '' fallback
Add StandalonePrice story showing 3 <Price> components used directly without a PricesContainer parent. All three auto-batch into a single API request via the module-level debounce store in usePrices.
…nder
{ loader } and { pricesComponent } were JS object expressions, not JSX.
React 19 correctly throws when an object is returned as a child.
Replace with <>{loader}</> and <>{pricesComponent}</> fragments.
…agments - Change Price return type JSX.Element → ReactNode (React 19 idiomatic) - Return loader and pricesComponent directly without <></> wrappers - Fix price.spec.tsx: use ReturnType<typeof usePrices> instead of unexported UsePricesReturn interface
…esContainer - Add StandalonePrice story showing 3 <Price> components without container - Update 001.prices.mdx: standalone pattern first, deprecation notices - Add loader prop to props table - Add migration hints from PricesContainer to standalone <Price>
…omponents - Add deprecation notice for PricesContainer and container pattern in general - Show before/after code examples (old container vs new standalone) - Fix typos: 'To amultiple', 'documentend' - Keep Hierarchy section intact
acasazza
added
enhancement
❌ Deploy Preview for commercelayer-react-components failed.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Closes #751
Closes #748
Implements standalone
<Price>component that works withoutPricesContainer, using a module-level debounce batch store for automatic request batching.Changes
packages/hookspricesBatchStore.ts— new module-level Map keyed byaccessToken; 50 ms debounce collects all SKU registrations into a singleusePricescallusePrices.ts— subscribe to batch store viauseSyncExternalStore; SWR deduplication ensures a single HTTP request per unique set of SKU codes + tokenpackages/react-componentsPrice.tsx— detect standalone mode (setSkuCodes == null), register/unregister SKU via store, returnReactNode, showloaderwhile fetchingprice.spec.tsx— mock@commercelayer/hooksto avoid React 19act()deadlock; 5 new tests, 100% branch coveragepackages/documentprices.stories.tsx— newStandalonePricestory (3<Price>without container)001.prices.mdx— standalone pattern promoted to top;PricesContainermarked deprecated with migration hints005.containers.mdx— deprecation notice added; before/after code examples; typos fixedDeprecation
PricesContaineris deprecated and will be removed in a future major release.Before (deprecated):
After (recommended):
All three
<Price>instances are batched into a single API request automatically via the 50 ms debounce store.