@messenger-box/platform-mobile 0.0.1-alpha.362 → 0.0.1-alpha.365

package/src/screens/inbox/containers/Dialogs.tsx

@@ -13,6 +13,7 @@ import { config } from '../config';
 export interface InboxProps {
     channelFilters?: Record<string, unknown>;
     channelRole?: string;
+    supportServices:boolean;
 }
 
 const DialogsComponent = (props: InboxProps) => {
@@ -119,7 +120,7 @@ const DialogsComponent = (props: InboxProps) => {
      },[])
 
     return (
-        <Box p={2}>
+        <Box p={2} pt={props?.supportServices ? 0 : 2}>
             <FlatList
                 data={channels && channels?.length > 0 ? channels : []}
                 onRefresh={handleRefresh}

package/src/screens/inbox/containers/SupportServiceDialogs.tsx

@@ -0,0 +1,119 @@
+import React, { useCallback, useMemo, useEffect, useState } from 'react';
+import { FlatList, Box, Heading, Input, Text, Icon, Center, Spinner } from 'native-base';
+import { Ionicons } from '@expo/vector-icons';
+import { useSelector, useDispatch } from 'react-redux';
+import { useNavigation, useRoute, useIsFocused, useFocusEffect } from '@react-navigation/native';
+
+import { SupportServiceDialogsListItem } from '../components/SupportServiceDialogsListItem';
+import { useSupportServiceChannelsQuery } from '@messenger-box/platform-client';
+import { userSelector } from '@adminide-stack/user-auth0-client';
+import { CHANGE_SETTINGS_ACTION } from '@admin-layout/client';
+import { config } from '../config';
+
+export interface SupportServiceInboxProps {
+    channelFilters?: Record<string, unknown>;
+    channelRole?: string;
+}
+
+const SupportServiceDialogsComponent = (props: SupportServiceInboxProps) => {
+    const { channelFilters, channelRole } = props;
+    const { params } = useRoute<any>();
+    const auth = useSelector(userSelector);
+    const dispatch = useDispatch();
+    const navigation = useNavigation<any>();
+    const isFocused = useIsFocused();
+    const [refreshing, setRefresh] = useState<boolean>(false);
+    // const [userDirectChannel, setUserDirectChannel] = useState<any>([]);
+
+    const {
+        data: serviceChannels,
+        loading: serviceChannelsLoading,
+        refetch: getServiceChannelsRefetch,
+    } = useSupportServiceChannelsQuery({
+        variables: {
+            criteria: { type: 'SERVICE' },
+        },
+        onCompleted: (data: any) => {
+            //setRefresh(false);
+        },
+    });
+
+    useFocusEffect(
+        React.useCallback(() => {
+            // Do something when the screen is focused
+            setRefresh(false);
+            getServiceChannelsRefetch({ criteria: { type: 'SERVICE' } });
+
+            return () => {
+                // Do something when the screen is unfocused
+                // Useful for cleanup functions
+            };
+        }, []),
+    );
+
+    const channels = React.useMemo(() => {
+        if (!serviceChannels?.supportServiceChannels?.length) return null;
+        let uChannels: any =
+            serviceChannels?.supportServiceChannels?.filter((c: any) =>
+                c.members.some((u: any) => u.user.__typename == 'UserAccount'),
+            ) ?? [];
+        return uChannels || [];
+    }, [serviceChannels]);
+
+    const handleSelectChannel = useCallback((id: any, title: any, postParentId: any) => {
+        if (params?.channelId) {
+            navigation.navigate(
+                params?.postParentId || params?.postParentId == 0 ? config.THREAD_MESSEGE_PATH : (config.THREADS_PATH as any),
+                {
+                    channelId: params?.channelId,
+                    role:params?.role,
+                    title: params?.title ?? null,
+                    postParentId: params?.postParentId,
+                    hideTabBar: true,
+                },
+            );
+        } else {
+            navigation.navigate(
+                postParentId || postParentId == 0 ? config.THREAD_MESSEGE_PATH : (config.THREADS_PATH as any),
+                {
+                    channelId: id,
+                    role:channelRole,
+                    title: title,
+                    postParentId: postParentId,
+                    hideTabBar: true,
+                },
+            );
+        }
+    }, []);
+
+    const handleRefresh = useCallback(() => {
+        //if(userChannels?.channelsByUser?.length != channels?.length)setRefresh(true);
+        setRefresh(true)
+        getServiceChannelsRefetch({ criteria: { type: 'SERVICE' } })?.then((res:any)=>setRefresh(false));
+    }, []);
+
+    return (
+        <Box p={2} pb={0}>
+            <FlatList
+                data={channels && channels?.length > 0 ? channels : []}
+                onRefresh={handleRefresh}
+                refreshing={serviceChannelsLoading}
+                contentContainerStyle={{}}
+                ItemSeparatorComponent={() => <Box height="0.5" backgroundColor="gray.200" />}
+                renderItem={({ item: channel }) => (
+                    <SupportServiceDialogsListItem
+                        onOpen={handleSelectChannel}
+                        currentUser={auth}
+                        channel={channel}
+                        refreshing={refreshing}
+                        selectedChannelId={params?.channelId}
+                        role={channelRole}
+                    />
+                )}
+                keyExtractor={(item, index) => 'support-service-key' + index}
+            />
+        </Box>
+    );
+};
+
+export const SupportServiceDialogs = React.memo(SupportServiceDialogsComponent);