@messenger-box/platform-mobile 10.0.3-alpha.23 → 10.0.3-alpha.232

package/src/screens/inbox/hooks/useSafeDialogThreadsMachine.ts

@@ -1,136 +0,0 @@
-import { useState, useCallback, useMemo } from 'react';
-import { BaseState, Actions, dialogThreadsXstate } from '../workflow/dialog-threads-xstate';
-
-// Define proper types for the state and context
-export interface DialogThreadsContext {
-    channelId?: string;
-    postParentId?: string | number;
-    role?: string;
-    channelsDetail: any;
-    threadData: any[];
-    loading: boolean;
-    error: any;
-}
-
-export interface DialogThreadsState {
-    context: DialogThreadsContext;
-    value: BaseState;
-    matches: (stateValue: string) => boolean;
-}
-
-// Define proper action types
-export type DialogThreadsEvent =
-    | { type: typeof Actions.INITIALIZE; data: { channelId?: string; postParentId?: string | number; role?: string } }
-    | { type: typeof Actions.FETCH_CHANNEL_DETAIL; data: { id: string } }
-    | { type: typeof Actions.SET_CHANNEL_DETAIL; data: { channelsDetail: any } }
-    | { type: typeof Actions.FETCH_THREADS; data?: any }
-    | { type: typeof Actions.SET_THREADS; data: { threadData: any[] } }
-    | { type: typeof Actions.ERROR; data: { error: any } };
-
-/**
- * Custom hook to safely use the dialog threads state machine
- * This provides a fallback implementation in case useMachine from XState has issues
- */
-export function useSafeDialogThreadsMachine(): [DialogThreadsState, (event: DialogThreadsEvent) => void] {
-    // Initialize with default state from the machine's initial context
-    const [state, setState] = useState<DialogThreadsState>({
-        context: {
-            channelId: undefined,
-            postParentId: undefined,
-            role: undefined,
-            channelsDetail: null,
-            threadData: [],
-            loading: true,
-            error: null,
-        },
-        value: BaseState.Idle,
-        matches: (value: string) => value === BaseState.Idle,
-    });
-
-    // Create a memoized function to determine state matching
-    const matches = useCallback((value: string) => value === state.value, [state.value]);
-
-    // Update the matches function when state changes
-    useMemo(() => {
-        setState((prev) => ({
-            ...prev,
-            matches,
-        }));
-    }, [matches]);
-
-    // Create a safe send function to handle events
-    const send = useCallback((event: DialogThreadsEvent) => {
-        try {
-            // Handle specific events based on the event type
-            if (event.type === Actions.INITIALIZE) {
-                setState((prev) => ({
-                    ...prev,
-                    context: {
-                        ...prev.context,
-                        channelId: event.data?.channelId,
-                        postParentId: event.data?.postParentId,
-                        role: event.data?.role,
-                        loading: true,
-                        error: null,
-                    },
-                    value: BaseState.LoadingChannel,
-                }));
-            } else if (event.type === Actions.SET_CHANNEL_DETAIL) {
-                setState((prev) => ({
-                    ...prev,
-                    context: {
-                        ...prev.context,
-                        channelsDetail: event.data?.channelsDetail,
-                        loading: false,
-                    },
-                    value: BaseState.LoadingThreads,
-                }));
-            } else if (event.type === Actions.SET_THREADS) {
-                setState((prev) => ({
-                    ...prev,
-                    context: {
-                        ...prev.context,
-                        threadData: event.data?.threadData || [],
-                        loading: false,
-                    },
-                    value: BaseState.Active,
-                }));
-            } else if (event.type === Actions.FETCH_THREADS) {
-                setState((prev) => ({
-                    ...prev,
-                    context: {
-                        ...prev.context,
-                        loading: true,
-                    },
-                    value: BaseState.LoadingThreads,
-                }));
-            } else if (event.type === Actions.ERROR) {
-                setState((prev) => ({
-                    ...prev,
-                    context: {
-                        ...prev.context,
-                        error: event.data?.error,
-                        loading: false,
-                    },
-                    value: BaseState.Error,
-                }));
-            }
-        } catch (error) {
-            // Handle errors gracefully
-            setState((prev) => ({
-                ...prev,
-                context: {
-                    ...prev.context,
-                    error,
-                    loading: false,
-                },
-                value: BaseState.Error,
-            }));
-        }
-    }, []);
-
-    // Return as a tuple to match useMachine API
-    return [state, send];
-}
-
-export default useSafeDialogThreadsMachine;

package/src/screens/inbox/index.ts

