@shopify/hydrogen-react
Version:
React components, hooks, and utilities for creating custom Shopify storefronts
93 lines (92 loc) • 3.51 kB
JavaScript
import { jsx } from "react/jsx-runtime";
import { useMemo, useContext, createContext } from "react";
import { SFAPI_VERSION } from "./storefront-api-constants.mjs";
import { getPublicTokenHeadersRaw } from "./storefront-client.mjs";
const defaultShopifyContext = {
storeDomain: "test",
storefrontToken: "abc123",
storefrontApiVersion: SFAPI_VERSION,
countryIsoCode: "US",
languageIsoCode: "EN",
getStorefrontApiUrl() {
return "";
},
getPublicTokenHeaders() {
return {};
},
getShopifyDomain() {
return "";
}
};
const ShopifyContext = createContext(
defaultShopifyContext
);
function isSfapiProxyEnabled() {
var _a, _b, _c;
if (typeof window === "undefined") return false;
try {
const navigationEntry = (_b = (_a = window.performance) == null ? void 0 : _a.getEntriesByType) == null ? void 0 : _b.call(
_a,
"navigation"
)[0];
return !!((_c = navigationEntry == null ? void 0 : navigationEntry.serverTiming) == null ? void 0 : _c.some(
(entry) => entry.name === "_sfapi_proxy"
));
} catch (e) {
return false;
}
}
function ShopifyProvider({
children,
...shopifyConfig
}) {
if (!shopifyConfig.countryIsoCode || !shopifyConfig.languageIsoCode || !shopifyConfig.storeDomain || !shopifyConfig.storefrontToken || !shopifyConfig.storefrontApiVersion) {
throw new Error(
`Please provide the necessary props to '<ShopifyProvider/>'`
);
}
if (shopifyConfig.storefrontApiVersion !== SFAPI_VERSION) {
console.warn(
`<ShopifyProvider/>: This version of Hydrogen React is built for Shopify's Storefront API version ${SFAPI_VERSION}, but it looks like you're using version ${shopifyConfig.storefrontApiVersion}. There may be issues or bugs if you use a mismatched version of Hydrogen React and the Storefront API.`
);
}
const finalConfig = useMemo(() => {
const sameDomainForStorefrontApi = shopifyConfig.sameDomainForStorefrontApi ?? isSfapiProxyEnabled();
function getShopifyDomain(overrideProps) {
const domain = (overrideProps == null ? void 0 : overrideProps.storeDomain) ?? shopifyConfig.storeDomain;
return domain.includes("://") ? domain : `https://${domain}`;
}
return {
...shopifyConfig,
sameDomainForStorefrontApi,
getPublicTokenHeaders(overrideProps) {
return getPublicTokenHeadersRaw(
overrideProps.contentType,
shopifyConfig.storefrontApiVersion,
overrideProps.storefrontToken ?? shopifyConfig.storefrontToken
);
},
getShopifyDomain,
getStorefrontApiUrl(overrideProps) {
const finalDomainUrl = sameDomainForStorefrontApi && typeof window !== "undefined" ? window.location.origin : getShopifyDomain({
storeDomain: (overrideProps == null ? void 0 : overrideProps.storeDomain) ?? shopifyConfig.storeDomain
});
return `${finalDomainUrl}${finalDomainUrl.endsWith("/") ? "" : "/"}api/${(overrideProps == null ? void 0 : overrideProps.storefrontApiVersion) ?? shopifyConfig.storefrontApiVersion}/graphql.json`;
}
};
}, [shopifyConfig]);
return /* @__PURE__ */ jsx(ShopifyContext.Provider, { value: finalConfig, children });
}
function useShop() {
const shopContext = useContext(ShopifyContext);
if (!shopContext) {
throw new Error(`'useShop()' must be a descendent of <ShopifyProvider/>`);
}
return shopContext;
}
export {
ShopifyProvider,
defaultShopifyContext,
useShop
};
//# sourceMappingURL=ShopifyProvider.mjs.map