@messenger-box/platform-mobile 0.0.1-alpha.379 → 0.0.1-alpha.382

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@messenger-box/platform-mobile",
-    "version": "0.0.1-alpha.379",
+    "version": "0.0.1-alpha.382",
     "description": "Sample core for higher packages to depend on",
     "license": "ISC",
     "author": "CDMBase LLC",
@@ -19,8 +19,8 @@
         "watch": "yarn build:lib:watch"
     },
     "dependencies": {
-        "@messenger-box/core": "0.0.1-alpha.379",
-        "@messenger-box/platform-client": "0.0.1-alpha.379",
+        "@messenger-box/core": "0.0.1-alpha.382",
+        "@messenger-box/platform-client": "0.0.1-alpha.382",
         "base-64": "1.0.0",
         "react-native-gifted-chat": "1.0.4"
     },
@@ -40,5 +40,5 @@
     "typescript": {
         "definition": "lib/index.d.ts"
     },
-    "gitHead": "de3199a861a5d9a761aeeccf4ad0e8324eec58bd"
+    "gitHead": "c724886c4c94ddf72d0ee9c5acf253c699050830"
 }

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

@@ -30,8 +30,10 @@ import {
     useGetNewMongooseObjectIdQuery,
     useOnChatMessageAddedSubscription,
     IPreDefinedRole,
+    useSendExpoNotificationOnPostMutation,
+    IPost,
 } from '@messenger-box/platform-client';
-import { IFileInfo } from '@messenger-box/core';
+import { IExpoNotificationData, IFileInfo } from '@messenger-box/core';
 import { config } from '../config';
 import { userSelector } from '@adminide-stack/user-auth0-client';
 import { SlackMessage, ImageViewerModal } from '../components/SlackMessageContainer';
