@messenger-box/platform-mobile 10.0.3-alpha.20 → 10.0.3-alpha.201

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

@@ -1,305 +0,0 @@
-import React, { useCallback, useMemo, useEffect, useState } from 'react';
-import { FlatList, Box, Heading, Input, Text, Icon, Center, Spinner, Button } from '@admin-layout/gluestack-ui-mobile';
-import { Ionicons } from '@expo/vector-icons';
-import { useSelector, useDispatch } from 'react-redux';
-import { useNavigation, useRoute, useIsFocused, useFocusEffect } from '@react-navigation/native';
-import { orderBy, uniqBy, startCase } from 'lodash-es';
-import {
-    useThreadMessagesQuery,
-    OnThreadCreatedUpdatedDocument as THREAD_CHAT_ADDED,
-    useOnThreadCreatedUpdatedSubscription,
-} from 'common/graphql';
-import { userSelector } from '@adminide-stack/user-auth0-client';
-import { CHANGE_SETTINGS_ACTION } from '@admin-layout/client';
-import { ThreadViewItem } from '../components/ThreadsViewItem';
-import { config } from '../config';
-const { MESSAGES_PER_PAGE } = config;
-
-export interface ThreadsViewProps {
-    data: any;
-    loading: boolean;
-    refetch: any;
-    subscribeToMore: any;
-    error: any;
-    channelId?: string;
-    role?: string;
-    channelsDetail?: any;
-    refetchChannelDetail: (id: any) => Promise<any>;
-}
-
-interface IThreadSubscriptionHandlerProps {
-    subscribeToNewMessages: () => any;
-    channelId: string | undefined;
-}
-
-const ThreadsViewComponent = ({
-    data,
-    loading: threadLoading,
-    refetch,
-    subscribeToMore,
-    error,
-    channelId,
-    role,
-    channelsDetail,
-    refetchChannelDetail,
-}: ThreadsViewProps) => {
-    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 [threadData, setThreadsData] = useState<any>([]);
-
-    // const {
-    //     data,
-    //     loading: threadLoading,
-    //     error,
-    //     refetch,
-    //     subscribeToMore,
-    // } = useThreadMessagesQuery({
-    //     variables: {
-    //         channelId: channelId?.toString(),
-    //         role: role?.toString(),
-    //         limit: MESSAGES_PER_PAGE,
-    //         repliesLimit2: 5,
-    //     },
-    //     // fetchPolicy: 'cache-and-network',
-    // });
-
-    // const { data: threadCreatedUpdated } = useOnThreadCreatedUpdatedSubscription({
-    //     variables: { channelId: channelId?.toString() },
-    // });
-
-    useFocusEffect(
-        React.useCallback(() => {
-            // Do something when the screen is focused
-            navigation?.setOptions({ title: params?.title ?? 'Thread' });
-            refetch({
-                channelId: channelId?.toString(),
-                role: role?.toString(),
-                limit: MESSAGES_PER_PAGE,
-                repliesLimit2: 5,
-            });
-            // .then(({ data }) => {
-            //     if (!data?.threadMessages?.data) {
-            //         return;
-            //     }
-
-            //     if (data?.threadMessages?.data?.length) {
-            //         const { data: newThreads } = data?.threadMessages;
-            //         setThreadsData((oldThreads: any) => uniqBy([...oldThreads, ...newThreads], ({ id }) => id));
-            //     }
-            // });
-
-            return () => {
-                // Do something when the screen is unfocused
-                // Useful for cleanup functions
-            };
-        }, []),
-    );
-
-    // React.useEffect(() => {
-    //     if (data?.threadMessages?.data?.length) {
-    //         const { data: newThreads } = data?.threadMessages;
-    //         setThreadsData((oldThreads: any) => uniqBy([...oldThreads, ...newThreads], ({ id }) => id));
-    //     }
-    // }, [data]);
-
-    // React.useEffect(() => {
-    //     if (threadCreatedUpdated?.threadCreatedUpdated?.data) {
-    //         const { data: newThreads } = threadCreatedUpdated?.threadCreatedUpdated;
-
-    //         setThreadsData((oldThreads: any) => {
-    //             const i = oldThreads.findIndex((el: any) => el.id === newThreads?.id);
-    //             if (i > -1) oldThreads[i] = newThreads; // (2)
-    //             else oldThreads.push(newThreads);
-    //             return oldThreads;
-    //         });
-    //         // setThreadsData((oldThreads: any) => uniqBy([...oldThreads, newThreads], ({ id }) => id));
-    //     }
-    // }, [threadCreatedUpdated]);
-
-    const setData = React.useCallback((newThreads: any) => {
-        setThreadsData((oldThreads: any) => {
-            const i = oldThreads.findIndex((el: any) => el.id === newThreads?.id);
-            if (i > -1) oldThreads[i] = newThreads; // (2)
-            else oldThreads.push(newThreads);
-            return oldThreads;
-        });
-        // setThreadsData((oldThreads: any) => uniqBy([...oldThreads, newThreads], ({ id }) => id));
-    }, []);
-
-    // const threads = React.useMemo(() => {
-    //     if (!threadData?.length) return null;
-    //     return orderBy(threadData, ['updatedAt'], ['desc']) || [];
-    //     //return threadData || [];
-    // }, [threadData]);
-
-    const threads = React.useMemo(() => {
-        // if (!data?.threadMessages?.data?.length) return null;
-        // const { data: newThreads } = data?.threadMessages;
-        if (data?.threadMessages?.data?.length == 0) return [];
-        const threadsFiltered = data?.threadMessages?.data
-            ? uniqBy([...data?.threadMessages?.data], ({ id }: any) => id)
-            : [];
-        return orderBy(threadsFiltered, ['updatedAt'], ['desc']) || [];
-    }, [data]);
-
-    const threadReplies = React.useMemo(() => {
-        if (!threads?.length) return null;
-        return threads?.map((t: any) => t?.replies)?.flat(1) || [];
-        //return threadData || [];
-    }, [threads]);
-
-    const handleSelectThread = useCallback((id: any, title: any, postParentId: any) => {
-        navigation.navigate(config.THREAD_MESSEGE_PATH as any, {
-            channelId: id,
-            role: role?.toString(),
-            title: title,
-            postParentId: postParentId,
-            hideTabBar: true,
-        });
-        // if (params?.channelId) {
-        //     navigation.navigate(config.THREAD_MESSEGE_PATH as any, {
-        //         channelId: params?.channelId,
-        //         title: params?.title ?? null,
-        //         postParentId: postParentId,
-        //         hideTabBar: true,
-        //     });
-        // } else {
-        //     navigation.navigate(config.THREAD_MESSEGE_PATH as any, {
-        //         channelId: id,
-        //         title: title,
-        //         postParentId: postParentId,
-        //         hideTabBar: true,
-        //     });
-        // }
-    }, []);
-
-    const handleRefresh = useCallback(() => {
-        refetch({
-            channelId: channelId?.toString(),
-            role: role?.toString(),
-            limit: MESSAGES_PER_PAGE,
-            repliesLimit2: 5,
-        });
-        // .then(({ data }) => {
-        //     if (!data?.threadMessages?.data) {
-        //         return;
-        //     }
-
-        //     if (data?.threadMessages?.data?.length) {
-        //         const { data: newThreads } = data?.threadMessages;
-        //         setThreadsData((oldThreads: any) => uniqBy([...oldThreads, ...newThreads], ({ id }) => id));
-        //     }
-        // });
-    }, []);
-
-    const fetchMoreThreads = useCallback(() => {
-        refetch({
-            channelId: channelId?.toString(),
-            role: role?.toString(),
-            skip: threads?.length,
-        });
-    }, []);
-
-    // if (!threadReplies || threadReplies?.length == 0) {
-    //     return (
-    //         <Center w="full" bg={'f8f8f8'} height={'full'}>
-    //             You don't have any message yet!
-    //         </Center>
-    //     );
-    // }
-    console.log('threadLoading', threadLoading, ' threads?.length=', threads?.length);
-
-    return (
-        <Box className="flex-1 p-2 pb-0 bg-gray-100 dark:border-gray-600 dark:bg-gray-700">
-            <FlatList
-                style={{ flex: 1 }}
-                data={threads && threads?.length > 0 ? threads : []}
-                onRefresh={handleRefresh}
-                refreshing={threadLoading}
-                contentContainerStyle={{ paddingBottom: 60 }}
-                ItemSeparatorComponent={() => <Box className="h-0.5 bg-gray-200" />}
-                renderItem={({ item: thread, index }) => (
-                    <ThreadViewItem
-                        key={index}
-                        onOpen={handleSelectThread}
-                        currentUser={auth}
-                        thread={thread}
-                        role={role}
-                        setData={setData}
-                    />
-                )}
-                ListEmptyComponent={() => (
-                    <>
-                        {/* {!threadLoading || threads?.length == 0} */}
-                        {!threadLoading && threads?.length == 0 && (
-                            <Box className="p-5">
-                                <Center className="mt-6">
-                                    <Ionicons name="chatbubbles" size={50} />
-                                    <Text>You don't have any message yet!</Text>
-                                </Center>
-                            </Box>
-                        )}
-                    </>
-                )}
-                ListFooterComponent={() => (
-                    <>
-                        <SubscriptionHandler
-                            channelId={channelId}
-                            subscribeToNewMessages={() =>
-                                subscribeToMore({
-                                    document: THREAD_CHAT_ADDED,
-                                    variables: {
-                                        channelId: channelId?.toString(),
-                                        postParentId: null,
-                                    },
-                                    updateQuery: (prev, { subscriptionData }: any) => {
-                                        if (!subscriptionData.data) return prev;
-                                        const newPostThreadData: any =
-                                            subscriptionData?.data?.threadCreatedUpdated?.data;
-                                        const newMessage: any =
-                                            subscriptionData?.data?.threadCreatedUpdated?.lastMessage;
-                                        const data = prev?.threadMessages?.data?.map((t: any) =>
-                                            t.id === newPostThreadData?.id
-                                                ? {
-                                                      ...t,
-                                                      replies: [newMessage, ...t?.replies],
-                                                      replyCount: newPostThreadData?.replyCount,
-                                                      lastReplyAt: newPostThreadData?.lastReplyAt,
-                                                      updatedAt: newPostThreadData?.updatedAt,
-                                                  }
-                                                : t,
-                                        );
-
-                                        return Object.assign({}, prev, {
-                                            threadMessages: {
-                                                ...prev?.threadMessages,
-                                                // totalCount: prev?.threadMessages?.totalCount + 1,
-                                                data: data,
-                                            },
-                                        });
-                                    },
-                                })
-                            }
-                        />
-                    </>
-                )}
-                keyExtractor={(item, index) => 'threads-view-key' + index}
-                onEndReached={fetchMoreThreads}
-                onEndReachedThreshold={0.1}
-            />
-        </Box>
-    );
-};
-
-const SubscriptionHandler = ({ subscribeToNewMessages, channelId }: IThreadSubscriptionHandlerProps) => {
-    useEffect(() => subscribeToNewMessages(), [channelId]);
-    return <></>;
-};
-
-export const ThreadsView = ThreadsViewComponent;
-
-// export const ThreadsView = React.memo(ThreadsViewComponent);

