\n {branch.name == \"All branches\" ? (\n
\n {props.notificaions.home_delivery.count > 0 &&\n currentTab !== \"home-delivery/unconfirmed\" ? (\n 0 && \"show\"\n }`}\n >\n
\n ) : null}\n {props.notificaions.pickup.count > 0 &&\n currentTab !== \"pickup/unconfirmed\" ? (\n \n
\n \n
\n \n {getTimeNow()}\n
\n \n \n {props.notificaions.home_delivery.count}{\" \"}\n
\n
\n \n ) : null}\n \n );\n}\n\nconst mapStateToProps = (state: any) => {\n let notificaions = state.notifications;\n let currentTab = state.currentTab;\n\n return { notificaions, currentTab };\n};\n\nconst mapDispatchToProps = {\n clearHomeDeliveryNotifications:\n notificationOperations.clearHomeDeliveryUnconfirmedNotification,\n clearPickupNotifications:\n notificationOperations.clearPickupUnconfirmedNotification,\n};\n\nexport default connect(mapStateToProps, mapDispatchToProps)(OrderNotification);\n","export const SET_THEME = \"theme/SET_THEME\";\n","import actions from \"./actions\";\n\nconst setAppTheme = actions.setAppTheme;\n\nexport default {\n setAppTheme,\n};\n","import * as types from \"./types\";\n\nconst setAppTheme = (mode: string) => ({\n type: types.SET_THEME,\n payload: mode,\n});\n\nexport default { setAppTheme };\n","import reducer from \"./reducers\";\n\nexport { default as themeOperations } from \"./operations\";\n\nexport default reducer;\n","import * as types from \"./types\";\n\nconst themeReducer = (state = \"light\", action: any) => {\n switch (action.type) {\n case types.SET_THEME:\n return action.payload;\n default:\n return state;\n }\n};\n\nconst reducer = themeReducer;\n\nexport default reducer;\n","import React, { useEffect, useState } from \"react\";\nimport { useDispatch } from \"react-redux\";\nimport { themeOperations } from \"../../state/features/theme\";\n\nfunction DarkMode() {\n const body = document.body;\n const lightTheme = \"light\";\n const darkTheme = \"dark\";\n const [theme, setTheme] = useState(localStorage.getItem(\"theme\"));\n const dispatch = useDispatch();\n\n useEffect(() => {\n let savedTheme: any = localStorage.getItem(\"theme\");\n if ([lightTheme, darkTheme].includes(savedTheme)) {\n dispatch(themeOperations.setAppTheme(savedTheme));\n }\n }, []);\n\n if (theme === lightTheme || theme === darkTheme) {\n body.classList.add(theme);\n } else {\n body.classList.add(lightTheme);\n }\n\n const switchTheme = (e: any) => {\n if (theme === darkTheme) {\n body.classList.replace(darkTheme, lightTheme);\n localStorage.setItem(\"theme\", \"light\");\n dispatch(themeOperations.setAppTheme(lightTheme));\n setTheme(lightTheme);\n } else {\n body.classList.replace(lightTheme, darkTheme);\n localStorage.setItem(\"theme\", \"dark\");\n dispatch(themeOperations.setAppTheme(darkTheme));\n setTheme(darkTheme);\n }\n };\n\n return (\n \n
\n \n {getTimeNow()}\n
\n \n \n {props.notificaions.pickup.count}{\" \"}\n
switchTheme(e)}>\n \n ☀\n
\n \n ☾\n
\n \n );\n}\n\nexport default DarkMode;\n","import React from \"react\";\nimport { FormattedMessage } from \"react-intl\";\n\ninterface ILoaderProps {\n message?: string;\n}\n\nconst Loader = (props: ILoaderProps) => {\n return (\n \n
\n );\n};\nexport default Loader;\n","import React from \"react\";\nimport { useEffect } from \"react\";\nimport { useState } from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport { NavLink } from \"react-router-dom\";\n\nfunction MainNav(props: any) {\n const [selectedNavId, setSelectedNavId] = useState(0);\n\n const mainNavs = [\n {\n id: 0,\n title: \n \n
\n {props.message && (\n \n
\n )}\n \n
- \n {mainNavs.map((navItem: any, index: any) => {\n return (\n
- \n
\n {props.loader.loading &&
\n \n );\n}\nconst mapStateToProps = (state: any) => {\n let loader = state.loader;\n let selectedBranch = state.company.selected_branch;\n let branches = state.branches;\n let company = state.company.company_details;\n let payments = state.payments;\n let currentTab = state.currentTab;\n let notifications = state.notifications;\n\n return {\n loader,\n selectedBranch,\n branches,\n company,\n payments,\n currentTab,\n notifications,\n };\n};\n\nconst mapDispatchToProps = {\n fetchCompany: companyConfigurations.fetchCompany,\n fetchBranches: branchOperations.fetchBranches,\n fetchPayments: paymentsOperations.fetchPayments,\n fetchDrivers: driverOperations.fetchDrivers,\n fetchOrder: orderOperations.fetchOrder,\n selectBranch: branchOperations.selectBranch,\n orderMarkedReadyEvent: orderEventsOperations.orderMarkedReady,\n orderPickUpMarkedReady: orderEventsOperations.orderPickUpMarkedReady,\n orderRiderAssigned: orderEventsOperations.orderRiderAssigned,\n orderMarkedDelivered: orderEventsOperations.orderMarkedDelivered,\n orderMarkedCollected: orderEventsOperations.orderMarkedCollected,\n orderCreated: orderEventsOperations.orderCreated,\n orderUpdated: orderEventsOperations.orderUpdated,\n orderVoided: orderEventsOperations.orderVoided,\n orderConfirmed: orderEventsOperations.orderConfirmed,\n orderRejected: orderEventsOperations.orderRejected,\n setDeliveredRefreshRequired:\n homeDeliveryOperations.setDeliveredRefreshRequired,\n setCollectedRefreshRequired: pickupOperations.setCollectedRefreshRequired,\n fetchScheduledOrders: scheduledOperations.fetchScheduledOrders,\n orderMarkedReprinted: orderEventsOperations.orderMarkedReprinted,\n clearHomeDeliveryNotifications:\n notificationOperations.clearHomeDeliveryUnconfirmedNotification,\n clearPickupNotifications:\n notificationOperations.clearPickupUnconfirmedNotification,\n logisticJobCancelled: logisticPartnersOperations.logisticJobCancelled,\n logisticCancelFailed: logisticPartnersOperations.logisticCancelFailed,\n fetchPrintSettings: printSettingsOperations.fetchPrintSettings,\n fetchLogisticPartners: logisticPartnersOperations.fetchLogisticPartners,\n customerArrived: orderEventsOperations.customerArrived,\n orderMarkedPickedUp: orderEventsOperations.orderMarkedPickedUp,\n fetchRiderProximity: riderOperations.fetchRiderProximity,\n orderRiderUnassigned: orderEventsOperations.orderRiderUnassigned,\n orderTipCollected: orderEventsOperations.orderTipCollected,\n orderCompanyRiderAssigned: orderEventsOperations.orderCompanyRiderAssigned,\n orderPartnerRiderAssigned: orderEventsOperations.orderPartnerRiderAssigned,\n};\n\nexport default connect(mapStateToProps, mapDispatchToProps)(Header);\n","import { useContext } from \"react\";\nimport { AudioContext } from \"../context/audioContext\";\nimport { audioContextType } from \"../types/audioContextType\";\n\nconst useNotifyAudioContext = () => {\n const context = useContext(AudioContext) as audioContextType;\n return context;\n};\n\nexport { useNotifyAudioContext };\n","import React, { useEffect, useState } from \"react\";\nimport { useRef } from \"react\";\nimport { connect } from \"react-redux\";\nimport { usePrevious } from \"../../helpers/utils\";\n\ninterface iTabBadgeProps {\n count: any;\n is_loading: boolean;\n}\n\nfunction TabBadge(props: iTabBadgeProps) {\n const count: any = useRef(null);\n const previousCount: any = usePrevious(props.count);\n const previousLoadingState: any = usePrevious(props.is_loading);\n\n useEffect(() => {\n if (\n (previousLoadingState === false || previousLoadingState === undefined) &&\n props.count > previousCount\n ) {\n count.current.classList.add(\"bounce\");\n count.current.addEventListener(\n \"webkitAnimationEnd\",\n function () {\n count.current.classList.remove(\"bounce\");\n },\n false\n );\n }\n }, [props.count]);\n\n return (\n \n {props.count}\n {previousCount}\n \n );\n}\n\nexport default TabBadge;\n","import React from \"react\";\nimport { NavLink } from \"react-router-dom\";\nimport TabBadge from \"../tabBadge\";\n\ninterface ITabNavigationProps {\n tabInfo: any;\n}\n\nfunction TabNavigation(props: ITabNavigationProps) {\n return (\n \n
\n - \n {props.tabInfo.map((tab: any, index: any) => {\n return !tab.is_hidden ? (\n
\n
\n );\n}\n\nexport default NoOrders;\n","import React from \"react\";\n\ninterface IModalCloseProps {\n onClick?: () => void;\n}\n\nconst ModalCloseIcon = (props: IModalCloseProps) => {\n return (\n \n \n \n );\n};\nexport default ModalCloseIcon;\n","export const FETCH_REPRINTS = \"reprints/FETCH_REPRINTS\";\nexport const FETCH_REPRINTS_SUCCESS = \"reprints/FETCH_REPRINTS_SUCCESS\";\nexport const FETCH_REPRINTS_FAIL = \"reprints/FETCH_REPRINTS_FAIL\";\nexport const RESET_REPRINTS = \"reprints/RESET_REPRINTS\";\nexport const SET_ORDER_MARK_AS_REPRINTED = \"reprints/SET_ORDER_MARK_AS_REPRINTED\";\nexport const SET_ORDER_MARK_AS_REPRINTED_SUCCESS = \"reprints/SET_ORDER_MARK_AS_REPRINTED_SUCCESS\";\nexport const SET_ORDER_MARK_AS_REPRINTED_FAIL = \"reprints/SET_ORDER_MARK_AS_REPRINTED_FAIL\";\n","import actions from \"./actions\";\n\nconst fetchReprints = actions.fetchReprints;\nconst resetReprints = actions.resetReprints;\nconst markOrderReprinted = actions.markOrderReprinted;\n\nexport default {\n fetchReprints,\n resetReprints,\n markOrderReprinted,\n};\n","import * as types from \"./types\";\n\nconst fetchReprints = (orderId: any) => ({\n type: types.FETCH_REPRINTS,\n payload: {\n request: {\n method: \"get\",\n url: `/api/v1/orders/${orderId}/print-templates`,\n },\n },\n});\n\nconst resetReprints = () => ({\n type: types.RESET_REPRINTS,\n payload: [],\n});\n\nconst markOrderReprinted = (orderId: any) => ({\n type: types.SET_ORDER_MARK_AS_REPRINTED,\n payload: {\n request: {\n method: \"post\",\n url: `/api/v1/orders/${orderId}/mark-as-reprinted`,\n },\n },\n param: { order_id: orderId },\n});\n\nexport default {\n fetchReprints,\n resetReprints,\n markOrderReprinted,\n};\n","import reducer from \"./reducers\"\n\nexport { default as reprintsOperations } from \"./operations\";\n\nexport default reducer\n","import * as types from \"./types\";\n\nconst reprintsReducer = ( state = [], action: any ) => {\n switch( action.type ) {\n case types.FETCH_REPRINTS_SUCCESS:\n return action.payload.data || [];\n case types.RESET_REPRINTS:\n return action.payload || []\n default: return state;\n }\n};\n\nconst reducer = reprintsReducer;\n\nexport default reducer;\n","import React, { useState } from \"react\";\nimport { Form, Modal } from \"react-bootstrap\";\nimport { FormattedMessage } from \"react-intl\";\nimport { connect } from \"react-redux\";\nimport Swal from \"sweetalert2\";\n\ninterface ICancellationPopupProps {\n onCancel: any;\n cancelReasons?: any;\n onRejectConfirm: any;\n supervisorPassword?: any;\n}\n\nfunction CancellationPopup(props: ICancellationPopupProps) {\n const [selectedReasonId, setSelectedReasonId] = useState(0 as any);\n const [cancellationReasons, setCancellationReasons] = useState([] as any);\n const [supervisorPassword, setSupervisorPassword] = useState(\"\");\n const [disabledConfirm, setDisabledConfirm] = useState(true);\n const [passwordValid, setPasswordValid] = useState(true);\n const [reasonValid, setReasonValid] = useState(true);\n const passwordInput: any = React.useRef();\n\n React.useEffect(() => {\n setCancellationReasons(props.cancelReasons);\n }, [props.cancelReasons]);\n\n React.useEffect(() => {\n if (cancellationReasons.length) {\n setSelectedReasonId(cancellationReasons[0].id);\n }\n }, [cancellationReasons]);\n\n React.useEffect(() => {\n if (selectedReasonId !== 0) {\n if (!props.supervisorPassword) {\n setDisabledConfirm(false);\n } else {\n if (supervisorPassword.length > 0) {\n setDisabledConfirm(false);\n }\n }\n }\n }, [selectedReasonId, supervisorPassword]);\n\n const onselectionchange = (e: any) => {\n setSelectedReasonId(e.target.value);\n };\n\n const onConfirm = (e: any) => {\n e.preventDefault();\n if (selectedReasonId === 0) {\n setReasonValid(false);\n }\n props.onRejectConfirm(selectedReasonId, supervisorPassword);\n };\n\n const onCancel = (e: React.SyntheticEvent) => {\n e.preventDefault();\n props.onCancel();\n };\n\n return (\n \n \n \n \n \n \n \n
\n \n
\n \n \n \n
\n \n \n \n \n {cancellationReasons.length ? (\n {\n setReasonValid(true);\n onselectionchange(e);\n }}\n isValid={false}\n className={!reasonValid ? \"error-input\" : \"\"}\n >\n {cancellationReasons.map((reason: any, index: any) => {\n return (\n \n {reason.reason}\n \n );\n })}\n \n ) : null}\n \n {props.supervisorPassword ? (\n \n \n \n {\n setPasswordValid(true);\n setSupervisorPassword(e.target.value);\n }}\n ref={passwordInput}\n required\n type=\"password\"\n className={!passwordValid ? \"error-input\" : \"\"}\n />\n \n ) : null}\n\n
\n \n );\n}\n\nconst mapStateToProps = (state: any) => {\n let cancelReasons = state.cancelReasons;\n let supervisorPassword = state.company.company_details.supervisor_password;\n return { cancelReasons, supervisorPassword };\n};\n\nexport default connect(mapStateToProps, null)(CancellationPopup);\n","import actions from \"./actions\";\n\nconst fetchCancelReasons = actions.fetchCancelReasons;\n\nexport default {\n fetchCancelReasons,\n};\n","import * as types from \"./types\";\nconst fetchCancelReasons = () => ({\n type: types.FETCH_CANCEL_REASONS,\n payload: {\n request: {\n method: \"get\",\n url: \"/api/v1/cancellation-reasons/list\",\n },\n },\n});\n\nexport default {\n fetchCancelReasons,\n};\n","export const FETCH_CANCEL_REASONS = \"cancelReasons/FETCH_CANCEL_REASONS\";\nexport const FETCH_CANCEL_REASONS_SUCCESS =\n \"cancelReasons/FETCH_CANCEL_REASONS_SUCCESS\";\nexport const FETCH_CANCEL_REASONS_FAIL = \"cancelReasons/FETCH_CANCEL_REASONS_FAIL\";\n","import reducer from \"./reducers\";\n\nexport { default as cancelReasonsOperations } from \"./operations\";\n\nexport default reducer\n","import * as types from \"./types\";\n\nconst cancelReasonsReducer = (state = [], action: any) => {\n switch (action.type) {\n case types.FETCH_CANCEL_REASONS_SUCCESS:\n return action.payload.data || [];\n\n default:\n return state;\n }\n};\n\nconst reducer = cancelReasonsReducer;\n\nexport default reducer;\n","import SapaadLogo from \"../images/sapaad-square.png\";\nimport ZomatoLogo from \"../images/partners/zomato.png\";\nimport TalabatLogo from \"../images/partners/talabat.png\";\nimport DeliverooLogo from \"../images/partners/deliveroo.png\";\nimport SapaadOnline from \"../images/partners/sapaad-online.png\";\nimport SapaadDirect from \"../images/partners/sapaad-direct.png\";\nimport Deliverect from \"../images/partners/generic.png\";\nimport UberEats from \"../images/partners/uber.png\";\nimport Foodpanda from \"../images/partners/foodpanda.png\";\nimport Gpay from \"../images/partners/gpay.png\";\nimport Grab from \"../images/partners/grab.png\";\nimport Lalamove from \"../images/third-party-delivery/lalamove.png\";\nimport Lyve from \"../images/third-party-delivery/lyve.png\";\nimport Quiqup from \"../images/third-party-delivery/quiqup.png\";\nimport Shadowfax from \"../images/third-party-delivery/shadowfax.png\";\nimport ZomatoGo from \"../images/third-party-delivery/zomato-go.png\";\nimport Otter from \"../images/partners/generic.png\";\nimport UrbanPiper from \"../images/partners/generic.png\";\nimport MyMenu from \"../images/partners/my-menu.png\";\n\nconst orderImages = {\n sapaad_pos: {\n image: SapaadLogo,\n },\n sapaad_online: {\n image: SapaadOnline,\n },\n zomato: {\n image: ZomatoLogo,\n },\n talabat: {\n image: TalabatLogo,\n },\n deliveroo: {\n image: DeliverooLogo,\n },\n byod: {\n image: SapaadDirect,\n },\n deliverect: {\n image: Deliverect,\n },\n uber_eats: {\n image: UberEats,\n },\n foodpanda: {\n image: Foodpanda,\n },\n gpay_food: {\n image: Gpay,\n },\n grab: {\n image: Grab,\n },\n lalamove: {\n image: Lalamove,\n },\n lyve: {\n image: Lyve,\n },\n quiqup: {\n image: Quiqup,\n },\n shadowfax: {\n image: Shadowfax,\n },\n \"zomato-go\": {\n image: ZomatoGo,\n },\n otter: {\n image: Otter,\n },\n urban_piper: {\n image: UrbanPiper,\n },\n my_menu: {\n image: MyMenu,\n },\n} as any;\n\nexport default orderImages;\n","import React, { useEffect, useState } from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport { connect } from \"react-redux\";\nimport {\n calculateSubtotal,\n calculateTax,\n formatDecimal,\n} from \"../../../helpers/itemCalculations\";\nimport { updateOrderTotalAmount } from \"../../../helpers/orderFunctions\";\n\ninterface iOrderItemsDetailsProps {\n order: any;\n tax_inclusive?: any;\n currency?: any;\n}\n\nfunction OrderItemsDetails(props: iOrderItemsDetailsProps) {\n const [orderItems, setOrderItems] = useState([] as any);\n const [totalDiscount, setTotalDiscount] = useState(0);\n const [taxTotal, setTaxTotal] = useState(0);\n const [loyaltyRedeemedValue, setloyaltyRedeemedValue] = useState(0);\n\n useEffect(() => {\n setOrderItems(addModifiersToItems(props.order.order_extended_info.items));\n getTotalDiscounts(props.order.order_extended_info.items);\n if (props.order.order_extended_info.payments.length) {\n props.order.order_extended_info.payments.map((payment: any) => {\n if (payment.name === \"Loyalty\") {\n setloyaltyRedeemedValue(payment.amount);\n }\n });\n }\n }, [props.order]);\n\n const addModifiersToItems = (items: any) => {\n let parentItems = items.filter(\n (item: any) => item.order_item_parent_id === 0 && item.deleted === false\n );\n parentItems.map((parentItem: any) => {\n parentItem.modifiers = [];\n });\n\n items.map((item: any) => {\n parentItems.map((parentItem: any) => {\n if (\n item.order_item_parent_id === parentItem.order_item_id &&\n item.deleted === false\n ) {\n parentItem.modifiers.push(item);\n }\n });\n });\n return parentItems;\n };\n\n const getModifierItemSubprice = (item: any) => {\n let amount: any = item.amount;\n item.modifiers.map((modifier: any) => {\n amount += modifier.amount;\n });\n return formatDecimal(amount);\n };\n\n const getTotalDiscounts = (items: any) => {\n let discountAppliedItems = items.filter(\n (item: any) => item.discount_amount !== null\n );\n let total_discount = 0;\n discountAppliedItems.map((item: any) => {\n total_discount += item.discount_amount;\n });\n setTotalDiscount(total_discount);\n };\n\n useEffect(() => {\n setTaxTotal(\n calculateTax(orderItems, props.order.order_extended_info.surcharges)\n );\n }, [orderItems]);\n\n return (\n \n \n
\n \n \n \n
\n \n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n {orderItems.length\n ? orderItems\n .map((orderItem: any, index: any) => {\n return (\n
\n );\n })\n .reverse()\n : false}\n \n \n {orderItem.discount_name ? (\n \n {orderItem.modifiers.length\n ? getModifierItemSubprice(orderItem)\n : formatDecimal(orderItem.amount)}\n \n
\n \n {orderItem.name}\n {orderItem.discount_name ? (\n
\n \n \n
\n ) : null}\n {orderItem.modifiers.length ? (\n \n
\n ) : null}\n {orderItem.note ? (\n - \n {orderItem.modifiers\n\n .map((modifierItem: any, index: any) => {\n return (\n
- \n {modifierItem.qty_dec /\n orderItem.qty_dec >\n 1\n ? `${\n modifierItem.qty_dec /\n orderItem.qty_dec\n }x `\n : null}\n {modifierItem.name}\n \n {formatDecimal(modifierItem.amount)}\n \n \n );\n })\n .reverse()}\n
\n
\n ) : null}\n \n {orderItem.qty_dec}\n
\n \n {formatDecimal(orderItem.price)}\n
\n \n {orderItem.modifiers.length\n ? formatDecimal(\n getModifierItemSubprice(orderItem) -\n orderItem.discount_amount\n )\n : formatDecimal(\n orderItem.amount - orderItem.discount_amount\n )}\n
\n ) : null}\n\n
\n \n );\n}\n\nconst mapStateToProps = (state: any) => {\n let currency = state.company.company_details.currency;\n let tax_inclusive = state.company.company_details.is_tax_inclusive;\n return { currency, tax_inclusive };\n};\n\nexport default connect(mapStateToProps)(OrderItemsDetails);\n","import { faHistory } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport React, { useEffect, useState } from \"react\";\nimport { FormattedMessage , useIntl} from \"react-intl\";\nimport { connect } from \"react-redux\";\nimport { getStatusTime } from \"../../../helpers/orderFunctions\";\nimport { getEnvValueFor } from \"../../../helpers/utils\";\n\ninterface iCustomerDetailsProps {\n order: any;\n branches?: any;\n}\n\nfunction CustomerDetails(props: iCustomerDetailsProps) {\n const [branches, setBranches] = useState([] as any);\n\n useEffect(() => {\n setBranches(props.branches);\n }, [props.branches]);\n\n const getBranchName = (locationId: any) => {\n let branchName = \"\";\n branches.find((branch: any) => {\n if (branch.id == locationId) {\n branchName = branch.name;\n }\n });\n return branchName;\n };\n\n const formattedMessage = (formatId: any) => {\n const intl = useIntl();\n const translatedMessage = intl.formatMessage({ id: formatId })\n return translatedMessage;\n };\n\n return (\n \n
\n \n
\n {totalDiscount > 0 ? (\n \n
{calculateSubtotal(orderItems)}
\n\n
\n ) : null}\n {props.order.order_extended_info.surcharges.length\n ? props.order.order_extended_info.surcharges.map(\n (surcharge: any, index: any) => {\n return (\n \n
-{formatDecimal(totalDiscount)}
\n\n
\n );\n }\n )\n : null}\n\n {props.order.order_extended_info.discounts.length\n ? props.order.order_extended_info.discounts.map(\n (discount: any, index: any) => {\n return (\n {surcharge.name + \" : \"}
\n{formatDecimal(surcharge.amount)}
\n\n
\n );\n }\n )\n : null}\n {!props.tax_inclusive && taxTotal > 0 ? (\n {discount.name + \" : \"}
\n{`-${formatDecimal(\n discount.amount\n )}`}
\n\n
\n ) : null}\n {loyaltyRedeemedValue ? (\n \n
{formatDecimal(taxTotal)}
\n\n
\n ) : null}\n \n
\n -{formatDecimal(loyaltyRedeemedValue)}\n
\n\n
\n \n
\n {props.currency}{\" \"}\n {formatDecimal(updateOrderTotalAmount(props.order))}\n
\n\n {!props.order.order_extended_info.take_away ? (\n
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let branches = state.branches;\n return { branches };\n};\n\nexport default connect(mapStateToProps)(CustomerDetails);\n","import React from \"react\";\nimport { FormattedMessage } from \"react-intl\";\n\ninterface iThirdPartyDetailsProps {\n details: any;\n}\n\nfunction ThirdPartyDetails(props: iThirdPartyDetailsProps) {\n return (\n \n {props.order.order_extended_info.delivery_address.room_number ? (\n \n {props.order.order_extended_info.delivery_address.room_number}\n \n ) : null}\n {props.order.order_extended_info.delivery_address.building ? (\n \n {props.order.order_extended_info.delivery_address.building}\n \n ) : null}\n {props.order.order_extended_info.delivery_address.land_mark ? (\n \n {props.order.order_extended_info.delivery_address.land_mark}\n \n ) : null}\n {props.order.order_extended_info.delivery_address.street ? (\n \n {props.order.order_extended_info.delivery_address.street}\n \n ) : null}\n {props.order.order_extended_info.take_away ? (\n props.order.location_id ? (\n \n {getBranchName(props.order.location_id) || \"\"}\n \n ) : null\n ) : null}\n
\n ) : null}\n \n {props.order.scheduled_for > props.order.placed_at ? (\n
\n {props.order.order_extended_info.notes ? (\n \n
\n ) : null}\n\n {props.order.order_extended_info.customer.name ? (\n \n
\n
\n ) : null}\n {props.order.order_extended_info.customer.telephone ? (\n \n
\n {\" \"}{props.order.order_extended_info.customer.name}\n \n
\n
\n ) : null}\n {props.order.order_extended_info.customer.alt_telephone_number ? (\n \n
\n
\n ) : null}\n {props.order.location_id ? (\n \n
\n
\n ) : null}\n {props.order.order_extended_info.delivery_address.area ? (\n \n {props.order.order_extended_info.take_away ? (\n
\n
\n ) : null}\n \n
\n \n
\n ) : null}\n {props.order.order_extended_info.notes}
\n\n
\n );\n}\n\nexport default ThirdPartyDetails;\n","import React, { useEffect, useState } from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport { formatDecimal } from \"../../../helpers/itemCalculations\";\n\ninterface iPaymentDetailsProps {\n payments: any;\n dmCanRecordPayment: boolean;\n isOrderDelivered: boolean;\n totalAmount: any;\n}\n\nfunction PaymentDetails(props: iPaymentDetailsProps) {\n const [payments, setPayments] = useState([] as any);\n\n const getReturnedAmount = (amount: any, amountCollected: any) => {\n let balance = amountCollected - amount;\n if (balance > 0) {\n return formatDecimal(balance);\n } else {\n return formatDecimal(0);\n }\n };\n\n useEffect(() => {\n setPayments(props.payments);\n }, [props.payments]);\n\n useEffect(() => {\n // When Record payment is off and Order is delivered showing Cash as default payment\n if (props.isOrderDelivered && !props.dmCanRecordPayment) {\n let new_payment: any = {\n id: 1,\n name: \"Cash\",\n amount: props.totalAmount,\n };\n if (props.payments.length === 0) {\n setPayments([new_payment]);\n } else {\n if (\n props.payments.length === 1 &&\n props.payments[0].name === \"Loyalty\" &&\n props.totalAmount != 0\n ) {\n setPayments([\n ...props.payments,\n {\n ...new_payment,\n amount: props.totalAmount,\n },\n ]);\n }\n }\n }\n }, [props.dmCanRecordPayment, props.payments, props.totalAmount]);\n\n return (\n \n
\n \n
{props.details}
\n \n
\n );\n}\n\nexport default PaymentDetails;\n","import React from \"react\";\nimport { FormattedMessage } from \"react-intl\";\n\nconst orderStatus = {\n unconfirmed: {\n online: {\n title: \n
\n \n
\n
\n \n
\n {payments.length > 0 ? (\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n {payments.map((payment: any, index: any) => {\n return (\n
\n ) : (\n \n
\n );\n })}\n {payment.name}
\n \n {formatDecimal(payment.amount)}\n
\n \n {payment.amount_collected\n ? formatDecimal(payment.amount_collected)\n : formatDecimal(payment.amount)}\n
\n \n {payment.amount_collected\n ? getReturnedAmount(\n payment.amount,\n payment.amount_collected\n )\n : formatDecimal(0)}\n
\n \n {payment.tip\n ? formatDecimal(payment.tip)\n : formatDecimal(0)}\n
\n \n
\n )}\n \n
\n );\n}\n\nexport default StatusHistory;\n","import React from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport { getWhatModifiedString } from \"../../../helpers/modificationString\";\nimport { getStatusTime } from \"../../../helpers/orderFunctions\";\n\ninterface iModificationHistoryProps {\n order: any;\n}\n\nfunction ModificationHistory(props: iModificationHistoryProps) {\n const getModificationHistory = (items: any) => {\n let modifications: any = [];\n items.filter((item: any) => {\n if (item.modification_history.length) {\n item.modification_history = item.modification_history.map(\n (modification: any) => {\n modification.item_name = item.name;\n return modification;\n }\n );\n modifications = modifications.concat(item.modification_history);\n }\n });\n let modification_history;\n if (modifications.length) {\n modification_history = modifications.map((item: any, index: any) => {\n return (\n \n
\n \n
\n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n {props.order.status_updates.length > 0\n ? props.order.status_updates.map((status: any, index: any) => {\n if (status.event !== \"rider_unassigned\") {\n return (\n
\n \n
\n );\n }\n })\n : null}\n \n {\n orderStatus[status.event][props.order.order_type]\n .title\n }\n
\n {status.staff_name}
\n \n {getStatusTime(status.time)}\n
\n \n
\n );\n });\n } else {\n modification_history = (\n {item.item_name}
\n \n {getWhatModifiedString(item.item_name, item)}\n
\n \n {item.staff_name ? item.staff_name : \"\"}\n
\n {getStatusTime(item.created_at)}
\n {item.reason}
\n \n
\n );\n }\n return modification_history;\n };\n\n return (\n \n
\n );\n}\n\nexport default ModificationHistory;\n","import React from \"react\";\nimport { FormattedMessage } from \"react-intl\";\n\nconst getWhatModifiedString = (item: any, modification: any) => {\n let whatModifiedString: any = \"\";\n if (\n modification.modification_type === \"quantity_increase\" ||\n modification.modification_type === \"quantity_decrease\"\n ) {\n whatModifiedString = (\n \n
\n \n
\n
\n \n
\n {props.order.event === \"order_updated\" ||\n props.order.event === \"scheduled_order_fired\" ? (\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n {props.order.order_extended_info.items.length > 0\n ? getModificationHistory(props.order.order_extended_info.items)\n : null}\n
\n ) : (\n \n
\n )}\n \n
\n \n \n \n
\n \n \n
\n {!props.order.is_cod ? (\n \n \n {props.order.order_extended_info.order_number}\n
\n\n \n
\n ) : (\n <>\n )}\n \n \n \n
\n \n {props.order.scheduled_for > props.order.placed_at ? (\n \n
\n ) : null}\n \n
\n ) : null}\n {showDeliveryEta ? (\n \n
\n \n
\n {getStatusTime(props.order.scheduled_for)}\n
\n\n
\n {etaInputFocus ? (\n setEtaInputFocus(true)}\n onChange={(e: any) => setEtaInput(e)}\n />\n ) : (\n setEtaInputFocus(true)}>\n {eta} {\" \"}\n \n )}\n setEtaInputFocus(true)}>\n
\n \n \n \n
\n \n \n {showModify ? (\n disableModify ? (\n \n handleApproveOrder()}\n className={\n disabledConfirm\n ? \"btn btn-success px-5 disabled-button\"\n : \"btn btn-success px-5\"\n }\n disabled={disabledConfirm}\n >\n {isLimboState ? (\n \n {isLimboState ? (\n \n closeReprints()\n : () => toggleReprints(props.order.order_id)\n }\n >\n \n \n {reprintsList.length ? (\n reprintsList.map((reprint: any, index: any) => {\n return (\n \n openReprintWindow(\n reprint.print_url,\n props.order.order_id\n )\n }\n >\n {reprint.name}\n \n );\n })\n ) : (\n \n \n \n ) : null}\n {showVoidOrderCta ? (\n isAggregator(props.order.order_source) ? (\n \n
\n \n {showCancelPopup ? (\n \n handleDisabledModifyClick()}\n />\n \n
\n ) : (\n \n handleDisabledApproveClick()}\n />\n handleApproveOrder()}\n className=\"btn btn-success px-5 disabled-button allowed\"\n disabled\n >\n
\n ) : (\n \n handleDisabledApproveClick()}\n />\n \n
\n ) : (\n \n
\n )}\n \n \n
\n ) : (\n {elapsedTime}
;\n}\n\nconst mapDispatchToProps = {\n removeExpiredOrder:orderOperations.removeExpiredOrder\n}\n\nexport default connect(null, mapDispatchToProps)(ElapsedTime);\n","import React, {\n Dispatch,\n SetStateAction,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { FormattedMessage, useIntl } from \"react-intl\";\nimport KeyboardReact, { SimpleKeyboard } from \"react-simple-keyboard\";\nimport { numberInputRegex } from \"../../helpers/utils\";\n\ninterface IKeypadProps {\n inputValue: any;\n setInputValue: Dispatch{title}
: null}\n\n {itemsList.map((item, index) => (\n handleSelect(item)}>\n {item.icon ? (\n \n })
\n \n ) : null}\n
\n ))}\n \n \n );\n};\n\ninterface IItemSelectionGridFooterProps {\n showCloseButtonAs?: \"back\" | \"\";\n currentPage: number;\n totalPages: number;\n nextPageAction(): void;\n prevPageAction(): void;\n onClose(): void;\n}\n\nconst ItemSelectionGridFooter = ({\n showCloseButtonAs = \"\",\n currentPage,\n totalPages,\n nextPageAction,\n prevPageAction,\n onClose: handleClose,\n}: IItemSelectionGridFooterProps) => {\n return (\n <>\n {showCloseButtonAs === \"back\" ? (\n {item.name}
\n\n
\n )}\n \n {currentPage}
\n \n \n
\n \n );\n};\n\nexport { ItemSelectionGridView, ItemSelectionGridFooter };\n","enum PAYMENT_STATUS {\n WAITING = \"waiting\",\n IN_PROGRESS = \"in_progress\",\n PAID = \"paid\",\n FAILED = \"failed\",\n CANCELLED = \"cancelled\",\n}\n\nexport { PAYMENT_STATUS };\n","import { useEffect, useRef, useState } from \"react\";\nimport \"@stripe/terminal-js\";\nimport type { Terminal } from \"@stripe/terminal-js\";\nimport { STRIPE_CONNECT_ERROR, STRIPE_CONNECT_TXN_STEP } from \"../../utils\";\nimport { PAYMENT_STATUS } from \"../../../../types/payments\";\n\ninterface Params {\n amount: string | number;\n paymentTypeId: string;\n getDeviceId: any;\n clearDeviceId: any;\n locationPartnerConfig: any;\n locationId: number;\n simulated?: boolean;\n processStripeConnectTerminalPayment(stripeLocationId: any): Promise,\n }}\n />\n );\n case STRIPE_CONNECT_ERROR.DISCOVERY_ERROR:\n return (\n
,\n }}\n />\n );\n case STRIPE_CONNECT_ERROR.REQUIRES_CONFIRMATION:\n return (\n
,\n }}\n />\n );\n case STRIPE_CONNECT_ERROR.REQUEST_TIMED_OUT:\n return (\n
,\n }}\n />\n );\n case STRIPE_CONNECT_ERROR.READER_CONNECT_ERROR:\n return (\n
,\n }}\n />\n );\n case STRIPE_CONNECT_ERROR.PAYMENT_COLLECTION_ERROR:\n case STRIPE_CONNECT_ERROR.PAYMENT_CONFIRMATION_ERROR:\n return <>{stripeConnectError.message};\n\n default:\n return (\n
\n
\n );\n};\nexport default StripeConnectTxnStatusView;\n","import React, { useMemo } from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport PaymentPendingDark from \"../../../../images/payment-status/payment-animation-dark.gif\";\nimport PaymentPending from \"../../../../images/payment-status/payment-animation.gif\";\nimport PaymentErrorGeneric from \"../../../../images/payment-status/payment-error-generic.png\";\nimport { PAYMENT_STATUS } from \"../../../../types/payments\";\nimport { useAppStateSelector } from \"../../../../hooks/useAppStateSelector\";\n\nconst PaymentSuccessAnimation = () => {\n return (\n \n {txnStatus === PAYMENT_STATUS.IN_PROGRESS ? (\n <>\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n {showCancelTxnCta ? (\n \n
\n \n ) : null}\n {txnStatus === PAYMENT_STATUS.PAID && (\n <>\n \n
\n \n
\n
\n \n {showCloseTxnViewCta ? (\n \n
\n \n )}\n \n \n
\n
\n \n );\n};\nexport default MagnatiTxnStatusView;\n","import React from \"react\";\nimport { useAppStateSelector } from \"../../../../hooks/useAppStateSelector\";\nimport PaymentPendingDark from \"../../../../images/payment-status/payment-animation-dark.gif\";\nimport PaymentPending from \"../../../../images/payment-status/payment-animation.gif\";\nimport PaymentErrorGeneric from \"../../../../images/payment-status/payment-error-generic.png\";\nimport { PAYMENT_STATUS } from \"../../../../types/payments\";\nimport { FormattedMessage } from \"react-intl\";\n\nconst PaymentSuccessAnimation = () => {\n return (\n \n {[PAYMENT_STATUS.IN_PROGRESS, PAYMENT_STATUS.WAITING].includes(\n txnStatus\n ) ? (\n <>\n \n
\n \n
\n \n \n
\n \n
\n \n
\n {showCancelTxnCta ? (\n \n
\n \n ) : null}\n {txnStatus === PAYMENT_STATUS.PAID ? (\n <>\n \n
\n \n
{txnDeclineReason}
\n\n
\n \n
\n \n ) : null}\n {txnStatus === PAYMENT_STATUS.CANCELLED && (\n <>\n \n
\n \n
\n \n
\n \n )}\n \n \n
\n
\n \n );\n};\n\nexport default RazorpayTxnStatusView;\n","import React from \"react\";\nimport { ReactNode } from \"react\";\nimport { PAYMENT_PARTNER } from \"./utils\";\nimport StripeConnectTxnStatusView from \"./paymentPartners/stripeConnect\";\nimport MagnatiTxnStatusView from \"./paymentPartners/magnati\";\nimport RazorpayTxnStatusView from \"./paymentPartners/razorpay\";\n\nconst TransactionStatusView = ({\n selectedPaymentPartner,\n stripeConnectConfigs,\n magnatiConfigs,\n razorpayConfigs,\n children,\n}: {\n selectedPaymentPartner: string | PAYMENT_PARTNER;\n stripeConnectConfigs: any;\n magnatiConfigs: any;\n razorpayConfigs: any;\n children: ReactNode;\n}) => {\n switch (selectedPaymentPartner){\n case PAYMENT_PARTNER.STRIPE_CONNECT:\n return \n {[PAYMENT_STATUS.IN_PROGRESS, PAYMENT_STATUS.WAITING].includes(\n txnStatus\n ) ? (\n <>\n \n
\n \n
\n \n \n
\n \n
\n \n
\n {showCancelTxnCta ? (\n \n
\n \n ) : null}\n {txnStatus === PAYMENT_STATUS.PAID ? (\n <>\n \n
\n \n
{txnDeclineReason}
\n\n
\n \n
\n \n ) : null}\n {txnStatus === PAYMENT_STATUS.CANCELLED && (\n <>\n \n
\n \n
\n \n
\n \n )}\n \n \n
\n ) : (\n <>\n {showPaymentTypes || showDevices ? (\n showDevices ? (\n \n \n {formatDecimal(balanceAmount)}\n \n
\n\n setShowPaymentTypes(true)}\n >\n \n {selectedPayment ? selectedPayment.display_name : \"\"}\n \n \n
\n \n )}\n \n )}\n \n \n
\n {showPaymentBreakDown && !showPaymentTypes ? (\n <>\n {roundedString}
\n ) : null}\n\n
\n \n \n {paymentBreakdown.map(\n (payment: any, index: number) => (\n <>\n
\n
\n \n ) : null}\n \n
\n \n
\n {props.currency +\n \" \" +\n formatDecimal(paymentAmount)}\n
\n| \n {payment.payment.display_name}\n {payment.referenceCode\n ? `(${payment.referenceCode})`\n : null}\n | \n\n {props.currency + \" \" + payment.amount}\n | \n\n | \n
\n \n setShowPaymentBoxCCInput(false)}\n >\n \n {(placeholder) => (\n addRefCode(e)}\n placeholder={placeholder}\n />\n )}\n \n
\n ) : null}\n \n
\n {showKeypad ? (\n \n setShowKeypad(!showKeypad)}\n icon={faTh}\n />\n
\n \n setShowKeypad(!showKeypad)}\n icon={faTh}\n />\n
\n \n \n
\n ) : (\n <>\n {showPaymentTypes || showDevices ? (\n showDevices ? (\n \n
\n );\n if (props.orderId && !isLimboState) {\n props.handleAutoReject(props.orderId);\n }\n }, differenceInTimeCopy * 1000);\n let elapsedSeconds: any;\n let timeIntervel = setInterval(() => {\n let current_time: any = new Date();\n var differenceInTime = Math.abs((current_time - reject_time) / 1000);\n let elapsedHours: any = differenceInTime / (60 * 60);\n var elapsedMinutes: any = (elapsedHours * 60) % 60;\n elapsedSeconds = (elapsedMinutes * 60) % 60;\n if (parseInt(elapsedHours) > 0) {\n setTimer(\n \n
\n );\n } else if (parseInt(elapsedMinutes) > 0) {\n setTimer(\n {parseInt(elapsedHours)}
\n \n
\n );\n } else {\n setTimer(\n {parseInt(elapsedMinutes + 1)}
\n \n
\n );\n setStartTimer(true);\n }\n }, 1000);\n setAutoRejectInSecs(parseInt(elapsedSeconds));\n return () => {\n clearInterval(timeIntervel);\n clearTimeout(timeout);\n };\n }, [props.placedTime]);\n\n useEffect(() => {\n if (props.limboStateOrders.length) {\n if (props.limboStateOrders.includes(props.orderId)) {\n setIsLimboState(true);\n }\n }\n }, [props.limboStateOrders.length]);\n\n return (\n {parseInt(elapsedSeconds)}
\n \n
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let limboStateOrders = state.limboStateOrders;\n return { limboStateOrders };\n};\n\nexport default connect(mapStateToProps)(RadialTimeCount);\n","import React, { useEffect } from \"react\";\nimport { Modal } from \"react-bootstrap\";\nimport { FormattedMessage } from \"react-intl\";\n\ninterface ISetDeliveryTimePopup {\n show: any;\n handleShow: any;\n handleApprove: any;\n orderId: any;\n defaultDeliveryEta: any;\n}\n\nfunction SetDeliveryTimePopup(props: ISetDeliveryTimePopup) {\n const [eta, setEta] = React.useState(0 as number);\n const [disabledConfirm, setConfirmDisabled] = React.useState(false);\n const etaInput: any = React.useRef();\n const setEtaInput = (e: any) => {\n let regExp = /^([0-9]|[0-9][0-9]|[0-9][0-9][0-9])$/;\n setConfirmDisabled(!regExp.test(e.target.value));\n setEta(e.target.value);\n };\n\n useEffect(() => {\n if (etaInput.current) {\n etaInput.current.focus();\n }\n }, [props.show]);\n\n useEffect(() => {\n setEta(props.defaultDeliveryEta);\n }, [props.defaultDeliveryEta]);\n\n return (\n \n [true, 1000]}\n >\n {timer}\n \n
\n \n
\n \n
\n setEtaInput(e)}\n />\n
\n \n
\n \n {props.title}\n \n
\n );\n}\n","import React, { useEffect, useState } from \"react\";\nimport { Modal } from \"react-bootstrap\";\nimport { FormattedMessage } from \"react-intl\";\nimport { connect } from \"react-redux\";\nimport { logisticPartnersOperations } from \"../../state/features/logisticPartners\";\nimport type { AxiosErrorResponse } from \"../../types/axiosMiddleware\";\nimport ModalCloseIcon from \"../modalCloseIcon\";\nimport OrderButtonGroup from \"../orderButtonGroup\";\n\ninterface iLogisticDetailsPopupProps {\n handleClose: any;\n orderId: any;\n trackUrl: any;\n cancelLogisticJob: any;\n onCancel: any;\n logisticStatus: any;\n}\n\nfunction LogisticDetailsPopup(props: iLogisticDetailsPopupProps) {\n const [show, setShow] = useState(true);\n const [showCancelPickup, setShowCancelPickup] = useState(true);\n const handleClose = () => {\n setShow(false);\n props.handleClose();\n };\n const setCancelCtaText = () => {\n return \n \n
\n );\n}\n","import React from \"react\";\n\nexport default function Refresh() {\n return (\n \n \n
\n );\n}\n","import {\n DirectionsRenderer,\n GoogleMap,\n Marker,\n useJsApiLoader,\n} from \"@react-google-maps/api\";\nimport React, {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { CoordinateLiteral } from \"../riderTracking\";\nimport { FormattedMessage } from \"react-intl\";\nimport { faMapPin } from \"@fortawesome/free-solid-svg-icons\";\nimport motorCycleIcon from \"./icons/motorcycle-icon-pin.svg\";\nimport Loader from \"./icons/loader\";\nimport Refresh from \"./icons/refresh\";\nimport { getEnvValueFor } from \"../../helpers/utils\";\n\ninterface IRiderMapContainerProps {\n order: any;\n userCoords: CoordinateLiteral;\n riderCoords: CoordinateLiteral;\n riderDetails: any;\n riderLastGeoUpdate: any;\n fetchRiderLocation: any;\n}\n\nconst RiderMapContainer = (props: IRiderMapContainerProps) => {\n const [directions, setDirections] = useState\n \n
\n ) : null}\n \n {isMapLoaded ? (\n refreshMap()}>\n {refeshLoading ?
\n ) : (\n \n
\n
\n {isMapLoaded ? (\n refreshMap()}>\n {refeshLoading ?
\n )}\n {directions && (\n \n
\n
\n
\n );\n};\n\nconst MapErrorBoundary = ({ children }:any) => {\n return (\n \n
\n \n 
\n
\n \n
\n Oops! Unable to load map
\nPlease try again by reloading the page
\n\n
\n );\n};\n\nconst mapStateToProps = (state: any) => {\n let locations = state.branches;\n let companyRiders = state.drivers.company_drivers;\n\n return { locations, companyRiders };\n};\n\nconst mapDispatchToProps = {\n fetchRiderCoordinates: driverOperations.fetchRiderCoordinates,\n};\n\nexport default connect(mapStateToProps, mapDispatchToProps)(RiderTracking);\n","import React, { useRef } from \"react\";\n\ninterface ThrottleButtonProps {\n onClick?: (event?: any) => any;\n className?: string;\n style?: any;\n disabled?: boolean;\n children?: React.ReactNode;\n}\n\nexport function Button({\n onClick = () => {},\n className = \"\",\n style = {},\n disabled = false,\n children,\n}: ThrottleButtonProps) {\n const debouncedClick = useRef(false);\n\n const handleClick = (e: any) => {\n if (!debouncedClick.current) {\n onClick(e);\n debouncedClick.current = true;\n setTimeout(() => {\n debouncedClick.current = false;\n }, 3000);\n }\n };\n\n return (\n \n {locationCoords ? (\n rider.isAssignedToOrder && rider.isRiderMissingFromCompany ? (\n \n \n )\n ) : (\n
\n \n
\n ) : (\n \n
\n \n
\n
\n
\n )}\n \n
\n \n
\n \n
\n
- \n
\n
\n \n
\n
\n \n setSearchValue(e.target.value)}\n />\n
\n \n
\n \n
\n - 0 ? {} : { height: \"360px\" }}>\n {companyRiders.length > 0 &&\n companyRidersFilter[0] != \"No Drivers\" ? (\n <>\n {(companyRidersFilter.length != 0\n ? companyRidersFilter\n : companyRiders\n ).map((rider: any, index: number) => {\n return (\n
- \n
\n \n )}\n
\n {\n handleShowRiderTracking(rider);\n }}\n className=\"dropdown-group-btn show-map-button btn mr-3\">\n {\n handleCompanyRiderSelect(rider);\n assignCompanyRider(rider);\n }}\n className=\"dropdown-group-btn light-green btn px-4\">\n
\n \n );\n })}\n \n ) : (\n \n {\" \"}\n
\n - \n {partnerRiders.length > 0 &&\n partnerRidersFilter[0] != \"No Drivers\" ? (\n <>\n {(partnerRidersFilter.length != 0\n ? partnerRidersFilter\n : partnerRiders\n ).map((partner: any, index: number) => {\n return (\n
- \n {partner.name}\n \n\n
\n \n \n );\n })}\n \n ) : (\n - \n
\n \n )}\n
\n {showLoading ? (\n \n
\n ) : props.riderAppEnabled ? (\n \n
\n ) : (\n <>\n {props.order.logistics_job &&\n props.order.logistics_job.status != 3 ? (\n \n {\n logisticOrderStatus[props.order.logistics_job.status]\n .popup_title\n }\n {\n logisticOrderStatus[props.order.logistics_job.status]\n .concatString\n }\n
\n\n {\n logisticOrderStatus[props.order.logistics_job.status]\n .popup_text\n }\n
\n\n setShowThirdPartyDetails(true)}>\n
\n ) : (\n \n handleCancelPickup()}>\n
\n )}\n \n {showOwnDriverStatus ? (\n {\n handleDriverSelect(rider, \"own\");\n }}\n onShowRiderTracking={(rider) => {\n handleDriverSelect(rider, \"own\");\n setShowOwnDriverStatus(true);\n }}\n onPartnerRiderSelect={(partnerRider) => {\n handleDriverSelect(partnerRider, \"logistics\");\n }}\n assignCompanyRider={(rider) => handleRiderAssign(rider)}\n />\n \n )}\n
\n ) : (\n \n
\n ) : (\n <>\n \n
{selectedDriver?.name ?? \"\"}
\n\n {showOwnDriverStatus &&\n !props.order.order_status?.includes(\"in_progress\") &&\n (props.order.rider_id ? (\n <>\n {props.order.order_status?.includes(\"ready\") ? (\n props.handleOrder()}\n className=\"dropdown-group-btn btn light-green popup-footer-btn\">\n \n setShowOwnDriverStatus(false)}\n className=\"dropdown-group-btn light-green btn px-5\">\n
\n \n \n
\n
\n )}\n \n )}\n \n \n {showThirdPartyDetails && props.order.logistics_job ? (\n \n
\n \n
- \n {partnerDrivers.length > 0 ? (\n <>\n {partnerDrivers.map((partner: any, index: number) => {\n return (\n
- \n
\n \n )}\n
\n \n
\n );\n }\n\n if(ownRiderAssignedState){\n let isRiderAssignedState = Boolean(order.rider_id);\n let isItemsPurchasedState =\n order.logistics_job && order.logistics_job?.status !== 3;\n return (\n \n {logisticOrderStatus[order.logistics_job.status].btn_icon ? (\n
\n \n {isRiderAssignedState ? (\n
\n );\n }\n\n if (isPartnerAssignmentPending) {\n return (\n \n {riderName ? (\n
\n \n
\n );\n }\n\n if (logisticsConfigs.logisticsPartnerAssigned) {\n return (\n \n \n {logisticOrderStatus[order.logistics_job.status].btn_icon ? (\n
\n );\n }\n\n if (\n (logisticsConfigs.orderLogisticsPartners.length > 0 &&\n logisticsConfigs.skipInactiveLogisticsJobs) ||\n (isRiderAppEnabled && orderType !== \"scheduled\")\n ) {\n return (\n \n \n
\n );\n }\n return null;\n};\n\nexport default OrderLogisticsControl;\n","import React, { useState, useEffect, useMemo } from \"react\";\nimport { Button } from \"react-bootstrap\";\nimport { Button as ThrottleButton } from \"../throttleButton\";\nimport { FormattedMessage, useIntl } from \"react-intl\";\nimport { Modal } from \"react-bootstrap\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faSearch, faBiking } from \"@fortawesome/free-solid-svg-icons\";\nimport { connect } from \"react-redux\";\n\ninterface IRiderSelectionProps {\n orderType: any;\n orderStatus: any;\n isRiderAppEnabled: any;\n order: any;\n assignRiderToOrder: any;\n company: any;\n drivers: any;\n}\n\nfunction RiderSelctionPopup(props: IRiderSelectionProps) {\n const [showRiderPopup, setShowRiderPopup] = useState(false);\n const [searchValue, setSearchValue] = useState(\"\");\n const [riders, setRiders] = useState([] as any);\n const [selectedRider, setSelectedRider] = useState(null);\n\n const intl = useIntl();\n\n useEffect(() => {\n if (\n Object.keys(props.company).length > 0 &&\n props.drivers.length > 0\n ) {\n let locationDrivers = [] as any;\n props.drivers.map((driver: any) => {\n if (driver.assigned_locations.includes(props.order.location_id)) {\n locationDrivers.push(driver);\n }\n });\n setRiders(locationDrivers);\n }\n }, [props.drivers, props.order.location_id]);\n\n const assignDriverToOrder = (riderId?: any) => {\n setShowRiderPopup(false);\n props.assignRiderToOrder(props.order, riderId)\n setSelectedRider(null);\n };\n\n const companyRiderFilter = useMemo(() => {\n let requiredRiders = riders.filter((e: any) => {\n return e.name.toLowerCase().includes(searchValue.toLowerCase());\n });\n if (requiredRiders.length == 0 && searchValue) {\n requiredRiders.push(\"No Drivers\");\n }\n return requiredRiders;\n }, [searchValue, riders]);\n\n return (\n <>\n \n \n
\n
\n \n \n );\n}\n\nconst mapStateToProps = (state: any) => {\n let drivers = state.drivers.company_drivers || [];\n let company = state.company.company_details;\n\n return { drivers, company };\n};\n\nexport default connect(mapStateToProps)(RiderSelctionPopup);\n","import React, { useEffect, useMemo, useReducer, useRef, useState } from \"react\";\nimport {\n addModifiersToItems,\n getBranchName,\n getLogisticName,\n getOrderScheduledForDate,\n getOrderTime,\n updateOrderTotalAmount,\n} from \"../../helpers/orderFunctions\";\nimport OrderPopup from \"../orderPopup\";\nimport ElapsedTime from \"../elapsedTime\";\nimport { connect } from \"react-redux\";\nimport { formatDecimal } from \"../../helpers/itemCalculations\";\nimport PaymentPopUp from \"../paymentPopup\";\nimport orderImages from \"../../helpers/orderImage\";\nimport SapaadLogo from \"../../images/sapaad-square.png\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport {\n faCheckCircle,\n faExclamation,\n faExclamationTriangle,\n faShoppingBag,\n} from \"@fortawesome/free-solid-svg-icons\";\nimport { scheduledOperations } from \"../../state/features/scheduled\";\nimport RadialTimeCount from \"../radialTimeCount\";\nimport SetDeliveryTimePopup from \"../setDeliveryTimePopup\";\nimport { logisticPartnersOperations } from \"../../state/features/logisticPartners\";\nimport DeliveryPartnerPopup from \"../deliveryPartnerPopup\";\nimport { getEnvValueFor } from \"../../helpers/utils\";\nimport Swal, { SweetAlertResult } from \"sweetalert2\";\nimport { logisticsConfigsInitialState, logisticsReducer } from \"./utils\";\nimport { ZOMATO_GO_PARTNER_UNIQUE_ID } from \"../../helpers/constants\";\nimport { FormattedMessage, useIntl } from \"react-intl\";\nimport OrderLogisticsControl from \"./orderLogisticsControl\";\nimport type { AxiosErrorResponse } from \"../../types/axiosMiddleware\";\nimport RiderSelectionPopup from \"../riderSelectionPopup\";\nimport { homeDeliveryOperations } from \"../../state/features/homeDelivery\";\nimport OrderButtonGroup from \"../orderButtonGroup\";\n\ninterface IOrderProps {\n item: any;\n handleOrderState?: any;\n orderStatus?: any;\n companyDrivers?: any;\n currency?: any;\n orderType: any;\n dmCanRecordPayment?: any;\n branches?: any;\n disableButton?: boolean;\n removeScheduledOrder?: any;\n handleApprove?: any;\n handleReject?: any;\n autoRejectionSla: any;\n handleAutoReject?: any;\n defaultDeliveryEta?: any;\n hideDetails?: any;\n limboStateOrders?: any;\n logisticPartners?: any;\n assignLogisticPartner?: any;\n loyaltyDetails: any;\n showEmptyCell?: boolean;\n payments?: any;\n riderAppEnabled?: boolean;\n countryCode: string;\n assignDriver:any;\n selectedRider?: any;\n setSelectedRider?: any;\n newRiderSelection?: boolean;\n}\n\nfunction Order(props: IOrderProps) {\n const [order, setOrder] = useState({} as any);\n const [showDetails, setShowDetails] = useState(false);\n const [showPaymentPopup, setShowPaymentPopup] = useState(false);\n const [orderItems, setOrderItems] = useState([] as any);\n const [showDeliveryEtaPopup, setShowDeliveryEtaPopup] = useState(false);\n const [walkInOrderType, setWalkInOrderType] = useState(false);\n const [isLimboState, setIsLimboState] = useState(true);\n const [isZomatoDeliveryOrder, setIsZomatoDeliveryOrder] = useState(false);\n const [showDeliveryPartnerPopup, setShowDeliveryPartnerPopup] =\n useState(false);\n const [pendingPartnerAssign, setPendingPartnerAssign] = useState(false);\n const [logisticsConfigs, setLogisticsConfigs] = useReducer(\n logisticsReducer,\n logisticsConfigsInitialState\n );\n const [selectedOrderId, setSelectedOrderId] = useState(0);\n const [showPartnerRiderAssign, setShowPartnerRiderAssign] = useState(false);\n const partnerRiderAssignRef = useRef\n
\n \n
\n \n setSearchValue(e.target.value)}\n />\n
\n \n
\n - \n {riders.length > 0 && companyRiderFilter[0] != \"No Drivers\" ? (\n (companyRiderFilter.length > 0 ? companyRiderFilter : riders).map(\n (rider: any, index: any) => {\n return (\n
- \n
\n \n )}\n
{rider.name}
\n \n );\n }\n )\n ) : (\n\n {\n setShowRiderPopup(false);\n setSelectedRider(null);\n }}\n className=\"rider-selection-button cancel-button\"\n >\n assignDriverToOrder(selectedRider?.id)}\n className=\"rider-selection-button assign-button\"\n disabled={!Boolean(selectedRider)}\n >\n
\n \n
\n \n {props.item.order_extended_info.order_number}\n {!props.item.is_cod ? (\n \n
\n Partner Order No:\n {props.item.order_extended_info.foreign_order_no}\n
\n ) : null}\n\n {orderItems.length\n ? orderItems.slice(0, 3).map((orderItem: any, index: any) => {\n return (\n
\n \n {!orderItem.deleted &&\n orderItem.qty_dec + \"x \" + orderItem.name}\n
\n );\n })\n : null}\n {orderItems.length > 3 ? (\n\n {orderItems.length - 3}\n
\n {props.item.scheduled_for\n ? getOrderTime(props.item.scheduled_for)\n : \"\"}\n
\n\n {props.item.scheduled_for\n ? getOrderScheduledForDate(props.item.scheduled_for)\n : \"\"}\n
\n\n {getOrderTime(\n props.item.scheduled_for\n ? props.item.scheduled_for\n : props.item.placed_at\n )}\n
\n ) : (\n{getOrderTime(props.item.placed_at)}
\n )}\n\n
\n \n {props.item.order_extended_info.customer.name}\n {\" / \"}\n {props.item.order_extended_info.customer.telephone}\n
\n ) : (\n \"NA\"\n )}\n\n {props.item.order_extended_info.user_name}\n
\n\n {props.item.order_extended_info.delivery_address?.building ||\n \"\"}\n {logisticsConfigs.logisticsPartnerAssigned ? (\n \n
\n \n ) : null}\n {isZomatoDeliveryOrder ? (\n \n \n
\n ) : (\n \n {getBranchName(props.branches, props.item.location_id)}\n
\n\n
\n
\n \n ) : null}\n \n \n {props.item.order_extended_info.delivery_address?.area ||\n \"\"}\n {logisticsConfigs.logisticsPartnerAssigned ? (\n \n
\n \n ) : null}\n {isZomatoDeliveryOrder ? (\n \n \n {props.item.order_extended_info.delivery_address\n ?.room_number ? (\n \n {\n props.item.order_extended_info.delivery_address\n .room_number\n }\n \n ) : null}\n {props.item.order_extended_info.delivery_address\n ?.building ? (\n \n {\n props.item.order_extended_info.delivery_address\n .building\n }\n \n ) : null}\n {props.item.order_extended_info.delivery_address\n ?.land_mark ? (\n \n {\n props.item.order_extended_info.delivery_address\n .land_mark\n }\n \n ) : null}\n {props.item.order_extended_info.delivery_address?.street ? (\n \n {props.item.order_extended_info.delivery_address.street}\n \n ) : null}\n {props.item.order_extended_info.delivery_address?.area ? (\n \n {props.item.order_extended_info.delivery_address.area}\n \n ) : null}\n
\n \n )}\n\n {formatDecimal(updateOrderTotalAmount(props.item))} {props.currency}\n
\n\n {!isLimboState &&\n props.item.order_extended_info.auto_rejection_sla > 0 &&\n props.item.order_type === \"online\" ? (\n
\n {props.orderType === \"homeDelivery\" &&\n props.orderStatus == \"ready\" &&\n !props.riderAppEnabled &&\n props.newRiderSelection ? (\n getOrderActions()}\n disable={getDisabledState}\n />\n )}\n
\n \n (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n {remove_grouping_by_delivery_area ? (\n \n (\n \n handleReject(\n orderId,\n cancelReasonId,\n supervisorPassword\n )\n }\n handleAutoReject={handleAutoReject}\n orderType=\"unconfirmed\"\n orderStatus=\"unconfirmed\"\n key={order.order_id}\n disableButton={\n order.order_id === selectedOrderId && disableButton\n }\n item={order}\n hideDetails={hideDetails}\n />\n )}\n />\n \n ) : (\n <>\n {ordersByDeliveryArea.map((item: any) => (\n (\n \n \n \n {item.deliveryArea == \"null\"\n ? \"N/A\"\n : item.deliveryArea}\n \n \n (\n \n handleReject(\n orderId,\n cancelReasonId,\n supervisorPassword\n )\n }\n handleAutoReject={handleAutoReject}\n orderType=\"unconfirmed\"\n orderStatus=\"unconfirmed\"\n key={order.order_id}\n disableButton={\n order.order_id === selectedOrderId &&\n disableButton\n }\n item={order}\n hideDetails={hideDetails}\n />\n )}\n />\n \n )}\n />\n ))}\n \n )}\n \n )}\n />\n {!hasOrders ?
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let unconfirmedOrders =\n state.order.home_delivery.unconfirmed_orders.orders || [];\n return { unconfirmedOrders };\n};\n\nconst mapDispatchToProps = {\n setCurrentTab: currentTabOperations.setCurrentTab,\n markOrderConfirm: homeDeliveryOperations.markOrderConfirm,\n markOrderConfirmWithEta: homeDeliveryOperations.markOrderConfirmWithEta,\n markOrderReject: homeDeliveryOperations.markOrderReject,\n markOrderRejectWithReason: homeDeliveryOperations.markOrderRejectWithReason,\n};\n\nexport default connect(mapStateToProps, mapDispatchToProps)(UnconfirmedOrders);\n","enum ORDER_STATUS {\n DELIVERY_UNCONFIRMED = \"homeDelivery.unconfirmed\",\n DELIVERY_NEW = \"homeDelivery.new\",\n DELIVERY_IN_PROGRESS = \"homeDelivery.inProgress\",\n DELIVERY_READY = \"homeDelivery.ready\",\n DELIVERY_DELIVERED = \"homeDelivery.delivered\",\n PICKUP_UNCONFIRMED = \"pickup.unconfirmed\",\n PICKUP_NEW = \"pickup.new\",\n PICKUP_READY = \"pickup.ready\",\n PICKUP_COLLECTED = \"pickup.collected\",\n}\n\nexport { ORDER_STATUS };\n","enum ORDER_FILTERS {\n ALL,\n IN_HOUSE,\n PARTNER_DELIVERY,\n}\n\nexport { ORDER_FILTERS };\n","import { ORDER_STATUS } from \"../../types/orderStatus\";\nimport { filterLabels } from \"../../helpers/orderFunctions\";\nimport { ORDER_FILTERS } from \"../../types/filters\";\n\nconst orderFilterOptions = [\n {\n id: ORDER_FILTERS.ALL,\n name: filterLabels.all_delivery.title,\n },\n {\n id: ORDER_FILTERS.IN_HOUSE,\n name: filterLabels.in_house_delivery.title,\n },\n {\n id: ORDER_FILTERS.PARTNER_DELIVERY,\n name: filterLabels.partner_delivery.title,\n },\n];\n\nconst filterConfigs = [\n {\n showFilterTab: true,\n orderStatus: ORDER_STATUS.DELIVERY_NEW,\n filterOptions: orderFilterOptions,\n showSearch: false,\n },\n {\n showFilterTab: true,\n orderStatus: ORDER_STATUS.DELIVERY_IN_PROGRESS,\n filterOptions: orderFilterOptions,\n showSearch: false,\n },\n {\n showFilterTab: false,\n orderStatus: ORDER_STATUS.PICKUP_READY,\n filterOptions: [],\n showSearch: true,\n },\n];\n\nconst getCurrentTabConfigs = (currentTabName: string) => {\n let tabConfig = filterConfigs.find(\n (config) => config.orderStatus === currentTabName\n );\n return tabConfig;\n};\n\nexport { getCurrentTabConfigs };\n","import React, { useMemo, useState } from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport { getCurrentTabConfigs } from \"./utils\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faSearch } from \"@fortawesome/free-solid-svg-icons\";\n\ninterface IOrderFiltersTab {\n currentTab: string;\n updateSelectedFilterOption?(selectedOptionId: number): void;\n onSearch?(searchTerm: string): void;\n}\n\nconst OrderFiltersTab = ({\n currentTab,\n updateSelectedFilterOption,\n onSearch,\n}: IOrderFiltersTab) => {\n const [selectedFilterOption, setSelectedFilterOption] = useState(0);\n\n const updateSelectedFilterOptionId = (option: number) => {\n setSelectedFilterOption(option);\n updateSelectedFilterOption(option);\n };\n\n const currentTabConfigs = useMemo(() => {\n let tabConfig = getCurrentTabConfigs(currentTab);\n let showFilterSection = tabConfig?.showFilterTab ?? false;\n let showSearchBar = tabConfig?.showSearch ?? false;\n let filterOptions = tabConfig?.filterOptions ?? [];\n return { showFilterSection, showSearchBar, filterOptions };\n }, [currentTab]);\n\n const onSearchChange = (e: any) => {\n onSearch(e.target.value);\n };\n\n return (\n <>\n \n {currentTabConfigs.showFilterSection ? (\n
\n ) : (\n false\n )}\n {currentTabConfigs.showSearchBar ? (\n \n updateSelectedFilterOptionId(option.id)}\n className={\n selectedFilterOption === option.id\n ? \"filter-item active\"\n : \"filter-item\"\n }\n >\n {option.name}\n
\n );\n }\n )\n : null}\n \n
\n
\n ) : (\n false\n )}\n \n \n );\n};\n\nexport default OrderFiltersTab;\n","import { useMemo, useState } from \"react\";\nimport { ORDER_FILTERS } from \"../types/filters\";\nimport order from \"../components/order\";\n\nconst useOrdersFilter = (orders: any[]) => {\n const [filterId, setFilterId] = useState(0);\n const [searchResultOrders, setSearchResultOrders] = useState\n \n {(placeholder: any) => (\n \n
\n \n
\n \n (\n \n \n \n {\"\"} \n \n \n \n \n \n \n \n \n \n \n {logisticsControlColumn.show ? (\n props.riderAppEnabled ? (\n \n \n ) : (\n \n \n )\n ) : null}\n {\"\"} \n \n \n {remove_grouping_by_delivery_area ? (\n \n (\n \n setOrderReady(orderId)\n }\n item={order}\n showEmptyCell={logisticsControlColumn.show}\n />\n )}\n />\n \n ) : (\n <>\n {ordersByDeliveryArea.map((item: any) => {\n return (\n (\n \n \n \n {item.deliveryArea == \"null\"\n ? \"N/A\"\n : item.deliveryArea}\n \n \n (\n \n setOrderReady(orderId)\n }\n item={order}\n showEmptyCell={logisticsControlColumn.show}\n />\n )}\n />\n \n )}\n />\n );\n })}\n \n )}\n \n )}\n />\n {!hasOrders ?
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let newOrders = state.order.home_delivery.new_orders.orders || [];\n let company = state.company.company_details;\n let logisticsPartners = state.logisticPartners;\n let riderAppEnabled = state.company.company_details.rider_app_enabled;\n\n return {\n newOrders,\n company,\n logisticsPartners,\n riderAppEnabled,\n };\n};\n\nconst mapDispatchToProps = {\n markOrderReady: homeDeliveryOperations.markOrderReady,\n setCurrentTab: currentTabOperations.setCurrentTab,\n};\n\nexport default connect(mapStateToProps, mapDispatchToProps)(NewOrders);\n","import React, { useState, useEffect, useMemo } from \"react\";\nimport { Dropdown } from \"react-bootstrap\";\nimport { connect } from \"react-redux\";\nimport { faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { FormattedMessage } from \"react-intl\";\n\ninterface IFilterDropdownProps {\n drivers: any;\n selectedBranch: any;\n company: any;\n selectedRider: any;\n setSelectedRider: any;\n theme: any;\n}\n\nfunction FilterDropdown(props: IFilterDropdownProps) {\n const [show, setShow] = useState(false);\n const [drivers, setDrivers] = useState([]);\n\n const onDropdownToggle = (e: any) => {\n setShow(!show);\n };\n\n useEffect(() => {\n props.setSelectedRider(null);\n if (\n props.drivers.length > 0 &&\n Object.keys(props.selectedBranch).length > 0\n ) {\n if (props.selectedBranch.id) {\n let locationDrivers = [] as any;\n props.drivers.map((driver: any) => {\n if (driver.assigned_locations.includes(props.selectedBranch.id)) {\n locationDrivers.push(driver);\n }\n });\n setDrivers(locationDrivers);\n } else {\n if (\n props.company.admin &&\n props.company.authorized_location_ids.length < 1\n ) {\n setDrivers(props.drivers);\n } else {\n // staff user - Multiple branches\n let locationDrivers = [] as any;\n props.company.authorized_location_ids.map(\n (locationId: any, index: number) => {\n props.drivers.map((driver: any) => {\n if (driver.assigned_locations.includes(locationId)) {\n if (\n locationDrivers.filter(\n (locDriver: any) => locDriver.id === driver.id\n ).length === 0\n ) {\n // Check if driver already exists - TODO: revisit\n locationDrivers.push(driver);\n }\n }\n });\n }\n );\n setDrivers(locationDrivers);\n }\n }\n }\n }, [props.drivers, props.selectedBranch]);\n\n return (\n \n \n onDropdownToggle(e)}\n >\n \n \n {props.selectedRider?.name || \n \n {drivers.map((driver: any, index: number) => {\n return (\n \n \n
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let drivers = state.drivers.company_drivers || [];\n let selectedBranch = state.company?.selected_branch;\n let company = state.company.company_details;\n let theme = state.theme\n\n return { drivers, selectedBranch, company, theme };\n};\n\nexport default connect(mapStateToProps)(FilterDropdown);","import React, { useEffect, useState } from \"react\";\nimport { faSearch } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { FormattedMessage } from \"react-intl\";\nimport FilterDropdown from \"../filterDropdown\";\ninterface ITableFilterTabProps {\n filterOptions?: any;\n onFilterClick?: any;\n onSearch?: any;\n orderStatus: any;\n orderType: any;\n allowSearch?: boolean;\n riderAppEnabled?: boolean;\n selectedRider: any;\n setSelectedRider: any;\n newRiderSelection: boolean;\n}\n\nfunction TableFilterTab(props: ITableFilterTabProps) {\n const [filterOptions, setFilterOptions] = useState([] as any);\n const [selectedFilter, setSelectedFilter] = useState(0);\n\n useEffect(() => {\n setFilterOptions(props.filterOptions);\n }, [props.filterOptions]);\n\n const onSearchChange = (e: any) => {\n props.onSearch(e.target.value);\n };\n\n const onFilterClick = (option: any) => {\n setSelectedFilter(option.id);\n props.onFilterClick(option.name);\n };\n\n return (\n \n props.setSelectedRider(driver)}\n >\n {driver.name}\n \n
\n );\n })}\n \n {!props.riderAppEnabled &&\n !props.newRiderSelection &&\n props.orderStatus == \"ready\" &&\n props.orderType == \"homeDelivery\" ? (\n onFilterClick(option)}\n className={\n selectedFilter === option.id\n ? \"filter-item active\"\n : \"filter-item\"\n }\n >\n {option.name}\n
\n );\n })\n : null}\n \n ) : null}\n {props.allowSearch ? (\n \n
\n
\n ) : null}\n \n );\n}\n\nexport default TableFilterTab as any;\n","import React, { useCallback, useEffect, useState } from \"react\";\nimport { connect } from \"react-redux\";\nimport { getOrderFilterOptions } from \"../../helpers/orderFunctions\";\nimport TableFilterTab from \"../tableFilterTab\";\n\ninterface IOrdersFilterSectionProps {\n orders: any;\n orderType: any;\n orderStatus: any;\n onSearch?: any;\n allowSearch?: boolean;\n filterOptions?: any;\n onFilterChanges?: any;\n currentTab?: any;\n riderAppEnabled?: boolean;\n selectedRider: any;\n setSelectedRider:any;\n newRiderSelection:boolean;\n}\n\nfunction OrdersFilterSection(props: IOrdersFilterSectionProps) {\n const [filterOptions, setFilterOptions] = useState(\n getOrderFilterOptions(props.orderType)\n );\n const [showFilter, setShowFilter] = useState(false);\n\n const onFilterClick = (selectedFilter: any) => {\n setFilterOptions(filterOptions);\n props.onFilterChanges(selectedFilter);\n };\n\n useCallback(() => setFilterOptions(filterOptions), [filterOptions]);\n\n const onSearchChange = (searchKeyword: any) => {\n let filteringOrders = props.orders;\n props.onSearch(searchKeyword);\n };\n\n useEffect(() => {\n if (\n props.currentTab === \"pickup.new\" ||\n props.currentTab === \"pickup.collected\"\n ) {\n setShowFilter(false);\n } else {\n setShowFilter(true);\n }\n }, [props.currentTab]);\n\n return (\n \n \n {(placeholder: any) => (\n \n
\n \n
\n \n setFilterOption(option)}\n selectedRider={selectedRider}\n setSelectedRider={setSelectedRider}\n newRiderSelection={props.newFeatureEnabled}\n />\n (\n \n \n \n \n \n \n \n \n \n \n \n \n \n {logisticsControlColumn.show ? (\n props.riderAppEnabled ? (\n \n \n ) : (\n <>\n \n \n \n \n )\n ) : (\n \n )}\n \n \n {ordersByDeliveryArea.map((item: any) => (\n (\n \n \n \n {item.deliveryArea == \"null\"\n ? \"N/A\"\n : item.deliveryArea}\n \n \n (\n \n assignDriverToOrder(orderId, riderId)\n }\n item={order}\n showEmptyCell={logisticsControlColumn.show}\n selectedRider={selectedRider}\n setSelectedRider={setSelectedRider}\n newRiderSelection={props.newFeatureEnabled}\n />\n )}\n />\n \n )}\n />\n ))}\n \n )}\n />\n {!hasOrders ?
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let readyOrders = state.order.home_delivery.ready_orders.orders || [];\n let selectedBranch = state.company?.selected_branch;\n let logisticsPartnerDrivers = state.drivers.logistics_partner_drivers || [];\n let company = state.company.company_details;\n let refreshRequired = state.order.home_delivery.ready_orders.refresh_required;\n let logisticsPartners = state.logisticPartners;\n let riderAppEnabled = state.company.company_details.rider_app_enabled;\n let newFeatureEnabled = state.company.company_details.rider_assign_through_popup\n\n return {\n readyOrders,\n selectedBranch,\n logisticsPartnerDrivers,\n company,\n refreshRequired,\n logisticsPartners,\n riderAppEnabled,\n newFeatureEnabled\n };\n};\n\nconst mapDispatchToProps = {\n assignDriver: homeDeliveryOperations.assignDriver,\n markOrderPickedUp: homeDeliveryOperations.markOrderPickedUp,\n setCurrentTab: currentTabOperations.setCurrentTab,\n};\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps\n)(WaitingForCollectionOrders);\n","import React, { useEffect, useMemo, useState } from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport { connect } from \"react-redux\";\nimport {\n getLogisticsVisibilityConfig,\n groupOrders,\n validateCollectedPayments,\n} from \"../../helpers/orderFunctions\";\nimport { getEnvValueFor, groupOrdersByDeliveryArea } from \"../../helpers/utils\";\nimport { currentTabOperations } from \"../../state/features/currentTab\";\nimport { homeDeliveryOperations } from \"../../state/features/homeDelivery\";\nimport type { AxiosErrorResponse } from \"../../types/axiosMiddleware\";\nimport NoOrders from \"../noOrders\";\nimport Order from \"../order\";\nimport Swal from \"sweetalert2\";\nimport { AnimateOrderTransitions } from \"../animateOrderTransitions\";\nimport { AnimateDeliveryAreaTransition } from \"../animateDeliveryAreaTransitions\";\nimport { AnimateTableTransition } from \"../animateTableTransitions\";\nimport { useEntryTransitionConfig } from \"../../hooks/useEntryTransitionConfig\";\nimport OrderFiltersTab from \"../orderFilters\";\nimport { ORDER_STATUS } from \"../../types/orderStatus\";\nimport useOrderFilter from \"../../hooks/useOrderFilter\";\ninterface IDeliveryInProgressOrdersProps {\n deliveryInProgressOrders: any;\n markOrderDelivered: any;\n selectedBranch: any;\n company: any;\n setCurrentTab: any;\n refreshRequired: any;\n riderAppEnabled?: boolean;\n logisticsPartners: any[];\n companyRiders: any[];\n}\n\nfunction DeliveryInProgressOrders(props: IDeliveryInProgressOrdersProps) {\n const [inProgressOrders, setInProgressOrders] = useState([] as any);\n const [selecteOrderId, setSelectedOrderId] = useState(0);\n const [disableButton, setDisable] = useState(false);\n const { enableEntryTransition } = useEntryTransitionConfig();\n const { filteredOrders, updateFilterId} = useOrderFilter(inProgressOrders);\n\n const markOrderStatusDelivered = (orderId: number, orderPayments: any[]) => {\n props\n .markOrderDelivered(orderId, orderPayments)\n .then(() => {\n setDisable(false);\n })\n .catch((err: AxiosErrorResponse) => {\n setDisable(false);\n console.log(err);\n });\n };\n\n const handleValidateAssignedRider = (order: any, next: any) => {\n if (order.rider_id) {\n let isRiderExistsInCompany = props.companyRiders.find(\n (r) => r.id === order.rider_id\n );\n if (!isRiderExistsInCompany) {\n Swal.fire({\n icon: \"warning\",\n title: \"Oops!\",\n html: \"The rider assigned to this order was deleted by your account’s administrator. Please contact your account administrator. \",\n confirmButtonText: \"Proceed\",\n allowOutsideClick: false,\n }).then((res) => {\n next();\n });\n } else {\n next();\n }\n } else {\n next();\n }\n };\n\n const handlePaymentsValidation = (\n order: any,\n orderPayments: any[],\n next: any\n ) => {\n let validationEnabledCompanies: any = JSON.parse(\n getEnvValueFor(\"VALIDATION_ENABLED_COMPANIES\") || \"[]\"\n );\n if (validationEnabledCompanies.includes(props.company.company_id)) {\n console.debug(\"[APP] Initiating payment validation\");\n if (\n props.company.dm_can_record_payment &&\n (order.order_extended_info.payments.length === 0 ||\n (order.order_extended_info.payments.length === 1 &&\n order.order_extended_info.payments[0].name === \"Loyalty\"))\n ) {\n validateCollectedPayments(order, orderPayments, () => {\n next();\n });\n } else {\n console.debug(\"[APP] Skipping validation\");\n next();\n }\n } else {\n next();\n }\n };\n\n const postOrderPayments = (orderId: any, orderPayments: any) => {\n setDisable(true);\n setSelectedOrderId(orderId);\n let order = props.deliveryInProgressOrders.find(\n (o: any) => o.order_id === orderId\n );\n if (order) {\n handleValidateAssignedRider(order, () =>\n handlePaymentsValidation(order, orderPayments, () =>\n markOrderStatusDelivered(orderId, orderPayments)\n )\n );\n } else {\n console.log(\"Order not found!\");\n }\n };\n\n useEffect(() => {\n props.setCurrentTab(\"homeDelivery.inProgress\");\n }, []);\n\n useEffect(() => {\n setInProgressOrders(props.deliveryInProgressOrders);\n }, [JSON.stringify(props.deliveryInProgressOrders)]);\n\n const filteredInProgressOrders = useMemo(() => {\n return groupOrders(filteredOrders)\n }, [filteredOrders]);\n\n const logisticsControlColumn = useMemo(() => {\n let show = false;\n if (inProgressOrders.length) {\n const {\n hasCompanyRiderAssignedOrders,\n hasLogisticsPartnerAssignedOrders,\n } = getLogisticsVisibilityConfig(\n inProgressOrders,\n props.logisticsPartners,\n props.riderAppEnabled\n );\n show = hasCompanyRiderAssignedOrders || hasLogisticsPartnerAssignedOrders;\n }\n return { show };\n }, [\n JSON.stringify(inProgressOrders),\n props.logisticsPartners,\n props.riderAppEnabled,\n ]);\n\n const hasOrders = useMemo(\n () => Object.keys(filteredInProgressOrders).length > 0,\n [JSON.stringify(filteredInProgressOrders)]\n );\n\n const ordersByDeliveryArea = groupOrdersByDeliveryArea(filteredInProgressOrders);\n\n return (\n
\n (\n \n \n \n \n \n \n \n \n \n {!props.riderAppEnabled ? (\n \n \n ) : null}\n \n \n \n \n {logisticsControlColumn.show ? (\n props.riderAppEnabled ? (\n \n \n ) : (\n \n \n )\n ) : null}\n \n \n \n \n {ordersByDeliveryArea.map((item: any) => (\n (\n \n \n \n {item.deliveryArea == \"null\"\n ? \"N/A\"\n : item.deliveryArea}\n \n \n (\n
\n );\n}\nconst mapStateToProps = (state: any) => {\n let deliveryInProgressOrders =\n state.order.home_delivery.in_progress_orders.orders || [];\n let selectedBranch = state.company?.selected_branch;\n let company = state.company.company_details;\n let refreshRequired =\n state.order.home_delivery.in_progress_orders.refresh_required;\n let riderAppEnabled = state.company.company_details.rider_app_enabled;\n let logisticsPartners = state.logisticPartners;\n let companyRiders = state.drivers.company_drivers;\n\n return {\n deliveryInProgressOrders,\n selectedBranch,\n company,\n refreshRequired,\n riderAppEnabled,\n logisticsPartners,\n companyRiders,\n };\n};\n\nconst mapDispatchToProps = {\n markOrderDelivered: homeDeliveryOperations.markOrderDelivered,\n setCurrentTab: currentTabOperations.setCurrentTab,\n};\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps\n)(DeliveryInProgressOrders);\n","import React, { useEffect, useState } from \"react\";\nimport { Spinner } from \"react-bootstrap\";\nimport { FormattedMessage } from \"react-intl\";\nimport { connect } from \"react-redux\";\nimport { formatDecimal } from \"../../helpers/itemCalculations\";\nimport {\n formatTime,\n getOrderTime,\n getTime,\n updateOrderTotalAmount,\n} from \"../../helpers/orderFunctions\";\nimport { homeDeliveryOperations } from \"../../state/features/homeDelivery\";\nimport type { AxiosErrorResponse } from \"../../types/axiosMiddleware\";\nimport OrderPopup from \"../orderPopup\";\n\ninterface DriverOrderDetailsProps {\n deliveredDriverOrdersDetails?: any;\n fetchDeliveredDriverOrderDetails?: any;\n driverId: any;\n resetDeliveredDriverOrderDetails?: any;\n currency?: any;\n selectedBranch: any;\n driverDetails?: any;\n dmCanRecordPayment?: any;\n}\n\nfunction DriverOrderDetails(props: DriverOrderDetailsProps) {\n const [showOrderPopup, setShowOrderPopup] = useState(false);\n const [orderDetails, setOrderDetails] = useState([] as any);\n const [selectedOrderId, setSelectedOrderId] = useState(0 as any);\n const [showLoading, setShowLoading] = useState(true);\n\n useEffect(() => {\n props.resetDeliveredDriverOrderDetails();\n }, []);\n\n useEffect(() => {\n if (props.selectedBranch.id) {\n props\n .fetchDeliveredDriverOrderDetails(props.driverId, props.selectedBranch)\n .then((res: any) => {\n setShowLoading(false);\n })\n .catch((err: AxiosErrorResponse) => console.log(err));\n } else {\n props\n .fetchDeliveredDriverOrderDetails(props.driverId)\n .then((res: any) => {\n setShowLoading(false);\n })\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n }, [props.selectedBranch]);\n\n useEffect(() => {\n setOrderDetails(props.deliveredDriverOrdersDetails);\n }, [props.deliveredDriverOrdersDetails]);\n\n const getPerformance = (order: any) => {\n let reverse_status_updates = [].concat(order.status_updates).reverse();\n let delivered_status: any = reverse_status_updates.find((status: any) => {\n return status.event === \"marked_as_delivered\";\n });\n let rider_assigned_status: any = reverse_status_updates.find(\n (status: any) => {\n return status.event === \"rider_assigned\";\n }\n );\n let ready_status: any = reverse_status_updates.find((status: any) => {\n return status.event === \"marked_as_ready\";\n });\n let created_status: any = reverse_status_updates.find((status: any) => {\n return status.event === \"created\" || status.event === \"unconfirmed\";\n });\n let prep_time_sec: any = (ready_status.time - created_status.time) / 1000;\n let pickup_time_sec: any =\n (rider_assigned_status.time - ready_status.time) / 1000;\n let delivery_time_sec: any =\n (delivered_status.time - rider_assigned_status.time) / 1000;\n prep_time_sec = Math.trunc(prep_time_sec);\n pickup_time_sec = Math.trunc(pickup_time_sec);\n delivery_time_sec = Math.trunc(delivery_time_sec);\n let total_time = prep_time_sec + pickup_time_sec + delivery_time_sec;\n let prep_perc = (prep_time_sec / total_time) * 100;\n let pick_perc = (pickup_time_sec / total_time) * 100;\n let del_perc = (delivery_time_sec / total_time) * 100;\n return (\n \n
\n );\n };\n\n const getTakenTime = (order: any) => {\n let deliveredStatus = order.status_updates.find((status: any) => {\n return status.event === \"marked_as_delivered\";\n });\n let timeTaken = (deliveredStatus.time - order.scheduled_for) / 1000;\n return getTime(timeTaken);\n };\n\n const handleOrderPopup = (orderId: any) => {\n setShowOrderPopup(true);\n setSelectedOrderId(orderId);\n };\n\n return (\n \n {getTime(prep_time_sec)}\n
\n \n {getTime(pickup_time_sec)}\n
\n \n {getTime(delivery_time_sec)}\n
\n \n {showLoading ? (\n \n \n
\n ) : null}\n \n )}\n
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let deliveredDriverOrdersDetails =\n state.order.home_delivery.delivered_driver_order_details || [];\n let currency = state.company.company_details.currency;\n let selectedBranch = state.company.selected_branch;\n let dmCanRecordPayment = state.company.company_details.dm_can_record_payment;\n\n return {\n deliveredDriverOrdersDetails,\n currency,\n selectedBranch,\n dmCanRecordPayment,\n };\n};\nconst mapDispatchToProps = {\n fetchDeliveredDriverOrderDetails:\n homeDeliveryOperations.fetchDeliveredDriverOrderDetails,\n resetDeliveredDriverOrderDetails:\n homeDeliveryOperations.resetDeliveredDriverOrderDetails,\n};\n\nexport default connect(mapStateToProps, mapDispatchToProps)(DriverOrderDetails);\n","import { faChevronDown, faChevronUp } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport React, { useState } from \"react\";\nimport { useEffect } from \"react\";\nimport { connect } from \"react-redux\";\nimport { formatDecimal } from \"../../helpers/itemCalculations\";\nimport { formatTime } from \"../../helpers/orderFunctions\";\nimport { homeDeliveryOperations } from \"../../state/features/homeDelivery\";\nimport DriverOrderDetails from \"../driverOrderDetails\";\n\ninterface DeliveredDriverProps {\n driver: any;\n fetchDeliveredDriverOrderDetails?: any;\n deliveredDriverOrdersDetails?: any;\n isExpandable: boolean;\n handleExpand: any;\n currency?: any;\n}\n\nfunction DeliveredDriver(props: DeliveredDriverProps) {\n const [showDetails, setShowDetails] = useState(false);\n const [driver, setDriver] = useState({} as any);\n\n useEffect(() => {\n setDriver(props.driver);\n }, [props.driver]);\n\n useEffect(() => {\n if (props.isExpandable) {\n setShowDetails(true);\n } else {\n setShowDetails(false);\n }\n }, [props.isExpandable]);\n\n const fetchDriverOrderDetails = (driverId: any) => {\n props.handleExpand(driverId);\n };\n\n const collapseOrderDetails = () => {\n setShowDetails(false);\n props.handleExpand(0);\n };\n\n const covertTimeIntoMinutes = (time: any) => {\n let minutes = Math.floor(time / 60);\n return minutes;\n };\n\n return (\n \n
\n ) : (\n <>\n {orderDetails.length ? (\n | \n | \n \n | \n \n | \n \n | \n \n \n \n \n \n \n \n \n \n \n | \n
|---|---|---|---|---|
| \n {getOrderTime(order.scheduled_for)}\n | \n{getTakenTime(order)} | \n\n {formatDecimal(updateOrderTotalAmount(order)) +\n \" \" +\n props.currency}\n | \n\n {getPerformance(order)}\n | \n {selectedOrderId === order.order_id && showOrderPopup ? (\n|
{driver.total_orders}
\n\n {formatDecimal(driver.total_amount) + \" \" + props.currency}\n
\n\n {formatTime(driver.average_delivery_time)}\n
\n\n {riders.length > 0 ? (\n <>\n
\n \n \n setShowDriverDropdown(!showDriverDropdown)}\n >\n \n \n {props.selectedDriver ? (\n props.selectedDriver.name !== \"All Riders\" ? (\n props.selectedDriver.name\n ) : (\n \n \n {riders.map((rider: any, index: number) => (\n selectDriver(rider)}\n >\n {rider.name}\n
\n ))}\n \n \n \n \n
\n {avgDeliveryTime}
\n\n \n
\n \n ) : null}\n \n );\n};\n\nconst mapStateToProps = (state: any) => {\n let currency = state.company.company_details.currency;\n let companyId = state.company.company_details.company_id;\n\n return { currency, companyId };\n};\n\nconst mapDispatchToProps = {\n fetchRiderStats: homeDeliveryOperations.fetchDeliveredDriverOrderDetails,\n};\n\nexport default connect(mapStateToProps, mapDispatchToProps)(RiderStatsSection);\n","import React, { useEffect, useState } from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport { connect } from \"react-redux\";\nimport { currentTabOperations } from \"../../state/features/currentTab\";\nimport { homeDeliveryOperations } from \"../../state/features/homeDelivery\";\nimport DeliveredDriver from \"../deliveredDriver\";\nimport NoOrders from \"../noOrders\";\nimport RiderStatsSection from \"../riderStatsSection\";\n\ninterface IDeliveredOrdersProps {\n deliveredOrders: any;\n fetchDeliveredDriverOrderDetails: any;\n selectedBranch: any;\n company: any;\n setCurrentTab: any;\n refreshRequired: any;\n}\n\nfunction DeliveredOrders(props: IDeliveredOrdersProps) {\n const [deliveredOrders, setDeliveredOrders] = useState([] as any);\n const [filteredRiders, setFilteredRiders] = useState([] as any);\n const [selectedDriver, selectDriver] = useState({} as any);\n const [isExpandable, setExpandable] = useState(false);\n const [expandDriverId, setExpandDriverId] = useState(0 as any);\n\n useEffect(() => {\n let allDrivers = { name: \"All Riders\" };\n selectDriver(allDrivers);\n props.setCurrentTab(\"homeDelivery.delivered\");\n }, []);\n\n useEffect(() => {\n if (selectedDriver.name === \"All Riders\") {\n setDeliveredOrders(props.deliveredOrders);\n } else {\n setDeliveredOrders([selectedDriver]);\n }\n }, [selectedDriver]);\n\n useEffect(() => {\n setDeliveredOrders(props.deliveredOrders);\n setFilteredRiders(props.deliveredOrders);\n }, [JSON.stringify(props.deliveredOrders)]);\n\n const covertTimeIntoMinutes = (time: any) => {\n let minutes = Math.floor(time / 60);\n return minutes;\n };\n\n const handleExpand = (driverId: any) => {\n setExpandDriverId(driverId);\n };\n\n return (\n \n {totalAmount + \" \"}\n {props.currency ? props.currency : \"\"}\n
\n\n \n \n
\n ) : (\n
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let deliveredOrders = state.order.home_delivery.delivered_orders.orders || [];\n let selectedBranch = state.company?.selected_branch;\n let company = state.company.company_details;\n let refreshRequired =\n state.order.home_delivery.delivered_orders.refresh_required;\n\n return { deliveredOrders, company, selectedBranch, refreshRequired };\n};\n\nconst mapDispatchToProps = {\n fetchDeliveredDriverOrderDetails:\n homeDeliveryOperations.fetchDeliveredDriverOrderDetails,\n setCurrentTab: currentTabOperations.setCurrentTab,\n};\n\nexport default connect(mapStateToProps, mapDispatchToProps)(DeliveredOrders);\n","import React, { useEffect, useState } from \"react\";\nimport { Route, Switch } from \"react-router-dom\";\nimport { connect } from \"react-redux\";\nimport { homeDeliveryOperations } from \"../../state/features/homeDelivery\";\nimport TabNavigation from \"../../components/tabs\";\nimport UnconfirmedOrders from \"../../components/unconfirmedOrders\";\nimport NewOrders from \"../../components/newOrders\";\nimport WaitingForCollectionOrders from \"../../components/waitingForCollectionOrders\";\nimport DeliveryInProgressOrders from \"../../components/deliveryInProgressOrders\";\nimport DeliveredOrders from \"../../components/deliveredOrders\";\nimport { branchOperations } from \"../../state/features/branches\";\nimport { driverOperations } from \"../../state/features/drivers\";\nimport { useSelectedBranch } from \"../../helpers/orderFunctions\";\nimport { logisticPartnersOperations } from \"../../state/features/logisticPartners\";\nimport LogisticDetailsPopup from \"../../components/logisticDetailsPopup\";\nimport { FormattedMessage } from 'react-intl';\nimport type { AxiosErrorResponse } from \"../../types/axiosMiddleware\";\n\ninterface HomeDeliveriesProps {\n company: any;\n branches: any;\n homeDeliveryOrders: any;\n fetchNewOrders: any;\n fetchInProgressOrders: any;\n fetchReadyOrders: any;\n fetchUnconfirmedOrders: any;\n fetchDeliveredOrders: any;\n selectedBranch: any;\n selectBranch: any;\n fetchDrivers: any;\n currentTab: any;\n fetchLogisticPartners: any;\n}\n\nfunction HomeDeliveries(props: HomeDeliveriesProps) {\n const [hideUnconfirmed, setHideUnconfirmed] = useState(true);\n useEffect(() => {\n if (Object.keys(props.selectedBranch).length > 0) {\n props\n .fetchUnconfirmedOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n props\n .fetchNewOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n props\n .fetchReadyOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n props\n .fetchInProgressOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n props\n .fetchDeliveredOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n }, [props.selectedBranch]);\n\n useEffect(() => {\n if (\n props.currentTab.length > 0 &&\n Object.keys(props.homeDeliveryOrders).length > 0 &&\n Object.keys(props.selectedBranch).length > 0\n ) {\n switch (props.currentTab) {\n case \"homeDelivery.unconfirmed\":\n if (props.homeDeliveryOrders.unconfirmed_orders.refresh_required) {\n props\n .fetchUnconfirmedOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n break;\n case \"homeDelivery.new\":\n if (props.homeDeliveryOrders.new_orders.refresh_required) {\n props\n .fetchNewOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n break;\n case \"homeDelivery.ready\":\n if (props.homeDeliveryOrders.ready_orders.refresh_required) {\n props\n .fetchReadyOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n break;\n case \"homeDelivery.inProgress\":\n if (props.homeDeliveryOrders.in_progress_orders.refresh_required) {\n props\n .fetchInProgressOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n break;\n case \"homeDelivery.delivered\":\n if (props.homeDeliveryOrders.delivered_orders.refresh_required) {\n props\n .fetchDeliveredOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n break;\n default:\n \"\";\n }\n }\n if (props.company.user_permissions?.includes(\"weborder.manage\")) {\n setHideUnconfirmed(false);\n } else if (props.company.user_permissions?.includes(\"all.manage\")) {\n setHideUnconfirmed(false);\n } else {\n setHideUnconfirmed(true);\n }\n }, [\n props.currentTab,\n props.homeDeliveryOrders,\n props.selectedBranch,\n props.company,\n ]);\n\n const tabs = [\n {\n name: | \n | \n \n | \n \n | \n \n | \n
|---|
\n \n \n
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let homeDeliveryOrders = state.order.home_delivery;\n let selectedBranch = state.company?.selected_branch;\n let branches = state.branches || [];\n let company = state.company.company_details;\n let currentTab = state.currentTab;\n\n return { homeDeliveryOrders, branches, selectedBranch, company, currentTab };\n};\n\nconst mapDispatchToProps = {\n fetchNewOrders: homeDeliveryOperations.fetchNewOrders,\n fetchInProgressOrders: homeDeliveryOperations.fetchInProgressOrders,\n fetchReadyOrders: homeDeliveryOperations.fetchReadyOrders,\n fetchUnconfirmedOrders: homeDeliveryOperations.fetchUnconfirmedOrders,\n fetchDeliveredOrders: homeDeliveryOperations.fetchDeliveredOrders,\n fetchDrivers: driverOperations.fetchDrivers,\n selectBranch: branchOperations.selectBranch,\n fetchLogisticPartners: logisticPartnersOperations.fetchLogisticPartners,\n};\n\nexport default connect(mapStateToProps, mapDispatchToProps)(HomeDeliveries);\n","import React, { useEffect, useState } from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport { connect } from \"react-redux\";\nimport { filterOrders } from \"../../helpers/orderFunctions\";\nimport { currentTabOperations } from \"../../state/features/currentTab\";\nimport { pickupOperations } from \"../../state/features/pickup\";\nimport type { AxiosErrorResponse } from \"../../types/axiosMiddleware\";\nimport NoOrders from \"../noOrders\";\nimport Order from \"../order\";\nimport { AnimateOrderTransitions } from \"../animateOrderTransitions\";\nimport { AnimateTableTransition } from \"../animateTableTransitions\";\nimport { useEntryTransitionConfig } from \"../../hooks/useEntryTransitionConfig\";\n\ninterface IPickupNewOrdersProps {\n markOrderReady: any;\n newOrders: any;\n setCurrentTab: any;\n}\n\nfunction PickupNewOrders(props: IPickupNewOrdersProps) {\n const [selecteOrderId, setSelectedOrderId] = useState(0);\n const [disableButton, setDisable] = useState(false);\n const [filterdNewOrders, setFilteredNewOrders] = useState([] as any);\n const { enableEntryTransition } = useEntryTransitionConfig();\n\n useEffect(() => {\n props.setCurrentTab(\"pickup.new\");\n }, []);\n\n useEffect(() => {\n setFilteredNewOrders(props.newOrders);\n }, [JSON.stringify(props.newOrders)]);\n\n const setOrderReady = (orderId: any) => {\n setDisable(true);\n setSelectedOrderId(orderId);\n props\n .markOrderReady(orderId)\n .then(() => {\n setDisable(false);\n })\n .catch((err: AxiosErrorResponse) => {\n console.log(err);\n setDisable(false);\n });\n };\n\n const onFilterChanges = (filterOption: any) => {\n setFilteredNewOrders(filterOrders(filterOption, props.newOrders));\n };\n\n return (\n \n 0}\n component={({ ref }) => (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n (\n setOrderReady(orderId)}\n item={order}\n disableButton={\n order.order_id === selecteOrderId && disableButton\n }\n />\n )}\n />\n \n \n )}\n />\n {!filterdNewOrders.length ?
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n const newOrders = state.order.pickup.new_pickup_orders.orders || [];\n return { newOrders };\n};\n\nconst mapDispatchToProps = {\n setCurrentTab: currentTabOperations.setCurrentTab,\n markOrderReady: pickupOperations.markOrderReady,\n};\n\nexport default connect(mapStateToProps, mapDispatchToProps)(PickupNewOrders);\n","import React from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport Order from \"../order\";\n\nconst SearchResults = ({\n orders,\n selecteOrderId,\n disableButton,\n markOrderCollected,\n}: any) => {\n return (\n | \n | \n | \n \n | \n \n | \n \n | \n \n | \n \n | \n \n | \n
|---|
\n onSearchChange(searchValue)}\n />\n {showSearchResults ? (\n 0 && !showSearchResults}\n component={({ ref }) => (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n (\n \n \n )}\n />\n )}\n {!props.readyOrders.length ?
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let readyOrders = state.order.pickup.ready_pickup_orders.orders || [];\n let selectedBranch = state.company?.selected_branch;\n let company = state.company.company_details;\n let refreshRequired = state.order.home_delivery.ready_orders.refresh_required;\n let printSettings = state.printSettings;\n return {\n readyOrders,\n selectedBranch,\n company,\n refreshRequired,\n printSettings,\n };\n};\n\nconst mapDispatchToProps = {\n markOrderCollected: pickupOperations.markOrderCollected,\n setCurrentTab: currentTabOperations.setCurrentTab,\n};\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps\n)(PickupWaitingForCollection);\n","import React, { useEffect, useState } from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport { connect } from \"react-redux\";\nimport { filterOrders } from \"../../helpers/orderFunctions\";\nimport { currentTabOperations } from \"../../state/features/currentTab\";\nimport NoOrders from \"../noOrders\";\nimport Order from \"../order\";\nimport OrdersFilterSection from \"../ordersFilterSection\";\nimport { AnimateOrderTransitions } from \"../animateOrderTransitions\";\nimport { useEntryTransitionConfig } from \"../../hooks/useEntryTransitionConfig\";\n\ninterface IPickupCollectedProps {\n collectedOrders: any;\n selectedBranch: any;\n company: any;\n setCurrentTab: any;\n refreshRequired: any;\n}\n\nfunction PickupCollected(props: IPickupCollectedProps) {\n const [collectedOrders, setCollectedOrders] = useState([]);\n const [filteredCollectedOrders, setFilteredCollectedOrders] = useState(\n [] as any\n );\n const { enableEntryTransition } = useEntryTransitionConfig();\n\n useEffect(() => {\n props.setCurrentTab(\"pickup.collected\");\n }, []);\n\n useEffect(() => {\n setCollectedOrders(props.collectedOrders);\n }, [JSON.stringify(props.collectedOrders)]);\n\n useEffect(() => {\n setFilteredCollectedOrders(collectedOrders);\n }, [JSON.stringify(collectedOrders)]);\n\n const onFilterChanges = (filterOption: any) => {\n setFilteredCollectedOrders(filterOrders(filterOption, collectedOrders));\n };\n\n return (\n \n onFilterChanges(filterOption)}\n />\n {filteredCollectedOrders.length > 0 ? (\n \n \n
\n ) : (\n
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let collectedOrders = state.order.pickup.collected_pickup_orders.orders || [];\n let selectedBranch = state.company?.selected_branch;\n let company = state.company.company_details;\n let refreshRequired = state.order.home_delivery.ready_orders.refresh_required;\n\n return { collectedOrders, selectedBranch, company, refreshRequired };\n};\n\nconst mapDispatchToProps = {\n setCurrentTab: currentTabOperations.setCurrentTab,\n};\n\nexport default connect(mapStateToProps, mapDispatchToProps)(PickupCollected);\n","import React, { useEffect, useState } from \"react\";\nimport { connect } from \"react-redux\";\nimport { currentTabOperations } from \"../../state/features/currentTab\";\nimport NoOrders from \"../noOrders\";\nimport Order from \"../order\";\nimport { pickupOperations } from \"../../state/features/pickup\";\nimport Swal from \"sweetalert2\";\nimport { getEnvValueFor } from \"../../helpers/utils\";\nimport { validateCollectedPayments } from \"../../helpers/orderFunctions\";\nimport { FormattedMessage, useIntl } from \"react-intl\";\nimport type { AxiosErrorResponse } from \"../../types/axiosMiddleware\";\nimport { AnimateOrderTransitions } from \"../animateOrderTransitions\";\nimport { AnimateTableTransition } from \"../animateTableTransitions\";\nimport { useEntryTransitionConfig } from \"../../hooks/useEntryTransitionConfig\";\n\ninterface IPickupUnconfirmedOrdersProps {\n unconfirmedOrders: any;\n setCurrentTab: any;\n markOrderConfirm?: any;\n markOrderReject?: any;\n markOrderRejectWithReason?: any;\n markPickupOrderConfirmedWithPayment?: any;\n company: any;\n}\n\nfunction PickupUnconfirmedOrders(props: IPickupUnconfirmedOrdersProps) {\n const [selectedOrderId, setSelectedOrderId] = useState(0);\n const [disableButton, setDisable] = useState(false);\n const [hideDetails, setHideDetails] = useState(false);\n const intl = useIntl();\n const formattedMessage = (formatId: any) => {\n const translatedMessage = intl.formatMessage({ id: formatId });\n return translatedMessage;\n };\n const { enableEntryTransition } = useEntryTransitionConfig();\n\n useEffect(() => {\n props.setCurrentTab(\"pickup.unconfirmed\");\n }, []);\n\n const handleApprove = (orderId: any, orderSource: any) => {\n setDisable(true);\n setSelectedOrderId(orderId);\n setHideDetails(false);\n props\n .markOrderConfirm(orderId, orderSource)\n .then((res: any) => {\n setDisable(false);\n setHideDetails(true);\n })\n .catch((err: AxiosErrorResponse) => {\n console.log(err);\n setDisable(false);\n });\n };\n const handleReject = (\n orderId: any,\n cancelReasonId: any,\n supervisorPassword: any\n ) => {\n setDisable(true);\n setSelectedOrderId(orderId);\n setHideDetails(false);\n props\n .markOrderRejectWithReason(\n orderId,\n false,\n cancelReasonId,\n supervisorPassword\n )\n .then((res: any) => {\n setHideDetails(true);\n setDisable(false);\n })\n .catch((err: any) => {\n if (\n err.error.response !== undefined &&\n err.error.response.status === 422\n ) {\n setDisable(false);\n let text: any = formattedMessage(\"global.password_invalid\");\n Swal.fire({\n icon: \"warning\",\n text: text,\n });\n }\n });\n };\n\n const handleAutoReject = (orderId: any) => {\n props\n .markOrderReject(orderId, true)\n .catch((err: AxiosErrorResponse) => console.log(err));\n };\n\n const handleConfirmWithPayment = (orderId: any, orderPayments: any) => {\n setDisable(true);\n setSelectedOrderId(orderId);\n setHideDetails(false);\n let validationEnabledCompanies: any = JSON.parse(\n getEnvValueFor(\"VALIDATION_ENABLED_COMPANIES\") || \"[]\"\n );\n if (validationEnabledCompanies?.includes(props.company.company_id)) {\n console.debug(\"[APP] Initiating payment validation\");\n let order: any = null;\n let orderIndex = props.unconfirmedOrders.findIndex(\n (order: any) => order.order_id === orderId\n );\n if (orderIndex !== -1) {\n order = props.unconfirmedOrders[orderIndex];\n validateCollectedPayments(order, orderPayments, () => {\n props\n .markPickupOrderConfirmedWithPayment(orderId, orderPayments)\n .then((response: any) => {\n setHideDetails(true);\n setDisable(false);\n })\n .catch((err: AxiosErrorResponse) => {\n console.log(err);\n setDisable(false);\n });\n });\n }\n } else {\n props\n .markPickupOrderConfirmedWithPayment(orderId, orderPayments)\n .then((response: any) => {\n setHideDetails(true);\n setDisable(false);\n })\n .catch((err: AxiosErrorResponse) => {\n console.log(err);\n setDisable(false);\n });\n }\n };\n\n return (\n | \n |
|---|
\n 0}\n component={({ ref }) => (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n {props.unconfirmedOrders.length > 0 ? (\n (\n \n handleReject(\n orderId,\n cancelReasonId,\n supervisorPassword\n )\n }\n handleAutoReject={handleAutoReject}\n orderType=\"unconfirmed\"\n orderStatus=\"unconfirmed\"\n handleOrderState={handleConfirmWithPayment}\n key={item.order_id}\n disableButton={\n item.order_id === selectedOrderId && disableButton\n }\n item={item}\n hideDetails={hideDetails}\n />\n )}\n />\n ) : null}\n \n \n )}\n />\n {!props.unconfirmedOrders.length ?
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let unconfirmedOrders =\n state.order.pickup.unconfirmed_pickup_orders.orders || [];\n let company = state.company.company_details;\n\n return { unconfirmedOrders, company };\n};\n\nconst mapDispatchToProps = {\n setCurrentTab: currentTabOperations.setCurrentTab,\n markOrderConfirm: pickupOperations.markPickupUnconfirmedOrderConfirm,\n markOrderReject: pickupOperations.markPickupUnconfirmedOrderReject,\n markOrderRejectWithReason:\n pickupOperations.markPickupUnconfirmedOrderRejectWithReason,\n markPickupOrderConfirmedWithPayment:\n pickupOperations.markPickupOrderConfirmedWithPayment,\n};\n\nexport default connect(\n mapStateToProps,\n mapDispatchToProps\n)(PickupUnconfirmedOrders);\n","import React, { useEffect, useState } from \"react\";\nimport { Route, Switch } from \"react-router-dom\";\nimport { connect } from \"react-redux\";\nimport { pickupOperations } from \"../../state/features/pickup\";\nimport TabNavigation from \"../../components/tabs\";\nimport PickupNewOrders from \"../../components/pickupNewOrders\";\nimport pickupWaitingForCollection from \"../../components/pickupWaitingForCollection\";\nimport pickupCollected from \"../../components/pickupCollected\";\nimport { branchOperations } from \"../../state/features/branches\";\nimport { useSelectedBranch } from \"../../helpers/orderFunctions\";\nimport pickupUnconfirmed from \"../../components/pickupUnconfirmed\";\nimport { FormattedMessage } from \"react-intl\";\nimport type { AxiosErrorResponse } from \"../../types/axiosMiddleware\";\n\ninterface PickupsProps {\n company: any;\n branches: any;\n pickupOrders: any;\n fetchNewPickupOrders: any;\n fetchReadyPickupOrders: any;\n fetchCollectedPickupOrders: any;\n selectBranch: any;\n selectedBranch: any;\n currentTab: any;\n fetchPickupUnconfirmedOrders: any;\n}\n\nfunction Pickups(props: PickupsProps) {\n const [hideUnconfirmed, setHideUnconfirmed] = useState(true);\n useEffect(() => {\n if (Object.keys(props.selectedBranch).length > 0) {\n props\n .fetchPickupUnconfirmedOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n props\n .fetchNewPickupOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n props\n .fetchReadyPickupOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n props\n .fetchCollectedPickupOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n }, [props.selectedBranch]);\n\n useEffect(() => {\n if (\n props.currentTab.length > 0 &&\n Object.keys(props.pickupOrders).length > 0 &&\n Object.keys(props.selectedBranch).length > 0\n ) {\n switch (props.currentTab) {\n case \"pickup.unconfirmed\":\n if (props.pickupOrders.unconfirmed_pickup_orders.refresh_required) {\n props\n .fetchPickupUnconfirmedOrders(\n useSelectedBranch(props.selectedBranch)\n )\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n break;\n case \"pickup.new\":\n if (props.pickupOrders.new_pickup_orders.refresh_required) {\n props\n .fetchNewPickupOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n break;\n case \"pickup.ready\":\n if (props.pickupOrders.ready_pickup_orders.refresh_required) {\n props\n .fetchReadyPickupOrders(useSelectedBranch(props.selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n break;\n case \"pickup.collected\":\n if (props.pickupOrders.collected_pickup_orders.refresh_required) {\n props\n .fetchCollectedPickupOrders(\n useSelectedBranch(props.selectedBranch)\n )\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n break;\n default:\n \"\";\n }\n }\n if (props.company.user_permissions?.includes(\"weborder.manage\")) {\n setHideUnconfirmed(false);\n } else if (props.company.user_permissions?.includes(\"all.manage\")) {\n setHideUnconfirmed(false);\n } else {\n setHideUnconfirmed(true);\n }\n }, [\n props.currentTab,\n props.pickupOrders,\n props.selectedBranch,\n props.company,\n ]);\n\n const tabs = [\n {\n name: \n \n \n
\n );\n}\n\nconst mapStateToProps = (state: any) => {\n let pickupOrders = state.order.pickup;\n let branches = state.branches || [];\n let company = state.company.company_details;\n let selectedBranch = state.company?.selected_branch;\n let currentTab = state.currentTab;\n\n return { pickupOrders, branches, company, selectedBranch, currentTab };\n};\n\nconst mapDispatchToProps = {\n fetchNewPickupOrders: pickupOperations.fetchNewPickupOrders,\n fetchReadyPickupOrders: pickupOperations.fetchReadyPickupOrders,\n fetchCollectedPickupOrders: pickupOperations.fetchCollectedPickupOrders,\n fetchPickupUnconfirmedOrders: pickupOperations.fetchPickupUnconfirmedOrders,\n selectBranch: branchOperations.selectBranch,\n};\n\nexport default connect(mapStateToProps, mapDispatchToProps)(Pickups);\n","import React, { useEffect, useMemo } from \"react\";\nimport { connect } from \"react-redux\";\nimport NoOrders from \"../../components/noOrders\";\nimport { filterOrderLogisticsPartners, useSelectedBranch } from \"../../helpers/orderFunctions\";\nimport { scheduledOperations } from \"../../state/features/scheduled\";\nimport Order from \"../../components/order\";\nimport { FormattedMessage } from \"react-intl\";\nimport { logisticPartnersOperations } from \"../../state/features/logisticPartners\";\nimport { driverOperations } from \"../../state/features/drivers\";\nimport { useAppStateSelector } from \"../../hooks/useAppStateSelector\";\nimport type { AxiosErrorResponse } from \"../../types/axiosMiddleware\";\nimport { AnimateOrderTransitions } from \"../../components/animateOrderTransitions\";\nimport { AnimateTableTransition } from \"../../components/animateTableTransitions\";\nimport { useEntryTransitionConfig } from \"../../hooks/useEntryTransitionConfig\";\n\ninterface iScheduledProps {\n fetchScheduledOrders: any;\n fetchDrivers: any;\n fetchLogisticPartners: any;\n}\n\nfunction Scheduled(props: iScheduledProps) {\n const selectedBranch = useAppStateSelector(\n (state) => state.company?.selected_branch\n );\n const scheduledOrders = useAppStateSelector(\n (state) => state.order.scheduled.orders\n );\n const logisticsPartners = useAppStateSelector(\n (state) => state.logisticPartners\n );\n const companyCountry = useAppStateSelector(\n (state) => state.company.company_details.country\n );\n const logisticsPartnersWithSchedulingSupport = logisticsPartners.filter(\n (item: any) => {\n let partnerEnabledCountries =\n item?.configuration?.partner_config?.enabled_regions || [];\n let isScheduledOrdersSupported =\n item?.configuration?.partner_config?.scheduled_order_assignment ||\n false;\n return (\n partnerEnabledCountries.includes(companyCountry) &&\n isScheduledOrdersSupported\n );\n }\n );\n\n const { enableEntryTransition } = useEntryTransitionConfig();\n\n const homeDeliveryScheduledOrders = useMemo(() => {\n return scheduledOrders.filter((s: any) => !s.order_extended_info.take_away);\n }, [JSON.stringify(scheduledOrders)]);\n\n const scheduledOrdersWithAssignablePartners = useMemo(() => {\n return homeDeliveryScheduledOrders.filter(\n (o: any) =>\n filterOrderLogisticsPartners(\n o.location_id,\n logisticsPartnersWithSchedulingSupport\n ).length > 0\n );\n }, [\n JSON.stringify(homeDeliveryScheduledOrders),\n JSON.stringify(logisticsPartnersWithSchedulingSupport),\n ]);\n\n const showLogisticsPartnersColumn =\n scheduledOrdersWithAssignablePartners.length > 0 &&\n homeDeliveryScheduledOrders.length > 0;\n\n useEffect(() => {\n if (Object.keys(selectedBranch).length > 0) {\n props\n .fetchScheduledOrders(useSelectedBranch(selectedBranch))\n .catch((err: AxiosErrorResponse) => console.log(err));\n }\n }, [selectedBranch]);\n\n return (\n \n \n
\n 0}\n component={({ ref }) => (\n \n \n \n \n \n \n \n \n \n \n \n \n \n {showLogisticsPartnersColumn ? (\n \n \n ) : null}\n \n \n {scheduledOrders.length > 0 ? (\n \n (\n \n ) : null}\n \n )}\n />\n {!scheduledOrders.length && (\n \n \n
\n )}\n
\n );\n}\n\nconst mapDispatchToProps = {\n fetchScheduledOrders: scheduledOperations.fetchScheduledOrders,\n fetchDrivers: driverOperations.fetchDrivers,\n fetchLogisticPartners: logisticPartnersOperations.fetchLogisticPartners,\n};\n\nexport default connect(null, mapDispatchToProps)(Scheduled);\n","import React from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport { hardRefresh } from \"../../helpers/utils\";\n\nfunction NoInternet() {\n return (\n \n
\n | \n | \n \n
\n \n
\n );\n}\n\nexport default NoInternet;\n","import React from \"react\";\nimport { FormattedMessage } from \"react-intl\";\nimport { getEnvValueFor } from \"../../helpers/utils\";\n\ninterface iDmmsDisabledProps {\n branchName: string;\n}\n\nfunction DmmsDisabled(props: iDmmsDisabledProps) {\n return (\n \n
\n \n
\n \n \n \n
\n
\n );\n}\n\nexport default DmmsDisabled;\n","import React, { useEffect, useState } from \"react\";\nimport Header from \"../header\";\nimport { Redirect, Route, Switch, useHistory } from \"react-router-dom\";\nimport HomeDeliveries from \"../../containers/homeDeliveries\";\nimport Pickups from \"../../containers/pickups\";\nimport Scheduled from \"../../containers/scheduled\";\nimport LoginError from \"../../containers/loginError\";\nimport { connect } from \"react-redux\";\nimport NoInternet from \"../noInternet\";\nimport Swal from \"sweetalert2\";\nimport DmmsDisabled from \"../dmmsDisabled\";\nimport { hardRefresh } from \"../../helpers/utils\";\n\ninterface IAppProps {\n pusher: any;\n error: any;\n selectedBranch?: any;\n}\n\nfunction App(props: IAppProps) {\n const [showOfflineOverlay, setShowOfflineOverlay] = useState(false);\n const [loginErrorRedirect, setLoginErrorRedirect] = useState(false);\n const [isDmmsDisabled, setIsDmmsDisabled] = useState(false);\n\n const history = useHistory();\n\n useEffect(() => {\n if (props.error.showError) {\n switch (props.error.errorType) {\n case \"noInternet\":\n setShowOfflineOverlay(true);\n break;\n case \"generic\":\n Swal.fire(props.error.errorMessage).then((res: any) => {\n hardRefresh();\n });\n break;\n case \"jwtRefreshFailed\":\n history.push(\"/login-error\");\n break;\n default:\n Swal.fire(props.error.errorMessage);\n }\n } else {\n setShowOfflineOverlay(false);\n setLoginErrorRedirect(false);\n }\n }, [props.error]);\n\n useEffect(() => {\n if (Object.keys(props.selectedBranch).length > 0) {\n if (\n props.selectedBranch.name === \"All branches\" ||\n props.selectedBranch.name === \"Multiple Branches\"\n ) {\n setIsDmmsDisabled(false);\n } else if (!props.selectedBranch.delivery_enabled) {\n setIsDmmsDisabled(true);\n } else {\n setIsDmmsDisabled(false);\n }\n }\n }, [props.selectedBranch]);\n\n return (\n <>\n {showOfflineOverlay && \n
\n \n
- \n
- \n
>{\" \"}\n \n \n \n - \n
\n \n - \n
\n \n
\n
\n ) : (\n \n \n \n )}\n
\n )}\n \n );\n}\n\nconst mapStateToProps = (state: any) => {\n let error = state.error;\n let selectedBranch = state.company.selected_branch;\n return { error, selectedBranch };\n};\n\nexport default connect(mapStateToProps)(App);\n","export const UPDATE_LOADER = \"loader/UPDATE_LOADER\";\nexport const RESET_LOADER = \"loader/RESET_LOADER\";\nexport const SHOW_LOADER = \"loader/SHOW_LOADER\";\n","import actions from \"./actions\";\n\nconst updateLoader = actions.updateLoader;\nconst resetLoader = actions.resetLoader;\nconst showLoader = actions.showLoader;\n\nexport default { updateLoader, resetLoader, showLoader };\n","import reducer from \"./reducers\";\n\nexport { default as loaderOperations } from \"./operations\";\n\n\nexport default reducer;\n","import * as orderTypes from \"../homeDelivery/types\";\nimport * as types from \"./types\"\nimport * as companyTypes from \"../company/types\";\nimport * as pickupOrderTypes from '../pickup/types'\n\nconst loaderReducer = (state = {}, action: any) => {\n switch(action.type){\n\n // case orderTypes.FETCH_UNCONFIRMED_ORDERS:\n // case orderTypes.FETCH_NEW_ORDERS:\n // case orderTypes.FETCH_IN_PROGRESS_ORDERS:\n // case orderTypes.FETCH_READY_ORDERS:\n // case orderTypes.FETCH_RIDER_STATS:\n // case companyTypes.FETCH_COMPANY:\n // return { loading: true };\n case orderTypes.FETCH_UNCONFIRMED_ORDERS_SUCCESS:\n case orderTypes.FETCH_UNCONFIRMED_ORDERS_FAIL:\n case orderTypes.FETCH_NEW_ORDERS_SUCCESS:\n case orderTypes.FETCH_NEW_ORDERS_FAIL:\n case orderTypes.FETCH_READY_ORDERS_SUCCESS:\n case orderTypes.FETCH_READY_ORDERS_FAIL:\n case orderTypes.FETCH_IN_PROGRESS_ORDERS_SUCCESS:\n case orderTypes.FETCH_IN_PROGRESS_ORDERS_FAIL:\n case orderTypes.FETCH_RIDER_STATS_SUCCESS:\n case orderTypes.FETCH_RIDER_STATS_FAIL:\n case companyTypes.FETCH_COMPANY_SUCCESS:\n case companyTypes.FETCH_COMPANY_FAIL:\n return { loading: false };\n case types.UPDATE_LOADER:\n return action.payload;\n case types.RESET_LOADER:\n return null;\n default:\n return state;\n }\n}\n\nconst reducer = loaderReducer;\n\nexport default reducer;\n","export const REFRESH_TOKEN_FAILED = \"jwt/REFRESH_TOKEN_FAILED\";\n","export const NETWORK_ERROR = \"error/NETWORK_ERROR\";\n","import React from \"react\";\nimport * as companyTypes from \"../company/types\";\nimport * as branchesTypes from \"../branches/types\";\nimport * as paymentTypes from \"../payments/types\";\nimport * as homeDeliveryTypes from \"../homeDelivery/types\";\nimport * as pickupTypes from \"../pickup/types\";\nimport * as riderTypes from \"../drivers/types\";\nimport * as orderTypes from \"../order/types\";\nimport * as reprintTypes from \"../reprints/types\";\nimport * as jwtTypes from \"../jwt/types\";\nimport * as logisticTypes from \"../logisticPartners/types\";\nimport * as driversTypes from \"../drivers/types\";\nimport * as types from \"./types\";\nimport {\n generateAggregatorError,\n generateErrorMessage,\n} from \"../../../helpers/utils\";\nimport { logisticErrors } from \"../../../helpers/logisticErrors\";\n\nlet errorMessage = {\n title: generateErrorMessage(logisticErrors.oops),\n text: generateErrorMessage(logisticErrors.globalErr),\n icon: \"warning\",\n};\n\nlet thirdPartyCancelErr = {\n title: generateErrorMessage(logisticErrors.thirdPartyErr),\n};\n\nconst aggregtorErrorMessage = (orderSource: any) => {\n return {\n icon: \"error\",\n title: generateErrorMessage(logisticErrors.unConfirmErr),\n text: generateAggregatorError(orderSource),\n };\n};\n\nconst errorReducer = (state: any = { showError: false }, action: any) => {\n switch (action.type) {\n case types.NETWORK_ERROR:\n return { ...state, showError: true, errorType: \"noInternet\" };\n case companyTypes.FETCH_COMPANY_FAIL:\n case branchesTypes.FETCH_BRANCHES_FAIL:\n case paymentTypes.FETCH_PAYMENTS_FAIL:\n case homeDeliveryTypes.FETCH_NEW_ORDERS_FAIL:\n case homeDeliveryTypes.FETCH_UNCONFIRMED_ORDERS_FAIL:\n case homeDeliveryTypes.FETCH_READY_ORDERS_FAIL:\n case homeDeliveryTypes.FETCH_IN_PROGRESS_ORDERS_FAIL:\n case homeDeliveryTypes.FETCH_RIDER_STATS_FAIL:\n case homeDeliveryTypes.FETCH_RIDER_ORDERS_FAIL:\n case riderTypes.FETCH_DRIVERS_FAIL:\n case orderTypes.FETCH_ORDER_FAIL:\n case reprintTypes.FETCH_REPRINTS_FAIL:\n case reprintTypes.SET_ORDER_MARK_AS_REPRINTED_FAIL:\n case homeDeliveryTypes.SET_ORDER_MARK_AS_READY_FAIL:\n case homeDeliveryTypes.SET_ORDER_ASSIGN_RIDER_FAIL:\n case homeDeliveryTypes.SET_ORDER_MARK_AS_PICKUP_FAIL:\n case homeDeliveryTypes.SET_ORDER_MARK_AS_DELIVERED_FAIL:\n case pickupTypes.FETCH_NEW_PICKUP_ORDERS_FAIL:\n case pickupTypes.FETCH_READY_PICKUP_ORDERS_FAIL:\n case pickupTypes.FETCH_COLLECTED_PICKUP_ORDERS_FAIL:\n case pickupTypes.SET_PICKUP_ORDER_MARK_AS_READY_FAIL:\n case pickupTypes.SET_ORDER_COLLECTED_FAIL:\n case pickupTypes.FETCH_UNCONFIRMED_PICKUP_ORDERS_FAIL:\n case logisticTypes.CANCEL_LOGISTIC_JOB_FAIL:\n case logisticTypes.FETCH_LOGISTIC_PARTNERS_FAIL:\n case logisticTypes.ASSIGN_LOGISTIC_PARTNER_FAIL:\n case driversTypes.ASSIGN_NEW_RIDER_FAIL:\n case driversTypes.ASSIGN_READY_ORDER_RIDER_FAIL:\n case driversTypes.UNASSIGN_NEW_ORDER_RIDER_FAIL:\n case driversTypes.UNASSIGN_READY_ORDER_RIDER_FAIL:\n if (action.error.response !== undefined) {\n switch (action.error.response.status) {\n case 401:\n case 403:\n case 404:\n case 422:\n case 500:\n return {\n ...state,\n showError: true,\n errorType: \"generic\",\n errorMessage,\n };\n default:\n return state;\n }\n }\n break;\n case jwtTypes.REFRESH_TOKEN_FAILED:\n return { ...state, showError: true, errorType: \"jwtRefreshFailed\" };\n case homeDeliveryTypes.SET_UNCONFIRMED_ORDER_CONFIRM_FAIL:\n case pickupTypes.SET_UNCONFIRMED_PICKUP_ORDER_CONFIRM_FAIL:\n if (action.error.response.status !== undefined) {\n if ([401, 403, 404, 422].includes(action.error.response.status)) {\n return {\n ...state,\n showError: true,\n errorType: \"generic\",\n errorMessage,\n };\n }\n if (action.error.response.status === 500) {\n let sapaad_order_sources = [\"sapaad_pos\", \"sapaad_online\", \"byod\"];\n if (\n !sapaad_order_sources.includes(\n action.meta.previousAction.param.order_source\n )\n ) {\n return {\n ...state,\n showError: true,\n errorMessage: aggregtorErrorMessage(\n action.meta.previousAction.param.order_source\n ),\n };\n }\n return {\n ...state,\n showError: true,\n errorType: \"generic\",\n errorMessage,\n };\n }\n }\n return state;\n case homeDeliveryTypes.SET_UNCONFIRMED_ORDER_REJECT_FAIL:\n case pickupTypes.SET_UNCONFIRMED_PICKUP_ORDER_REJECT_FAIL:\n if (action.error.response.status !== undefined) {\n if ([404, 422].includes(action.error.response.status)) {\n return { ...state, showError: false };\n }\n return {\n ...state,\n showError: true,\n errorType: \"generic\",\n errorMessage,\n };\n }\n return state;\n case logisticTypes.PUSHER_RECEIVED_LOGISTIC_JOB_CANCELLED:\n return {\n ...state,\n showError: true,\n errorMessage: {\n title: action.payload.metadata.failure_message\n ? generateErrorMessage(logisticErrors.oops)\n : \"\",\n text: action.payload.metadata.failure_message\n ? action.payload.metadata.failure_message\n : `${thirdPartyCancelErr.title} ${action.payload.order_number}`,\n icon: action.payload.metadata.failure_message ? \"warning\" : \"info\",\n },\n };\n case logisticTypes.PUSHER_RECEIVED_LOGISTIC_CANCEL_FAILED:\n return {\n ...state,\n showError: true,\n errorMessage: {\n title: \"\",\n text: action.payload.metadata.failure_message,\n icon: \"info\",\n },\n };\n default:\n return state;\n }\n};\n\nconst reducer = errorReducer;\n\nexport default reducer;\n","import * as types from \"./types\";\n\nconst setNetworkError = () => ({\n type: types.NETWORK_ERROR,\n});\n\nexport default {\n setNetworkError,\n};\n","import actions from \"./actions\";\nimport { dispatchAction } from \"../../store\";\n\nconst setNetworkError = () => dispatchAction(actions.setNetworkError());\n\nexport default { setNetworkError };\n","import reducer from \"./reducers\";\n\nexport { default as errorOperations } from \"./operations\";\n\nexport default reducer;\n","import { isAggregator } from \"../../../helpers/utils\";\nimport * as homeDeliveryTypes from \"../homeDelivery/types\";\nimport * as pickupTypes from \"../pickup/types\";\n\nconst limboStateOrdersReducer = (state: any = [], action: any) => {\n switch (action.type) {\n case homeDeliveryTypes.SET_UNCONFIRMED_ORDER_CONFIRM_FAIL:\n case pickupTypes.SET_UNCONFIRMED_PICKUP_ORDER_CONFIRM_FAIL:\n if (action.error.response.status !== undefined) {\n if (\n action.error.response.status === 500 &&\n isAggregator(action.meta.previousAction.param.order_source)\n ) {\n let limboStateOrders = state;\n let orderId = action.meta.previousAction.param.order_id;\n if (limboStateOrders.length) {\n if (!limboStateOrders.includes(orderId)) {\n limboStateOrders.push(orderId);\n }\n } else {\n limboStateOrders.push(orderId);\n }\n return limboStateOrders\n }\n return state\n }\n return state;\n default:\n return state;\n }\n};\n\nconst reducer = limboStateOrdersReducer;\n\nexport default reducer;\n","import reducer from \"./reducers\";\n\nexport default reducer;\n","export const SET_AUTHORIZE_USER = \"auth/SET_AUTHORIZE_USER\";\nexport const SET_INITIATE_TICKER = \"auth/SET_INITIATE_TICKER\";\nexport const SET_TOKEN_EXPIRY = \"auth/SET_TOKEN_EXPIRY\";\nexport const SET_JWT_DATA = \"auth/SET_JWT_DATA\";\nexport const SET_SESSION_EXPIRED = \"auth/SET_SESSION_EXPIRED\";\n","import { JWT_REFRESH_TIMER_THRESHOLD_SECONDS } from \"../../../helpers/constants\";\nimport * as types from \"./types\";\n\nconst initialState = {\n authorize: false,\n tokenExpiry: null,\n jwtData: null,\n isTokenExpired: false,\n initiateTicker: false,\n};\n\nconst authReducer = (\n state = initialState,\n action: { payload: any; type: string }\n) => {\n switch (action.type) {\n case types.SET_AUTHORIZE_USER:\n return { ...state, authorize: action.payload };\n case types.SET_JWT_DATA:\n let tokenExpiry = action.payload.exp;\n let jwtData = action.payload;\n let updatedState = { ...state, tokenExpiry, jwtData };\n let timeDiff = tokenExpiry - new Date().getTime() / 1000;\n if (timeDiff <= JWT_REFRESH_TIMER_THRESHOLD_SECONDS) {\n return { ...updatedState, isTokenExpired: true, initiateTicker: false };\n }\n return {\n ...updatedState,\n authorize: true,\n isTokenExpired: false,\n initiateTicker: true,\n };\n case types.SET_INITIATE_TICKER:\n return { ...state, initiateTicker: action.payload };\n case types.SET_SESSION_EXPIRED:\n return { ...state, authorize: false };\n case types.SET_TOKEN_EXPIRY:\n return { ...state, tokenExpiry: action.payload };\n default:\n return state;\n }\n};\n\nconst reducer = authReducer;\n\nexport { reducer };\n","import { dispatchAction } from \"../../store\";\nimport * as actions from \"./actions\";\n\nconst authorizeUser = (params: any) =>\n dispatchAction(actions.authorizeUser(params));\n\nconst setInitiateTicker = (params: any) =>\n dispatchAction(actions.setInitiateTicker(params));\n\nconst setJwtData = (params: any) => dispatchAction(actions.setJwtData(params));\n\nconst setSessionExpired = () => dispatchAction(actions.setSessionExpired());\n\nexport default {\n authorizeUser,\n setInitiateTicker,\n setJwtData,\n setSessionExpired,\n};\n","import * as types from \"./types\";\n\nconst authorizeUser = (value: boolean) => ({\n type: types.SET_AUTHORIZE_USER,\n payload: value,\n});\n\nconst setInitiateTicker = (value: boolean) => ({\n type: types.SET_INITIATE_TICKER,\n payload: value,\n});\n\nconst setJwtData = (value: any) => ({\n type: types.SET_JWT_DATA,\n payload: value,\n});\n\nconst setSessionExpired = () => ({\n type: types.SET_SESSION_EXPIRED,\n});\n\nexport { authorizeUser, setInitiateTicker, setJwtData, setSessionExpired };\n","import { reducer } from \"./reducers\";\n\nexport { default as authOperations } from \"./operations\";\n\nexport default reducer;\n","const storeInitialState = {\n company: {\n selected_branch: {},\n company_details: {},\n },\n currentTab: \"\",\n order: {},\n theme: {\n dark_mode: false,\n },\n drivers: {\n company_drivers: [],\n logistics_partner_drivers: [],\n },\n loader: {\n loading: false,\n },\n branches: [],\n payments: [],\n reprints: [],\n cancelReasons: [],\n notifications: {\n home_delivery: {\n count: 0,\n },\n pickup: {\n count: 0,\n },\n },\n limboStateOrders: [],\n logisticPartners: [],\n printSettings: [],\n riderProximity: {},\n};\n\nexport default storeInitialState;\n","import axios from \"axios\";\n\nconst dmmsApi = axios.create({\n baseURL: \"\",\n responseType: \"json\",\n});\n\nconst authmsApi = axios.create({\n responseType: \"json\",\n});\n\nconst posApi = axios.create({});\n\nauthmsApi.interceptors.response.use((response: any) => {\n console.debug(\n `[AUTHMS] ${response.config.method.toUpperCase()} ${response.status} ${response.config.url}`,\n response.data\n )\n return response;\n});\n\nexport { dmmsApi, authmsApi };\n","import * as axiosClient from \"./axios\";\n\nexport default axiosClient\n","import * as Sentry from \"@sentry/react\";\n\nexport const reportExceptionToSentry = ({\n title = \"Error\",\n message,\n tags = {},\n}) => {\n let error = new Error(message);\n error.name = title;\n Object.entries(tags).forEach((tagEntry) => {\n Sentry.setTag(tagEntry[0], tagEntry[1]);\n });\n Sentry.captureException(error);\n};\n","import { createStore, combineReducers, applyMiddleware } from \"redux\";\nimport * as reducers from \"./features\";\nimport storeInitialState from \"./storeInitialState\";\nimport axiosMiddleware from \"redux-axios-middleware\";\nimport axiosClient from \"./middlewares\";\nimport {\n _getAccessToken,\n _getRefreshToken,\n _setToken,\n loadState,\n saveState,\n} from \"../helpers/localstorageService\";\nimport { composeWithDevTools } from \"redux-devtools-extension\";\nimport { authOperations } from \"./features/auth\";\nimport { errorOperations } from \"./features/error\";\nimport * as Sentry from \"@sentry/react\";\nimport { reportExceptionToSentry } from \"../helpers/sentry\";\n\nconst rootReducer = combineReducers(reducers);\n\naxiosClient.dmmsApi.interceptors.response.use(\n (res) => res,\n (err) => {\n if (err.message.includes(\"Network Error\")) {\n errorOperations.setNetworkError();\n }\n if (err?.response) {\n if (err?.response?.status === 401) {\n authOperations.setSessionExpired();\n }\n if (err?.response?.status === 500) {\n reportExceptionToSentry({\n title: \"Received response with status 500\",\n message: \"Please check breadcrumb log for more trace of events\",\n });\n }\n }\n return Promise.reject(err);\n }\n);\n\nconst options = {\n returnRejectedPromiseOnError: true,\n interceptors: {\n request: [\n ({ getState, dispatch }: any, config: any) => {\n const token = localStorage.getItem(\"jwt\");\n if (token) {\n config.headers[\"Authorization\"] = \"Bearer \" + token;\n }\n return config;\n },\n ],\n },\n};\n\nconst sentryReduxEnhancer = Sentry.createReduxEnhancer({\n attachReduxState: false,\n});\n\nconst persistedState = loadState();\nlet initialState = storeInitialState as any;\ninitialState = { ...persistedState };\nconst store = createStore(\n rootReducer,\n initialState,\n composeWithDevTools(\n applyMiddleware(axiosMiddleware(axiosClient.dmmsApi, options)),\n sentryReduxEnhancer\n )\n);\n\nstore.subscribe(() => {\n saveState({\n limboStateOrders: store.getState().limboStateOrders,\n });\n});\n\nconst dispatchAction = store.dispatch;\nexport type RootState = ReturnType\n
\n );\n}\n\nexport default BrowserCompatibility;\n","import React, { useEffect, useState } from \"react\";\nimport { connect } from \"react-redux\";\nimport { IntlProvider } from \"react-intl\";\n\n// Import translation data for each supported locale\nimport EnglishLocale from \"../locales/en.json\";\n\n// Used to send locale data and methods to update locale data in all components\nexport const LocaleContext = React.createContext();\n\nfunction loadMessages(locale: any) {\n switch (locale) {\n case \"ar\":\n return import(\"../locales/ar.json\");\n case \"en\":\n return import(\"../locales/en.json\");\n case \"ms\":\n return import(\"../locales/ms.json\");\n case \"zh\":\n return import(\"../locales/zh.json\");\n default:\n return import(\"../locales/en.json\");\n }\n}\n\ninterface ILocaleWrapperProps {\n company: any;\n children?: any;\n}\n\nconst LocaleWrapper = (props: ILocaleWrapperProps) => {\n const [locale, setLocale] = useState(\"en\");\n const [messages, setMessages] = useState(EnglishLocale);\n\n useEffect(() => {\n if (props.company.user_locale) {\n updateLocale(props.company.user_locale);\n } else {\n updateLocale(\"en\");\n }\n }, [props.company]);\n\n const updateLocale = (userLocale: any) => {\n setLocale(userLocale);\n loadMessages(userLocale).then((messages: any) => {\n setMessages(messages);\n });\n\n // Update RTL or LTR based on selected locale\n document.getElementsByTagName(\"html\")[0].setAttribute(\"lang\", userLocale);\n localStorage.setItem(\"locale\", userLocale);\n // if (userLocale == \"ar\") {\n // document.getElementsByTagName(\"html\")[0].setAttribute(\"dir\", \"rtl\");\n // document.getElementsByTagName(\"body\")[0].setAttribute(\"dir\", \"rtl\");\n // document.getElementsByTagName(\"body\")[0].classList.add(\"rtl\");\n // } else {\n // document.getElementsByTagName(\"html\")[0].setAttribute(\"dir\", \"ltr\");\n // document.getElementsByTagName(\"body\")[0].setAttribute(\"dir\", \"ltr\");\n // document.getElementsByTagName(\"body\")[0].classList.remove(\"rtl\");\n // }\n };\n\n return (\n \n \n \n \n \n \n \n \n \n
\n \n
\n \n \n \n \n \n\n
\n );\n}\n\nexport default LoginError;\n","import { useState } from \"react\";\n\n/**\n *\n * @param key Key\n * @param initialValue initial value\n * @returns Initial value or localStorage value\n */\nfunction useLocalStorage(key, initialValue) {\n // State to store our value\n // Pass initial state function to useState so logic is only executed once\n const [storedValue, setStoredValue] = useState(() => {\n if (typeof window === \"undefined\") {\n return initialValue;\n }\n try {\n // Get from local storage by key\n const item = window.localStorage.getItem(key);\n // Parse stored json or if none return initialValue\n return item ? item : initialValue;\n } catch (error) {\n // If error also return initialValue\n console.log(error);\n return initialValue;\n }\n });\n // Return a wrapped version of useState's setter function that ...\n // ... persists the new value to localStorage.\n const setValue = (value) => {\n try {\n // Allow value to be a function so we have same API as useState\n const valueToStore =\n value instanceof Function ? value(storedValue) : value;\n // Save state\n setStoredValue(valueToStore);\n // Save to local storage\n if (typeof window !== \"undefined\") {\n window.localStorage.setItem(\n key,\n typeof value === \"string\" ? value : JSON.stringify(valueToStore)\n );\n }\n } catch (error) {\n // A more advanced implementation would handle the error case\n console.log(error);\n }\n };\n return [storedValue, setValue];\n}\n\nexport { useLocalStorage };\n","import React, { useEffect } from \"react\";\nimport { useSelector } from \"react-redux\";\nimport LoginError from \"../../containers/loginError\";\nimport { JWT_REFRESH_TIMER_THRESHOLD_SECONDS } from \"../../helpers/constants\";\nimport { getEnvValueFor } from \"../../helpers/utils\";\nimport { useLocalStorage } from \"../../hooks/useLocalStorage\";\nimport { authOperations } from \"../../state/features/auth\";\nimport axiosClient from \"../../state/middlewares\";\nimport { useTicker } from \"./useTicker\";\n\nconst AuthProvider = ({ children }: any) => {\n const [jwt, setJwt] = useLocalStorage(\"jwt\", \"\");\n const [refreshToken] = useLocalStorage(\"rt\", \"\");\n\n const { authorize, tokenExpiry, initiateTicker, isTokenExpired } =\n useSelector((state: any) => state.auth);\n const { authorizeUser, setJwtData } = authOperations;\n\n const decodeAuthDataFromJwt = (token: string) => {\n try {\n if (token) {\n const authData = JSON.parse(atob(token.split(\".\")[1]));\n console.debug(`[AUTH] Token parse success. expiry: ${authData.exp} seconds`);\n console.debug(\n `[AUTH] New token will expire on ${new Date(authData.exp * 1000)}`\n );\n setJwtData(authData);\n }\n } catch (error) {\n console.debug(\"[AUTH] Invalid Token\");\n console.log(error);\n authorizeUser(false);\n }\n };\n\n const handleTokenRefresh = () => {\n console.debug(\"[AUTH] Refreshing JWT token\");\n axiosClient.authmsApi\n .post(\n `/api/dmms/v1/tokens/refresh`,\n {\n jwt: jwt,\n refresh_token: refreshToken,\n },\n {\n baseURL: `${getEnvValueFor(\"AUTH_MS_BASE_URL\")}`,\n }\n )\n .then((response) => {\n console.debug(\"[AUTH] JWT token refresh success\");\n setJwt(response.data.jwt);\n })\n .catch((error) => {\n console.debug(\"[AUTH] JWT token refresh failed\");\n console.log(error);\n authorizeUser(false);\n });\n };\n\n const [tickerStatus, startTicker, setTokenExpiry] = useTicker({\n thresholdValue: JWT_REFRESH_TIMER_THRESHOLD_SECONDS,\n onThresholdTrigger: handleTokenRefresh,\n });\n\n useEffect(() => {\n if (isTokenExpired) {\n handleTokenRefresh();\n }\n }, [isTokenExpired]);\n\n useEffect(() => {\n if (jwt) {\n decodeAuthDataFromJwt(jwt);\n } else {\n // If jwt is missing in localStorage\n authorizeUser(false);\n }\n }, [jwt]);\n\n useEffect(() => {\n if (initiateTicker && tokenExpiry) {\n setTokenExpiry(tokenExpiry); // Pass expiry value to ticker\n startTicker(true);\n }\n }, [initiateTicker, tokenExpiry]);\n\n return authorize ? <>{children} : \n
\n \n
\n \n