@pack/hydrogen 0.1.2 → 0.2.0-ab-beta.1

package/dist/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const PACK_COOKIE_ID = "__pack";
+export declare const PACK_COOKIE_MAX_AGE: number;
+//# sourceMappingURL=constants.d.ts.map

package/dist/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,cAAc,WAAW,CAAC;AACvC,eAAO,MAAM,mBAAmB,QAAyB,CAAC"}

package/dist/constants.js

@@ -0,0 +1,2 @@
+export const PACK_COOKIE_ID = "__pack";
+export const PACK_COOKIE_MAX_AGE = 60 * 60 * 24 * 360 * 1; // 1 year

package/dist/create-pack-client.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="@shopify/oxygen-workers-types" />
 import { PackClient } from "@pack/client";
 import { CacheCustom } from "@shopify/hydrogen";
-import { PreviewSession } from "./preview/preview-session";
+import { PackSession } from "./session/session";
+import { Test, TestInput } from "./tests/test";
 /** @see https://shopify.dev/docs/custom-storefronts/hydrogen/data-fetching/cache#caching-strategies */
 type CachingStrategy = ReturnType<typeof CacheCustom>;
 interface EnvironmentOptions {
@@ -16,20 +17,25 @@ interface EnvironmentOptions {
      */
     waitUntil: ExecutionContext["waitUntil"];
 }
-interface CreatePackClientOptions extends EnvironmentOptions {
+export interface CreatePackClientOptions extends EnvironmentOptions {
     apiUrl?: string;
     token?: string;
+    contentEnvironment?: string;
+}
+interface PackClientOptions extends EnvironmentOptions {
+    apiUrl?: string;
+    token?: string;
+    session: PackSession;
     preview?: {
-        session: PreviewSession;
+        session: PackSession;
     };
     contentEnvironment?: string;
-    /** Default theme data to use when no token is provided */
-    defaultThemeData?: DefaultThemeData;
 }
 type Variables = Record<string, any>;
 interface QueryOptions {
     variables?: Variables;
     cache?: CachingStrategy;
+    test?: TestInput;
 }
 interface QueryError {
     message: string;
@@ -43,15 +49,21 @@ interface QueryResponse<T> {
 }
 export interface Pack {
     isPreviewModeEnabled: () => boolean;
+    session: PackSession;
     preview?: {
-        session: PreviewSession;
+        session: PackSession;
     };
+    abTest: Test | null | undefined;
+    setRequestAbTest: (request: Request) => void;
     query: <T = any>(query: string, options?: QueryOptions) => Promise<QueryResponse<T>>;
     isValidEditToken: PackClient["isValidEditToken"];
+    getRootLoaderData(): {
+        sessionId: string;
+        abTest: Test | null | undefined;
+        isPreviewModeEnabled: boolean;
+        customizerMeta: any;
+    };
 }
-interface DefaultThemeData {
-    data: Record<string, any>;
-}
-export declare function createPackClient(options: CreatePackClientOptions): Pack;
+export declare function createPackClient(options: PackClientOptions): Pack;
 export {};
 //# sourceMappingURL=create-pack-client.d.ts.map

package/dist/create-pack-client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create-pack-client.d.ts","sourceRoot":"","sources":["../src/create-pack-client.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAmB,MAAM,mBAAmB,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAE3D,uGAAuG;AACvG,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAEtD,UAAU,kBAAkB;IAC1B;;;OAGG;IACH,KAAK,EAAE,KAAK,CAAC;IACb;;;OAGG;IACH,SAAS,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAC;CAC1C;AAED,UAAU,uBAAwB,SAAQ,kBAAkB;IAC1D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE;QACR,OAAO,EAAE,cAAc,CAAC;KACzB,CAAC;IACF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;CACrC;AAED,KAAK,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AAErC,UAAU,YAAY;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,eAAe,CAAC;CACzB;AAED,UAAU,UAAU;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd;AAED,UAAU,aAAa,CAAC,CAAC;IACvB,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;IACf,KAAK,EAAE,UAAU,GAAG,IAAI,CAAC;CAC1B;AAED,MAAM,WAAW,IAAI;IACnB,oBAAoB,EAAE,MAAM,OAAO,CAAC;IACpC,OAAO,CAAC,EAAE;QACR,OAAO,EAAE,cAAc,CAAC;KACzB,CAAC;IACF,KAAK,EAAE,CAAC,CAAC,GAAG,GAAG,EACb,KAAK,EAAE,MAAM,EACb,OAAO,CAAC,EAAE,YAAY,KACnB,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC;IAC/B,gBAAgB,EAAE,UAAU,CAAC,kBAAkB,CAAC,CAAC;CAClD;AAED,UAAU,gBAAgB;IACxB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAC3B;AAsFD,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,uBAAuB,GAAG,IAAI,CAwFvE"}
+{"version":3,"file":"create-pack-client.d.ts","sourceRoot":"","sources":["../src/create-pack-client.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAmB,MAAM,mBAAmB,CAAC;AAEjE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAKL,IAAI,EACJ,SAAS,EACV,MAAM,cAAc,CAAC;AAEtB,uGAAuG;AACvG,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAEtD,UAAU,kBAAkB;IAC1B;;;OAGG;IACH,KAAK,EAAE,KAAK,CAAC;IACb;;;OAGG;IACH,SAAS,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAC;CAC1C;AAED,MAAM,WAAW,uBAAwB,SAAQ,kBAAkB;IACjE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,UAAU,iBAAkB,SAAQ,kBAAkB;IACpD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,CAAC,EAAE;QACR,OAAO,EAAE,WAAW,CAAC;KACtB,CAAC;IACF,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,KAAK,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AAErC,UAAU,YAAY;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,UAAU,UAAU;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd;AAED,UAAU,aAAa,CAAC,CAAC;IACvB,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;IACf,KAAK,EAAE,UAAU,GAAG,IAAI,CAAC;CAC1B;AAED,MAAM,WAAW,IAAI;IACnB,oBAAoB,EAAE,MAAM,OAAO,CAAC;IACpC,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,CAAC,EAAE;QACR,OAAO,EAAE,WAAW,CAAC;KACtB,CAAC;IACF,MAAM,EAAE,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;IAChC,gBAAgB,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,KAAK,EAAE,CAAC,CAAC,GAAG,GAAG,EACb,KAAK,EAAE,MAAM,EACb,OAAO,CAAC,EAAE,YAAY,KACnB,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC;IAC/B,gBAAgB,EAAE,UAAU,CAAC,kBAAkB,CAAC,CAAC;IACjD,iBAAiB,IAAI;QACnB,SAAS,EAAE,MAAM,CAAC;QAClB,MAAM,EAAE,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;QAChC,oBAAoB,EAAE,OAAO,CAAC;QAC9B,cAAc,EAAE,GAAG,CAAC;KACrB,CAAC;CACH;AAwCD,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,iBAAiB,GAAG,IAAI,CAiHjE"}

package/dist/create-pack-client.js

@@ -1,5 +1,6 @@
 import { PackClient } from "@pack/client";
 import { CacheCustom, createWithCache } from "@shopify/hydrogen";
+import { getTestInfo, setTestHeaders, getTestSession, setRequestAbTest, } from "./tests/test";
 /**
  * Create an SHA-256 hash as a hex string
  * @see https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto/digest#converting_a_digest_to_a_hex_string
@@ -18,10 +19,12 @@ async function sha256(message) {
  * Hash query and its parameters for use as cache key.
  * NOTE: Oxygen deployment will break if the cache key is long or contains `\n`
  */
-function hashQuery(query, variables) {
+function hashQuery(query, variables, headers) {
     let hash = query;
     if (variables !== null)
         hash += JSON.stringify(variables);
+    if (headers !== null)
+        hash += JSON.stringify(headers);
     return sha256(hash);
 }
 // Extends the CacheLong strategy with a stale-if-error policy
@@ -30,83 +33,57 @@ const cacheCustom = CacheCustom({
     staleWhileRevalidate: 82800,
     staleIfError: 86400, // 1 day
 });
-/** Resolves the default data for a given query based on the theme config */
-function resolveQuery({ query, variables, defaultThemeData, }) {
-    const queryField = extractTopLevelField(query);
-    const identifier = variables?.handle || variables?.id;
-    const defaultDataForField = defaultThemeData.data[queryField];
-    if (!defaultDataForField) {
-        return null;
-    }
-    return {
-        [queryField]: identifier
-            ? defaultDataForField[identifier]
-            : defaultDataForField,
-    };
-}
-/**
- * Extracts the top-level field from a GraphQL query string.
- *
- * The function assumes that the query follows the standard GraphQL syntax
- * and expects the top-level field to be the first field in the query.
- *
- * @example
- * const query = `
- *   query GetProduct($id: ID!) {
- *     product(id: $id) {
- *       id
- *       name
- *     }
- *   }
- * `;
- * const topLevelField = extractTopLevelField(query);
- * console.log(topLevelField); // Output: "product"
- */
-function extractTopLevelField(query) {
-    const match = query.match(/\{[^{]*?\w+(?=\(|:|\s*\{)/);
-    if (match) {
-        return match[0].slice(1).trim();
-    }
-    return "";
-}
 export function createPackClient(options) {
-    const { cache, waitUntil, preview, contentEnvironment, token, apiUrl, defaultThemeData, } = options;
+    const { cache, waitUntil, session, preview, contentEnvironment, token, apiUrl, } = options;
     const previewEnabled = !!preview?.session.get("enabled");
     const previewEnvironment = preview?.session.get("environment");
+    let requestAbTest = null;
     const clientContentEnvironment = previewEnvironment || contentEnvironment;
-    if (!token && !defaultThemeData) {
-        throw new Error("The Pack client token is missing or empty. Please provide a valid token or default theme data.");
-    }
-    if (!token) {
-        return {
-            preview,
-            isPreviewModeEnabled: () => previewEnabled,
-            async query(query, { variables } = {}) {
-                if (!defaultThemeData?.data) {
-                    console.warn("Invalid default theme data provided to Pack client.");
-                    return { data: null, error: null };
-                }
-                const data = resolveQuery({ query, variables, defaultThemeData });
-                return { data: data, error: null };
-            },
-            isValidEditToken: () => new Promise(() => false),
-        };
-    }
     const packClient = new PackClient({
-        // Use live API URL if preview mode is enabled
-        apiUrl: previewEnabled ? "https://app.packdigital.com/graphql" : apiUrl,
-        token,
+        // Use apiUrl, it is configured
+        // Use active API URL if preview mode is enabled
+        // Otherwise, Live PackClient uses its internal configuration
+        apiUrl: apiUrl
+            ? apiUrl
+            : previewEnabled
+                ? "https://app.packdigital.com/graphql"
+                : undefined,
+        token: token || "",
         contentEnvironment: clientContentEnvironment,
+        sessionId: session.id,
+    });
+    const getTestVariantPromise = getTestInfo({
+        packClient,
+        session,
     });
     return {
+        session,
         preview,
+        abTest: getTestSession(session, requestAbTest, previewEnabled),
+        setRequestAbTest: (request) => {
+            requestAbTest = setRequestAbTest(request);
+        },
         isPreviewModeEnabled: () => previewEnabled,
-        async query(query, { variables, cache: strategy = cacheCustom } = {}) {
-            const queryHash = await hashQuery(query, variables);
+        async query(query, { variables, cache: strategy = cacheCustom, test } = {}) {
             const withCache = createWithCache({
                 cache,
                 waitUntil,
             });
+            let headers = {};
+            headers = await setTestHeaders(headers, {
+                test: requestAbTest || test,
+                previewEnabled,
+                sessionTest: await (async () => {
+                    try {
+                        return await getTestVariantPromise;
+                    }
+                    catch (e) {
+                        console.error(e);
+                    }
+                    return undefined;
+                })(),
+            });
+            const queryHash = await hashQuery(query, variables, headers);
             const queryVariables = variables ? { ...variables } : {};
             if (previewEnabled) {
                 queryVariables.version = "CURRENT";
@@ -117,7 +94,10 @@ export function createPackClient(options) {
             // Preview mode always bypasses the cache
             if (previewEnabled) {
                 try {
-                    return await packClient.fetch(query, { variables: queryVariables });
+                    return await packClient.fetch(query, {
+                        variables: queryVariables,
+                        headers: headers,
+                    });
                 }
                 catch (error) {
                     return { error, data: {} };
@@ -125,7 +105,10 @@ export function createPackClient(options) {
             }
             return withCache(queryHash, strategy, async () => {
                 try {
-                    return await packClient.fetch(query, { variables: queryVariables });
+                    return await packClient.fetch(query, {
+                        variables: queryVariables,
+                        headers: headers,
+                    });
                 }
                 catch (error) {
                     return { error, data: {} };
@@ -133,5 +116,13 @@ export function createPackClient(options) {
             });
         },
         isValidEditToken: (token) => packClient.isValidEditToken(token),
+        getRootLoaderData: () => {
+            return {
+                sessionId: session.id,
+                abTest: getTestSession(session, requestAbTest, previewEnabled),
+                isPreviewModeEnabled: previewEnabled,
+                customizerMeta: preview?.session.get("customizerMeta"),
+            };
+        },
     };
 }

package/dist/index.d.ts

@@ -1,5 +1,8 @@
-import { Pack, createPackClient } from "./create-pack-client";
-import { PreviewSession } from "./preview/preview-session";
+import { createRequestHandler } from "./server";
+import { Pack } from "./create-pack-client";
+import { PackSession } from "./session/session";
+import { useAbTest, useAbTestHandle, useAbTestId, useAbTestSessionId, useAbTestVariantHandle, useAbTestVariantId } from "./tests/testHooks";
+import { usePackCookies } from "./session/usePackCookies";
 import { action as previewModeAction, loader as previewModeLoader } from "./preview/preview-mode";
-export { type Pack, createPackClient, PreviewSession, previewModeAction, previewModeLoader, };
+export { type Pack, usePackCookies, createRequestHandler, PackSession, previewModeAction, previewModeLoader, useAbTest, useAbTestId, useAbTestHandle, useAbTestSessionId, useAbTestVariantId, useAbTestVariantHandle, };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EACL,MAAM,IAAI,iBAAiB,EAC3B,MAAM,IAAI,iBAAiB,EAC5B,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EACL,KAAK,IAAI,EACT,gBAAgB,EAChB,cAAc,EACd,iBAAiB,EACjB,iBAAiB,GAClB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EACL,SAAS,EACT,eAAe,EACf,WAAW,EACX,kBAAkB,EAClB,sBAAsB,EACtB,kBAAkB,EACnB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EACL,MAAM,IAAI,iBAAiB,EAC3B,MAAM,IAAI,iBAAiB,EAC5B,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EACL,KAAK,IAAI,EACT,cAAc,EACd,oBAAoB,EACpB,WAAW,EACX,iBAAiB,EACjB,iBAAiB,EACjB,SAAS,EACT,WAAW,EACX,eAAe,EACf,kBAAkB,EAClB,kBAAkB,EAClB,sBAAsB,GACvB,CAAC"}

package/dist/index.js

@@ -1,4 +1,6 @@
-import { createPackClient } from "./create-pack-client";
-import { PreviewSession } from "./preview/preview-session";
+import { createRequestHandler } from "./server";
+import { PackSession } from "./session/session";
+import { useAbTest, useAbTestHandle, useAbTestId, useAbTestSessionId, useAbTestVariantHandle, useAbTestVariantId, } from "./tests/testHooks";
+import { usePackCookies } from "./session/usePackCookies";
 import { action as previewModeAction, loader as previewModeLoader, } from "./preview/preview-mode";
-export { createPackClient, PreviewSession, previewModeAction, previewModeLoader, };
+export { usePackCookies, createRequestHandler, PackSession, previewModeAction, previewModeLoader, useAbTest, useAbTestId, useAbTestHandle, useAbTestSessionId, useAbTestVariantId, useAbTestVariantHandle, };

package/dist/server.d.ts

@@ -0,0 +1,13 @@
+import { type ServerBuild } from "@remix-run/server-runtime";
+import { CreatePackClientOptions } from "./create-pack-client";
+export declare function createRequestHandler<Context = unknown>({ request, env, build, mode, getLoadContext, packClientOptions, }: {
+    request: Request;
+    env?: {
+        [key: string]: any;
+    };
+    build: ServerBuild;
+    mode?: string;
+    getLoadContext?: (request: Request) => Promise<Context> | Context;
+    packClientOptions: CreatePackClientOptions;
+}): Promise<(request: Request) => Promise<Response>>;
+//# sourceMappingURL=server.d.ts.map

package/dist/server.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../src/server.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAEL,uBAAuB,EACxB,MAAM,sBAAsB,CAAC;AAI9B,wBAAsB,oBAAoB,CAAC,OAAO,GAAG,OAAO,EAAE,EAC5D,OAAO,EACP,GAAG,EACH,KAAK,EACL,IAAI,EACJ,cAAc,EACd,iBAAiB,GAClB,EAAE;IACD,OAAO,EAAE,OAAO,CAAC;IACjB,GAAG,CAAC,EAAE;QACJ,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;KACpB,CAAC;IACF,KAAK,EAAE,WAAW,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,OAAO,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC;IAClE,iBAAiB,EAAE,uBAAuB,CAAC;CAC5C,qBAkBwB,OAAO,wBAiC/B"}

package/dist/server.js

@@ -0,0 +1,49 @@
+import { createRequestHandler as createRemixRequestHandler } from "@shopify/remix-oxygen";
+import { createPackClient, } from "./create-pack-client";
+import { PackSession } from "./session/session";
+import { usePacklytics } from "@pack/packlytics";
+export async function createRequestHandler({ request, env, build, mode, getLoadContext, packClientOptions, }) {
+    /**
+     * Open a cache instance in the worker and a custom session instance.
+     */
+    if (!env?.SESSION_SECRET) {
+        throw new Error("SESSION_SECRET environment variable is not set");
+    }
+    const packSession = await PackSession.init(request, [env.SESSION_SECRET]);
+    const pack = createPackClient({
+        ...packClientOptions,
+        token: env.PACK_SECRET_TOKEN,
+        session: packSession,
+        preview: { session: packSession },
+        contentEnvironment: env.PACK_CONTENT_ENVIRONMENT,
+    });
+    return async (request) => {
+        pack.setRequestAbTest(request);
+        /**
+         * Create a Remix request handler and pass
+         * Hydrogen's Storefront client to the loader context.
+         */
+        const handleRequest = createRemixRequestHandler({
+            build: build,
+            mode: mode,
+            poweredByHeader: false,
+            getLoadContext: async (request) => ({
+                ...(getLoadContext ? getLoadContext(request) : {}),
+                pack,
+            }),
+        });
+        // We need this,
+        // because once the handleRequest return
+        // remix kills all processes, and if this happens we lost our page-hit.
+        const [response, _] = await Promise.all([
+            handleRequest(request),
+            usePacklytics(request, pack, {
+                storeFrontId: env.PACK_STOREFRONT_ID,
+                sessionSecret: env.SESSION_SECRET,
+            }),
+        ]);
+        response.headers.append("powered-by", "Shopify, Hydrogen + Pack Digital");
+        response.headers.append("Set-Cookie", await packSession.commit());
+        return response;
+    };
+}

package/dist/session/cookies-utils.d.ts

@@ -0,0 +1,13 @@
+/**
+ * This will generate a random UUID
+ * This is not based on user data,
+ * This is based on a random number generator using crypto or math.random
+ *
+ * This UUID is used to generate a session ID for the session cookie
+ *
+ * We can never use this id to trace back users for GDPR compliance.
+ *
+ */
+export declare function buildRandomUUID(): string;
+export declare function hexTime(): string;
+//# sourceMappingURL=cookies-utils.d.ts.map

package/dist/session/cookies-utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cookies-utils.d.ts","sourceRoot":"","sources":["../../src/session/cookies-utils.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AACH,wBAAgB,eAAe,IAAI,MAAM,CA8BxC;AAED,wBAAgB,OAAO,IAAI,MAAM,CAoBhC"}

package/dist/session/cookies-utils.js

@@ -0,0 +1,58 @@
+const tokenHash = "xxxx-4xxx-xxxx-xxxxxxxxxxxx";
+/**
+ * This will generate a random UUID
+ * This is not based on user data,
+ * This is based on a random number generator using crypto or math.random
+ *
+ * This UUID is used to generate a session ID for the session cookie
+ *
+ * We can never use this id to trace back users for GDPR compliance.
+ *
+ */
+export function buildRandomUUID() {
+    let hash = "";
+    try {
+        const crypto = window.crypto;
+        const randomValuesArray = new Uint16Array(31);
+        crypto.getRandomValues(randomValuesArray);
+        // Generate a strong UUID
+        let i = 0;
+        hash = tokenHash
+            .replace(/[x]/g, (c) => {
+            const r = randomValuesArray[i] % 16;
+            const v = c === "x" ? r : (r & 0x3) | 0x8;
+            i++;
+            return v.toString(16);
+        })
+            .toUpperCase();
+    }
+    catch (err) {
+        // crypto not available, generate weak UUID
+        hash = tokenHash
+            .replace(/[x]/g, (c) => {
+            const r = (Math.random() * 16) | 0;
+            const v = c === "x" ? r : (r & 0x3) | 0x8;
+            return v.toString(16);
+        })
+            .toUpperCase();
+    }
+    return `${hexTime()}-${hash}`;
+}
+export function hexTime() {
+    // 32 bit representations of new Date().getTime() and performance.now()
+    let dateNumber = 0;
+    let perfNumber = 0;
+    // Result of zero-fill right shift is always positive
+    dateNumber = new Date().getTime() >>> 0;
+    try {
+        perfNumber = performance.now() >>> 0;
+    }
+    catch (err) {
+        perfNumber = 0;
+    }
+    const output = Math.abs(dateNumber + perfNumber)
+        .toString(16)
+        .toLowerCase();
+    // Ensure the output is exactly 8 characters
+    return output.padStart(8, "0");
+}

package/dist/session/session.d.ts

@@ -0,0 +1,13 @@
+import { type Session, type SessionStorage } from "@shopify/remix-oxygen";
+export declare class PackSession {
+    #private;
+    readonly id: string;
+    constructor(id: string, sessionStorage: SessionStorage, session: Session);
+    static init(request: Request, secrets: string[]): Promise<PackSession>;
+    has(key: string): boolean;
+    get(key: string): any;
+    destroy(): Promise<string>;
+    set(key: string, value: any): void;
+    commit(): Promise<string>;
+}
+//# sourceMappingURL=session.d.ts.map

package/dist/session/session.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"session.d.ts","sourceRoot":"","sources":["../../src/session/session.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,OAAO,EACZ,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAC;AAI/B,qBAAa,WAAW;;IACtB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;gBAMR,EAAE,EAAE,MAAM,EAAE,cAAc,EAAE,cAAc,EAAE,OAAO,EAAE,OAAO;WAM3D,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,WAAW,CAAC;IAsB5E,GAAG,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO;IAIzB,GAAG,CAAC,GAAG,EAAE,MAAM;IAIf,OAAO,IAAI,OAAO,CAAC,MAAM,CAAC;IAI1B,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAIlC,MAAM,IAAI,OAAO,CAAC,MAAM,CAAC;CAG1B"}

package/dist/{preview/preview-session.js → session/session.js}

@@ -1,22 +1,31 @@
-import { createCookieSessionStorage, } from '@shopify/remix-oxygen';
-export class PreviewSession {
-    #sessionStorage;
+import { createCookie, createCookieSessionStorage, } from "@shopify/remix-oxygen";
+import { PACK_COOKIE_ID, PACK_COOKIE_MAX_AGE } from "../constants";
+import { buildRandomUUID } from "./cookies-utils";
+export class PackSession {
+    id;
     #session;
-    constructor(sessionStorage, session) {
-        this.#sessionStorage = sessionStorage;
+    #sessionStorage;
+    constructor(id, sessionStorage, session) {
+        this.id = id;
         this.#session = session;
+        this.#sessionStorage = sessionStorage;
     }
     static async init(request, secrets) {
         const storage = createCookieSessionStorage({
-            cookie: {
-                name: '__preview',
-                sameSite: 'none',
+            cookie: createCookie(PACK_COOKIE_ID, {
                 secure: true,
                 secrets,
-            },
+                sameSite: "none",
+                maxAge: PACK_COOKIE_MAX_AGE,
+            }),
         });
-        const session = await storage.getSession(request.headers.get('Cookie'));
-        return new this(storage, session);
+        const session = await storage.getSession(request.headers.get("Cookie"));
+        let sessionId = session.get("session_id");
+        if (!sessionId) {
+            sessionId = buildRandomUUID();
+            session.set("session_id", sessionId);
+        }
+        return new this(sessionId, storage, session);
     }
     has(key) {
         return this.#session.has(key);

package/dist/session/usePackCookies.d.ts

@@ -0,0 +1,15 @@
+type UsePackCookiesOptions = {
+    /**
+     * If set to `false`, Shopify cookies will be removed.
+     * If set to `true`, Shopify unique user token cookie will have cookie expiry of 1 year.
+     * Defaults to false.
+     **/
+    hasUserConsent?: boolean;
+    /**
+     * The domain scope of the cookie. Defaults to empty string.
+     **/
+    domain?: string;
+};
+export declare function usePackCookies(options?: UsePackCookiesOptions): void;
+export {};
+//# sourceMappingURL=usePackCookies.d.ts.map

package/dist/session/usePackCookies.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePackCookies.d.ts","sourceRoot":"","sources":["../../src/session/usePackCookies.ts"],"names":[],"mappings":"AAKA,KAAK,qBAAqB,GAAG;IAC3B;;;;QAII;IACJ,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;QAEI;IACJ,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,wBAAgB,cAAc,CAAC,OAAO,CAAC,EAAE,qBAAqB,GAAG,IAAI,CAgBpE"}

package/dist/session/usePackCookies.js

@@ -0,0 +1,27 @@
+import { useEffect } from "react";
+import { stringify } from "worktop/cookie";
+import { useShopifyCookies } from "@shopify/hydrogen";
+import { PACK_COOKIE_ID } from "../constants";
+export function usePackCookies(options) {
+    useShopifyCookies(options);
+    const { hasUserConsent = false, domain = "" } = options || {};
+    /**
+     * Set the user cookie
+     */
+    useEffect(() => {
+        /**
+         * Set user and session cookies and refresh the expiry time
+         */
+        if (!hasUserConsent) {
+            setCookie(PACK_COOKIE_ID, "", 0, domain);
+        }
+    });
+}
+function setCookie(name, value, maxage, domain) {
+    document.cookie = stringify(name, value, {
+        maxage,
+        domain,
+        samesite: "Lax",
+        path: "/",
+    });
+}

package/dist/tests/test.d.ts

@@ -0,0 +1,33 @@
+import { PackClient } from "@pack/client";
+import { PackSession } from "../session/session";
+export interface TestInput {
+    testId?: string;
+    testHandle?: string;
+    variantId?: string;
+    variantHandle?: string;
+}
+export interface Test {
+    id: string;
+    handle: string;
+    TestVariant: {
+        id: string;
+        handle: string;
+    };
+}
+export declare function getTestInfo({ packClient, session, }: {
+    packClient: PackClient;
+    session: PackSession | undefined;
+}): Promise<Test | undefined>;
+export declare function getTestSession(session: PackSession | undefined, requestAbTest: TestInput | null, previewEnabled: boolean): Test | null | undefined;
+export declare function setRequestAbTest(request: Request): {
+    testId: string;
+    testHandle: string;
+    variantId: string;
+    variantHandle: string;
+} | null;
+export declare function setTestHeaders(headers: any, options: {
+    test: TestInput | null | undefined;
+    previewEnabled: boolean;
+    sessionTest: Test | undefined;
+}): any;
+//# sourceMappingURL=test.d.ts.map

package/dist/tests/test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"test.d.ts","sourceRoot":"","sources":["../../src/tests/test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEjD,MAAM,WAAW,SAAS;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,IAAI;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE;QACX,EAAE,EAAE,MAAM,CAAC;QACX,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;CACH;AAeD,wBAAsB,WAAW,CAAC,EAChC,UAAU,EACV,OAAO,GACR,EAAE;IACD,UAAU,EAAE,UAAU,CAAC;IACvB,OAAO,EAAE,WAAW,GAAG,SAAS,CAAC;CAClC,GAAG,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC,CAgC5B;AAED,wBAAgB,cAAc,CAC5B,OAAO,EAAE,WAAW,GAAG,SAAS,EAChC,aAAa,EAAE,SAAS,GAAG,IAAI,EAC/B,cAAc,EAAE,OAAO,GACtB,IAAI,GAAG,IAAI,GAAG,SAAS,CA8BzB;AAED,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,OAAO;;;;;SAmBhD;AAED,wBAAgB,cAAc,CAC5B,OAAO,EAAE,GAAG,EACZ,OAAO,EAAE;IACP,IAAI,EAAE,SAAS,GAAG,IAAI,GAAG,SAAS,CAAC;IACnC,cAAc,EAAE,OAAO,CAAC;IACxB,WAAW,EAAE,IAAI,GAAG,SAAS,CAAC;CAC/B,OA8BF"}

package/dist/tests/test.js

@@ -0,0 +1,101 @@
+const QUERY_TEST = `#graphql
+query TestCurrent {
+    testCurrent {
+        id
+        handle
+        TestVariant {
+            id
+            handle
+        }
+    }
+}
+`;
+export async function getTestInfo({ packClient, session, }) {
+    if (!session) {
+        return undefined;
+    }
+    const testSession = session.get("test");
+    let test = testSession?.data || undefined;
+    if (!testSession ||
+        (testSession && new Date(testSession.expire_at) < new Date())) {
+        const resp = await packClient.fetch(QUERY_TEST, {});
+        test = resp.data?.testCurrent;
+        // Expire on 24 hours the test cache
+        const expire_at = new Date();
+        expire_at.setHours(expire_at.getHours() + 24);
+        session.set("test", {
+            data: test || null,
+            expire_at: expire_at,
+        });
+    }
+    return test;
+}
+export function getTestSession(session, requestAbTest, previewEnabled) {
+    if (!session) {
+        return undefined;
+    }
+    if (requestAbTest) {
+        return {
+            id: requestAbTest.testId || "",
+            handle: requestAbTest.testHandle || "",
+            TestVariant: {
+                id: requestAbTest.variantId || "",
+                handle: requestAbTest.variantHandle || "",
+            },
+        };
+    }
+    if (previewEnabled) {
+        return {
+            id: "",
+            handle: "isPreview",
+            TestVariant: {
+                id: "",
+                handle: "isPreview",
+            },
+        };
+    }
+    const testSession = session.get("test");
+    return testSession?.data || null;
+}
+export function setRequestAbTest(request) {
+    const requestUrl = new URL(request.url);
+    const params = requestUrl.searchParams;
+    if (params.has("test_id") ||
+        params.has("test_handle") ||
+        params.has("variant_id") ||
+        params.has("variant_handle")) {
+        return {
+            testId: params.get("test_id") || "",
+            testHandle: params.get("test_handle") || "",
+            variantId: params.get("variant_id") || "",
+            variantHandle: params.get("variant_handle") || "",
+        };
+    }
+    return null;
+}
+export function setTestHeaders(headers, options) {
+    const { test, previewEnabled, sessionTest } = options;
+    if (test) {
+        if (test.testId) {
+            headers["X-Test-Id"] = test.testId;
+        }
+        if (test.testHandle) {
+            headers["X-Test-Handle"] = test.testHandle;
+        }
+        if (test.variantId) {
+            headers["X-Variant-Id"] = test.variantId;
+        }
+        if (test.variantHandle) {
+            headers["X-Variant-Handle"] = test.variantHandle;
+        }
+    }
+    else {
+        if (!previewEnabled && sessionTest) {
+            headers = {
+                "X-Test-Id": sessionTest?.id,
+                "X-Variant-Id": sessionTest?.TestVariant?.id,
+            };
+        }
+    }
+    return headers;
+}

package/dist/tests/testHooks.d.ts

@@ -0,0 +1,8 @@
+import { Test } from "./test";
+export declare function useAbTest(): Test;
+export declare function useAbTestSessionId(): string;
+export declare function useAbTestId(): string;
+export declare function useAbTestHandle(): string;
+export declare function useAbTestVariantId(): string;
+export declare function useAbTestVariantHandle(): string;
+//# sourceMappingURL=testHooks.d.ts.map

package/dist/tests/testHooks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"testHooks.d.ts","sourceRoot":"","sources":["../../src/tests/testHooks.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAG9B,wBAAgB,SAAS,IAAI,IAAI,CAWhC;AAED,wBAAgB,kBAAkB,IAAI,MAAM,CAW3C;AAED,wBAAgB,WAAW,IAAI,MAAM,CAIpC;AAED,wBAAgB,eAAe,IAAI,MAAM,CAIxC;AAED,wBAAgB,kBAAkB,IAAI,MAAM,CAI3C;AAED,wBAAgB,sBAAsB,IAAI,MAAM,CAI/C"}

package/dist/tests/testHooks.js

@@ -0,0 +1,33 @@
+import { useRouteLoaderData } from "@remix-run/react";
+export function useAbTest() {
+    // @ts-ignore
+    const { abTest: test } = useRouteLoaderData("root");
+    if (test === undefined) {
+        throw new Error("No A/B test found, are you sure you have call ...pack.getRootLoaderData() on root loader return?");
+    }
+    return test;
+}
+export function useAbTestSessionId() {
+    // @ts-ignore
+    const { sessionId } = useRouteLoaderData("root");
+    if (!sessionId) {
+        throw new Error("No Session ID found, are you sure you have call ...pack.getRootLoaderData() on root loader return?");
+    }
+    return sessionId;
+}
+export function useAbTestId() {
+    const test = useAbTest();
+    return test?.id;
+}
+export function useAbTestHandle() {
+    const test = useAbTest();
+    return test?.handle;
+}
+export function useAbTestVariantId() {
+    const test = useAbTest();
+    return test?.TestVariant?.id;
+}
+export function useAbTestVariantHandle() {
+    const test = useAbTest();
+    return test?.TestVariant?.handle;
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pack/hydrogen",
   "description": "Pack Hydrogen",
-  "version": "0.1.2",
+  "version": "0.2.0-ab-beta.1",
   "exports": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "engines": {
@@ -22,13 +22,15 @@
     "dist"
   ],
   "dependencies": {
-    "@pack/client": "^0.0.7",
+    "@pack/client": "^0.1.0-ab-beta.0",
+    "@pack/packlytics": "^0.1.0-ab-beta.0",
     "@shopify/hydrogen": "^2023.10.2"
   },
   "devDependencies": {
     "@remix-run/server-runtime": "^2.0.0",
     "@shopify/oxygen-workers-types": "^4.0.0",
-    "@shopify/remix-oxygen": "^2.0.1"
+    "@shopify/remix-oxygen": "^2.0.1",
+    "@types/node": "^20.11.17"
   },
   "peerDependencies": {
     "react": "^18.0.0"

package/dist/preview/preview-session.d.ts

@@ -1,12 +0,0 @@
-import { type Session, type SessionStorage } from '@shopify/remix-oxygen';
-export declare class PreviewSession {
-    #private;
-    constructor(sessionStorage: SessionStorage, session: Session);
-    static init(request: Request, secrets: string[]): Promise<PreviewSession>;
-    has(key: string): boolean;
-    get(key: string): any;
-    destroy(): Promise<string>;
-    set(key: string, value: any): void;
-    commit(): Promise<string>;
-}
-//# sourceMappingURL=preview-session.d.ts.map

package/dist/preview/preview-session.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"preview-session.d.ts","sourceRoot":"","sources":["../../src/preview/preview-session.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,OAAO,EACZ,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAA;AAE9B,qBAAa,cAAc;;gBAIb,cAAc,EAAE,cAAc,EAAE,OAAO,EAAE,OAAO;WAK/C,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,cAAc,CAAC;IAe/E,GAAG,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO;IAIzB,GAAG,CAAC,GAAG,EAAE,MAAM;IAIf,OAAO,IAAI,OAAO,CAAC,MAAM,CAAC;IAI1B,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAIlC,MAAM,IAAI,OAAO,CAAC,MAAM,CAAC;CAG1B"}