Can I disable the (Camera, Photo library and Files) menu in the SendInput of the GroupChannelFrame

Sendbird Chat UIKit React Native
1

[Problem/Question]
Is there a way to hide/disable button or icon for (Camera, Photo library and Files) in the GroupChannelFrame SendInput?

image

Would like to hide the “+” icon.

// If problem, please fill out the below. If question, please delete.
“@sendbird/uikit-react-native”: “^2.5.0”,
// What version of the SDK are you using?
“@sendbird/chat”: “^4.8.3”,
[Reproduction Steps]

[Frequency]
Every time

[Current impact]
Blocking issue

2

did u find a solution for this?

3

Hello @jshen,

Welcome to the Sendbird Community!

To disable/hide the functionality from the Input, you should implement your own input component similar to the below,

const CustomInput = () => {
  return <TextInput style={{ borderWidth: 1, height: 40, backgroundColor: 'read' }} />;
};

const GroupChannelFragment = createGroupChannelFragment({
  // Header: CustomHeader,
  // Input: CustomInput
});

For more details regarding module customization kindly refer to this article - Module | UIKit React Native SDK | Sendbird Docs

Regards,
Thanraj P

4

@Thanraj but then dont we loose the funcs provided by the Input provided by Sendbird?
Can we maybe put a feature reuqest to add a prop on the GroupChannelFragment to be able to accept this ?

5

Thank you Thanraj, If using textInput, I would need to dispatch the input message from the input through separate API call. Instead, I was hope to still use GroupChannelInput widget which already has list of functions and only having the parameter to turn off the “icon={add}” in the SendInput. Looks like without override the whole GroupChannelInput, it’s not possible to just hide the “add” icon

6

@Ullas_Gupta @jshen : Thanks for your feedback, as the prop is currently unavailable I have submitted an request with the team internally and it will be taken into consideration after further review.

I’ll keep this thread posted once this is implemented and released in the upcoming version. Meanwhile, appreciate your patience.

1 Like
7

is there already a solution?

8

The following removed the + icon for me in the text input:

const GroupChannelFragment = createGroupChannelFragment({
  Input: (props: GroupChannelProps['Input']) => <GroupChannelInput {...props} AttachmentsButton={() => null} />
})