diff --git a/app/soapbox/components/autosuggest_account_input.tsx b/app/soapbox/components/autosuggest_account_input.tsx index f58e37623..13e604f7c 100644 --- a/app/soapbox/components/autosuggest_account_input.tsx +++ b/app/soapbox/components/autosuggest_account_input.tsx @@ -3,7 +3,7 @@ import { throttle } from 'lodash'; import React, { useState, useRef, useCallback, useEffect } from 'react'; import { accountSearch } from 'soapbox/actions/accounts'; -import AutosuggestInput from 'soapbox/components/autosuggest_input'; +import AutosuggestInput, { Suggestion } from 'soapbox/components/autosuggest_input'; import { useAppDispatch } from 'soapbox/hooks'; import type { Menu } from 'soapbox/components/dropdown_menu'; @@ -59,8 +59,10 @@ const AutosuggestAccountInput: React.FC = ({ onChange(e); }; - const handleSelected = (_tokenStart: number, _lastToken: string | null, accountId: string) => { - onSelected(accountId); + const handleSelected = (_tokenStart: number, _lastToken: string | null, suggestion: Suggestion) => { + if (typeof suggestion === 'string' && suggestion[0] !== '#') { + onSelected(suggestion); + } }; useEffect(() => { diff --git a/app/soapbox/components/autosuggest_emoji.tsx b/app/soapbox/components/autosuggest_emoji.tsx index ba6f5671a..22979d454 100644 --- a/app/soapbox/components/autosuggest_emoji.tsx +++ b/app/soapbox/components/autosuggest_emoji.tsx @@ -3,7 +3,8 @@ import React from 'react'; import unicodeMapping from 'soapbox/features/emoji/emoji_unicode_mapping_light'; import { joinPublicPath } from 'soapbox/utils/static'; -type Emoji = { +export type Emoji = { + id: string, custom: boolean, imageUrl: string, native: string, diff --git a/app/soapbox/components/autosuggest_input.tsx b/app/soapbox/components/autosuggest_input.tsx index 493b541a6..f9b4d76a6 100644 --- a/app/soapbox/components/autosuggest_input.tsx +++ b/app/soapbox/components/autosuggest_input.tsx @@ -3,7 +3,7 @@ import { List as ImmutableList } from 'immutable'; import React from 'react'; import ImmutablePureComponent from 'react-immutable-pure-component'; -import AutosuggestEmoji from 'soapbox/components/autosuggest_emoji'; +import AutosuggestEmoji, { Emoji } from 'soapbox/components/autosuggest_emoji'; import Icon from 'soapbox/components/icon'; import AutosuggestAccount from 'soapbox/features/compose/components/autosuggest_account'; import { isRtl } from 'soapbox/rtl'; @@ -15,6 +15,8 @@ type CursorMatch = [ token: string | null, ]; +export type Suggestion = string | Emoji; + const textAtCursorMatchesToken = (str: string, caretPosition: number, searchTokens: string[]): CursorMatch => { let word: string; @@ -45,7 +47,7 @@ interface IAutosuggestInput extends Pick, suggestions: ImmutableList, disabled?: boolean, placeholder?: string, - onSuggestionSelected: (tokenStart: number, lastToken: string | null, suggestion: any) => void, + onSuggestionSelected: (tokenStart: number, lastToken: string | null, suggestion: Suggestion) => void, onSuggestionsClearRequested: () => void, onSuggestionsFetchRequested: (token: string) => void, autoFocus: boolean, @@ -193,7 +195,7 @@ export default class AutosuggestInput extends ImmutablePureComponent { + renderSuggestion = (suggestion: Suggestion, i: number) => { const { selectedSuggestion } = this.state; let inner, key;