package/src/screens/inbox/containers/workflow/apollo/handleResult.ts

@@ -1,20 +0,0 @@
-import { ApolloError, FetchResult, SingleExecutionResult } from '@apollo/client';
-
-// Accept any promise-like object with a data field
-export const newHandleMutationResult = async (
-    promise: Promise<any>,
-    transformer: (result: any) => any,
-): Promise<any> => {
-    try {
-        const result = await promise;
-        if (result.errors) {
-            throw result.errors;
-        }
-        if (!result.data) {
-            throw new Error('No data returned from query');
-        }
-        return transformer(result.data);
-    } catch (error: any) {
-        throw error;
-    }
-};

package/src/screens/inbox/containers/workflow/conversation-xstate.ts

@@ -1,313 +0,0 @@
-import { assign, setup } from 'xstate';
-import { merge } from 'lodash-es';
-
-export const enum Actions {
-    INITIAL_CONTEXT = 'INITIAL_CONTEXT',
-    ERROR_HANDLED = 'ERROR_HANDLED',
-    SEND_MESSAGE = 'SEND_MESSAGE',
-    SEND_MESSAGE_WITH_FILE = 'SEND_MESSAGE_WITH_FILE',
-    SET_CHANNEL_MESSAGES = 'SET_CHANNEL_MESSAGES',
-    CLEAR_MESSAGES = 'CLEAR_MESSAGES',
-    FETCH_MORE_MESSAGES = 'FETCH_MORE_MESSAGES',
-    SUBSCRIBE_TO_MESSAGES = 'SUBSCRIBE_TO_MESSAGES',
-    CREATE_DIRECT_CHANNEL = 'CREATE_DIRECT_CHANNEL',
-    START_LOADING = 'START_LOADING',
-    STOP_LOADING = 'STOP_LOADING',
-    SET_IMAGE = 'SET_IMAGE',
-    CLEAR_IMAGE = 'CLEAR_IMAGE',
-    SET_MESSAGE_TEXT = 'SET_MESSAGE_TEXT',
-}
-
-export const enum BaseState {
-    Idle = 'idle',
-    Error = 'error',
-    Loading = 'loading',
-    Done = 'done',
-    FetchChannels = 'fetchChannels',
-    FetchMessages = 'fetchMessages',
-}
-
-export const enum MainState {
-    SendMessage = 'sendMessage',
-    SendMessageWithFile = 'sendMessageWithFile',
-    FetchMoreMessages = 'fetchMoreMessages',
-    CreateDirectChannel = 'createDirectChannel',
-}
-
-export const conversationXstate = setup({
-    types: {
-        context: {} as {
-            channelId: string | null;
-            channelMessages: any[];
-            totalCount: number;
-            skip: number;
-            loading: boolean;
-            loadingOldMessages: boolean;
-            error: string | null;
-            selectedImage: string;
-            files: any[];
-            images: any[];
-            messageText: string;
-            imageLoading: boolean;
-        },
-    },
-    actions: {
-        errorState: assign(({ context, event }) => {
-            return {
-                ...context,
-                error: event.data?.message || 'An error occurred',
-                loading: false,
-                loadingOldMessages: false,
-                imageLoading: false,
-            };
-        }),
-        setInitialContext: assign(({ context, event }) => {
-            return merge({
-                ...context,
-                channelId: event.data?.channelId || null,
-                loading: false,
-            });
-        }),
-        setChannelMessages: assign(({ context, event }) => {
-            return {
-                ...context,
-                channelMessages: event.data?.messages || [],
-                totalCount: event.data?.totalCount || 0,
-                loading: false,
-            };
-        }),
-        addChannelMessages: assign(({ context, event }) => {
-            const messages = event.data?.messages || [];
-            return {
-                ...context,
-                channelMessages: [...context.channelMessages, ...messages],
-                loadingOldMessages: false,
-            };
-        }),
-        addNewMessage: assign(({ context, event }) => {
-            const message = event.data?.message;
-            if (!message) return context;
-
-            return {
-                ...context,
-                channelMessages: [...context.channelMessages, message],
-                totalCount: context.totalCount + 1,
-                loading: false,
-            };
-        }),
-        updateSkip: assign(({ context, event }) => {
-            return {
-                ...context,
-                skip: context.channelMessages.length,
-                loadingOldMessages: true,
-            };
-        }),
-        clearMessages: assign(({ context }) => {
-            return {
-                ...context,
-                channelMessages: [],
-                totalCount: 0,
-                skip: 0,
-            };
-        }),
-        setChannelId: assign(({ context, event }) => {
-            return {
-                ...context,
-                channelId: event.data?.channelId || null,
-            };
-        }),
-        startLoading: assign(({ context }) => {
-            return {
-                ...context,
-                loading: true,
-            };
-        }),
-        stopLoading: assign(({ context }) => {
-            return {
-                ...context,
-                loading: false,
-            };
-        }),
-        startImageLoading: assign(({ context }) => {
-            return {
-                ...context,
-                imageLoading: true,
-            };
-        }),
-        stopImageLoading: assign(({ context }) => {
-            return {
-                ...context,
-                imageLoading: false,
-            };
-        }),
-        setSelectedImage: assign(({ context, event }) => {
-            return {
-                ...context,
-                selectedImage: event.data?.image || '',
-                files: event.data?.files || context.files,
-                images: event.data?.images || context.images,
-                imageLoading: false,
-            };
-        }),
-        clearImageData: assign(({ context }) => {
-            return {
-                ...context,
-                selectedImage: '',
-                files: [],
-                images: [],
-            };
-        }),
-        setMessageText: assign(({ context, event }) => {
-            return {
-                ...context,
-                messageText: event.data?.messageText || '',
-            };
-        }),
-    },
-    guards: {
-        hasMoreMessages: ({ context }) => {
-            return context.totalCount > context.channelMessages.length;
-        },
-    },
-}).createMachine({
-    id: 'conversation-view',
-    initial: BaseState.Idle,
-    context: {
-        channelId: null,
-        channelMessages: [],
-        totalCount: 0,
-        skip: 0,
-        loading: false,
-        loadingOldMessages: false,
-        error: null,
-        selectedImage: '',
-        files: [],
-        images: [],
-        messageText: '',
-        imageLoading: false,
-    },
-    states: {
-        [BaseState.Idle]: {
-            on: {
-                [Actions.INITIAL_CONTEXT]: {
-                    target: BaseState.FetchMessages,
-                    actions: ['setInitialContext'],
-                },
-                [Actions.SEND_MESSAGE]: {
-                    target: MainState.SendMessage,
-                    actions: ['startLoading'],
-                },
-                [Actions.SEND_MESSAGE_WITH_FILE]: {
-                    target: MainState.SendMessageWithFile,
-                    actions: ['startLoading'],
-                },
-                [Actions.FETCH_MORE_MESSAGES]: {
-                    target: MainState.FetchMoreMessages,
-                    actions: ['updateSkip'],
-                    guard: 'hasMoreMessages',
-                },
-                [Actions.CLEAR_MESSAGES]: {
-                    target: BaseState.Idle,
-                    actions: ['clearMessages'],
-                },
-                [Actions.CREATE_DIRECT_CHANNEL]: {
-                    target: MainState.CreateDirectChannel,
-                    actions: ['startLoading'],
-                },
-                [Actions.START_LOADING]: {
-                    target: BaseState.Idle,
-                    actions: ['startLoading'],
-                },
-                [Actions.STOP_LOADING]: {
-                    target: BaseState.Idle,
-                    actions: ['stopLoading'],
-                },
-                [Actions.SET_IMAGE]: {
-                    target: BaseState.Idle,
-                    actions: ['setSelectedImage'],
-                },
-                [Actions.CLEAR_IMAGE]: {
-                    target: BaseState.Idle,
-                    actions: ['clearImageData'],
-                },
-                [Actions.SET_MESSAGE_TEXT]: {
-                    target: BaseState.Idle,
-                    actions: ['setMessageText'],
-                },
-            },
-        },
-        [BaseState.Error]: {
-            entry: ['errorState'],
-            on: {
-                [Actions.ERROR_HANDLED]: {
-                    target: BaseState.Idle,
-                },
-            },
-        },
-        [BaseState.FetchMessages]: {
-            invoke: {
-                src: 'fetchMessages',
-                input: ({ context, event }) => ({ context, event }),
-                onDone: {
-                    target: BaseState.Idle,
-                    actions: ['setChannelMessages'],
-                },
-                onError: {
-                    target: BaseState.Error,
-                },
-            },
-        },
-        [MainState.SendMessage]: {
-            invoke: {
-                src: 'sendMessage',
-                input: ({ context, event }) => ({ context, event }),
-                onDone: {
-                    target: BaseState.Idle,
-                    actions: ['addNewMessage', 'stopLoading'],
-                },
-                onError: {
-                    target: BaseState.Error,
-                },
-            },
-        },
-        [MainState.SendMessageWithFile]: {
-            invoke: {
-                src: 'sendMessageWithFile',
-                input: ({ context, event }) => ({ context, event }),
-                onDone: {
-                    target: BaseState.Idle,
-                    actions: ['addNewMessage', 'clearImageData', 'stopLoading'],
-                },
-                onError: {
-                    target: BaseState.Error,
-                },
-            },
-        },
-        [MainState.FetchMoreMessages]: {
-            invoke: {
-                src: 'fetchMoreMessages',
-                input: ({ context, event }) => ({ context, event }),
-                onDone: {
-                    target: BaseState.Idle,
-                    actions: ['addChannelMessages'],
-                },
-                onError: {
-                    target: BaseState.Error,
-                },
-            },
-        },
-        [MainState.CreateDirectChannel]: {
-            invoke: {
-                src: 'createDirectChannel',
-                input: ({ context, event }) => ({ context, event }),
-                onDone: {
-                    target: BaseState.Idle,
-                    actions: ['setChannelId', 'stopLoading'],
-                },
-                onError: {
-                    target: BaseState.Error,
-                },
-            },
-        },
-    },
-} as any);