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

package/lib/screens/inbox/containers/ThreadConversationView.js

@@ -1,16 +1,38 @@
-import {__awaiter}from'tslib';import React__default,{useState,useRef,useEffect,useCallback,useMemo}from'react';import {Button,Spinner,VStack,HStack,Avatar,AvatarFallbackText,AvatarImage,Box,Text,Center,ButtonText,Image}from'@admin-layout/gluestack-ui-mobile';import {Platform}from'react-native';import {useRoute,useNavigation,useFocusEffect}from'@react-navigation/native';import {useSelector}from'react-redux';import {uniqBy,orderBy,startCase}from'lodash-es';import*as ImagePicker from'expo-image-picker';import {encode}from'base-64';import {MaterialIcons,Ionicons,MaterialCommunityIcons}from'@expo/vector-icons';import {GiftedChat,Send,MessageText,Actions}from'react-native-gifted-chat';import {PreDefinedRole}from'common';import {useCreatePostThreadMutation,useSendExpoNotificationOnPostMutation,useGetPostThreadLazyQuery,OnThreadChatMessageAddedDocument}from'common/lib/generated/generated.js';import {useUploadFilesNative}from'@messenger-box/platform-client';import {objectId}from'@messenger-box/core';import {format,isToday,isYesterday}from'date-fns';import {userSelector}from'@adminide-stack/user-auth0-client';import {config}from'../config/config.js';import Message from'../components/SlackMessageContainer/SlackMessage.js';import ImageViewerModal from'../components/SlackMessageContainer/ImageViewerModal.js';import CachedImage from'../components/CachedImage/index.js';const {
+import React__default,{useState,useRef,useEffect,useCallback,useMemo}from'react';import {Button,Spinner,VStack,HStack,Avatar,AvatarFallbackText,AvatarImage,Box,Text,Center,Image,ButtonText}from'@admin-layout/gluestack-ui-mobile';import {Platform}from'react-native';import {useRoute,useNavigation,useFocusEffect}from'@react-navigation/native';import {useSelector}from'react-redux';import {uniqBy,orderBy,startCase}from'lodash-es';import*as ImagePicker from'expo-image-picker';import {encode}from'base-64';import {MaterialIcons,Ionicons,MaterialCommunityIcons}from'@expo/vector-icons';import {GiftedChat,Actions,MessageText,Send}from'react-native-gifted-chat';import {PreDefinedRole}from'common';import {useCreatePostThreadMutation,useSendExpoNotificationOnPostMutation,useGetPostThreadLazyQuery,OnThreadChatMessageAddedDocument}from'common/lib/generated/generated.js';import {useUploadFilesNative}from'@messenger-box/platform-client';import {objectId}from'@messenger-box/core';import {format,isToday,isYesterday}from'date-fns';import {userSelector}from'@adminide-stack/user-auth0-client';import {config}from'../config/config.js';import Message from'../components/SlackMessageContainer/SlackMessage.js';import ImageViewerModal from'../components/SlackMessageContainer/ImageViewerModal.js';import CachedImage from'../components/CachedImage/index.js';var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const {
   MESSAGES_PER_PAGE,
   CALL_TO_ACTION_BOX_BGCOLOR,
   CALL_TO_ACTION_PATH,
   CALL_TO_ACTION_BUTTON_BORDERCOLOR,
   CALL_TO_ACTION_TEXT_COLOR
 } = config;
-const createdAtText = value => {
-  if (!value) return '';
+const createdAtText = (value) => {
+  if (!value)
+    return "";
   let date = new Date(value);
-  if (isToday(date)) return 'Today';
-  if (isYesterday(date)) return 'Yesterday';
-  return format(new Date(value), 'MMM dd, yyyy');
+  if (isToday(date))
+    return "Today";
+  if (isYesterday(date))
+    return "Yesterday";
+  return format(new Date(value), "MMM dd, yyyy");
 };
 const ThreadConversationViewComponent = ({
   channelId,
@@ -18,7 +40,7 @@ const ThreadConversationViewComponent = ({
   isPostParentIdThread,
   role
 }) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s;
   const {
     params
   } = useRoute();
@@ -26,13 +48,13 @@ const ThreadConversationViewComponent = ({
   const [channelMessages, setChannelMessages] = useState([]);
   const auth = useSelector(userSelector);
   const [totalCount, setTotalCount] = useState(0);
-  const [selectedImage, setImage] = useState('');
+  const [selectedImage, setImage] = useState("");
   const [loadingOldMessages, setLoadingOldMessages] = useState(false);
   const [loadEarlierMsg, setLoadEarlierMsg] = useState(false);
   const navigation = useNavigation();
   const [files, setFiles] = useState([]);
   const [images, setImages] = useState([]);
-  const [msg, setMsg] = useState('');
+  const [msg, setMsg] = useState("");
   const [loading, setLoading] = useState(false);
   const [imageLoading, setImageLoading] = useState(false);
   const [expoTokens, setExpoTokens] = useState([]);
@@ -46,7 +68,6 @@ const ThreadConversationViewComponent = ({
   const [threadPost, setThreadPost] = useState([]);
   const [isScrollToBottom, setIsScrollToBottom] = useState(false);
   const threadMessageListRef = useRef(null);
-  // const [sendThreadMessage] = useSendThreadMessageMutation();
   const [sendThreadMessage] = useCreatePostThreadMutation();
   const [sendExpoNotificationOnPostMutation] = useSendExpoNotificationOnPostMutation();
   const [getThreadMessages, {
@@ -56,30 +77,20 @@ const ThreadConversationViewComponent = ({
     refetch: refetchThreadMessages,
     subscribeToMore
   }] = useGetPostThreadLazyQuery({
-    fetchPolicy: 'cache-and-network'
+    fetchPolicy: "cache-and-network"
   });
   useFocusEffect(React__default.useCallback(() => {
-    // navigation?.setOptions({ title: params?.title ?? 'Thread' });
-    var _a;
+    var _a2;
     navigation.setOptions({
-      title: (_a = params === null || params === void 0 ? void 0 : params.title) !== null && _a !== void 0 ? _a : 'Thread',
-      headerLeft: props => React__default.createElement(Button, {
-        bg: 'transparent',
-        "$pressed-bg": "$trueGray200",
-        "$active-bg": '$trueGray200',
-        onPress: () => navigation.goBack()
-      }, React__default.createElement(MaterialIcons, {
-        size: 20,
-        name: "arrow-back-ios",
-        color: 'black'
-      }))
+      title: (_a2 = params == null ? void 0 : params.title) != null ? _a2 : "Thread",
+      headerLeft: (props) => /* @__PURE__ */ React__default.createElement(Button, { bg: "transparent", "$pressed-bg": "$trueGray200", "$active-bg": "$trueGray200", onPress: () => navigation.goBack() }, /* @__PURE__ */ React__default.createElement(MaterialIcons, { size: 20, name: "arrow-back-ios", color: "black" }))
     });
     if (postParentId) {
       refetchThreadMessages({
-        channelId: channelId === null || channelId === void 0 ? void 0 : channelId.toString(),
-        role: role === null || role === void 0 ? void 0 : role.toString(),
-        postParentId: postParentId === null || postParentId === void 0 ? void 0 : postParentId.toString(),
-        selectedFields: 'id channel post replies replyCount lastReplyAt createdAt updatedAt',
+        channelId: channelId == null ? void 0 : channelId.toString(),
+        role: role == null ? void 0 : role.toString(),
+        postParentId: postParentId == null ? void 0 : postParentId.toString(),
+        selectedFields: "id channel post replies replyCount lastReplyAt createdAt updatedAt",
         limit: MESSAGES_PER_PAGE
       });
     }
@@ -91,49 +102,45 @@ const ThreadConversationViewComponent = ({
     };
   }, [postParentId]));
   useEffect(() => {
-    //if (parentId && parentId == 0) {
     if (channelId && parentId) {
       getThreadMessages({
         variables: {
-          channelId: channelId === null || channelId === void 0 ? void 0 : channelId.toString(),
-          role: role === null || role === void 0 ? void 0 : role.toString(),
-          postParentId: !parentId || parentId == 0 ? null : parentId === null || parentId === void 0 ? void 0 : parentId.toString(),
-          selectedFields: 'id channel post replies replyCount lastReplyAt createdAt updatedAt',
+          channelId: channelId == null ? void 0 : channelId.toString(),
+          role: role == null ? void 0 : role.toString(),
+          postParentId: !parentId || parentId == 0 ? null : parentId == null ? void 0 : parentId.toString(),
+          selectedFields: "id channel post replies replyCount lastReplyAt createdAt updatedAt",
           limit: MESSAGES_PER_PAGE
         }
       });
     }
   }, [parentId]);
   React__default.useEffect(() => {
-    var _a, _b, _c;
-    if (data === null || data === void 0 ? void 0 : data.getPostThread) {
+    var _a2, _b2, _c2;
+    if (data == null ? void 0 : data.getPostThread) {
       const threads = data.getPostThread;
-      const threadPost = (_a = threads === null || threads === void 0 ? void 0 : threads.post) !== null && _a !== void 0 ? _a : [];
-      const threadReplies = (_b = threads === null || threads === void 0 ? void 0 : threads.replies) !== null && _b !== void 0 ? _b : [];
-      const messeageTotalCount = (_c = threads === null || threads === void 0 ? void 0 : threads.replyCount) !== null && _c !== void 0 ? _c : 0;
-      const messages = [threadPost, ...threadReplies];
-      if (messages.length > 0 && messeageTotalCount > totalCount || messages.length > 0 && channelMessages.length === 0) {
+      const threadPost2 = (_a2 = threads == null ? void 0 : threads.post) != null ? _a2 : [];
+      const threadReplies = (_b2 = threads == null ? void 0 : threads.replies) != null ? _b2 : [];
+      const messeageTotalCount = (_c2 = threads == null ? void 0 : threads.replyCount) != null ? _c2 : 0;
+      const messages = [threadPost2, ...threadReplies];
+      if (messages && messages.length > 0 && messeageTotalCount > totalCount || messages && messages.length > 0 && channelMessages.length === 0) {
         setThreadMessages(messages, messeageTotalCount);
       }
     }
-    if (isScrollToBottom && channelMessages) scrollToBottom();
-    // scrollToBottom();
-    // if (!isPostParentIdThread) {
-    //     // setTotalCount((pc: any) => pc + threadTotalCount);
-    //     setChannelMessages((oldMessages: any) => uniqBy([...threadMessage, ...oldMessages], ({ id }) => id));
-    // }
+    if (isScrollToBottom && channelMessages)
+      scrollToBottom();
   }, [data, channelMessages, loadingOldMessages, totalCount, isPostParentIdThread, isScrollToBottom]);
   const setThreadMessages = (messages, messagesTotalCount) => {
-    setChannelMessages(oldMessages => uniqBy([...messages, ...oldMessages], ({
+    setChannelMessages((oldMessages) => uniqBy([...messages, ...oldMessages], ({
       id
     }) => id));
     setTotalCount(messagesTotalCount);
   };
   React__default.useEffect(() => {
-    if (selectedImage) setImageLoading(false);
+    if (selectedImage)
+      setImageLoading(false);
   }, [selectedImage]);
   const scrollToBottom = React__default.useCallback(() => {
-    if (threadMessageListRef === null || threadMessageListRef === void 0 ? void 0 : threadMessageListRef.current) {
+    if (threadMessageListRef == null ? void 0 : threadMessageListRef.current) {
       setIsScrollToBottom(false);
       threadMessageListRef.current.scrollTop = threadMessageListRef.current.scrollHeight;
     }
@@ -143,33 +150,30 @@ const ThreadConversationViewComponent = ({
       setLoadEarlierMsg(true);
       fetchMoreMessages({
         variables: {
-          channelId: channelId === null || channelId === void 0 ? void 0 : channelId.toString(),
-          role: role === null || role === void 0 ? void 0 : role.toString(),
-          postParentId: parentId === null || parentId === void 0 ? void 0 : parentId.toString(),
-          selectedFields: 'id channel post replies replyCount lastReplyAt createdAt updatedAt',
+          channelId: channelId == null ? void 0 : channelId.toString(),
+          role: role == null ? void 0 : role.toString(),
+          postParentId: parentId == null ? void 0 : parentId.toString(),
+          selectedFields: "id channel post replies replyCount lastReplyAt createdAt updatedAt",
           limit: MESSAGES_PER_PAGE,
           skip: channelMessages.length - 1
         }
-      }).then(res => {
-        var _a, _b, _c, _d;
-        if ((_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.getPostThread) {
-          const threads = (_b = res === null || res === void 0 ? void 0 : res.data) === null || _b === void 0 ? void 0 : _b.getPostThread;
-          const threadReplies = (_c = threads === null || threads === void 0 ? void 0 : threads.replies) !== null && _c !== void 0 ? _c : [];
-          const messeageTotalCount = (_d = threads === null || threads === void 0 ? void 0 : threads.replyCount) !== null && _d !== void 0 ? _d : 0;
+      }).then((res) => {
+        var _a2, _b2, _c2, _d2;
+        if ((_a2 = res == null ? void 0 : res.data) == null ? void 0 : _a2.getPostThread) {
+          const threads = (_b2 = res == null ? void 0 : res.data) == null ? void 0 : _b2.getPostThread;
+          const threadReplies = (_c2 = threads == null ? void 0 : threads.replies) != null ? _c2 : [];
+          const messeageTotalCount = (_d2 = threads == null ? void 0 : threads.replyCount) != null ? _d2 : 0;
           setThreadMessages(threadReplies, messeageTotalCount);
         }
       }).finally(() => {
         setLoadEarlierMsg(false);
         setLoadingOldMessages(false);
-      }).catch(error => {
+      }).catch((error) => {
         setLoadEarlierMsg(false);
         setLoadingOldMessages(false);
       });
     }
   }, [parentId, channelId, totalCount, channelMessages]);
-  // const isCloseToTop = ({ layoutMeasurement, contentOffset, contentSize }) => {
-  //     return contentOffset.y <= 100; // 100px from top
-  // };
   const isCloseToTop = ({
     layoutMeasurement,
     contentOffset,
@@ -179,11 +183,7 @@ const ThreadConversationViewComponent = ({
     return contentSize.height - layoutMeasurement.height - paddingToTop <= contentOffset.y;
   };
   const dataURLtoFile = (dataurl, filename) => {
-    var arr = dataurl.split(','),
-      mime = arr[0].match(/:(.*?);/)[1],
-      bstr = encode(arr[1]),
-      n = bstr.length,
-      u8arr = new Uint8Array(n);
+    var arr = dataurl.split(","), mime = arr[0].match(/:(.*?);/)[1], bstr = encode(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
     while (n--) {
       u8arr[n] = bstr.charCodeAt(n);
     }
@@ -191,10 +191,10 @@ const ThreadConversationViewComponent = ({
       type: mime
     });
   };
-  const onSelectImages = () => __awaiter(void 0, void 0, void 0, function* () {
-    var _a;
+  const onSelectImages = async () => {
+    var _a2;
     setImageLoading(true);
-    let imageSource = yield ImagePicker.launchImageLibraryAsync({
+    let imageSource = await ImagePicker.launchImageLibraryAsync({
       mediaTypes: ImagePicker.MediaTypeOptions.Images,
       allowsEditing: true,
       aspect: [4, 3],
@@ -202,22 +202,25 @@ const ThreadConversationViewComponent = ({
       base64: true
     });
     if (!imageSource.canceled) {
-      const image = 'data:image/jpeg;base64,' + ((_a = imageSource.assets[0]) === null || _a === void 0 ? void 0 : _a.base64);
+      const image = "data:image/jpeg;base64," + ((_a2 = imageSource.assets[0]) == null ? void 0 : _a2.base64);
       setImage(image);
-      const file = dataURLtoFile(image, 'inputImage.jpg');
-      setFiles(files => files.concat(file));
-      setImages(images => images.concat(imageSource.assets[0]));
+      const file = dataURLtoFile(image, "inputImage.jpg");
+      setFiles((files2) => files2.concat(file));
+      setImages((images2) => images2.concat(imageSource.assets[0]));
     }
-    if (imageSource.canceled) setLoading(false);
-  });
-  const handleSend = useCallback(message => __awaiter(void 0, void 0, void 0, function* () {
-    var _a;
-    if (!channelId) return;
-    if (!message && message != ' ' && images.length == 0) return;
+    if (imageSource.canceled)
+      setLoading(false);
+  };
+  const handleSend = useCallback(async (message) => {
+    var _a2;
+    if (!channelId)
+      return;
+    if (!message && message != " " && images.length == 0)
+      return;
     const postId = objectId();
     if (images && images.length > 0) {
       setLoading(true);
-      const uploadResponse = yield startUpload({
+      const uploadResponse = await startUpload({
         file: images,
         saveUploadedFile: {
           variables: {
@@ -230,53 +233,53 @@ const ThreadConversationViewComponent = ({
           }
         }
       });
-      if (uploadResponse === null || uploadResponse === void 0 ? void 0 : uploadResponse.error) setLoading(false);
+      if (uploadResponse == null ? void 0 : uploadResponse.error)
+        setLoading(false);
       const uploadedFiles = uploadResponse.data;
       if (uploadResponse.data) {
-        setImage('');
+        setImage("");
         setFiles([]);
         setImages([]);
-        //setLoading(false);
-        const files = (_a = uploadedFiles === null || uploadedFiles === void 0 ? void 0 : uploadedFiles.map(f => f.id)) !== null && _a !== void 0 ? _a : null;
-        yield sendThreadMessage({
+        const files2 = (_a2 = uploadedFiles == null ? void 0 : uploadedFiles.map((f) => f.id)) != null ? _a2 : null;
+        await sendThreadMessage({
           variables: {
             postId,
             channelId,
-            postThreadId: postThread && (postThread === null || postThread === void 0 ? void 0 : postThread.id),
+            postThreadId: postThread && (postThread == null ? void 0 : postThread.id),
             postParentId: !parentId || parentId == 0 ? null : parentId,
             threadMessageInput: {
               content: message,
-              files,
+              files: files2,
               role
             }
           },
           update: (cache, {
-            data,
+            data: data2,
             errors
           }) => {
-            var _a, _b, _c, _d, _e, _f, _g;
-            if (!data || errors) {
+            var _a3, _b2, _c2, _d2, _e2, _f2, _g2;
+            if (!data2 || errors) {
               setLoading(false);
               return;
             }
-            setPostThread((_a = data === null || data === void 0 ? void 0 : data.createPostThread) === null || _a === void 0 ? void 0 : _a.data);
-            const lastMessageId = (_c = (_b = data === null || data === void 0 ? void 0 : data.createPostThread) === null || _b === void 0 ? void 0 : _b.lastMessage) === null || _c === void 0 ? void 0 : _c.id;
+            setPostThread((_a3 = data2 == null ? void 0 : data2.createPostThread) == null ? void 0 : _a3.data);
+            const lastMessageId = (_c2 = (_b2 = data2 == null ? void 0 : data2.createPostThread) == null ? void 0 : _b2.lastMessage) == null ? void 0 : _c2.id;
             if (!parentId || parentId == 0) {
-              setParentId((_e = (_d = data === null || data === void 0 ? void 0 : data.createPostThread) === null || _d === void 0 ? void 0 : _d.lastMessage) === null || _e === void 0 ? void 0 : _e.id);
+              setParentId((_e2 = (_d2 = data2 == null ? void 0 : data2.createPostThread) == null ? void 0 : _d2.lastMessage) == null ? void 0 : _e2.id);
             }
             setChannelToTop(channelToTop + 1);
             setLoading(false);
-            setMsg('');
-            sendPushNotification(lastMessageId, channelId, parentId, (_g = (_f = data === null || data === void 0 ? void 0 : data.createPostThread) === null || _f === void 0 ? void 0 : _f.data) === null || _g === void 0 ? void 0 : _g.id);
+            setMsg("");
+            sendPushNotification(lastMessageId, channelId, parentId, (_g2 = (_f2 = data2 == null ? void 0 : data2.createPostThread) == null ? void 0 : _f2.data) == null ? void 0 : _g2.id);
           }
         });
       }
     } else {
       setLoading(true);
-      yield sendThreadMessage({
+      await sendThreadMessage({
         variables: {
           channelId,
-          postThreadId: postThread && (postThread === null || postThread === void 0 ? void 0 : postThread.id),
+          postThreadId: postThread && (postThread == null ? void 0 : postThread.id),
           postParentId: !parentId || parentId == 0 ? null : parentId,
           threadMessageInput: {
             content: message,
@@ -284,383 +287,286 @@ const ThreadConversationViewComponent = ({
           }
         },
         update: (cache, {
-          data,
+          data: data2,
           errors
         }) => {
-          var _a, _b, _c, _d, _e, _f;
-          if (!data || errors) {
+          var _a3, _b2, _c2, _d2, _e2, _f2;
+          if (!data2 || errors) {
             setLoading(false);
             return;
           }
-          setPostThread(data === null || data === void 0 ? void 0 : data.createPostThread.data);
-          const lastMessageId = (_b = (_a = data === null || data === void 0 ? void 0 : data.createPostThread) === null || _a === void 0 ? void 0 : _a.lastMessage) === null || _b === void 0 ? void 0 : _b.id;
+          setPostThread(data2 == null ? void 0 : data2.createPostThread.data);
+          const lastMessageId = (_b2 = (_a3 = data2 == null ? void 0 : data2.createPostThread) == null ? void 0 : _a3.lastMessage) == null ? void 0 : _b2.id;
           if (!parentId || parentId == 0) {
-            setParentId((_d = (_c = data === null || data === void 0 ? void 0 : data.createPostThread) === null || _c === void 0 ? void 0 : _c.lastMessage) === null || _d === void 0 ? void 0 : _d.id);
+            setParentId((_d2 = (_c2 = data2 == null ? void 0 : data2.createPostThread) == null ? void 0 : _c2.lastMessage) == null ? void 0 : _d2.id);
           }
           setChannelToTop(channelToTop + 1);
           setLoading(false);
-          setMsg('');
-          sendPushNotification(lastMessageId, channelId, parentId, (_f = (_e = data === null || data === void 0 ? void 0 : data.createPostThread) === null || _e === void 0 ? void 0 : _e.data) === null || _f === void 0 ? void 0 : _f.id);
+          setMsg("");
+          sendPushNotification(lastMessageId, channelId, parentId, (_f2 = (_e2 = data2 == null ? void 0 : data2.createPostThread) == null ? void 0 : _e2.data) == null ? void 0 : _f2.id);
         }
       });
     }
-  }), [setChannelMessages, channelId, images, parentId, expoTokens]);
-  const sendPushNotification = (messageId, channelId, parentId, threadId) => __awaiter(void 0, void 0, void 0, function* () {
-    var _a;
+  }, [setChannelMessages, channelId, images, parentId, expoTokens]);
+  const sendPushNotification = async (messageId, channelId2, parentId2, threadId) => {
+    var _a2;
     const notificationData = {
       url: config.THREAD_MESSEGE_PATH,
       params: {
-        channelId,
-        title: (_a = params === null || params === void 0 ? void 0 : params.title) !== null && _a !== void 0 ? _a : 'Thread',
-        postParentId: parentId,
+        channelId: channelId2,
+        title: (_a2 = params == null ? void 0 : params.title) != null ? _a2 : "Thread",
+        postParentId: parentId2,
         hideTabBar: true
       },
-      screen: 'DialogThreadMessages',
+      screen: "DialogThreadMessages",
       thread: {
         id: threadId
       },
       other: {
-        sound: Platform.OS === 'android' ? undefined : 'default'
+        sound: Platform.OS === "android" ? void 0 : "default"
       }
     };
-    if (parentId || parentId == 0) {
-      yield sendExpoNotificationOnPostMutation({
+    if (parentId2 || parentId2 == 0) {
+      await sendExpoNotificationOnPostMutation({
         variables: {
-          postId: messageId === null || messageId === void 0 ? void 0 : messageId.toString(),
+          postId: messageId == null ? void 0 : messageId.toString(),
           notificationData
         }
       });
     }
-  });
+  };
   const messageList = useMemo(() => {
     let res = [];
-    const filteredMessages = channelMessages && (channelMessages === null || channelMessages === void 0 ? void 0 : channelMessages.length) > 0 ? uniqBy([...channelMessages], ({
+    const filteredMessages = channelMessages && (channelMessages == null ? void 0 : channelMessages.length) > 0 ? uniqBy([...channelMessages], ({
       id
     }) => id) : [];
-    if (filteredMessages === null || filteredMessages === void 0 ? void 0 : filteredMessages.length) {
-      orderBy(filteredMessages, ['createdAt'], ['desc']).map(msg => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
+    if (filteredMessages == null ? void 0 : filteredMessages.length) {
+      orderBy(filteredMessages, ["createdAt"], ["desc"]).map((msg2) => {
+        var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2;
         let message = {
-          _id: '',
-          text: '',
+          _id: "",
+          text: "",
           createdAt: 0,
           user: {
-            _id: '',
-            name: '',
-            avatar: ''
+            _id: "",
+            name: "",
+            avatar: ""
           },
-          type: ''
+          type: ""
         };
-        const date = new Date(msg.createdAt);
-        message._id = msg.id;
-        message.text = msg.message;
+        const date = new Date(msg2.createdAt);
+        message._id = msg2.id;
+        message.text = msg2.message;
         message.createdAt = date;
         message.user = {
-          _id: (_b = (_a = msg === null || msg === void 0 ? void 0 : msg.author) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : (_c = auth === null || auth === void 0 ? void 0 : auth.profile) === null || _c === void 0 ? void 0 : _c.id,
-          name: (_h = (_e = (_d = msg === null || msg === void 0 ? void 0 : msg.author) === null || _d === void 0 ? void 0 : _d.givenName) !== null && _e !== void 0 ? _e : ((_f = auth === null || auth === void 0 ? void 0 : auth.profile) === null || _f === void 0 ? void 0 : _f.given_name) + ' ' + ((_g = msg === null || msg === void 0 ? void 0 : msg.author) === null || _g === void 0 ? void 0 : _g.familyName)) !== null && _h !== void 0 ? _h : (_j = auth === null || auth === void 0 ? void 0 : auth.profile) === null || _j === void 0 ? void 0 : _j.family_name,
-          avatar: (_l = (_k = msg === null || msg === void 0 ? void 0 : msg.author) === null || _k === void 0 ? void 0 : _k.picture) !== null && _l !== void 0 ? _l : (_m = auth === null || auth === void 0 ? void 0 : auth.profile) === null || _m === void 0 ? void 0 : _m.picture
-        }, message.image = (_p = (_o = msg.files) === null || _o === void 0 ? void 0 : _o.data[0]) === null || _p === void 0 ? void 0 : _p.url, message.sent = msg === null || msg === void 0 ? void 0 : msg.isDelivered, message.received = msg === null || msg === void 0 ? void 0 : msg.isRead;
-        message.type = msg === null || msg === void 0 ? void 0 : msg.type;
-        message.propsConfiguration = msg === null || msg === void 0 ? void 0 : msg.propsConfiguration;
+          _id: (_c2 = (_a2 = msg2 == null ? void 0 : msg2.author) == null ? void 0 : _a2.id) != null ? _c2 : (_b2 = auth == null ? void 0 : auth.profile) == null ? void 0 : _b2.id,
+          name: (_i2 = (_g2 = (_d2 = msg2 == null ? void 0 : msg2.author) == null ? void 0 : _d2.givenName) != null ? _g2 : ((_e2 = auth == null ? void 0 : auth.profile) == null ? void 0 : _e2.given_name) + " " + ((_f2 = msg2 == null ? void 0 : msg2.author) == null ? void 0 : _f2.familyName)) != null ? _i2 : (_h2 = auth == null ? void 0 : auth.profile) == null ? void 0 : _h2.family_name,
+          avatar: (_l2 = (_j2 = msg2 == null ? void 0 : msg2.author) == null ? void 0 : _j2.picture) != null ? _l2 : (_k2 = auth == null ? void 0 : auth.profile) == null ? void 0 : _k2.picture
+        }, message.image = (_n2 = (_m2 = msg2.files) == null ? void 0 : _m2.data[0]) == null ? void 0 : _n2.url, message.sent = msg2 == null ? void 0 : msg2.isDelivered, message.received = msg2 == null ? void 0 : msg2.isRead;
+        message.type = msg2 == null ? void 0 : msg2.type;
+        message.propsConfiguration = msg2 == null ? void 0 : msg2.propsConfiguration;
         res.push(message);
       });
     }
-    return (res === null || res === void 0 ? void 0 : res.length) > 0 ? uniqBy([...res], ({
+    return (res == null ? void 0 : res.length) > 0 ? uniqBy([...res], ({
       _id
     }) => _id) : [];
-    //return res;
   }, [channelMessages]);
-  const renderSend = props => {
-    return React__default.createElement(Send, Object.assign({}, props), React__default.createElement(Box, null, React__default.createElement(MaterialCommunityIcons, {
-      name: "send-circle",
-      style: {
-        marginBottom: 5,
-        marginRight: 5
-      },
-      size: 32,
-      color: "#2e64e5"
-    })));
+  const renderSend = (props) => {
+    return /* @__PURE__ */ React__default.createElement(Send, __spreadValues({}, props), /* @__PURE__ */ React__default.createElement(Box, null, /* @__PURE__ */ React__default.createElement(MaterialCommunityIcons, { name: "send-circle", style: {
+      marginBottom: 5,
+      marginRight: 5
+    }, size: 32, color: "#2e64e5" })));
   };
-  const renderMessageText = props => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
+  const renderMessageText = (props) => {
+    var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p2, _q2, _r2, _s2, _t, _u, _v, _w, _x, _y;
     const {
       currentMessage
     } = props;
-    if (currentMessage.type === 'ALERT') {
-      const attachment = (_b = (_a = currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.propsConfiguration) === null || _a === void 0 ? void 0 : _a.contents) === null || _b === void 0 ? void 0 : _b.attachment;
-      let action = '';
-      let actionId = '';
-      let params = {};
-      if ((_c = attachment === null || attachment === void 0 ? void 0 : attachment.callToAction) === null || _c === void 0 ? void 0 : _c.extraParams) {
-        const extraParams = (_d = attachment === null || attachment === void 0 ? void 0 : attachment.callToAction) === null || _d === void 0 ? void 0 : _d.extraParams;
-        const route = (_e = extraParams === null || extraParams === void 0 ? void 0 : extraParams.route) !== null && _e !== void 0 ? _e : null;
+    if (currentMessage.type === "ALERT") {
+      const attachment = (_b2 = (_a2 = currentMessage == null ? void 0 : currentMessage.propsConfiguration) == null ? void 0 : _a2.contents) == null ? void 0 : _b2.attachment;
+      let action = "";
+      let actionId = "";
+      let params2 = {};
+      if ((_c2 = attachment == null ? void 0 : attachment.callToAction) == null ? void 0 : _c2.extraParams) {
+        const extraParams = (_d2 = attachment == null ? void 0 : attachment.callToAction) == null ? void 0 : _d2.extraParams;
+        const route = (_e2 = extraParams == null ? void 0 : extraParams.route) != null ? _e2 : null;
         let path = null;
         let param = null;
         if (role && role == PreDefinedRole.Guest) {
-          path = ((_f = route === null || route === void 0 ? void 0 : route.guest) === null || _f === void 0 ? void 0 : _f.name) ? (_h = (_g = route === null || route === void 0 ? void 0 : route.guest) === null || _g === void 0 ? void 0 : _g.name) !== null && _h !== void 0 ? _h : null : null;
-          param = ((_j = route === null || route === void 0 ? void 0 : route.guest) === null || _j === void 0 ? void 0 : _j.params) ? (_l = (_k = route === null || route === void 0 ? void 0 : route.guest) === null || _k === void 0 ? void 0 : _k.params) !== null && _l !== void 0 ? _l : null : null;
+          path = ((_f2 = route == null ? void 0 : route.guest) == null ? void 0 : _f2.name) ? (_h2 = (_g2 = route == null ? void 0 : route.guest) == null ? void 0 : _g2.name) != null ? _h2 : null : null;
+          param = ((_i2 = route == null ? void 0 : route.guest) == null ? void 0 : _i2.params) ? (_k2 = (_j2 = route == null ? void 0 : route.guest) == null ? void 0 : _j2.params) != null ? _k2 : null : null;
         } else if (role && role == PreDefinedRole.Owner) {
-          path = ((_m = route === null || route === void 0 ? void 0 : route.host) === null || _m === void 0 ? void 0 : _m.name) ? (_p = (_o = route === null || route === void 0 ? void 0 : route.host) === null || _o === void 0 ? void 0 : _o.name) !== null && _p !== void 0 ? _p : null : null;
-          param = ((_q = route === null || route === void 0 ? void 0 : route.host) === null || _q === void 0 ? void 0 : _q.params) ? (_s = (_r = route === null || route === void 0 ? void 0 : route.host) === null || _r === void 0 ? void 0 : _r.params) !== null && _s !== void 0 ? _s : null : null;
+          path = ((_l2 = route == null ? void 0 : route.host) == null ? void 0 : _l2.name) ? (_n2 = (_m2 = route == null ? void 0 : route.host) == null ? void 0 : _m2.name) != null ? _n2 : null : null;
+          param = ((_o2 = route == null ? void 0 : route.host) == null ? void 0 : _o2.params) ? (_q2 = (_p2 = route == null ? void 0 : route.host) == null ? void 0 : _p2.params) != null ? _q2 : null : null;
         } else {
-          path = ((_t = route === null || route === void 0 ? void 0 : route.host) === null || _t === void 0 ? void 0 : _t.name) ? (_v = (_u = route === null || route === void 0 ? void 0 : route.host) === null || _u === void 0 ? void 0 : _u.name) !== null && _v !== void 0 ? _v : null : null;
-          param = ((_w = route === null || route === void 0 ? void 0 : route.host) === null || _w === void 0 ? void 0 : _w.params) ? (_y = (_x = route === null || route === void 0 ? void 0 : route.host) === null || _x === void 0 ? void 0 : _x.params) !== null && _y !== void 0 ? _y : null : null;
+          path = ((_r2 = route == null ? void 0 : route.host) == null ? void 0 : _r2.name) ? (_t = (_s2 = route == null ? void 0 : route.host) == null ? void 0 : _s2.name) != null ? _t : null : null;
+          param = ((_u = route == null ? void 0 : route.host) == null ? void 0 : _u.params) ? (_w = (_v = route == null ? void 0 : route.host) == null ? void 0 : _v.params) != null ? _w : null : null;
         }
         action = path;
-        params = Object.assign({}, param);
-      } else if ((_z = attachment === null || attachment === void 0 ? void 0 : attachment.callToAction) === null || _z === void 0 ? void 0 : _z.link) {
+        params2 = __spreadValues({}, param);
+      } else if ((_x = attachment == null ? void 0 : attachment.callToAction) == null ? void 0 : _x.link) {
         action = CALL_TO_ACTION_PATH;
-        actionId = (_0 = attachment === null || attachment === void 0 ? void 0 : attachment.callToAction) === null || _0 === void 0 ? void 0 : _0.link.split('/').pop();
-        params = {
+        actionId = (_y = attachment == null ? void 0 : attachment.callToAction) == null ? void 0 : _y.link.split("/").pop();
+        params2 = {
           reservationId: actionId
         };
       }
-      // if (attachment?.callToAction?.link?.includes('my-reservation-details')) {
-      //     action = CALL_TO_ACTION_PATH;
-      //     actionId = attachment?.callToAction?.link.split('/').pop();
-      // }
-      return React__default.createElement(React__default.Fragment, null, (attachment === null || attachment === void 0 ? void 0 : attachment.callToAction) && action ? React__default.createElement(Box, {
-        bg: CALL_TO_ACTION_BOX_BGCOLOR,
-        borderRadius: 15,
-        pb: 2
-      }, React__default.createElement(Button, {
-        variant: 'outline',
-        size: 'sm',
-        borderColor: CALL_TO_ACTION_BUTTON_BORDERCOLOR,
-        onPress: () => action && params && navigation.navigate(action, params)
-      }, React__default.createElement(ButtonText, {
-        color: CALL_TO_ACTION_TEXT_COLOR
-      }, attachment.callToAction.title)), React__default.createElement(MessageText, Object.assign({}, props, {
-        textStyle: {
-          left: {
-            marginLeft: 5,
-            color: CALL_TO_ACTION_TEXT_COLOR,
-            paddingHorizontal: 2
-          }
+      return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, (attachment == null ? void 0 : attachment.callToAction) && action ? /* @__PURE__ */ React__default.createElement(Box, { bg: CALL_TO_ACTION_BOX_BGCOLOR, borderRadius: 15, pb: 2 }, /* @__PURE__ */ React__default.createElement(
+        Button,
+        {
+          variant: "outline",
+          size: "sm",
+          borderColor: CALL_TO_ACTION_BUTTON_BORDERCOLOR,
+          onPress: () => action && params2 && navigation.navigate(action, params2)
+        },
+        /* @__PURE__ */ React__default.createElement(ButtonText, { color: CALL_TO_ACTION_TEXT_COLOR }, attachment.callToAction.title)
+      ), /* @__PURE__ */ React__default.createElement(MessageText, __spreadProps(__spreadValues({}, props), { textStyle: {
+        left: {
+          marginLeft: 5,
+          color: CALL_TO_ACTION_TEXT_COLOR,
+          paddingHorizontal: 2
         }
-      }))) : React__default.createElement(MessageText, Object.assign({}, props, {
-        textStyle: {
-          left: {
-            marginLeft: 5
-          }
+      } }))) : /* @__PURE__ */ React__default.createElement(MessageText, __spreadProps(__spreadValues({}, props), { textStyle: {
+        left: {
+          marginLeft: 5
         }
-      })));
+      } })));
     } else {
-      return React__default.createElement(MessageText, Object.assign({}, props, {
-        textStyle: {
-          left: {
-            marginLeft: 5
-          }
+      return /* @__PURE__ */ React__default.createElement(MessageText, __spreadProps(__spreadValues({}, props), { textStyle: {
+        left: {
+          marginLeft: 5
         }
-      }));
+      } }));
     }
   };
-  const renderActions = props => {
-    return React__default.createElement(Actions, Object.assign({}, props, {
-      icon: () => React__default.createElement(Ionicons, {
-        name: 'image',
-        size: 30,
-        color: 'black',
-        onPress: onSelectImages
-      })
-    }));
+  const renderActions = (props) => {
+    return /* @__PURE__ */ React__default.createElement(Actions, __spreadProps(__spreadValues({}, props), { icon: () => /* @__PURE__ */ React__default.createElement(Ionicons, { name: "image", size: 30, color: "black", onPress: onSelectImages }) }));
   };
-  const renderAccessory = props => {
-    return React__default.createElement(Box, null, selectedImage !== '' ? React__default.createElement(HStack, {
-      alignItems: 'center'
-    }, React__default.createElement(Image, {
-      ml: '$3',
-      key: selectedImage,
-      alt: 'image',
-      source: {
-        uri: selectedImage
+  const renderAccessory = (props) => {
+    return /* @__PURE__ */ React__default.createElement(Box, null, selectedImage !== "" ? /* @__PURE__ */ React__default.createElement(HStack, { alignItems: "center" }, /* @__PURE__ */ React__default.createElement(Image, { ml: "$3", key: selectedImage, alt: "image", source: {
+      uri: selectedImage
+    }, size: "xs" }), /* @__PURE__ */ React__default.createElement(
+      Button,
+      {
+        variant: "solid",
+        bg: "transparent",
+        onPress: () => {
+          setFiles([]);
+          setImage("");
+          setImages([]);
+        }
       },
-      size: 'xs'
-    }), React__default.createElement(Button, {
-      variant: 'solid',
-      //bg={'$secondary400'}
-      bg: 'transparent',
-      onPress: () => {
-        setFiles([]);
-        setImage('');
-        setImages([]);
-      }
-    }, React__default.createElement(ButtonText, {
-      color: '$black'
-    }, "Cancel"))) : null);
+      /* @__PURE__ */ React__default.createElement(ButtonText, { color: "$black" }, "Cancel")
+    )) : null);
   };
   const setImageViewerObject = (obj, v) => {
     setImageObject(obj);
     setImageViewer(v);
   };
   const modalContent = React__default.useMemo(() => {
-    if (!imageObject) return React__default.createElement(React__default.Fragment, null);
+    if (!imageObject)
+      return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null);
     const {
       image,
       _id
     } = imageObject;
-    return React__default.createElement(CachedImage, {
-      style: {
-        width: '100%',
-        height: '100%'
-      },
-      resizeMode: 'cover',
-      // cacheKey={`${_id}-conversation-modal-image-key`}
-      cacheKey: `${_id}-slack-bubble-imageKey`,
-      source: {
-        uri: image,
-        //headers: `Authorization: Bearer ${token}`,
-        expiresIn: 86400
-      },
-      alt: 'image'
-    });
+    return /* @__PURE__ */ React__default.createElement(
+      CachedImage,
+      {
+        style: {
+          width: "100%",
+          height: "100%"
+        },
+        resizeMode: "cover",
+        cacheKey: `${_id}-slack-bubble-imageKey`,
+        source: {
+          uri: image,
+          expiresIn: 86400
+        },
+        alt: "image"
+      }
+    );
   }, [imageObject]);
-  const renderMessage = props => {
-    return React__default.createElement(Message, Object.assign({}, props, {
-      isShowImageViewer: isShowImageViewer,
-      setImageViewer: setImageViewerObject
-    }));
+  const renderMessage = (props) => {
+    return /* @__PURE__ */ React__default.createElement(Message, __spreadProps(__spreadValues({}, props), { isShowImageViewer, setImageViewer: setImageViewerObject }));
   };
   let onScroll = false;
   const onMomentumScrollBegin = ({
     nativeEvent
   }) => {
     onScroll = true;
-    console.log('scroll top');
-    if (!loadingOldMessages && isCloseToTop(nativeEvent) && totalCount > (channelMessages === null || channelMessages === void 0 ? void 0 : channelMessages.length)) {
+    console.log("scroll top");
+    if (!loadingOldMessages && isCloseToTop(nativeEvent) && totalCount > (channelMessages == null ? void 0 : channelMessages.length)) {
       onFetchOld();
     }
   };
   const onEndReached = () => {
-    console.log('on end reached');
-    if (!onScroll) return;
-    // load messages, show ActivityIndicator
+    console.log("on end reached");
+    if (!onScroll)
+      return;
     onScroll = false;
-    // setLoadingOldMessages(true);
   };
-  return React__default.createElement(React__default.Fragment, null, (loadingOldMessages || loadEarlierMsg) && React__default.createElement(Spinner, {
-    color: '$blue500'
-  }), isPostParentIdThread && React__default.createElement(React__default.Fragment, null, (threadPost === null || threadPost === void 0 ? void 0 : threadPost.length) > 0 && React__default.createElement(React__default.Fragment, null, React__default.createElement(VStack, {
-    px: '$2',
-    pt: '$2',
-    pb: '$0',
-    space: 'sm'
-  }, React__default.createElement(HStack, {
-    space: 'sm',
-    alignItems: 'center'
-  }, React__default.createElement(Avatar, {
-    bg: 'transparent',
-    size: 'md'
-  }, React__default.createElement(AvatarFallbackText, null, startCase((_c = (_b = (_a = threadPost[0]) === null || _a === void 0 ? void 0 : _a.author) === null || _b === void 0 ? void 0 : _b.username) === null || _c === void 0 ? void 0 : _c.charAt(0))), React__default.createElement(AvatarImage, {
-    alt: "image",
-    style: {
-      borderRadius: 6,
-      borderWidth: 2,
-      borderColor: '#fff'
-    },
-    source: {
-      uri: (_e = (_d = threadPost[0]) === null || _d === void 0 ? void 0 : _d.author) === null || _e === void 0 ? void 0 : _e.picture
-    }
-  })), React__default.createElement(Box, null, React__default.createElement(Text, {
-    color: '$black',
-    fontWeight: '$bold'
-  }, (_h = (_g = (_f = threadPost[0]) === null || _f === void 0 ? void 0 : _f.author) === null || _g === void 0 ? void 0 : _g.givenName) !== null && _h !== void 0 ? _h : '', ' ', (_l = (_k = (_j = threadPost[0]) === null || _j === void 0 ? void 0 : _j.author) === null || _k === void 0 ? void 0 : _k.familyName) !== null && _l !== void 0 ? _l : ''), React__default.createElement(Text, {
-    color: '$trueGray500',
-    pl: '$0'
-  }, createdAtText((_m = threadPost[0]) === null || _m === void 0 ? void 0 : _m.createdAt), " at", ' ', format(new Date((_o = threadPost[0]) === null || _o === void 0 ? void 0 : _o.createdAt), 'hh:ss:a')))), React__default.createElement(HStack, {
-    px: '$2',
-    space: 'sm',
-    alignItems: 'center'
-  }, React__default.createElement(Text, null, (_q = (_p = threadPost[0]) === null || _p === void 0 ? void 0 : _p.message) !== null && _q !== void 0 ? _q : ''))), React__default.createElement(Box, {
-    py: '$4'
-  }, React__default.createElement(Box, {
-    px: '$4',
-    borderTopWidth: '$1',
-    borderBottomWidth: '$1',
-    py: '$2',
-    borderColor: '$trueGray200'
-  }, React__default.createElement(Text, {
-    color: '$trueGray600',
-    fontWeight: '$bold'
-  }, (_s = (_r = threadPost[0]) === null || _r === void 0 ? void 0 : _r.replies) === null || _s === void 0 ? void 0 : _s.totalCount, ' ', ((_u = (_t = threadPost[0]) === null || _t === void 0 ? void 0 : _t.replies) === null || _u === void 0 ? void 0 : _u.totalCount) > 0 ? 'replies' : 'reply'))))), React__default.createElement(GiftedChat, {
-    ref: threadMessageListRef,
-    wrapInSafeArea: false,
-    renderLoading: () => React__default.createElement(Spinner, {
-      color: '$blue500'
-    }),
-    messages: messageList,
-    listViewProps: {
-      onEndReached: onEndReached,
-      onEndReachedThreshold: 0.5,
-      onMomentumScrollBegin: onMomentumScrollBegin
-    },
-    onSend: messages => {
-      var _a, _b;
-      return handleSend((_b = (_a = messages[0]) === null || _a === void 0 ? void 0 : _a.text) !== null && _b !== void 0 ? _b : ' ');
-    },
-    text: msg ? msg : ' ',
-    onInputTextChanged: text => setMsg(text),
-    renderFooter: () => loading ? React__default.createElement(Spinner, {
-      color: '$blue500'
-    }) : imageLoading ? React__default.createElement(Spinner, {
-      color: '$blue500'
-    }) : '',
-    scrollToBottom: true,
-    user: {
-      _id: (auth === null || auth === void 0 ? void 0 : auth.id) || ''
-    },
-    isTyping: true,
-    alwaysShowSend: loading ? false : true,
-    // onLoadEarlier={onFetchOld}
-    infiniteScroll: true,
-    renderSend: renderSend,
-    // loadEarlier={data?.messages?.totalCount > channelMessages.length}
-    // isLoadingEarlier={loadEarlierMsg}
-    // renderLoadEarlier={() =>
-    //     !loadEarlierMsg && (
-    //         <Center py={2}>
-    //             <Button
-    //                 onPress={() => onFetchOld(channelMessages?.length)}
-    //                 variant={'outline'}
-    //                 _text={{ color: 'black', fontSize: 15, fontWeight: 'bold' }}
-    //             >
-    //                 Load earlier messages
-    //             </Button>
-    //         </Center>
-    //     )
-    // }
-    renderMessageText: renderMessageText,
-    minInputToolbarHeight: 50,
-    renderActions: renderActions,
-    renderAccessory: renderAccessory,
-    renderMessage: renderMessage,
-    renderChatFooter: () => React__default.createElement(React__default.Fragment, null, React__default.createElement(ImageViewerModal, {
-      isVisible: isShowImageViewer,
-      setVisible: setImageViewer,
-      modalContent: modalContent
-    }), React__default.createElement(SubscriptionHandler, {
-      channelId: channelId,
-      subscribeToNewMessages: () => subscribeToMore({
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, (loadingOldMessages || loadEarlierMsg) && /* @__PURE__ */ React__default.createElement(Spinner, { color: "$blue500" }), isPostParentIdThread && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, (threadPost == null ? void 0 : threadPost.length) > 0 && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(VStack, { px: "$2", pt: "$2", pb: "$0", space: "sm" }, /* @__PURE__ */ React__default.createElement(HStack, { space: "sm", alignItems: "center" }, /* @__PURE__ */ React__default.createElement(Avatar, { bg: "transparent", size: "md" }, /* @__PURE__ */ React__default.createElement(AvatarFallbackText, null, startCase((_c = (_b = (_a = threadPost[0]) == null ? void 0 : _a.author) == null ? void 0 : _b.username) == null ? void 0 : _c.charAt(0))), /* @__PURE__ */ React__default.createElement(AvatarImage, { alt: "image", style: {
+    borderRadius: 6,
+    borderWidth: 2,
+    borderColor: "#fff"
+  }, source: {
+    uri: (_e = (_d = threadPost[0]) == null ? void 0 : _d.author) == null ? void 0 : _e.picture
+  } })), /* @__PURE__ */ React__default.createElement(Box, null, /* @__PURE__ */ React__default.createElement(Text, { color: "$black", fontWeight: "$bold" }, (_h = (_g = (_f = threadPost[0]) == null ? void 0 : _f.author) == null ? void 0 : _g.givenName) != null ? _h : "", " ", (_k = (_j = (_i = threadPost[0]) == null ? void 0 : _i.author) == null ? void 0 : _j.familyName) != null ? _k : ""), /* @__PURE__ */ React__default.createElement(Text, { color: "$trueGray500", pl: "$0" }, createdAtText((_l = threadPost[0]) == null ? void 0 : _l.createdAt), " at", " ", format(new Date((_m = threadPost[0]) == null ? void 0 : _m.createdAt), "hh:ss:a")))), /* @__PURE__ */ React__default.createElement(HStack, { px: "$2", space: "sm", alignItems: "center" }, /* @__PURE__ */ React__default.createElement(Text, null, (_o = (_n = threadPost[0]) == null ? void 0 : _n.message) != null ? _o : ""))), /* @__PURE__ */ React__default.createElement(Box, { py: "$4" }, /* @__PURE__ */ React__default.createElement(Box, { px: "$4", borderTopWidth: "$1", borderBottomWidth: "$1", py: "$2", borderColor: "$trueGray200" }, /* @__PURE__ */ React__default.createElement(Text, { color: "$trueGray600", fontWeight: "$bold" }, (_q = (_p = threadPost[0]) == null ? void 0 : _p.replies) == null ? void 0 : _q.totalCount, " ", ((_s = (_r = threadPost[0]) == null ? void 0 : _r.replies) == null ? void 0 : _s.totalCount) > 0 ? "replies" : "reply"))))), /* @__PURE__ */ React__default.createElement(
+    GiftedChat,
+    {
+      ref: threadMessageListRef,
+      wrapInSafeArea: false,
+      renderLoading: () => /* @__PURE__ */ React__default.createElement(Spinner, { color: "$blue500" }),
+      messages: messageList,
+      listViewProps: {
+        onEndReached,
+        onEndReachedThreshold: 0.5,
+        onMomentumScrollBegin
+      },
+      onSend: (messages) => {
+        var _a2, _b2;
+        return handleSend((_b2 = (_a2 = messages[0]) == null ? void 0 : _a2.text) != null ? _b2 : " ");
+      },
+      text: msg ? msg : " ",
+      onInputTextChanged: (text) => setMsg(text),
+      renderFooter: () => loading ? /* @__PURE__ */ React__default.createElement(Spinner, { color: "$blue500" }) : imageLoading ? /* @__PURE__ */ React__default.createElement(Spinner, { color: "$blue500" }) : "",
+      scrollToBottom: true,
+      user: {
+        _id: (auth == null ? void 0 : auth.id) || ""
+      },
+      isTyping: true,
+      alwaysShowSend: loading ? false : true,
+      infiniteScroll: true,
+      renderSend,
+      renderMessageText,
+      minInputToolbarHeight: 50,
+      renderActions,
+      renderAccessory,
+      renderMessage,
+      renderChatFooter: () => /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(ImageViewerModal, { isVisible: isShowImageViewer, setVisible: setImageViewer, modalContent }), /* @__PURE__ */ React__default.createElement(SubscriptionHandler, { channelId, subscribeToNewMessages: () => subscribeToMore({
         document: OnThreadChatMessageAddedDocument,
         variables: {
-          channelId: channelId === null || channelId === void 0 ? void 0 : channelId.toString(),
-          postParentId: !parentId || parentId == 0 ? null : parentId === null || parentId === void 0 ? void 0 : parentId.toString()
+          channelId: channelId == null ? void 0 : channelId.toString(),
+          postParentId: !parentId || parentId == 0 ? null : parentId == null ? void 0 : parentId.toString()
         },
         updateQuery: (prev, {
           subscriptionData
         }) => {
-          var _a, _b, _c;
-          if (!subscriptionData.data) return prev;
-          const newMessage = (_a = subscriptionData === null || subscriptionData === void 0 ? void 0 : subscriptionData.data) === null || _a === void 0 ? void 0 : _a.threadChatMessageAdded;
-          const prevReplyCount = (_b = prev === null || prev === void 0 ? void 0 : prev.getPostThread) === null || _b === void 0 ? void 0 : _b.replyCount;
+          var _a2, _b2, _c2;
+          if (!subscriptionData.data)
+            return prev;
+          const newMessage = (_a2 = subscriptionData == null ? void 0 : subscriptionData.data) == null ? void 0 : _a2.threadChatMessageAdded;
+          const prevReplyCount = (_b2 = prev == null ? void 0 : prev.getPostThread) == null ? void 0 : _b2.replyCount;
           const newReplyCount = prevReplyCount || 0 + 1;
-          const replies = ((_c = prev === null || prev === void 0 ? void 0 : prev.getPostThread) === null || _c === void 0 ? void 0 : _c.replies) || [];
-          setChannelMessages(oldMessages => uniqBy([...oldMessages, newMessage], ({
+          const replies = ((_c2 = prev == null ? void 0 : prev.getPostThread) == null ? void 0 : _c2.replies) || [];
+          setChannelMessages((oldMessages) => uniqBy([...oldMessages, newMessage], ({
             id
           }) => id));
           setTotalCount(newReplyCount);
           return Object.assign({}, prev, {
-            getPostThread: Object.assign(Object.assign({}, prev === null || prev === void 0 ? void 0 : prev.getPostThread), {
+            getPostThread: __spreadProps(__spreadValues({}, prev == null ? void 0 : prev.getPostThread), {
               lastReplyAt: newMessage.createdAt,
               replies: [newMessage, ...replies],
               replyCount: newReplyCount,
@@ -668,38 +574,29 @@ const ThreadConversationViewComponent = ({
             })
           });
         }
-      })
-    })),
-    messagesContainerStyle: (messageList === null || messageList === void 0 ? void 0 : messageList.length) == 0 && {
-      transform: [{
-        scaleY: -1
-      }]
-    },
-    renderChatEmpty: () => React__default.createElement(React__default.Fragment, null, !threadLoading && messageList && (messageList === null || messageList === void 0 ? void 0 : messageList.length) == 0 && React__default.createElement(Box, {
-      p: '$5'
-    }, React__default.createElement(Center, {
-      mt: '$6'
-    }, React__default.createElement(Ionicons, {
-      name: "chatbubbles",
-      size: 30
-    }), React__default.createElement(Text, null, "You don't have any message yet!")))),
-    lightboxProps: {
-      underlayColor: 'transparent',
-      springConfig: {
-        tension: 90000,
-        friction: 90000
+      }) })),
+      messagesContainerStyle: (messageList == null ? void 0 : messageList.length) == 0 && {
+        transform: [{
+          scaleY: -1
+        }]
       },
-      disabled: true
+      renderChatEmpty: () => /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, !threadLoading && messageList && (messageList == null ? void 0 : messageList.length) == 0 && /* @__PURE__ */ React__default.createElement(Box, { p: "$5" }, /* @__PURE__ */ React__default.createElement(Center, { mt: "$6" }, /* @__PURE__ */ React__default.createElement(Ionicons, { name: "chatbubbles", size: 30 }), /* @__PURE__ */ React__default.createElement(Text, null, "You don't have any message yet!")))),
+      lightboxProps: {
+        underlayColor: "transparent",
+        springConfig: {
+          tension: 9e4,
+          friction: 9e4
+        },
+        disabled: true
+      }
     }
-  }));
+  ));
 };
 const SubscriptionHandler = ({
   subscribeToNewMessages,
   channelId
 }) => {
   useEffect(() => subscribeToNewMessages(), [channelId]);
-  return React__default.createElement(React__default.Fragment, null);
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null);
 };
-const ThreadConversationView = ThreadConversationViewComponent;
-// export const ThreadConversationView = React.memo(ThreadConversationViewComponent);
-export{ThreadConversationView};//# sourceMappingURL=ThreadConversationView.js.map
+const ThreadConversationView = ThreadConversationViewComponent;export{ThreadConversationView};//# sourceMappingURL=ThreadConversationView.js.map