npm-pkg-hook 1.4.1 → 1.4.3

package/package.json

@@ -43,5 +43,5 @@
     "rm": "rm -rf node_modules package-lock.json && npm i",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
-  "version": "1.4.1"
+  "version": "1.4.3"
 }

package/src/hooks/generateStoreURL/index.js

@@ -0,0 +1,32 @@
+/**
+ * Generate the store URL based on given parameters
+ * @param {Object} city - The city object with name
+ * @param {Object} department - The department object with name
+ * @param {string} storeName - The name of the store
+ * @param {string} idStore - The ID of the store
+ * @returns {string} - The generated URL or null if any field is missing
+ */
+export const generateStoreURL = ({ city, department, storeName, idStore }) => {
+  try {
+    // Validate all necessary fields
+    if (
+      !process.env.MAIN_URL_BASE ||
+        !city?.cName ||
+        !department?.dName ||
+        !storeName ||
+        !idStore
+    ) {
+      return null // Return null or any default case you'd prefer
+    }
+
+    const cityName = city.cName.toLocaleLowerCase()
+    const departmentName = department.dName.toLocaleLowerCase()
+
+    // Replace spaces in storeName with hyphens
+    const formattedStoreName = storeName.replace(/\s+/g, '-')
+
+    return `${process.env.MAIN_URL_BASE}/delivery/${cityName}-${departmentName}/${formattedStoreName}/${idStore}`
+  } catch (_) {
+    return null
+  }
+}

package/src/hooks/index.js

@@ -10,9 +10,11 @@ export * from './useLogout'
 export * from './useStatusOpenStore'
 export * from './useScheduleData'
 export * from './useOrders'
+export * from './usePushNotifications'
 export * from './useLocationManager'
 export * from './useFingerprintjs'
 export * from './useCountries'
+export * from './generateStoreURL'
 export * from './useCreateStorePendingToRegister'
 export * from './useDepartments'
 export * from './useRoads'

package/src/hooks/useCreateProduct/helpers/index.js

@@ -14,7 +14,7 @@ export const verifyPriceInRange = ({ values = [], sendNotification }) => {
     sendNotification({
       backgroundColor: 'warning',
       title: 'Alerta',
-      description: 'El valor del producto es muy elevado'
+      description: 'El valor es muy elevado'
     })
     return false
   }

package/src/hooks/usePushNotifications/helpers/index.js

