ordering-ui-admin-external 1.30.7 → 1.31.1

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

@@ -134,3 +134,37 @@ export const EmptyContent = styled.div`
   justify-content: center;
   padding: 10px;
 `
+
+export const AnalyticsTimeZoneWrapper = styled.div`
+  width: 100%;
+  button {
+    margin-top: 5px;
+    background: ${props => props.theme.colors.secundary};
+    border-radius: 7.6px;
+    padding: 7px 15px;
+    font-size: 14px;
+    color: ${props => props.theme.colors.secundaryContrast};
+    border: none;
+  }
+
+  @media (min-width: 600px) {
+    width: fit-content;
+    margin-left: 10px;
+    ${props => props.theme.rtl && css`
+      margin-right: 10px;
+      margin-left: 0;
+    `}
+  }
+`
+
+export const TimeZoneAndCalendar = styled.div`
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+
+  @media (min-width: 600px) {
+    flex-direction: row;
+    width: fit-content;
+  }
+`

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

@@ -9,6 +9,7 @@ import { AnalyticsBusinessFilter } from '../AnalyticsBusinessFilter'
 import { ReportsDriverFilter } from '../ReportsDriverFilter'
 import { ReportsDriverGroupFilter } from '../ReportsDriverGroupFilter'
 import { CountryFilter } from '../CountryFilter'
