@messenger-box/platform-mobile 10.0.3-alpha.5 → 10.0.3-alpha.50

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

@@ -0,0 +1,313 @@
+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);

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

@@ -0,0 +1,196 @@
+import { assign, setup } from 'xstate';
+import { merge } from 'lodash-es';
+
+export const enum Actions {
+    INITIAL_CONTEXT = 'INITIAL_CONTEXT',
+    ERROR_HANDLED = 'ERROR_HANDLED',
+    FETCH_CHANNELS = 'FETCH_CHANNELS',
+    REFRESH_CHANNELS = 'REFRESH_CHANNELS',
+    SELECT_CHANNEL = 'SELECT_CHANNEL',
+    START_LOADING = 'START_LOADING',
+    STOP_LOADING = 'STOP_LOADING',
+    SET_SEARCH_QUERY = 'SET_SEARCH_QUERY',
+}
+
+export const enum BaseState {
+    Idle = 'idle',
+    Error = 'error',
+    Loading = 'loading',
+    Done = 'done',
+    FetchChannels = 'fetchChannels',
+}
+
+export const enum MainState {
+    RefreshChannels = 'refreshChannels',
+    SelectChannel = 'selectChannel',
+}
+
+export const dialogsXstate = setup({
+    types: {
+        context: {} as {
+            channels: any[];
+            refreshing: boolean;
+            loading: boolean;
+            error: string | null;
+            searchQuery: string;
+            selectedChannelId: string | null;
+            channelRole: string | null;
+            channelFilters: Record<string, any>;
+            supportServices: boolean;
+        },
+    },
+    actions: {
+        errorState: assign(({ context, event }) => {
+            return {
+                ...context,
+                error: event.data?.message || 'An error occurred',
+                loading: false,
+                refreshing: false,
+            };
+        }),
+        setInitialContext: assign(({ context, event }) => {
+            return merge({
+                ...context,
+                channelRole: event.data?.channelRole || null,
+                channelFilters: event.data?.channelFilters || {},
+                supportServices: event.data?.supportServices || false,
+                selectedChannelId: event.data?.selectedChannelId || null,
+                loading: true,
+            });
+        }),
+        setChannels: assign(({ context, event }) => {
+            return {
+                ...context,
+                channels: event.data?.channels || [],
+                loading: false,
+                refreshing: false,
+            };
+        }),
+        startRefreshing: assign(({ context }) => {
+            return {
+                ...context,
+                refreshing: true,
+            };
+        }),
+        stopRefreshing: assign(({ context }) => {
+            return {
+                ...context,
+                refreshing: false,
+            };
+        }),
+        startLoading: assign(({ context }) => {
+            return {
+                ...context,
+                loading: true,
+            };
+        }),
+        stopLoading: assign(({ context }) => {
+            return {
+                ...context,
+                loading: false,
+            };
+        }),
+        setSearchQuery: assign(({ context, event }) => {
+            return {
+                ...context,
+                searchQuery: event.data?.searchQuery || '',
+            };
+        }),
+        selectChannel: assign(({ context, event }) => {
+            return {
+                ...context,
+                selectedChannelId: event.data?.channelId || null,
+            };
+        }),
+    },
+    guards: {
+        hasChannels: ({ context }) => {
+            return context.channels.length > 0;
+        },
+    },
+}).createMachine({
+    id: 'dialogs-view',
+    initial: BaseState.Idle,
+    context: {
+        channels: [],
+        refreshing: false,
+        loading: false,
+        error: null,
+        searchQuery: '',
+        selectedChannelId: null,
+        channelRole: null,
+        channelFilters: {},
+        supportServices: false,
+    },
+    states: {
+        [BaseState.Idle]: {
+            on: {
+                [Actions.INITIAL_CONTEXT]: {
+                    target: BaseState.FetchChannels,
+                    actions: ['setInitialContext'],
+                },
+                [Actions.REFRESH_CHANNELS]: {
+                    target: MainState.RefreshChannels,
+                    actions: ['startRefreshing'],
+                },
+                [Actions.SELECT_CHANNEL]: {
+                    target: MainState.SelectChannel,
+                    actions: ['selectChannel'],
+                },
+                [Actions.START_LOADING]: {
+                    target: BaseState.Idle,
+                    actions: ['startLoading'],
+                },
+                [Actions.STOP_LOADING]: {
+                    target: BaseState.Idle,
+                    actions: ['stopLoading'],
+                },
+                [Actions.SET_SEARCH_QUERY]: {
+                    target: BaseState.Idle,
+                    actions: ['setSearchQuery'],
+                },
+            },
+        },
+        [BaseState.Error]: {
+            entry: ['errorState'],
+            on: {
+                [Actions.ERROR_HANDLED]: {
+                    target: BaseState.Idle,
+                },
+            },
+        },
+        [BaseState.FetchChannels]: {
+            invoke: {
+                src: 'fetchChannels',
+                input: ({ context, event }) => ({ context, event }),
+                onDone: {
+                    target: BaseState.Idle,
+                    actions: ['setChannels'],
+                },
+                onError: {
+                    target: BaseState.Error,
+                    actions: ['errorState'],
+                },
+            },
+        },
+        [MainState.RefreshChannels]: {
+            invoke: {
+                src: 'refreshChannels',
+                input: ({ context, event }) => ({ context, event }),
+                onDone: {
+                    target: BaseState.Idle,
+                    actions: ['setChannels'],
+                },
+                onError: {
+                    target: BaseState.Error,
+                    actions: ['errorState'],
+                },
+            },
+        },
+        [MainState.SelectChannel]: {
+            always: {
+                target: BaseState.Idle,
+            },
+        },
+    },
+} as any);