store

Use store when you need the settings of the whole storefront: the store profile, theme settings, languages, currencies and external services. In a theme you rarely call it: the engine fetches it first on every page, and useStore and useTheme read the result.

import { useSuspenseQuery } from '@tanstack/react-query';
import { store } from '@salla.sa/twilight-theme-engine/api/store';

export function StoreName() {
  const { data } = useSuspenseQuery(store.queries.settings());
  return <span>{data?.store?.name}</span>;
}

MethodsCopy Anchor Link

StoreContext has store, theme, languages (an array), currencies, external_services, headers, login, affiliate, policy_url and user (always the guest object; the endpoint ignores the token). The request asks for these includes: store, settings, theme, theme_settings, external_services, currencies, languages, payments, product_widgets, rating, ratings, user. The scope parameter is added only when a scope is active.

QueriesCopy Anchor Link

store.queries.settings(storeIdentifier?) has this key:

['store', 'settings', storeIdentifier, locale, activeScope, requestedThemeVersionId]

• The locale and the active scope (the customer's market and branch) are included.
• The theme version is the one the request asked for, so the key is the same on the server and in the browser.
• storeIdentifier is whatever you passed, undefined by default.

GotchasCopy Anchor Link

• Errors are swallowed. Any failure (network, non-2xx, timeout) is logged and the method returns null; an empty data also gives null. It does not throw.
• No store identifier. It logs a warning and returns null without calling the API.
• Explicit identifier. If you pass one, it is sent in the store-identifier header, so the store you checked is the store asked. See Authentication and scope.
• Timeout. This call waits 5 seconds, not the client's usual 8.
• Languages. The API returns languages as an object. The module converts them to an array and adds iso_code from code.
• Guests. No token is required.

See alsoCopy Anchor Link

• useStore and useTheme
• Settings guide
• translations