stream-chat-react-native-core 5.0.0-beta.0 → 5.0.0-beta.3

package/lib/module/components/ChannelList/hooks/listeners/useNewMessage.js

@@ -23,11 +23,23 @@ var useNewMessage = function useNewMessage(_ref) {
   (0, _react.useEffect)(function () {
     var handleEvent = function handleEvent(event) {
       setChannels(function (channels) {
-        if (!lockChannelOrder && event.cid) {
-          return (0, _utils.moveChannelUp)({
-            channels: channels,
-            cid: event.cid
+        if (!lockChannelOrder && event.cid && event.channel_type && event.channel_id) {
+          var targetChannelIndex = channels.findIndex(function (c) {
+            return c.cid === event.cid;
           });
+
+          if (targetChannelIndex >= 0) {
+            return (0, _utils.moveChannelUp)({
+              channels: channels,
+              cid: event.cid
+            });
+          }
+
+          var channel = client.channel(event.channel_type, event.channel_id);
+
+          if (channel.initialized) {
+            return [channel].concat((0, _toConsumableArray2["default"])(channels));
+          }
         }
 
         return (0, _toConsumableArray2["default"])(channels);

package/lib/module/components/ChannelList/hooks/listeners/useNewMessage.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useNewMessage.ts"],"names":["useNewMessage","lockChannelOrder","setChannels","client","handleEvent","event","channels","cid","listener","on","unsubscribe"],"mappings":";;;;;;;;;AAAA;;AAIA;;AAGA;;AAQO,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,OAKS;AAAA,MAFpCC,gBAEoC,QAFpCA,gBAEoC;AAAA,MADpCC,WACoC,QADpCA,WACoC;;AACpC,wBAAmB,kCAAnB;AAAA,MAAQC,MAAR,mBAAQA,MAAR;;AAEA,wBAAU,YAAM;AACd,QAAMC,WAAW,GAAG,SAAdA,WAAc,CAACC,KAAD,EAAsC;AACxDH,MAAAA,WAAW,CAAC,UAACI,QAAD,EAAc;AACxB,YAAI,CAACL,gBAAD,IAAqBI,KAAK,CAACE,GAA/B,EAAoC;AAClC,iBAAO,0BAAkC;AACvCD,YAAAA,QAAQ,EAARA,QADuC;AAEvCC,YAAAA,GAAG,EAAEF,KAAK,CAACE;AAF4B,WAAlC,CAAP;AAID;;AAED,mDAAWD,QAAX;AACD,OATU,CAAX;AAUD,KAXD;;AAaA,QAAME,QAAQ,GAAGL,MAAH,oBAAGA,MAAM,CAAEM,EAAR,CAAW,aAAX,EAA0BL,WAA1B,CAAjB;AACA,WAAO;AAAA,aAAMI,QAAN,oBAAMA,QAAQ,CAAEE,WAAV,EAAN;AAAA,KAAP;AACD,GAhBD,EAgBG,EAhBH;AAiBD,CAzBM","sourcesContent":["import { useEffect } from 'react';\n\nimport type { Channel, Event } from 'stream-chat';\n\nimport { useChatContext } from '../../../../contexts/chatContext/ChatContext';\n\nimport type { DefaultStreamChatGenerics } from '../../../../types/types';\nimport { moveChannelUp } from '../../utils';\n\ntype Parameters<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> =\n  {\n    lockChannelOrder: boolean;\n    setChannels: React.Dispatch<React.SetStateAction<Channel<StreamChatGenerics>[]>>;\n  };\n\nexport const useNewMessage = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>({\n  lockChannelOrder,\n  setChannels,\n}: Parameters<StreamChatGenerics>) => {\n  const { client } = useChatContext<StreamChatGenerics>();\n\n  useEffect(() => {\n    const handleEvent = (event: Event<StreamChatGenerics>) => {\n      setChannels((channels) => {\n        if (!lockChannelOrder && event.cid) {\n          return moveChannelUp<StreamChatGenerics>({\n            channels,\n            cid: event.cid,\n          });\n        }\n\n        return [...channels];\n      });\n    };\n\n    const listener = client?.on('message.new', handleEvent);\n    return () => listener?.unsubscribe();\n  }, []);\n};\n"]}
+{"version":3,"sources":["useNewMessage.ts"],"names":["useNewMessage","lockChannelOrder","setChannels","client","handleEvent","event","channels","cid","channel_type","channel_id","targetChannelIndex","findIndex","c","channel","initialized","listener","on","unsubscribe"],"mappings":";;;;;;;;;AAAA;;AAIA;;AAGA;;AAQO,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,OAKS;AAAA,MAFpCC,gBAEoC,QAFpCA,gBAEoC;AAAA,MADpCC,WACoC,QADpCA,WACoC;;AACpC,wBAAmB,kCAAnB;AAAA,MAAQC,MAAR,mBAAQA,MAAR;;AAEA,wBAAU,YAAM;AACd,QAAMC,WAAW,GAAG,SAAdA,WAAc,CAACC,KAAD,EAAsC;AACxDH,MAAAA,WAAW,CAAC,UAACI,QAAD,EAAc;AACxB,YAAI,CAACL,gBAAD,IAAqBI,KAAK,CAACE,GAA3B,IAAkCF,KAAK,CAACG,YAAxC,IAAwDH,KAAK,CAACI,UAAlE,EAA8E;AAC5E,cAAMC,kBAAkB,GAAGJ,QAAQ,CAACK,SAAT,CAAmB,UAACC,CAAD;AAAA,mBAAOA,CAAC,CAACL,GAAF,KAAUF,KAAK,CAACE,GAAvB;AAAA,WAAnB,CAA3B;;AAEA,cAAIG,kBAAkB,IAAI,CAA1B,EAA6B;AAC3B,mBAAO,0BAAkC;AACvCJ,cAAAA,QAAQ,EAARA,QADuC;AAEvCC,cAAAA,GAAG,EAAEF,KAAK,CAACE;AAF4B,aAAlC,CAAP;AAID;;AAKD,cAAMM,OAAO,GAAGV,MAAM,CAACU,OAAP,CAAeR,KAAK,CAACG,YAArB,EAAmCH,KAAK,CAACI,UAAzC,CAAhB;;AAEA,cAAII,OAAO,CAACC,WAAZ,EAAyB;AACvB,oBAAQD,OAAR,6CAAoBP,QAApB;AACD;AACF;;AAED,mDAAWA,QAAX;AACD,OAtBU,CAAX;AAuBD,KAxBD;;AA0BA,QAAMS,QAAQ,GAAGZ,MAAH,oBAAGA,MAAM,CAAEa,EAAR,CAAW,aAAX,EAA0BZ,WAA1B,CAAjB;AACA,WAAO;AAAA,aAAMW,QAAN,oBAAMA,QAAQ,CAAEE,WAAV,EAAN;AAAA,KAAP;AACD,GA7BD,EA6BG,EA7BH;AA8BD,CAtCM","sourcesContent":["import { useEffect } from 'react';\n\nimport type { Channel, Event } from 'stream-chat';\n\nimport { useChatContext } from '../../../../contexts/chatContext/ChatContext';\n\nimport type { DefaultStreamChatGenerics } from '../../../../types/types';\nimport { moveChannelUp } from '../../utils';\n\ntype Parameters<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> =\n  {\n    lockChannelOrder: boolean;\n    setChannels: React.Dispatch<React.SetStateAction<Channel<StreamChatGenerics>[]>>;\n  };\n\nexport const useNewMessage = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>({\n  lockChannelOrder,\n  setChannels,\n}: Parameters<StreamChatGenerics>) => {\n  const { client } = useChatContext<StreamChatGenerics>();\n\n  useEffect(() => {\n    const handleEvent = (event: Event<StreamChatGenerics>) => {\n      setChannels((channels) => {\n        if (!lockChannelOrder && event.cid && event.channel_type && event.channel_id) {\n          const targetChannelIndex = channels.findIndex((c) => c.cid === event.cid);\n\n          if (targetChannelIndex >= 0) {\n            return moveChannelUp<StreamChatGenerics>({\n              channels,\n              cid: event.cid,\n            });\n          }\n\n          // If channel doesn't exist in existing list, check in activeChannels as well.\n          // It may happen that channel was hidden using channel.hide(). In that case\n          // We remove it from `channels` state, but its still being watched and exists in client.activeChannels.\n          const channel = client.channel(event.channel_type, event.channel_id);\n\n          if (channel.initialized) {\n            return [channel, ...channels];\n          }\n        }\n\n        return [...channels];\n      });\n    };\n\n    const listener = client?.on('message.new', handleEvent);\n    return () => listener?.unsubscribe();\n  }, []);\n};\n"]}

package/lib/module/components/ChannelList/hooks/usePaginatedChannels.js

@@ -23,7 +23,7 @@ var _ChatContext = require("../../../contexts/chatContext/ChatContext");
 
 var _useIsMountedRef = require("../../../hooks/useIsMountedRef");
 
-var _getChannels = require("../../../store/apis/getChannels");
+var _getChannelsForFilterSort = require("../../../store/apis/getChannelsForFilterSort");
 
 var _date = require("../../../utils/date");
 
@@ -53,7 +53,9 @@ var usePaginatedChannels = function usePaginatedChannels(_ref) {
   var _useChatContext = (0, _ChatContext.useChatContext)(),
       client = _useChatContext.client;
 
-  var _useState = (0, _react.useState)([]),
+  var initialChannelsStateRef = (0, _react.useRef)([]);
+
+  var _useState = (0, _react.useState)(initialChannelsStateRef.current),
       _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
       channels = _useState2[0],
       setChannels = _useState2[1];
@@ -248,14 +250,17 @@ var usePaginatedChannels = function usePaginatedChannels(_ref) {
 
       if (enableOfflineSupport) {
         try {
-          var channelsFromDB = (0, _getChannels.getChannels)({
+          var channelsFromDB = (0, _getChannelsForFilterSort.getChannelsForFilterSort)({
             currentUserId: client.user.id,
             filters: filters,
             sort: sort
           });
-          setChannels(client.hydrateActiveChannels(channelsFromDB, {
-            staticState: true
-          }));
+
+          if (channelsFromDB) {
+            setChannels(client.hydrateActiveChannels(channelsFromDB, {
+              offlineMode: true
+            }));
+          }
         } catch (e) {
           console.warn('Failed to get channels from database: ', e);
         }
@@ -270,7 +275,7 @@ var usePaginatedChannels = function usePaginatedChannels(_ref) {
     channels: channels,
     error: error,
     hasNextPage: hasNextPage,
-    loadingChannels: activeQueryType === 'queryLocalDB' ? true : activeQueryType === 'reload' && channels.length === 0,
+    loadingChannels: activeQueryType === 'queryLocalDB' ? true : activeQueryType === 'reload' && channels === initialChannelsStateRef.current,
     loadingNextPage: activeQueryType === 'loadChannels',
     loadNextPage: loadNextPage,
     refreshing: activeQueryType === 'refresh',

package/lib/module/components/ChannelList/hooks/usePaginatedChannels.js.map

@@ -1 +1 @@
-{"version":3,"sources":["usePaginatedChannels.ts"],"names":["waitSeconds","seconds","Promise","resolve","setTimeout","ONE_SECOND_IN_MS","DEFAULT_OPTIONS","message_limit","MAX_NUMBER_OF_RETRIES","RETRY_INTERVAL_IN_MS","usePaginatedChannels","enableOfflineSupport","filters","options","sort","client","channels","setChannels","staticChannelsActive","setStaticChannelsActive","activeChannels","error","setError","hasNextPage","setHasNextPage","lastRefresh","Date","now","isQueryingRef","activeQueryType","setActiveQueryType","isMountedRef","filtersRef","sortRef","activeRequestId","queryChannels","queryType","retryCount","current","hasUpdatedData","JSON","stringify","some","Boolean","isQueryStale","currentRequestId","undefined","newOptions","limit","MAX_QUERY_CHANNELS_LIMIT","offset","length","skipInitialization","channelQueryResponse","newChannels","console","warn","Error","loadNextPage","refreshList","reloadList","filterStr","sortStr","loadChannels","user","id","channelsFromDB","currentUserId","hydrateActiveChannels","staticState","e","loadingChannels","loadingNextPage","refreshing"],"mappings":"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","sourcesContent":["import { useEffect, useMemo, useRef, useState } from 'react';\n\nimport type { Channel, ChannelFilters, ChannelOptions, ChannelSort } from 'stream-chat';\n\nimport { useActiveChannelsRefContext } from '../../../contexts/activeChannelsRefContext/ActiveChannelsRefContext';\nimport { useChatContext } from '../../../contexts/chatContext/ChatContext';\nimport { useIsMountedRef } from '../../../hooks/useIsMountedRef';\n\nimport { getChannels } from '../../../store/apis/getChannels';\nimport type { DefaultStreamChatGenerics } from '../../../types/types';\nimport { ONE_SECOND_IN_MS } from '../../../utils/date';\nimport { MAX_QUERY_CHANNELS_LIMIT } from '../utils';\n\nconst waitSeconds = (seconds: number) =>\n  new Promise((resolve) => {\n    setTimeout(resolve, seconds * ONE_SECOND_IN_MS);\n  });\n\ntype Parameters<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> =\n  {\n    enableOfflineSupport: boolean;\n    filters: ChannelFilters<StreamChatGenerics>;\n    options: ChannelOptions;\n    sort: ChannelSort<StreamChatGenerics>;\n  };\n\nconst DEFAULT_OPTIONS = {\n  message_limit: 10,\n};\n\nconst MAX_NUMBER_OF_RETRIES = 3;\nconst RETRY_INTERVAL_IN_MS = 5000;\n\ntype QueryType = 'queryLocalDB' | 'reload' | 'refresh' | 'loadChannels';\n\nexport type QueryChannels = (queryType?: QueryType, retryCount?: number) => Promise<void>;\n\nexport const usePaginatedChannels = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>({\n  enableOfflineSupport,\n  filters = {},\n  options = DEFAULT_OPTIONS,\n  sort = {},\n}: Parameters<StreamChatGenerics>) => {\n  const { client } = useChatContext<StreamChatGenerics>();\n\n  const [channels, setChannels] = useState<Channel<StreamChatGenerics>[]>([]);\n  const [staticChannelsActive, setStaticChannelsActive] = useState<boolean>(true);\n  const activeChannels = useActiveChannelsRefContext();\n\n  const [error, setError] = useState<Error>();\n  const [hasNextPage, setHasNextPage] = useState(true);\n  const lastRefresh = useRef(Date.now());\n  const isQueryingRef = useRef(false);\n  const [activeQueryType, setActiveQueryType] = useState<QueryType | null>('queryLocalDB');\n  const isMountedRef = useIsMountedRef();\n  const filtersRef = useRef<typeof filters | null>(null);\n  const sortRef = useRef<typeof sort | null>(null);\n  const activeRequestId = useRef<number>(0);\n\n  const queryChannels: QueryChannels = async (\n    queryType: QueryType = 'loadChannels',\n    retryCount = 0,\n  ): Promise<void> => {\n    if (!client || !isMountedRef.current) return;\n\n    const hasUpdatedData =\n      queryType === 'loadChannels' ||\n      queryType === 'refresh' ||\n      [\n        JSON.stringify(filtersRef.current) !== JSON.stringify(filters),\n        JSON.stringify(sortRef.current) !== JSON.stringify(sort),\n      ].some(Boolean);\n\n    const isQueryStale = () => !isMountedRef || activeRequestId.current !== currentRequestId;\n\n    /**\n     * We don't need to make another call to query channels if we don't\n     * have new data for the query to include\n     * */\n    if (!hasUpdatedData) {\n      if (activeQueryType === null) return;\n    }\n\n    filtersRef.current = filters;\n    sortRef.current = sort;\n    isQueryingRef.current = true;\n    setError(undefined);\n    activeRequestId.current++;\n    const currentRequestId = activeRequestId.current;\n    setActiveQueryType(queryType);\n\n    const newOptions = {\n      limit: options?.limit ?? MAX_QUERY_CHANNELS_LIMIT,\n      offset: queryType === 'loadChannels' && !staticChannelsActive ? channels.length : 0,\n      ...options,\n    };\n\n    try {\n      const channelQueryResponse = await client.queryChannels(filters, sort, newOptions, {\n        skipInitialization: activeChannels.current,\n      });\n\n      if (isQueryStale() || !isMountedRef.current) {\n        return;\n      }\n      const newChannels =\n        queryType === 'loadChannels' && !staticChannelsActive\n          ? [...channels, ...channelQueryResponse]\n          : channelQueryResponse;\n\n      setChannels(newChannels);\n      setStaticChannelsActive(false);\n      setHasNextPage(channelQueryResponse.length >= newOptions.limit);\n      setError(undefined);\n      isQueryingRef.current = false;\n    } catch (err: unknown) {\n      isQueryingRef.current = false;\n      await waitSeconds(2);\n\n      if (isQueryStale()) {\n        return;\n      }\n\n      // querying.current check is needed in order to make sure the next query call doesnt flick an error\n      // state and then succeed (reconnect case)\n      if (retryCount === MAX_NUMBER_OF_RETRIES && !isQueryingRef.current) {\n        setActiveQueryType(null);\n        console.warn(err);\n\n        setError(\n          new Error(\n            `Maximum number of retries reached in queryChannels. Last error message is: ${err}`,\n          ),\n        );\n        return;\n      }\n\n      return queryChannels(queryType, retryCount + 1);\n    }\n\n    setActiveQueryType(null);\n  };\n\n  const loadNextPage = hasNextPage ? queryChannels : undefined;\n\n  const refreshList = () => {\n    const now = Date.now();\n    // Only allow pull-to-refresh 5 seconds after last successful refresh.\n    if (now - lastRefresh.current < RETRY_INTERVAL_IN_MS && error === undefined) {\n      return;\n    }\n\n    lastRefresh.current = Date.now();\n    return queryChannels('refresh');\n  };\n\n  const reloadList = () => queryChannels('reload');\n\n  /**\n   * Equality check using stringified filters/sort ensure that we don't make un-necessary queryChannels api calls\n   * for the scenario:\n   *\n   * <ChannelList\n   *    filters={{\n   *      members: { $in: ['vishal'] }\n   *    }}\n   *    ...\n   * />\n   *\n   * Here we have passed filters as inline object, which means on every re-render of\n   * parent component, ChannelList will receive new object reference (even though value is same), which\n   * in return will trigger useEffect. To avoid this, we can add a value check.\n   */\n  const filterStr = useMemo(() => JSON.stringify(filters), [filters]);\n  const sortStr = useMemo(() => JSON.stringify(sort), [sort]);\n\n  useEffect(() => {\n    const loadChannels = () => {\n      if (!client?.user?.id) return;\n      if (enableOfflineSupport) {\n        try {\n          const channelsFromDB = getChannels({ currentUserId: client.user.id, filters, sort });\n          setChannels(\n            client.hydrateActiveChannels(channelsFromDB, {\n              staticState: true,\n            }),\n          );\n        } catch (e) {\n          console.warn('Failed to get channels from database: ', e);\n        }\n      }\n\n      reloadList();\n    };\n\n    loadChannels();\n  }, [filterStr, sortStr]);\n\n  return {\n    channels,\n    error,\n    hasNextPage,\n    loadingChannels:\n      activeQueryType === 'queryLocalDB'\n        ? true\n        : activeQueryType === 'reload' && channels.length === 0,\n    loadingNextPage: activeQueryType === 'loadChannels',\n    loadNextPage,\n    refreshing: activeQueryType === 'refresh',\n    refreshList,\n    reloadList,\n    setChannels,\n    staticChannelsActive,\n  };\n};\n"]}
+{"version":3,"sources":["usePaginatedChannels.ts"],"names":["waitSeconds","seconds","Promise","resolve","setTimeout","ONE_SECOND_IN_MS","DEFAULT_OPTIONS","message_limit","MAX_NUMBER_OF_RETRIES","RETRY_INTERVAL_IN_MS","usePaginatedChannels","enableOfflineSupport","filters","options","sort","client","initialChannelsStateRef","current","channels","setChannels","staticChannelsActive","setStaticChannelsActive","activeChannels","error","setError","hasNextPage","setHasNextPage","lastRefresh","Date","now","isQueryingRef","activeQueryType","setActiveQueryType","isMountedRef","filtersRef","sortRef","activeRequestId","queryChannels","queryType","retryCount","hasUpdatedData","JSON","stringify","some","Boolean","isQueryStale","currentRequestId","undefined","newOptions","limit","MAX_QUERY_CHANNELS_LIMIT","offset","length","skipInitialization","channelQueryResponse","newChannels","console","warn","Error","loadNextPage","refreshList","reloadList","filterStr","sortStr","loadChannels","user","id","channelsFromDB","currentUserId","hydrateActiveChannels","offlineMode","e","loadingChannels","loadingNextPage","refreshing"],"mappings":"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","sourcesContent":["import { useEffect, useMemo, useRef, useState } from 'react';\n\nimport type { Channel, ChannelFilters, ChannelOptions, ChannelSort } from 'stream-chat';\n\nimport { useActiveChannelsRefContext } from '../../../contexts/activeChannelsRefContext/ActiveChannelsRefContext';\nimport { useChatContext } from '../../../contexts/chatContext/ChatContext';\nimport { useIsMountedRef } from '../../../hooks/useIsMountedRef';\n\nimport { getChannelsForFilterSort } from '../../../store/apis/getChannelsForFilterSort';\nimport type { DefaultStreamChatGenerics } from '../../../types/types';\nimport { ONE_SECOND_IN_MS } from '../../../utils/date';\nimport { MAX_QUERY_CHANNELS_LIMIT } from '../utils';\n\nconst waitSeconds = (seconds: number) =>\n  new Promise((resolve) => {\n    setTimeout(resolve, seconds * ONE_SECOND_IN_MS);\n  });\n\ntype Parameters<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> =\n  {\n    enableOfflineSupport: boolean;\n    filters: ChannelFilters<StreamChatGenerics>;\n    options: ChannelOptions;\n    sort: ChannelSort<StreamChatGenerics>;\n  };\n\nconst DEFAULT_OPTIONS = {\n  message_limit: 10,\n};\n\nconst MAX_NUMBER_OF_RETRIES = 3;\nconst RETRY_INTERVAL_IN_MS = 5000;\n\ntype QueryType = 'queryLocalDB' | 'reload' | 'refresh' | 'loadChannels';\n\nexport type QueryChannels = (queryType?: QueryType, retryCount?: number) => Promise<void>;\n\nexport const usePaginatedChannels = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>({\n  enableOfflineSupport,\n  filters = {},\n  options = DEFAULT_OPTIONS,\n  sort = {},\n}: Parameters<StreamChatGenerics>) => {\n  const { client } = useChatContext<StreamChatGenerics>();\n  const initialChannelsStateRef = useRef([]);\n  const [channels, setChannels] = useState<Channel<StreamChatGenerics>[]>(\n    initialChannelsStateRef.current,\n  );\n  const [staticChannelsActive, setStaticChannelsActive] = useState<boolean>(true);\n  const activeChannels = useActiveChannelsRefContext();\n\n  const [error, setError] = useState<Error>();\n  const [hasNextPage, setHasNextPage] = useState(true);\n  const lastRefresh = useRef(Date.now());\n  const isQueryingRef = useRef(false);\n  const [activeQueryType, setActiveQueryType] = useState<QueryType | null>('queryLocalDB');\n  const isMountedRef = useIsMountedRef();\n  const filtersRef = useRef<typeof filters | null>(null);\n  const sortRef = useRef<typeof sort | null>(null);\n  const activeRequestId = useRef<number>(0);\n\n  const queryChannels: QueryChannels = async (\n    queryType: QueryType = 'loadChannels',\n    retryCount = 0,\n  ): Promise<void> => {\n    if (!client || !isMountedRef.current) return;\n\n    const hasUpdatedData =\n      queryType === 'loadChannels' ||\n      queryType === 'refresh' ||\n      [\n        JSON.stringify(filtersRef.current) !== JSON.stringify(filters),\n        JSON.stringify(sortRef.current) !== JSON.stringify(sort),\n      ].some(Boolean);\n\n    const isQueryStale = () => !isMountedRef || activeRequestId.current !== currentRequestId;\n\n    /**\n     * We don't need to make another call to query channels if we don't\n     * have new data for the query to include\n     * */\n    if (!hasUpdatedData) {\n      if (activeQueryType === null) return;\n    }\n\n    filtersRef.current = filters;\n    sortRef.current = sort;\n    isQueryingRef.current = true;\n    setError(undefined);\n    activeRequestId.current++;\n    const currentRequestId = activeRequestId.current;\n    setActiveQueryType(queryType);\n\n    const newOptions = {\n      limit: options?.limit ?? MAX_QUERY_CHANNELS_LIMIT,\n      offset: queryType === 'loadChannels' && !staticChannelsActive ? channels.length : 0,\n      ...options,\n    };\n\n    try {\n      const channelQueryResponse = await client.queryChannels(filters, sort, newOptions, {\n        skipInitialization: activeChannels.current,\n      });\n\n      if (isQueryStale() || !isMountedRef.current) {\n        return;\n      }\n      const newChannels =\n        queryType === 'loadChannels' && !staticChannelsActive\n          ? [...channels, ...channelQueryResponse]\n          : channelQueryResponse;\n\n      setChannels(newChannels);\n      setStaticChannelsActive(false);\n      setHasNextPage(channelQueryResponse.length >= newOptions.limit);\n      setError(undefined);\n      isQueryingRef.current = false;\n    } catch (err: unknown) {\n      isQueryingRef.current = false;\n      await waitSeconds(2);\n\n      if (isQueryStale()) {\n        return;\n      }\n\n      // querying.current check is needed in order to make sure the next query call doesnt flick an error\n      // state and then succeed (reconnect case)\n      if (retryCount === MAX_NUMBER_OF_RETRIES && !isQueryingRef.current) {\n        setActiveQueryType(null);\n        console.warn(err);\n\n        setError(\n          new Error(\n            `Maximum number of retries reached in queryChannels. Last error message is: ${err}`,\n          ),\n        );\n        return;\n      }\n\n      return queryChannels(queryType, retryCount + 1);\n    }\n\n    setActiveQueryType(null);\n  };\n\n  const loadNextPage = hasNextPage ? queryChannels : undefined;\n\n  const refreshList = () => {\n    const now = Date.now();\n    // Only allow pull-to-refresh 5 seconds after last successful refresh.\n    if (now - lastRefresh.current < RETRY_INTERVAL_IN_MS && error === undefined) {\n      return;\n    }\n\n    lastRefresh.current = Date.now();\n    return queryChannels('refresh');\n  };\n\n  const reloadList = () => queryChannels('reload');\n\n  /**\n   * Equality check using stringified filters/sort ensure that we don't make un-necessary queryChannels api calls\n   * for the scenario:\n   *\n   * <ChannelList\n   *    filters={{\n   *      members: { $in: ['vishal'] }\n   *    }}\n   *    ...\n   * />\n   *\n   * Here we have passed filters as inline object, which means on every re-render of\n   * parent component, ChannelList will receive new object reference (even though value is same), which\n   * in return will trigger useEffect. To avoid this, we can add a value check.\n   */\n  const filterStr = useMemo(() => JSON.stringify(filters), [filters]);\n  const sortStr = useMemo(() => JSON.stringify(sort), [sort]);\n\n  useEffect(() => {\n    const loadChannels = () => {\n      if (!client?.user?.id) return;\n      if (enableOfflineSupport) {\n        try {\n          const channelsFromDB = getChannelsForFilterSort({\n            currentUserId: client.user.id,\n            filters,\n            sort,\n          });\n\n          if (channelsFromDB) {\n            setChannels(\n              client.hydrateActiveChannels(channelsFromDB, {\n                offlineMode: true,\n              }),\n            );\n          }\n        } catch (e) {\n          console.warn('Failed to get channels from database: ', e);\n        }\n      }\n\n      reloadList();\n    };\n\n    loadChannels();\n  }, [filterStr, sortStr]);\n\n  return {\n    channels,\n    error,\n    hasNextPage,\n    loadingChannels:\n      activeQueryType === 'queryLocalDB'\n        ? true\n        : activeQueryType === 'reload' && channels === initialChannelsStateRef.current,\n    loadingNextPage: activeQueryType === 'loadChannels',\n    loadNextPage,\n    refreshing: activeQueryType === 'refresh',\n    refreshList,\n    reloadList,\n    setChannels,\n    staticChannelsActive,\n  };\n};\n"]}

package/lib/module/components/ChannelPreview/ChannelPreview.js

@@ -75,11 +75,15 @@ var ChannelPreviewWithContext = function ChannelPreviewWithContext(props) {
     };
 
     var handleUpdatedOrDeletedMessage = function handleUpdatedOrDeletedMessage(event) {
-      var _event$message;
+      setLastMessage(function (prevLastMessage) {
+        var _event$message;
 
-      if (((_event$message = event.message) == null ? void 0 : _event$message.id) === (lastMessage == null ? void 0 : lastMessage.id)) {
-        setLastMessage(event.message);
-      }
+        if ((prevLastMessage == null ? void 0 : prevLastMessage.id) === ((_event$message = event.message) == null ? void 0 : _event$message.id)) {
+          return event.message;
+        }
+
+        return prevLastMessage;
+      });
     };
 
     var listeners = [channel.on('message.new', handleNewMessageEvent), channel.on('message.updated', handleUpdatedOrDeletedMessage), channel.on('message.deleted', handleUpdatedOrDeletedMessage)];
@@ -114,7 +118,7 @@ var ChannelPreviewWithContext = function ChannelPreviewWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 108,
+      lineNumber: 111,
       columnNumber: 10
     }
   });
@@ -134,7 +138,7 @@ var ChannelPreview = function ChannelPreview(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 124,
+      lineNumber: 127,
       columnNumber: 10
     }
   }));

package/lib/module/components/ChannelPreview/ChannelPreview.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ChannelPreview.tsx"],"names":["ChannelPreviewWithContext","props","channel","client","Preview","state","messages","length","lastMessage","setLastMessage","translatedLastMessage","forceUpdate","setForceUpdate","countUnread","unread","setUnread","latestMessagePreview","channelLastMessage","channelLastMessageString","id","updated_at","newUnreadCount","handleNewMessageEvent","event","message","parent_id","show_in_channel","handleUpdatedOrDeletedMessage","listeners","on","forEach","l","unsubscribe","handleReadEvent","user","userID","prev","listener","ChannelPreview"],"mappings":";;;;;;;;;;;;;AAAA;;AAIA;;AAEA;;AAIA;;AAEA;;;;;;;;;AAiBA,IAAMA,yBAAyB,GAAG,SAA5BA,yBAA4B,CAGhCC,KAHgC,EAI7B;AACH,MAAQC,OAAR,GAAqCD,KAArC,CAAQC,OAAR;AAAA,MAAiBC,MAAjB,GAAqCF,KAArC,CAAiBE,MAAjB;AAAA,MAAyBC,OAAzB,GAAqCH,KAArC,CAAyBG,OAAzB;;AAEA,kBAAsC,qBAIpCF,OAAO,CAACG,KAAR,CAAcC,QAAd,CAAuBJ,OAAO,CAACG,KAAR,CAAcC,QAAd,CAAuBC,MAAvB,GAAgC,CAAvD,CAJoC,CAAtC;AAAA;AAAA,MAAOC,WAAP;AAAA,MAAoBC,cAApB;;AAMA,MAAMC,qBAAqB,GAAG,gDAC5BF,WAAW,IAAK,EADY,CAA9B;;AAIA,mBAAsC,qBAAS,CAAT,CAAtC;AAAA;AAAA,MAAOG,WAAP;AAAA,MAAoBC,cAApB;;AACA,mBAA4B,qBAASV,OAAO,CAACW,WAAR,EAAT,CAA5B;AAAA;AAAA,MAAOC,MAAP;AAAA,MAAeC,SAAf;;AAEA,MAAMC,oBAAoB,GAAG,sDAAwBd,OAAxB,EAAiCS,WAAjC,EAA8CD,qBAA9C,CAA7B;AAEA,MAAMO,kBAAkB,GAAGf,OAAO,CAACM,WAAR,EAA3B;AACA,MAAMU,wBAAwB,SAAMD,kBAAN,oBAAMA,kBAAkB,CAAEE,EAA1B,KAA+BF,kBAA/B,oBAA+BA,kBAAkB,CAAEG,UAAnD,CAA9B;AAEA,wBAAU,YAAM;AACd,QACEH,kBAAkB,KACjBA,kBAAkB,CAACE,EAAnB,MAA0BX,WAA1B,oBAA0BA,WAAW,CAAEW,EAAvC,KACCF,kBAAkB,CAACG,UAAnB,MAAkCZ,WAAlC,oBAAkCA,WAAW,CAAEY,UAA/C,CAFgB,CADpB,EAIE;AACAX,MAAAA,cAAc,CAACQ,kBAAD,CAAd;AACD;;AAED,QAAMI,cAAc,GAAGnB,OAAO,CAACW,WAAR,EAAvB;;AAEA,QAAIQ,cAAc,KAAKP,MAAvB,EAA+B;AAC7BC,MAAAA,SAAS,CAACM,cAAD,CAAT;AACD;AACF,GAdD,EAcG,CAACH,wBAAD,CAdH;AAgBA,wBAAU,YAAM;AACd,QAAMI,qBAAqB,GAAG,SAAxBA,qBAAwB,CAACC,KAAD,EAAsC;AAClE,UAAMC,OAAO,GAAGD,KAAK,CAACC,OAAtB;;AACA,UAAIA,OAAO,KAAK,CAACA,OAAO,CAACC,SAAT,IAAsBD,OAAO,CAACE,eAAnC,CAAX,EAAgE;AAC9DjB,QAAAA,cAAc,CAACc,KAAK,CAACC,OAAP,CAAd;AACAT,QAAAA,SAAS,CAACb,OAAO,CAACW,WAAR,EAAD,CAAT;AACD;AACF,KAND;;AAQA,QAAMc,6BAA6B,GAAG,SAAhCA,6BAAgC,CAACJ,KAAD,EAAsC;AAAA;;AAC1E,UAAI,mBAAAA,KAAK,CAACC,OAAN,oCAAeL,EAAf,OAAsBX,WAAtB,oBAAsBA,WAAW,CAAEW,EAAnC,CAAJ,EAA2C;AACzCV,QAAAA,cAAc,CAACc,KAAK,CAACC,OAAP,CAAd;AACD;AACF,KAJD;;AAMA,QAAMI,SAAS,GAAG,CAChB1B,OAAO,CAAC2B,EAAR,CAAW,aAAX,EAA0BP,qBAA1B,CADgB,EAEhBpB,OAAO,CAAC2B,EAAR,CAAW,iBAAX,EAA8BF,6BAA9B,CAFgB,EAGhBzB,OAAO,CAAC2B,EAAR,CAAW,iBAAX,EAA8BF,6BAA9B,CAHgB,CAAlB;AAMA,WAAO;AAAA,aAAMC,SAAS,CAACE,OAAV,CAAkB,UAACC,CAAD;AAAA,eAAOA,CAAC,CAACC,WAAF,EAAP;AAAA,OAAlB,CAAN;AAAA,KAAP;AACD,GAtBD,EAsBG,EAtBH;AAwBA,wBAAU,YAAM;AACd,QAAMC,eAAe,GAAG,SAAlBA,eAAkB,CAACV,KAAD,EAAsC;AAAA;;AAC5D,UAAI,gBAAAA,KAAK,CAACW,IAAN,iCAAYf,EAAZ,MAAmBhB,MAAM,CAACgC,MAA9B,EAAsC;AACpCpB,QAAAA,SAAS,CAAC,CAAD,CAAT;AACD,OAFD,MAEO,oBAAIQ,KAAK,CAACW,IAAV,aAAI,aAAYf,EAAhB,EAAoB;AACzBP,QAAAA,cAAc,CAAC,UAACwB,IAAD;AAAA,iBAAUA,IAAI,GAAG,CAAjB;AAAA,SAAD,CAAd;AACD;AACF,KAND;;AAQA,QAAMC,QAAQ,GAAGnC,OAAO,CAAC2B,EAAR,CAAW,cAAX,EAA2BI,eAA3B,CAAjB;AACA,WAAO;AAAA,aAAMI,QAAQ,CAACL,WAAT,EAAN;AAAA,KAAP;AACD,GAXD,EAWG,EAXH;AAaA,SAAO,gCAAC,OAAD;AAAS,IAAA,OAAO,EAAE9B,OAAlB;AAA2B,IAAA,oBAAoB,EAAEc,oBAAjD;AAAuE,IAAA,MAAM,EAAEF,MAA/E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAP;AACD,CA/ED;;AAsFO,IAAMwB,cAAc,GAAG,SAAjBA,cAAiB,CAG5BrC,KAH4B,EAIzB;AACH,wBAAmB,kCAAnB;AAAA,MAAQE,MAAR,mBAAQA,MAAR;;AACA,4BAAoB,0CAApB;AAAA,MAAQC,OAAR,uBAAQA,OAAR;;AAEA,SAAO,gCAAC,yBAAD;AAAiCD,IAAAA,MAAM,EAANA,MAAjC;AAAyCC,IAAAA,OAAO,EAAPA;AAAzC,KAAwDH,KAAxD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAAP;AACD,CATM","sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport type { Channel, ChannelState, Event, MessageResponse } from 'stream-chat';\n\nimport { useLatestMessagePreview } from './hooks/useLatestMessagePreview';\n\nimport {\n  ChannelsContextValue,\n  useChannelsContext,\n} from '../../contexts/channelsContext/ChannelsContext';\nimport { ChatContextValue, useChatContext } from '../../contexts/chatContext/ChatContext';\n\nimport { useTranslatedMessage } from '../../hooks/useTranslatedMessage';\nimport type { DefaultStreamChatGenerics } from '../../types/types';\n\nexport type ChannelPreviewPropsWithContext<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<ChatContextValue<StreamChatGenerics>, 'client'> &\n  Pick<ChannelsContextValue<StreamChatGenerics>, 'Preview'> & {\n    /**\n     * The previewed channel\n     */\n    channel: Channel<StreamChatGenerics>;\n  };\n\n/**\n * This component manages state for the ChannelPreviewMessenger UI component and receives\n * all props from the ChannelListMessenger component.\n */\nconst ChannelPreviewWithContext = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ChannelPreviewPropsWithContext<StreamChatGenerics>,\n) => {\n  const { channel, client, Preview } = props;\n\n  const [lastMessage, setLastMessage] = useState<\n    | ReturnType<ChannelState<StreamChatGenerics>['formatMessage']>\n    | MessageResponse<StreamChatGenerics>\n    | undefined\n  >(channel.state.messages[channel.state.messages.length - 1]);\n\n  const translatedLastMessage = useTranslatedMessage<StreamChatGenerics>(\n    lastMessage || ({} as MessageResponse<StreamChatGenerics>),\n  );\n\n  const [forceUpdate, setForceUpdate] = useState(0);\n  const [unread, setUnread] = useState(channel.countUnread());\n\n  const latestMessagePreview = useLatestMessagePreview(channel, forceUpdate, translatedLastMessage);\n\n  const channelLastMessage = channel.lastMessage();\n  const channelLastMessageString = `${channelLastMessage?.id}${channelLastMessage?.updated_at}`;\n\n  useEffect(() => {\n    if (\n      channelLastMessage &&\n      (channelLastMessage.id !== lastMessage?.id ||\n        channelLastMessage.updated_at !== lastMessage?.updated_at)\n    ) {\n      setLastMessage(channelLastMessage);\n    }\n\n    const newUnreadCount = channel.countUnread();\n\n    if (newUnreadCount !== unread) {\n      setUnread(newUnreadCount);\n    }\n  }, [channelLastMessageString]);\n\n  useEffect(() => {\n    const handleNewMessageEvent = (event: Event<StreamChatGenerics>) => {\n      const message = event.message;\n      if (message && (!message.parent_id || message.show_in_channel)) {\n        setLastMessage(event.message);\n        setUnread(channel.countUnread());\n      }\n    };\n\n    const handleUpdatedOrDeletedMessage = (event: Event<StreamChatGenerics>) => {\n      if (event.message?.id === lastMessage?.id) {\n        setLastMessage(event.message);\n      }\n    };\n\n    const listeners = [\n      channel.on('message.new', handleNewMessageEvent),\n      channel.on('message.updated', handleUpdatedOrDeletedMessage),\n      channel.on('message.deleted', handleUpdatedOrDeletedMessage),\n    ];\n\n    return () => listeners.forEach((l) => l.unsubscribe());\n  }, []);\n\n  useEffect(() => {\n    const handleReadEvent = (event: Event<StreamChatGenerics>) => {\n      if (event.user?.id === client.userID) {\n        setUnread(0);\n      } else if (event.user?.id) {\n        setForceUpdate((prev) => prev + 1);\n      }\n    };\n\n    const listener = channel.on('message.read', handleReadEvent);\n    return () => listener.unsubscribe();\n  }, []);\n\n  return <Preview channel={channel} latestMessagePreview={latestMessagePreview} unread={unread} />;\n};\n\nexport type ChannelPreviewProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Partial<Omit<ChannelPreviewPropsWithContext<StreamChatGenerics>, 'channel'>> &\n  Pick<ChannelPreviewPropsWithContext<StreamChatGenerics>, 'channel'>;\n\nexport const ChannelPreview = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ChannelPreviewProps<StreamChatGenerics>,\n) => {\n  const { client } = useChatContext<StreamChatGenerics>();\n  const { Preview } = useChannelsContext<StreamChatGenerics>();\n\n  return <ChannelPreviewWithContext {...{ client, Preview }} {...props} />;\n};\n"]}
+{"version":3,"sources":["ChannelPreview.tsx"],"names":["ChannelPreviewWithContext","props","channel","client","Preview","state","messages","length","lastMessage","setLastMessage","translatedLastMessage","forceUpdate","setForceUpdate","countUnread","unread","setUnread","latestMessagePreview","channelLastMessage","channelLastMessageString","id","updated_at","newUnreadCount","handleNewMessageEvent","event","message","parent_id","show_in_channel","handleUpdatedOrDeletedMessage","prevLastMessage","listeners","on","forEach","l","unsubscribe","handleReadEvent","user","userID","prev","listener","ChannelPreview"],"mappings":";;;;;;;;;;;;;AAAA;;AAIA;;AAEA;;AAIA;;AAEA;;;;;;;;;AAiBA,IAAMA,yBAAyB,GAAG,SAA5BA,yBAA4B,CAGhCC,KAHgC,EAI7B;AACH,MAAQC,OAAR,GAAqCD,KAArC,CAAQC,OAAR;AAAA,MAAiBC,MAAjB,GAAqCF,KAArC,CAAiBE,MAAjB;AAAA,MAAyBC,OAAzB,GAAqCH,KAArC,CAAyBG,OAAzB;;AAEA,kBAAsC,qBAIpCF,OAAO,CAACG,KAAR,CAAcC,QAAd,CAAuBJ,OAAO,CAACG,KAAR,CAAcC,QAAd,CAAuBC,MAAvB,GAAgC,CAAvD,CAJoC,CAAtC;AAAA;AAAA,MAAOC,WAAP;AAAA,MAAoBC,cAApB;;AAMA,MAAMC,qBAAqB,GAAG,gDAC5BF,WAAW,IAAK,EADY,CAA9B;;AAIA,mBAAsC,qBAAS,CAAT,CAAtC;AAAA;AAAA,MAAOG,WAAP;AAAA,MAAoBC,cAApB;;AACA,mBAA4B,qBAASV,OAAO,CAACW,WAAR,EAAT,CAA5B;AAAA;AAAA,MAAOC,MAAP;AAAA,MAAeC,SAAf;;AAEA,MAAMC,oBAAoB,GAAG,sDAAwBd,OAAxB,EAAiCS,WAAjC,EAA8CD,qBAA9C,CAA7B;AAEA,MAAMO,kBAAkB,GAAGf,OAAO,CAACM,WAAR,EAA3B;AACA,MAAMU,wBAAwB,SAAMD,kBAAN,oBAAMA,kBAAkB,CAAEE,EAA1B,KAA+BF,kBAA/B,oBAA+BA,kBAAkB,CAAEG,UAAnD,CAA9B;AAEA,wBAAU,YAAM;AACd,QACEH,kBAAkB,KACjBA,kBAAkB,CAACE,EAAnB,MAA0BX,WAA1B,oBAA0BA,WAAW,CAAEW,EAAvC,KACCF,kBAAkB,CAACG,UAAnB,MAAkCZ,WAAlC,oBAAkCA,WAAW,CAAEY,UAA/C,CAFgB,CADpB,EAIE;AACAX,MAAAA,cAAc,CAACQ,kBAAD,CAAd;AACD;;AAED,QAAMI,cAAc,GAAGnB,OAAO,CAACW,WAAR,EAAvB;;AAEA,QAAIQ,cAAc,KAAKP,MAAvB,EAA+B;AAC7BC,MAAAA,SAAS,CAACM,cAAD,CAAT;AACD;AACF,GAdD,EAcG,CAACH,wBAAD,CAdH;AAgBA,wBAAU,YAAM;AACd,QAAMI,qBAAqB,GAAG,SAAxBA,qBAAwB,CAACC,KAAD,EAAsC;AAClE,UAAMC,OAAO,GAAGD,KAAK,CAACC,OAAtB;;AACA,UAAIA,OAAO,KAAK,CAACA,OAAO,CAACC,SAAT,IAAsBD,OAAO,CAACE,eAAnC,CAAX,EAAgE;AAC9DjB,QAAAA,cAAc,CAACc,KAAK,CAACC,OAAP,CAAd;AACAT,QAAAA,SAAS,CAACb,OAAO,CAACW,WAAR,EAAD,CAAT;AACD;AACF,KAND;;AAQA,QAAMc,6BAA6B,GAAG,SAAhCA,6BAAgC,CAACJ,KAAD,EAAsC;AAC1Ed,MAAAA,cAAc,CAAC,UAACmB,eAAD,EAAqB;AAAA;;AAClC,YAAI,CAAAA,eAAe,QAAf,YAAAA,eAAe,CAAET,EAAjB,yBAAwBI,KAAK,CAACC,OAA9B,qBAAwB,eAAeL,EAAvC,CAAJ,EAA+C;AAC7C,iBAAOI,KAAK,CAACC,OAAb;AACD;;AACD,eAAOI,eAAP;AACD,OALa,CAAd;AAMD,KAPD;;AASA,QAAMC,SAAS,GAAG,CAChB3B,OAAO,CAAC4B,EAAR,CAAW,aAAX,EAA0BR,qBAA1B,CADgB,EAEhBpB,OAAO,CAAC4B,EAAR,CAAW,iBAAX,EAA8BH,6BAA9B,CAFgB,EAGhBzB,OAAO,CAAC4B,EAAR,CAAW,iBAAX,EAA8BH,6BAA9B,CAHgB,CAAlB;AAMA,WAAO;AAAA,aAAME,SAAS,CAACE,OAAV,CAAkB,UAACC,CAAD;AAAA,eAAOA,CAAC,CAACC,WAAF,EAAP;AAAA,OAAlB,CAAN;AAAA,KAAP;AACD,GAzBD,EAyBG,EAzBH;AA2BA,wBAAU,YAAM;AACd,QAAMC,eAAe,GAAG,SAAlBA,eAAkB,CAACX,KAAD,EAAsC;AAAA;;AAC5D,UAAI,gBAAAA,KAAK,CAACY,IAAN,iCAAYhB,EAAZ,MAAmBhB,MAAM,CAACiC,MAA9B,EAAsC;AACpCrB,QAAAA,SAAS,CAAC,CAAD,CAAT;AACD,OAFD,MAEO,oBAAIQ,KAAK,CAACY,IAAV,aAAI,aAAYhB,EAAhB,EAAoB;AACzBP,QAAAA,cAAc,CAAC,UAACyB,IAAD;AAAA,iBAAUA,IAAI,GAAG,CAAjB;AAAA,SAAD,CAAd;AACD;AACF,KAND;;AAQA,QAAMC,QAAQ,GAAGpC,OAAO,CAAC4B,EAAR,CAAW,cAAX,EAA2BI,eAA3B,CAAjB;AACA,WAAO;AAAA,aAAMI,QAAQ,CAACL,WAAT,EAAN;AAAA,KAAP;AACD,GAXD,EAWG,EAXH;AAaA,SAAO,gCAAC,OAAD;AAAS,IAAA,OAAO,EAAE/B,OAAlB;AAA2B,IAAA,oBAAoB,EAAEc,oBAAjD;AAAuE,IAAA,MAAM,EAAEF,MAA/E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAP;AACD,CAlFD;;AAyFO,IAAMyB,cAAc,GAAG,SAAjBA,cAAiB,CAG5BtC,KAH4B,EAIzB;AACH,wBAAmB,kCAAnB;AAAA,MAAQE,MAAR,mBAAQA,MAAR;;AACA,4BAAoB,0CAApB;AAAA,MAAQC,OAAR,uBAAQA,OAAR;;AAEA,SAAO,gCAAC,yBAAD;AAAiCD,IAAAA,MAAM,EAANA,MAAjC;AAAyCC,IAAAA,OAAO,EAAPA;AAAzC,KAAwDH,KAAxD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAAP;AACD,CATM","sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport type { Channel, ChannelState, Event, MessageResponse } from 'stream-chat';\n\nimport { useLatestMessagePreview } from './hooks/useLatestMessagePreview';\n\nimport {\n  ChannelsContextValue,\n  useChannelsContext,\n} from '../../contexts/channelsContext/ChannelsContext';\nimport { ChatContextValue, useChatContext } from '../../contexts/chatContext/ChatContext';\n\nimport { useTranslatedMessage } from '../../hooks/useTranslatedMessage';\nimport type { DefaultStreamChatGenerics } from '../../types/types';\n\nexport type ChannelPreviewPropsWithContext<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<ChatContextValue<StreamChatGenerics>, 'client'> &\n  Pick<ChannelsContextValue<StreamChatGenerics>, 'Preview'> & {\n    /**\n     * The previewed channel\n     */\n    channel: Channel<StreamChatGenerics>;\n  };\n\n/**\n * This component manages state for the ChannelPreviewMessenger UI component and receives\n * all props from the ChannelListMessenger component.\n */\nconst ChannelPreviewWithContext = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ChannelPreviewPropsWithContext<StreamChatGenerics>,\n) => {\n  const { channel, client, Preview } = props;\n\n  const [lastMessage, setLastMessage] = useState<\n    | ReturnType<ChannelState<StreamChatGenerics>['formatMessage']>\n    | MessageResponse<StreamChatGenerics>\n    | undefined\n  >(channel.state.messages[channel.state.messages.length - 1]);\n\n  const translatedLastMessage = useTranslatedMessage<StreamChatGenerics>(\n    lastMessage || ({} as MessageResponse<StreamChatGenerics>),\n  );\n\n  const [forceUpdate, setForceUpdate] = useState(0);\n  const [unread, setUnread] = useState(channel.countUnread());\n\n  const latestMessagePreview = useLatestMessagePreview(channel, forceUpdate, translatedLastMessage);\n\n  const channelLastMessage = channel.lastMessage();\n  const channelLastMessageString = `${channelLastMessage?.id}${channelLastMessage?.updated_at}`;\n\n  useEffect(() => {\n    if (\n      channelLastMessage &&\n      (channelLastMessage.id !== lastMessage?.id ||\n        channelLastMessage.updated_at !== lastMessage?.updated_at)\n    ) {\n      setLastMessage(channelLastMessage);\n    }\n\n    const newUnreadCount = channel.countUnread();\n\n    if (newUnreadCount !== unread) {\n      setUnread(newUnreadCount);\n    }\n  }, [channelLastMessageString]);\n\n  useEffect(() => {\n    const handleNewMessageEvent = (event: Event<StreamChatGenerics>) => {\n      const message = event.message;\n      if (message && (!message.parent_id || message.show_in_channel)) {\n        setLastMessage(event.message);\n        setUnread(channel.countUnread());\n      }\n    };\n\n    const handleUpdatedOrDeletedMessage = (event: Event<StreamChatGenerics>) => {\n      setLastMessage((prevLastMessage) => {\n        if (prevLastMessage?.id === event.message?.id) {\n          return event.message;\n        }\n        return prevLastMessage;\n      });\n    };\n\n    const listeners = [\n      channel.on('message.new', handleNewMessageEvent),\n      channel.on('message.updated', handleUpdatedOrDeletedMessage),\n      channel.on('message.deleted', handleUpdatedOrDeletedMessage),\n    ];\n\n    return () => listeners.forEach((l) => l.unsubscribe());\n  }, []);\n\n  useEffect(() => {\n    const handleReadEvent = (event: Event<StreamChatGenerics>) => {\n      if (event.user?.id === client.userID) {\n        setUnread(0);\n      } else if (event.user?.id) {\n        setForceUpdate((prev) => prev + 1);\n      }\n    };\n\n    const listener = channel.on('message.read', handleReadEvent);\n    return () => listener.unsubscribe();\n  }, []);\n\n  return <Preview channel={channel} latestMessagePreview={latestMessagePreview} unread={unread} />;\n};\n\nexport type ChannelPreviewProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Partial<Omit<ChannelPreviewPropsWithContext<StreamChatGenerics>, 'channel'>> &\n  Pick<ChannelPreviewPropsWithContext<StreamChatGenerics>, 'channel'>;\n\nexport const ChannelPreview = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ChannelPreviewProps<StreamChatGenerics>,\n) => {\n  const { client } = useChatContext<StreamChatGenerics>();\n  const { Preview } = useChannelsContext<StreamChatGenerics>();\n\n  return <ChannelPreviewWithContext {...{ client, Preview }} {...props} />;\n};\n"]}

package/lib/module/components/ImageGallery/ImageGallery.js

@@ -53,6 +53,8 @@ var _getUrlOfImageAttachment = require("../../utils/getUrlOfImageAttachment");
 
 var _utils = require("../../utils/utils");
 
+var _getGiphyMimeType = require("../Attachment/utils/getGiphyMimeType");
+
 var _this = this,
     _jsxFileName = "/Users/vishalnarkhede/projects/stream-chat-react-native/package/src/components/ImageGallery/ImageGallery.tsx";
 
@@ -129,9 +131,9 @@ var ImageGallery = function ImageGallery(props) {
       translucentStatusBar = _useOverlayContext.translucentStatusBar;
 
   var _useImageGalleryConte = (0, _ImageGalleryContext.useImageGalleryContext)(),
-      image = _useImageGalleryConte.image,
-      images = _useImageGalleryConte.images,
-      setImage = _useImageGalleryConte.setImage;
+      messages = _useImageGalleryConte.messages,
+      selectedMessage = _useImageGalleryConte.selectedMessage,
+      setSelectedMessage = _useImageGalleryConte.setSelectedMessage;
 
   var statusBarHeight = (_StatusBar$currentHei = _reactNative.StatusBar.currentHeight) != null ? _StatusBar$currentHei : 0;
   var bottomBarHeight = fullScreenHeight - measuredScreenHeight - statusBarHeight;
@@ -190,14 +192,14 @@ var ImageGallery = function ImageGallery(props) {
   var offsetScale = (0, _reactNativeReanimated.useSharedValue)(1);
   var scale = (0, _reactNativeReanimated.useSharedValue)(1);
   var translationX = (0, _reactNativeReanimated.useSharedValue)(0);
-  var photos = images.reduce(function (acc, cur) {
+  var photos = messages.reduce(function (acc, cur) {
     var _cur$attachments;
 
     var attachmentImages = ((_cur$attachments = cur.attachments) == null ? void 0 : _cur$attachments.filter(function (attachment) {
       var _attachment$giphy, _attachment$giphy$gip;
 
       return attachment.type === 'giphy' && (((_attachment$giphy = attachment.giphy) == null ? void 0 : (_attachment$giphy$gip = _attachment$giphy[giphyVersion]) == null ? void 0 : _attachment$giphy$gip.url) || attachment.thumb_url || attachment.image_url) || attachment.type === 'image' && !attachment.title_link && !attachment.og_scrape_url && (0, _getUrlOfImageAttachment.getUrlOfImageAttachment)(attachment) || (0, _native.isVideoPackageAvailable)() && attachment.type === 'video';
-    })) || [];
+    }).reverse()) || [];
     var attachmentPhotos = attachmentImages.map(function (a) {
       var _a$giphy, _a$giphy$giphyVersion;
 
@@ -208,7 +210,7 @@ var ImageGallery = function ImageGallery(props) {
         created_at: cur.created_at,
         id: "photoId-" + cur.id + "-" + imageUrl,
         messageId: cur.id,
-        mime_type: a.type === 'giphy' ? 'image/gif' : a.mime_type,
+        mime_type: a.type === 'giphy' ? (0, _getGiphyMimeType.getGiphyMimeType)(giphyURL != null ? giphyURL : '') : a.mime_type,
         original_height: a.original_height,
         original_width: a.original_width,
         type: a.type,
@@ -221,9 +223,14 @@ var ImageGallery = function ImageGallery(props) {
         user_id: cur.user_id
       };
     });
-    return [].concat((0, _toConsumableArray2["default"])(acc), (0, _toConsumableArray2["default"])(attachmentPhotos));
+    return [].concat((0, _toConsumableArray2["default"])(attachmentPhotos), (0, _toConsumableArray2["default"])(acc));
   }, []);
   var photoLength = photos.length;
+
+  var stripQueryFromUrl = function stripQueryFromUrl(url) {
+    return url.split('?')[0];
+  };
+
   (0, _react.useEffect)(function () {
     var updatePosition = function updatePosition(newIndex) {
       'worklet';
@@ -236,7 +243,7 @@ var ImageGallery = function ImageGallery(props) {
     };
 
     var newIndex = photos.findIndex(function (photo) {
-      return photo.messageId === (image == null ? void 0 : image.messageId) && photo.uri === (image == null ? void 0 : image.url);
+      return photo.messageId === (selectedMessage == null ? void 0 : selectedMessage.messageId) && stripQueryFromUrl(photo.uri) === stripQueryFromUrl((selectedMessage == null ? void 0 : selectedMessage.url) || '');
     });
 
     if (photoLength > 1) {
@@ -244,7 +251,7 @@ var ImageGallery = function ImageGallery(props) {
     }
 
     (0, _reactNativeReanimated.runOnUI)(updatePosition)(newIndex);
-  }, [image, photoLength]);
+  }, [selectedMessage, photoLength]);
   var uriForCurrentImage = (_photos$selectedIndex = photos[selectedIndex]) == null ? void 0 : _photos$selectedIndex.uri;
   (0, _react.useEffect)(function () {
     setCurrentImageHeight(screenHeight);
@@ -276,6 +283,7 @@ var ImageGallery = function ImageGallery(props) {
     scale: scale,
     screenHeight: screenHeight,
     screenWidth: screenWidth,
+    selectedIndex: selectedIndex,
     setSelectedIndex: setSelectedIndex,
     translateX: translateX,
     translateY: translateY,
@@ -382,7 +390,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 504,
+      lineNumber: 517,
       columnNumber: 5
     }
   }, _react["default"].createElement(_reactNativeReanimated["default"].View, {
@@ -390,7 +398,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 509,
+      lineNumber: 522,
       columnNumber: 7
     }
   }), _react["default"].createElement(_reactNativeGestureHandler.TapGestureHandler, {
@@ -402,7 +410,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 510,
+      lineNumber: 523,
       columnNumber: 7
     }
   }, _react["default"].createElement(_reactNativeReanimated["default"].View, {
@@ -410,7 +418,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 517,
+      lineNumber: 530,
       columnNumber: 9
     }
   }, _react["default"].createElement(_reactNativeGestureHandler.TapGestureHandler, {
@@ -424,7 +432,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 518,
+      lineNumber: 531,
       columnNumber: 11
     }
   }, _react["default"].createElement(_reactNativeReanimated["default"].View, {
@@ -432,7 +440,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 527,
+      lineNumber: 540,
       columnNumber: 13
     }
   }, _react["default"].createElement(_reactNativeGestureHandler.PinchGestureHandler, {
@@ -442,7 +450,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 528,
+      lineNumber: 541,
       columnNumber: 15
     }
   }, _react["default"].createElement(_reactNativeReanimated["default"].View, {
@@ -450,7 +458,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 533,
+      lineNumber: 546,
       columnNumber: 17
     }
   }, _react["default"].createElement(_reactNativeGestureHandler.PanGestureHandler, {
@@ -463,7 +471,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 534,
+      lineNumber: 547,
       columnNumber: 19
     }
   }, _react["default"].createElement(_reactNativeReanimated["default"].View, {
@@ -471,7 +479,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 542,
+      lineNumber: 555,
       columnNumber: 21
     }
   }, _react["default"].createElement(_reactNativeReanimated["default"].View, {
@@ -485,7 +493,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 543,
+      lineNumber: 556,
       columnNumber: 23
     }
   }, photos.map(function (photo, i) {
@@ -516,7 +524,7 @@ var ImageGallery = function ImageGallery(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 560,
+        lineNumber: 573,
         columnNumber: 29
       }
     }) : _react["default"].createElement(_AnimatedGalleryImage.AnimatedGalleryImage, {
@@ -540,7 +548,7 @@ var ImageGallery = function ImageGallery(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 587,
+        lineNumber: 600,
         columnNumber: 29
       }
     });
@@ -552,7 +560,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 620,
+      lineNumber: 633,
       columnNumber: 7
     }
   })), _react["default"].createElement(_ImageGalleryFooter.ImageGalleryFooter, (0, _extends2["default"])({
@@ -572,7 +580,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 626,
+      lineNumber: 639,
       columnNumber: 7
     }
   })), _react["default"].createElement(_ImageGalleryOverlay.ImageGalleryOverlay, {
@@ -582,14 +590,14 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 642,
+      lineNumber: 655,
       columnNumber: 7
     }
   }), _react["default"].createElement(_bottomSheet.BottomSheetModalProvider, {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 647,
+      lineNumber: 660,
       columnNumber: 7
     }
   }, _react["default"].createElement(_bottomSheet.BottomSheetModal, {
@@ -602,7 +610,7 @@ var ImageGallery = function ImageGallery(props) {
         __self: _this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 652,
+          lineNumber: 665,
           columnNumber: 13
         }
       }));
@@ -617,19 +625,19 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 648,
+      lineNumber: 661,
       columnNumber: 9
     }
   }, _react["default"].createElement(_ImageGrid.ImageGrid, (0, _extends2["default"])({
     closeGridView: closeGridView,
     numberOfImageGalleryGridColumns: numberOfImageGalleryGridColumns,
     photos: gridPhotos,
-    setImage: setImage
+    setSelectedMessage: setSelectedMessage
   }, imageGalleryCustomComponents == null ? void 0 : imageGalleryCustomComponents.grid, {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 663,
+      lineNumber: 676,
       columnNumber: 11
     }
   })))));