Skip to main content
Version: Next

Kabelwerk Message Form

The <KabelwerkMessageForm> component renders an input form for posting new messages in a chat room.

Most probably you will not directly use the <KabelwerkMessageForm> component in your code — on the contrary, it is likely that you will want to replace it with a component of your own.

Example

// example using expo-document-picker
const pickFile = function () {
return DocumentPicker.getDocumentAsync({
copyToCacheDirectory: false,
type: ['image/jpeg', 'image/png'],
}).then((result) => {
if (result.type == 'cancel') {
return Promise.reject();
}

return {
name: result.name,
type: result.mimeType,
uri: result.uri,
};
});
};

<KabelwerkMessageForm
postMessage={postMessage}
postUpload={postUpload}
pickFile={pickFile}
/>;

Props

postMessage

Called when the user intends to post a new message in the chat room via the form. Called with an { text } object for text messages and with an { uploadId } object for image messages. It should return a Promise which resolves if the message has been posted successfully.

postUpload

Called when the user intends to upload a new file in the chat room via the form. Called with the resolved value of the pickFile callback (see below). It should return a Promise which resolves into an upload object if the file has been uploaded successfully.

pickFile

Called when the user intends to pick a file for uploading in the chat room. Called without arguments, the function should return a Promise which resolves into an { name, type, uri } object — which can then be uploaded to the Kabelwerk backend via the postUpload callback.

See also