ordering-components-external 13.1.4 → 13.1.6

package/src/contexts/OrderingContext/index.js

@@ -1,86 +1,86 @@
-import React, { createContext } from 'react'
-import { ConfigProvider } from '../ConfigContext'
-import { SiteProvider } from '../SiteContext'
-import { SessionProvider } from '../SessionContext'
-import { WebsocketProvider } from '../WebsocketContext'
-import { OrderProvider } from '../OrderContext'
-import { BusinessProvider } from '../BusinessContext'
-import { LanguageProvider } from '../LanguageContext'
-import { ApiProvider } from '../ApiContext'
-import { EventProvider } from '../EventContext'
-import { UtilsProviders } from '../UtilsContext'
-import { ValidationFieldsProvider } from '../ValidationsFieldsContext'
-import { CustomerProvider } from '../CustomerContext'
-import { ToastProvider } from '../ToastContext'
-import { WebStrategy } from '../../webStrategy'
-import { OrderingThemeProvider } from '../OrderingThemeContext'
-import { OptimizationLoadProvider } from '../OptimizationLoadContext'
-
-/**
- * Create OrderingContext
- * Wrapper to use all context to ordering apps
- */
-export const OrderingContext = createContext()
-
-/**
- * Custom provider to languages manager
- * This provider has a reducer for manage languages state
- * @param {props} props
- */
-export const OrderingProvider = ({ Alert, settings, children }) => {
-  const webStrategy = new WebStrategy()
-  const isAlsea = ['alsea', 'alsea-staging']?.includes(settings.project)
-  const restOfSettings = {
-    project: settings.project,
-    appId: settings.app_id,
-    countryCode: settings.countryCode,
-    useOptimizeLoad: settings.useOptimizeLoad,
-    use_root_point: settings.use_root_point,
-    isAlsea
-  }
-  return (
-    <OrderingContext.Provider>
-      <EventProvider>
-        <ApiProvider settings={Object.assign(settings.api, restOfSettings)}>
-          <OptimizationLoadProvider settings={Object.assign(settings.api, restOfSettings)} strategy={webStrategy}>
-            <LanguageProvider settings={Object.assign(settings.api, restOfSettings)} strategy={webStrategy}>
-              <ConfigProvider strategy={webStrategy}>
-                <OrderingThemeProvider settings={Object.assign(settings.api, restOfSettings)}>
-                  <SiteProvider appId={settings.app_id}>
-                    <UtilsProviders>
-                      <ToastProvider>
-                        <ValidationFieldsProvider appId={settings.app_id}>
-                          <SessionProvider strategy={webStrategy}>
-                            <WebsocketProvider
-                              isAlsea={isAlsea}
-                              strategy={webStrategy}
-                              settings={Object.assign(settings.socket, restOfSettings)}
-                            >
-                              <CustomerProvider strategy={webStrategy}>
-                                <OrderProvider
-                                  strategy={webStrategy}
-                                  Alert={Alert}
-                                  isAlsea={isAlsea}
-                                  franchiseId={settings?.franchiseSlug ?? settings?.franchiseId}
-                                  businessSlug={settings?.businessSlug}
-                                >
-                                  <BusinessProvider>
-                                    {children}
-                                  </BusinessProvider>
-                                </OrderProvider>
-                              </CustomerProvider>
-                            </WebsocketProvider>
-                          </SessionProvider>
-                        </ValidationFieldsProvider>
-                      </ToastProvider>
-                    </UtilsProviders>
-                  </SiteProvider>
-                </OrderingThemeProvider>
-              </ConfigProvider>
-            </LanguageProvider>
-          </OptimizationLoadProvider>
-        </ApiProvider>
-      </EventProvider>
-    </OrderingContext.Provider>
-  )
-}
+import React, { createContext } from 'react'
+import { ConfigProvider } from '../ConfigContext'
+import { SiteProvider } from '../SiteContext'
+import { SessionProvider } from '../SessionContext'
+import { WebsocketProvider } from '../WebsocketContext'
+import { OrderProvider } from '../OrderContext'
+import { BusinessProvider } from '../BusinessContext'
+import { LanguageProvider } from '../LanguageContext'
+import { ApiProvider } from '../ApiContext'
+import { EventProvider } from '../EventContext'
+import { UtilsProviders } from '../UtilsContext'
+import { ValidationFieldsProvider } from '../ValidationsFieldsContext'
+import { CustomerProvider } from '../CustomerContext'
+import { ToastProvider } from '../ToastContext'
+import { WebStrategy } from '../../webStrategy'
+import { OrderingThemeProvider } from '../OrderingThemeContext'
+import { OptimizationLoadProvider } from '../OptimizationLoadContext'
+
+/**
+ * Create OrderingContext
+ * Wrapper to use all context to ordering apps
+ */
+export const OrderingContext = createContext()
+
+/**
+ * Custom provider to languages manager
+ * This provider has a reducer for manage languages state
+ * @param {props} props
+ */
+export const OrderingProvider = ({ Alert, settings, children }) => {
+  const webStrategy = new WebStrategy()
+  const isAlsea = ['alsea', 'alsea-staging']?.includes(settings.project)
+  const restOfSettings = {
+    project: settings.project,
+    appId: settings.app_id,
+    countryCode: settings.countryCode,
+    useOptimizeLoad: settings.useOptimizeLoad,
+    use_root_point: settings.use_root_point,
+    isAlsea
+  }
+  return (
+    <OrderingContext.Provider>
+      <EventProvider>
+        <ApiProvider settings={Object.assign(settings.api, restOfSettings)}>
+          <OptimizationLoadProvider settings={Object.assign(settings.api, restOfSettings)} strategy={webStrategy}>
+            <LanguageProvider settings={Object.assign(settings.api, restOfSettings)} strategy={webStrategy}>
+              <ConfigProvider strategy={webStrategy}>
+                <OrderingThemeProvider settings={Object.assign(settings.api, restOfSettings)}>
+                  <SiteProvider appId={settings.app_id}>
+                    <UtilsProviders>
+                      <ToastProvider>
+                        <ValidationFieldsProvider appId={settings.app_id}>
+                          <SessionProvider strategy={webStrategy}>
+                            <WebsocketProvider
+                              isAlsea={isAlsea}
+                              strategy={webStrategy}
+                              settings={Object.assign(settings.socket, restOfSettings)}
+                            >
+                              <CustomerProvider strategy={webStrategy}>
+                                <OrderProvider
+                                  strategy={webStrategy}
+                                  Alert={Alert}
+                                  isAlsea={isAlsea}
+                                  franchiseId={settings?.franchiseSlug ?? settings?.franchiseId}
+                                  businessSlug={settings?.businessSlug}
+                                >
+                                  <BusinessProvider>
+                                    {children}
+                                  </BusinessProvider>
+                                </OrderProvider>
+                              </CustomerProvider>
+                            </WebsocketProvider>
+                          </SessionProvider>
+                        </ValidationFieldsProvider>
+                      </ToastProvider>
+                    </UtilsProviders>
+                  </SiteProvider>
+                </OrderingThemeProvider>
+              </ConfigProvider>
+            </LanguageProvider>
+          </OptimizationLoadProvider>
+        </ApiProvider>
+      </EventProvider>
+    </OrderingContext.Provider>
+  )
+}

