ordering-ui-react-native 0.24.17 → 0.24.18

package/themes/business/src/components/Chat/styles.tsx

@@ -1,16 +1,16 @@
-import styled from 'styled-components/native';
-
-export const Wrapper = styled.View`
-  flex: 1;
-  background-color: ${(props: any) => props.theme.colors.white};
-`;
-
-export const Header = styled.ScrollView``;
-
-export const TitleHeader = styled.View`
-  margin-left: 11px;
-`;
-
-export const QuickMessageContainer = styled.ScrollView`
-  margin-top: 8px;
+import styled from 'styled-components/native';
+
+export const Wrapper = styled.View`
+  flex: 1;
+  background-color: ${(props: any) => props.theme.colors.white};
+`;
+
+export const Header = styled.ScrollView``;
+
+export const TitleHeader = styled.View`
+  margin-left: 11px;
+`;
+
+export const QuickMessageContainer = styled.ScrollView`
+  margin-top: 8px;
 `

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

@@ -1,299 +1,299 @@
-import React, { useState, useEffect } from 'react';
-import {
-  StyleSheet,
-  TouchableOpacity,
-  ScrollView,
-  View,
-  Dimensions,
-} from 'react-native';
-import MaterialIcon from 'react-native-vector-icons/MaterialIcons';
-import { Placeholder, PlaceholderLine, Fade } from 'rn-placeholder';
-import { useTheme } from 'styled-components/native';
-import {
-  Contacts as ContactsController,
-  useLanguage,
-  useUtils,
-} from 'ordering-components/native';
-import { Card, Logo, Information, Header, Badge, Stars } from './styles';
-import { NotFoundSource } from '../NotFoundSource';
-import { OIcon, OText, OButton } from '../shared';
-import { ContactParams } from '../../types';
-
-const ContactsUI = (props: ContactParams) => {
-  const {
-    contacts: { data, loading, error },
-    activeTag,
-    pagination,
-    getBusinesses,
-    getCustomers,
-    getDrivers,
-    loadMore,
-    onNavigationRedirect,
-  } = props;
-
-  const [, t] = useLanguage();
-  const theme = useTheme();
-  const [{ parseDate, optimizeImage }] = useUtils();
-
-  const [orientation, setOrientation] = useState(
-    Dimensions.get('window').width < Dimensions.get('window').height
-      ? 'Portrait'
-      : 'Landscape',
-  );
-
-  const handlePressOrder = (order: any) => {
-    const uuid = order?.id;
-    onNavigationRedirect &&
-      onNavigationRedirect('OrderMessage', { orderId: uuid });
-  };
-
-  useEffect(() => {
-    if (!loading) {
-      switch (activeTag) {
-        case 2:
-          getBusinesses && getBusinesses();
-          break;
-        case 3:
-          getCustomers && getCustomers();
-          break;
-        case 4:
-          getDrivers && getDrivers();
-          break;
-      }
-    }
-  }, [activeTag]);
-
-  Dimensions.addEventListener('change', ({ window: { width, height } }) => {
-    if (width < height) {
-      setOrientation('Portrait');
-    } else {
-      setOrientation('Landscape');
-    }
-  });
-
-  const styles = StyleSheet.create({
-    btnCard: {
-      flex: 1,
-      minHeight: 64,
-      marginBottom: 30,
-    },
-    icon: {
-      borderRadius: 7.6,
-      width: 73,
-      height: 73,
-    },
-    name: {
-      fontFamily: 'Poppins',
-      fontStyle: 'normal',
-      fontWeight: '600',
-      fontSize: 18,
-      color: theme.colors.textGray,
-    },
-    badge: {
-      fontFamily: 'Poppins',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      fontSize: 14,
-      color: theme.colors.primary,
-    },
-    star: {
-      fontFamily: 'Poppins',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      fontSize: 15,
-      color: theme.colors.unselectText,
-    },
-    order: {
-      fontFamily: 'Poppins',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      color: theme.colors.orderTypeColor,
-    },
-    btn: {
-      borderRadius: 7.6,
-      height: 44,
-      marginBottom: 40,
-      marginTop: 5,
-    },
-    btnText: {
-      color: theme.colors.white,
-      fontFamily: 'Poppins',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      fontSize: 18,
-    },
-  });
-
-  return (
-    <>
-      <ScrollView style={{ height: '80%' }}>
-        {data?.length > 0 &&
-          data?.map((contact: any) => (
-            <TouchableOpacity
-              key={contact?.id}
-              // onPress={() => handlePressOrder(contact)}
-              onPress={() => {}}
-              style={styles.btnCard}
-              activeOpacity={1}>
-              <Card key={contact?.id}>
-                <Logo>
-                  <OIcon
-                    url={optimizeImage(
-                      contact?.logo || contact?.photo,
-                      'h_300,c_limit',
-                    )}
-                    style={styles.icon}
-                  />
-                </Logo>
-
-                <Information>
-                  <Header>
-                    <OText numberOfLines={1} style={styles.name}>
-                      {contact?.name + ' ' + (contact?.lastname ?? '')}
-                    </OText>
-
-                    {contact?.unread_count > 0 && (
-                      <Badge>
-                        <OText size={14} style={styles.badge}>
-                          {contact?.unread_count}
-                        </OText>
-                      </Badge>
-                    )}
-                  </Header>
-
-                  <Stars>
-                    {[
-                      ...Array(
-                        Number.isInteger(contact?.qualification)
-                          ? contact?.qualification ?? 3
-                          : Math.floor(contact?.qualification) || 3,
-                      ),
-                    ].map((item, index) => (
-                      <MaterialIcon
-                        key={index}
-                        name="star"
-                        size={20}
-                        color={theme.colors.arrowColor}
-                      />
-                    ))}
-
-                    {[
-                      ...Array(
-                        (Number.isInteger(contact?.qualification)
-                          ? contact?.qualification ?? 3
-                          : Math.ceil(contact?.qualification) || 3) -
-                          (Number.isInteger(contact?.qualification)
-                            ? contact?.qualification ?? 3
-                            : Math.floor(contact?.qualification) || 3),
-                      ),
-                    ].map((item, index) => (
-                      <MaterialIcon
-                        key={index}
-                        name="star-half"
-                        size={20}
-                        color={theme.colors.arrowColor}
-                      />
-                    ))}
-
-                    {[
-                      ...Array(
-                        5 -
-                          (Number.isInteger(contact?.qualification)
-                            ? contact?.qualification ?? 3
-                            : Math.ceil(contact?.qualification) || 3),
-                      ),
-                    ].map((item, index) => (
-                      <MaterialIcon
-                        key={index}
-                        name="star-border"
-                        size={20}
-                        color={theme.colors.arrowColor}
-                      />
-                    ))}
-                  </Stars>
-
-                  <OText style={styles.order} numberOfLines={1} size={16}>
-                    {contact?.level === 4
-                      ? contact?.assigned_orders_count
-                      : contact?.level === 3
-                      ? contact?.assigned_orders_count || ''
-                      : ''}{' '}
-                    {t('ORDERS', 'Orders')}
-                  </OText>
-                </Information>
-              </Card>
-            </TouchableOpacity>
-          ))}
-      </ScrollView>
-
-      {!loading && data?.length === 0 && (
-        <NotFoundSource
-          content={t('NO_RESULTS_FOUND', 'Sorry, no results found')}
-          image={theme.images.general.notFound}
-          conditioned={false}
-        />
-      )}
-
-      {loading && (
-        <>
-          <View>
-            {[...Array(5)].map((item, i) => (
-              <Placeholder key={i} Animation={Fade}>
-                <View
-                  style={{
-                    width: '100%',
-                    flexDirection: 'row',
-                    marginBottom: 10,
-                  }}>
-                  <PlaceholderLine
-                    width={orientation === 'Portrait' ? 22 : 11}
-                    height={74}
-                    style={{
-                      marginRight: 20,
-                      marginBottom: 20,
-                      borderRadius: 7.6,
-                    }}
-                  />
-                  <Placeholder>
-                    <PlaceholderLine width={30} style={{ marginTop: 5 }} />
-                    <PlaceholderLine width={50} />
-                    <PlaceholderLine width={20} />
-                  </Placeholder>
-                </View>
-              </Placeholder>
-            ))}
-          </View>
-        </>
-      )}
-
-      {!loading && pagination?.currentPage < pagination?.totalPages && (
-        <OButton
-          onClick={() => loadMore && loadMore(activeTag)}
-          text={t('LOAD_MORE', 'Load more')}
-          imgRightSrc={null}
-          textStyle={styles.btnText}
-          style={styles.btn}
-          bgColor={theme.colors.primary}
-          borderColor={theme.colors.primary}
-        />
-      )}
-    </>
-  );
-};
-
-export const Contacts = (props: ContactParams) => {
-  const contactProps = {
-    ...props,
-    firstFetch: 'businesses',
-    paginationSettings: {
-      page: 1,
-      pageSize: 6,
-      controlType: 'infinity',
-    },
-    orderBy: 'name',
-    orderDirection: 'asc',
-    UIComponent: ContactsUI,
-  };
-
-  return <ContactsController {...contactProps} />;
-};
+import React, { useState, useEffect } from 'react';
+import {
+  StyleSheet,
+  TouchableOpacity,
+  ScrollView,
+  View,
+  Dimensions,
+} from 'react-native';
+import MaterialIcon from 'react-native-vector-icons/MaterialIcons';
+import { Placeholder, PlaceholderLine, Fade } from 'rn-placeholder';
+import { useTheme } from 'styled-components/native';
+import {
+  Contacts as ContactsController,
+  useLanguage,
+  useUtils,
+} from 'ordering-components/native';
+import { Card, Logo, Information, Header, Badge, Stars } from './styles';
+import { NotFoundSource } from '../NotFoundSource';
+import { OIcon, OText, OButton } from '../shared';
+import { ContactParams } from '../../types';
+
+const ContactsUI = (props: ContactParams) => {
+  const {
+    contacts: { data, loading, error },
+    activeTag,
+    pagination,
+    getBusinesses,
+    getCustomers,
+    getDrivers,
+    loadMore,
+    onNavigationRedirect,
+  } = props;
+
+  const [, t] = useLanguage();
+  const theme = useTheme();
+  const [{ parseDate, optimizeImage }] = useUtils();
+
+  const [orientation, setOrientation] = useState(
+    Dimensions.get('window').width < Dimensions.get('window').height
+      ? 'Portrait'
+      : 'Landscape',
+  );
+
+  const handlePressOrder = (order: any) => {
+    const uuid = order?.id;
+    onNavigationRedirect &&
+      onNavigationRedirect('OrderMessage', { orderId: uuid });
+  };
+
+  useEffect(() => {
+    if (!loading) {
+      switch (activeTag) {
+        case 2:
+          getBusinesses && getBusinesses();
+          break;
+        case 3:
+          getCustomers && getCustomers();
+          break;
+        case 4:
+          getDrivers && getDrivers();
+          break;
+      }
+    }
+  }, [activeTag]);
+
+  Dimensions.addEventListener('change', ({ window: { width, height } }) => {
+    if (width < height) {
+      setOrientation('Portrait');
+    } else {
+      setOrientation('Landscape');
+    }
+  });
+
+  const styles = StyleSheet.create({
+    btnCard: {
+      flex: 1,
+      minHeight: 64,
+      marginBottom: 30,
+    },
+    icon: {
+      borderRadius: 7.6,
+      width: 73,
+      height: 73,
+    },
+    name: {
+      fontFamily: 'Poppins',
+      fontStyle: 'normal',
+      fontWeight: '600',
+      fontSize: 18,
+      color: theme.colors.textGray,
+    },
+    badge: {
+      fontFamily: 'Poppins',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      fontSize: 14,
+      color: theme.colors.primary,
+    },
+    star: {
+      fontFamily: 'Poppins',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      fontSize: 15,
+      color: theme.colors.unselectText,
+    },
+    order: {
+      fontFamily: 'Poppins',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      color: theme.colors.orderTypeColor,
+    },
+    btn: {
+      borderRadius: 7.6,
+      height: 44,
+      marginBottom: 40,
+      marginTop: 5,
+    },
+    btnText: {
+      color: theme.colors.white,
+      fontFamily: 'Poppins',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      fontSize: 18,
+    },
+  });
+
+  return (
+    <>
+      <ScrollView style={{ height: '80%' }}>
+        {data?.length > 0 &&
+          data?.map((contact: any) => (
+            <TouchableOpacity
+              key={contact?.id}
+              // onPress={() => handlePressOrder(contact)}
+              onPress={() => {}}
+              style={styles.btnCard}
+              activeOpacity={1}>
+              <Card key={contact?.id}>
+                <Logo>
+                  <OIcon
+                    url={optimizeImage(
+                      contact?.logo || contact?.photo,
+                      'h_300,c_limit',
+                    )}
+                    style={styles.icon}
+                  />
+                </Logo>
+
+                <Information>
+                  <Header>
+                    <OText numberOfLines={1} style={styles.name}>
+                      {contact?.name + ' ' + (contact?.lastname ?? '')}
+                    </OText>
+
+                    {contact?.unread_count > 0 && (
+                      <Badge>
+                        <OText size={14} style={styles.badge}>
+                          {contact?.unread_count}
+                        </OText>
+                      </Badge>
+                    )}
+                  </Header>
+
+                  <Stars>
+                    {[
+                      ...Array(
+                        Number.isInteger(contact?.qualification)
+                          ? contact?.qualification ?? 3
+                          : Math.floor(contact?.qualification) || 3,
+                      ),
+                    ].map((item, index) => (
+                      <MaterialIcon
+                        key={index}
+                        name="star"
+                        size={20}
+                        color={theme.colors.arrowColor}
+                      />
+                    ))}
+
+                    {[
+                      ...Array(
+                        (Number.isInteger(contact?.qualification)
+                          ? contact?.qualification ?? 3
+                          : Math.ceil(contact?.qualification) || 3) -
+                          (Number.isInteger(contact?.qualification)
+                            ? contact?.qualification ?? 3
+                            : Math.floor(contact?.qualification) || 3),
+                      ),
+                    ].map((item, index) => (
+                      <MaterialIcon
+                        key={index}
+                        name="star-half"
+                        size={20}
+                        color={theme.colors.arrowColor}
+                      />
+                    ))}
+
+                    {[
+                      ...Array(
+                        5 -
+                          (Number.isInteger(contact?.qualification)
+                            ? contact?.qualification ?? 3
+                            : Math.ceil(contact?.qualification) || 3),
+                      ),
+                    ].map((item, index) => (
+                      <MaterialIcon
+                        key={index}
+                        name="star-border"
+                        size={20}
+                        color={theme.colors.arrowColor}
+                      />
+                    ))}
+                  </Stars>
+
+                  <OText style={styles.order} numberOfLines={1} size={16}>
+                    {contact?.level === 4
+                      ? contact?.assigned_orders_count
+                      : contact?.level === 3
+                      ? contact?.assigned_orders_count || ''
+                      : ''}{' '}
+                    {t('ORDERS', 'Orders')}
+                  </OText>
+                </Information>
+              </Card>
+            </TouchableOpacity>
+          ))}
+      </ScrollView>
+
+      {!loading && data?.length === 0 && (
+        <NotFoundSource
+          content={t('NO_RESULTS_FOUND', 'Sorry, no results found')}
+          image={theme.images.general.notFound}
+          conditioned={false}
+        />
+      )}
+
+      {loading && (
+        <>
+          <View>
+            {[...Array(5)].map((item, i) => (
+              <Placeholder key={i} Animation={Fade}>
+                <View
+                  style={{
+                    width: '100%',
+                    flexDirection: 'row',
+                    marginBottom: 10,
+                  }}>
+                  <PlaceholderLine
+                    width={orientation === 'Portrait' ? 22 : 11}
+                    height={74}
+                    style={{
+                      marginRight: 20,
+                      marginBottom: 20,
+                      borderRadius: 7.6,
+                    }}
+                  />
+                  <Placeholder>
+                    <PlaceholderLine width={30} style={{ marginTop: 5 }} />
+                    <PlaceholderLine width={50} />
+                    <PlaceholderLine width={20} />
+                  </Placeholder>
+                </View>
+              </Placeholder>
+            ))}
+          </View>
+        </>
+      )}
+
+      {!loading && pagination?.currentPage < pagination?.totalPages && (
+        <OButton
+          onClick={() => loadMore && loadMore(activeTag)}
+          text={t('LOAD_MORE', 'Load more')}
+          imgRightSrc={null}
+          textStyle={styles.btnText}
+          style={styles.btn}
+          bgColor={theme.colors.primary}
+          borderColor={theme.colors.primary}
+        />
+      )}
+    </>
+  );
+};
+
+export const Contacts = (props: ContactParams) => {
+  const contactProps = {
+    ...props,
+    firstFetch: 'businesses',
+    paginationSettings: {
+      page: 1,
+      pageSize: 6,
+      controlType: 'infinity',
+    },
+    orderBy: 'name',
+    orderDirection: 'asc',
+    UIComponent: ContactsUI,
+  };
+
+  return <ContactsController {...contactProps} />;
+};