@@ -108,6 +110,8 @@ const ConversationViewComponent = ({ channelId, role }: any) => {
 
     const [sendMsg] = useSendMessagesMutation();
 
+    const [sendExpoNotificationOnPostMutation] = useSendExpoNotificationOnPostMutation();
+
     const {
         data,
         loading: messageLoading,
@@ -391,45 +395,45 @@ const ConversationViewComponent = ({ channelId, role }: any) => {
         if (imageSource.cancelled) setLoading(false);
     };
 
-    const sendPushNotification = async (title: String, body: String, data: any, to: any) => {
-        try {
-            const response = await fetch('https://exp.host/--/api/v2/push/send/', {
-                method: 'POST',
-                headers: {
-                    Accept: 'application/json',
-                    'Accept-Encoding': 'gzip, deflate',
-                    'Content-Type': 'application/json',
-                },
-                body: JSON.stringify({
-                    to: to,
-                    data: data,
-                    title: title,
-                    body: body,
-                    sound: Platform.OS === 'android' ? undefined || null : 'default',
-                }),
-            });
-            const result: any = await response.json();
-            console.log('expo api response', result);
-        } catch (error) {
-            console.error('Error:', error);
-        }
+    // const sendPushNotification = async (title: String, body: String, data: any, to: any) => {
+    //     try {
+    //         const response = await fetch('https://exp.host/--/api/v2/push/send/', {
+    //             method: 'POST',
+    //             headers: {
+    //                 Accept: 'application/json',
+    //                 'Accept-Encoding': 'gzip, deflate',
+    //                 'Content-Type': 'application/json',
+    //             },
+    //             body: JSON.stringify({
+    //                 to: to,
+    //                 data: data,
+    //                 title: title,
+    //                 body: body,
+    //                 sound: Platform.OS === 'android' ? undefined || null : 'default',
+    //             }),
+    //         });
+    //         const result: any = await response.json();
+    //         console.log('expo api response', result);
+    //     } catch (error) {
+    //         console.error('Error:', error);
+    //     }
 
-        // fetch('https://exp.host/--/api/v2/push/send/', {
-        //     method: 'POST',
-        //     headers: {
-        //         Accept: 'application/json',
-        //         'Accept-Encoding': 'gzip, deflate',
-        //         'Content-Type': 'application/json',
-        //     },
-        //     body: JSON.stringify({
-        //         to: to,
-        //         data: data,
-        //         title: title,
-        //         body: body,
-        //         sound: Platform.OS === 'android' ? null : 'default',
-        //     }),
-        // });
-    };
+    //     // fetch('https://exp.host/--/api/v2/push/send/', {
+    //     //     method: 'POST',
+    //     //     headers: {
+    //     //         Accept: 'application/json',
+    //     //         'Accept-Encoding': 'gzip, deflate',
+    //     //         'Content-Type': 'application/json',
+    //     //     },
+    //     //     body: JSON.stringify({
+    //     //         to: to,
+    //     //         data: data,
+    //     //         title: title,
+    //     //         body: body,
+    //     //         sound: Platform.OS === 'android' ? null : 'default',
+    //     //     }),
+    //     // });
+    // };
 
     // const handleSend = useCallback(
     //     async (message: string) => {
@@ -520,6 +524,13 @@ const ConversationViewComponent = ({ channelId, role }: any) => {
             if (!channelId) return;
             if (!message && message != ' ' && images.length == 0) return;
 
+            const notificationData: IExpoNotificationData = {
+                url: config.INBOX_MESSEGE_PATH,
+                params: { channelId, hideTabBar: true },
+                screen: 'DialogMessages',
+                other: { sound: Platform.OS === 'android' ? undefined || null : 'default' },
+            };
+
             if (images && images.length > 0) {
                 const postId: any = mongooseObjectId?.getNewMongooseObjectId;
                 setLoading(true);
@@ -551,6 +562,7 @@ const ConversationViewComponent = ({ channelId, role }: any) => {
                             channelId,
                             content: message,
                             files,
+                            notificationParams: notificationData,
                         },
                         update: (cache, { data, errors }: any) => {
                             if (!data || errors) {
@@ -572,7 +584,7 @@ const ConversationViewComponent = ({ channelId, role }: any) => {
                             setLoading(false);
                             setMsg('');
                             const msg = message == '' ? 'Send a file' : message;
-                            fetchTokenAndSendPushNotification(msg, channelId);
+                            //sendPushNotification(data?.sendMessage, channelId);
                         },
                     });
                 }
@@ -582,6 +594,7 @@ const ConversationViewComponent = ({ channelId, role }: any) => {
                     variables: {
                         channelId,
                         content: message,
+                        notificationParams: notificationData,
                     },
                     update: (cache, { data, errors }: any) => {
                         if (!data || errors) {
@@ -593,7 +606,7 @@ const ConversationViewComponent = ({ channelId, role }: any) => {
                         setChannelToTop(channelToTop + 1);
                         setLoading(false);
                         setMsg('');
-                        fetchTokenAndSendPushNotification(message, channelId);
+                        // sendPushNotification(data?.sendMessage, channelId);
                     },
                 });
             }
@@ -601,40 +614,56 @@ const ConversationViewComponent = ({ channelId, role }: any) => {
         [mongooseObjectId, setChannelMessages, channelId, images, channelToTop, expoTokens],
     );
 
-    const fetchTokenAndSendPushNotification = (message: any, channelId: any) => {
-        const givenName = auth?.profile?.given_name ?? '';
-        const familyName = auth?.profile?.family_name ?? '';
-        const fullName = givenName ? givenName + ' ' + familyName : '';
-        const title: String = fullName ? fullName : 'Message';
-        const body: String = message;
-        const notificationData: any = {
-            url: config.INBOX_MESSEGE_PATH,
-            params: { channelId, hideTabBar: true },
-            screen: 'DialogMessages',
-        };
-        refetchChannelDetail({ id: channelId?.toString() })?.then((res: any) => {
-            if (res?.data?.viewChannelDetail?.members?.length) {
-                const channelData: any =
-                    res?.data?.viewChannelDetail?.members?.filter((mu: any) => mu?.user?.id != auth?.id) ?? [];
-                const tokens: any =
-                    channelData
-                        ?.map(
-                            (u: any) =>
-                                u?.user?.tokens
-                                    ?.filter((t: any) => t?.type == 'EXPO_NOTIFICATION_TOKEN')
-                                    ?.map((et: any) => et?.token) ?? [],
-                        )
-                        ?.flat(1)
-                        ?.filter((t: any) => t)
-                        ?.filter((value: any, index: any, array: any) => array.indexOf(value) === index) ?? [];
-                console.log('expo to', JSON.stringify(tokens));
-                if (tokens?.length > 0) {
-                    const to: any = tokens?.length > 0 ? tokens : [];
-                    sendPushNotification(title, body, notificationData, to);
-                }
-            }
-        });
-    };
+    // const sendPushNotification = async (post: IPost, channelId: string) => {
+    //     const notificationData: IExpoNotificationData = {
+    //         url: config.INBOX_MESSEGE_PATH,
+    //         params: { channelId, hideTabBar: true },
+    //         screen: 'DialogMessages',
+    //         other: { sound: Platform.OS === 'android' ? undefined || null : 'default' },
+    //     };
+
+    //     await sendExpoNotificationOnPostMutation({
+    //         variables: {
+    //             postId: post?.id?.toString(),
+    //             notificationData,
+    //         },
+    //     });
+    // };
+
+    // const fetchTokenAndSendPushNotification = (message: any, channelId: any) => {
+    //     const givenName = auth?.profile?.given_name ?? '';
+    //     const familyName = auth?.profile?.family_name ?? '';
+    //     const fullName = givenName ? givenName + ' ' + familyName : '';
+    //     const title: String = fullName ? fullName : 'Message';
+    //     const body: String = message;
+    //     const notificationData: any = {
+    //         url: config.INBOX_MESSEGE_PATH,
+    //         params: { channelId, hideTabBar: true },
+    //         screen: 'DialogMessages',
+    //     };
+    //     refetchChannelDetail({ id: channelId?.toString() })?.then((res: any) => {
+    //         if (res?.data?.viewChannelDetail?.members?.length) {
+    //             const channelData: any =
+    //                 res?.data?.viewChannelDetail?.members?.filter((mu: any) => mu?.user?.id != auth?.id) ?? [];
+    //             const tokens: any =
+    //                 channelData
+    //                     ?.map(
+    //                         (u: any) =>
+    //                             u?.user?.tokens
+    //                                 ?.filter((t: any) => t?.type == 'EXPO_NOTIFICATION_TOKEN')
+    //                                 ?.map((et: any) => et?.token) ?? [],
+    //                     )
+    //                     ?.flat(1)
+    //                     ?.filter((t: any) => t)
+    //                     ?.filter((value: any, index: any, array: any) => array.indexOf(value) === index) ?? [];
+    //             console.log('expo to', JSON.stringify(tokens));
+    //             if (tokens?.length > 0) {
+    //                 const to: any = tokens?.length > 0 ? tokens : [];
+    //                 sendPushNotification(title, body, notificationData, to);
+    //             }
+    //         }
+    //     });
+    // };
 
     // const handleSend1 = async (message: string) => {
     //     if (!channelId) return;
@@ -819,23 +848,88 @@ const ConversationViewComponent = ({ channelId, role }: any) => {
             }
 
             return (
-                <Box bg={CALL_TO_ACTION_BOX_BGCOLOR} borderRadius={15} pb={2}>
-                    {attachment?.callToAction ? (
-                        <Button
-                            variant={'outline'}
-                            size={'sm'}
-                            borderColor={CALL_TO_ACTION_BUTTON_BORDERCOLOR}
-                            onPress={() => action && params && navigation.navigate(action, params)}
-                            // onPress={() => navigation.navigate(action, { reservationId: actionId })}
+                <>
+                    {attachment?.callToAction && action ? (
+                        <Box bg={CALL_TO_ACTION_BOX_BGCOLOR} borderRadius={15} pb={2}>
+                            <Button
+                                variant={'outline'}
+                                size={'sm'}
+                                borderColor={CALL_TO_ACTION_BUTTON_BORDERCOLOR}
+                                onPress={() => action && params && navigation.navigate(action, params)}
+                                // onPress={() => navigation.navigate(action, { reservationId: actionId })}
+                            >
+                                <Text color={CALL_TO_ACTION_TEXT_COLOR}>{attachment.callToAction.title}</Text>
+                            </Button>
+                            <MessageText
+                                {...props}
+                                textStyle={{
+                                    left: { marginLeft: 5, color: CALL_TO_ACTION_TEXT_COLOR, paddingHorizontal: 2 },
+                                }}
+                            />
+                        </Box>
+                    ) : (
+                        <TouchableHighlight
+                            underlayColor={'#c0c0c0'}
+                            style={{ width: '100%' }}
+                            onPress={() =>
+                                navigation.navigate(config.THREAD_MESSEGE_PATH, {
+                                    channelId: channelId,
+                                    title: 'Message',
+                                    postParentId: currentMessage?._id,
+                                    isPostParentIdThread: true,
+                                })
+                            }
                         >
-                            <Text color={CALL_TO_ACTION_TEXT_COLOR}>{attachment.callToAction.title}</Text>
-                        </Button>
-                    ) : null}
-                    <MessageText
+                            <>
+                                <MessageText {...props} textStyle={{ left: { marginLeft: 5 } }} />
+                                {currentMessage?.replies?.data?.length > 0 && (
+                                    <HStack space={1} px={1} alignItems={'center'}>
+                                        <HStack>
+                                            {currentMessage?.replies?.data
+                                                ?.filter(
+                                                    (v: any, i: any, a: any) =>
+                                                        a.findIndex((t: any) => t?.author?.id === v?.author?.id) === i,
+                                                )
+                                                ?.slice(0, 2)
+                                                ?.reverse()
+                                                ?.map((p: any, i: Number) => (
+                                                    <Avatar
+                                                        key={'key' + i}
+                                                        bg={'transparent'}
+                                                        size={6}
+                                                        // top={i == 1 ? 4 : 0}
+                                                        // right={i == 1 ? -2 : 0}
+                                                        // zIndex={i == 1 ? 5 : 1}
+                                                        _image={{
+                                                            borderRadius: 6,
+                                                            borderWidth: 2,
+                                                            borderColor: '#fff',
+                                                        }}
+                                                        source={{
+                                                            uri: p?.author?.picture,
+                                                        }}
+                                                    >
+                                                        {startCase(p?.author?.username?.charAt(0))}
+                                                    </Avatar>
+                                                ))}
+                                        </HStack>
+                                        <Text fontSize={12} fontWeight={'bold'} color={'blue.800'}>
+                                            {currentMessage?.replies?.totalCount}{' '}
+                                            {currentMessage?.replies?.totalCount == 1 ? 'reply' : 'replies'}
+                                        </Text>
+                                        <Text fontSize={12} fontWeight={'bold'} color={'gray.500'}>
+                                            {lastReply ? createdAtText(lastReply?.createdAt) : ''}
+                                        </Text>
+                                    </HStack>
+                                )}
+                            </>
+                        </TouchableHighlight>
+                    )}
+                    {/* <MessageText
                         {...props}
                         textStyle={{ left: { marginLeft: 5, color: CALL_TO_ACTION_TEXT_COLOR, paddingHorizontal: 2 } }}
-                    />
-                </Box>
+                    /> */}
+                </>
             );
         } else {
             return (

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

@@ -32,8 +32,11 @@ import {
     useUploadFilesNative,
     useGetNewMongooseObjectIdQuery,
     useOnThreadChatMessageAddedSubscription,
+    IPreDefinedRole,
+    useSendExpoNotificationOnPostMutation,
+    IPost,
 } from '@messenger-box/platform-client';
-import { IFileInfo } from '@messenger-box/core';
+import { IExpoNotificationData, IFileInfo } from '@messenger-box/core';
 import { config } from '../config';
 import { userSelector } from '@adminide-stack/user-auth0-client';
 import { SlackMessage, ImageViewerModal } from '../components/SlackMessageContainer';
@@ -110,6 +113,7 @@ const ThreadConversationViewComponent = ({ channelId, postParentId, isPostParent
     });
 
     const [sendThreadMessage] = useSendThreadMessageMutation();
+    const [sendExpoNotificationOnPostMutation] = useSendExpoNotificationOnPostMutation();
 
     const [getThreadMessages, { data: threadMessagesData, loading: threadLoading, refetch: refetchThreadMessages }] =
         useThreadMessagesLazyQuery({
@@ -327,29 +331,29 @@ const ThreadConversationViewComponent = ({ channelId, postParentId, isPostParent
         if (imageSource.cancelled) setLoading(false);
     };
 
-    const sendPushNotification = async (title: String, body: String, data: any, to: any) => {
-        try {
-            const response = await fetch('https://exp.host/--/api/v2/push/send/', {
-                method: 'POST',
-                headers: {
-                    Accept: 'application/json',
-                    'Accept-Encoding': 'gzip, deflate',
-                    'Content-Type': 'application/json',
-                },
-                body: JSON.stringify({
-                    to: to,
-                    data: data,
-                    title: title,
-                    body: body,
-                    sound: Platform.OS === 'android' ? undefined || null : 'default',
-                }),
-            });
-            const result: any = await response.json();
-            console.log('expo api response', result);
-        } catch (error) {
-            console.error('Error:', error);
-        }
-    };
+    // const sendPushNotification = async (title: String, body: String, data: any, to: any) => {
+    //     try {
+    //         const response = await fetch('https://exp.host/--/api/v2/push/send/', {
+    //             method: 'POST',
+    //             headers: {
+    //                 Accept: 'application/json',
+    //                 'Accept-Encoding': 'gzip, deflate',
+    //                 'Content-Type': 'application/json',
+    //             },
+    //             body: JSON.stringify({
+    //                 to: to,
+    //                 data: data,
+    //                 title: title,
+    //                 body: body,
+    //                 sound: Platform.OS === 'android' ? undefined || null : 'default',
+    //             }),
+    //         });
+    //         const result: any = await response.json();
+    //         console.log('expo api response', result);
+    //     } catch (error) {
+    //         console.error('Error:', error);
+    //     }
+    // };
 
     // const ObjectId = (m = Math, d = Date, h = 16, s = (s:any) => m.floor(s).toString(h)) =>
     // s(d.now() / 1000) + ' '.repeat(h).replace(/./g, () => s(m.random() * h))
@@ -424,7 +428,12 @@ const ThreadConversationViewComponent = ({ channelId, postParentId, isPostParent
                             //     setParentId(responseMessage?.id);
                             // }
                             const msg = message == '' ? 'Send a file' : message;
-                            fetchTokenAndSendPushNotification(msg, channelId, parentId);
+                            sendPushNotification(
+                                responseMessage,
+                                channelId,
+                                parentId,
+                                data?.sendThreadMessage?.data?.id,
+                            );
                         },
                     });
                 }
@@ -456,7 +465,7 @@ const ThreadConversationViewComponent = ({ channelId, postParentId, isPostParent
                         // if (!parentId || parentId == 0) {
                         //     setParentId(responseMessage?.id);
                         // }
-                        fetchTokenAndSendPushNotification(message, channelId, parentId);
+                        sendPushNotification(responseMessage, channelId, parentId, data?.sendThreadMessage?.data?.id);
                     },
                 });
             }
@@ -464,48 +473,66 @@ const ThreadConversationViewComponent = ({ channelId, postParentId, isPostParent
         [mongooseObjectId, setChannelMessages, channelId, images, parentId, expoTokens],
     );
 
-    const fetchTokenAndSendPushNotification = (message: any, channelId: any, parentId: any) => {
-        const givenName = auth?.profile?.given_name ?? '';
-        const familyName = auth?.profile?.family_name ?? '';
-        const fullName = givenName ? givenName + ' ' + familyName : '';
-        const title: String = fullName ? fullName : 'Message';
-        const body: String = message;
-        const notificationData: any = {
+    const sendPushNotification = async (post: IPost, channelId: string, parentId: any, threadId: string) => {
+        const notificationData: IExpoNotificationData = {
             url: config.THREAD_MESSEGE_PATH,
             params: { channelId, title: params?.title ?? 'Thread', postParentId: parentId, hideTabBar: true },
             screen: 'DialogThreadMessages',
+            thread: { id: threadId },
+            other: { sound: Platform.OS === 'android' ? undefined || null : 'default' },
         };
         if (parentId || parentId == 0) {
-            refetchThreadMessages({
-                channelId: !parentId || parentId == 0 ? null : channelId?.toString(),
-                role: role?.toString(),
-                postParentId: !parentId || parentId == 0 ? null : parentId?.toString(),
-            })?.then((res: any) => {
-                if (res?.data?.threadMessages?.data?.length > 0) {
-                    const participants =
-                        res?.data?.threadMessages?.data?.map((t: any) => t?.participants)?.flat(1) ?? [];
-                    const participantsTokens =
-                        participants?.length > 0
-                            ? participants
-                                  ?.filter((u: any) => u?.id != auth?.id)
-                                  ?.map((p: any) => p.tokens)
-                                  ?.flat(1)
-                            : [];
-                    const expoTokens =
-                        participantsTokens?.length > 0
-                            ? participantsTokens
-                                  ?.filter((t: any) => t?.type == 'EXPO_NOTIFICATION_TOKEN')
-                                  ?.map((et: any) => et?.token)
-                            : [];
-                    if (expoTokens?.length > 0) {
-                        const to: any = expoTokens;
-                        sendPushNotification(title, body, notificationData, to);
-                    }
-                }
+            await sendExpoNotificationOnPostMutation({
+                variables: {
+                    postId: post?.id?.toString(),
+                    notificationData,
+                },
             });
         }
     };
 
+    // const fetchTokenAndSendPushNotification = (message: any, channelId: any, parentId: any) => {
+    //     const givenName = auth?.profile?.given_name ?? '';
+    //     const familyName = auth?.profile?.family_name ?? '';
+    //     const fullName = givenName ? givenName + ' ' + familyName : '';
+    //     const title: String = fullName ? fullName : 'Message';
+    //     const body: String = message;
+    //     const notificationData: any = {
+    //         url: config.THREAD_MESSEGE_PATH,
+    //         params: { channelId, title: params?.title ?? 'Thread', postParentId: parentId, hideTabBar: true },
+    //         screen: 'DialogThreadMessages',
+    //     };
+    //     if (parentId || parentId == 0) {
+    //         refetchThreadMessages({
+    //             channelId: !parentId || parentId == 0 ? null : channelId?.toString(),
+    //             role: role?.toString(),
+    //             postParentId: !parentId || parentId == 0 ? null : parentId?.toString(),
+    //         })?.then((res: any) => {
+    //             if (res?.data?.threadMessages?.data?.length > 0) {
+    //                 const participants =
+    //                     res?.data?.threadMessages?.data?.map((t: any) => t?.participants)?.flat(1) ?? [];
+    //                 const participantsTokens =
+    //                     participants?.length > 0
+    //                         ? participants
+    //                               ?.filter((u: any) => u?.id != auth?.id)
+    //                               ?.map((p: any) => p.tokens)
+    //                               ?.flat(1)
+    //                         : [];
+    //                 const expoTokens =
+    //                     participantsTokens?.length > 0
+    //                         ? participantsTokens
+    //                               ?.filter((t: any) => t?.type == 'EXPO_NOTIFICATION_TOKEN')
+    //                               ?.map((et: any) => et?.token)
+    //                         : [];
+    //                 if (expoTokens?.length > 0) {
+    //                     const to: any = expoTokens;
+    //                     sendPushNotification(title, body, notificationData, to);
+    //                 }
+    //             }
+    //         });
+    //     }
+    // };
+
     const messageList = useMemo(() => {
         let currentDate = '';
         let res: any = [];
@@ -566,28 +593,64 @@ const ThreadConversationViewComponent = ({ channelId, postParentId, isPostParent
             const attachment = currentMessage?.propsConfiguration?.contents?.attachment;
             let action: string = '';
             let actionId: any = '';
-            if (attachment?.callToAction?.link?.includes('my-reservation-details')) {
+            let params: any = {};
+            if (attachment?.callToAction?.extraParams) {
+                const extraParams: any = attachment?.callToAction?.extraParams;
+                const route: any = extraParams?.route ?? null;
+                let path: any = null;
+                let param: any = null;
+                if (role && role == IPreDefinedRole.Guest) {
+                    path = route?.guest?.name ? route?.guest?.name ?? null : null;
+                    param = route?.guest?.params ? route?.guest?.params ?? null : null;
+                } else if (role && role == IPreDefinedRole.Owner) {
+                    path = route?.host?.name ? route?.host?.name ?? null : null;
+                    param = route?.host?.params ? route?.host?.params ?? null : null;
+                } else {
+                    path = route?.host?.name ? route?.host?.name ?? null : null;
+                    param = route?.host?.params ? route?.host?.params ?? null : null;
+                }
+
+                action = path;
+                params = { ...param };
+            } else if (attachment?.callToAction?.link) {
                 action = CALL_TO_ACTION_PATH;
                 actionId = attachment?.callToAction?.link.split('/').pop();
+                params = { reservationId: actionId };
             }
 
+            // if (attachment?.callToAction?.link?.includes('my-reservation-details')) {
+            //     action = CALL_TO_ACTION_PATH;
+            //     actionId = attachment?.callToAction?.link.split('/').pop();
+            // }
+
             return (
-                <Box bg={CALL_TO_ACTION_BOX_BGCOLOR} borderRadius={15} pb={2}>
-                    {attachment?.callToAction ? (
-                        <Button
-                            variant={'outline'}
-                            size={'sm'}
-                            borderColor={CALL_TO_ACTION_BUTTON_BORDERCOLOR}
-                            onPress={() => navigation.navigate(action, { reservationId: actionId })}
-                        >
-                            <Text color={CALL_TO_ACTION_TEXT_COLOR}>{attachment.callToAction.title}</Text>
-                        </Button>
-                    ) : null}
-                    <MessageText
+                <>
+                    {attachment?.callToAction && action ? (
+                        <Box bg={CALL_TO_ACTION_BOX_BGCOLOR} borderRadius={15} pb={2}>
+                            <Button
+                                variant={'outline'}
+                                size={'sm'}
+                                borderColor={CALL_TO_ACTION_BUTTON_BORDERCOLOR}
+                                onPress={() => action && params && navigation.navigate(action, params)}
+                                //onPress={() => navigation.navigate(action, { reservationId: actionId })}
+                            >
+                                <Text color={CALL_TO_ACTION_TEXT_COLOR}>{attachment.callToAction.title}</Text>
+                            </Button>
+                            <MessageText
+                                {...props}
+                                textStyle={{
+                                    left: { marginLeft: 5, color: CALL_TO_ACTION_TEXT_COLOR, paddingHorizontal: 2 },
+                                }}
+                            />
+                        </Box>
+                    ) : (
+                        <MessageText {...props} textStyle={{ left: { marginLeft: 5 } }} />
+                    )}
+                    {/* <MessageText
                         {...props}
                         textStyle={{ left: { marginLeft: 5, color: CALL_TO_ACTION_TEXT_COLOR, paddingHorizontal: 2 } }}
-                    />
-                </Box>
+                    /> */}
+                </>
             );
         } else {
             return <MessageText {...props} textStyle={{ left: { marginLeft: 5 } }} />;