Packages
react
Installation

Installation

To install the Airsoko React package, follow these steps:

  1. Open your terminal.
  2. Navigate to your project directory.
  3. Run the following command:
npm install @airsoko/react

Step 1: Wrap the Application with AirsokoReactProvider

To enable authentication within your React application, you need to wrap it with the AirsokoReactProvider component provided. This component sets up the necessary react context, allowing your components to access shop information.

Here's an example of how to use the AirsokoReactProvider:

import { CartProvider, CheckoutProvider, AirsokoReactProvider, WishlistProvider } from "@airsoko/react";
import App, { AppProps } from "next/app";
 
export default function MyApp({ Component, pageProps }: AppProps) {
  return (
    <>
      <AirsokoReactProvider
        storeDomain={"myshop.airsoko.com"}
        storefrontToken="mytoken"
        storefrontApiVersion="2024-01"
        countryIsoCode="US"
        languageIsoCode="EN"
      >
        <CartProvider>
          <CheckoutProvider
            deliveryLocationDefaultOptions={{
              country: "KE",
              county: "Nairobi",
              town: "CBD - GPO/City Market/Nation Centre",
              selectedOption: {
                type: "pickup",
                minimumDeliveryTimeInDays: 2,
                maximumDeliveryTimeInDays: 3,
                shippingAmmout: "112",
              },
            }}
          >
            <WishlistProvider>
              <Component {...pageProps} />
            </WishlistProvider>
          </CheckoutProvider>
        </CartProvider>
      </AirsokoReactProvider>
    </>
  );
}