stream-chat-react-native-core 5.23.1 → 5.23.2-beta.2

package/lib/commonjs/components/AutoCompleteInput/AutoCompleteSuggestionList.js

@@ -1,31 +1,49 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.AutoCompleteSuggestionListWithContext = exports.AutoCompleteSuggestionList = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _SuggestionsContext = require("../../contexts/suggestionsContext/SuggestionsContext");
 var _ThemeContext = require("../../contexts/themeContext/ThemeContext");
-var _excluded = ["children"];
+var _native = require("../../native");
+var _excluded = ["children", "style"];
 var _this = this,
   _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/AutoCompleteInput/AutoCompleteSuggestionList.tsx";
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var AUTO_COMPLETE_SUGGESTION_LIST_HEADER_HEIGHT = 30;
 var SuggestionsItem = function SuggestionsItem(props) {
   var children = props.children,
-    touchableOpacityProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
-  return _react["default"].createElement(_reactNative.TouchableOpacity, (0, _extends2["default"])({}, touchableOpacityProps, {
+    propsStyle = props.style,
+    pressableProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
+  var style = function style(_ref) {
+    var pressed = _ref.pressed;
+    return [propsStyle, {
+      opacity: pressed ? 0.2 : 1
+    }];
+  };
+  return _react["default"].createElement(_reactNative.Pressable, (0, _extends2["default"])({}, pressableProps, {
+    style: style,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 36,
-      columnNumber: 10
+      lineNumber: 52,
+      columnNumber: 5
     }
   }), children);
 };
 SuggestionsItem.displayName = 'SuggestionsHeader{messageInput{suggestions}}';
 var AutoCompleteSuggestionListWithContext = function AutoCompleteSuggestionListWithContext(props) {
+  var _useState = (0, _react.useState)(0),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    itemHeight = _useState2[0],
+    setItemHeight = _useState2[1];
   var active = props.active,
     AutoCompleteSuggestionHeader = props.AutoCompleteSuggestionHeader,
     AutoCompleteSuggestionItem = props.AutoCompleteSuggestionItem,
@@ -34,98 +52,68 @@ var AutoCompleteSuggestionListWithContext = function AutoCompleteSuggestionListW
     queryText = props.queryText,
     triggerType = props.triggerType;
   var _useTheme = (0, _ThemeContext.useTheme)(),
-    _useTheme$theme$messa = _useTheme.theme.messageInput,
+    _useTheme$theme = _useTheme.theme,
+    white = _useTheme$theme.colors.white,
+    _useTheme$theme$messa = _useTheme$theme.messageInput,
     maxHeight = _useTheme$theme$messa.container.maxHeight,
     itemStyle = _useTheme$theme$messa.suggestions.item,
     flatlist = _useTheme$theme$messa.suggestionsListContainer.flatlist;
-  var renderItem = function renderItem(_ref) {
-    var index = _ref.index,
-      item = _ref.item;
+  var flatlistHeight = (0, _react.useMemo)(function () {
+    var totalItemHeight;
+    if (triggerType === 'emoji') {
+      totalItemHeight = data.length < 7 ? data.length * itemHeight : itemHeight * 6;
+    } else {
+      totalItemHeight = data.length < 4 ? data.length * itemHeight : itemHeight * 3;
+    }
+    return triggerType === 'emoji' || triggerType === 'command' ? totalItemHeight + AUTO_COMPLETE_SUGGESTION_LIST_HEADER_HEIGHT : totalItemHeight;
+  }, [itemHeight, data.length]);
+  var renderItem = function renderItem(_ref2) {
+    var item = _ref2.item;
     switch (triggerType) {
-      case 'mention':
-        if ((0, _SuggestionsContext.isSuggestionUser)(item)) {
-          return _react["default"].createElement(SuggestionsItem, {
-            onPress: function onPress() {
-              onSelect(item);
-            },
-            style: [{
-              paddingBottom: index === data.length - 1 ? 8 : 0,
-              paddingTop: index === 0 ? 8 : 0
-            }, itemStyle],
-            __self: _this,
-            __source: {
-              fileName: _jsxFileName,
-              lineNumber: 71,
-              columnNumber: 13
-            }
-          }, AutoCompleteSuggestionItem && _react["default"].createElement(AutoCompleteSuggestionItem, {
-            itemProps: item,
-            triggerType: triggerType,
-            __self: _this,
-            __source: {
-              fileName: _jsxFileName,
-              lineNumber: 84,
-              columnNumber: 17
-            }
-          }));
-        }
-        return null;
       case 'command':
-        if ((0, _SuggestionsContext.isSuggestionCommand)(item)) {
-          return _react["default"].createElement(SuggestionsItem, {
-            onPress: function onPress() {
-              onSelect(item);
-            },
-            style: [itemStyle],
-            __self: _this,
-            __source: {
-              fileName: _jsxFileName,
-              lineNumber: 93,
-              columnNumber: 13
-            }
-          }, AutoCompleteSuggestionItem && _react["default"].createElement(AutoCompleteSuggestionItem, {
-            itemProps: item,
-            triggerType: triggerType,
-            __self: _this,
-            __source: {
-              fileName: _jsxFileName,
-              lineNumber: 100,
-              columnNumber: 17
-            }
-          }));
-        }
-        return null;
+      case 'mention':
       case 'emoji':
-        if ((0, _SuggestionsContext.isSuggestionEmoji)(item)) {
-          return _react["default"].createElement(SuggestionsItem, {
-            onPress: function onPress() {
-              onSelect(item);
-            },
-            style: [itemStyle],
-            __self: _this,
-            __source: {
-              fileName: _jsxFileName,
-              lineNumber: 109,
-              columnNumber: 13
-            }
-          }, AutoCompleteSuggestionItem && _react["default"].createElement(AutoCompleteSuggestionItem, {
-            itemProps: item,
-            triggerType: triggerType,
-            __self: _this,
-            __source: {
-              fileName: _jsxFileName,
-              lineNumber: 116,
-              columnNumber: 17
-            }
-          }));
-        }
-        return null;
+        return _react["default"].createElement(SuggestionsItem, {
+          onLayout: function onLayout(event) {
+            return setItemHeight(event.nativeEvent.layout.height);
+          },
+          onPress: function onPress() {
+            onSelect(item);
+          },
+          style: itemStyle,
+          __self: _this,
+          __source: {
+            fileName: _jsxFileName,
+            lineNumber: 106,
+            columnNumber: 11
+          }
+        }, AutoCompleteSuggestionItem && _react["default"].createElement(AutoCompleteSuggestionItem, {
+          itemProps: item,
+          triggerType: triggerType,
+          __self: _this,
+          __source: {
+            fileName: _jsxFileName,
+            lineNumber: 114,
+            columnNumber: 15
+          }
+        }));
       default:
         return null;
     }
   };
   if (!active || data.length === 0) return null;
-  return _react["default"].createElement(_reactNative.FlatList, {
+  return _react["default"].createElement(_reactNative.View, {
+    style: [styles.container, {
+      backgroundColor: white,
+      height: flatlistHeight
+    }],
+    __self: _this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 126,
+      columnNumber: 5
+    }
+  }, _react["default"].createElement(_native.FlatList, {
     data: data,
     keyboardShouldPersistTaps: "always",
     keyExtractor: function keyExtractor(item, index) {
@@ -137,8 +125,8 @@ var AutoCompleteSuggestionListWithContext = function AutoCompleteSuggestionListW
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 138,
-        columnNumber: 11
+        lineNumber: 135,
+        columnNumber: 13
       }
     }) : null,
     renderItem: renderItem,
@@ -148,10 +136,10 @@ var AutoCompleteSuggestionListWithContext = function AutoCompleteSuggestionListW
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 130,
-      columnNumber: 5
+      lineNumber: 127,
+      columnNumber: 7
     }
-  });
+  }));
 };
 exports.AutoCompleteSuggestionListWithContext = AutoCompleteSuggestionListWithContext;
 var areEqual = function areEqual(prevProps, nextProps) {
@@ -185,11 +173,24 @@ var AutoCompleteSuggestionList = function AutoCompleteSuggestionList(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 202,
+      lineNumber: 200,
       columnNumber: 5
     }
   }));
 };
 exports.AutoCompleteSuggestionList = AutoCompleteSuggestionList;
