orionplace-react 0.1.0 → 0.2.0

package/templates/orionplace/COMPONENTS.md

@@ -0,0 +1,35 @@
+# React component contracts
+## Cart, payment and subscription response fields
+
+Field ownership, IDs, empty values and confirmed changes / Владельцы полей, ID, пустые значения и подтверждённые изменения.
+
+| Component | Field guide / Описание полей |
+| --- | --- |
+| CartDeliverySelector | [EN / RU](../components/orionplace/cart/CartDeliverySelector.README.md) |
+| CartItemOptions | [EN / RU](../components/orionplace/cart/CartItemOptions.README.md) |
+| CartLineItem | [EN / RU](../components/orionplace/cart/CartLineItem.README.md) |
+| StorefrontWallet | [EN / RU](../components/orionplace/wallet/StorefrontWallet.README.md) |
+| PaymentPanel | [EN / RU](../components/orionplace/payments/PaymentPanel.README.md) |
+| StorefrontSubscriptions | [EN / RU](../components/orionplace/subscriptions/StorefrontSubscriptions.README.md) |
+| SubscriptionRenewalDialog | [EN / RU](../components/orionplace/subscriptions/SubscriptionRenewalDialog.README.md) |
+| SubscriptionPlanSummary | [EN / RU](../components/orionplace/subscriptions/SubscriptionPlanSummary.README.md) |
+| SubscriptionRemoteDetails | [EN / RU](../components/orionplace/subscriptions/SubscriptionRemoteDetails.README.md) |
+| OrderPaymentForm | [EN / RU](../components/orionplace/orders/OrderPaymentForm.README.md) |
+
+The API response tables also explain the following contracts / Таблицы ответов API также объясняют следующие контракты:
+
+| API | Contract / Контракт |
+| --- | --- |
+| [cart_guest_get](https://orionmarket.place/en/sandbox/api/cart_guest_get) · [RU](https://orionmarket.place/ru/sandbox/api/cart_guest_get) | Checkout options and saved choices / Опции оформления и сохранённый выбор |
+| [invoices_get](https://orionmarket.place/en/sandbox/api/invoices_get) · [RU](https://orionmarket.place/ru/sandbox/api/invoices_get) | Transaction direction and refunds / Направление платежей и возвраты |
+| [subscriptions_get](https://orionmarket.place/en/sandbox/api/subscriptions_get) · [RU](https://orionmarket.place/ru/sandbox/api/subscriptions_get) | Subscription state, renewal and service data / Состояние подписки, продление и данные сервиса |
+| [profile_promocodes_get](https://orionmarket.place/en/sandbox/api/profile_promocodes_get) · [RU](https://orionmarket.place/ru/sandbox/api/profile_promocodes_get) | Issued codes and promotion conditions / Выданные коды и условия акций |
+| [orders_create](https://orionmarket.place/en/sandbox/api/orders_create) · [RU](https://orionmarket.place/ru/sandbox/api/orders_create) | Failure fields and recovery / Поля ошибок и исправление |
+| [profile_orders_get](https://orionmarket.place/en/sandbox/api/profile_orders_get) · [RU](https://orionmarket.place/ru/sandbox/api/profile_orders_get) | Ordered options, returns and downloads / Купленные опции, возвраты и загрузки |
+| [subscriptions_guest_search](https://orionmarket.place/en/sandbox/api/subscriptions_guest_search) · [RU](https://orionmarket.place/ru/sandbox/api/subscriptions_guest_search) | Plan parameters, units and headings / Параметры тарифа, единицы и подписи |
+
+## Cart loading / Загрузка корзины
+
+[StorefrontCart](../components/orionplace/cart/StorefrontCart.README.md): The cart shows loading until a snapshot or a request error is available. After a failed load, Refresh retries the request.
+
+Пока нет данных корзины или ошибки запроса, отображается загрузка. После ошибки кнопка «Обновить» повторяет загрузку.

package/templates/providers/OrionplaceProvider.tsx

@@ -1,32 +1,120 @@
 'use client';
 
-import { createContext, useContext, useRef, type ReactNode } from 'react';
+import {
+  createContext,
+  useContext,
+  useRef,
+  useEffect,
+  type ReactNode,
+} from 'react';
 import { useStore } from 'zustand';
 import {
-  createOrionplaceStore, initialSnapshot,
-  type OrionplaceState, type OrionplaceStore,
-} from '../stores/orionplace';
-import type { AppLoadFailure, AppLoadResult } from '../interfaces/orionplace';
+  type OrionplaceState,
+  type OrionplaceStore,
+} from '@/stores/orionplace';
+import {
+  type OrionplaceSelectionsState,
+  type OrionplaceSelectionsStore,
+} from '@/stores/orionplaceSelections';
+import {
+  type OrionplaceProductsState,
+  type OrionplaceProductsStore,
+} from '@/stores/orionplaceProducts';
+import {
+  type OrionplaceCatalogState,
+  type OrionplaceCatalogStore,
+  createOrionplaceCatalogStore,
+} from '@/stores/orionplaceCatalog';
+import {
+  type OrionplaceBrowseState,
+  type OrionplaceBrowseStore,
+} from '@/stores/orionplaceBrowse';
+import {
+  createOrionplaceStores,
+  type OrionplaceStores,
+} from '@/stores/orionplaceScope';
+import type { AppLoadFailure, AppLoadResult } from '@/interfaces/orionplace';
+import type { IAppLoadCommon } from '@/interfaces/orionplace/appBase/IAppLoadCommon';
+import { selectInit } from '@/stores/orionplace';
 
-const OrionplaceContext = createContext<OrionplaceStore | null>(null);
+const OrionplaceContext                   = createContext<OrionplaceStore | null>(null);
+const SelectionsContext                   = createContext<OrionplaceSelectionsStore | null>(null);
+const ProductsContext                     = createContext<OrionplaceProductsStore | null>(null);
+const CatalogContext                      = createContext<OrionplaceCatalogStore | null>(null);
+const BrowseContext                       = createContext<OrionplaceBrowseStore | null>(null);
 
 export interface OrionplaceProviderProps {
   /** The server render's snapshot. Hydration reuses it instead of loading again. */
   result?: AppLoadResult | null;
   failure?: AppLoadFailure | null;
+  locale?: string;
   children: ReactNode;
 }
 
 /** Creates one store for this browser session and keeps it across re-renders. */
-export function OrionplaceProvider({ result = null, failure = null, children }: OrionplaceProviderProps) {
-  const store = useRef<OrionplaceStore>(null);
-  store.current ??= createOrionplaceStore(initialSnapshot(result, failure));
-  return <OrionplaceContext.Provider value={store.current}>{children}</OrionplaceContext.Provider>;
+export function OrionplaceProvider({
+  result  = null,
+  failure = null,
+  locale,
+  children,
+}: OrionplaceProviderProps) {
+  const stores  = useRef<OrionplaceStores>(null);
+  if (!stores.current) {
+    stores.current = createOrionplaceStores(result, failure, locale);
+  }
+
+  const current = stores.current;
+
+  return (
+    <OrionplaceContext.Provider value={current.store}>
+      <SelectionsContext.Provider value={current.selections}>
+        <ProductsContext.Provider value={current.products}>
+          <CatalogContext.Provider value={current.catalog}>
+            <BrowseContext.Provider value={current.browse}>
+              {children}
+            </BrowseContext.Provider>
+          </CatalogContext.Provider>
+        </ProductsContext.Provider>
+      </SelectionsContext.Provider>
+    </OrionplaceContext.Provider>
+  );
+}
+
+export function OrionplaceCatalogSnapshotProvider({
+  snapshot,
+  children,
+}: {
+  snapshot?: NonNullable<IAppLoadCommon['tariffs']>;
+  children: ReactNode;
+}) {
+  const init    = useOrionplace(selectInit);
+  const parent  = useOrionplaceCatalogStore();
+  const catalog = useRef<OrionplaceCatalogStore | null>(null);
+  if (!catalog.current) {
+    catalog.current = createOrionplaceCatalogStore(init);
+    if (snapshot) {
+      catalog.current.getState().setTariffs(snapshot);
+    }
+  }
+  const current = catalog.current;
+  useEffect(() => {
+    current.getState().reconcile(init);
+    if (snapshot) {
+      current.getState().setTariffs(snapshot);
+    }
+  }, [current, init, snapshot]);
+  return (
+    <CatalogContext.Provider value={snapshot ? current : parent}>
+      {children}
+    </CatalogContext.Provider>
+  );
 }
 
 function useStoreApi(): OrionplaceStore {
   const store = useContext(OrionplaceContext);
-  if (!store) throw new Error('Render this component inside <OrionplaceProvider>.');
+  if (!store) {
+    throw new Error('Render this component inside <OrionplaceProvider>.');
+  }
   return store;
 }
 
@@ -36,4 +124,68 @@ export function useOrionplace<T>(selector: (state: OrionplaceState) => T): T {
 }
 
 /** The store itself, for actions and one-off reads outside render. */
-export const useOrionplaceStore = useStoreApi;
+export const useOrionplaceStore           = useStoreApi;
+
+function useSelectionsStoreApi(): OrionplaceSelectionsStore {
+  const store = useContext(SelectionsContext);
+  if (!store) {
+    throw new Error('Render this component inside <OrionplaceProvider>.');
+  }
+  return store;
+}
+
+export function useOrionplaceSelections<T>(
+  selector: (state: OrionplaceSelectionsState) => T,
+): T {
+  return useStore(useSelectionsStoreApi(), selector);
+}
+
+export const useOrionplaceSelectionsStore = useSelectionsStoreApi;
+
+function useProductsStoreApi(): OrionplaceProductsStore {
+  const store = useContext(ProductsContext);
+  if (!store) {
+    throw new Error('Render this component inside <OrionplaceProvider>.');
+  }
+  return store;
+}
+
+export function useOrionplaceProducts<T>(
+  selector: (state: OrionplaceProductsState) => T,
+): T {
+  return useStore(useProductsStoreApi(), selector);
+}
+
+export const useOrionplaceProductsStore   = useProductsStoreApi;
+
+function useCatalogStoreApi(): OrionplaceCatalogStore {
+  const store = useContext(CatalogContext);
+  if (!store) {
+    throw new Error('Render this component inside <OrionplaceProvider>.');
+  }
+  return store;
+}
+
+export function useOrionplaceCatalog<T>(
+  selector: (state: OrionplaceCatalogState) => T,
+): T {
+  return useStore(useCatalogStoreApi(), selector);
+}
+
+export const useOrionplaceCatalogStore    = useCatalogStoreApi;
+
+function useBrowseStoreApi(): OrionplaceBrowseStore {
+  const store = useContext(BrowseContext);
+  if (!store) {
+    throw new Error('Render this component inside <OrionplaceProvider>.');
+  }
+  return store;
+}
+
+export function useOrionplaceBrowse<T>(
+  selector: (state: OrionplaceBrowseState) => T,
+): T {
+  return useStore(useBrowseStoreApi(), selector);
+}
+
+export const useOrionplaceBrowseStore     = useBrowseStoreApi;

package/templates/proxy.ts

@@ -1,12 +1,17 @@
-import { NextResponse } from 'next/server';
+import { NextResponse, type NextRequest } from 'next/server';
 
 /**
  * Personalized pages are never shared between visitors or storefront domains.
  * Next.js manages its own `Vary` header for pages; the API gateway sets the
  * storefront-domain `Vary` on its own responses.
  */
-export function proxy() {
-  const response = NextResponse.next();
+export function proxy(request: NextRequest) {
+  const forwarded = new Headers(request.headers);
+  forwarded.set(
+    'x-orionplace-page-url',
+    request.nextUrl.pathname + request.nextUrl.search,
+  );
+  const response  = NextResponse.next({ request: { headers: forwarded } });
   response.headers.set('Cache-Control', 'private, no-store');
   return response;
 }

package/templates/stores/orionplace.ts

@@ -1,15 +1,28 @@
 import { createStore } from 'zustand/vanilla';
 import type {
-  AppLoadFailure, AppLoadLoader, AppLoadResult, AppLoadStatus,
-  IAppLoad, IAppLoadCommon, IAppLoadCommonCurrency, IAppLoadCommonLocale, IAppLoadCommonTariff,
-  IAppLoadPath, IAppLoadPathObject, IApploadUserProfile, ICategory, IProduct,
-} from '../interfaces/orionplace';
-import { appLoadFailure } from '../lib/orionplace/appLoadResult';
+  AppLoadFailure,
+  AppLoadLoader,
+  AppLoadResult,
+  AppLoadStatus,
+  IAppLoad,
+  IAppLoadCommon,
+  IAppLoadCommonCurrency,
+  IAppLoadCommonLocale,
+  IAppLoadCommonTariff,
+  IAppLoadPath,
+  IAppLoadPathObject,
+  IApploadUserProfile,
+  ICategory,
+  IProduct,
+} from '@/interfaces/orionplace';
+import { appLoadFailure } from '@/lib/orionplace/appLoadResult';
+import { resolveAppLoadProducts } from '@/lib/orionplace/productSeller';
+import { guestAppLoadResult } from '@/lib/orionplace/guestSession';
 
 /** Shared empty values keep selector results referentially stable between renders. */
-const EMPTY_RECORD = Object.freeze({}) as Record<string, never>;
-const EMPTY_LIST   = Object.freeze([]) as readonly never[];
-const EMPTY_PATHS  = Object.freeze({}) as IAppLoadPathObject;
+const EMPTY_RECORD                        = Object.freeze({}) as Record<string, never>;
+const EMPTY_LIST                          = Object.freeze([]) as readonly never[];
+const EMPTY_PATHS                         = Object.freeze({}) as IAppLoadPathObject;
 
 export interface OrionplaceSnapshot {
   result: AppLoadResult | null;
@@ -19,7 +32,14 @@ export interface OrionplaceSnapshot {
 }
 
 export interface OrionplaceState extends OrionplaceSnapshot {
-  load: (loader: AppLoadLoader, force?: boolean) => Promise<void>;
+  load: (
+    loader: AppLoadLoader,
+    force?: boolean,
+    preserve?: boolean,
+  ) => Promise<void>;
+  endSession: (loader: AppLoadLoader) => Promise<void>;
+  patchProfile: (patch: Partial<IApploadUserProfile>) => void;
+  patchWallet: (wallet: NonNullable<IAppLoadCommon['wallet']>) => void;
   reset: () => void;
 }
 
@@ -27,13 +47,19 @@ export type OrionplaceStore = ReturnType<typeof createOrionplaceStore>;
 
 /** Public and authenticated discovery are merged once per snapshot, without mutating the response. */
 function mergeEndpoints(result: AppLoadResult | null): IAppLoadPathObject {
-  const page = result?.response.page_data;
-  if (!page) return EMPTY_PATHS;
+  const page                         = result?.response.page_data;
+  if (!page) {
+    return EMPTY_PATHS;
+  }
   const groups: IAppLoadPathObject[] = [page.unauth.paths];
-  if (page.init.is_authenticated && page.auth) groups.push(page.auth.paths);
+  if (page.init.is_authenticated && page.auth) {
+    groups.push(page.auth.paths);
+  }
   const merged: IAppLoadPathObject   = {};
   for (const group of groups) {
-    for (const [section, paths] of Object.entries(group)) merged[section] = { ...merged[section], ...paths };
+    for (const [section, paths] of Object.entries(group)) {
+      merged[section] = { ...merged[section], ...paths };
+    }
   }
   return merged;
 }
@@ -55,7 +81,9 @@ export function initialSnapshot(
  * One store instance per server render and one per browser session.
  * Creating the store never starts a request; the loaders are passed to `load`.
  */
-export function createOrionplaceStore(snapshot: OrionplaceSnapshot = initialSnapshot()) {
+export function createOrionplaceStore(
+  snapshot: OrionplaceSnapshot = initialSnapshot(),
+) {
   // These belong to this store instance, never serialized state or a module-level cache.
   let pending: Promise<void> | null      = null;
   let controller: AbortController | null = null;
@@ -64,56 +92,191 @@ export function createOrionplaceStore(snapshot: OrionplaceSnapshot = initialSnap
   return createStore<OrionplaceState>()((set, get) => ({
     ...snapshot,
 
+    patchProfile(patch) {
+      set((state) => {
+        const page = state.result?.response.page_data;
+        if (!state.result || !page?.user) {
+          return {};
+        }
+        return {
+          result: {
+            ...state.result,
+            response: {
+              ...state.result.response,
+              page_data: {
+                ...page,
+                user: { ...page.user, ...patch },
+              },
+            },
+          },
+        };
+      });
+    },
+
+    // A purchase changes only the balance: it is replaced in place, without
+    // an Application Load that would unmount the page and its confirmation.
+    patchWallet(wallet) {
+      set((state) => {
+        const page = state.result?.response.page_data;
+        if (!state.result || !page?.init?.is_authenticated) {
+          return {};
+        }
+        return {
+          result: {
+            ...state.result,
+            response: {
+              ...state.result.response,
+              page_data: {
+                ...page,
+                init: { ...page.init, wallet },
+              },
+            },
+          },
+        };
+      });
+    },
+
     reset() {
       generation++;
       controller?.abort();
       controller = null;
       pending    = null;
-      set({ result: null, failure: null, status: 'idle', endpoints: EMPTY_PATHS });
+      set({
+        result: null,
+        failure: null,
+        status: 'idle',
+        endpoints: EMPTY_PATHS,
+      });
     },
 
-    load(loader: AppLoadLoader, force = false): Promise<void> {
-      if (pending) return pending;
+    endSession(loader) {
+      const result = get().result;
+      if (!result?.response.page_data.init.is_authenticated) {
+        return pending ?? Promise.resolve();
+      }
+      generation++;
+      controller?.abort();
+      controller   = null;
+      pending      = null;
+      const guest  = guestAppLoadResult(result);
+      set({ result: guest, endpoints: mergeEndpoints(guest) });
+      return get().load(loader, true, true);
+    },
+
+    load(
+      loader: AppLoadLoader,
+      force = false,
+      preserve = false,
+    ): Promise<void> {
+      if (pending) {
+        return pending;
+      }
       // Reuse both server success and failure after hydration or navigation; retry is explicit.
-      if (!force && get().status !== 'idle') return Promise.resolve();
+      if (!force && get().status !== 'idle') {
+        return Promise.resolve();
+      }
       const current = ++generation;
       controller    = new AbortController();
       const signal  = controller.signal;
-      set({ result: null, failure: null, status: 'pending', endpoints: EMPTY_PATHS });
-      pending       = Promise.resolve().then(() => loader(signal)).then(result => {
-        if (current !== generation) return;
-        set({ result, status: 'success', endpoints: mergeEndpoints(result) });
-      }).catch((error: unknown) => {
-        if (current !== generation) return;
-        set({ failure: appLoadFailure(error), status: 'error' });
-      }).finally(() => {
-        if (current !== generation) return;
-        pending    = null;
-        controller = null;
-      });
+      if (!preserve) {
+        set({
+          result: null,
+          failure: null,
+          status: 'pending',
+          endpoints: EMPTY_PATHS,
+        });
+      }
+      pending       = Promise.resolve()
+        .then(() => loader(signal))
+        .then((result) => {
+          if (current !== generation) {
+            return;
+          }
+          set({
+            result,
+            failure: null,
+            status: 'success',
+            endpoints: mergeEndpoints(result),
+          });
+        })
+        .catch((error: unknown) => {
+          if (current !== generation) {
+            return;
+          }
+          set({
+            result: null,
+            endpoints: EMPTY_PATHS,
+            failure: appLoadFailure(error),
+            status: 'error',
+          });
+        })
+        .finally(() => {
+          if (current !== generation) {
+            return;
+          }
+          pending    = null;
+          controller = null;
+        });
       return pending;
     },
   }));
 }
 
-export const selectIsReady             = (state: OrionplaceSnapshot): boolean => state.status === 'success' && state.result !== null;
-export const selectStatus              = (state: OrionplaceSnapshot): AppLoadStatus => state.status;
-export const selectFailure             = (state: OrionplaceSnapshot): AppLoadFailure | null => state.failure;
-export const selectResult              = (state: OrionplaceSnapshot): AppLoadResult | null => state.result;
-export const selectData                = (state: OrionplaceSnapshot): IAppLoad | null => state.result?.response.page_data ?? null;
-export const selectInit                = (state: OrionplaceSnapshot): IAppLoadCommon | null => selectData(state)?.init ?? null;
-export const selectProfile             = (state: OrionplaceSnapshot): IApploadUserProfile | null => selectData(state)?.user ?? null;
-export const selectIsAuthenticated     = (state: OrionplaceSnapshot): boolean => selectInit(state)?.is_authenticated ?? false;
-export const selectLocales             = (state: OrionplaceSnapshot): Record<string, IAppLoadCommonLocale> => selectInit(state)?.locale ?? EMPTY_RECORD;
-export const selectCurrencies          = (state: OrionplaceSnapshot): Record<string, IAppLoadCommonCurrency> => selectInit(state)?.currencies ?? EMPTY_RECORD;
-export const selectCatalog             = (state: OrionplaceSnapshot): readonly ICategory[] => selectInit(state)?.catalog ?? EMPTY_LIST;
-export const selectProducts            = (state: OrionplaceSnapshot): readonly IProduct[] => selectInit(state)?.products ?? EMPTY_LIST;
-export const selectTariffs             = (state: OrionplaceSnapshot): IAppLoadCommonTariff | null => selectInit(state)?.tariffs ?? null;
-export const selectPublicEndpoints     = (state: OrionplaceSnapshot): IAppLoadPathObject => selectData(state)?.unauth.paths ?? EMPTY_PATHS;
-export const selectEndpoints           = (state: OrionplaceSnapshot): IAppLoadPathObject => state.endpoints;
-export const selectAuthenticatedEndpoints = (state: OrionplaceSnapshot): IAppLoadPathObject =>
-  selectIsAuthenticated(state) ? selectData(state)?.auth?.paths ?? EMPTY_PATHS : EMPTY_PATHS;
+export const selectIsReady                = (state: OrionplaceSnapshot): boolean =>
+  state.status === 'success' && state.result !== null;
+export const selectStatus                 = (state: OrionplaceSnapshot): AppLoadStatus =>
+  state.status;
+export const selectFailure                = (
+  state: OrionplaceSnapshot,
+): AppLoadFailure | null => state.failure;
+export const selectResult                 = (state: OrionplaceSnapshot): AppLoadResult | null =>
+  state.result;
+export const selectData                   = (state: OrionplaceSnapshot): IAppLoad | null =>
+  state.result?.response.page_data ?? null;
+export const selectInit                   = (state: OrionplaceSnapshot): IAppLoadCommon | null =>
+  selectData(state)?.init ?? null;
+export const selectProfile                = (
+  state: OrionplaceSnapshot,
+): IApploadUserProfile | null => selectData(state)?.user ?? null;
+export const selectIsAuthenticated        = (state: OrionplaceSnapshot): boolean =>
+  selectInit(state)?.is_authenticated ?? false;
+export const selectLocales                = (
+  state: OrionplaceSnapshot,
+): Record<string, IAppLoadCommonLocale> =>
+  selectInit(state)?.locale ?? EMPTY_RECORD;
+export const selectCurrencies             = (
+  state: OrionplaceSnapshot,
+): Record<string, IAppLoadCommonCurrency> =>
+  selectInit(state)?.currencies ?? EMPTY_RECORD;
+export const selectCatalog                = (
+  state: OrionplaceSnapshot,
+): readonly ICategory[] => selectInit(state)?.catalog ?? EMPTY_LIST;
+export const selectProducts               = (
+  state: OrionplaceSnapshot,
+): readonly IProduct[] => {
+  const init = selectInit(state);
+  return init
+    ? resolveAppLoadProducts(init.products, init.sellers)
+    : EMPTY_LIST;
+};
+export const selectTariffs                = (
+  state: OrionplaceSnapshot,
+): IAppLoadCommonTariff | null => selectInit(state)?.tariffs ?? null;
+export const selectPublicEndpoints        = (
+  state: OrionplaceSnapshot,
+): IAppLoadPathObject => selectData(state)?.unauth.paths ?? EMPTY_PATHS;
+export const selectEndpoints              = (
+  state: OrionplaceSnapshot,
+): IAppLoadPathObject => state.endpoints;
+export const selectAuthenticatedEndpoints = (
+  state: OrionplaceSnapshot,
+): IAppLoadPathObject =>
+  selectIsAuthenticated(state)
+    ? (selectData(state)?.auth?.paths ?? EMPTY_PATHS)
+    : EMPTY_PATHS;
 
 /** Live discovery describes availability; the backend still checks permissions on every call. */
-export const selectEndpoint = (section: string, name: string) =>
-  (state: OrionplaceSnapshot): IAppLoadPath | undefined => state.endpoints[section]?.[name];
+export const selectEndpoint               =
+  (section: string, name: string) =>
+  (state: OrionplaceSnapshot): IAppLoadPath | undefined =>
+    state.endpoints[section]?.[name];

package/templates/stores/orionplaceBrowse.ts

@@ -0,0 +1,89 @@
+import { createStore } from 'zustand/vanilla';
+import type { IAppLoadCommon } from '@/interfaces/orionplace';
+import type { IBlogPostPreview } from '@/interfaces/orionplace/blog/IBlogPostPreview';
+import type {
+  IProductSearchFacets,
+  ProductFacetSelection,
+} from '@/interfaces/orionplace/products/IProductSearchFacets';
+import {
+  cloneSearchFilters,
+  initialSearchFacets,
+} from '@/lib/orionplace/searchFilters';
+
+export interface OrionplaceBrowseState {
+  init: IAppLoadCommon | null;
+  searchQuery: string;
+  searchFacets: IProductSearchFacets | null;
+  searchFilters: ProductFacetSelection;
+  blogPosts: IBlogPostPreview[];
+  setSearchQuery: (value: string) => void;
+  setSearchFacets: (value: IProductSearchFacets | null) => void;
+  preserveSearchFacets: (value: IProductSearchFacets) => void;
+  setSearchFilters: (value: ProductFacetSelection) => void;
+  setBlogPosts: (value: IBlogPostPreview[]) => void;
+  resetResults: () => void;
+  reconcile: (init: IAppLoadCommon | null) => void;
+  reset: () => void;
+}
+
+export type OrionplaceBrowseStore = ReturnType<
+  typeof createOrionplaceBrowseStore
+>;
+
+const emptyResults = () => ({
+  searchFacets: null,
+  searchFilters: {},
+  blogPosts: [],
+}) satisfies Pick<
+  OrionplaceBrowseState,
+  'searchFacets' | 'searchFilters' | 'blogPosts'
+>;
+
+/** Search choices and journal results loaded after Application Load. */
+export function createOrionplaceBrowseStore(
+  init: IAppLoadCommon | null = null,
+) {
+  return createStore<OrionplaceBrowseState>()((set, get) => ({
+    init,
+    searchQuery: '',
+    ...emptyResults(),
+
+    setSearchQuery(value) {
+      set({ searchQuery: value });
+    },
+
+    setSearchFacets(value) {
+      set({ searchFacets: value });
+    },
+
+    preserveSearchFacets(value) {
+      set((state) => ({
+        searchFacets: initialSearchFacets(state.searchFacets, value),
+      }));
+    },
+
+    setSearchFilters(value) {
+      const selected = cloneSearchFilters(value);
+      if (get().init?.visual_settings?.single_seller_mode) {
+        delete selected.product_owner;
+      }
+      set({ searchFilters: selected });
+    },
+
+    setBlogPosts(value) {
+      set({ blogPosts: [...value] });
+    },
+
+    resetResults() {
+      set(emptyResults());
+    },
+
+    reconcile(next) {
+      set({ init: next });
+    },
+
+    reset() {
+      set({ init: null, searchQuery: '', ...emptyResults() });
+    },
+  }));
+}