package/src/contexts/OrderingThemeContext/index.js

@@ -1,107 +1,107 @@
-import React, { createContext, useState, useContext, useEffect } from 'react'
-import { useApi } from '../ApiContext'
-import { useOptimizationLoad } from '../OptimizationLoadContext'
-
-/**
- * Create OrderingThemeContext
- * This context will manage the current themes and layouts
- */
-export const OrderingThemeContext = createContext()
-
-/**
- * Custom provider to ordering themes and layouts manager
- * This provider has a reducer for manage themes and layouts state
- * @param {props} props
- */
-export const OrderingThemeProvider = ({ children, settings }) => {
-  const [state, setState] = useState({
-    loading: true,
-    theme: {},
-    error: false
-  })
-
-  const [ordering] = useApi()
-  const [optimizationLoad] = useOptimizationLoad()
-
-  const getThemes = async (themes = null) => {
-    const requestOptions = {
-      method: 'GET',
-      headers: {
-        'X-App-X': settings.appId
-      }
-    }
-    try {
-      let error = themes?.error ?? null
-      let result = themes?.result ?? null
-      if (!themes) {
-        const response = await fetch(`${ordering.root}/theme`, requestOptions)
-        const res = await response.json()
-        error = res?.error
-        result = res?.result
-      }
-      if (!error) {
-        setState({
-          ...state,
-          theme: result.values,
-          loading: false,
-          error: false
-        })
-        return
-      }
-      setState({
-        ...state,
-        theme: {},
-        loading: false,
-        error: true
-      })
-    } catch (err) {
-      setState({
-        ...state,
-        theme: {},
-        loading: false,
-        error: err
-      })
-    }
-  }
-
-  const refreshTheme = () => {
-    getThemes()
-  }
-
-  useEffect(() => {
-    if (optimizationLoad.loading) return
-    const _themes = optimizationLoad.result && !!optimizationLoad.result?.theme ? {
-      error: optimizationLoad.error,
-      result: { values: optimizationLoad.result?.theme }
-    } : null
-    getThemes(_themes)
-  }, [optimizationLoad])
-
-  const functions = {
-    refreshTheme
-  }
-
-  return (
-    <OrderingThemeContext.Provider value={[state, functions]}>
-      {children}
-    </OrderingThemeContext.Provider>
-  )
-}
-
-/**
- * Hook to get ordering theme
- */
-export const useOrderingTheme = () => {
-  const orderingThemeManager = useContext(OrderingThemeContext)
-  const warningMessage = () => {
-    console.warn('Must use OrderingThemeProvider to wrappe the app.')
-  }
-  /**
-   * Functions to avoid fails
-   */
-  const functionsPlaceholders = {
-    refreshTheme: warningMessage
-  }
-
-  return orderingThemeManager || [{}, functionsPlaceholders]
-}
+import React, { createContext, useState, useContext, useEffect } from 'react'
+import { useApi } from '../ApiContext'
+import { useOptimizationLoad } from '../OptimizationLoadContext'
+
+/**
+ * Create OrderingThemeContext
+ * This context will manage the current themes and layouts
+ */
+export const OrderingThemeContext = createContext()
+
+/**
+ * Custom provider to ordering themes and layouts manager
+ * This provider has a reducer for manage themes and layouts state
+ * @param {props} props
+ */
+export const OrderingThemeProvider = ({ children, settings }) => {
+  const [state, setState] = useState({
+    loading: true,
+    theme: {},
+    error: false
+  })
+
+  const [ordering] = useApi()
+  const [optimizationLoad] = useOptimizationLoad()
+
+  const getThemes = async (themes = null) => {
+    const requestOptions = {
+      method: 'GET',
+      headers: {
+        'X-App-X': settings.appId
+      }
+    }
+    try {
+      let error = themes?.error ?? null
+      let result = themes?.result ?? null
+      if (!themes) {
+        const response = await fetch(`${ordering.root}/theme`, requestOptions)
+        const res = await response.json()
+        error = res?.error
+        result = res?.result
+      }
+      if (!error) {
+        setState({
+          ...state,
+          theme: result.values,
+          loading: false,
+          error: false
+        })
+        return
+      }
+      setState({
+        ...state,
+        theme: {},
+        loading: false,
+        error: true
+      })
+    } catch (err) {
+      setState({
+        ...state,
+        theme: {},
+        loading: false,
+        error: err
+      })
+    }
+  }
+
+  const refreshTheme = () => {
+    getThemes()
+  }
+
+  useEffect(() => {
+    if (optimizationLoad.loading) return
+    const _themes = optimizationLoad.result && !!optimizationLoad.result?.theme ? {
+      error: optimizationLoad.error,
+      result: { values: optimizationLoad.result?.theme }
+    } : null
+    getThemes(_themes)
+  }, [optimizationLoad])
+
+  const functions = {
+    refreshTheme
+  }
+
+  return (
+    <OrderingThemeContext.Provider value={[state, functions]}>
+      {children}
+    </OrderingThemeContext.Provider>
+  )
+}
+
+/**
+ * Hook to get ordering theme
+ */
+export const useOrderingTheme = () => {
+  const orderingThemeManager = useContext(OrderingThemeContext)
+  const warningMessage = () => {
+    console.warn('Must use OrderingThemeProvider to wrappe the app.')
+  }
+  /**
+   * Functions to avoid fails
+   */
+  const functionsPlaceholders = {
+    refreshTheme: warningMessage
+  }
+
+  return orderingThemeManager || [{}, functionsPlaceholders]
+}