@@ -1,37 +0,0 @@
-// State machines
-export {
-    dialogThreadsXstate,
-    Actions as DialogThreadsActions,
-    BaseState as DialogThreadsState,
-} from './workflow/dialog-threads-xstate';
-export {
-    threadConversationXstate,
-    Actions as ThreadConversationActions,
-    BaseState as ThreadConversationState,
-} from './containers/workflow/thread-conversation-xstate';
-export {
-    conversationXstate,
-    Actions as ConversationActions,
-    BaseState as ConversationState,
-} from './containers/workflow/conversation-xstate';
-export {
-    dialogsXstate,
-    Actions as DialogsActions,
-    BaseState as DialogsState,
-} from './containers/workflow/dialogs-xstate';
-
-// Hooks
-export { default as useSafeDialogThreadsMachine } from './hooks/useSafeDialogThreadsMachine';
-
-// Components
-export { DialogThreads } from './DialogThreads';
-export { ThreadsView } from './containers/ThreadsView';
-export { ThreadConversationView } from './containers/ThreadConversationView';
-export { ConversationView } from './containers/ConversationView';
-export { Dialogs } from './containers/Dialogs';
-
-// Configuration
-export { config } from './config';
-
-// Utility
-export { threadsMachineConfig, setupThreadSubscription } from './machines/threadsMachine';

package/src/screens/inbox/machines/threadsMachine.ts

@@ -1,147 +0,0 @@
-import { orderBy, uniqBy } from 'lodash-es';
-import { config } from '../config';
-import { OnThreadCreatedUpdatedDocument as THREAD_CHAT_ADDED } from 'common/graphql';
-
-const { MESSAGES_PER_PAGE } = config;
-
-// Define more specific types for threads and thread data
-export interface Thread {
-    id: string;
-    updatedAt?: string | number; // Make updatedAt optional to match the GraphQL response
-    [key: string]: any;
-}
-
-export interface ThreadsData {
-    threadMessages?: {
-        data: Thread[] | any[]; // Allow any[] to accommodate GraphQL response types
-    };
-    [key: string]: any; // Allow additional properties from GraphQL responses
-}
-
-export interface ThreadsContext {
-    threads: Thread[];
-    loading: boolean;
-    error: any;
-    channelId?: string;
-    role?: string;
-    refreshing: boolean;
-}
-
-// Type for refetch function
-export type RefetchFunction = (variables: any) => Promise<{ data?: any }>;
-
-// Type for subscription function
-export type SubscribeFunction = (options: {
-    document: any;
-    variables: any;
-    updateQuery: (prev: any, { subscriptionData }: any) => any;
-}) => () => void;
-
-// Define machine actions and services with proper typing
-export const threadsMachineConfig = {
-    // Services
-    fetchThreads: (refetch: RefetchFunction, context: ThreadsContext) => {
-        if (!context.channelId) return Promise.resolve({ data: undefined });
-
-        return refetch({
-            channelId: context.channelId?.toString(),
-            role: context.role?.toString(),
-            limit: MESSAGES_PER_PAGE,
-            repliesLimit2: 5,
-        });
-    },
-
-    fetchMoreThreads: (refetch: RefetchFunction, context: ThreadsContext) => {
-        if (!context.channelId || !context.threads?.length) {
-            return Promise.resolve({ data: undefined });
-        }
-
-        return refetch({
-            channelId: context.channelId?.toString(),
-            role: context.role?.toString(),
-            skip: context.threads?.length,
-        });
-    },
-
-    refreshThreads: (refetch: RefetchFunction, context: ThreadsContext) => {
-        if (!context.channelId) return Promise.resolve({ data: undefined });
-
-        return refetch({
-            channelId: context.channelId?.toString(),
-            role: context.role?.toString(),
-            limit: MESSAGES_PER_PAGE,
-            repliesLimit2: 5,
-        });
-    },
-
-    // Actions - optimized for performance with proper type handling
-    setThreadData: (data: ThreadsData): Thread[] => {
-        if (!data?.threadMessages?.data) return [];
-
-        const threadsData = data.threadMessages.data;
-        if (!threadsData.length) return [];
-
-        // Use a more efficient process with proper typing
-        const threadsFiltered = uniqBy(threadsData, 'id');
-        return orderBy(threadsFiltered, ['updatedAt'], ['desc']) || [];
-    },
-
-    appendThreadData: (existingThreads: Thread[], data: ThreadsData): Thread[] => {
-        if (!data?.threadMessages?.data) return existingThreads;
-
-        const newThreads = data.threadMessages.data;
-        if (!newThreads.length) return existingThreads;
-
-        // Use a more efficient combination process
-        const combinedThreads = uniqBy([...existingThreads, ...newThreads], 'id');
-        return orderBy(combinedThreads, ['updatedAt'], ['desc']) || [];
-    },
-
-    updateThreadData: (oldThreads: Thread[], newThread: Thread | null): Thread[] => {
-        if (!newThread) return oldThreads;
-        if (!oldThreads?.length) return [newThread]; // Handle empty array case efficiently
-
-        // Check if thread exists to avoid unnecessary array copy
-        const index = oldThreads.findIndex((el) => el.id === newThread.id);
-
-        let updatedThreads: Thread[];
-        if (index > -1) {
-            // Create a new array only if we're updating
-            updatedThreads = [...oldThreads];
-            updatedThreads[index] = newThread;
-        } else {
-            // Simply add the new thread at the beginning for efficiency
-            updatedThreads = [newThread, ...oldThreads];
-        }
-
-        return orderBy(updatedThreads, ['updatedAt'], ['desc']) || [];
-    },
-};
-
-// Optimized function to subscribe to thread updates
-export const setupThreadSubscription = (
-    subscribeToMore: SubscribeFunction | undefined,
-    channelId: string | undefined,
-): (() => void) | undefined => {
-    if (!subscribeToMore || !channelId) return undefined;
-
-    return subscribeToMore({
-        document: THREAD_CHAT_ADDED,
-        variables: { channelId: channelId?.toString() },
-        updateQuery: (prev, { subscriptionData }) => {
-            if (!subscriptionData?.data) return prev;
-
-            const newThread = subscriptionData.data.threadCreatedUpdated?.data;
-            if (!newThread) return prev;
-
-            // Only create a new object if needed to optimize for unnecessary renders
-            return {
-                ...prev,
-                threadMessages: {
-                    ...prev.threadMessages,
-                    data: uniqBy([newThread, ...(prev.threadMessages?.data || [])], 'id'),
-                },
-            };
-        },
-    });
-};

