npm - @messenger-box/platform-mobile - Versions diffs - 10.0.3-alpha.20 → 10.0.3-alpha.201 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (112) hide show

package/lib/screens/inbox/DialogThreadMessages.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DialogThreadMessages.js","sources":["../../../src/screens/inbox/DialogThreadMessages.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Box, Spinner, Text } from '@admin-layout/gluestack-ui-mobile';\nimport { ThreadConversationView } from './containers/ThreadConversationView';\nimport { ThreadsView } from './containers/ThreadsView';\nimport { ~~useViewChannelDetailQuery~~, ~~useSendThreadMessageMutation~~ } from '~~common~~/~~graphql~~';\nimport { useFocusEffect } from '@react-navigation/native';\n// import { useSelector } from 'react-redux';\nimport colors from 'tailwindcss/colors';\n\nexport function DialogThreadMessages({ channelId, postParentId, isPostParentIdThread, role }) {\n const {\n data~~,\n~~ loading: channelLoading~~,\n~~ refetch~~,\n~~ } = ~~useViewChannelDetailQuery~~(~~{\n variables: {\n id:~~ channelId?.toString()~~,\n~~ }~~,\n }~~);\n\n const [sendThreadMessage] = ~~useSendThreadMessageMutation~~();\n const [loading, setLoading] = React.useState<boolean>(true);\n const [channel, setChannel] = React.useState<any>(null);\n const [parentId, setParentId] = React.useState<any>(postParentId);\n\n const refetchChannelDetail = React.useCallback(\n (id: string) => {\n return refetch({ id: id?.toString() });\n },\n [channelId],\n );\n\n useFocusEffect(\n React.useCallback(() => {\n // Do something when the screen is focused\n if (channelId) refetch({ id: channelId?.toString() });\n return () => {};\n }, [channelId]),\n );\n\n React.useEffect(() => {\n setParentId(postParentId);\n }, [postParentId]);\n\n React.useEffect(() => {\n if (data?.viewChannelDetail) {\n setChannel(data?.viewChannelDetail);\n setLoading(false);\n }\n }, [data]);\n\n // React.useEffect(() => {\n // async function sendInitialMessage(channel: any) {\n // const content = `Welcome to ${channel?.title}`;\n // const createdBy = channel?.creator?.id;\n // await sendThreadMessage({\n // variables: {\n // channelId,\n // threadMessageInput: {\n // content,\n // role,\n // },\n // responderId: createdBy,\n // },\n // update: (cache, { data, errors }: any) => {\n // if (!data) {\n // return;\n // }\n // setParentId(data?.sendThreadMessage?.lastMessage?.id);\n // },\n // });\n // }\n // if ((!parentId \|\| parentId == 0) && channel) {\n // sendInitialMessage(channel);\n // }\n\n // if (parentId) setLoading(false);\n // }, [parentId, channel]);\n\n return (\n <Box className=\"bg-white flex-1\">\n {/* {loading && !parentId ? ( */}\n {loading ? (\n <Spinner color={colors.blue[500]} />\n ) : (\n <ThreadConversationView\n channelId={channelId}\n postParentId={parentId}\n isPostParentIdThread={isPostParentIdThread}\n role={role}\n />\n )}\n </Box>\n );\n}\n\nexport default DialogThreadMessages;\n"],"names":[],"mappings":"~~qVAQO~~,SAAS,~~oBAAqB~~,~~CAAA~~;AAAA,EACnC,SAAA;AAAA,EACA,YAAA;AAAA,EACA,oBAAA;AAAA,EACA;AACF,~~CAAG~~,~~EAAA~~;AACD,~~EAAM~~,~~MAAA~~;AAAA,IACJ,IAAA;AAAA,IACA,~~OAAS~~,~~EAAA~~,cAAA;AAAA,IACT;AAAA,~~MACE~~,~~yBAA0B~~,~~CAAA;AAAA~~,~~IAC5B~~,~~SAAW~~,~~EAAA;AAAA,MACT,IAAI,SAAW,~~IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,~~CAAA~~,QAAA~~;AAAA;AACjB~~,~~GACD~~,CAAA;~~AACD~~,~~EAAM~~,~~MAAA~~,CAAC,iBAAiB,CAAA,GAAI,~~4BAA6B~~,~~EAAA~~;~~AACzD~~,EAAA,MAAM,CAAC,~~OAAS~~,~~EAAA~~,UAAU,~~CAAI~~,~~GAAA~~,KAAA,CAAM,SAAkB,IAAI,CAAA;AAC1D,EAAA,MAAM,CAAC,~~OAAS~~,~~EAAA~~,UAAU,~~CAAI~~,~~GAAA~~,KAAA,CAAM,SAAc,IAAI,CAAA;AACtD,EAAA,MAAM,CAAC,~~QAAU~~,~~EAAA~~,WAAW,~~CAAI~~,~~GAAA~~,KAAA,CAAM,SAAc,YAAY,CAAA;AAChE,EAA6B,KAAA,CAAM,~~WAAY~~,~~CAAA~~,CAAC,~~EAAe~~,~~KAAA~~;AAC7D,IAAA,OAAO,~~OAAQ~~,~~CAAA~~;AAAA,MACb,IAAI,~~EAAI~~,IAAA,IAAA,GAAA,MAAA,GAAA,EAAA,~~CAAA~~,QAAA;AAAA,KACT,CAAA;AAAA,~~GACH~~,EAAG,CAAC,SAAS,CAAC;AACd,~~EAAe~~,cAAA,~~CAAA~~,KAAA,CAAM,YAAY,MAAM;AAErC,~~IAAI,~~IAAA,~~SAAA;AAAW~~,~~MAAQ~~,OAAA,~~CAAA~~;AAAA,~~QACrB~~,IAAI,~~SAAW~~,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,~~CAAA~~,QAAA;AAAA,~~OAChB~~,CAAA;AACD,IAAA,OAAO,MAAM;AAAA,~~KAAC~~;AAAA,~~GACb~~,~~EAAA~~,CAAC,SAAS,CAAC,CAAC,CAAA;AACf,EAAA,KAAA,CAAM,UAAU,MAAM;AACpB,IAAA,WAAA,CAAY,YAAY,CAAA;AAAA,~~GAC1B~~,EAAG,CAAC,YAAY,CAAC,CAAA;AACjB,EAAA,KAAA,CAAM,UAAU,MAAM;AACpB,IAAA,IAAI,6BAAM,~~iBAAmB~~,~~EAAA~~;AAC3B,MAAA,UAAA,CAAW,6BAAM,iBAAiB,CAAA;AAClC,MAAA,UAAA,CAAW,KAAK,CAAA;AAAA;~~AAClB~~,~~GACF~~,EAAG,CAAC,IAAI,CAAC,CAAA;AA8BT,EAAA,~~2CAAQ~~,~~GAAI~~,~~EAAA~~,~~EAAA~~,SAAA,EAAU,~~qBAEX~~,~~OAAU~~,~~mBAAA~~,KAAA,CAAA,aAAA,CAAC,~~WAAQ~~,~~KAAO,~~EAAA,MAAA,CAAO,~~KAAK~~,~~GAAM~~,CAAA,~~EAAA~~,CAAA,uCAAM,~~sBAAuB~~,EAAA,~~EAAA~~,SAAA,EAAsB,cAAc,~~QAAU~~,~~EAAA~~,oBAAA,EAA4C,MAAY,CACpL,CAAA;AACR"}
1	+ {"version":3,"file":"DialogThreadMessages.js","sources":["../../../src/screens/inbox/DialogThreadMessages.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Box, Spinner, Text } from '@admin-layout/gluestack-ui-mobile';\nimport { ThreadConversationView } from './containers/ThreadConversationView';\nimport { ThreadsView } from './containers/ThreadsView';\nimport { useChannelDetailQuery, useSendThreadMessage } from '../../queries/inboxQueries';\nimport { useFocusEffect } from '@react-navigation/native';\n// import { useSelector } from 'react-redux';\nimport colors from 'tailwindcss/colors';\n\nexport function DialogThreadMessages({ channelId, postParentId, isPostParentIdThread, role }) {\n const { data, loading: channelLoading, refetch } = useChannelDetailQuery(channelId?.toString(), {});\n\n const [sendThreadMessage] = useSendThreadMessage();\n const [loading, setLoading] = React.useState<boolean>(true);\n const [channel, setChannel] = React.useState<any>(null);\n const [parentId, setParentId] = React.useState<any>(postParentId);\n\n const refetchChannelDetail = React.useCallback(\n (id: string) => {\n return refetch({ id: id?.toString() });\n },\n [channelId],\n );\n\n useFocusEffect(\n React.useCallback(() => {\n // Do something when the screen is focused\n if (channelId) refetch({ id: channelId?.toString() });\n return () => {};\n }, [channelId]),\n );\n\n React.useEffect(() => {\n setParentId(postParentId);\n }, [postParentId]);\n\n React.useEffect(() => {\n if (data?.viewChannelDetail) {\n setChannel(data?.viewChannelDetail);\n setLoading(false);\n }\n }, [data]);\n\n // React.useEffect(() => {\n // async function sendInitialMessage(channel: any) {\n // const content = `Welcome to ${channel?.title}`;\n // const createdBy = channel?.creator?.id;\n // await sendThreadMessage({\n // variables: {\n // channelId,\n // threadMessageInput: {\n // content,\n // role,\n // },\n // responderId: createdBy,\n // },\n // update: (cache, { data, errors }: any) => {\n // if (!data) {\n // return;\n // }\n // setParentId(data?.sendThreadMessage?.lastMessage?.id);\n // },\n // });\n // }\n // if ((!parentId \|\| parentId == 0) && channel) {\n // sendInitialMessage(channel);\n // }\n\n // if (parentId) setLoading(false);\n // }, [parentId, channel]);\n\n return (\n <Box className=\"bg-white flex-1\">\n {/* {loading && !parentId ? ( */}\n {loading ? (\n <Spinner color={colors.blue[500]} />\n ) : (\n <ThreadConversationView\n channelId={channelId}\n postParentId={parentId}\n isPostParentIdThread={isPostParentIdThread}\n role={role}\n />\n )}\n </Box>\n );\n}\n\nexport default DialogThreadMessages;\n"],"names":[],"mappings":"wVAQO,SAAS,oBAAA,CAAqB;AAAA,EACnC,SAAA;AAAA,EACA,YAAA;AAAA,EACA,oBAAA;AAAA,EACA;AACF,CAAA,EAAG;AACD,EAAA,MAAM;AAAA,IACJ,IAAA;AAAA,IACA,OAAA,EAAS,cAAA;AAAA,IACT;AAAA,GACF,GAAI,qBAAA,CAAsB,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAW,QAAA,EAAA,EAAY,EAAE,CAAA;AACnD,EAAA,MAAM,CAAC,iBAAiB,CAAA,GAAI,oBAAA,EAAqB;AACjD,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAI,KAAA,CAAM,SAAkB,IAAI,CAAA;AAC1D,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAI,KAAA,CAAM,SAAc,IAAI,CAAA;AACtD,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,KAAA,CAAM,SAAc,YAAY,CAAA;AAChE,EAA6B,KAAA,CAAM,WAAA,CAAY,CAAC,EAAA,KAAe;AAC7D,IAAA,OAAO,OAAA,CAAQ;AAAA,MACb,IAAI,EAAA,IAAA,IAAA,GAAA,MAAA,GAAA,EAAA,CAAI,QAAA;AAAA,KACT,CAAA;AAAA,EACH,CAAA,EAAG,CAAC,SAAS,CAAC;AACd,EAAA,cAAA,CAAe,KAAA,CAAM,YAAY,MAAM;AAErC,IAAA,IAAI,WAAW,OAAA,CAAQ;AAAA,MACrB,IAAI,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAW,QAAA;AAAA,KAChB,CAAA;AACD,IAAA,OAAO,MAAM;AAAA,IAAC,CAAA;AAAA,EAChB,CAAA,EAAG,CAAC,SAAS,CAAC,CAAC,CAAA;AACf,EAAA,KAAA,CAAM,UAAU,MAAM;AACpB,IAAA,WAAA,CAAY,YAAY,CAAA;AAAA,EAC1B,CAAA,EAAG,CAAC,YAAY,CAAC,CAAA;AACjB,EAAA,KAAA,CAAM,UAAU,MAAM;AACpB,IAAA,IAAI,6BAAM,iBAAA,EAAmB;AAC3B,MAAA,UAAA,CAAW,6BAAM,iBAAiB,CAAA;AAClC,MAAA,UAAA,CAAW,KAAK,CAAA;AAAA,IAClB;AAAA,EACF,CAAA,EAAG,CAAC,IAAI,CAAC,CAAA;AA8BT,EAAA,uBAAO,KAAA,CAAA,aAAA,CAAC,OAAI,SAAA,EAAU,iBAAA,EAAA,EAEX,0BAAU,KAAA,CAAA,aAAA,CAAC,OAAA,EAAA,EAAQ,OAAO,MAAA,CAAO,IAAA,CAAK,GAAG,CAAA,EAAG,CAAA,uCAAM,sBAAA,EAAA,EAAuB,SAAA,EAAsB,cAAc,QAAA,EAAU,oBAAA,EAA4C,MAAY,CACpL,CAAA;AACR"}

