@eohjsc/react-native-smart-city 0.2.93 → 0.2.96

package/src/commons/Sharing/RowMember.js

@@ -1,13 +1,12 @@
 import React, { memo, useMemo } from 'react';
-import { StyleSheet, View } from 'react-native';
-import { IconOutline } from '@ant-design/icons-react-native';
+import { StyleSheet, View, TouchableOpacity, Image } from 'react-native';
 import { useTranslations } from '../../hooks/Common/useTranslations';
-
 import { Colors } from '../../configs';
 import Text from '../../commons/Text';
 import { shortEmailName } from '../../utils/Utils';
-
-import BtnRemoveMember from './BtnRemoveMember';
+import { CircleView } from '../CircleView';
+import { useNavigation } from '@react-navigation/native';
+import Routes from '../../utils/Route';
 
 const arrColor = [
   Colors.GeekBlue3,
@@ -19,46 +18,88 @@ const arrColor = [
   Colors.Cyan2,
 ];
 const RowMember = memo(
-  ({ member, index, ownerId, currentUserId, onPressRemove }) => {
+  ({
+    member,
+    index,
+    ownerId,
+    unit,
+    currentUserId,
+    type,
+    leftIcon = true,
+    rightComponent = true,
+  }) => {
     const t = useTranslations();
-    const canRemoveMember = useMemo(
-      () => ownerId === currentUserId && member.id !== ownerId,
-      [currentUserId, member.id, ownerId]
-    );
+    const { navigate } = useNavigation();
     const [role, roleColor] = useMemo(
       () =>
-        member.id === ownerId
+        member?.id === ownerId
           ? [t('owner'), Colors.Primary]
-          : member.id === currentUserId
-          ? [t('me'), Colors.Gray6]
-          : ['', ''],
-      [currentUserId, member.id, ownerId, t]
+          : member?.id === currentUserId
+          ? [t('me'), Colors.Primary]
+          : [t('member'), Colors.Gray6],
+      [currentUserId, member?.id, ownerId, t]
     );
-    const paddingBottom = role ? 16 : 23;
+    const firstWordsInName = useMemo(() => {
+      const wordTemp = member?.name || shortEmailName(member?.email) || '';
+      return wordTemp?.charAt();
+    }, [member?.email, member?.name]);
+
     if (member?.id === ownerId && member?.share_id) {
       return null;
     }
+    const circleColorTypes = {
+      primary: 'primary',
+      disable: 'disable',
+      noneBG: 'none',
+    };
+    const circleColor = type
+      ? circleColorTypes[type]
+      : arrColor[index % arrColor.length];
+
+    const onPressInfo = () => {
+      navigate(Routes.UnitMemberInformation, {
+        member,
+        ownerId,
+        unit,
+      });
+    };
     return (
       <View style={styles.rowContainer}>
-        <View
-          style={[
-            styles.iconContainer,
-            { backgroundColor: arrColor[index % arrColor.length] },
-          ]}
-        >
-          <IconOutline name={'user'} size={20} color={Colors.White} />
-        </View>
-        <View style={[styles.infoContainer, { paddingBottom: paddingBottom }]}>
-          <Text style={styles.textName}>
-            {member?.name || shortEmailName(member.email) || ''}
-          </Text>
-          {!!role && (
-            <Text style={[styles.textRole, { color: roleColor }]}>{role}</Text>
-          )}
-          {canRemoveMember && (
-            <BtnRemoveMember onPressRemove={onPressRemove} member={member} />
-          )}
-        </View>
+        <TouchableOpacity onPress={onPressInfo} disabled={type === 'disable'}>
+          <View style={styles.Border}>
+            {!!leftIcon && (
+              <View style={styles.paddingLeft16}>
+                {member?.avatar ? (
+                  <Image
+                    source={{ uri: member?.avatar }}
+                    style={styles.avatar}
+                  />
+                ) : (
+                  <CircleView size={40} backgroundColor={circleColor} center>
+                    <Text color={Colors.White}>{firstWordsInName}</Text>
+                  </CircleView>
+                )}
+              </View>
+            )}
+            <View style={styles.columnFlex}>
+              <Text style={styles.titleName}>
+                {member?.name || shortEmailName(member?.email) || ''}
+              </Text>
+              {member?.phone_number && (
+                <Text style={styles.status}> {member?.phone_number}</Text>
+              )}
+            </View>
+            {!!rightComponent && (
+              <View style={styles.endFlex}>
+                {!!role && (
+                  <Text style={[styles.textRole, { color: roleColor }]}>
+                    {role}
+                  </Text>
+                )}
+              </View>
+            )}
+          </View>
+        </TouchableOpacity>
       </View>
     );
   }
@@ -68,9 +109,7 @@ export default RowMember;
 
 const styles = StyleSheet.create({
   rowContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    paddingHorizontal: 16,
+    flex: 1,
   },
   iconContainer: {
     alignItems: 'center',
@@ -107,4 +146,55 @@ const styles = StyleSheet.create({
   textCenter: {
     alignSelf: 'center',
   },
+  columnFlex: {
+    paddingLeft: 16,
+    justifyContent: 'center',
+    flexDirection: 'column',
+  },
+  rowFlex: {
+    flexDirection: 'row',
+  },
+  endFlex: {
+    flex: 1,
+    justifyContent: 'flex-start',
+    alignItems: 'flex-end',
+    paddingRight: 16,
+  },
+  Border: {
+    display: 'flex',
+    width: '100%',
+    borderWidth: 0,
+    borderColor: Colors.Gray4,
+    borderBottomWidth: 1,
+    borderStyle: 'solid',
+    flexDirection: 'row',
+    paddingTop: 16,
+    paddingBottom: 16,
+  },
+  titleName: {
+    fontSize: 16,
+    lineHeight: 24,
+    fontStyle: 'normal',
+    fontWeight: '400',
+    color: Colors.Gray9,
+  },
+  status: {
+    fontSize: 12,
+    lineHeight: 20,
+    fontStyle: 'normal',
+    fontWeight: '400',
+    color: Colors.Gray7,
+  },
+  container: {
+    paddingTop: 0,
+  },
+  paddingLeft16: {
+    paddingLeft: 16,
+  },
+  avatar: {
+    height: 40,
+    width: 40,
+    borderRadius: 40,
+    backgroundColor: Colors.Primary,
+  },
 });

package/src/commons/Sharing/__test__/MemberList.test.js

@@ -27,7 +27,7 @@ describe('MemberList', () => {
     });
     const instance = tree.root;
     const textInputs = instance.findAllByType(Text);
-    expect(textInputs.length).toBe(4);
+    expect(textInputs.length).toBe(5);
   });
   test('MemberList snapshot id dataMember !== ownerId', () => {
     const dataMember = [{ id: 1, name: 'CEO' }];
@@ -36,7 +36,7 @@ describe('MemberList', () => {
     });
     const instance = tree.root;
     const textInputs = instance.findAllByType(Text);
-    expect(textInputs.length).toBe(3);
+    expect(textInputs.length).toBe(5);
   });
   test('MemberList snapshot id dataMember === currentUserId', () => {
     const dataMember = [{ id: 1, name: 'CEO' }];
@@ -45,7 +45,7 @@ describe('MemberList', () => {
     });
     const instance = tree.root;
     const textInputs = instance.findAllByType(Text);
-    expect(textInputs.length).toBe(4);
+    expect(textInputs.length).toBe(5);
   });
   test('MemberList dataMember null', () => {
     const dataMember = [];

package/src/commons/Sharing/__test__/RowMember.test.js

@@ -26,8 +26,8 @@ describe('RowMember', () => {
     });
     const instance = tree.root;
     const textInputs = instance.findAllByType(Text);
-    expect(textInputs.length).toBe(4);
-    expect(textInputs[0].props.children).toEqual('CEO');
+    expect(textInputs.length).toBe(5);
+    expect(textInputs[1].props.children).toEqual('CEO');
   });
   test('RowMember owner dont have name show start of email ', () => {
     const dataMember = { id: 1, name: '', email: 'abc@gmail.com' };
@@ -36,7 +36,7 @@ describe('RowMember', () => {
     });
     const instance = tree.root;
     const textInputs = instance.findAllByType(Text);
-    expect(textInputs.length).toBe(4);
-    expect(textInputs[0].props.children).toEqual('abc');
+    expect(textInputs.length).toBe(5);
+    expect(textInputs[1].props.children).toEqual('abc');
   });
 });

package/src/configs/API.js

@@ -39,6 +39,8 @@ const API = {
       SCConfig.apiRoot + `/property_manager/units/${id}/add_gateway/`,
     SENSORS_STATUS: (id) =>
       SCConfig.apiRoot + `/property_manager/units/${id}/sensors_status/`,
+    CHANGE_OWNER: (id) =>
+      SCConfig.apiRoot + `/property_manager/units/${id}/change_owner/`,
     FAVOURITE_DEVICES: (id) =>
       SCConfig.apiRoot + `/property_manager/units/${id}/favourite_devices/`,
   },
@@ -137,9 +139,9 @@ const API = {
     CHECK_SEND_EMAIL: () =>
       SCConfig.apiRoot + '/connection_manager/googlehome/check_send_email/',
   },
-  POWER_CONSUME: {
+  VALUE_CONSUME: {
     DISPLAY_HISTORY: () =>
-      SCConfig.apiRoot + '/property_manager/power_consume/display_history/',
+      SCConfig.apiRoot + '/property_manager/value_consume/display_history/',
   },
   SHARE: {
     UNITS: () => SCConfig.apiRoot + '/property_manager/sharing/units/',
@@ -150,6 +152,12 @@ const API = {
     UNITS_MEMBER_DETAIL: (id, shareId) =>
       SCConfig.apiRoot +
       `/property_manager/sharing/units/${id}/members/${shareId}/`,
+    UNIT_MEMBER_INFO: (unit_id, member_id) =>
+      SCConfig.apiRoot +
+      `/property_manager/sharing/units/${unit_id}/member/${member_id}/information/`,
+    UNIT_MEMBER_SHARE_DEVICE: (unit_id, member_id) =>
+      SCConfig.apiRoot +
+      `/property_manager/sharing/units/${unit_id}/member/${member_id}/shared_devices/`,
     SHARE: () => SCConfig.apiRoot + '/property_manager/sharing/share/',
   },
   EMERGENCY: {
@@ -157,6 +165,8 @@ const API = {
   },
   EMERGENCY_BUTTON: {
     CREATE_CONTACT: () => SCConfig.apiRoot + '/emergency_button/contacts/',
+    CREATE_BATCH: () =>
+      SCConfig.apiRoot + '/emergency_button/contacts/create_batch/',
     CONTACTS: () => SCConfig.apiRoot + '/emergency_button/contacts/',
     REMOVE_CONTACTS: (id) =>
       SCConfig.apiRoot + `/emergency_button/contacts/${id}/`,

package/src/configs/Colors.js

@@ -126,6 +126,7 @@ export const Colors = {
   BlackTransparent1: 'rgba(0, 0, 0, 0.1)',
   BlackTransparent2: 'rgba(0, 0, 0, 0.2)',
   BlackTransparent3: 'rgba(0, 0, 0, 0.3)',
+  BlackTransparent3_5: 'rgba(0, 0, 0, 0.35)',
   BlackTransparent4: 'rgba(0, 0, 0, 0.4)',
   BlackTransparent5: 'rgba(0, 0, 0, 0.5)',
   BlackTransparent6: 'rgba(0, 0, 0, 0.6)',

package/src/configs/Constants.js

@@ -217,6 +217,10 @@ export const TESTID = {
   MY_UNIT_NO_UNIT: 'MY_UNIT_NO_UNIT',
   ITEM_UNIT: 'ITEM_UNIT',
 
+  //member list
+  SHARING_MEMBER: 'SHARING_MEMBER',
+  REMOVE_MEMBER: 'REMOVE_MEMBER',
+
   // SmartTiviTemplate
   SMART_TIVI_TEMPLATE: {
     BIG_BUTTON: 'BIG_BUTTON',
@@ -309,6 +313,10 @@ export const TESTID = {
   BUTTON_SELECT_VISA: 'BUTTON_SELECT_VISA',
   BUTTON_SELECT_MASTER_CARD: 'BUTTON_SELECT_MASTER_CARD',
 
+  //Enter Password
+  ENTER_PASSWORD_TEXT_INPUT_PASSWORD: 'ENTER_PASSWORD_TEXT_INPUT_PASSWORD',
+  ENTER_PASSWORD_BUTTON_DONE: 'ENTER_PASSWORD_BUTTON_DONE',
+
   // Map Dashboard
   PARKING_MARKER: 'PARKING_MARKER',
 
@@ -424,6 +432,8 @@ export const TESTID = {
   ITEM_QUICK_ACTION_PRESS: 'ITEM_QUICK_ACTION_PRESS',
   TIME_COUNT_DOWN_TEXT: 'TIME_COUNT_DOWN_TEXT',
   ACTION_ITEM: 'ACTION_ITEM',
+  // Sensor Item
+  TEXT_SENSOR_ITEM: 'TEXT_SENSOR_ITEM',
 
   // DeviceInfo
   DEVICE_INFO_BATTERY: 'DEVICE_INFO_BATTERY',
@@ -687,6 +697,9 @@ export const TESTID = {
   BUTTON_YOUR_LOCATION: 'BUTTON_YOUR_LOCATION',
   BUTTON_CHOOSE_ON_MAP: 'BUTTON_CHOOSE_ON_MAP',
 
+  //searchBox
+  ON_FOCUS_SEARCH_B0X: 'ON_FOCUS_SEARCH_B0X',
+
   // MoveToAnotherSubUnit
   ROW_SUB_UNIT: 'ROW_SUB_UNIT',
 

package/src/hooks/Common/useSensorsStatus.js

@@ -1,5 +1,6 @@
-import { useState, useEffect, useRef } from 'react';
+import { useState, useEffect, useRef, useCallback } from 'react';
 import { useIsFocused } from '@react-navigation/native';
+import { throttle } from 'lodash';
 import { axiosGet } from '../../utils/Apis/axios';
 import { API } from '../../configs';
 
@@ -9,35 +10,44 @@ const useSensorsStatus = (unit, sensors) => {
   const [sensorsStatus, setSensorsStatus] = useState([]);
   const [serverDown, setServerDown] = useState(false);
 
-  useEffect(() => {
-    if (isFocused) {
-      const getSensorsStatus = async () => {
-        const params = new URLSearchParams();
-        if (sensors?.length > 0) {
-          sensors.forEach((sensor) => {
-            params.append('sensors', sensor.id);
-          });
-          const { success, data, resp_status } = await axiosGet(
-            API.UNIT.SENSORS_STATUS(unit.id),
-            {
-              params: params,
-            }
-          );
-          if (success) {
-            setSensorsStatus(data);
-            setServerDown(false);
-          } else if (resp_status >= 500) {
-            setServerDown(true);
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  const getSensorsStatus = useCallback(
+    throttle(async (unit, sensors) => {
+      const params = new URLSearchParams();
+      if (sensors?.length > 0) {
+        sensors.forEach((sensor) => {
+          params.append('sensors', sensor.id);
+        });
+        const { success, data, resp_status } = await axiosGet(
+          API.UNIT.SENSORS_STATUS(unit.id),
+          {
+            params: params,
           }
+        );
+        if (success) {
+          setSensorsStatus(data);
+          setServerDown(false);
+        } else if (resp_status > 500) {
+          setServerDown(true);
         }
-      };
-      const updateInterval = setInterval(getSensorsStatus, 5000);
+      }
+    }, 3000),
+    []
+  );
+
+  useEffect(() => {
+    if (isFocused) {
+      getSensorsStatus(unit, sensors);
+      const updateInterval = setInterval(
+        () => getSensorsStatus(unit, sensors),
+        5000
+      );
       intervalSensorStatus.current = updateInterval;
       return () => clearInterval(updateInterval);
     } else {
       clearInterval(intervalSensorStatus.current);
     }
-  }, [isFocused, sensors, unit.id]);
+  }, [isFocused, getSensorsStatus, unit, sensors]);
 
   const getStatus = (sensor) => {
     sensorsStatus.find((s) => s.id === sensor.id);

package/src/navigations/UnitStack.js

@@ -49,6 +49,8 @@ import SetUpSensor from '../screens/AddNewAction/SetupSensor';
 import EditDevice from '../screens/Device/EditDevice/index';
 import EmergencySetting from '../screens/EmergencySetting';
 import ConfirmUnitDeletion from '../screens/ConfirmUnitDeletion';
+import InfoMemberUnit from '../screens/Sharing/InfoMemberUnit';
+import EnterPassword from '../screens/EnterPassword';
 import { HanetCameraStack } from './HanetCameraStack';
 
 import { axiosGet } from '../utils/Apis/axios';
@@ -268,6 +270,20 @@ export const UnitStack = memo((props) => {
           headerShown: false,
         }}
       />
+      <Stack.Screen
+        name={Route.UnitMemberInformation}
+        component={InfoMemberUnit}
+        options={{
+          headerShown: false,
+        }}
+      />
+      <Stack.Screen
+        name={Route.EnterPassword}
+        component={EnterPassword}
+        options={{
+          headerShown: false,
+        }}
+      />
       <Stack.Screen
         name={Route.DeviceInfo}
         component={DeviceInfo}

package/src/screens/AddCommon/SelectSubUnit.js

@@ -85,6 +85,7 @@ const AddCommonSelectSubUnit = ({ route }) => {
           station: subUnits[selectedIndex]?.id,
           unit_name: unit?.name,
           ...route.params,
+          isNewFlow: false,
         });
         break;
       case 'AddHassiDevice':

package/src/screens/AddCommon/__test__/SelectSubUnit.test.js

@@ -133,6 +133,8 @@ describe('Test SelectSubUnit container', () => {
           expect(mockedNavigate).toBeCalledWith('ScanChipQR', {
             addType: 'AddNewGateway',
             station: undefined,
+            isNewFlow: false,
+            unit_name: undefined,
           });
           break;
         case 'AddHassiDevice':

package/src/screens/AddNewGateway/PlugAndPlay/ConnectWifiWarning.js

@@ -11,7 +11,6 @@ import {
   Text,
   PermissionsAndroid,
   Platform,
-  ActivityIndicator,
 } from 'react-native';
 import WifiManager from 'react-native-wifi-reborn';
 import { useNavigation } from '@react-navigation/native';
@@ -27,6 +26,7 @@ import Routes from '../../../utils/Route';
 import { SCContext } from '../../../context';
 import { Action } from '../../../context/actionType';
 import { TESTID } from '../../../configs/Constants';
+import Connecting from '../../../commons/Connecting ';
 
 const isIos = Platform.OS === 'ios';
 const isAndroid = Platform.OS === 'android';
@@ -50,6 +50,9 @@ const ConnectWifiWarning = memo(({ route }) => {
   const t = useTranslations();
   const { navigate, goBack } = useNavigation();
   const [isLoading, setIsLoading] = useState(false);
+  const [isConnect, setIsConnect] = useState(false);
+  const [isPercentConnect, setIsPercentConnect] = useState(0);
+
   const { setAction } = useContext(SCContext);
 
   const getPermissionWifiAndroid = useCallback(async () => {
@@ -76,6 +79,7 @@ const ConnectWifiWarning = memo(({ route }) => {
   const handleSend = async () => {
     let intervalSend = null;
     if (isIos) {
+      await setIsPercentConnect(1);
       await socket.on('message', (msg, rinfo) => {
         clearInterval(intervalSend);
         const data = JSON.parse(msg.toString());
@@ -110,6 +114,7 @@ const ConnectWifiWarning = memo(({ route }) => {
       });
     } else {
       const socket = dgram.createSocket({ type: 'udp4' });
+      await setIsPercentConnect(1);
       await socket.bind(54321);
       await socket.on('message', (msg, rinfo) => {
         const data = JSON.parse(msg.toString());
@@ -147,6 +152,7 @@ const ConnectWifiWarning = memo(({ route }) => {
 
   const handleConnectWifiGateway = async () => {
     setIsLoading(true);
+    setIsConnect(true);
     // eslint-disable-next-line promise/prefer-await-to-then
     WifiManager.connectToProtectedSSID(wifi_ssid, wifi_pass, false).then(
       () => {
@@ -185,8 +191,11 @@ const ConnectWifiWarning = memo(({ route }) => {
         </>
       ) : (
         <View style={styles.centerLoading}>
-          <ActivityIndicator color={Colors.Primary} size={'small'} />
-          <Text>{t('connecting')}</Text>
+          <Connecting
+            isLoading={isLoading}
+            isConnect={isConnect}
+            isPercentConnect={isPercentConnect}
+          />
         </View>
       )}
     </View>

package/src/screens/AddNewGateway/PlugAndPlay/FirstWarning.js

@@ -37,10 +37,11 @@ const FirstWarning = memo(({ route }) => {
         </View>
       </View>
       <ViewButtonBottom
-        leftTitle={t('text_back')}
+        leftTitle={t('cancel')}
         onLeftClick={goBack}
         rightTitle={t('text_next')}
         onRightClick={onRight}
+        styleButtonLeftText={styles.buttonLeftText}
       />
     </View>
   );
@@ -72,4 +73,7 @@ const styles = StyleSheet.create({
     paddingBottom: 30,
     color: Colors.Red,
   },
+  buttonLeftText: {
+    color: Colors.Gray6,
+  },
 });

package/src/screens/AddNewGateway/PlugAndPlay/GatewayWifiList.js

@@ -205,9 +205,17 @@ const GatewayWifiList = memo(({ route }) => {
     }
   }, [isSendWifi, setAction]);
 
+  const handleOnGoBack = useCallback(() => {
+    navigate(Routes.Dashboard);
+  }, [navigate]);
+
   return (
     <View style={styles.screen}>
-      <HeaderCustom title={t('connect_device')} isShowSeparator />
+      <HeaderCustom
+        onGoBack={handleOnGoBack}
+        title={t('connect_home_wifi')}
+        isShowSeparator
+      />
       <View>
         <Text style={styles.title} semibold type="H3">
           {t('set_network')}

package/src/screens/EditActionsList/Styles/indexStyles.js

@@ -88,6 +88,7 @@ export default StyleSheet.create({
   },
   titleItem: {
     flexDirection: 'row',
+    width: '45%',
   },
   paddingRight4: {
     paddingRight: 4,

package/src/screens/EmergencyContacts/EmergencyContactsList.js

@@ -82,7 +82,7 @@ export const EmergencyContactsList = ({ route }) => {
       id: 2,
       text: t('select_unit_members'),
       route: Routes.EmergencyContactsSelectContacts,
-      data: { unitId, group },
+      data: { unitId, group, lengthListContacts: listContacts.length },
     },
   ];
 

package/src/screens/EmergencyContacts/EmergencyContactsSelectContacts.js

@@ -8,15 +8,20 @@ import { RowUser } from '../../commons/RowUser';
 import WrapHeaderScrollable from '../../commons/Sharing/WrapHeaderScrollable';
 import { API, Colors, Theme } from '../../configs';
 import { TESTID } from '../../configs/Constants';
+
 import { axiosGet, axiosPost } from '../../utils/Apis/axios';
 import { ToastBottomHelper } from '../../utils/Utils';
 
+const MAX_EMERGENCY_CONTACTS = 5;
+
 export const EmergencyContactsSelectContacts = ({ route }) => {
   const t = useTranslations();
   const { goBack } = useNavigation();
-  const { unitId, group } = route.params;
+  const { unitId, group, lengthListContacts } = route.params;
   const [dataContact, setDataContact] = useState([]);
+  const [currentContacts, setCurrentContact] = useState([]);
   const [loading, setLoading] = useState(true);
+  const NUMBER_EMERGENCY_CONTACTS = MAX_EMERGENCY_CONTACTS - lengthListContacts;
 
   const loadMembers = useCallback(async (id) => {
     setLoading(true);
@@ -27,22 +32,33 @@ export const EmergencyContactsSelectContacts = ({ route }) => {
     }
   }, []);
 
-  const [currentContacts, setCurrentContact] = useState('');
-
   const onPressContact = useCallback(
-    (contact) => () => {
-      setCurrentContact(contact);
+    (name, phone_number) => () => {
+      if (currentContacts.some((contact) => contact?.name === name)) {
+        setCurrentContact((oldArray) =>
+          oldArray.filter((contact) => contact?.name !== name)
+        );
+      } else {
+        if (NUMBER_EMERGENCY_CONTACTS !== currentContacts.length) {
+          setCurrentContact((oldArray) => [
+            ...oldArray,
+            { name, phone_number },
+          ]);
+        } else {
+          ToastBottomHelper.error(t('maxmium_contacts'));
+        }
+      }
     },
-    []
+    [NUMBER_EMERGENCY_CONTACTS, currentContacts, t]
   );
 
   const goSave = useCallback(async () => {
-    const { success } = await axiosPost(API.EMERGENCY_BUTTON.CREATE_CONTACT(), {
+    const { success } = await axiosPost(API.EMERGENCY_BUTTON.CREATE_BATCH(), {
       group: group.id,
-      phone_number: currentContacts?.phone_number,
-      name: currentContacts?.name,
+      contacts: currentContacts,
     });
     if (success) {
+      ToastBottomHelper.success(t('saving_contact_successful'));
       goBack();
     } else {
       ToastBottomHelper.error(t('create_contact_failed'));
@@ -66,10 +82,12 @@ export const EmergencyContactsSelectContacts = ({ route }) => {
               }
               text={contact.name}
               subtext={contact.phone_number}
-              onPress={onPressContact(contact)}
+              onPress={onPressContact(contact.name, contact.phone_number)}
               rightComponent={
                 <View style={styles.buttonRemove}>
-                  {currentContacts?.phone_number === contact.phone_number && (
+                  {currentContacts.some(
+                    (item) => item?.name === contact?.name
+                  ) && (
                     <IconOutline
                       name={'check-circle'}
                       size={20}