package/src/contexts/ProductContext/index.js

@@ -1,62 +1,62 @@
-import React, { createContext, useContext, useReducer, useEffect, useState } from 'react'
-
-export const PRODUCT_ACTIONS = {
-  CHANGE_INGREDIENTS: 'change_ingredients',
-  CHANGE_OPTIONS: 'change_options'
-}
-
-/**
- * Create OrderContext
- * This context will manage the current order with options internally and provide an easy interface
- */
-export const ProductContext = createContext()
-
-const defaultInitialState = {
-  ingredients: [],
-  options: []
-}
-
-/**
- * Default reducer definition
- * @param {object} state Currente state reducer
- * @param {object} action Data to change state reducer
- */
-const defaultReducer = (state, action) => {
-  switch (action.type) {
-    case PRODUCT_ACTIONS.CHANGE_INGREDIENTS: {
-      window.localStorage.setItem('ingredients', JSON.stringify(action.ingredients));
-      return {
-        ...state,
-        ingredients: action.ingredients
-      }
-    }
-    case PRODUCT_ACTIONS.CHANGE_OPTIONS: {
-      window.localStorage.setItem('options', JSON.stringify(action.options))
-      return {
-        ...state,
-        options: action.options
-      }
-    }
-    default:
-      return state
-  }
-}
-
-/**
- * Custom provider to session manager
- * This provider has a reducer for manage session state
- * @param {props} props
- */
-export const ProductProvider = ({ reducer = defaultReducer, initialState = defaultInitialState, children }) => (
-  <ProductContext.Provider value={useReducer(reducer, initialState)}>
-    {children}
-  </ProductContext.Provider>
-)
-
-/**
- * Hook to get and update order state
- */
-export const useProduct = () => {
-  const productManager = useContext(ProductContext)
-  return productManager || [{}, () => {}]
-}
+import React, { createContext, useContext, useReducer, useEffect, useState } from 'react'
+
+export const PRODUCT_ACTIONS = {
+  CHANGE_INGREDIENTS: 'change_ingredients',
+  CHANGE_OPTIONS: 'change_options'
+}
+
+/**
+ * Create OrderContext
+ * This context will manage the current order with options internally and provide an easy interface
+ */
+export const ProductContext = createContext()
+
+const defaultInitialState = {
+  ingredients: [],
+  options: []
+}
+
+/**
+ * Default reducer definition
+ * @param {object} state Currente state reducer
+ * @param {object} action Data to change state reducer
+ */
+const defaultReducer = (state, action) => {
+  switch (action.type) {
+    case PRODUCT_ACTIONS.CHANGE_INGREDIENTS: {
+      window.localStorage.setItem('ingredients', JSON.stringify(action.ingredients));
+      return {
+        ...state,
+        ingredients: action.ingredients
+      }
+    }
+    case PRODUCT_ACTIONS.CHANGE_OPTIONS: {
+      window.localStorage.setItem('options', JSON.stringify(action.options))
+      return {
+        ...state,
+        options: action.options
+      }
+    }
+    default:
+      return state
+  }
+}
+
+/**
+ * Custom provider to session manager
+ * This provider has a reducer for manage session state
+ * @param {props} props
+ */
+export const ProductProvider = ({ reducer = defaultReducer, initialState = defaultInitialState, children }) => (
+  <ProductContext.Provider value={useReducer(reducer, initialState)}>
+    {children}
+  </ProductContext.Provider>
+)
+
+/**
+ * Hook to get and update order state
+ */
+export const useProduct = () => {
+  const productManager = useContext(ProductContext)
+  return productManager || [{}, () => {}]
+}