package/lib/screens/inbox/DialogThreads.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import*as React from'react';import {Spinner,Box}from'@admin-layout/gluestack-ui-mobile';import {ThreadsView}from'./containers/ThreadsView.js';import {useViewChannelDetailQuery,useThreadMessagesQuery}from'common/graphql';import {useFocusEffect}from'@react-navigation/native';import {config}from'./config/config.js';import colors from'tailwindcss/colors';const {
+import*as React from'react';import {Spinner,Box}from'@admin-layout/gluestack-ui-mobile';import {ThreadsView}from'./containers/ThreadsView.js';import {useChannelDetailQuery,useThreadMessagesQueryWithOptions}from'../../queries/inboxQueries.js';import {useFocusEffect}from'@react-navigation/native';import {config}from'./config/config.js';import colors from'tailwindcss/colors';import {useSafeDialogThreadsMachine}from'./hooks/useSafeDialogThreadsMachine.js';import {Actions,BaseState}from'./workflow/dialog-threads-xstate.js';const {
   MESSAGES_PER_PAGE
 } = config;
 function DialogThreads({
@@ -6,22 +6,29 @@ function DialogThreads({
   postParentId,
   role
 }) {
+  var _a;
+  const [state, send] = useSafeDialogThreadsMachine();
+  const {
+    context,
+    value
+  } = state;
+  const {
+    channelsDetail,
+    loading,
+    error
+  } = context;
   const {
     data: channelData,
     loading: channelLoading,
     refetch: channelRefetch
-  } = useViewChannelDetailQuery({
-    variables: {
-      id: channelId == null ? void 0 : channelId.toString()
-    }
-  });
+  } = useChannelDetailQuery(channelId == null ? void 0 : channelId.toString(), {});
   const {
     data: threadsData,
     loading: threadLoading,
     error: threadsError,
     refetch: threadsRefetch,
     subscribeToMore: threadsSubscribeToMore
-  } = useThreadMessagesQuery({
+  } = useThreadMessagesQueryWithOptions({
     variables: {
       channelId: channelId == null ? void 0 : channelId.toString(),
       role: role == null ? void 0 : role.toString(),
@@ -29,27 +36,58 @@ function DialogThreads({
       repliesLimit2: 5
     }
   });
-  const channelsDetail = React.useMemo(() => {
-    if (!(channelData == null ? void 0 : channelData.viewChannelDetail))
-      return null;
-    return channelData == null ? void 0 : channelData.viewChannelDetail;
+  console.log("threadsData", (_a = threadsData == null ? void 0 : threadsData.threadMessages) == null ? void 0 : _a.totalCount);
+  console.log("channelid", channelId);
+  React.useEffect(() => {
+    send({
+      type: Actions.INITIALIZE,
+      data: {
+        channelId,
+        postParentId,
+        role
+      }
+    });
+  }, [channelId, postParentId, role]);
+  React.useEffect(() => {
+    if (channelData == null ? void 0 : channelData.viewChannelDetail) {
+      send({
+        type: Actions.SET_CHANNEL_DETAIL,
+        data: {
+          channelsDetail: channelData.viewChannelDetail
+        }
+      });
+    }
   }, [channelData]);
+  React.useEffect(() => {
+    var _a2;
+    if (threadsData) {
+      send({
+        type: Actions.SET_THREADS,
+        data: {
+          threadData: ((_a2 = threadsData == null ? void 0 : threadsData.threadMessages) == null ? void 0 : _a2.data) || []
+        }
+      });
+    }
+  }, [threadsData]);
+  React.useEffect(() => {
+    if (threadsError) {
+      send({
+        type: Actions.ERROR,
+        data: {
+          error: threadsError
+        }
+      });
+    }
+  }, [threadsError]);
   const refetchChannelDetail = React.useCallback((id) => {
     return channelRefetch({
       id: id == null ? void 0 : id.toString()
     });
   }, [channelId]);
   useFocusEffect(React.useCallback(() => {
-    if (channelId)
-      refetchChannelDetail(channelId);
+    if (channelId) refetchChannelDetail(channelId);
     return () => {
     };
   }, []));
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, channelLoading ? /* @__PURE__ */ React.createElement(Spinner, { color: colors.blue[500] }) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    Box,
-    {
-      className: "flex-1 bg-gray-200 dark:border-gray-500 dark:bg-gray-500  "
-    },
-    /* @__PURE__ */ React.createElement(ThreadsView, { data: threadsData, loading: threadLoading, refetch: threadsRefetch, subscribeToMore: threadsSubscribeToMore, error: threadsError, channelId, role, channelsDetail, refetchChannelDetail })
-  )));
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, state.matches(BaseState.LoadingChannel) || channelLoading ? /* @__PURE__ */ React.createElement(Spinner, { color: colors.blue[500] }) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Box, { className: "flex-1 bg-gray-200 dark:border-gray-500 dark:bg-gray-500" }, /* @__PURE__ */ React.createElement(ThreadsView, { data: threadsData, loading: threadLoading || state.matches(BaseState.LoadingThreads), refetch: threadsRefetch, subscribeToMore: threadsSubscribeToMore, error: error || threadsError, channelId, role, channelsDetail, refetchChannelDetail }))));
 }export{DialogThreads,DialogThreads as default};//# sourceMappingURL=DialogThreads.js.map

package/lib/screens/inbox/DialogThreads.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DialogThreads.js","sources":["../../../src/screens/inbox/DialogThreads.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Box, Spinner, Text } from '@admin-layout/gluestack-ui-mobile';\nimport { ThreadConversationView } from './containers/ThreadConversationView';\nimport { ThreadsView } from './containers/ThreadsView';\nimport { ~~useViewChannelDetailQuery~~, ~~useThreadMessagesQuery~~ } from '~~common~~/~~graphql~~';\nimport { useFocusEffect } from '@react-navigation/native';\nimport { useSelector } from 'react-redux';\nimport { config } from './config';\nimport colors from 'tailwindcss/colors';\nconst { MESSAGES_PER_PAGE } = config;\n\nexport function DialogThreads({ channelId, postParentId, role }) {\n const {\n data: channelData,\n loading: channelLoading,\n refetch: channelRefetch,\n } = ~~useViewChannelDetailQuery~~(~~{\n variables: {\n id:~~ channelId?.toString()~~,\n~~ }~~,\n }~~);\n\n const {\n data: threadsData,\n loading: threadLoading,\n error: threadsError,\n refetch: threadsRefetch,\n subscribeToMore: threadsSubscribeToMore,\n } = ~~useThreadMessagesQuery~~({\n variables: {\n channelId: channelId?.toString(),\n role: role?.toString(),\n limit: MESSAGES_PER_PAGE,\n repliesLimit2: 5,\n },\n // ~~fetchPolicy~~: ~~'cache-and-network'~~,\n });\n\n ~~const~~ ~~channelsDetail~~ = React.~~useMemo~~(() => {\n if (!channelData?.viewChannelDetail) ~~return~~ ~~null~~;\n ~~return~~ channelData?.~~viewChannelDetail~~;\n }, [~~channelData~~]);\n\n const refetchChannelDetail = React.useCallback(\n (id: string) => {\n return channelRefetch({ id: id?.toString() });\n },\n [channelId],\n );\n\n useFocusEffect(\n React.useCallback(() => {\n // Do something when the screen is focused\n if (channelId) refetchChannelDetail(channelId);\n return () => {};\n }, []),\n );\n\n return (\n ~~// <Box bg={'white'} flex={1} pt={5}>\n~~ <>\n {channelLoading ? (\n <Spinner color={colors.blue[500]} />\n ) : (\n <>\n <Box~~\n //~~ ~~$dark-borderColor=\"$coolGray600\"\n // $dark-backgroundColor=\"$trueGray700\"\n // $light-backgroundColor=\"$trueGray50\"\n~~ className=\"flex-1 bg-gray-200 dark:border-gray-500 dark:bg-gray-500 \"\n >\n <ThreadsView\n data={threadsData}\n loading={threadLoading}\n refetch={threadsRefetch}\n subscribeToMore={threadsSubscribeToMore}\n error={threadsError}\n channelId={channelId}\n role={role}\n channelsDetail={channelsDetail}\n refetchChannelDetail={refetchChannelDetail}\n />\n </Box>\n </>\n )}\n </>\n );\n~~\n // return (\n // // <Box bg={'white'~~} ~~flex={1} pt={5}>\n // <>\n // {channelLoading ? (~~\n ~~// <Spinner />\n // ) : (~~\n // <>\n // {postParentId \|\| postParentId == 0 ? (\n // <Box bg={'white'} flex={1}>\n // <ThreadConversationView\n // channelId={channelId}\n // postParentId={postParentId}\n // channelsDetail={channelsDetail}\n // refetchChannelDetail={refetchChannelDetail}\n // />\n // </Box>\n // ) : (\n // <Box\n // flex={1}\n // _dark={{\n // borderColor: 'coolGray.600',\n // backgroundColor: 'gray.700',\n // }}\n // _light={{\n // backgroundColor: 'gray.50',\n // }}\n // >\n // <ThreadsView\n // channelId={channelId}\n // channelsDetail={channelsDetail}\n // refetchChannelDetail={refetchChannelDetail}\n // />\n // </Box>\n // )}\n // </>\n // )}\n // </>\n // );\n}\n\nexport default DialogThreads;\n"],"names":[],"mappings":"~~iWASA~~,MAAM;AAAA,EACJ;AACF,~~CAAI~~,~~GAAA~~,MAAA;AACG,SAAS,~~aAAc~~,~~CAAA~~;AAAA,EAC5B,SAAA;AAAA,EACA,YAAA;AAAA,EACA;AACF,~~CAAG~~,EAAA;~~AACD~~,~~EAAM~~,~~MAAA~~;AAAA,IACJ,~~IAAM~~,~~EAAA,WAAA~~;AAAA,~~IACN~~,~~OAAS~~,EAAA,cAAA;AAAA,~~IACT~~,~~OAAS~~,EAAA;AAAA,~~MACP~~,~~yBAA0B~~,~~CAAA~~;AAAA,~~IAC5B~~,~~SAAW~~,~~EAAA~~;AAAA,~~MACT~~,~~IAAI~~,~~SAAW~~,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,~~CAAA~~,QAAA~~;AAAA;AACjB~~,~~GACD~~,CAAA;~~AACD~~,~~EAAM~~,~~MAAA~~;AAAA,IACJ,~~IAAM~~,~~EAAA~~,WAAA;AAAA,IACN,~~OAAS~~,~~EAAA~~,aAAA;AAAA,IACT,~~KAAO~~,~~EAAA~~,YAAA;AAAA,IACP,~~OAAS~~,~~EAAA~~,cAAA;AAAA,IACT,~~eAAiB~~,~~EAAA~~;AAAA,MACf,~~sBAAuB~~,~~CAAA~~;AAAA,~~IACzB~~,~~SAAW~~,~~EAAA~~;AAAA,MACT,WAAW,~~SAAW~~,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,~~CAAA~~,QAAA,EAAA;AAAA,MACtB,MAAM,~~IAAM~~,IAAA,IAAA,GAAA,MAAA,GAAA,IAAA,~~CAAA~~,QAAA,EAAA;AAAA,MACZ,~~KAAO~~,~~EAAA~~,iBAAA;AAAA,MACP,~~aAAe~~,~~EAAA~~;AAAA;AACjB,~~GAED~~,CAAA;AACD,~~EAAM~~,MAAA,cAAA,~~GAAiB~~,~~KAAM~~,CAAA,OAAA,CAAQ,MAAM;~~AACzC~~,IAAA,~~IAAI~~,~~EAAC~~,~~WAAa~~,IAAA,IAAA,~~GAAA~~,MAAA,~~GAAA~~,WAAA,CAAA,~~iBAAA~~,CAAA;~~AAAmB~~,~~MAAO~~,~~OAAA~~,IAAA;~~AAC5C~~,IAAA,~~OAAO~~,~~WAAa~~,IAAA,IAAA,GAAA,MAAA,GAAA,WAAA,CAAA,~~iBAAA~~;AAAA,~~GACtB~~,EAAG,CAAC,WAAW,CAAC,CAAA;AAChB,EAAA,MAAM,~~oBAAuB~~,~~GAAA~~,KAAA,CAAM,~~WAAY~~,~~CAAA~~,CAAC,~~EAAe~~,~~KAAA~~;AAC7D,IAAA,OAAO,~~cAAe~~,~~CAAA~~;AAAA,MACpB,IAAI,~~EAAI~~,IAAA,IAAA,GAAA,MAAA,GAAA,EAAA,~~CAAA~~,QAAA;AAAA,KACT,CAAA;AAAA,~~GACH~~,EAAG,CAAC,SAAS,CAAC,CAAA;AACd,~~EAAe~~,cAAA,~~CAAA~~,KAAA,CAAM,YAAY,MAAM;AAErC,IAAI,~~IAAA,~~SAAA~~;AAAW~~,~~MAAA~~,~~oBAAA,CAAqB,~~SAAS,CAAA;AAC7C,IAAA,OAAO,MAAM;AAAA,~~KAAC~~;AAAA,~~GAChB~~,EAAG,EAAE,CAAC,CAAA;AACN,~~EAEE~~,~~uBAAA~~,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,~~EACS~~,~~iCAAkB~~,~~KAAA~~,~~CAAA~~,~~aAAA~~,CAAA,OAAA,EAAA,EAAQ,~~OAAO~~,~~MAAO~~,~~CAAA~~,IAAA,CAAK,~~GAAM~~,~~CAAA~~,~~EAAA,~~CAAA,~~mBAC5C~~,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,~~kBAAA~~,~~KAAA,CAAA,aAAA;AAAA,IAAC,~~GAAA~~;AAAA~~,~~IAAA;AAAA~~,~~MAIb~~,~~SAAU~~,~~EAAA;AAAA~~,~~KAAA;AAAA~~,~~oBACO,~~KAAA,CAAA,aAAA,~~CAAA~~,WAAA,EAAA,EAAY,~~IAAM~~,~~EAAA,~~WAAA,EAAa,~~SAAS~~,~~aAAe~~,~~EAAA~~,OAAA,~~EAAS~~,~~cAAgB~~,~~EAAA~~,eAAA,EAAiB,wBAAwB,~~KAAO~~,~~EAAA~~,~~YAAA~~,~~EAAc~~,~~SAAsB~~,~~EAAA~~,IAAA,EAAY,gBAAgC,~~oBAA4C~~,~~EAAA;AAAA~~,~~GAErQ~~,CACR,CAAA;~~AAyCR~~"}
1	+ {"version":3,"file":"DialogThreads.js","sources":["../../../src/screens/inbox/DialogThreads.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Box, Spinner, Text } from '@admin-layout/gluestack-ui-mobile';\nimport { ThreadConversationView } from './containers/ThreadConversationView';\nimport { ThreadsView } from './containers/ThreadsView';\nimport { useChannelDetailQuery, useThreadMessagesQueryWithOptions } from '../../queries/inboxQueries';\nimport { useFocusEffect } from '@react-navigation/native';\nimport { useSelector } from 'react-redux';\nimport { config } from './config';\nimport colors from 'tailwindcss/colors';\nimport { useSafeDialogThreadsMachine } from './hooks/useSafeDialogThreadsMachine';\nimport { Actions, BaseState } from './workflow/dialog-threads-xstate';\nconst { MESSAGES_PER_PAGE } = config;\n\nexport function DialogThreads({ channelId, postParentId, role }) {\n // Use the XState machine for state management\n const [state, send] = useSafeDialogThreadsMachine();\n const { context, value } = state;\n const { channelsDetail, loading, error } = context;\n\n // Fetch channel details\n const {\n data: channelData,\n loading: channelLoading,\n refetch: channelRefetch,\n } = useChannelDetailQuery(channelId?.toString(), {});\n\n // Fetch thread messages\n const {\n data: threadsData,\n loading: threadLoading,\n error: threadsError,\n refetch: threadsRefetch,\n subscribeToMore: threadsSubscribeToMore,\n } = useThreadMessagesQueryWithOptions({\n variables: {\n channelId: channelId?.toString(),\n role: role?.toString(),\n limit: MESSAGES_PER_PAGE,\n repliesLimit2: 5,\n },\n });\n console.log('threadsData', threadsData?.threadMessages?.totalCount);\n console.log('channelid', channelId);\n // Initialize the machine with props\n React.useEffect(() => {\n send({\n type: Actions.INITIALIZE,\n data: { channelId, postParentId, role },\n });\n }, [channelId, postParentId, role]);\n\n // Update channel detail in state when data changes\n React.useEffect(() => {\n if (channelData?.viewChannelDetail) {\n send({\n type: Actions.SET_CHANNEL_DETAIL,\n data: { channelsDetail: channelData.viewChannelDetail },\n });\n }\n }, [channelData]);\n\n // Update thread data in state when data changes\n React.useEffect(() => {\n if (threadsData) {\n send({\n type: Actions.SET_THREADS,\n data: { threadData: threadsData?.threadMessages?.data \|\| [] },\n });\n }\n }, [threadsData]);\n\n // Handle errors\n React.useEffect(() => {\n if (threadsError) {\n send({\n type: Actions.ERROR,\n data: { error: threadsError },\n });\n }\n }, [threadsError]);\n\n const refetchChannelDetail = React.useCallback(\n (id: string) => {\n return channelRefetch({ id: id?.toString() });\n },\n [channelId],\n );\n\n useFocusEffect(\n React.useCallback(() => {\n // Do something when the screen is focused\n if (channelId) refetchChannelDetail(channelId);\n return () => {};\n }, []),\n );\n\n return (\n <>\n {state.matches(BaseState.LoadingChannel) \|\| channelLoading ? (\n <Spinner color={colors.blue[500]} />\n ) : (\n <>\n <Box className=\"flex-1 bg-gray-200 dark:border-gray-500 dark:bg-gray-500\">\n <ThreadsView\n data={threadsData}\n loading={threadLoading \|\| state.matches(BaseState.LoadingThreads)}\n refetch={threadsRefetch}\n subscribeToMore={threadsSubscribeToMore}\n error={error \|\| threadsError}\n channelId={channelId}\n role={role}\n channelsDetail={channelsDetail}\n refetchChannelDetail={refetchChannelDetail}\n />\n </Box>\n </>\n )}\n </>\n );\n}\n\nexport default DialogThreads;\n"],"names":["_a"],"mappings":"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"}

package/lib/screens/inbox/Inbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Inbox.js","sources":["../../../src/screens/inbox/Inbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Box, Text } from '@admin-layout/gluestack-ui-mobile';\n\nimport { Dialogs } from './containers/Dialogs';\n// import { SupportServiceDialogs } from './containers/SupportServiceDialogs';\n\nexport const Inbox = (props: any) => {\n const { channelFilters, channelRole, supportServices } = props;\n return (\n <Box className=\"flex-1 bg-white\">\n {/* {supportServices && (\n <SupportServiceDialogs channelFilters={channelFilters} channelRole={channelRole} {...props} />\n )} */}\n <Dialogs channelFilters={channelFilters} channelRole={channelRole} {...props} />\n </Box>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;~~AAKa~~,~~MAAA~~,KAAA,GAAQ,CAAC,KAAe~~,KAAA~~;AACnC,~~EAAM~~,~~MAAA~~;AAAA,IACJ,cAAA;AAAA,IACA,WAAA;AAAA,IACA;AAAA,~~GACE~~,~~GAAA~~,KAAA;AACJ,~~EAAO~~,~~uBAAA~~,KAAA,CAAA,aAAA,CAAC,OAAI,~~SAAU~~,~~EAAA~~,iBAAA,EAAA,sCAIX,~~OAAQ~~,EAAA,cAAA,CAAA,~~EAAA~~,cAAA,EAAgC,~~WAA8B~~,EAAA,~~EAAA~~,KAAA,CAAO,CAClF,CAAA;AACR"}
1	+ {"version":3,"file":"Inbox.js","sources":["../../../src/screens/inbox/Inbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Box, Text } from '@admin-layout/gluestack-ui-mobile';\n\nimport { Dialogs } from './containers/Dialogs';\n// import { SupportServiceDialogs } from './containers/SupportServiceDialogs';\n\nexport const Inbox = (props: any) => {\n const { channelFilters, channelRole, supportServices } = props;\n return (\n <Box className=\"flex-1 bg-white\">\n {/* {supportServices && (\n <SupportServiceDialogs channelFilters={channelFilters} channelRole={channelRole} {...props} />\n )} */}\n <Dialogs channelFilters={channelFilters} channelRole={channelRole} {...props} />\n </Box>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAKO,MAAM,KAAA,GAAQ,CAAC,KAAA,KAAe;AACnC,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,WAAA;AAAA,IACA;AAAA,GACF,GAAI,KAAA;AACJ,EAAA,uBAAO,KAAA,CAAA,aAAA,CAAC,OAAI,SAAA,EAAU,iBAAA,EAAA,sCAIX,OAAA,EAAA,cAAA,CAAA,EAAQ,cAAA,EAAgC,WAAA,EAAA,EAA8B,KAAA,CAAO,CAClF,CAAA;AACR"}

package/lib/screens/inbox/components/CachedImage/consts.js CHANGED Viewed

	@@ -1 +1 @@
1	- import*as FileSystem from'expo-file-system';const IMAGE_CACHE_FOLDER = `${FileSystem.cacheDirectory}/image-cache/`;export{IMAGE_CACHE_FOLDER~~,IMAGE_CACHE_FOLDER as default~~};//# sourceMappingURL=consts.js.map
1	+ import*as FileSystem from'expo-file-system';const IMAGE_CACHE_FOLDER = `${FileSystem.cacheDirectory}/image-cache/`;export{IMAGE_CACHE_FOLDER};//# sourceMappingURL=consts.js.map

package/lib/screens/inbox/components/CachedImage/consts.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"consts.js","sources":["../../../../../src/screens/inbox/components/CachedImage/consts.ts"],"sourcesContent":["import * as FileSystem from 'expo-file-system';\n\n// Make sure cache directory path ends with a slash\nexport const IMAGE_CACHE_FOLDER = `${FileSystem.cacheDirectory}/image-cache/`;\n// export const IMAGE_CACHE_FOLDER = `${FileSystem.documentDirectory}images/`\nexport default IMAGE_CACHE_FOLDER;\n"],"names":[],"mappings":"~~4CAGa~~,~~MAAA~~,kBAAA,GAAqB,~~GAAG~~,~~UAAW~~,~~CAAA~~,~~cAAA~~,CAAA,aAAA"}
1	+ {"version":3,"file":"consts.js","sources":["../../../../../src/screens/inbox/components/CachedImage/consts.ts"],"sourcesContent":["import * as FileSystem from 'expo-file-system';\n\n// Make sure cache directory path ends with a slash\nexport const IMAGE_CACHE_FOLDER = `${FileSystem.cacheDirectory}/image-cache/`;\n// export const IMAGE_CACHE_FOLDER = `${FileSystem.documentDirectory}images/`\nexport default IMAGE_CACHE_FOLDER;\n"],"names":[],"mappings":"4CAGO,MAAM,kBAAA,GAAqB,CAAA,EAAG,UAAA,CAAW,cAAc,CAAA,aAAA"}

package/lib/screens/inbox/components/CachedImage/index.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import React__default,{useState,useRef,useEffect}from'react';import {Image,View,Text}from'react-native';import*as FileSystem from'expo-file-system';import {IMAGE_CACHE_FOLDER}from'./consts.js';var __defProp = Object.defineProperty;
+import React__default,{useState,useRef,useCallback,useEffect,useMemo}from'react';import {View,Text,Image}from'react-native';import*as FileSystem from'expo-file-system';import {IMAGE_CACHE_FOLDER}from'./consts.js';var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
 var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -17,182 +17,192 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+const downloadTracker = /* @__PURE__ */ new Map();
 const ensureCacheDirectory = async () => {
   try {
     const dirInfo = await FileSystem.getInfoAsync(IMAGE_CACHE_FOLDER);
     if (!dirInfo.exists) {
-      console.log("Creating cache directory:", IMAGE_CACHE_FOLDER);
       await FileSystem.makeDirectoryAsync(IMAGE_CACHE_FOLDER, {
         intermediates: true
       });
     }
+    return true;
   } catch (error) {
-    console.error("Failed to create cache directory:", error);
+    return false;
   }
 };
 const validateImageUri = (uri) => {
-  if (!uri)
-    return null;
+  if (!uri) return null;
   uri = uri.trim();
   try {
     new URL(uri);
   } catch (e) {
-    console.log("Invalid URL format:", uri);
     return null;
   }
   return uri;
 };
-const CachedImage = (props) => {
-  const {
+const CachedImage = React__default.memo((props) => {
+  const _a = props, {
     source,
     cacheKey,
-    placeholderContent
-  } = props;
+    placeholderContent,
+    style,
+    resizeMode,
+    alt
+  } = _a, restProps = __objRest(_a, [
+    "source",
+    "cacheKey",
+    "placeholderContent",
+    "style",
+    "resizeMode",
+    "alt"
+  ]);
   const {
     uri: originalUri,
     headers,
-    expiresIn
+    expiresIn = 86400
   } = source;
   const uri = validateImageUri(originalUri);
   const fileURI = `${IMAGE_CACHE_FOLDER}${cacheKey}`;
-  const [imgUri, setImgUri] = useState(fileURI);
+  const [imgUri, setImgUri] = useState(null);
   const [loadError, setLoadError] = useState(false);
   const [useFallbackUri, setUseFallbackUri] = useState(false);
+  const [isLoading, setIsLoading] = useState(true);
   const componentIsMounted = useRef(true);
+  const hasAttemptedLoad = useRef(false);
   const requestOption = headers ? {
     headers
   } : {};
-  const _callback = (downloadProgress) => {
-    var _a;
+  const downloadCallback = useCallback((downloadProgress) => {
+    var _a2;
     if (componentIsMounted.current === false) {
-      (_a = downloadResumableRef.current) == null ? void 0 : _a.pauseAsync();
+      downloadTracker.delete(cacheKey);
+      (_a2 = downloadResumableRef.current) == null ? void 0 : _a2.pauseAsync();
       FileSystem.deleteAsync(fileURI, {
         idempotent: true
       });
     }
-  };
-  const downloadResumableRef = useRef(uri ? FileSystem.createDownloadResumable(uri, fileURI, requestOption, _callback) : null);
-  useEffect(() => {
-    const initCache = async () => {
-      await ensureCacheDirectory();
-      if (uri) {
-        loadImage();
-      } else {
-        console.log("Image URI is invalid, not loading");
-        setLoadError(true);
-      }
-    };
-    console.log("CachedImage loading with URI:", uri);
-    console.log("Cache key:", cacheKey);
-    initCache();
-    return () => {
-      componentIsMounted.current = false;
-    };
-  }, []);
-  const loadImage = async () => {
+  }, [fileURI, cacheKey]);
+  const downloadResumableRef = useRef(uri ? FileSystem.createDownloadResumable(uri, fileURI, requestOption, downloadCallback) : null);
+  const loadImage = useCallback(async () => {
+    if (!uri || hasAttemptedLoad.current) return;
+    hasAttemptedLoad.current = true;
+    setIsLoading(true);
     try {
+      if (downloadTracker.has(cacheKey)) {
+        await downloadTracker.get(cacheKey);
+        if (componentIsMounted.current) {
+          setImgUri(fileURI);
+          setIsLoading(false);
+        }
+        return;
+      }
       const metadata = await FileSystem.getInfoAsync(fileURI);
-      const expired = expiresIn && new Date().getTime() / 1e3 - (metadata == null ? void 0 : metadata.modificationTime) > expiresIn;
-      console.log({
-        expiresIn,
-        expired
-      });
-      console.log({
-        modificationTime: metadata.modificationTime,
-        currentTime: new Date().getTime() / 1e3
-      });
-      console.log({
-        metadata
-      });
+      const expired = expiresIn && (/* @__PURE__ */ new Date()).getTime() / 1e3 - (metadata == null ? void 0 : metadata.modificationTime) > expiresIn;
       if (!metadata.exists || (metadata == null ? void 0 : metadata.size) === 0 || expired) {
-        if (componentIsMounted.current) {
-          setImgUri(null);
-          if (expired) {
-            await FileSystem.deleteAsync(fileURI, {
-              idempotent: true
-            });
-          }
-          setImgUri(null);
-          console.log("Downloading image from URI:", uri);
-          if (!uri) {
-            console.log("Image URI is undefined or null");
-            setLoadError(true);
-            return;
-          }
-          if (!downloadResumableRef.current) {
-            console.log("Download resumable is null");
-            setUseFallbackUri(true);
-            setImgUri(uri);
-            return;
-          }
-          try {
-            const response = await downloadResumableRef.current.downloadAsync();
-            console.log("Download response:", response);
-            if (componentIsMounted.current && response && response.status === 200) {
-              setImgUri(`${fileURI}?`);
-              console.log("Image cached successfully, new URI:", `${fileURI}?`);
+        if (!componentIsMounted.current) return;
+        if (expired && metadata.exists) {
+          await FileSystem.deleteAsync(fileURI, {
+            idempotent: true
+          });
+        }
+        if (!uri) {
+          setLoadError(true);
+          setIsLoading(false);
+          return;
+        }
+        if (!downloadResumableRef.current) {
+          setUseFallbackUri(true);
+          setImgUri(uri);
+          setIsLoading(false);
+          return;
+        }
+        try {
+          const downloadPromise = downloadResumableRef.current.downloadAsync();
+          downloadTracker.set(cacheKey, downloadPromise);
+          const response = await downloadPromise;
+          downloadTracker.delete(cacheKey);
+          if (componentIsMounted.current) {
+            if (response && response.status === 200) {
+              setImgUri(fileURI);
             } else {
-              console.log("Failed to download image, status:", response == null ? void 0 : response.status);
-              console.log("Falling back to original URI");
               setUseFallbackUri(true);
               setImgUri(uri);
               FileSystem.deleteAsync(fileURI, {
                 idempotent: true
               });
             }
-          } catch (downloadError) {
-            console.log("Error downloading image:", downloadError);
-            console.log("Falling back to original URI");
+            setIsLoading(false);
+          }
+        } catch (downloadError) {
+          downloadTracker.delete(cacheKey);
+          if (componentIsMounted.current) {
             setUseFallbackUri(true);
             setImgUri(uri);
+            setIsLoading(false);
           }
         }
       } else {
-        console.log("Using cached image at:", fileURI);
+        setImgUri(fileURI);
+        setIsLoading(false);
       }
     } catch (err) {
-      console.log({
-        err
-      });
-      console.log("Falling back to original URI");
-      setUseFallbackUri(true);
-      setImgUri(uri);
+      if (componentIsMounted.current) {
+        setUseFallbackUri(true);
+        setImgUri(uri);
+        setIsLoading(false);
+      }
     }
-  };
-  console.log({
-    placeholderContent,
-    imgUri,
-    loadError,
-    useFallbackUri
-  });
-  const defaultPlaceholder = /* @__PURE__ */ React__default.createElement(View, { style: {
+  }, [uri, fileURI, cacheKey, expiresIn]);
+  useEffect(() => {
+    const setup = async () => {
+      const directoryExists = await ensureCacheDirectory();
+      if (directoryExists && uri) {
+        loadImage();
+      } else {
+        setLoadError(true);
+        setIsLoading(false);
+      }
+    };
+    setup();
+    return () => {
+      componentIsMounted.current = false;
+    };
+  }, [uri, loadImage]);
+  const defaultPlaceholder = useMemo(() => /* @__PURE__ */ React__default.createElement(View, { style: [{
     width: "100%",
     height: "100%",
     backgroundColor: "#e1e1e1",
     justifyContent: "center",
     alignItems: "center",
     borderRadius: 3
-  } }, /* @__PURE__ */ React__default.createElement(Text, null, "Image not available"));
-  if (!imgUri) {
+  }, style] }, /* @__PURE__ */ React__default.createElement(Text, null, "Image not available")), [style]);
+  if (isLoading || loadError || !imgUri) {
     return placeholderContent || defaultPlaceholder;
   }
-  return /* @__PURE__ */ React__default.createElement(
-    Image,
-    __spreadProps(__spreadValues({}, props), {
-      source: __spreadProps(__spreadValues({}, source), {
-        uri: useFallbackUri ? uri : imgUri
-      }),
-      onError: (e) => {
-        console.log("Image loading error:", e.nativeEvent.error);
-        if (useFallbackUri) {
-          setLoadError(true);
-          setImgUri(null);
-        } else {
-          console.log("Falling back to original URI after onError");
-          setUseFallbackUri(true);
-          setImgUri(uri);
-        }
-      }
-    })
-  );
-};export{CachedImage as default};//# sourceMappingURL=index.js.map
+  return /* @__PURE__ */ React__default.createElement(Image, __spreadProps(__spreadValues({}, restProps), { style, source: __spreadProps(__spreadValues({}, source), {
+    uri: useFallbackUri ? uri : imgUri
+  }), resizeMode, onError: (e) => {
+    if (useFallbackUri) {
+      setLoadError(true);
+      setImgUri(null);
+    } else {
+      setUseFallbackUri(true);
+      setImgUri(uri);
+    }
+  } }));
+}, (prevProps, nextProps) => {
+  return prevProps.cacheKey === nextProps.cacheKey && prevProps.source.uri === nextProps.source.uri && prevProps.style === nextProps.style;
+});export{CachedImage as default};//# sourceMappingURL=index.js.map

package/lib/screens/inbox/components/CachedImage/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../../src/screens/inbox/components/CachedImage/index.tsx"],"sourcesContent":["import React, { useEffect, useState, useRef } from 'react';\nimport { Image, View, Text } from 'react-native';\n// import { Image } from \"react-native\"\nimport * as FileSystem from 'expo-file-system';\n\nimport * as CONST from './consts';\n\n// Ensure the cache directory exists\nconst ensureCacheDirectory = async () => {\n try {\n const dirInfo = await FileSystem.getInfoAsync(CONST.IMAGE_CACHE_FOLDER);\n if (!dirInfo.exists) {\n console.log('Creating cache directory:', CONST.IMAGE_CACHE_FOLDER);\n await FileSystem.makeDirectoryAsync(CONST.IMAGE_CACHE_FOLDER, { intermediates: true });\n }\n } catch (error) {\n console.error('Failed to create cache directory:', error);\n }\n};\n\n// Validate and sanitize the image URL\nconst validateImageUri = (uri: string): string \| null => {\n if (!uri) return null;\n\n // Trim whitespace\n uri = uri.trim();\n\n // Check if it's a valid URL format\n try {\n new URL(uri);\n } catch (e) {\n console.log('Invalid URL format:', uri);\n return null;\n }\n\n // Add more validation as needed for your specific case\n return uri;\n};\n\nconst CachedImage = (props: any) => {\n const { source, cacheKey, placeholderContent } = props;\n const { uri: originalUri, headers, expiresIn } = source;\n\n // Validate and sanitize the URI\n const uri = validateImageUri(originalUri);\n\n const fileURI = `${CONST.IMAGE_CACHE_FOLDER}${cacheKey}`;\n\n const [imgUri, setImgUri] = useState<any>(fileURI);\n const [loadError, setLoadError] = useState<boolean>(false);\n const [useFallbackUri, setUseFallbackUri] = useState<boolean>(false);\n\n const componentIsMounted = useRef(true);\n const requestOption = headers ? { headers } : {};\n\n const _callback = (downloadProgress: any) => {\n if (componentIsMounted.current === false) {\n downloadResumableRef.current?.pauseAsync();\n FileSystem.deleteAsync(fileURI, { idempotent: true }); // delete file locally if it was not downloaded properly\n }\n };\n\n const downloadResumableRef = useRef(\n uri ? FileSystem.createDownloadResumable(uri, fileURI, requestOption, _callback) : null,\n );\n\n useEffect(() => {\n const initCache = async () => {\n await ensureCacheDirectory();\n if (uri) {\n loadImage();\n } else {\n console.log('Image URI is invalid, not loading');\n setLoadError(true);\n }\n };\n\n console.log('CachedImage loading with URI:', uri);\n console.log('Cache key:', cacheKey);\n\n initCache();\n\n return () => {\n componentIsMounted.current = false;\n };\n }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n const loadImage = async () => {\n try {\n // Use the cached image if it exists\n const metadata: any = await FileSystem.getInfoAsync(fileURI);\n const expired = expiresIn && new Date().getTime() / 1000 - metadata?.modificationTime > expiresIn;\n console.log({ expiresIn, expired });\n\n console.log({ modificationTime: metadata.modificationTime, currentTime: new Date().getTime() / 1000 });\n console.log({ metadata });\n\n if (!metadata.exists \|\| metadata?.size === 0 \|\| expired) {\n if (componentIsMounted.current) {\n setImgUri(null);\n\n if (expired) {\n await FileSystem.deleteAsync(fileURI, { idempotent: true });\n }\n // download to cache\n setImgUri(null);\n\n console.log('Downloading image from URI:', uri);\n if (!uri) {\n console.log('Image URI is undefined or null');\n setLoadError(true);\n return;\n }\n\n if (!downloadResumableRef.current) {\n console.log('Download resumable is null');\n setUseFallbackUri(true);\n setImgUri(uri);\n return;\n }\n\n try {\n const response: any = await downloadResumableRef.current.downloadAsync();\n console.log('Download response:', response);\n\n if (componentIsMounted.current && response && response.status === 200) {\n setImgUri(`${fileURI}?`); // deep clone to force re-render\n console.log('Image cached successfully, new URI:', `${fileURI}?`);\n } else {\n console.log('Failed to download image, status:', response?.status);\n console.log('Falling back to original URI');\n setUseFallbackUri(true);\n setImgUri(uri);\n FileSystem.deleteAsync(fileURI, { idempotent: true }); // delete file locally if it was not downloaded properly\n }\n } catch (downloadError) {\n console.log('Error downloading image:', downloadError);\n console.log('Falling back to original URI');\n setUseFallbackUri(true);\n setImgUri(uri);\n }\n }\n } else {\n console.log('Using cached image at:', fileURI);\n }\n } catch (err) {\n console.log({ err });\n console.log('Falling back to original URI');\n setUseFallbackUri(true);\n setImgUri(uri);\n }\n };\n\n console.log({ placeholderContent, imgUri, loadError, useFallbackUri });\n\n // Default placeholder if none is provided\n const defaultPlaceholder = (\n <View\n style={{\n width: '100%',\n height: '100%',\n backgroundColor: '#e1e1e1',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: 3,\n }}\n >\n <Text>Image not available</Text>\n </View>\n );\n\n if (!imgUri) {\n return placeholderContent \|\| defaultPlaceholder;\n }\n\n return (\n <Image\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...props}\n source={{\n ...source,\n uri: useFallbackUri ? uri : imgUri,\n }}\n onError={(e) => {\n console.log('Image loading error:', e.nativeEvent.error);\n // If we're already using the fallback URI and still getting an error,\n // then show the placeholder\n if (useFallbackUri) {\n setLoadError(true);\n setImgUri(null);\n } else {\n console.log('Falling back to original URI after onError');\n setUseFallbackUri(true);\n setImgUri(uri);\n }\n }}\n />\n );\n};\n\nexport const CacheManager = {\n addToCache: async ({ file, key }: any) => {\n await FileSystem.copyAsync({\n from: file,\n to: `${CONST.IMAGE_CACHE_FOLDER}${key}`,\n });\n // const uri = await FileSystem.getContentUriAsync(`${CONST.IMAGE_CACHE_FOLDER}${key}`)\n // return uri\n const uri = await CacheManager.getCachedUri({ key });\n return uri;\n },\n\n getCachedUri: async ({ key }: any) => {\n const uri = await FileSystem.getContentUriAsync(`${CONST.IMAGE_CACHE_FOLDER}${key}`);\n return uri;\n },\n\n downloadAsync: async ({ uri, key, options }: any) => {\n return await FileSystem.downloadAsync(uri, `${CONST.IMAGE_CACHE_FOLDER}${key}`, options);\n },\n};\n\nexport default CachedImage;\n"],"names":["CONST.IMAGE_CACHE_FOLDER","React"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","sources":["../../../../../src/screens/inbox/components/CachedImage/index.tsx"],"sourcesContent":["import React, { useEffect, useState, useRef, useMemo, useCallback } from 'react';\nimport { Image, View, Text } from 'react-native';\n// import { Image } from \"react-native\"\nimport * as FileSystem from 'expo-file-system';\n\nimport * as CONST from './consts';\n\n// Global download tracking to prevent duplicate downloads\nconst downloadTracker = new Map();\n\n// Ensure the cache directory exists\nconst ensureCacheDirectory = async () => {\n try {\n const dirInfo = await FileSystem.getInfoAsync(CONST.IMAGE_CACHE_FOLDER);\n if (!dirInfo.exists) {\n // console.log('Creating cache directory:', CONST.IMAGE_CACHE_FOLDER);\n await FileSystem.makeDirectoryAsync(CONST.IMAGE_CACHE_FOLDER, { intermediates: true });\n }\n return true;\n } catch (error) {\n // console.error('Failed to create cache directory:', error);\n return false;\n }\n};\n\n// Validate and sanitize the image URL\nconst validateImageUri = (uri: string): string \| null => {\n if (!uri) return null;\n\n // Trim whitespace\n uri = uri.trim();\n\n // Check if it's a valid URL format\n try {\n new URL(uri);\n } catch (e) {\n // console.log('Invalid URL format:', uri);\n return null;\n }\n\n // Add more validation as needed for your specific case\n return uri;\n};\n\nconst CachedImage = React.memo(\n (props: any) => {\n const { source, cacheKey, placeholderContent, style, resizeMode, alt, ...restProps } = props;\n const { uri: originalUri, headers, expiresIn = 86400 } = source;\n\n // Validate and sanitize the URI\n const uri = validateImageUri(originalUri);\n const fileURI = `${CONST.IMAGE_CACHE_FOLDER}${cacheKey}`;\n\n const [imgUri, setImgUri] = useState<string \| null>(null);\n const [loadError, setLoadError] = useState<boolean>(false);\n const [useFallbackUri, setUseFallbackUri] = useState<boolean>(false);\n const [isLoading, setIsLoading] = useState<boolean>(true);\n\n const componentIsMounted = useRef(true);\n const hasAttemptedLoad = useRef(false);\n const requestOption = headers ? { headers } : {};\n\n // Create a memoized download callback\n const downloadCallback = useCallback(\n (downloadProgress: any) => {\n if (componentIsMounted.current === false) {\n downloadTracker.delete(cacheKey);\n downloadResumableRef.current?.pauseAsync();\n FileSystem.deleteAsync(fileURI, { idempotent: true });\n }\n },\n [fileURI, cacheKey],\n );\n\n // Create a memoized download resumable\n const downloadResumableRef = useRef(\n uri ? FileSystem.createDownloadResumable(uri, fileURI, requestOption, downloadCallback) : null,\n );\n\n // Memoized load image function to avoid recreating on every render\n const loadImage = useCallback(async () => {\n if (!uri \|\| hasAttemptedLoad.current) return;\n\n hasAttemptedLoad.current = true;\n setIsLoading(true);\n\n try {\n // Check if this image is already being downloaded\n if (downloadTracker.has(cacheKey)) {\n // Wait for the existing download to complete\n await downloadTracker.get(cacheKey);\n if (componentIsMounted.current) {\n setImgUri(fileURI);\n setIsLoading(false);\n }\n return;\n }\n\n // Use the cached image if it exists\n const metadata: any = await FileSystem.getInfoAsync(fileURI);\n const expired = expiresIn && new Date().getTime() / 1000 - metadata?.modificationTime > expiresIn;\n\n if (!metadata.exists \|\| metadata?.size === 0 \|\| expired) {\n if (!componentIsMounted.current) return;\n\n if (expired && metadata.exists) {\n await FileSystem.deleteAsync(fileURI, { idempotent: true });\n }\n\n if (!uri) {\n setLoadError(true);\n setIsLoading(false);\n return;\n }\n\n if (!downloadResumableRef.current) {\n setUseFallbackUri(true);\n setImgUri(uri);\n setIsLoading(false);\n return;\n }\n\n try {\n // Record this download in the global tracker\n const downloadPromise = downloadResumableRef.current.downloadAsync();\n downloadTracker.set(cacheKey, downloadPromise);\n\n const response: any = await downloadPromise;\n\n // Remove from tracker when done\n downloadTracker.delete(cacheKey);\n\n if (componentIsMounted.current) {\n if (response && response.status === 200) {\n setImgUri(fileURI);\n } else {\n setUseFallbackUri(true);\n setImgUri(uri);\n FileSystem.deleteAsync(fileURI, { idempotent: true });\n }\n setIsLoading(false);\n }\n } catch (downloadError) {\n downloadTracker.delete(cacheKey);\n if (componentIsMounted.current) {\n setUseFallbackUri(true);\n setImgUri(uri);\n setIsLoading(false);\n }\n }\n } else {\n // Use cached version\n setImgUri(fileURI);\n setIsLoading(false);\n }\n } catch (err) {\n if (componentIsMounted.current) {\n setUseFallbackUri(true);\n setImgUri(uri);\n setIsLoading(false);\n }\n }\n }, [uri, fileURI, cacheKey, expiresIn]);\n\n // Setup effect\n useEffect(() => {\n const setup = async () => {\n const directoryExists = await ensureCacheDirectory();\n if (directoryExists && uri) {\n loadImage();\n } else {\n setLoadError(true);\n setIsLoading(false);\n }\n };\n\n setup();\n\n return () => {\n componentIsMounted.current = false;\n };\n }, [uri, loadImage]);\n\n // Default placeholder\n const defaultPlaceholder = useMemo(\n () => (\n <View\n style={[\n {\n width: '100%',\n height: '100%',\n backgroundColor: '#e1e1e1',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: 3,\n },\n style,\n ]}\n >\n <Text>Image not available</Text>\n </View>\n ),\n [style],\n );\n\n // Show placeholder while loading or if there's an error\n if (isLoading \|\| loadError \|\| !imgUri) {\n return placeholderContent \|\| defaultPlaceholder;\n }\n\n // Actual image component\n return (\n <Image\n {...restProps}\n style={style}\n source={{\n ...source,\n uri: useFallbackUri ? uri : imgUri,\n }}\n resizeMode={resizeMode}\n onError={(e) => {\n if (useFallbackUri) {\n setLoadError(true);\n setImgUri(null);\n } else {\n setUseFallbackUri(true);\n setImgUri(uri);\n }\n }}\n />\n );\n },\n (prevProps, nextProps) => {\n // Custom comparison function for memoization\n return (\n prevProps.cacheKey === nextProps.cacheKey &&\n prevProps.source.uri === nextProps.source.uri &&\n prevProps.style === nextProps.style\n );\n },\n);\n\nexport const CacheManager = {\n addToCache: async ({ file, key }: any) => {\n await ensureCacheDirectory();\n await FileSystem.copyAsync({\n from: file,\n to: `${CONST.IMAGE_CACHE_FOLDER}${key}`,\n });\n const uri = await CacheManager.getCachedUri({ key });\n return uri;\n },\n\n getCachedUri: async ({ key }: any) => {\n const uri = await FileSystem.getContentUriAsync(`${CONST.IMAGE_CACHE_FOLDER}${key}`);\n return uri;\n },\n\n downloadAsync: async ({ uri, key, options }: any) => {\n await ensureCacheDirectory();\n return await FileSystem.downloadAsync(uri, `${CONST.IMAGE_CACHE_FOLDER}${key}`, options);\n },\n\n clearCache: async () => {\n try {\n await FileSystem.deleteAsync(CONST.IMAGE_CACHE_FOLDER, { idempotent: true });\n await ensureCacheDirectory();\n } catch (error) {\n console.error('Error clearing cache:', error);\n }\n },\n};\n\nexport default CachedImage;\n"],"names":["CONST.IMAGE_CACHE_FOLDER","React","_a"],"mappings":"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"}