@dutchiesdk/ecommerce-extensions-sdk 0.8.3 → 0.9.0

package/README.md

@@ -103,7 +103,7 @@ const ProductList = () => {
 
 ### `CommerceComponentsDataInterface`
 
-The main interface providing access to all platform data and functionality.
+The main interface providing access to all platform data and functionality. [Full interface can be found here](./src/types/interface.ts).
 
 ```typescript
 interface CommerceComponentsDataInterface {
@@ -120,17 +120,17 @@ interface CommerceComponentsDataInterface {
 
 ### `RemoteBoundaryComponent`
 
-The base type for all extension components that integrate with the Dutchie platform.
-
-```typescript
-type RemoteBoundaryComponent = React.FC & {
-  DataBridgeVersion: string;
-};
-```
+All extension components that integrate with the Dutchie platform should satisfy the `RemoteBoundaryComponent` type.
 
 **Example:**
 
 ```tsx
+import {
+  RemoteBoundaryComponent,
+  useDataBridge,
+  DataBridgeVersion,
+} from "@dutchie/ecommerce-extensions-sdk";
+
 const MyCustomHeader: RemoteBoundaryComponent = () => {
   const { location, user, actions } = useDataBridge();
 
@@ -146,7 +146,7 @@ const MyCustomHeader: RemoteBoundaryComponent = () => {
   );
 };
 
-MyCustomHeader.DataBridgeVersion = "0.2";
+MyCustomHeader.DataBridgeVersion = DataBridgeVersion;
 ```
 
 ## Actions API
@@ -189,26 +189,26 @@ const currentLocations = await dataLoaders.locations(); // Current context locat
 
 ## Best Practices
 
-### Error Handling
+### Data Loading
 
-Always wrap `useDataBridge()` calls in error boundaries and handle loading states:
+When using the `useDataBridge()` hook in a component, always handle loading states:
 
 ```tsx
-const SafeComponent = () => {
-  try {
-    const { dataLoaders } = useDataBridge();
-    const { data, isLoading } = useAsyncLoader(dataLoaders.products);
+const MyComponent = () => {
+  const { dataLoaders } = useDataBridge();
+  const { data, isLoading } = useAsyncLoader(dataLoaders.products);
 
-    if (isLoading) return <LoadingSpinner />;
-    if (!data) return <ErrorMessage message="Failed to load products" />;
+  if (isLoading) return <LoadingSpinner />;
+  if (!data) return <EmptyProducts message="No products found" />;
 
-    return <ProductList products={data} />;
-  } catch (error) {
-    return <ErrorFallback error={error} />;
-  }
+  return <ProductList products={data} />;
 };
 ```
 
+### Error Handling
+
+Any uncaught errors will be caught by a Dutchie error boundary, and the fallback will be rendered.
+
 ### TypeScript Best Practices
 
 Leverage the provided types for better development experience:
@@ -292,31 +292,6 @@ test("renders extension correctly", () => {
 });
 ```
 
-### Performance Optimization
-
-Use `React.memo` and `useMemo` for expensive operations:
-
-```tsx
-const ProductCard = React.memo(({ product, onAddToCart }) => {
-  const formattedPrice = React.useMemo(
-    () =>
-      new Intl.NumberFormat("en-US", {
-        style: "currency",
-        currency: "USD",
-      }).format(product.price),
-    [product.price]
-  );
-
-  return (
-    <div className="product-card">
-      <h3>{product.name}</h3>
-      <p>{formattedPrice}</p>
-      <button onClick={() => onAddToCart(product.id, 1)}>Add to Cart</button>
-    </div>
-  );
-});
-```
-
 ## Core Concepts
 
 The Dutchie Ecommerce Extensions SDK is built around several key concepts:

package/dist/context/ecommerce-data-bridge.cjs

@@ -30,7 +30,7 @@ __webpack_require__.d(__webpack_exports__, {
     useDataBridge: ()=>useDataBridge
 });
 const external_react_namespaceObject = require("react");
-const DataBridgeVersion = '0.8.3';
+const DataBridgeVersion = '0.9.0';
 const DataBridgeContext = (0, external_react_namespaceObject.createContext)(void 0);
 const useDataBridge = ()=>{
     const context = (0, external_react_namespaceObject.useContext)(DataBridgeContext);

package/dist/esm/context/ecommerce-data-bridge.js

@@ -1,5 +1,5 @@
 import { createContext, useContext, useEffect, useState } from "react";
-const DataBridgeVersion = '0.8.3';
+const DataBridgeVersion = '0.9.0';
 const DataBridgeContext = createContext(void 0);
 const useDataBridge = ()=>{
     const context = useContext(DataBridgeContext);

package/dist/esm/types/actions.d.ts

@@ -1,3 +1,4 @@
+import type { CartItem } from './data';
 type AuthenticationActions = {
     /**
      * Navigate to login
@@ -8,13 +9,15 @@ type AuthenticationActions = {
      */
     goToRegister: () => void;
 };
+type GoToIdOrCnameParameters = {
+    id?: string;
+    cname?: string;
+};
 type CartActions = {
     /**
      * Add product to cart
-     * @param productId - The product ID
-     * @param quantity - The quantity
      */
-    addToCart: (productId: string, quantity: number) => void;
+    addToCart: (item: CartItem) => Promise<void>;
     /**
      * Clear cart
      */
@@ -29,19 +32,23 @@ type CartActions = {
     goToCheckout: () => void;
     /**
      * Remove product from cart
-     * @param productId - The product ID
      */
-    removeFromCart: (productId: string) => void;
+    removeFromCart: (item: CartItem) => void;
     /**
      * Show cart sidebar/modal
      */
     showCart: () => void;
     /**
      * Update product quantity in cart
-     * @param productId - The product ID
-     * @param quantity - The quantity
+     * @param existingItem - The existing item
+     * @param newItem - The new item
+     */
+    updateCartItem: (existingItem: CartItem, newItem: CartItem) => void;
+    /**
+     * Update pricing type
+     * @param pricingType - The pricing type
      */
-    updateCartItem: (productId: string, quantity: number) => void;
+    updatePricingType: (pricingType: 'med' | 'rec') => void;
 };
 type ComponentActions = {
     /**
@@ -60,33 +67,27 @@ type ComponentActions = {
 };
 type DetailPageActions = {
     /**
-     * Navigate to category page
-     * @param categoryId - The category ID
-     * @param categoryCname - The category CNAME
+     * Navigate to brand page
      */
-    goToCategory: (categoryId?: string, categoryCname?: string) => void;
+    goToBrand: (params: GoToIdOrCnameParameters) => void;
     /**
-     * Navigate to brand page
+     * Navigate to category page. Only one parameter is required.
      */
-    goToBrand: (brandId?: string, brandCname?: string) => void;
+    goToCategory: (params: GoToIdOrCnameParameters) => void;
     /**
-     * Navigate to product details
-     * @param productId - The product ID
-     * @param productCname - The product CNAME
+     * Navigate to collection page. Only one parameter is required.
      */
-    goToProductDetails: (productId?: string, productCname?: string) => void;
+    goToCollection: (params: GoToIdOrCnameParameters) => void;
+    /**
+     * Navigate to product details. Only one parameter is required.
+     */
+    goToProductDetails: (params: GoToIdOrCnameParameters) => void;
 };
 type ListPageActions = {
     /**
      * Navigate to brand list
-     * @param brandId - The brand ID
-     * @param brandCname - The brand CNAME
-     */
-    goToBrandList: (brandId?: string, brandCname?: string) => void;
-    /**
-     * Navigate to collection list
      */
-    goToCollectionList: (collectionId?: string, collectionCname?: string) => void;
+    goToBrandList: () => void;
     /**
      * Navigate to product list
      * @param categoryId - The category ID

package/dist/esm/types/data.d.ts

@@ -4,7 +4,12 @@ export type Brand = {
     name: string;
 };
 export type CartItem = {
+    /**
+     * Generally, use [option] instead. This is advanced use only.
+     */
+    additionalOption?: string;
     name: string;
+    option?: string;
     price: number;
     productId: string;
     quantity: number;
@@ -134,11 +139,7 @@ export type DataLoaders = {
      */
     collections: () => Promise<Collection[] | []>;
     /**
-     * All dispensary locations
-     */
-    getAllLocations: () => Promise<Dispensary[] | []>;
-    /**
-     * Current context locations
+     * All dispensary locations of the chain
      */
     locations: () => Promise<Dispensary[] | []>;
     /**

package/dist/types/actions.d.ts

@@ -1,3 +1,4 @@
+import type { CartItem } from './data';
 type AuthenticationActions = {
     /**
      * Navigate to login
@@ -8,13 +9,15 @@ type AuthenticationActions = {
      */
     goToRegister: () => void;
 };
+type GoToIdOrCnameParameters = {
+    id?: string;
+    cname?: string;
+};
 type CartActions = {
     /**
      * Add product to cart
-     * @param productId - The product ID
-     * @param quantity - The quantity
      */
-    addToCart: (productId: string, quantity: number) => void;
+    addToCart: (item: CartItem) => Promise<void>;
     /**
      * Clear cart
      */
@@ -29,19 +32,23 @@ type CartActions = {
     goToCheckout: () => void;
     /**
      * Remove product from cart
-     * @param productId - The product ID
      */
-    removeFromCart: (productId: string) => void;
+    removeFromCart: (item: CartItem) => void;
     /**
      * Show cart sidebar/modal
      */
     showCart: () => void;
     /**
      * Update product quantity in cart
-     * @param productId - The product ID
-     * @param quantity - The quantity
+     * @param existingItem - The existing item
+     * @param newItem - The new item
+     */
+    updateCartItem: (existingItem: CartItem, newItem: CartItem) => void;
+    /**
+     * Update pricing type
+     * @param pricingType - The pricing type
      */
-    updateCartItem: (productId: string, quantity: number) => void;
+    updatePricingType: (pricingType: 'med' | 'rec') => void;
 };
 type ComponentActions = {
     /**
@@ -60,33 +67,27 @@ type ComponentActions = {
 };
 type DetailPageActions = {
     /**
-     * Navigate to category page
-     * @param categoryId - The category ID
-     * @param categoryCname - The category CNAME
+     * Navigate to brand page
      */
-    goToCategory: (categoryId?: string, categoryCname?: string) => void;
+    goToBrand: (params: GoToIdOrCnameParameters) => void;
     /**
-     * Navigate to brand page
+     * Navigate to category page. Only one parameter is required.
      */
-    goToBrand: (brandId?: string, brandCname?: string) => void;
+    goToCategory: (params: GoToIdOrCnameParameters) => void;
     /**
-     * Navigate to product details
-     * @param productId - The product ID
-     * @param productCname - The product CNAME
+     * Navigate to collection page. Only one parameter is required.
      */
-    goToProductDetails: (productId?: string, productCname?: string) => void;
+    goToCollection: (params: GoToIdOrCnameParameters) => void;
+    /**
+     * Navigate to product details. Only one parameter is required.
+     */
+    goToProductDetails: (params: GoToIdOrCnameParameters) => void;
 };
 type ListPageActions = {
     /**
      * Navigate to brand list
-     * @param brandId - The brand ID
-     * @param brandCname - The brand CNAME
-     */
-    goToBrandList: (brandId?: string, brandCname?: string) => void;
-    /**
-     * Navigate to collection list
      */
-    goToCollectionList: (collectionId?: string, collectionCname?: string) => void;
+    goToBrandList: () => void;
     /**
      * Navigate to product list
      * @param categoryId - The category ID

package/dist/types/data.d.ts

@@ -4,7 +4,12 @@ export type Brand = {
     name: string;
 };
 export type CartItem = {
+    /**
+     * Generally, use [option] instead. This is advanced use only.
+     */
+    additionalOption?: string;
     name: string;
+    option?: string;
     price: number;
     productId: string;
     quantity: number;
@@ -134,11 +139,7 @@ export type DataLoaders = {
      */
     collections: () => Promise<Collection[] | []>;
     /**
-     * All dispensary locations
-     */
-    getAllLocations: () => Promise<Dispensary[] | []>;
-    /**
-     * Current context locations
+     * All dispensary locations of the chain
      */
     locations: () => Promise<Dispensary[] | []>;
     /**

package/package.json

@@ -4,7 +4,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.8.3",
+  "version": "0.9.0",
   "license": "MIT",
   "type": "module",
   "module": "./dist/esm/index.js",