ordering-ui-admin-external 1.9.0 → 1.11.0

package/index-template.js

@@ -176,6 +176,75 @@ import singleStoreCustomerApp from './template/assets/images/myProducts/single-s
 import appStoreSmall from './template/assets/images/myProducts/app-store.png'
 import playStoreSmall from './template/assets/images/myProducts/play-store.png'
 
+/**
+ * pos
+ */
+import square from './template/assets/images/pos/square.png'
+import clover from './template/assets/images/pos/clover.png'
+import toast from './template/assets/images/pos/toast.png'
+import vectron from './template/assets/images/pos/vectron.png'
+import par from './template/assets/images/pos/par.png'
+import fourSoft from './template/assets/images/pos/4-soft.png'
+import auphan from './template/assets/images/pos/auphan.png'
+import cake from './template/assets/images/pos/cake.png'
+import edgeServ from './template/assets/images/pos/edge-serv.png'
+import brinkCertified from './template/assets/images/pos/brink-certified.png'
+import elCheff from './template/assets/images/pos/el-cheff.png'
+import emaginePos from './template/assets/images/pos/emagine-pos.png'
+import eposNow from './template/assets/images/pos/epos-now.png'
+import focus from './template/assets/images/pos/focus.png'
+import foodics from './template/assets/images/pos/foodics.png'
+import upserve from './template/assets/images/pos/upserve.png'
+import givex from './template/assets/images/pos/givex.png'
+import heartLand from './template/assets/images/pos/heart-land.png'
+import hippos from './template/assets/images/pos/hippos.png'
+import hungerRush from './template/assets/images/pos/hunger-rush.png'
+import infocaja from './template/assets/images/pos/infocaja.png'
+import iTabPos from './template/assets/images/pos/i-tab-pos.png'
+import lightSpeed from './template/assets/images/pos/light-speed.png'
+import linga from './template/assets/images/pos/linga.png'
+import maitre from './template/assets/images/pos/maitre.png'
+import microsRes from './template/assets/images/pos/micros-res.png'
+import microsSimphony from './template/assets/images/pos/micros-simphony.png'
+import mobileBytes from './template/assets/images/pos/mobile-bytes.png'
+import nationalSoft from './template/assets/images/pos/national-soft.png'
+import ncrAloha from './template/assets/images/pos/ncr-aloha.png'
+import ncrSilver from './template/assets/images/pos/ncr-silver.png'
+import northStar from './template/assets/images/pos/north-star.png'
+import onePos from './template/assets/images/pos/one-pos.png'
+import orderCounter from './template/assets/images/pos/order-counter.png'
+import ovvi from './template/assets/images/pos/ovvi.png'
+import paradisePos from './template/assets/images/pos/paradise-pos.png'
+import pixelPoint from './template/assets/images/pos/pixel-point.png'
+import posist from './template/assets/images/pos/posist.png'
+import posIst from './template/assets/images/pos/pos-ist.png'
+import prism from './template/assets/images/pos/prism.png'
+import prologicFirst from './template/assets/images/pos/prologic-first.png'
+import quBeyondPos from './template/assets/images/pos/qu-beyond-pos.png'
+import rbbtTech from './template/assets/images/pos/rbbt-tech.png'
+import restPro from './template/assets/images/pos/rest-pro.png'
+import revel from './template/assets/images/pos/revel.png'
+import rezku from './template/assets/images/pos/rezku.png'
+import salido from './template/assets/images/pos/salido.png'
+import snappy from './template/assets/images/pos/snappy.png'
+import softRestaurant from './template/assets/images/pos/soft-restaurant.png'
+import solutionDelivery from './template/assets/images/pos/solution-delivery.png'
+import speedLine from './template/assets/images/pos/speed-line.png'
+import spotOn from './template/assets/images/pos/spot-on.png'
+import sunamiPos from './template/assets/images/pos/sunami-pos.png'
+import superMenu from './template/assets/images/pos/super-menu.png'
+import talech from './template/assets/images/pos/talech.png'
+import telnet from './template/assets/images/pos/telnet.png'
+import tidThree from './template/assets/images/pos/tid-3.png'
+import touchBistro from './template/assets/images/pos/touch-bistro.png'
+import union from './template/assets/images/pos/union.png'
+import vistaEntertainment from './template/assets/images/pos/vista-entertainment-solutions.png'
+import xenial from './template/assets/images/pos/xenial.png'
+import xetux from './template/assets/images/pos/xetux.png'
+import dinerWare from './template/assets/images/pos/diner-ware.png'
+import digitalDining from './template/assets/images/pos/digital-dining.png'
+import foodTec from './template/assets/images/pos/food-tec.png'
+
 import { AutologinParams } from './template/components/AutologinParams'
 
 if (!(window?.location?.hostname === 'localhost')) {
@@ -351,6 +420,73 @@ theme.images = {
     appStoreSmall,
     playStoreSmall
   },
+  pos: {
+    square,
+    toast,
+    clover,
+    vectron,
+    par,
+    fourSoft,
+    auphan,
+    cake,
+    edgeServ,
+    brinkCertified,
+    elCheff,
+    emaginePos,
+    eposNow,
+    focus,
+    foodics,
+    upserve,
+    givex,
+    heartLand,
+    hippos,
+    hungerRush,
+    infocaja,
+    iTabPos,
+    lightSpeed,
+    linga,
+    maitre,
+    microsRes,
+    microsSimphony,
+    mobileBytes,
+    nationalSoft,
+    ncrAloha,
+    ncrSilver,
+    northStar,
+    onePos,
+    orderCounter,
+    ovvi,
+    paradisePos,
+    pixelPoint,
+    posist,
+    posIst,
+    prism,
+    prologicFirst,
+    quBeyondPos,
+    rbbtTech,
+    restPro,
+    revel,
+    rezku,
+    salido,
+    snappy,
+    softRestaurant,
+    solutionDelivery,
+    speedLine,
+    spotOn,
+    sunamiPos,
+    superMenu,
+    talech,
+    telnet,
+    tidThree,
+    touchBistro,
+    union,
+    vistaEntertainment,
+    xenial,
+    xetux,
+    dinerWare,
+    digitalDining,
+    foodTec
+  },
   icons: {
     ordersList: ordersList,
     shop: shop,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-admin-external",
-  "version": "1.9.0",
+  "version": "1.11.0",
   "description": "Ordering UI Admin Components",
   "main": "./_modules/index.js",
   "exports": {
@@ -83,7 +83,7 @@
     "lodash": "^4.17.20",
     "moment": "^2.29.1",
     "moment-range": "^4.0.2",
-    "ordering-components-admin-external": "1.9.0",
+    "ordering-components-admin-external": "1.11.0",
     "polished": "^3.6.7",
     "prop-types": "^15.7.2",
     "react-big-calendar": "^1.4.2",

package/src/components/BusinessIntelligence/AnalyticsSpendList/styles.js

@@ -39,7 +39,8 @@ export const TimeContentWrapper = styled.div`
     font-weight: 500;
     font-size: 52px;
     margin: 0;
-    color: ${props => props.theme?.colors.headingColor}
+    color: ${props => props.theme?.colors.headingColor};
+    word-break: break-word;
   }
   p {
     margin: 0;
@@ -53,6 +54,10 @@ export const AnalyticsSpendListContent = styled.div`
   align-items: flex-end;
   justify-content: space-between;
   margin-bottom: 30px;
+  flex-wrap: wrap;
+  > div {
+    margin-top: 10px;
+  }
 `
 
 export const ReviewBlock = styled.div`

package/src/components/BusinessIntelligence/BusinessAnalytics/styles.js

@@ -90,11 +90,6 @@ export const BusinessFilterWrapper = styled.div`
 
 export const BusinessCalendarWrapper = styled(BusinessFilterWrapper)`
   position: relative;
-  margin-left: 25px;
-  ${props => props.theme.rtl && css`
-    margin-right: 25px;
-    margin-left: 0;
-  `}
 
   > button {
     svg {
@@ -106,6 +101,12 @@ export const BusinessCalendarWrapper = styled(BusinessFilterWrapper)`
       `}
     }
   }
+
+  @media only screen and (min-width: 374px) and (max-width: 450px) {
+    .ordering-calendar {
+      right: calc((100vw - 374px) / 2);
+    }
+  }
 `
 
 export const AnalyticsContentWrapper = styled.div`

package/src/components/BusinessIntelligence/BusinessReviewList/index.js

@@ -122,6 +122,7 @@ const BusinessReviewsListingUI = (props) => {
               totalPages={Math.ceil(pagination?.total / pagination.pageSize)}
               handleChangePage={handleChangePage}
               handleChangePageSize={handleChangePageSize}
+              defaultPageSize={pagination?.pageSize}
             />
           )}
         </PagesBottomContainer>

package/src/components/BusinessIntelligence/BusinessReviewList/styles.js

@@ -141,7 +141,5 @@ export const ReviewMarkerWrapper = styled.div`
   }
 `
 export const PagesBottomContainer = styled.div`
-  display: flex;
-  justify-content: flex-end;
   margin-bottom: 10px;
 `

package/src/components/BusinessIntelligence/DriverAnalytics/styles.js

@@ -104,6 +104,12 @@ export const BusinessCalendarWrapper = styled(BusinessFilterWrapper)`
       `}
     }
   }