+var styles = _reactNative.StyleSheet.create({
+  container: {
+    borderRadius: 8,
+    elevation: 3,
+    marginHorizontal: 8,
+    marginVertical: 8,
+    shadowOffset: {
+      height: 1,
+      width: 0
+    },
+    shadowOpacity: 0.15
+  }
+});
 AutoCompleteSuggestionList.displayName = 'AutoCompleteSuggestionList{messageInput{suggestions{List}}}';
 //# sourceMappingURL=AutoCompleteSuggestionList.js.map

package/lib/commonjs/components/AutoCompleteInput/AutoCompleteSuggestionList.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_SuggestionsContext","_ThemeContext","_excluded","_this","_jsxFileName","SuggestionsItem","props","children","touchableOpacityProps","_objectWithoutProperties2","createElement","TouchableOpacity","_extends2","__self","__source","fileName","lineNumber","columnNumber","displayName","AutoCompleteSuggestionListWithContext","active","AutoCompleteSuggestionHeader","AutoCompleteSuggestionItem","data","onSelect","queryText","triggerType","_useTheme","useTheme","_useTheme$theme$messa","theme","messageInput","maxHeight","container","itemStyle","suggestions","item","flatlist","suggestionsListContainer","renderItem","_ref","index","isSuggestionUser","onPress","style","paddingBottom","length","paddingTop","itemProps","isSuggestionCommand","isSuggestionEmoji","FlatList","keyboardShouldPersistTaps","keyExtractor","name","id","ListHeaderComponent","exports","areEqual","prevProps","nextProps","prevActive","prevData","prevQueryText","prevType","nextActive","nextData","nextQueryText","nextType","activeEqual","queryTextEqual","dataEqual","typeEqual","MemoizedAutoCompleteSuggestionList","React","memo","AutoCompleteSuggestionList","_useSuggestionsContex","useSuggestionsContext"],"sources":["AutoCompleteSuggestionList.tsx"],"sourcesContent":["import React from 'react';\nimport { FlatList, TouchableOpacity, TouchableOpacityProps } from 'react-native';\n\nimport type { AutoCompleteSuggestionHeaderProps } from './AutoCompleteSuggestionHeader';\nimport type { AutoCompleteSuggestionItemProps } from './AutoCompleteSuggestionItem';\n\nimport {\n  isSuggestionCommand,\n  isSuggestionEmoji,\n  isSuggestionUser,\n  Suggestion,\n  SuggestionsContextValue,\n  useSuggestionsContext,\n} from '../../contexts/suggestionsContext/SuggestionsContext';\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport type { DefaultStreamChatGenerics } from '../../types/types';\n\ntype AutoCompleteSuggestionListComponentProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<SuggestionsContextValue, 'queryText' | 'triggerType'> & {\n  active: boolean;\n  data: Suggestion<StreamChatGenerics>[];\n  onSelect: (item: Suggestion<StreamChatGenerics>) => void;\n};\n\nexport type AutoCompleteSuggestionListPropsWithContext<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<\n  SuggestionsContextValue<StreamChatGenerics>,\n  'AutoCompleteSuggestionHeader' | 'AutoCompleteSuggestionItem'\n> &\n  AutoCompleteSuggestionListComponentProps<StreamChatGenerics>;\n\nconst SuggestionsItem: React.FC<TouchableOpacityProps> = (props) => {\n  const { children, ...touchableOpacityProps } = props;\n  return <TouchableOpacity {...touchableOpacityProps}>{children}</TouchableOpacity>;\n};\n\nSuggestionsItem.displayName = 'SuggestionsHeader{messageInput{suggestions}}';\n\nexport const AutoCompleteSuggestionListWithContext = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: AutoCompleteSuggestionListPropsWithContext<StreamChatGenerics>,\n) => {\n  const {\n    active,\n    AutoCompleteSuggestionHeader,\n    AutoCompleteSuggestionItem,\n    data,\n    onSelect,\n    queryText,\n    triggerType,\n  } = props;\n\n  const {\n    theme: {\n      messageInput: {\n        container: { maxHeight },\n        suggestions: { item: itemStyle },\n        suggestionsListContainer: { flatlist },\n      },\n    },\n  } = useTheme();\n\n  const renderItem = ({ index, item }: { index: number; item: Suggestion<StreamChatGenerics> }) => {\n    switch (triggerType) {\n      case 'mention':\n        if (isSuggestionUser(item)) {\n          return (\n            <SuggestionsItem\n              onPress={() => {\n                onSelect(item);\n              }}\n              style={[\n                {\n                  paddingBottom: index === data.length - 1 ? 8 : 0,\n                  paddingTop: index === 0 ? 8 : 0,\n                },\n                itemStyle,\n              ]}\n            >\n              {AutoCompleteSuggestionItem && (\n                <AutoCompleteSuggestionItem itemProps={item} triggerType={triggerType} />\n              )}\n            </SuggestionsItem>\n          );\n        }\n        return null;\n      case 'command':\n        if (isSuggestionCommand(item)) {\n          return (\n            <SuggestionsItem\n              onPress={() => {\n                onSelect(item);\n              }}\n              style={[itemStyle]}\n            >\n              {AutoCompleteSuggestionItem && (\n                <AutoCompleteSuggestionItem itemProps={item} triggerType={triggerType} />\n              )}\n            </SuggestionsItem>\n          );\n        }\n        return null;\n      case 'emoji':\n        if (isSuggestionEmoji(item)) {\n          return (\n            <SuggestionsItem\n              onPress={() => {\n                onSelect(item);\n              }}\n              style={[itemStyle]}\n            >\n              {AutoCompleteSuggestionItem && (\n                <AutoCompleteSuggestionItem itemProps={item} triggerType={triggerType} />\n              )}\n            </SuggestionsItem>\n          );\n        }\n        return null;\n      default:\n        return null;\n    }\n  };\n\n  if (!active || data.length === 0) return null;\n\n  return (\n    <FlatList\n      data={data}\n      keyboardShouldPersistTaps='always'\n      keyExtractor={(item, index) =>\n        `${item.name || (isSuggestionUser(item) ? item.id : '')}${index}`\n      }\n      ListHeaderComponent={\n        AutoCompleteSuggestionHeader ? (\n          <AutoCompleteSuggestionHeader queryText={queryText} triggerType={triggerType} />\n        ) : null\n      }\n      renderItem={renderItem}\n      style={[flatlist, { maxHeight }]}\n    />\n  );\n};\n\nconst areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(\n  prevProps: AutoCompleteSuggestionListPropsWithContext<StreamChatGenerics>,\n  nextProps: AutoCompleteSuggestionListPropsWithContext<StreamChatGenerics>,\n) => {\n  const {\n    active: prevActive,\n    data: prevData,\n    queryText: prevQueryText,\n    triggerType: prevType,\n  } = prevProps;\n  const {\n    active: nextActive,\n    data: nextData,\n    queryText: nextQueryText,\n    triggerType: nextType,\n  } = nextProps;\n\n  const activeEqual = prevActive === nextActive;\n  if (!activeEqual) return false;\n\n  const queryTextEqual = prevQueryText === nextQueryText;\n  if (!queryTextEqual) return false;\n\n  const dataEqual = prevData === nextData;\n  if (!dataEqual) return false;\n\n  const typeEqual = prevType === nextType;\n  if (!typeEqual) return false;\n\n  return true;\n};\n\nconst MemoizedAutoCompleteSuggestionList = React.memo(\n  AutoCompleteSuggestionListWithContext,\n  areEqual,\n) as typeof AutoCompleteSuggestionListWithContext;\n\nexport type AutoCompleteSuggestionListProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = AutoCompleteSuggestionListComponentProps<StreamChatGenerics> & {\n  AutoCompleteSuggestionHeader?: React.ComponentType<AutoCompleteSuggestionHeaderProps>;\n  AutoCompleteSuggestionItem?: React.ComponentType<\n    AutoCompleteSuggestionItemProps<StreamChatGenerics>\n  >;\n};\n\nexport const AutoCompleteSuggestionList = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: AutoCompleteSuggestionListProps<StreamChatGenerics>,\n) => {\n  const { AutoCompleteSuggestionHeader, AutoCompleteSuggestionItem } =\n    useSuggestionsContext<StreamChatGenerics>();\n\n  return (\n    <MemoizedAutoCompleteSuggestionList\n      {...{ AutoCompleteSuggestionHeader, AutoCompleteSuggestionItem }}\n      {...props}\n    />\n  );\n};\n\nAutoCompleteSuggestionList.displayName =\n  'AutoCompleteSuggestionList{messageInput{suggestions{List}}}';\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_SuggestionsContext","_ThemeContext","_native","_excluded","_this","_jsxFileName","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","AUTO_COMPLETE_SUGGESTION_LIST_HEADER_HEIGHT","SuggestionsItem","props","children","propsStyle","style","pressableProps","_objectWithoutProperties2","_ref","pressed","opacity","createElement","Pressable","_extends2","__self","__source","fileName","lineNumber","columnNumber","displayName","AutoCompleteSuggestionListWithContext","_useState","useState","_useState2","_slicedToArray2","itemHeight","setItemHeight","active","AutoCompleteSuggestionHeader","AutoCompleteSuggestionItem","data","onSelect","queryText","triggerType","_useTheme","useTheme","_useTheme$theme","theme","white","colors","_useTheme$theme$messa","messageInput","maxHeight","container","itemStyle","suggestions","item","flatlist","suggestionsListContainer","flatlistHeight","useMemo","totalItemHeight","length","renderItem","_ref2","onLayout","event","nativeEvent","layout","height","onPress","itemProps","View","styles","backgroundColor","FlatList","keyboardShouldPersistTaps","keyExtractor","index","name","isSuggestionUser","id","ListHeaderComponent","exports","areEqual","prevProps","nextProps","prevActive","prevData","prevQueryText","prevType","nextActive","nextData","nextQueryText","nextType","activeEqual","queryTextEqual","dataEqual","typeEqual","MemoizedAutoCompleteSuggestionList","React","memo","AutoCompleteSuggestionList","_useSuggestionsContex","useSuggestionsContext","StyleSheet","create","borderRadius","elevation","marginHorizontal","marginVertical","shadowOffset","width","shadowOpacity"],"sources":["AutoCompleteSuggestionList.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport {\n  LayoutChangeEvent,\n  Pressable,\n  PressableProps,\n  PressableStateCallbackType,\n  StyleSheet,\n  View,\n  ViewStyle,\n} from 'react-native';\n\nimport type { AutoCompleteSuggestionHeaderProps } from './AutoCompleteSuggestionHeader';\nimport type { AutoCompleteSuggestionItemProps } from './AutoCompleteSuggestionItem';\n\nimport {\n  isSuggestionUser,\n  Suggestion,\n  SuggestionsContextValue,\n  useSuggestionsContext,\n} from '../../contexts/suggestionsContext/SuggestionsContext';\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport { FlatList } from '../../native';\nimport type { DefaultStreamChatGenerics } from '../../types/types';\n\nconst AUTO_COMPLETE_SUGGESTION_LIST_HEADER_HEIGHT = 30;\n\ntype AutoCompleteSuggestionListComponentProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<SuggestionsContextValue, 'queryText' | 'triggerType'> & {\n  active: boolean;\n  data: Suggestion<StreamChatGenerics>[];\n  onSelect: (item: Suggestion<StreamChatGenerics>) => void;\n};\n\nexport type AutoCompleteSuggestionListPropsWithContext<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<\n  SuggestionsContextValue<StreamChatGenerics>,\n  'AutoCompleteSuggestionHeader' | 'AutoCompleteSuggestionItem'\n> &\n  AutoCompleteSuggestionListComponentProps<StreamChatGenerics>;\n\nconst SuggestionsItem: React.FC<PressableProps> = (props) => {\n  const { children, style: propsStyle, ...pressableProps } = props;\n\n  const style = ({ pressed }: PressableStateCallbackType) => [\n    propsStyle as ViewStyle,\n    { opacity: pressed ? 0.2 : 1 },\n  ];\n\n  return (\n    <Pressable {...pressableProps} style={style}>\n      {children}\n    </Pressable>\n  );\n};\n\nSuggestionsItem.displayName = 'SuggestionsHeader{messageInput{suggestions}}';\n\nexport const AutoCompleteSuggestionListWithContext = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: AutoCompleteSuggestionListPropsWithContext<StreamChatGenerics>,\n) => {\n  const [itemHeight, setItemHeight] = useState<number>(0);\n  const {\n    active,\n    AutoCompleteSuggestionHeader,\n    AutoCompleteSuggestionItem,\n    data,\n    onSelect,\n    queryText,\n    triggerType,\n  } = props;\n\n  const {\n    theme: {\n      colors: { white },\n      messageInput: {\n        container: { maxHeight },\n        suggestions: { item: itemStyle },\n        suggestionsListContainer: { flatlist },\n      },\n    },\n  } = useTheme();\n\n  const flatlistHeight = useMemo(() => {\n    let totalItemHeight;\n    if (triggerType === 'emoji') {\n      totalItemHeight = data.length < 7 ? data.length * itemHeight : itemHeight * 6;\n    } else {\n      totalItemHeight = data.length < 4 ? data.length * itemHeight : itemHeight * 3;\n    }\n\n    return triggerType === 'emoji' || triggerType === 'command'\n      ? totalItemHeight + AUTO_COMPLETE_SUGGESTION_LIST_HEADER_HEIGHT\n      : totalItemHeight;\n  }, [itemHeight, data.length]);\n\n  const renderItem = ({ item }: { item: Suggestion<StreamChatGenerics> }) => {\n    switch (triggerType) {\n      case 'command':\n      case 'mention':\n      case 'emoji':\n        return (\n          <SuggestionsItem\n            onLayout={(event: LayoutChangeEvent) => setItemHeight(event.nativeEvent.layout.height)}\n            onPress={() => {\n              onSelect(item);\n            }}\n            style={itemStyle}\n          >\n            {AutoCompleteSuggestionItem && (\n              <AutoCompleteSuggestionItem itemProps={item} triggerType={triggerType} />\n            )}\n          </SuggestionsItem>\n        );\n      default:\n        return null;\n    }\n  };\n\n  if (!active || data.length === 0) return null;\n\n  return (\n    <View style={[styles.container, { backgroundColor: white, height: flatlistHeight }]}>\n      <FlatList\n        data={data}\n        keyboardShouldPersistTaps='always'\n        keyExtractor={(item, index) =>\n          `${item.name || (isSuggestionUser(item) ? item.id : '')}${index}`\n        }\n        ListHeaderComponent={\n          AutoCompleteSuggestionHeader ? (\n            <AutoCompleteSuggestionHeader queryText={queryText} triggerType={triggerType} />\n          ) : null\n        }\n        renderItem={renderItem}\n        style={[flatlist, { maxHeight }]}\n      />\n    </View>\n  );\n};\n\nconst areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(\n  prevProps: AutoCompleteSuggestionListPropsWithContext<StreamChatGenerics>,\n  nextProps: AutoCompleteSuggestionListPropsWithContext<StreamChatGenerics>,\n) => {\n  const {\n    active: prevActive,\n    data: prevData,\n    queryText: prevQueryText,\n    triggerType: prevType,\n  } = prevProps;\n  const {\n    active: nextActive,\n    data: nextData,\n    queryText: nextQueryText,\n    triggerType: nextType,\n  } = nextProps;\n\n  const activeEqual = prevActive === nextActive;\n  if (!activeEqual) return false;\n\n  const queryTextEqual = prevQueryText === nextQueryText;\n  if (!queryTextEqual) return false;\n\n  const dataEqual = prevData === nextData;\n  if (!dataEqual) return false;\n\n  const typeEqual = prevType === nextType;\n  if (!typeEqual) return false;\n\n  return true;\n};\n\nconst MemoizedAutoCompleteSuggestionList = React.memo(\n  AutoCompleteSuggestionListWithContext,\n  areEqual,\n) as typeof AutoCompleteSuggestionListWithContext;\n\nexport type AutoCompleteSuggestionListProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = AutoCompleteSuggestionListComponentProps<StreamChatGenerics> & {\n  AutoCompleteSuggestionHeader?: React.ComponentType<AutoCompleteSuggestionHeaderProps>;\n  AutoCompleteSuggestionItem?: React.ComponentType<\n    AutoCompleteSuggestionItemProps<StreamChatGenerics>\n  >;\n};\n\nexport const AutoCompleteSuggestionList = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: AutoCompleteSuggestionListProps<StreamChatGenerics>,\n) => {\n  const { AutoCompleteSuggestionHeader, AutoCompleteSuggestionItem } =\n    useSuggestionsContext<StreamChatGenerics>();\n\n  return (\n    <MemoizedAutoCompleteSuggestionList\n      {...{ AutoCompleteSuggestionHeader, AutoCompleteSuggestionItem }}\n      {...props}\n    />\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {\n    borderRadius: 8,\n    elevation: 3,\n    marginHorizontal: 8,\n    marginVertical: 8,\n    shadowOffset: { height: 1, width: 0 },\n    shadowOpacity: 0.15,\n  },\n});\n\nAutoCompleteSuggestionList.displayName =\n  'AutoCompleteSuggestionList{messageInput{suggestions{List}}}';\n"],"mappings":"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"}

