Post-merge fixes

Author: arnautov-anton

src/components/AutoCompleteTextarea/Item.tsx

@@ -1,14 +1,15 @@
-import React, { MouseEventHandler, Ref, useCallback } from 'react';
+import type { MouseEventHandler, Ref } from 'react';
+import React, { useCallback } from 'react';
 import clsx from 'clsx';
-import { SuggestionItemProps } from '../ChatAutoComplete';
-import type { DefaultStreamChatGenerics } from '../../types';
+import type { SuggestionItemProps } from '../ChatAutoComplete';
+
 import type { UnknownType } from '../../types/types';
 
 export const Item = React.forwardRef<HTMLAnchorElement, SuggestionItemProps>(
-  function Item<
-    StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
-    T extends UnknownType = UnknownType,
-  >(props: SuggestionItemProps<StreamChatGenerics, T>, innerRef: Ref<HTMLAnchorElement>) {
+  function Item<T extends UnknownType = UnknownType>(
+    props: SuggestionItemProps<T>,
+    innerRef: Ref<HTMLAnchorElement>,
+  ) {
     const {
       className,
       component: Component,

src/components/AutoCompleteTextarea/List.tsx

@@ -1,28 +1,22 @@
-import React, {
-  CSSProperties,
-  MouseEventHandler,
-  useCallback,
-  useEffect,
-  useMemo,
-  useState,
-} from 'react';
+/* eslint-disable react-hooks/exhaustive-deps */
+import type { CSSProperties } from 'react';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import clsx from 'clsx';
 
 import { useComponentContext } from '../../context/ComponentContext';
 
 import { Item } from './Item';
 import { escapeRegExp } from '../Message/renderText';
-import type { DefaultStreamChatGenerics } from '../../types';
+
 import type { CustomTrigger, UnknownType } from '../../types/types';
-import {
+import type {
   SuggestionEmoji,
   SuggestionItem,
   SuggestionListProps,
   SuggestionUser,
 } from '../ChatAutoComplete';
 
 export const List = <
-  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
   V extends CustomTrigger = CustomTrigger,
   EmojiData extends UnknownType = UnknownType,
 >({
@@ -40,9 +34,8 @@ export const List = <
   SuggestionItem: PropSuggestionItem,
   value: propValue,
   values,
-}: SuggestionListProps<StreamChatGenerics, V>) => {
-  const { AutocompleteSuggestionItem } =
-    useComponentContext<StreamChatGenerics>('SuggestionList');
+}: SuggestionListProps<V>) => {
+  const { AutocompleteSuggestionItem } = useComponentContext('SuggestionList');
   const SuggestionItem = PropSuggestionItem || AutocompleteSuggestionItem || Item;
 
   const [selectedItemIndex, setSelectedItemIndex] = useState<number | undefined>(
@@ -51,10 +44,12 @@ export const List = <
 
   const itemsRef: HTMLElement[] = [];
 
-  const isSelected = (item: SuggestionItem<StreamChatGenerics, EmojiData>) =>
+  const isSelected = (item: SuggestionItem<EmojiData>) =>
+    // @ts-expect-error tmp
     selectedItemIndex === values.findIndex((value) => getId(value) === getId(item));
 
-  const getId = (item: SuggestionItem<StreamChatGenerics, EmojiData>) => {
+  const getId = (item: SuggestionItem<EmojiData>) => {
+    // @ts-expect-error tmp
     const textToReplace = getTextToReplace(item);
     if (textToReplace.key) {
       return textToReplace.key;
@@ -68,29 +63,23 @@ export const List = <
   };
 
   const findItemIndex = useCallback(
-    (item: SuggestionItem<StreamChatGenerics, V>) =>
+    (item: SuggestionItem<V>) =>
       values.findIndex((value) =>
-        value.id
-          ? value.id === (item as SuggestionUser<StreamChatGenerics>).id
-          : value.name === item.name,
+        value.id ? value.id === (item as SuggestionUser).id : value.name === item.name,
       ),
     [values],
   );
 
-  const modifyText = (
-    value: SuggestionListProps<StreamChatGenerics, V>['values'][number],
-  ) => {
+  const modifyText = (value: SuggestionListProps<V>['values'][number]) => {
     if (!value) return;
-
+    // @ts-expect-error tmp
     onSelect(getTextToReplace(value));
+    // @ts-expect-error tmp
     if (getSelectedItem) getSelectedItem(value);
   };
 
   const handleClick = useCallback(
-    (
-      e: React.MouseEvent<Element, MouseEvent>,
-      item: SuggestionItem<StreamChatGenerics, V>,
-    ) => {
+    (e: React.MouseEvent<Element, MouseEvent>, item: SuggestionItem<V>) => {
       e?.preventDefault();
 
       const index = findItemIndex(item);
@@ -101,7 +90,7 @@ export const List = <
   );
 
   const selectItem = useCallback(
-    (item: SuggestionItem<StreamChatGenerics, V>) => {
+    (item: SuggestionItem<V>) => {
       const index = findItemIndex(item);
       setSelectedItemIndex(index);
     },
@@ -137,7 +126,6 @@ export const List = <
 
       return null;
     },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [selectedItemIndex, values],
   );
 
@@ -147,12 +135,13 @@ export const List = <
   }, [handleKeyDown]);
 
   useEffect(() => {
+    // @ts-expect-error tmp
     if (values?.length) selectItem(values[0]);
   }, [selectItem, values]);
 
   const restructureItem = useCallback(
-    (item: SuggestionItem<StreamChatGenerics, V>) => {
-      const matched = item.name || (item as SuggestionUser<StreamChatGenerics>).id;
+    (item: SuggestionItem<V>) => {
+      const matched = item.name || (item as SuggestionUser).id;
 
       const textBeforeCursor = (propValue || '').slice(0, selectionEnd);
       const triggerIndex = textBeforeCursor.lastIndexOf(currentTrigger);
@@ -168,6 +157,7 @@ export const List = <
   );
 
   const restructuredValues = useMemo(
+    // @ts-expect-error tmp
     () => values.map(restructureItem),
     [values, restructureItem],
   );
@@ -177,7 +167,7 @@ export const List = <
       {restructuredValues.map((item, i) => (
         <SuggestionItem
           className={itemClassName}
-          // @ts-ignore
+          // @ts-expect-error tmp
           component={component}
           item={item}
           key={getId(item).toString()}

src/components/AutoCompleteTextarea/TextareaX.tsx

@@ -1,19 +1,21 @@
-import React, { CSSProperties, useCallback, useEffect, useRef, useState } from 'react';
+/* eslint-disable @typescript-eslint/no-unused-vars */
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/no-non-null-assertion */
+/* eslint-disable react-hooks/exhaustive-deps */
+/* eslint-disable no-underscore-dangle */
+
+import type { CSSProperties } from 'react';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 import Textarea from 'react-textarea-autosize';
 import getCaretCoordinates from 'textarea-caret';
 import clsx from 'clsx';
 import { List as DefaultSuggestionList } from './List';
-import {
-  DEFAULT_CARET_POSITION,
-  defaultScrollToItem,
-  errorMessage,
-  triggerPropsCheck,
-} from './utils';
+import { DEFAULT_CARET_POSITION, defaultScrollToItem, errorMessage } from './utils';
 import { isSafari } from '../../utils/browsers';
 import { CommandItem } from '../CommandItem';
 import { UserItem } from '../UserItem';
-import { SuggestionItemProps, SuggestionListProps } from '../ChatAutoComplete';
-import type { DefaultStreamChatGenerics } from '../../types';
+import type { SuggestionItemProps, SuggestionListProps } from '../ChatAutoComplete';
+
 import type { CustomTrigger, UnknownType } from '../../types/types';
 
 type TextareaState = {
@@ -32,7 +34,6 @@ type TextareaState = {
 };
 
 type TextareaProps<
-  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
   V extends CustomTrigger = CustomTrigger,
   EmojiData extends UnknownType = UnknownType,
 > = {
@@ -72,11 +73,9 @@ type TextareaProps<
   showMentionsList?: boolean;
   style?: Omit<CSSProperties, 'height'>;
   SuggestionItem?: React.ComponentType<
-    React.ComponentType<SuggestionItemProps<StreamChatGenerics, EmojiData>>
-  >;
-  SuggestionList?: React.ComponentType<
-    SuggestionListProps<StreamChatGenerics, V, EmojiData>
+    React.ComponentType<SuggestionItemProps<EmojiData>>
   >;
+  SuggestionList?: React.ComponentType<SuggestionListProps<V, EmojiData>>;
   trigger: Record<
     string,
     {
@@ -102,11 +101,10 @@ type TextareaProps<
 const _isCommand = (value: string) => value.startsWith('/');
 
 export const TextareaX = <
-  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
   V extends CustomTrigger = CustomTrigger,
   EmojiData extends UnknownType = UnknownType,
 >(
-  props: TextareaProps<StreamChatGenerics, V, EmojiData>,
+  props: TextareaProps<V, EmojiData>,
 ) => {
   const {
     closeCommandsList,
@@ -129,7 +127,6 @@ export const TextareaX = <
     shouldSubmit,
     showCommandsList,
     showMentionsList,
-    // @ts-ignore
     SuggestionItem,
     SuggestionList = DefaultSuggestionList,
     trigger,
@@ -153,11 +150,11 @@ export const TextareaX = <
     dataLoading: false,
     isComposing: false,
     left: null,
+    propsValue: initialValue,
     selectionEnd: 0,
     selectionStart: 0,
     top: null,
     value: initialValue,
-    propsValue: initialValue,
   });
 
   const textareaRef = useRef<HTMLTextAreaElement>(null);
@@ -655,7 +652,7 @@ export const TextareaX = <
         triggerProps.values = data;
       });
 
-      // @ts-ignore
+      // @ts-expect-error tmp
       triggerProps.component = showCommandsList ? CommandItem : UserItem;
       triggerProps.currentTrigger = showCommandsList ? '/' : '@';
       triggerProps.getTextToReplace = _getTextToReplace(showCommandsList ? '/' : '@');
@@ -711,9 +708,9 @@ export const TextareaX = <
 
         setState((prev) => ({
           ...prev,
+          component: triggerSettings.component,
           data,
           dataLoading: false,
-          component: triggerSettings.component,
         }));
       });
     }
@@ -801,7 +798,7 @@ export const TextareaX = <
             ref={setDropdownRef}
             style={restProps.dropdownStyle}
           >
-            {/*// @ts-ignore*/}
+            {/* @ts-expect-error tmp */}
             <SuggestionList
               className={restProps.listClassName}
               dropdownScroll={_dropdownScroll}