+
+  @media only screen and (min-width: 374px) and (max-width: 450px) {
+    .ordering-calendar {
+      right: calc((100vw - 374px) / 2);
+    }
+  }
 `
 
 export const AnalyticsTimeZoneWrapper = styled(BusinessFilterWrapper)``

package/src/components/BusinessIntelligence/ReportsAverageSales/styles.js

@@ -1,12 +1,12 @@
 import styled, { css } from 'styled-components'
 
 export const OrderStatusContainer = styled.div`
-  padding: 35px 15px;
+  padding: 25px 15px 70px 15px;
   width: 100%;
   overflow: auto;
 
   @media (min-width: 700px) {
-    padding: 35px;
+    padding: 25px 35px 70px 35px;
   }
 `
 
@@ -16,6 +16,11 @@ export const Title = styled.h2`
   color: ${props => props.theme?.colors.headingColor};
   margin-top: 0;
   margin-bottom: 30px;
+  margin-right: 35px;
+  ${props => props.theme?.rtl && css`
+    margin-right: 0;
+    margin-left: 35px;
+  `}
 `
 
 export const ButtonActionList = styled.div`
@@ -53,6 +58,22 @@ export const CalendarWrapper = styled.div`
       `}
     }
   }
+
+  @media only screen and (min-width: 374px) and (max-width: 450px) {
+    .ordering-calendar {
+      right: calc((100vw - 364px) / 2);
+    }
+  }
+
+  @media (max-width: 450px) {
+    width: 100%;
+    flex-wrap: wrap;
+    > button {
+      width: 100%;
+      margin-left: 0 !important;
+      margin-right: 0 !important;
+    }
+  }
 `
 
 export const BrandBusinessWrapper = styled(CalendarWrapper)`