package/lib/commonjs/components/Channel/Channel.js

@@ -558,14 +558,17 @@ var ChannelWithContext = function ChannelWithContext(props) {
   (0, _react.useEffect)(function () {
     var handleEvent = function handleEvent(event) {
       if (shouldSyncChannel) {
-        var _event$message;
-        if (thread) {
-          var updatedThreadMessages = thread.id && channel && channel.state.threads[thread.id] || threadMessages;
-          setThreadMessages(updatedThreadMessages);
-        }
-        if (channel && thread && ((_event$message = event.message) == null ? void 0 : _event$message.id) === thread.id) {
-          var updatedThread = channel.state.formatMessage(event.message);
-          setThread(updatedThread);
+        var isTypingEvent = event.type === 'typing.start' || event.type === 'typing.stop';
+        if (!isTypingEvent) {
+          var _event$message;
+          if (thread != null && thread.id) {
+            var updatedThreadMessages = thread.id && channel && channel.state.threads[thread.id] || threadMessages;
+            setThreadMessages(updatedThreadMessages);
+          }
+          if (channel && thread != null && thread.id && ((_event$message = event.message) == null ? void 0 : _event$message.id) === thread.id) {
+            var updatedThread = channel.state.formatMessage(event.message);
+            setThread(updatedThread);
+          }
         }
         if (channel && event.type !== 'message.new' && event.type !== 'message.read' && event.type !== 'typing.start' && event.type !== 'typing.stop') {
           copyChannelState();
@@ -911,20 +914,19 @@ var ChannelWithContext = function ChannelWithContext(props) {
         while (1) switch (_context6.prev = _context6.next) {
           case 0:
             if (!(!(channel != null && channel.initialized) || !channel.state.isUpToDate)) {
-              _context6.next = 5;
+              _context6.next = 7;
               break;
             }
             _context6.next = 3;
             return channel == null ? void 0 : channel.watch();
           case 3:
-            _context6.next = 7;
-            break;
-          case 5:
-            _context6.next = 7;
-            return loadLatestMessagesRef.current(true);
-          case 7:
             channel == null ? void 0 : channel.state.setIsUpToDate(true);
             setHasNoMoreRecentMessagesToLoad(true);
+            _context6.next = 9;
+            break;
+          case 7:
+            _context6.next = 9;
+            return channel.state.loadMessageIntoState('latest');
           case 9:
           case "end":
             return _context6.stop();
@@ -2002,12 +2004,12 @@ var ChannelWithContext = function ChannelWithContext(props) {
       return _ref26.apply(this, arguments);
     };
   }();
-  var openThread = function openThread(message) {
+  var openThread = (0, _react.useCallback)(function (message) {
     var _channel$state2;
     var newThreadMessages = message != null && message.id ? (channel == null ? void 0 : (_channel$state2 = channel.state) == null ? void 0 : _channel$state2.threads[message.id]) || [] : [];
     setThread(message);
     setThreadMessages(newThreadMessages);
-  };
+  }, [setThread, setThreadMessages]);
   var closeThread = (0, _react.useCallback)(function () {
     setThread(null);
     setThreadMessages([]);
@@ -2283,7 +2285,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 2284,
+        lineNumber: 2290,
         columnNumber: 12
       }
     });
@@ -2297,7 +2299,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 2289,
+        lineNumber: 2295,
         columnNumber: 7
       }
     }, t('Please select a channel first'));
@@ -2310,7 +2312,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 2296,
+      lineNumber: 2302,
       columnNumber: 5
     }
   }), _react["default"].createElement(_ChannelContext.ChannelProvider, {
@@ -2318,7 +2320,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 2302,
+      lineNumber: 2308,
       columnNumber: 7
     }
   }, _react["default"].createElement(_OwnCapabilitiesContext.OwnCapabilitiesProvider, {
@@ -2326,7 +2328,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 2303,
+      lineNumber: 2309,
       columnNumber: 9
     }
   }, _react["default"].createElement(_TypingContext.TypingProvider, {
@@ -2334,7 +2336,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 2304,
+      lineNumber: 2310,
       columnNumber: 11
     }
   }, _react["default"].createElement(_PaginatedMessageListContext.PaginatedMessageListProvider, {
@@ -2342,7 +2344,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 2305,
+      lineNumber: 2311,
       columnNumber: 13
     }
   }, _react["default"].createElement(_MessagesContext.MessagesProvider, {
@@ -2350,7 +2352,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 2306,
+      lineNumber: 2312,
       columnNumber: 15
     }
   }, _react["default"].createElement(_ThreadContext.ThreadProvider, {
@@ -2358,7 +2360,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 2307,
+      lineNumber: 2313,
       columnNumber: 17
     }
   }, _react["default"].createElement(_SuggestionsContext.SuggestionsProvider, {
@@ -2366,7 +2368,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 2308,
+      lineNumber: 2314,
       columnNumber: 19
     }
   }, _react["default"].createElement(_MessageInputContext.MessageInputProvider, {
@@ -2374,7 +2376,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 2309,
+      lineNumber: 2315,
       columnNumber: 21
     }
   }, _react["default"].createElement(_reactNative.View, {
@@ -2384,13 +2386,13 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 2310,
+      lineNumber: 2316,
       columnNumber: 23
     }
   }, children))))))))));
 };
 var Channel = function Channel(props) {
-  var _props$thread, _props$thread2, _props$channel;
+  var _props$thread, _props$thread2;
   var _useChatContext = (0, _ChatContext.useChatContext)(),
     client = _useChatContext.client,
     enableOfflineSupport = _useChatContext.enableOfflineSupport;
@@ -2413,7 +2415,6 @@ var Channel = function Channel(props) {
     watcherCount = _useChannelState.watcherCount,
     watchers = _useChannelState.watchers;
   return _react["default"].createElement(ChannelWithContext, (0, _extends2["default"])({
-    key: (_props$channel = props.channel) == null ? void 0 : _props$channel.cid,
     client: client,
     enableOfflineSupport: enableOfflineSupport,
     t: t
@@ -2436,7 +2437,7 @@ var Channel = function Channel(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 2367,
+      lineNumber: 2373,
       columnNumber: 5
     }
   }));