package/src/screens/inbox/workflow/dialog-threads-xstate.ts

@@ -1,163 +0,0 @@
-import { assign, setup } from 'xstate';
-import { threadsMachineConfig } from '../machines/threadsMachine';
-
-export enum BaseState {
-    Idle = 'idle',
-    LoadingChannel = 'loadingChannel',
-    LoadingThreads = 'loadingThreads',
-    Active = 'active',
-    Error = 'error',
-}
-
-export enum Actions {
-    INITIALIZE = 'INITIALIZE',
-    FETCH_CHANNEL_DETAIL = 'FETCH_CHANNEL_DETAIL',
-    SET_CHANNEL_DETAIL = 'SET_CHANNEL_DETAIL',
-    FETCH_THREADS = 'FETCH_THREADS',
-    SET_THREADS = 'SET_THREADS',
-    ERROR = 'ERROR',
-}
-
-// Type definitions for the event data
-type InitializeEventData = { channelId?: string; postParentId?: string; role?: string };
-type ChannelDetailEventData = { id: string };
-type SetChannelDetailEventData = { channelsDetail: any };
-type SetThreadsEventData = { threadData: any[] };
-type ErrorEventData = { error: any };
-
-export const dialogThreadsXstate = setup({
-    types: {
-        context: {} as {
-            channelId?: string;
-            postParentId?: string;
-            role?: string;
-            channelsDetail: any;
-            threadData: any[];
-            loading: boolean;
-            error: any;
-        },
-        events: {} as
-            | { type: typeof Actions.INITIALIZE; data: InitializeEventData }
-            | { type: typeof Actions.FETCH_CHANNEL_DETAIL; data: ChannelDetailEventData }
-            | { type: typeof Actions.SET_CHANNEL_DETAIL; data: SetChannelDetailEventData }
-            | { type: typeof Actions.FETCH_THREADS; data?: {} }
-            | { type: typeof Actions.SET_THREADS; data: SetThreadsEventData }
-            | { type: typeof Actions.ERROR; data: ErrorEventData },
-    },
-    actions: {
-        setInitialContext: assign({
-            channelId: ({ event }) => {
-                if (event.type === Actions.INITIALIZE) {
-                    return event.data.channelId;
-                }
-                return undefined;
-            },
-            postParentId: ({ event }) => {
-                if (event.type === Actions.INITIALIZE) {
-                    return event.data.postParentId;
-                }
-                return undefined;
-            },
-            role: ({ event }) => {
-                if (event.type === Actions.INITIALIZE) {
-                    return event.data.role;
-                }
-                return undefined;
-            },
-            loading: true,
-            error: null,
-        }),
-        setChannelDetail: assign({
-            channelsDetail: ({ event }) => {
-                if (event.type === Actions.SET_CHANNEL_DETAIL) {
-                    return event.data.channelsDetail;
-                }
-                return null;
-            },
-            loading: false,
-        }),
-        setThreads: assign({
-            threadData: ({ event }) => {
-                if (event.type === Actions.SET_THREADS) {
-                    return event.data.threadData;
-                }
-                return [];
-            },
-            loading: false,
-        }),
-        setError: assign({
-            error: ({ event }) => {
-                if (event.type === Actions.ERROR) {
-                    return event.data.error;
-                }
-                return null;
-            },
-            loading: false,
-        }),
-        setLoading: assign({
-            loading: true,
-        }),
-    },
-}).createMachine({
-    id: 'dialogThreads',
-    initial: BaseState.Idle,
-    context: {
-        channelId: undefined,
-        postParentId: undefined,
-        role: undefined,
-        channelsDetail: null,
-        threadData: [],
-        loading: true,
-        error: null,
-    },
-    states: {
-        [BaseState.Idle]: {
-            on: {
-                [Actions.INITIALIZE]: {
-                    target: BaseState.LoadingChannel,
-                    actions: 'setInitialContext',
-                },
-            },
-        },
-        [BaseState.LoadingChannel]: {
-            on: {
-                [Actions.SET_CHANNEL_DETAIL]: {
-                    target: BaseState.LoadingThreads,
-                    actions: 'setChannelDetail',
-                },
-                [Actions.ERROR]: {
-                    target: BaseState.Error,
-                    actions: 'setError',
-                },
-            },
-        },
-        [BaseState.LoadingThreads]: {
-            on: {
-                [Actions.SET_THREADS]: {
-                    target: BaseState.Active,
-                    actions: 'setThreads',
-                },
-                [Actions.ERROR]: {
-                    target: BaseState.Error,
-                    actions: 'setError',
-                },
-            },
-        },
-        [BaseState.Active]: {
-            on: {
-                [Actions.FETCH_THREADS]: {
-                    target: BaseState.LoadingThreads,
-                    actions: 'setLoading',
-                },
-            },
-        },
-        [BaseState.Error]: {
-            on: {
-                [Actions.INITIALIZE]: {
-                    target: BaseState.LoadingChannel,
-                    actions: 'setInitialContext',
-                },
-            },
-        },
-    },
-});