package/src/components/BusinessIntelligence/ReportsBusinessDistance/styles.js

@@ -1,12 +1,12 @@
 import styled, { css } from 'styled-components'
 
 export const ReportsDistanceContainer = styled.div`
-  padding: 35px 15px;
+  padding: 25px 15px 70px 15px;
   width: 100%;
   overflow: auto;
 
   @media (min-width: 700px) {
-    padding: 35px;
+    padding: 25px 35px 70px 35px;
   }
 `
 
@@ -16,6 +16,11 @@ export const Title = styled.h2`
   color: ${props => props.theme?.colors.headingColor};
   margin-top: 0;
   margin-bottom: 30px;
+  margin-right: 35px;
+  ${props => props.theme?.rtl && css`
+    margin-right: 0;
+    margin-left: 35px;
+  `}
 `
 
 export const ButtonActionList = styled.div`
@@ -53,6 +58,22 @@ export const CalendarWrapper = styled.div`
       `}
     }
   }
+
+  @media only screen and (min-width: 374px) and (max-width: 450px) {
+    .ordering-calendar {
+      right: calc((100vw - 364px) / 2);
+    }
+  }
+
+  @media (max-width: 450px) {
+    width: 100%;
+    flex-wrap: wrap;
+    > button {
+      width: 100%;
+      margin-left: 0 !important;
+      margin-right: 0 !important;
+    }
+  }
 `
 
 export const BrandBusinessWrapper = styled(CalendarWrapper)`

package/src/components/BusinessIntelligence/ReportsBusinessSpend/styles.js

@@ -1,11 +1,12 @@
 import styled, { css } from 'styled-components'
 
 export const ReportsBusinessSpendContainer = styled.div`
-  padding: 35px 15px;
+  padding: 25px 15px 70px 15px;
   width: 100%;
+  overflow: auto;
 
   @media (min-width: 700px) {
-    padding: 35px;
+    padding: 25px 35px 70px 35px;
   }
 `
 
@@ -15,6 +16,11 @@ export const Title = styled.h2`
   color: ${props => props.theme?.colors.headingColor};
   margin-top: 0;
   margin-bottom: 30px;
+  margin-right: 35px;
+  ${props => props.theme?.rtl && css`
+    margin-right: 0;
+    margin-left: 35px;
+  `}
 `
 
 export const ButtonActionList = styled.div`
@@ -52,6 +58,22 @@ export const CalendarWrapper = styled.div`
       `}
     }
   }