@@ -0,0 +1,114 @@
+/* eslint-disable consistent-return */
+const pushServerPublicKey = 'BIN2Jc5Vmkmy-S3AUrcMlpKxJpLeVRAfu9WBqUbJ70SJOCWGCGXKY-Xzyh7HDr6KbRDGYHjqZ06OcS3BjD7uAm8'
+
+/**
+ * checks if Push notification and service workers are supported by your browser
+ */
+function isPushNotificationSupported () {
+  if (typeof window !== 'undefined' && window.Notification && window.ServiceWorker) {
+    return 'serviceWorker' in navigator && 'PushManager' in window
+  }
+}
+
+/**
+ * asks user consent to receive push notifications and returns the response of the user, one of granted, default, denied
+ */
+async function askUserPermission () {
+  return await Notification.requestPermission()
+}
+/**
+ * shows a notification
+ */
+function sendNotification () {
+  const img = '/images/jason-leung-HM6TMmevbZQ-unsplash.jpg'
+  const text = 'Take a look at this brand new t-shirt!'
+  const title = 'New Product Available'
+  const options = {
+    body: text,
+    icon: '/images/jason-leung-HM6TMmevbZQ-unsplash.jpg',
+    vibrate: [200, 100, 200],
+    tag: 'new-product',
+    image: img,
+    badge: 'https://spyna.it/icons/android-icon-192x192.png',
+    actions: [{ action: 'Detail', title: 'View', icon: 'https://via.placeholder.com/128/ff0000' }]
+  }
+  navigator.serviceWorker.ready.then(function (serviceWorker) {
+    serviceWorker.showNotification(title, options)
+  })
+}
+
+/**
+ *
+ */
+function registerServiceWorker () {
+  return navigator.serviceWorker.register('/sw.js')
+}
+
+/**
+ *
+ * using the registered service worker creates a push notification subscription and returns it
+ *
+ */
+async function createNotificationSubscription () {
+  // wait for service worker installation to be ready
+  const serviceWorker = await navigator.serviceWorker.ready
+  // subscribe and return the subscription
+  return await serviceWorker.pushManager.subscribe({
+    userVisibleOnly: true,
+    applicationServerKey: pushServerPublicKey
+  })
+}
+
+/**
+ * returns the subscription if present or nothing
+ */
+function getUserSubscription () {
+  // wait for service worker installation to be ready, and then
+  return navigator.serviceWorker.ready
+    .then(function (serviceWorker) {
+      return serviceWorker.pushManager.getSubscription()
+    })
+    .then(function (pushSubscription) {
+      return pushSubscription
+    })
+}
+
+const host = process.env.NODE_ENV === 'production' ? 'http://localhost:4000' : 'http://localhost:4000'
+
+function post (path, body) {
+  return fetch(`${host}${path}`, {
+    body: JSON.stringify(body),
+    method: 'POST',
+    mode: 'cors'
+  })
+    .then(function (response) {
+      return response.json()
+    })
+    .then(function (data) {
+      return data
+    })
+}
+
+function get (path) {
+  return fetch(`${host}${path}`, {
+    method: 'GET',
+    mode: 'cors'
+  })
+    .then(function (response) {
+      return response.json()
+    })
+    .then(function (data) {
+      return data
+    })
+}
+
+export {
+  isPushNotificationSupported,
+  askUserPermission,
+  post,
+  get,
+  registerServiceWorker,
+  sendNotification,
+  createNotificationSubscription,
+  getUserSubscription
+}

package/src/hooks/usePushNotifications/index.js

@@ -0,0 +1,149 @@
+/* eslint-disable no-console */
+import { useState, useEffect } from 'react'
+import {
+  isPushNotificationSupported,
+  post,
+  get,
+  askUserPermission,
+  registerServiceWorker,
+  createNotificationSubscription,
+  getUserSubscription
+} from './helpers'
+// import all the function created to manage the push notifications
+
+const pushNotificationSupported = isPushNotificationSupported()
+// first thing to do: check if the push notifications are supported by the browser
+
+export const usePushNotifications = () => {
+  const [userConsent, setSuserConsent] = useState()
+  useEffect(() => {
+    if (typeof Notification !== 'undefined') {
+      setSuserConsent(Notification.permission)
+    }
+  }, [])
+
+  // to manage the user consent: Notification.permission is a JavaScript native function that return the current state of the permission
+  // We initialize the userConsent with that value
+  const [userSubscription, setUserSubscription] = useState(null)
+  // to manage the use push notification subscription
+  const [pushServerSubscriptionId, setPushServerSubscriptionId] = useState()
+  // to manage the push server subscription
+  const [error, setError] = useState(null)
+  // to manage errors
+  const [loading, setLoading] = useState(true)
+  // to manage async actions
+
+  useEffect(() => {
+    if (pushNotificationSupported) {
+      setLoading(true)
+      setError(false)
+      registerServiceWorker().then(() => {
+        setLoading(false)
+      })
+    }
+  }, [])
+  // if the push notifications are supported, registers the service worker
+  // this effect runs only the first render
+
+  useEffect(() => {
+    setLoading(true)
+    setError(false)
+    const getExixtingSubscription = async () => {
+      const existingSubscription = await getUserSubscription()
+      setUserSubscription(existingSubscription)
+      setLoading(false)
+    }
+    getExixtingSubscription()
+  }, [])
+  // Retrieve if there is any push notification subscription for the registered service worker
+  // this use effect runs only in the first render
+
+  /**
+   * define a click handler that asks the user permission,
+   * it uses the setSuserConsent state, to set the consent of the user
+   * If the user denies the consent, an error is created with the setError hook
+   */
+  const onClickAskUserPermission = () => {
+    setLoading(true)
+    setError(false)
+    askUserPermission().then(consent => {
+      setSuserConsent(consent)
+      if (consent !== 'granted') {
+        setError({
+          name: 'consentimiento denegado',
+          message: 'Negaste el consentimiento para recibir notificaciones',
+          code: 0
+        })
+      }
+      setLoading(false)
+    })
+  }
+  //
+
+  /**
+   * define a click handler that creates a push notification subscription.
+   * Once the subscription is created, it uses the setUserSubscription hook
+   */
+  const onClickSusbribeToPushNotification = () => {
+    setLoading(true)
+    setError(false)
+    createNotificationSubscription()
+      .then(function (subscrition) {
+        setUserSubscription(subscrition)
+        setLoading(false)
+      })
+      .catch(err => {
+        console.error("Couldn't create the notification subscription", err, 'name:', err.name, 'message:', err.message, 'code:', err.code)
+        setError(err)
+        setLoading(false)
+      })
+  }
+
+  /**
+   * define a click handler that sends the push susbcribtion to the push server.
+   * Once the subscription ics created on the server, it saves the id using the hook setPushServerSubscriptionId
+   */
+  const onClickSendSubscriptionToPushServer = () => {
+    setLoading(true)
+    setError(false)
+    post('/subscription2', userSubscription)
+      .then(function (response) {
+        setPushServerSubscriptionId(response.id)
+        setLoading(false)
+      })
+      .catch(err => {
+        setLoading(false)
+        setError(err)
+      })
+  }
+
+  /**
+   * define a click handler that request the push server to send a notification, passing the id of the saved subscription
+   */
+  const onClickSendNotification = async () => {
+    setLoading(true)
+    setError(false)
+    console.log(pushServerSubscriptionId)
+    await get(`/subscription/${pushServerSubscriptionId}`).catch(err => {
+      setLoading(false)
+      setError(err)
+    })
+    setLoading(false)
+  }
+
+  /**
+   * returns all the stuff needed by a Component
+   */
+  return {
+    onClickAskUserPermission,
+    onClickSusbribeToPushNotification,
+    onClickSendSubscriptionToPushServer,
+    pushServerSubscriptionId,
+    onClickSendNotification,
+    userConsent,
+    pushNotificationSupported,
+    userSubscription,
+    error,
+    loading
+  }
+}

