ordering-ui-react-native 0.17.98 → 0.17.99

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-react-native",
-  "version": "0.17.98",
+  "version": "0.17.99",
   "description": "Reusable components made in react native",
   "main": "src/index.tsx",
   "author": "ordering.inc",

package/themes/business/src/components/PreviousOrders/index.tsx

@@ -93,7 +93,7 @@ export const PreviousOrders = (props: any) => {
                   imgRightSrc={null}
                   style={{ borderRadius: 7, height: 40 }}
                   parentStyle={{ width: '45%' }}
-                  textStyle={{ color: theme.colors.dangerText }}
+                  textStyle={{ color: theme.colors.white }}
                 />
                 <OButton
                   text={t('ACCEPT', 'Accept')}
@@ -103,7 +103,7 @@ export const PreviousOrders = (props: any) => {
                   imgRightSrc={null}
                   style={{ borderRadius: 7, height: 40 }}
                   parentStyle={{ width: '45%' }}
-                  textStyle={{ color: theme.colors.successText }}
+                  textStyle={{ color: theme.colors.white }}
                 />
               </>
             )}

package/themes/original/src/components/BusinessProductsListing/index.tsx

@@ -448,6 +448,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
                 professionals={business?.professionals}
                 professionalSelected={professionalSelected}
                 handleChangeProfessionalSelected={handleChangeProfessionalSelected}
+                handleUpdateProfessionals={handleUpdateProfessionals}
               />
             </ProfessionalFilterWrapper>
           )}

package/themes/original/src/components/ProfessionalFilter/SingleProfessionalCard/index.tsx

@@ -0,0 +1,108 @@
+import React from 'react'
+import {
+  useSession,
+  useUtils,
+  SingleProfessionalCard as SingleProfessionalCardController
+} from 'ordering-components/native'
+import { useTheme } from 'styled-components/native'
+import { StyleSheet, TouchableOpacity, View } from 'react-native'
+import FastImage from 'react-native-fast-image'
+import { OIcon, OText } from '../../shared'
+import IconAntDesign from 'react-native-vector-icons/AntDesign';
+
+const SingleProfessionalCardUI = (props) => {
+  const {
+    professional,
+    handleFavoriteProfessional,
+    active,
+    handleProfessionalClick
+  } = props
+
+  const theme = useTheme()
+  const [{ auth }] = useSession()
+  const [{ optimizeImage }] = useUtils()
+
+  const handleChangeFavorite = () => {
+    if (auth) {
+      handleFavoriteProfessional && handleFavoriteProfessional(!professional?.favorite)
+    }
+  }
+
+  const styles = StyleSheet.create({
+    professionalItem: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      borderRadius: 7.6,
+      padding: 11,
+      borderWidth: 1,
+      marginRight: 12,
+      minHeight: 64
+    },
+		photoStyle: {
+			width: 42,
+			height: 42,
+			borderRadius: 7.6
+		},
+    favoriteIconStyle: {
+			width: 16,
+			height: 16,
+		},
+  })
+
+  return (
+    <TouchableOpacity
+      onPress={() => handleProfessionalClick(professional)}
+    >
+      <View
+        style={{
+          ...styles.professionalItem,
+          borderColor: active
+            ? theme.colors.primary
+            : theme.colors.border 
+        }}
+      >
+        {professional?.photo ? (
+          <FastImage
+            style={styles.photoStyle}
+            source={{
+              uri: optimizeImage(professional?.photo, 'h_250,c_limit'),
+              priority: FastImage.priority.normal,
+            }}
+            resizeMode={FastImage.resizeMode.cover}
+          />
+        ) : (
+          <OIcon
+            src={theme?.images?.general?.user}
+            cover={false}
+            style={styles.photoStyle}
+          />
+        )}
+        <View style={{ marginLeft: 12 }}>
+          <OText
+            size={12}
+            weight={'400'}
+          >
+            {professional?.name} {professional?.lastname}
+          </OText>
+
+          <TouchableOpacity
+            onPress={() => handleChangeFavorite()}
+          >
+            {professional?.favorite
+              ? <IconAntDesign name='heart' size={16} color={theme.colors.danger5} />
+              : <IconAntDesign name='hearto' size={16} color={theme.colors.danger5} />
+            }
+          </TouchableOpacity>
+        </View>
+      </View>
+    </TouchableOpacity>
+  )
+}
+
+export const SingleProfessionalCard = (props) => {
+  const singleProfessionalCardProps = {
+    ...props,
+    UIComponent: SingleProfessionalCardUI
+  }
+  return <SingleProfessionalCardController {...singleProfessionalCardProps} />
+}

package/themes/original/src/components/ProfessionalFilter/index.tsx

@@ -1,21 +1,21 @@
 import React, { useState } from 'react'
-import { ScrollView, TouchableOpacity, View, StyleSheet, Platform } from 'react-native'
-import { useUtils, useLanguage } from 'ordering-components/native'
+import { ScrollView, TouchableOpacity, View, StyleSheet } from 'react-native'
+import { useLanguage } from 'ordering-components/native'
 import { useTheme } from 'styled-components/native'
-import FastImage from 'react-native-fast-image'
-import { OIcon, OText, OModal } from '../shared'
+import { OText, OModal } from '../shared'
 import { ProfessionalProfile } from '../ProfessionalProfile'
 import { ProfessionalFilterParams } from '../../types'