+
+  @media only screen and (min-width: 374px) and (max-width: 450px) {
+    .ordering-calendar {
+      right: calc((100vw - 364px) / 2);
+    }
+  }
+
+  @media (max-width: 450px) {
+    width: 100%;
+    flex-wrap: wrap;
+    > button {
+      width: 100%;
+      margin-left: 0 !important;
+      margin-right: 0 !important;
+    }
+  }
 `
 
 export const BrandBusinessWrapper = styled(CalendarWrapper)`

package/src/components/BusinessIntelligence/ReportsCustomer/styles.js

@@ -1,11 +1,12 @@
 import styled, { css } from 'styled-components'
 
 export const ReportsTopDriversContainer = styled.div`
-  padding: 35px 15px;
+  padding: 25px 15px 70px 15px;
   width: 100%;
+  overflow: auto;
 
   @media (min-width: 700px) {
-    padding: 35px;
+    padding: 25px 35px 70px 35px;
   }
 `
 
@@ -15,6 +16,11 @@ export const Title = styled.h2`
   color: ${props => props.theme?.colors.headingColor};
   margin-top: 0;
   margin-bottom: 30px;
+  margin-right: 35px;
+  ${props => props.theme?.rtl && css`
+    margin-right: 0;
+    margin-left: 35px;
+  `}
 `
 
 export const ButtonActionList = styled.div`
@@ -52,6 +58,22 @@ export const CalendarWrapper = styled.div`
       `}
     }
   }
+
+  @media only screen and (min-width: 374px) and (max-width: 450px) {
+    .ordering-calendar {
+      right: calc((100vw - 364px) / 2);
+    }
+  }
+
+  @media (max-width: 450px) {
+    width: 100%;
+    flex-wrap: wrap;
+    > button {
+      width: 100%;
+      margin-left: 0 !important;
+      margin-right: 0 !important;
+    }
+  }
 `
 
 export const BrandBusinessWrapper = styled(CalendarWrapper)`

package/src/components/BusinessIntelligence/ReportsDriverDistance/styles.js

@@ -1,11 +1,12 @@
 import styled, { css } from 'styled-components'
 
 export const DriverDistanceContainer = styled.div`
-  padding: 35px 15px;
+  padding: 25px 15px 70px 15px;
   width: 100%;
+  overflow: auto;
 
   @media (min-width: 700px) {
-    padding: 35px;
+    padding: 25px 35px 70px 35px;
   }
 `
 
@@ -15,6 +16,11 @@ export const Title = styled.h2`
   color: ${props => props.theme?.colors.headingColor};
   margin-top: 0;
   margin-bottom: 30px;
+  margin-right: 35px;
+  ${props => props.theme?.rtl && css`
+    margin-right: 0;
+    margin-left: 35px;
+  `}
 `
 
 export const ButtonActionList = styled.div`
@@ -52,6 +58,22 @@ export const CalendarWrapper = styled.div`
       `}
     }
   }
+
+  @media only screen and (min-width: 374px) and (max-width: 450px) {
+    .ordering-calendar {
+      right: calc((100vw - 364px) / 2);
+    }
+  }
+
+  @media (max-width: 450px) {
+    width: 100%;
+    flex-wrap: wrap;
+    > button {
+      width: 100%;
+      margin-left: 0 !important;
+      margin-right: 0 !important;
+    }
+  }
 `
 
 export const BrandBusinessWrapper = styled(CalendarWrapper)`

package/src/components/BusinessIntelligence/ReportsDriverOrder/styles.js

@@ -1,11 +1,12 @@
 import styled, { css } from 'styled-components'
 
 export const ReportsBusinessSpendContainer = styled.div`
-  padding: 35px 15px;
+  padding: 25px 15px 70px 15px;
   width: 100%;
+  overflow: auto;
 
   @media (min-width: 700px) {
-    padding: 35px;
+    padding: 25px 35px 70px 35px;
   }
 `
 
@@ -15,6 +16,11 @@ export const Title = styled.h2`
   color: ${props => props.theme?.colors.headingColor};
   margin-top: 0;
   margin-bottom: 30px;
+  margin-right: 35px;
+  ${props => props.theme?.rtl && css`
+    margin-right: 0;
+    margin-left: 35px;
+  `}
 `
 
 export const ButtonActionList = styled.div`
@@ -52,6 +58,22 @@ export const CalendarWrapper = styled.div`
       `}
     }
   }
+
+  @media only screen and (min-width: 374px) and (max-width: 450px) {
+    .ordering-calendar {
+      right: calc((100vw - 364px) / 2);
+    }
+  }
+
+  @media (max-width: 450px) {
+    width: 100%;
+    flex-wrap: wrap;
+    > button {
+      width: 100%;
+      margin-left: 0 !important;
+      margin-right: 0 !important;
+    }
+  }
 `
 
 export const BrandBusinessWrapper = styled(CalendarWrapper)`

package/src/components/BusinessIntelligence/ReportsDriverOrderTime/styles.js

@@ -1,11 +1,12 @@
 import styled, { css } from 'styled-components'
 
 export const ReportsBusinessSpendContainer = styled.div`