package/src/screens/index.ts

@@ -1,4 +0,0 @@
-export * from './inbox/Inbox';
-export * from './inbox/DialogMessages';
-export * from './inbox/DialogThreads';
-export * from './inbox/DialogThreadMessages'

package/tsconfig.json

@@ -1,13 +0,0 @@
-{
-    "extends": "../../../tsconfig.json",
-    "compilerOptions": {
-        "rootDir": "src",
-        "outDir": "lib",
-        "declaration": true,
-        "declarationDir": "lib",
-        "types": ["@types/node", "@types/jest", "../../../typings"],
-        "skipLibCheck": true
-    },
-    "include": ["src"],
-    "exclude": ["../../../node_modules", "node_modules", "lib", "lib", "webpack.config.js", "rollup.config.mjs"]
-}

package/webpack.config.js

@@ -1,58 +0,0 @@
-const nodeExternals = require('webpack-node-externals');
-const webpack = require('webpack');
-const path = require('path');
-const fs = require('fs');
-
-const webpackOpts = {
-    mode: 'development',
-    entry: './src/index.ts',
-    target: 'node',
-    output: {
-        path: path.join(__dirname, 'lib'),
-        filename: 'index.js',
-        libraryTarget: 'commonjs2',
-    },
-    node: {
-        __dirname: false,
-    },
-    resolve: {
-        extensions: ['.ts', '.tsx', '.graphql', '.gql'],
-    },
-    plugins: [
-        new webpack.LoaderOptionsPlugin({
-            options: {
-                test: /\.tsx?$/,
-                ts: {
-                    compiler: 'typescript',
-                    configFile: 'tsconfig.json',
-                },
-                tslint: {
-                    emitErrors: true,
-                    failOnHint: true,
-                },
-            },
-        }),
-    ],
-    devtool: 'source-map',
-    module: {
-        rules: [
-            {
-                test: /\.tsx?$/,
-                use: 'ts-loader',
-            },
-            {
-                test: /\.graphql?/,
-                exclude: /node_modules/,
-                use: 'raw-loader',
-            },
-            {
-                test: /\.(gql)$/,
-                exclude: /node_modules/,
-                use: ['graphql-tag/loader'],
-            },
-        ],
-    },
-    externals: [nodeExternals({ modulesDir: '../../../node_modules' }), nodeExternals()],
-};
-
-module.exports = webpackOpts;