Merge pull request #310 from GetStream/illegal-invocation-fix

Illegal invocation fix

Author: MartinCupela

package.json

@@ -122,7 +122,7 @@
     "@types/linkifyjs": "^2.1.3",
     "@types/url-parse": "^1.4.3",
     "@types/webscopeio__react-textarea-autocomplete": "^4.7.0",
-    "@webscopeio/react-textarea-autocomplete": "^4.7.3",
+    "@webscopeio/react-textarea-autocomplete": "^4.8.1",
     "classnames": "^2.3.1",
     "dayjs": "^1.10.4",
     "emoji-mart": "^3.0.1",

src/components/CommentField.tsx

@@ -84,7 +84,7 @@ export const CommentField = <UT extends DefaultUT = DefaultUT, AT extends Defaul
           rows={1}
           value={text}
           placeholder={placeholder ?? t('Start Typing...')}
-          onChange={(event) => setText((pv) => inputValueFromEvent<HTMLTextAreaElement>(event) ?? pv)}
+          onChange={(event) => setText((pv) => inputValueFromEvent<HTMLTextAreaElement>(event, true) ?? pv)}
           emojiData={emojiData}
           trigger={trigger}
           maxLength={280}

src/components/StatusUpdateForm/useStatusUpdateForm.ts

@@ -482,7 +482,7 @@ export function useStatusUpdateForm<
   };
 
   const onChange = useCallback((event: SyntheticEvent<HTMLTextAreaElement>) => {
-    const text = inputValueFromEvent(event);
+    const text = inputValueFromEvent(event, true);
     if (text === null || text === undefined) return;
     setText(text);
     handleOgDebounced(text);

src/utils/index.ts

@@ -136,10 +136,17 @@ export async function dataTransferItemsToFiles(items?: DataTransferItemList) {
 }
 
 export function inputValueFromEvent<T extends HTMLInputElement | HTMLTextAreaElement = HTMLInputElement>(
-  event?: React.SyntheticEvent<T>,
+  event: React.SyntheticEvent<T> | undefined = undefined,
+  targetFirst: boolean | undefined = false,
 ) {
-  const target = (event?.currentTarget || event?.target) as T;
-  return target?.value;
+  try {
+    const target = (event?.[targetFirst ? 'target' : 'currentTarget'] ??
+      event?.[targetFirst ? 'currentTarget' : 'target']) as T;
+    return target?.value;
+  } catch (error) {
+    console.error(error);
+    return undefined;
+  }
 }
 
 export function sanitizeURL(url?: string) {

yarn.lock

@@ -3191,10 +3191,10 @@
     "@webassemblyjs/wast-parser" "1.9.0"
     "@xtuc/long" "4.2.2"
 
-"@webscopeio/react-textarea-autocomplete@^4.7.3":
-  version "4.7.3"
-  resolved "https://registry.yarnpkg.com/@webscopeio/react-textarea-autocomplete/-/react-textarea-autocomplete-4.7.3.tgz#48909621ca754d36a997359f8d9ff13513863fe1"
-  integrity sha512-Bdpl6/J+lI3cxTXJ+NsVj4D4A8Guy7t1FWtMZQLH46F63VHGCcBTGeZfnxlNEHns0FqHV8DTnHcJUeN2N4h82g==
+"@webscopeio/react-textarea-autocomplete@^4.8.1":
+  version "4.8.1"
+  resolved "https://registry.yarnpkg.com/@webscopeio/react-textarea-autocomplete/-/react-textarea-autocomplete-4.8.1.tgz#2209da4337135612b33b333aabe002fb14f88aaa"
+  integrity sha512-1toVv6rlvpzH5pgvkfuGRFTkYrhc+flLGMjQHpnkaaVBRp+7DCgGt2ou5NdHI52PBOdQtK6Pwar5coyF33Tj/Q==
   dependencies:
     custom-event "^1.0.1"
     textarea-caret "3.0.2"