getstream-iogetstream-chat

How do I disable the emoji picker in the message input box in get stream?


I can't seem to figure out how to disable the EmojiPicker on my GetStream React app. I've read this documentation about how to create a custom EmojiPicker, but I can't seem to figure out how to disable the element entirely: https://getstream.io/chat/docs/sdk/react/guides/customization/emoji_picker/. Any guidance would be greatly appreciated, thanks!


Solution

  • As stated on this page, the important part is to provide a CustomInput (which can be named differently) to the Channel's Input parameter.

    Creating a custom input (taken from the docs, but omitting the EmojiPicker) can be done like this:

    const CustomInput = () => {
      return (
        <div>
          <ImageDropzone>
            <QuotedMessagePreview />
            <UploadsPreview />
            <ChatAutoComplete />
            <FileUploadButton />
            <SendButton />
          </ImageDropzone>
        </div>
      )
    }
    

    This can then be input into the app tree like this:

    <Chat client={client}>
      <Channel channel={channel} Input={CustomInput}>
        <MessageList />
        <MessageInput />
      </Channel>
    </Chat>
    

    The place where this customization is described is here.