+import { SingleProfessionalCard } from './SingleProfessionalCard'
 
 export const ProfessionalFilter = (props: ProfessionalFilterParams) => {
   const {
     professionals,
     professionalSelected,
-		handleChangeProfessionalSelected
+		handleChangeProfessionalSelected,
+    handleUpdateProfessionals
   } = props
 
   const theme = useTheme()
-  const [{ optimizeImage }] = useUtils()
   const [, t] = useLanguage()
   const [open, setOpen] = useState(false)
   const [currentProfessional, setCurrentProfessional] = useState(null)
@@ -30,6 +30,11 @@ export const ProfessionalFilter = (props: ProfessionalFilterParams) => {
     setOpen(false)
   }
 
+  const onUpdateProfessionals = (id, changes) => {
+    const updatedProfessional = professionals.find(professional => professional.id === id)
+    handleUpdateProfessionals({ ...updatedProfessional, ...changes })
+  }
+
   const styles = StyleSheet.create({
     professionalItem: {
       flexDirection: 'row',
@@ -39,12 +44,7 @@ export const ProfessionalFilter = (props: ProfessionalFilterParams) => {
       borderWidth: 1,
       marginRight: 12,
       minHeight: 64
-    },
-		photoStyle: {
-			width: 42,
-			height: 42,
-			borderRadius: 7.6
-		}
+    }
   })
 
   return (
@@ -73,44 +73,14 @@ export const ProfessionalFilter = (props: ProfessionalFilterParams) => {
             </OText>
           </View>
         </TouchableOpacity>
-        {professionals.map((professional: any, i: number) => (
-          <TouchableOpacity
-            key={i}
-            onPress={() => handleOpenProfile(professional)}
-          >
-            <View
-              style={{
-                ...styles.professionalItem,
-                borderColor: (professional?.id === professionalSelected?.id)
-                  ? theme.colors.primary
-                  : theme.colors.border 
-              }}
-            >
-              {professional?.photo ? (
-                <FastImage
-                  style={styles.photoStyle}
-                  source={{
-                    uri: optimizeImage(professional?.photo, 'h_250,c_limit'),
-                    priority: FastImage.priority.normal,
-                  }}
-                  resizeMode={FastImage.resizeMode.cover}
-                />
-              ) : (
-                <OIcon
-                  src={theme?.images?.general?.user}
-                  cover={false}
-                  style={styles.photoStyle}
-                />
-              )}
-              <OText
-                size={12}
-                style={{ marginLeft: 12 }}
-                weight={'400'}
-              >
-                {professional?.name} {professional?.lastname}
-              </OText>
-            </View>
-          </TouchableOpacity>
+        {professionals.map((professional: any) => (
+          <SingleProfessionalCard
+            key={professional.id}
+            professional={professional}
+            active={professional?.id === professionalSelected?.id}
+            handleProfessionalClick={handleOpenProfile}
+            handleUpdateProfessionals={onUpdateProfessionals}
+          />
         ))}
       </ScrollView>
       <OModal

package/themes/original/src/components/ProfessionalProfile/index.tsx

@@ -147,7 +147,7 @@ export const ProfessionalProfile = (props: ProfessionalProfileParams) => {
   }
 
   useEffect(() => {
-    if (selectDate === null) return
+    if (selectDate === null || !professional?.schedule) return
     const _times = getTimes(selectDate, professional)
     setTimeList(_times)
   }, [selectDate, professional])

package/themes/original/src/components/ServiceForm/index.tsx

@@ -117,16 +117,24 @@ const ServiceFormUI = (props: ServiceFormParams) => {
   })
 
   const isBusyTime = (professional: any) => {
-    if (professional?.busy_times?.length === 0 || !dateSelected) return false
+    if (!dateSelected) return false
+    const startDay = moment(dateSelected).utc().format('d')
+    const isStartScheduleEnabled = professional?.schedule?.[startDay]?.enabled
     const duration = product?.duration ?? 0
+    const endDay = moment(dateSelected).add(duration - 1, 'minutes').utc().format('d')
+    const isEndScheduleEnabled = professional?.schedule?.[endDay]?.enabled
+    if (!isStartScheduleEnabled || !isEndScheduleEnabled) return true
+
+    if (professional?.busy_times?.length === 0) return false
+  
     const busyTimes = isCartProduct
       ? professional?.busy_times.filter((item: any) => !(item.start === productCart?.calendar_event?.start && item.end === productCart?.calendar_event?.end))
       : [...professional?.busy_times]
     const valid = busyTimes.some((item: any) => {
       return (moment.utc(item?.start).local().valueOf() <= moment(dateSelected).valueOf() &&
-        moment(dateSelected).valueOf() <= moment.utc(item?.end).local().valueOf()) ||
+        moment(dateSelected).valueOf() < moment.utc(item?.end).local().valueOf()) ||
         (moment.utc(item?.start).local().valueOf() <= moment(dateSelected).add(duration, 'minutes').valueOf() &&
-        moment(dateSelected).add(duration, 'minutes').valueOf() <= moment.utc(item?.end).local().valueOf())
+        moment(dateSelected).add(duration, 'minutes').valueOf() < moment.utc(item?.end).local().valueOf())
     })
     return valid
   }

package/themes/original/src/types/index.tsx

@@ -778,7 +778,8 @@ export interface ServiceFormParams {
 export interface ProfessionalFilterParams {
 	professionals?: any,
 	professionalSelected?: any,
-	handleChangeProfessionalSelected: any
+	handleChangeProfessionalSelected: any,
+	handleUpdateProfessionals?: any
 }
 
 export interface ProfessionalProfileParams {