@rpg-engine/long-bow 0.8.226 → 0.8.228

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rpg-engine/long-bow",
-  "version": "0.8.226",
+  "version": "0.8.228",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -84,7 +84,7 @@
   "dependencies": {
     "@capacitor/core": "^6.1.0",
     "@rollup/plugin-image": "^2.1.1",
-    "@rpg-engine/shared": "^0.10.115",
+    "@rpg-engine/shared": "^0.10.119",
     "dayjs": "^1.11.2",
     "font-awesome": "^4.7.0",
     "fs-extra": "^10.1.0",

package/src/components/Marketplace/CharacterListingForm.tsx

@@ -4,6 +4,7 @@ import React, { useState } from 'react';
 import styled from 'styled-components';
 import { CTAButton } from '../shared/CTAButton/CTAButton';
 import { CharacterListingModal } from './CharacterListingModal';
+import { getEligibleCharactersForListing } from './characterListingUtils';
 
 export interface ICharacterListingFormProps {
   accountCharacters: ICharacter[];
@@ -30,9 +31,7 @@ export const CharacterListingForm: React.FC<ICharacterListingFormProps> = ({
 }) => {
   const [isModalOpen, setIsModalOpen] = useState(false);
 
-  const eligibleCount = accountCharacters.filter(
-    c => !c.isListedForSale && !c.tradedAt
-  ).length;
+  const eligibleCount = getEligibleCharactersForListing(accountCharacters).length;
 
   return (
     <Wrapper>

package/src/components/Marketplace/CharacterListingModal.tsx

@@ -1,6 +1,6 @@
 import { ICharacter } from '@rpg-engine/shared';
 import { ShoppingBag } from 'pixelarticons/react/ShoppingBag';
-import React, { useCallback, useState } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
 import { FaTimes } from 'react-icons/fa';
 import styled, { keyframes } from 'styled-components';
 import ModalPortal from '../Abstractions/ModalPortal';
@@ -10,6 +10,7 @@ import { CTAButton } from '../shared/CTAButton/CTAButton';
 import { DCRateStrip } from '../shared/DCRateStrip';
 import { SpriteFromAtlas } from '../shared/SpriteFromAtlas';
 import { MMORPGNumber } from '../../components/shared/MMORPGNumber';
+import { getEligibleCharactersForListing } from './characterListingUtils';
 
 export interface ICharacterListingModalProps {
   isOpen: boolean;
@@ -52,12 +53,13 @@ export const CharacterListingModal: React.FC<ICharacterListingModalProps> = ({
     []
   );
 
-  if (!isOpen) return null;
-
-  const eligibleCharacters = accountCharacters.filter(
-    c => !c.isListedForSale
+  const eligibleCharacters = useMemo(
+    () => getEligibleCharactersForListing(accountCharacters, activeCharacterId),
+    [accountCharacters, activeCharacterId]
   );
 
+  if (!isOpen) return null;
+
   const isActiveCharacter = (c: ICharacter) => !!activeCharacterId && c._id === activeCharacterId;
 
   const canList = !!selectedId && Number(price) > 0 && selectedId !== activeCharacterId;

package/src/components/Marketplace/CharacterTradePanel.tsx

@@ -0,0 +1,151 @@
+import { ICharacter, ICharacterListing } from '@rpg-engine/shared';
+import React, { useState } from 'react';
+import styled from 'styled-components';
+import { CharacterMarketplacePanel } from './CharacterMarketplacePanel';
+import { MyCharacterListingsPanel } from './MyCharacterListingsPanel';
+
+export interface ICharacterTradePanelProps {
+  characterListings: ICharacterListing[];
+  characterListingsTotal: number;
+  characterListingsPage: number;
+  characterListingsItemsPerPage: number;
+  onCharacterListingsPageChange: (page: number) => void;
+  onCharacterBuy: (listingId: string) => void;
+  characterNameFilter?: string;
+  onCharacterNameFilterChange?: (name: string) => void;
+  characterListingsLoading?: boolean;
+  myCharacterListings: ICharacterListing[];
+  myCharacterListingsTotal: number;
+  myCharacterListingsPage: number;
+  onMyCharacterListingsPageChange: (page: number) => void;
+  onCharacterDelist: (listingId: string) => void;
+  accountCharacters: ICharacter[];
+  onCharacterList: (characterId: string, price: number) => void;
+  activeCharacterId?: string;
+  atlasJSON: any;
+  atlasIMG: any;
+  characterAtlasJSON?: any;
+  characterAtlasIMG?: any;
+  enableHotkeys?: () => void;
+  disableHotkeys?: () => void;
+}
+
+export const CharacterTradePanel: React.FC<ICharacterTradePanelProps> = ({
+  characterListings,
+  characterListingsTotal,
+  characterListingsPage,
+  characterListingsItemsPerPage,
+  onCharacterListingsPageChange,
+  onCharacterBuy,
+  characterNameFilter,
+  onCharacterNameFilterChange,
+  characterListingsLoading,
+  myCharacterListings,
+  myCharacterListingsTotal,
+  myCharacterListingsPage,
+  onMyCharacterListingsPageChange,
+  onCharacterDelist,
+  accountCharacters,
+  onCharacterList,
+  activeCharacterId,
+  atlasJSON,
+  atlasIMG,
+  characterAtlasJSON,
+  characterAtlasIMG,
+  enableHotkeys,
+  disableHotkeys,
+}) => {
+  const [subTab, setSubTab] = useState<'browse' | 'my-listings'>('browse');
+
+  return (
+    <>
+      <CharacterSubTabs>
+        <CharacterSubTab
+          $active={subTab === 'browse'}
+          onClick={() => setSubTab('browse')}
+          type="button"
+        >
+          Browse
+        </CharacterSubTab>
+        <CharacterSubTab
+          $active={subTab === 'my-listings'}
+          onClick={() => setSubTab('my-listings')}
+          type="button"
+        >
+          My Listings
+        </CharacterSubTab>
+      </CharacterSubTabs>
+
+      {subTab === 'browse' && (
+        <CharacterMarketplacePanel
+          characterListings={characterListings}
+          totalCount={characterListingsTotal}
+          currentPage={characterListingsPage}
+          itemsPerPage={characterListingsItemsPerPage}
+          onPageChange={onCharacterListingsPageChange}
+          onCharacterBuy={onCharacterBuy}
+          atlasJSON={atlasJSON}
+          atlasIMG={atlasIMG}
+          characterAtlasJSON={characterAtlasJSON ?? atlasJSON}
+          characterAtlasIMG={characterAtlasIMG ?? atlasIMG}
+          enableHotkeys={enableHotkeys}
+          disableHotkeys={disableHotkeys}
+          nameFilter={characterNameFilter}
+          onNameFilterChange={onCharacterNameFilterChange}
+          isLoading={characterListingsLoading}
+        />
+      )}
+
+      {subTab === 'my-listings' && (
+        <MyCharacterListingsPanel
+          myCharacterListings={myCharacterListings}
+          totalCount={myCharacterListingsTotal}
+          currentPage={myCharacterListingsPage}
+          itemsPerPage={10}
+          onPageChange={onMyCharacterListingsPageChange}
+          onCharacterDelist={onCharacterDelist}
+          accountCharacters={accountCharacters}
+          onCharacterList={onCharacterList}
+          activeCharacterId={activeCharacterId}
+          atlasJSON={atlasJSON}
+          atlasIMG={atlasIMG}
+          characterAtlasJSON={characterAtlasJSON ?? atlasJSON}
+          characterAtlasIMG={characterAtlasIMG ?? atlasIMG}
+          enableHotkeys={enableHotkeys}
+          disableHotkeys={disableHotkeys}
+        />
+      )}
+    </>
+  );
+};
+
+const CharacterSubTabs = styled.div`
+  display: flex;
+  gap: 8px;
+  width: 95%;
+  margin: 10px auto 0 auto;
+  padding: 8px;
+  background: rgba(0, 0, 0, 0.2);
+  border-radius: 4px;
+  border: 1px solid rgba(255, 255, 255, 0.05);
+`;
+
+const CharacterSubTab = styled.button<{ $active: boolean }>`
+  flex: 1;
+  padding: 8px 12px;
+  font-family: 'Press Start 2P', cursive;
+  font-size: 0.45rem;
+  border-radius: 4px;
+  border: 1px solid ${({ $active }) => ($active ? '#f59e0b' : 'rgba(255,255,255,0.12)')};
+  background: ${({ $active }) => ($active ? 'rgba(245,158,11,0.15)' : 'rgba(0,0,0,0.3)')};
+  color: ${({ $active }) => ($active ? '#f59e0b' : '#777')};
+  cursor: pointer;
+  transition: border-color 0.15s, background 0.15s, color 0.15s;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+
+  &:hover {
+    border-color: ${({ $active }) => ($active ? '#f59e0b' : 'rgba(255,255,255,0.3)')};
+    color: ${({ $active }) => ($active ? '#f59e0b' : '#bbb')};
+  }
+`;

package/src/components/Marketplace/Marketplace.tsx

@@ -30,8 +30,7 @@ import { HistoryPanel } from './HistoryPanel';
 import { ManagmentPanel } from './ManagmentPanel';
 import { MarketplacePaymentMethod } from './MarketplaceBuyModal';
 import { MarketplaceAcceptedCurrency, MarketplaceSettingsPanel } from './MarketplaceSettingsPanel';
-import { CharacterMarketplacePanel } from './CharacterMarketplacePanel';
-import { MyCharacterListingsPanel } from './MyCharacterListingsPanel';
+import { CharacterTradePanel } from './CharacterTradePanel';
 
 export interface IMarketPlaceProps {
   items: IMarketplaceItem[];
@@ -207,8 +206,6 @@ export const Marketplace: React.FC<IMarketPlaceProps> = props => {
   const [activeTab, setActiveTab] = useState<ActiveTab>('marketplace');
   const [acceptedCurrency, setAcceptedCurrency] = useState<MarketplaceAcceptedCurrency>(acceptedCurrencyProp ?? MarketplaceAcceptedCurrency.GoldOrDc);
   const [isBlueprintSearchOpen, setIsBlueprintSearchOpen] = useState(false);
-  const [characterSubTab, setCharacterSubTab] = useState<'browse' | 'my-listings'>('browse');
-
   const handleCurrencyChange = (value: MarketplaceAcceptedCurrency) => {
     setAcceptedCurrency(value);
     onAcceptedCurrencyChange?.(value);
@@ -292,65 +289,31 @@ export const Marketplace: React.FC<IMarketPlaceProps> = props => {
       )}
 
       {activeTab === 'characters' && (
-        <>
-          <CharacterSubTabs>
-            <CharacterSubTab
-              $active={characterSubTab === 'browse'}
-              onClick={() => setCharacterSubTab('browse')}
-              type="button"
-            >
-              Browse
-            </CharacterSubTab>
-            <CharacterSubTab
-              $active={characterSubTab === 'my-listings'}
-              onClick={() => setCharacterSubTab('my-listings')}
-              type="button"
-            >
-              My Listings
-            </CharacterSubTab>
-          </CharacterSubTabs>
-
-          {characterSubTab === 'browse' && (
-            <CharacterMarketplacePanel
-              characterListings={characterListings ?? []}
-              totalCount={characterListingsTotal ?? 0}
-              currentPage={characterListingsPage ?? 1}
-              itemsPerPage={characterListingsItemsPerPage ?? 10}
-              onPageChange={onCharacterListingsPageChange ?? (() => {})}
-              onCharacterBuy={onCharacterBuy ?? (() => {})}
-              atlasJSON={props.atlasJSON}
-              atlasIMG={props.atlasIMG}
-              characterAtlasJSON={characterAtlasJSON ?? props.atlasJSON}
-              characterAtlasIMG={characterAtlasIMG ?? props.atlasIMG}
-              enableHotkeys={props.enableHotkeys}
-              disableHotkeys={props.disableHotkeys}
-              nameFilter={characterNameFilter}
-              onNameFilterChange={onCharacterNameFilterChange}
-              isLoading={characterListingsLoading}
-            />
-          )}
-
-          {characterSubTab === 'my-listings' && (
-            <MyCharacterListingsPanel
-              myCharacterListings={myCharacterListings ?? []}
-              totalCount={myCharacterListingsTotal ?? 0}
-              currentPage={myCharacterListingsPage ?? 1}
-              itemsPerPage={10}
-              onPageChange={onMyCharacterListingsPageChange ?? (() => {})}
-              onCharacterDelist={onCharacterDelist ?? (() => {})}
-              accountCharacters={accountCharacters ?? []}
-              onCharacterList={onCharacterList ?? (() => {})}
-              activeCharacterId={props.characterId}
-              atlasJSON={props.atlasJSON}
-              atlasIMG={props.atlasIMG}
-              characterAtlasJSON={characterAtlasJSON ?? props.atlasJSON}
-              characterAtlasIMG={characterAtlasIMG ?? props.atlasIMG}
-              enableHotkeys={props.enableHotkeys}
-              disableHotkeys={props.disableHotkeys}
-            />
-          )}
-
-        </>
+        <CharacterTradePanel
+          characterListings={characterListings ?? []}
+          characterListingsTotal={characterListingsTotal ?? 0}
+          characterListingsPage={characterListingsPage ?? 1}
+          characterListingsItemsPerPage={characterListingsItemsPerPage ?? 10}
+          onCharacterListingsPageChange={onCharacterListingsPageChange ?? (() => {})}
+          onCharacterBuy={onCharacterBuy ?? (() => {})}
+          characterNameFilter={characterNameFilter}
+          onCharacterNameFilterChange={onCharacterNameFilterChange}
+          characterListingsLoading={characterListingsLoading}
+          myCharacterListings={myCharacterListings ?? []}
+          myCharacterListingsTotal={myCharacterListingsTotal ?? 0}
+          myCharacterListingsPage={myCharacterListingsPage ?? 1}
+          onMyCharacterListingsPageChange={onMyCharacterListingsPageChange ?? (() => {})}
+          onCharacterDelist={onCharacterDelist ?? (() => {})}
+          accountCharacters={accountCharacters ?? []}
+          onCharacterList={onCharacterList ?? (() => {})}
+          activeCharacterId={props.characterId}
+          atlasJSON={props.atlasJSON}
+          atlasIMG={props.atlasIMG}
+          characterAtlasJSON={characterAtlasJSON}
+          characterAtlasIMG={characterAtlasIMG}
+          enableHotkeys={props.enableHotkeys}
+          disableHotkeys={props.disableHotkeys}
+        />
       )}
 
       {activeTab === 'sell' && (
@@ -442,33 +405,3 @@ const PagerContainer = styled.div`
   padding: 4px 10px;
 `;
 
-const CharacterSubTabs = styled.div`
-  display: flex;
-  gap: 8px;
-  width: 95%;
-  margin: 10px auto 0 auto;
-  padding: 8px;
-  background: rgba(0, 0, 0, 0.2);
-  border-radius: 4px;
-  border: 1px solid rgba(255, 255, 255, 0.05);
-`;
-
-const CharacterSubTab = styled.button<{ $active: boolean }>`
-  flex: 1;
-  padding: 8px 12px;
-  font-family: 'Press Start 2P', cursive;
-  font-size: 0.45rem;
-  border-radius: 4px;
-  border: 1px solid ${({ $active }) => ($active ? '#f59e0b' : 'rgba(255,255,255,0.12)')};
-  background: ${({ $active }) => ($active ? 'rgba(245,158,11,0.15)' : 'rgba(0,0,0,0.3)')};
-  color: ${({ $active }) => ($active ? '#f59e0b' : '#777')};
-  cursor: pointer;
-  transition: border-color 0.15s, background 0.15s, color 0.15s;
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-
-  &:hover {
-    border-color: ${({ $active }) => ($active ? '#f59e0b' : 'rgba(255,255,255,0.3)')};
-    color: ${({ $active }) => ($active ? '#f59e0b' : '#bbb')};
-  }
-`;

package/src/components/Marketplace/MyCharacterListingsPanel.tsx

@@ -9,6 +9,7 @@ import { Pagination } from '../shared/Pagination/Pagination';
 import { SpriteFromAtlas } from '../shared/SpriteFromAtlas';
 import { CTAButton } from '../shared/CTAButton/CTAButton';
 import { CharacterListingModal } from './CharacterListingModal';
+import { getEligibleCharactersForListing } from './characterListingUtils';
 
 export interface IMyCharacterListingsPanelProps {
   myCharacterListings: ICharacterListing[];
@@ -65,9 +66,7 @@ export const MyCharacterListingsPanel: React.FC<IMyCharacterListingsPanelProps>
     }
   };
 
-  const eligibleCount = accountCharacters.filter(
-    c => !c.isListedForSale && !c.tradedAt
-  ).length;
+  const eligibleCount = getEligibleCharactersForListing(accountCharacters).length;
 
   return (
     <>
@@ -358,4 +357,3 @@ const EmptySubtext = styled.span`
   max-width: 260px;
   line-height: 1.6;
 `;
-

package/src/components/Marketplace/__test__/characterListingUtils.spec.ts

@@ -0,0 +1,55 @@
+import { ICharacter } from '@rpg-engine/shared';
+import {
+  getEligibleCharactersForListing,
+  isCharacterEligibleForListing,
+} from '../characterListingUtils';
+
+describe('characterListingUtils', () => {
+  it('keeps traded characters eligible as long as they are not currently listed', () => {
+    const tradedCharacter = {
+      _id: 'traded-character',
+      isListedForSale: false,
+      tradedAt: '2026-04-17T00:00:00.000Z',
+    } as ICharacter;
+
+    expect(isCharacterEligibleForListing(tradedCharacter)).toBe(true);
+  });
+
+  it('sorts recently traded characters first and moves the active character to the end', () => {
+    const characters = [
+      {
+        _id: 'older-character',
+        name: 'Older',
+        isListedForSale: false,
+        tradedAt: '2026-04-10T00:00:00.000Z',
+      },
+      {
+        _id: 'newly-traded-character',
+        name: 'Newly Traded',
+        isListedForSale: false,
+        tradedAt: '2026-04-17T00:00:00.000Z',
+      },
+      {
+        _id: 'already-listed-character',
+        name: 'Already Listed',
+        isListedForSale: true,
+      },
+      {
+        _id: 'active-character',
+        name: 'Active',
+        isListedForSale: false,
+      },
+    ] as ICharacter[];
+
+    const eligibleCharacters = getEligibleCharactersForListing(
+      characters,
+      'active-character'
+    );
+
+    expect(eligibleCharacters.map(character => character._id)).toEqual([
+      'newly-traded-character',
+      'older-character',
+      'active-character',
+    ]);
+  });
+});

package/src/components/Marketplace/characterListingUtils.ts

@@ -0,0 +1,38 @@
+import { ICharacter } from '@rpg-engine/shared';
+
+const toTimestamp = (value?: Date | string | null): number => {
+  if (!value) return 0;
+
+  const timestamp = new Date(value).getTime();
+
+  return Number.isFinite(timestamp) ? timestamp : 0;
+};
+
+export const isCharacterEligibleForListing = (character: ICharacter): boolean =>
+  !character.isListedForSale;
+
+export const getEligibleCharactersForListing = (
+  accountCharacters: ICharacter[],
+  activeCharacterId?: string
+): ICharacter[] =>
+  accountCharacters
+    .filter(isCharacterEligibleForListing)
+    .sort((left, right) => {
+      const leftIsActive =
+        !!activeCharacterId && left._id === activeCharacterId;
+      const rightIsActive =
+        !!activeCharacterId && right._id === activeCharacterId;
+
+      if (leftIsActive !== rightIsActive) {
+        return leftIsActive ? 1 : -1;
+      }
+
+      const tradedAtDiff =
+        toTimestamp(right.tradedAt) - toTimestamp(left.tradedAt);
+
+      if (tradedAtDiff !== 0) {
+        return tradedAtDiff;
+      }
+
+      return 0;
+    });

package/src/components/Spellbook/Spell.tsx

@@ -13,6 +13,7 @@ export interface ISpellProps {
   charMagicLevel: number;
   charSkillLevels?: Record<string, number>;
   onPointerUp?: (spellKey: string) => void;
+  onClick?: (spellKey: string) => void;
   isSettingShortcut?: boolean;
   spellKey: string;
   spell: ISpell;
@@ -43,6 +44,7 @@ export const Spell: React.FC<ISpellProps> = ({
   charMagicLevel,
   charSkillLevels,
   onPointerUp,
+  onClick,
   isSettingShortcut,
   spell,
   activeCooldown,
@@ -77,10 +79,12 @@ export const Spell: React.FC<ISpellProps> = ({
   const CONTAINER_STYLE = { width: '32px', height: '32px' };
   const IMAGE_SCALE = 2;
 
+  const handleClick = onClick ?? onPointerUp;
+
   return (
     <SpellInfoWrapper spell={spell}>
       <Container
-        onPointerUp={onPointerUp?.bind(null, spellKey)}
+        onClick={handleClick?.bind(null, spellKey)}
         isSettingShortcut={isSettingShortcut && !disabled}
         className="spell"
       >

package/src/components/Store/Store.tsx

@@ -316,7 +316,7 @@ export const Store: React.FC<IStoreProps> = ({
           cartItems={cartItems}
           onRemoveFromCart={handleRemoveFromCartTracked}
           onClose={closeCart}
-          onPurchase={async () => { handleCartPurchase(onPurchase); return true; }}
+          onPurchase={() => handleCartPurchase(onPurchase)}
           atlasJSON={atlasJSON}
           atlasIMG={atlasIMG}
           onCheckoutStart={onCheckoutStart}

package/src/components/Store/__test__/Store.spec.tsx

@@ -127,6 +127,22 @@ jest.mock('pixelarticons/react/Wallet', () => ({
   Wallet: () => <span>wallet</span>,
 }));
 
+jest.mock('pixelarticons/react/DateTime', () => ({
+  DateTime: () => <span>datetime</span>,
+}));
+
+jest.mock('pixelarticons/react/Receipt', () => ({
+  Receipt: () => <span>receipt</span>,
+}));
+
+jest.mock('pixelarticons/react/ShoppingCart', () => ({
+  ShoppingCart: () => <span>shopping-cart</span>,
+}));
+
+jest.mock('pixelarticons/react/Users', () => ({
+  Users: () => <span>users</span>,
+}));
+
 jest.mock('react-icons/fa', () => ({
   FaHistory: () => <span>history</span>,
   FaShoppingCart: () => <span>cart</span>,

package/src/components/Store/__test__/useStoreCart.spec.tsx

@@ -0,0 +1,98 @@
+/**
+ * @jest-environment jsdom
+ */
+// @ts-nocheck
+import { PurchaseType } from '@rpg-engine/shared';
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { act } from 'react-dom/test-utils';
+import { useStoreCart } from '../hooks/useStoreCart';
+
+jest.mock('../hooks/useStoreMetadata', () => ({
+  useStoreMetadata: () => ({
+    collectMetadata: jest.fn(),
+    resolveMetadata: jest.fn(),
+    isCollectingMetadata: false,
+    currentMetadataItem: null,
+  }),
+}));
+
+let hookResult;
+const TestComponent = () => {
+  hookResult = useStoreCart();
+  return null;
+};
+
+describe('useStoreCart', () => {
+  let container;
+
+  const baseItem = {
+    key: 'account-email-change',
+    name: 'Account Email Change',
+    price: 2.99,
+    type: PurchaseType.Service,
+  };
+
+  beforeEach(() => {
+    container = document.createElement('div');
+    document.body.appendChild(container);
+    act(() => {
+      ReactDOM.render(<TestComponent />, container);
+    });
+  });
+
+  afterEach(() => {
+    ReactDOM.unmountComponentAtNode(container);
+    document.body.removeChild(container);
+  });
+
+  it('clears and closes the cart after a successful purchase', async () => {
+    await act(async () => {
+      await hookResult.handleAddToCart(baseItem, 1, { inputValue: 'new@example.com' });
+    });
+    act(() => {
+      hookResult.openCart();
+    });
+
+    const onPurchase = jest.fn().mockResolvedValue(true);
+    let result;
+
+    await act(async () => {
+      result = await hookResult.handlePurchase(onPurchase);
+    });
+
+    expect(result).toBe(true);
+    expect(onPurchase).toHaveBeenCalledWith(
+      expect.objectContaining({
+        purchases: [
+          expect.objectContaining({
+            purchaseKey: 'account-email-change',
+            metadata: { inputValue: 'new@example.com' },
+          }),
+        ],
+      })
+    );
+    expect(hookResult.cartItems).toEqual([]);
+    expect(hookResult.isCartOpen).toBe(false);
+  });
+
+  it('keeps the cart intact when purchase returns false', async () => {
+    await act(async () => {
+      await hookResult.handleAddToCart(baseItem, 1, { inputValue: 'new@example.com' });
+    });
+    act(() => {
+      hookResult.openCart();
+    });
+
+    const onPurchase = jest.fn().mockResolvedValue(false);
+    let result;
+
+    await act(async () => {
+      result = await hookResult.handlePurchase(onPurchase);
+    });
+
+    expect(result).toBe(false);
+    expect(hookResult.cartItems).toHaveLength(1);
+    expect(hookResult.isCartOpen).toBe(true);
+  });
+});

package/src/components/Store/hooks/useStoreCart.ts

@@ -19,7 +19,7 @@ interface IUseStoreCart {
   isCartOpen: boolean;
   handleAddToCart: (item: IProductBlueprint, quantity: number, metadata?: Record<string, any>) => void;
   handleRemoveFromCart: (itemKey: string) => void;
-  handlePurchase: (onPurchase: (purchase: IPurchase) => void) => void;
+  handlePurchase: (onPurchase: (purchase: IPurchase) => Promise<boolean>) => Promise<boolean>;
   openCart: () => void;
   closeCart: () => void;
   getTotalItems: () => number;
@@ -104,7 +104,7 @@ export const useStoreCart = (): IUseStoreCart => {
     );
   };
 
-  const handlePurchase = (onPurchase: (purchase: IPurchase) => void) => {
+  const handlePurchase = async (onPurchase: (purchase: IPurchase) => Promise<boolean>): Promise<boolean> => {
     const purchaseUnits: IPurchaseUnit[] = cartItems.map(cartItem => ({
       purchaseKey: cartItem.item.key,
       qty: cartItem.quantity,
@@ -122,12 +122,14 @@ export const useStoreCart = (): IUseStoreCart => {
       purchases: purchaseUnits,
     };
 
-    onPurchase(purchase);
+    const success = await onPurchase(purchase);
 
-    if (isMounted.current) {
+    if (success && isMounted.current) {
       setCartItems([]);
       setIsCartOpen(false);
     }
+
+    return success;
   };
 
   const openCart = () => setIsCartOpen(true);