@developer_tribe/react-native-comnyx 0.4.0 → 0.4.2

package/src/components/ChatList.tsx

@@ -47,10 +47,11 @@ export function ChatList({ onBack }: { onBack?: () => void }) {
     (windowHeight - FLATLIST_PADDING) / MESSAGE_MIN_HEIGHT
   );
   const [loading, setLoading] = useState(true);
-  const { customer, data, setData } = useAppStore((s) => ({
+  const { customer, data, setData, externalId } = useAppStore((s) => ({
     customer: s.customer,
     data: s.data,
     setData: s.setData,
+    externalId: s.externalId,
   }));
   const ref = useRef<SectionList<AppConversationMessage>>(null);
   const [page, setPage] = useState(1);
@@ -131,7 +132,7 @@ export function ChatList({ onBack }: { onBack?: () => void }) {
   }, [data]);
 
   const resendMessage = useCallback(() => {
-    if (selectedMessage && customer?.external_id) {
+    if (selectedMessage && externalId) {
       const currentMessage = useAppStore.getState().data || [];
       const messageIndex = currentMessage.findIndex(
         (msg) => msg.content === selectedMessage
@@ -155,7 +156,7 @@ export function ChatList({ onBack }: { onBack?: () => void }) {
           data: updatedValue,
         });
 
-        sendCustomerMessage(customer.external_id, selectedMessage, {
+        sendCustomerMessage(externalId, selectedMessage, {
           fake: useAppStore.getState().fake,
         })
           .then((res: any) => {
@@ -221,19 +222,14 @@ export function ChatList({ onBack }: { onBack?: () => void }) {
       return;
     }
     nextPageStatus.current = 'loading';
-    if (customer?.external_id) {
+    if (externalId) {
       const newPage = page + 1;
       setPage(newPage);
       const firstMessage = useAppStore.getState().firstMessage;
-      getCustomerConversation(
-        customer?.external_id,
-        firstMessage?.created_at,
-        newPage,
-        {
-          fake: useAppStore.getState().fake,
-          per_page: MESSAGES_PER_PAGE,
-        }
-      )
+      getCustomerConversation(externalId, firstMessage?.created_at, newPage, {
+        fake: useAppStore.getState().fake,
+        per_page: MESSAGES_PER_PAGE,
+      })
         .then((newData) => {
           listChangedRef.current = true;
           setData((prevData) => {
@@ -282,7 +278,7 @@ export function ChatList({ onBack }: { onBack?: () => void }) {
           setLoading(false);
         });
     }
-  }, [MESSAGES_PER_PAGE, customer?.external_id, page, setData]);
+  }, [MESSAGES_PER_PAGE, externalId, page, setData]);
 
   const renderItem = useCallback(
     ({ item }: { item: AppConversationMessage }) => {
@@ -417,8 +413,8 @@ export function ChatList({ onBack }: { onBack?: () => void }) {
   );
 
   useEffect(() => {
-    if (customer?.external_id && !initFailed) {
-      getCustomerConversation(customer?.external_id, new Date(), 1, {
+    if (externalId && !initFailed) {
+      getCustomerConversation(externalId, new Date(), 1, {
         fake: useAppStore.getState().fake,
         per_page: MESSAGES_PER_PAGE,
       })
@@ -468,7 +464,7 @@ export function ChatList({ onBack }: { onBack?: () => void }) {
           setLoading(false);
         });
     }
-  }, [MESSAGES_PER_PAGE, customer?.external_id, initFailed, setData]);
+  }, [MESSAGES_PER_PAGE, externalId, initFailed, setData]);
 
   // Initialize the current section when sections are loaded
   useEffect(() => {
@@ -747,7 +743,7 @@ const styles = ScaledSheet.create({
   liveChat: {
     fontSize: '16@vs',
     textAlign: 'center',
-    fontWeight: 400,
+    fontWeight: 600,
   },
   headerContainer: {
     alignItems: 'center',

package/src/components/CustomerForm.tsx

@@ -65,6 +65,8 @@ export function CustomerForm({ onBack }: { onBack: () => void }) {
           setLoading(false);
         }, 100);
       });
+    } else {
+      setLoading(false);
     }
   }, []);
 

package/src/components/MessageInput.tsx

@@ -17,6 +17,7 @@ export function MessageInput({
 }) {
   const [value, setValue] = useState('');
   const customer = useAppStore((s) => s.customer!);
+  const externalId = useAppStore((s) => s.externalId);
   const themeColors = useThemeColors();
   const localize = useLocalize();
 
@@ -36,7 +37,7 @@ export function MessageInput({
         },
         ...(data ?? []),
       ]);
-      sendCustomerMessage(customer.external_id, value, {
+      sendCustomerMessage(externalId as string, value, {
         fake: useAppStore.getState().fake,
       })
         .then((res) => {

package/src/hooks/usePolling.ts

@@ -5,18 +5,18 @@ import { getNewCustomerConversation } from '../api';
 const NEW_MESSAGES_CHECK_INTERVAL = 10000;
 
 export function usePolling() {
-  const { customer, data, setData } = useAppStore((s) => ({
-    customer: s.customer,
+  const { data, setData, externalId } = useAppStore((s) => ({
     data: s.data,
     setData: s.setData,
+    externalId: s.externalId,
   }));
   const lastMessage = data ? data[data.length - 1] : null;
   useEffect(() => {
     const created_at = lastMessage?.created_at;
     let interval: NodeJS.Timeout | null = null;
-    if (customer?.external_id && created_at) {
+    if (externalId && created_at) {
       interval = setInterval(() => {
-        getNewCustomerConversation(customer.external_id, created_at, {
+        getNewCustomerConversation(externalId, created_at, {
           fake: useAppStore.getState().fake,
         }).then((newData) => {
           setData((prevData) => {
@@ -42,5 +42,5 @@ export function usePolling() {
         clearInterval(interval);
       }
     };
-  }, [customer?.external_id, lastMessage?.created_at, setData]);
+  }, [externalId, lastMessage?.created_at, setData]);
 }

package/src/types/Customer.ts

@@ -40,4 +40,5 @@ export interface Customer {
   created_at: string;
   updated_at: string;
   deleted_at: null | string;
+  integration_parameters: IntegrationParameters;
 }