-  padding: 35px 15px;
+  padding: 25px 15px 70px 15px;
   width: 100%;
+  overflow: auto;
 
   @media (min-width: 700px) {
-    padding: 35px;
+    padding: 25px 35px 70px 35px;
   }
 `
 
@@ -15,6 +16,11 @@ export const Title = styled.h2`
   color: ${props => props.theme?.colors.headingColor};
   margin-top: 0;
   margin-bottom: 30px;
+  margin-right: 35px;
+  ${props => props.theme?.rtl && css`
+    margin-right: 0;
+    margin-left: 35px;
+  `}
 `
 
 export const ButtonActionList = styled.div`
@@ -52,6 +58,22 @@ export const CalendarWrapper = styled.div`
       `}
     }
   }
+
+  @media only screen and (min-width: 374px) and (max-width: 450px) {
+    .ordering-calendar {
+      right: calc((100vw - 364px) / 2);
+    }
+  }
+
+  @media (max-width: 450px) {
+    width: 100%;
+    flex-wrap: wrap;
+    > button {
+      width: 100%;
+      margin-left: 0 !important;
+      margin-right: 0 !important;
+    }
+  }
 `
 
 export const BrandBusinessWrapper = styled(CalendarWrapper)`

package/src/components/BusinessIntelligence/ReportsDriverSchedule/styles.js

@@ -1,11 +1,12 @@
 import styled, { css } from 'styled-components'
 
 export const DriverScheduleContainer = styled.div`
-  padding: 35px 15px;
+  padding: 25px 15px 70px 15px;
   width: 100%;
+  overflow: auto;
 
   @media (min-width: 700px) {
-    padding: 35px;
+    padding: 25px 35px 70px 35px;
   }
 `
 
@@ -15,6 +16,11 @@ export const ScheduleTitle = styled.h2`
   color: ${props => props.theme?.colors.headingColor};
   margin-top: 0;
   margin-bottom: 30px;
+  margin-right: 35px;
+  ${props => props.theme?.rtl && css`
+    margin-right: 0;
+    margin-left: 35px;
+  `}
 `
 
 export const ButtonActionList = styled.div`
@@ -52,6 +58,22 @@ export const CalendarWrapper = styled.div`
       `}
     }
   }
+
+  @media only screen and (min-width: 374px) and (max-width: 450px) {
+    .ordering-calendar {
+      right: calc((100vw - 364px) / 2);
+    }
+  }
+
+  @media (max-width: 450px) {
+    width: 100%;
+    flex-wrap: wrap;
+    > button {
+      width: 100%;
+      margin-left: 0 !important;
+      margin-right: 0 !important;
+    }
+  }
 `
 
 export const BrandBusinessWrapper = styled(CalendarWrapper)`

package/src/components/BusinessIntelligence/ReportsDriverSpend/styles.js

@@ -1,11 +1,12 @@
 import styled, { css } from 'styled-components'
 
 export const ReportsBusinessSpendContainer = styled.div`
-  padding: 35px 15px;
+  padding: 25px 15px 70px 15px;
   width: 100%;
+  overflow: auto;
 
   @media (min-width: 700px) {
-    padding: 35px;
+    padding: 25px 35px 70px 35px;
   }
 `
 
@@ -15,6 +16,11 @@ export const Title = styled.h2`
   color: ${props => props.theme?.colors.headingColor};
   margin-top: 0;
   margin-bottom: 30px;
+  margin-right: 35px;
+  ${props => props.theme?.rtl && css`
+    margin-right: 0;
+    margin-left: 35px;
+  `}
 `
 
 export const ButtonActionList = styled.div`
@@ -52,6 +58,22 @@ export const CalendarWrapper = styled.div`
       `}
     }
   }
+
+  @media only screen and (min-width: 374px) and (max-width: 450px) {
+    .ordering-calendar {
+      right: calc((100vw - 364px) / 2);
+    }
+  }
+
+  @media (max-width: 450px) {
+    width: 100%;
+    flex-wrap: wrap;
+    > button {
+      width: 100%;
+      margin-left: 0 !important;
+      margin-right: 0 !important;
+    }
+  }
 `
 
 export const BrandBusinessWrapper = styled(CalendarWrapper)`