package/src/hooks/useSales/index.js

@@ -27,8 +27,9 @@ import {
 import { updateExistingOrders } from '../useUpdateExistingOrders'
 import { useGetSale } from './useGetSale'
 import { convertToIntegerOrFloat } from './helpers'
-import { useCatWithProduct } from './../useCatWithProduct/index';
-import { useCheckboxState } from '../useCheckbox';
+import { useCatWithProduct } from './../useCatWithProduct/index'
+import { useCheckboxState } from '../useCheckbox'
+import { useLogout } from '../useLogout'
 export * from './useGetAllSales'
 export { GET_ALL_COUNT_SALES } from './queries'
 
@@ -62,6 +63,8 @@ export const useSales = ({
   const domain = getCurrentDomain()
   const [loadingSale, setLoadingSale] = useState(false)
   const [errorSale, setErrorSale] = useState(false)
+  const [onClickLogout] = useLogout({})
+
   const [modalItem, setModalItem] = useState(false)
   const [openCommentModal, setOpenCommentModal] = useState(false)
   const keyToSaveData = process.env.LOCAL_SALES_STORE
@@ -74,7 +77,7 @@ export const useSales = ({
     setCheckedItems,
     handleChangeCheck
   } = useCheckboxState(datCat, [], [])
-    const arr = checkedItems ?  Array.from(checkedItems) : []
+  const arr = checkedItems ? Array.from(checkedItems) : []
   const [totalProductPrice, setTotalProductPrice] = useState(0)
   const [showMore, setShowMore] = useState(100)
   const [inputValue, setInputValue] = useState('')
@@ -117,6 +120,9 @@ export const useSales = ({
           description: message
         })
         setAlertBox({ message, type: 'success' })
+        if (message === 'Token expired') {
+          onClickLogout()
+        }
         setOpenCurrentSale(data?.registerSalesStore?.Response.success)
       },
       onError: (error) => {
@@ -188,12 +194,12 @@ export const useSales = ({
     return setSearch(e.target.value)
   }
   const handleChange = (e, error) => {
-    const { name, value } = e.target;
+    const { name, value } = e.target
     setErrors({ ...errors, [e.target.name]: error })
     setValues((prevValues) => ({
       ...prevValues,
-      [name]: value,
-    }));
+      [name]: value
+    }))
   }
   const onChangeInput = (e) => {
     return setValuesDates({ ...valuesDates, [e.target.name]: e.target.value })
@@ -462,15 +468,15 @@ export const useSales = ({
           return { ...obj, ExtProductFoodsSubOptionalAll: filteredSubOptions }
         })
         .filter((obj) => obj !== null) // Elimine todos los objetos nulos del arreglo
-        const filteredDataExtra = dataExtra?.filter((p) => p?.quantity !== undefined && p?.quantity !== 0);
-        if (product?.PRODUCT?.pId) {
-          dispatch({
-            type: 'PUT_EXTRA_PRODUCTS_AND_OPTIONAL_PRODUCT',
-            payload: product.PRODUCT.pId,
-            dataOptional: filteredDataOptional,
-            dataExtra: filteredDataExtra
-          })
-        }
+      const filteredDataExtra = dataExtra?.filter((p) => p?.quantity !== undefined && p?.quantity !== 0)
+      if (product?.PRODUCT?.pId) {
+        dispatch({
+          type: 'PUT_EXTRA_PRODUCTS_AND_OPTIONAL_PRODUCT',
+          payload: product.PRODUCT.pId,
+          dataOptional: filteredDataOptional,
+          dataExtra: filteredDataExtra
+        })
+      }
     } catch (_error) {
       return sendNotification({
         title: 'Error',
@@ -480,31 +486,30 @@ export const useSales = ({
     }
   }
 
-  function handleIncrementExtra({ Adicionales, index }) {
-    const { pId } = product?.PRODUCT || {};
-    const exPid = Adicionales.exPid || null;
+  function handleIncrementExtra ({ Adicionales, index }) {
+    const { pId } = product?.PRODUCT || {}
+    const exPid = Adicionales.exPid || null
 
     if (exPid && pId) {
       const newExtra = dataExtra.map((producto) => {
         if (exPid === producto.exPid) {
-          const initialQuantity = producto?.quantity ? producto?.quantity : 0;
-          const newQuantity = initialQuantity + 1;
-          const newExtraPrice = producto.extraPrice * newQuantity;
+          const initialQuantity = producto?.quantity ? producto?.quantity : 0
+          const newQuantity = initialQuantity + 1
+          const newExtraPrice = producto.extraPrice * newQuantity
 
           return {
             ...producto,
             quantity: newQuantity,
-            newExtraPrice: newExtraPrice,
-          };
+            newExtraPrice
+          }
         }
-        return producto;
-      });
+        return producto
+      })
 
-      setDataExtra(newExtra);
+      setDataExtra(newExtra)
     }
   }
 
-
   function handleDecrementExtra ({ Adicionales, index }) {
     const { pId } = product?.PRODUCT || {}
     const exPid = Adicionales.exPid || null
@@ -823,8 +828,7 @@ export const useSales = ({
   const client = useApolloClient()
   const { getOnePedidoStore } = useGetSale()
   const handleSubmit = () => {
-
-    if (errors?.change  || errors?.valueDelivery) {
+    if (errors?.change || errors?.valueDelivery) {
       return sendNotification({
         title: 'error',
         backgroundColor: 'warning',
@@ -834,12 +838,12 @@ export const useSales = ({
     setLoadingSale(true)
     const code = RandomCode(10)
     setCode(code)
-    function convertirAEntero(cadena) {
+    function convertirAEntero (cadena) {
       if (typeof cadena === 'string') {
-        const numeroEntero = parseInt(cadena?.replace('.', ''));
+        const numeroEntero = parseInt(cadena?.replace('.', ''))
         return numeroEntero
       }
-      return cadena ||  0
+      return cadena || 0
     }
     return registerSalesStore({
       variables: {