ordering-ui-react-native 0.22.75 → 0.22.76-release

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

@@ -1,3 +1,5 @@
+
+
 import React, { useState, useEffect, useRef } from 'react'
 import {
   useLanguage,

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

@@ -149,10 +149,10 @@ const StoresListUI = (props: BusinessesListingParams) => {
             width={12}
             height={12}
             color={theme.colors.skyBlue}
-            style={{ marginRight: 5, marginTop: 3 }}
+            style={{ marginRight: 5 }}
           />
           <OText size={12}>
-            {t('MORE_SETTINGS_GO_TO', 'For more settings go to')}{' '}
+            {t('MORE_SETTINGS_GO_TO', 'For more settings go to ')}
           </OText>
           <TouchableOpacity onPress={() => { Linking.openURL(t('LINK_MORE_SETTINGS_GO_TO', 'https://app.ordering.co')) }}>
             <OText size={12} color={theme.colors.skyBlue}>

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

@@ -1,5 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import { View, StyleSheet, ScrollView, ActivityIndicator, Pressable } from 'react-native';
+import { _retrieveStoreData, _clearStoreData } from '../../providers/StoreUtil';
 import { useForm } from 'react-hook-form';
 import { launchImageLibrary } from 'react-native-image-picker';
 import { Placeholder, PlaceholderLine, Fade } from 'rn-placeholder';
@@ -20,6 +21,7 @@ import {
   UserData,
   EditButton,
   EnabledStatusDriver,
+  RemoveAccount
 } from './styles';
 import { LogoutButton } from '../LogoutButton';
 import { LanguageSelector } from '../LanguageSelector';
@@ -36,6 +38,8 @@ import {
   OInput,
   OModal,
 } from '../../components/shared';
+import { OAlert } from '../../../../../src/components/shared'
+
 import { sortInputFields, getTraduction } from '../../utils';
 import { ProfileParams } from '../../types';
 import { NotFoundSource } from '../NotFoundSource';
@@ -49,6 +53,7 @@ const ProfileUI = (props: ProfileParams) => {
     toggleIsEdit,
     cleanFormState,
     handleToggleAvalaibleStatusDriver,
+    handleRemoveAccount,
     isAlsea,
     isShowDriverStatus,
     navigation
@@ -62,6 +67,7 @@ const ProfileUI = (props: ProfileParams) => {
   const [{ loading }, { loadOriginalValidationFields }] = useValidationFields()
   const { errors } = useForm();
   const theme = useTheme();
+  const [confirm, setConfirm] = useState<any>({ open: false, content: null, handleOnAccept: null, id: null, title: null })
 
   const [phoneInputData, setPhoneInputData] = useState<any>({
     error: '',
@@ -76,13 +82,8 @@ const ProfileUI = (props: ProfileParams) => {
   const [phoneToShow, setPhoneToShow] = useState('');
   const [openModal, setOpenModal] = useState(false)
   const allowDriverUpdateData = user?.level !== 4 || configs?.allow_driver_update_data?.value === "1"
-  useEffect(() => {
-    if (phoneInputData.phone.cellphone) {
-      const codeNumberPhone = phoneInputData.phone.country_phone_code
-      const numberPhone = phoneInputData.phone.cellphone
-      setPhoneToShow(`(${codeNumberPhone}) ${numberPhone}`);
-    }
-  }, [phoneInputData.phone.cellphone]);
+  const allowDeleteDriverAccount = user?.level !== 4 || configs?.allow_delete_driver_account?.value === "1"
+  const isAdmin = user?.level === 0
 
   const setUserCellPhone = (isEdit = false) => {
     if (userPhoneNumber && !userPhoneNumber.includes('null') && !isEdit) {
@@ -148,6 +149,28 @@ const ProfileUI = (props: ProfileParams) => {
     });
   };
 
+  const onRemoveAccount = async () => {
+    setConfirm({
+      open: true,
+      content: [t('QUESTION_REMOVE_ACCOUNT', 'Are you sure that you want to remove your account?')],
+      title: t('ACCOUNT_ALERT', 'Account alert'),
+      handleOnAccept: () => {
+        setConfirm({ ...confirm, open: false })
+        handleRemoveAccount && handleRemoveAccount(user?.id)
+        _clearStoreData({ excludedKeys: ['isTutorial', 'language'] });
+        props?.setRootState && props?.setRootState({ isAuth: false, token: null })
+      }
+    })
+  }
+
+  useEffect(() => {
+    if (phoneInputData.phone.cellphone) {
+      const codeNumberPhone = phoneInputData.phone.country_phone_code
+      const numberPhone = phoneInputData.phone.cellphone
+      setPhoneToShow(`(${codeNumberPhone}) ${numberPhone}`);
+    }
+  }, [phoneInputData.phone.cellphone]);
+
   useEffect(() => {
     const isLoadingDriver = userState?.loadingDriver ?? true;
 
@@ -155,8 +178,8 @@ const ProfileUI = (props: ProfileParams) => {
       if (userState?.result?.error) {
         const messageError =
           userState.result.error || userState.result.error[0];
-        showToast(ToastType.Error, getTraduction(messageError, t));
-      } else {
+          showToast(ToastType.Error, typeof messageError === 'string' ? getTraduction(messageError, t) : t('CANNOT_UPDATE_AVAILABLE_STATE', 'Cannot update available state'));
+        } else {
         showToast(
           ToastType.Success,
           t('AVAILABLE_STATE_IS_UPDATED', 'Available state is updated'),
@@ -486,10 +509,11 @@ const ProfileUI = (props: ProfileParams) => {
                 handleCancelEdit={handleCancelEdit}
                 toggleIsEdit={toggleIsEdit}
                 isAlsea={isAlsea}
+                allowDriverUpdateData={allowDriverUpdateData}
               />
             </View>
           )}
-          {!validationFields.loading && !isEdit && allowDriverUpdateData && (
+          {!validationFields.loading && !isEdit && (
             <EditButton>
               <OButton
                 text={t('EDIT', 'Edit')}
@@ -544,6 +568,12 @@ const ProfileUI = (props: ProfileParams) => {
 
             <LogoutButton />
           </Actions>
+          {allowDeleteDriverAccount && (
+            <RemoveAccount disabled={isAdmin} onPress={() => onRemoveAccount()} activeOpacity={0.7}>
+              <AntDesignIcon size={16} name='close' color={theme.colors.textNormal} style={{ marginEnd: 14 }} />
+              <OText size={14} lineHeight={24} weight={'400'} style={{ opacity: isAdmin ? 0.5 : 1 }} color={theme.colors.danger500}>{t('REMOVE_ACCOUNT', 'Remove account')}</OText>
+            </RemoveAccount>
+          )}
           <OModal
             open={openModal}
             onClose={() => setOpenModal(false)}
@@ -554,6 +584,14 @@ const ProfileUI = (props: ProfileParams) => {
               <DriverSchedule schedule={user?.schedule} />
             )}
           </OModal>
+          <OAlert
+            open={confirm.open}
+            title={confirm.title}
+            content={confirm.content}
+            onAccept={confirm.handleOnAccept}
+            onCancel={() => setConfirm({ ...confirm, open: false, title: null })}
+            onClose={() => setConfirm({ ...confirm, open: false, title: null })}
+          />
         </ScrollView>
       )}
     </>

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

@@ -34,3 +34,10 @@ export const Actions = styled.View`
   justify-content: space-between;
   align-items: flex-start;
 `;
+
+export const RemoveAccount = styled.TouchableOpacity`
+	flex-direction: row;
+	justify-content: flex-start;
+	align-items: center;
+	margin-bottom: 24px;
+`

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

@@ -1,6 +1,6 @@
 import React, { useState } from 'react'
 import { useLanguage, useUtils, WebsocketStatus as WebsocketStatusController } from 'ordering-components/native'
-import { TouchableOpacity, View, StyleSheet } from 'react-native'
+import { TouchableOpacity, View, StyleSheet, Platform } from 'react-native'
 import MaterialIcon from 'react-native-vector-icons/MaterialCommunityIcons';
 import { useTheme } from 'styled-components/native'
 import RNRestart from 'react-native-restart'
@@ -37,7 +37,7 @@ const SocketStatusUI = (props: any) => {
       paddingLeft: 0,
       paddingRight: 0,
       marginBottom: 30,
-      marginTop: 30
+      marginTop: Platform.OS === 'ios' ? 60 : 30
     },
   })