getProductsSharedStateKit()

getProductsSharedStateKit(): Promise<ErrorResult | SuccessResult<ProductsSharedStateKit>>

Retrieves a reactive state kit object that provides access to products query and service methods with Observable streams. This allows you to subscribe to product changes and load products on demand.

Returns

Promise<ErrorResult | SuccessResult<ProductsSharedStateKit>>

Promise that resolves to a success result with a state kit object containing query and service methods

Example

Ensure the SDK and the Products module are ready.

function onSdkReady() {
    const moduleName = window.gw.sdk.common.constants.modules.PRODUCTS;
    window.gw.sdk.runIfModuleReady(moduleName, () => {
        window.gw.sdk.products.methods.getProductsSharedStateKit()
            .then((response) => {
                const stateKit = response.result;

                // Load a product and subscribe to its changes
                stateKit.service.addProductForFetching(123).subscribe((product) => {
                    console.log('Product loaded:', product);
                });

                // Subscribe to all products in store
                stateKit.query.selectAll().subscribe((products) => {
                    console.log('All products:', products);
                });

                // Subscribe to product and variant together
                stateKit.query.selectProductAndVariant(123, 456).subscribe(({ product, variant }) => {
                    if (product && variant) {
                        console.log('Product:', product.title);
                        console.log('Price:', variant.price);
                    }
                });
            })
            .catch(console.error);
    });
}

if (window.gw && window.gw.sdk) {
    onSdkReady();
} else {
    document.addEventListener("gwSdkReady", onSdkReady);
}