+import { AnalyticsFilterTimeZone } from '../AnalyticsFilterTimeZone'
 import {
   DriverDistanceContainer,
   Title,
@@ -22,7 +23,9 @@ import {
   Tbody,
   Tfoot,
   TableWrapper,
-  EmptyContent
+  EmptyContent,
+  AnalyticsTimeZoneWrapper,
+  TimeZoneAndCalendar
 } from './styles'
 
 const ReportsDriverDistanceUI = (props) => {
@@ -138,12 +141,17 @@ const ReportsDriverDistanceUI = (props) => {
               </Button>
             )}
           </BrandBusinessWrapper>
+          <TimeZoneAndCalendar>
+            <AnalyticsTimeZoneWrapper>
+              <AnalyticsFilterTimeZone {...props} />
+            </AnalyticsTimeZoneWrapper>
             <CalendarWrapper>
               <AnalyticsCalendar
                 handleChangeDate={handleChangeDate}
                 defaultValue={filterList}
               />
             </CalendarWrapper>
+          </TimeZoneAndCalendar>
         </ButtonActionList>
         <DistancePerBrandWrapper>
           <DistanceTitleBlock active={reportData?.content?.body?.rows?.length > 0}>
@@ -254,7 +262,7 @@ const ReportsDriverDistanceUI = (props) => {
         />
       </DriverDistanceContainer>
       <Alert
-        title={t('DRIVER_SCHEDULE', 'Driver schedule')}
+        title={t('DRIVER_DISTANCE', 'Driver distance')}
         content={alertState.content}
         acceptText={t('ACCEPT', 'Accept')}
         open={alertState.open}

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

@@ -210,3 +210,37 @@ export const EmptyContent = styled.div`
   justify-content: center;
   padding: 10px;
 `
+
+export const AnalyticsTimeZoneWrapper = styled.div`
+  width: 100%;
+  button {
+    margin-top: 5px;
+    background: ${props => props.theme.colors.secundary};
+    border-radius: 7.6px;
+    padding: 7px 15px;
+    font-size: 14px;
+    color: ${props => props.theme.colors.secundaryContrast};
+    border: none;
+  }
+
+  @media (min-width: 600px) {
+    width: fit-content;
+    margin-left: 10px;
+    ${props => props.theme.rtl && css`
+      margin-right: 10px;
+      margin-left: 0;
+    `}
+  }
+`
+
+export const TimeZoneAndCalendar = styled.div`
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+
+  @media (min-width: 600px) {
+    flex-direction: row;
+    width: fit-content;
+  }
+`

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

@@ -8,6 +8,7 @@ import { Modal } from '../../Shared'
 import { AnalyticsBusinessFilter } from '../AnalyticsBusinessFilter'
 import { ReportsBrandFilter } from '../ReportsBrandFilter'
 import { CountryFilter } from '../CountryFilter'
+import { AnalyticsFilterTimeZone } from '../AnalyticsFilterTimeZone'
 import {
   ReportsBusinessSpendContainer,
   Title,
@@ -21,7 +22,9 @@ import {
   Tbody,
   Tfoot,
   TableWrapper,
-  EmptyContent
+  EmptyContent,
+  AnalyticsTimeZoneWrapper,
+  TimeZoneAndCalendar
 } from './styles'
 
 const ReportsDriverOrderUI = (props) => {
@@ -112,12 +115,17 @@ const ReportsDriverOrderUI = (props) => {
             </Button>
           )}
         </BrandBusinessWrapper>
+        <TimeZoneAndCalendar>
+          <AnalyticsTimeZoneWrapper>
+            <AnalyticsFilterTimeZone {...props} />
+          </AnalyticsTimeZoneWrapper>
           <CalendarWrapper>
             <AnalyticsCalendar
               handleChangeDate={handleChangeDate}
               defaultValue={filterList}
             />
           </CalendarWrapper>
+        </TimeZoneAndCalendar>
       </ButtonActionList>
       <DistancePerBrandWrapper>
         <DistanceTitleBlock active={reportData?.content?.body?.rows?.length > 0}>

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

@@ -214,3 +214,37 @@ export const EmptyContent = styled.div`
   justify-content: center;
   padding: 10px;
 `
+
+export const AnalyticsTimeZoneWrapper = styled.div`
+  width: 100%;
+  button {
+    margin-top: 5px;
+    background: ${props => props.theme.colors.secundary};
+    border-radius: 7.6px;
+    padding: 7px 15px;
+    font-size: 14px;
+    color: ${props => props.theme.colors.secundaryContrast};
+    border: none;
+  }
+
+  @media (min-width: 600px) {
+    width: fit-content;
+    margin-left: 10px;
+    ${props => props.theme.rtl && css`
+      margin-right: 10px;
+      margin-left: 0;
+    `}
+  }
+`
+
+export const TimeZoneAndCalendar = styled.div`
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+
+  @media (min-width: 600px) {
+    flex-direction: row;
+    width: fit-content;
+  }
+`

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

@@ -8,6 +8,7 @@ import { Modal } from '../../Shared'
 import { AnalyticsBusinessFilter } from '../AnalyticsBusinessFilter'
 import { ReportsBrandFilter } from '../ReportsBrandFilter'
 import { CountryFilter } from '../CountryFilter'
+import { AnalyticsFilterTimeZone } from '../AnalyticsFilterTimeZone'
 import {
   ReportsBusinessSpendContainer,
   Title,
@@ -21,7 +22,9 @@ import {
   Tbody,
   Tfoot,
   TableWrapper,
-  EmptyContent
+  EmptyContent,
+  AnalyticsTimeZoneWrapper,
+  TimeZoneAndCalendar
 } from './styles'
 // import { ReportsOrderTypeFilter } from '../ReportsOrderTypeFilter'
 
@@ -130,12 +133,17 @@ const ReportsDriverOrderTimeUI = (props) => {
             </Button>
           )}
         </BrandBusinessWrapper>
+        <TimeZoneAndCalendar>
+          <AnalyticsTimeZoneWrapper>
+            <AnalyticsFilterTimeZone {...props} />
+          </AnalyticsTimeZoneWrapper>
           <CalendarWrapper>
             <AnalyticsCalendar
               handleChangeDate={handleChangeDate}
               defaultValue={filterList}
             />
           </CalendarWrapper>
+        </TimeZoneAndCalendar>
       </ButtonActionList>
       <DistancePerBrandWrapper>
         <DistanceTitleBlock active={reportData?.content?.body?.rows?.length > 0}>

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

@@ -194,3 +194,37 @@ export const EmptyContent = styled.div`
   justify-content: center;
   padding: 10px;
 `
+
+export const AnalyticsTimeZoneWrapper = styled.div`
+  width: 100%;
+  button {
+    margin-top: 5px;
+    background: ${props => props.theme.colors.secundary};
+    border-radius: 7.6px;
+    padding: 7px 15px;
+    font-size: 14px;
+    color: ${props => props.theme.colors.secundaryContrast};
+    border: none;
+  }
+
+  @media (min-width: 600px) {
+    width: fit-content;
+    margin-left: 10px;
+    ${props => props.theme.rtl && css`
+      margin-right: 10px;
+      margin-left: 0;
+    `}
+  }
+`
+
+export const TimeZoneAndCalendar = styled.div`
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+
+  @media (min-width: 600px) {
+    flex-direction: row;
+    width: fit-content;
+  }
+`

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

@@ -7,6 +7,7 @@ import { useLanguage, AdvancedReports as AdvancedReportsController } from 'order
 import { ReportsDriverGroupFilter } from '../ReportsDriverGroupFilter'
 import { ReportsDriverFilter } from '../ReportsDriverFilter'
 import { Alert, Modal } from '../../Shared'
+import { AnalyticsFilterTimeZone } from '../AnalyticsFilterTimeZone'
 import {
   DriverScheduleContainer,
   ScheduleTitle,
@@ -16,7 +17,9 @@ import {
   DistancePerBrandWrapper,
   ChartWrapper,
   EmptyContent,
-  ScheduleTitleBlock
+  ScheduleTitleBlock,
+  AnalyticsTimeZoneWrapper,
+  TimeZoneAndCalendar
 } from './styles'
 import 'chartjs-adapter-moment'
 import moment from 'moment'
@@ -175,7 +178,7 @@ const ReportsDriverScheduleUI = (props) => {
   return (
     <>
       <DriverScheduleContainer>
-        <ScheduleTitle>{t('DRIVER_SCHEDULE', 'DRIVER SCHEDULE')}</ScheduleTitle>
+        <ScheduleTitle>{t('DRIVER_SCHEDULE', 'Driver schedule')}</ScheduleTitle>
         <ButtonActionList>
           <BrandBusinessWrapper>
             <Button
@@ -189,12 +192,17 @@ const ReportsDriverScheduleUI = (props) => {
               {t('DRIVER', 'Driver')} ({filterList?.drivers_ids ? filterList?.drivers_ids.length : t('ALL', 'All')})
             </Button>
           </BrandBusinessWrapper>
-          <CalendarWrapper>
-            <AnalyticsCalendar
-              handleChangeDate={handleChangeDate}
-              defaultValue={filterList}
-            />
-          </CalendarWrapper>
+          <TimeZoneAndCalendar>
+            <AnalyticsTimeZoneWrapper>
+              <AnalyticsFilterTimeZone {...props} />
+            </AnalyticsTimeZoneWrapper>
+            <CalendarWrapper>
+              <AnalyticsCalendar
+                handleChangeDate={handleChangeDate}
+                defaultValue={filterList}
+              />
+            </CalendarWrapper>
+          </TimeZoneAndCalendar>
         </ButtonActionList>
         <DistancePerBrandWrapper>
           <ScheduleTitleBlock active={reportData?.content?.data?.length > 0}>

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

@@ -140,3 +140,37 @@ export const ScheduleTitleBlock = styled.div`
     }
   `}
 `
+
+export const AnalyticsTimeZoneWrapper = styled.div`
+  width: 100%;
+  button {
+    margin-top: 5px;
+    background: ${props => props.theme.colors.secundary};
+    border-radius: 7.6px;
+    padding: 7px 15px;
+    font-size: 14px;
+    color: ${props => props.theme.colors.secundaryContrast};
+    border: none;
+  }
+
+  @media (min-width: 600px) {
+    width: fit-content;
+    margin-left: 10px;
+    ${props => props.theme.rtl && css`
+      margin-right: 10px;
+      margin-left: 0;
+    `}
+  }
+`
+
+export const TimeZoneAndCalendar = styled.div`
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+
+  @media (min-width: 600px) {
+    flex-direction: row;
+    width: fit-content;
+  }
+`

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

@@ -8,6 +8,7 @@ import { Modal } from '../../Shared'
 import { AnalyticsBusinessFilter } from '../AnalyticsBusinessFilter'
 import { ReportsBrandFilter } from '../ReportsBrandFilter'
 import { CountryFilter } from '../CountryFilter'
+import { AnalyticsFilterTimeZone } from '../AnalyticsFilterTimeZone'
 import {
   ReportsBusinessSpendContainer,
   Title,
@@ -21,7 +22,9 @@ import {
   Tbody,
   Tfoot,
   TableWrapper,
-  EmptyContent
+  EmptyContent,
+  AnalyticsTimeZoneWrapper,
+  TimeZoneAndCalendar
 } from './styles'
 
 const ReportsDriverSpendUI = (props) => {
@@ -124,12 +127,17 @@ const ReportsDriverSpendUI = (props) => {
             </Button>
           )}
         </BrandBusinessWrapper>
+        <TimeZoneAndCalendar>
+          <AnalyticsTimeZoneWrapper>
+            <AnalyticsFilterTimeZone {...props} />
+          </AnalyticsTimeZoneWrapper>
           <CalendarWrapper>
             <AnalyticsCalendar
               handleChangeDate={handleChangeDate}
               defaultValue={filterList}
             />
           </CalendarWrapper>
+        </TimeZoneAndCalendar>
       </ButtonActionList>
       <DistancePerBrandWrapper>
         <DistanceTitleBlock active={reportData?.content?.body?.rows?.length > 0}>

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

@@ -213,3 +213,37 @@ export const EmptyContent = styled.div`
   justify-content: center;
   padding: 10px;
 `
+
+export const AnalyticsTimeZoneWrapper = styled.div`
+  width: 100%;
+  button {
+    margin-top: 5px;
+    background: ${props => props.theme.colors.secundary};
+    border-radius: 7.6px;
+    padding: 7px 15px;
+    font-size: 14px;
+    color: ${props => props.theme.colors.secundaryContrast};
+    border: none;
+  }
+
+  @media (min-width: 600px) {
+    width: fit-content;
+    margin-left: 10px;
+    ${props => props.theme.rtl && css`
+      margin-right: 10px;
+      margin-left: 0;
+    `}
+  }
+`
+
+export const TimeZoneAndCalendar = styled.div`
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+
+  @media (min-width: 600px) {
+    flex-direction: row;
+    width: fit-content;
+  }
+`

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

@@ -13,6 +13,7 @@ import Skeleton from 'react-loading-skeleton'
 import { Button } from '../../../styles'
 import { Modal } from '../../Shared'
 import { CountryFilter } from '../CountryFilter'
+import { AnalyticsFilterTimeZone } from '../AnalyticsFilterTimeZone'
 import {
   ReportsBusinessSpendContainer,
   DistancePerBrandWrapper,
@@ -26,7 +27,9 @@ import {
   Title,
   Thead,
   Tbody,
-  Tfoot
+  Tfoot,
+  AnalyticsTimeZoneWrapper,
+  TimeZoneAndCalendar
 } from './styles'
 
 const ReportsGeneralSalesUI = (props) => {
@@ -135,12 +138,17 @@ const ReportsGeneralSalesUI = (props) => {
             </Button>
           )}
         </BrandBusinessWrapper>
+        <TimeZoneAndCalendar>
+          <AnalyticsTimeZoneWrapper>
+            <AnalyticsFilterTimeZone {...props} />
+          </AnalyticsTimeZoneWrapper>
           <CalendarWrapper>
             <AnalyticsCalendar
               handleChangeDate={handleChangeDate}
               defaultValue={filterList}
             />
           </CalendarWrapper>
+        </TimeZoneAndCalendar>
       </ButtonActionList>
       <DistancePerBrandWrapper>
         <DistanceTitleBlock active={reportData?.content?.body?.rows?.length > 0}>

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

@@ -215,3 +215,37 @@ export const EmptyContent = styled.div`
   justify-content: center;
   padding: 10px;
 `
+
+export const AnalyticsTimeZoneWrapper = styled.div`
+  width: 100%;
+  button {
+    margin-top: 5px;
+    background: ${props => props.theme.colors.secundary};
+    border-radius: 7.6px;
+    padding: 7px 15px;
+    font-size: 14px;
+    color: ${props => props.theme.colors.secundaryContrast};
+    border: none;
+  }
+
+  @media (min-width: 600px) {
+    width: fit-content;
+    margin-left: 10px;
+    ${props => props.theme.rtl && css`
+      margin-right: 10px;
+      margin-left: 0;
+    `}
+  }
+`
+
+export const TimeZoneAndCalendar = styled.div`
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+
+  @media (min-width: 600px) {
+    flex-direction: row;
+    width: fit-content;
+  }
+`

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

@@ -10,6 +10,7 @@ import { ReportsBrandFilter } from '../ReportsBrandFilter'
 import { AnalyticsCalendar } from '../AnalyticsCalendar'
 import { ReportsDriverGroupFilter } from '../ReportsDriverGroupFilter'
 import { CountryFilter } from '../CountryFilter'
+import { AnalyticsFilterTimeZone } from '../AnalyticsFilterTimeZone'
 import {
   HeatMapContainer,
   Title,
@@ -18,7 +19,9 @@ import {
   CalendarWrapper,
   DistancePerBrandWrapper,
   DistanceTitleBlock,
-  WrapperMap
+  WrapperMap,
+  AnalyticsTimeZoneWrapper,
+  TimeZoneAndCalendar
 } from './styles'
 
 const ReportsHeatMapUI = (props) => {
@@ -124,12 +127,17 @@ const ReportsHeatMapUI = (props) => {
               </Button>
             )}
           </BrandBusinessWrapper>
+          <TimeZoneAndCalendar>
+            <AnalyticsTimeZoneWrapper>
+              <AnalyticsFilterTimeZone {...props} />
+            </AnalyticsTimeZoneWrapper>
             <CalendarWrapper>
               <AnalyticsCalendar
                 handleChangeDate={handleChangeDate}
                 defaultValue={filterList}
               />
             </CalendarWrapper>
+          </TimeZoneAndCalendar>
         </ButtonActionList>
         <DistancePerBrandWrapper>
           <DistanceTitleBlock active={reportData?.content?.locations?.length > 0}>

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

@@ -152,3 +152,37 @@ export const WrapperMap = styled.div`
     height: 500px;
   }
 `
+
+export const AnalyticsTimeZoneWrapper = styled.div`
+  width: 100%;
+  button {
+    margin-top: 5px;
+    background: ${props => props.theme.colors.secundary};
+    border-radius: 7.6px;
+    padding: 7px 15px;
+    font-size: 14px;
+    color: ${props => props.theme.colors.secundaryContrast};
+    border: none;
+  }
+
+  @media (min-width: 600px) {
+    width: fit-content;
+    margin-left: 10px;
+    ${props => props.theme.rtl && css`
+      margin-right: 10px;
+      margin-left: 0;
+    `}
+  }
+`
+
+export const TimeZoneAndCalendar = styled.div`
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+
+  @media (min-width: 600px) {
+    flex-direction: row;
+    width: fit-content;
+  }
+`

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

@@ -10,6 +10,8 @@ import { AnalyticsBusinessFilter } from '../AnalyticsBusinessFilter'
 import { ReportsBrandFilter } from '../ReportsBrandFilter'
 import { ReportsBarChart } from '../ReportsBarChart'
 import { CountryFilter } from '../CountryFilter'
+import { AnalyticsFilterTimeZone } from '../AnalyticsFilterTimeZone'
+
 import {
   ReportsDistanceContainer,
   Title,
@@ -23,7 +25,9 @@ import {
   Tbody,
   Tfoot,
   TableWrapper,
-  EmptyContent
+  EmptyContent,
+  AnalyticsTimeZoneWrapper,
+  TimeZoneAndCalendar
 } from './styles'
 
 const ReportsOrderDistanceUI = (props) => {
@@ -158,12 +162,17 @@ const ReportsOrderDistanceUI = (props) => {
             </Button>
           )}
         </BrandBusinessWrapper>
+        <TimeZoneAndCalendar>
+          <AnalyticsTimeZoneWrapper>
+            <AnalyticsFilterTimeZone {...props} />
+          </AnalyticsTimeZoneWrapper>
           <CalendarWrapper>
             <AnalyticsCalendar
               handleChangeDate={handleChangeDate}
               defaultValue={filterList}
             />
           </CalendarWrapper>
+        </TimeZoneAndCalendar>
       </ButtonActionList>
       <DistancePerBrandWrapper>
         <DistanceTitleBlock active={reportData?.content?.body?.rows?.length > 0}>

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

@@ -219,3 +219,37 @@ export const EmptyContent = styled.div`
   justify-content: center;
   padding: 10px;
 `
+
+export const AnalyticsTimeZoneWrapper = styled.div`
+  width: 100%;
+  button {
+    margin-top: 5px;
+    background: ${props => props.theme.colors.secundary};
+    border-radius: 7.6px;
+    padding: 7px 15px;
+    font-size: 14px;
+    color: ${props => props.theme.colors.secundaryContrast};
+    border: none;
+  }
+
+  @media (min-width: 600px) {
+    width: fit-content;
+    margin-left: 10px;
+    ${props => props.theme.rtl && css`
+      margin-right: 10px;
+      margin-left: 0;
+    `}
+  }
+`
+
+export const TimeZoneAndCalendar = styled.div`
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+
+  @media (min-width: 600px) {
+    flex-direction: row;
+    width: fit-content;
+  }
+`