stream-chat-react/dist/components/Poll/PollActions/AddCommentForm.js

React components to create chat conversations or livestream style chat

import React from 'react';
import { FormDialog } from '../../Dialog/FormDialog';
import { useStateStore } from '../../../store';
import { usePollContext, useTranslationContext } from '../../../context';
const pollStateSelector = (nextValue) => ({
    ownAnswer: nextValue.ownAnswer,
});
export const AddCommentForm = ({ close, messageId }) => {
    const { t } = useTranslationContext('AddCommentForm');
    const { poll } = usePollContext();
    const { ownAnswer } = useStateStore(poll.state, pollStateSelector);
    return (React.createElement(FormDialog, { className: 'str-chat__prompt-dialog str-chat__modal__poll-add-comment', close: close, fields: {
            comment: {
                element: 'input',
                props: {
                    id: 'comment',
                    name: 'comment',
                    required: true,
                    type: 'text',
                    value: ownAnswer?.answer_text ?? '',
                },
                validator: (value) => {
                    const valueString = typeof value !== 'undefined' ? value.toString() : value;
                    const trimmedValue = valueString?.trim();
                    if (!trimmedValue) {
                        return new Error(t('This field cannot be empty or contain only spaces'));
                    }
                    return;
                },
            },
        }, onSubmit: async (value) => {
            await poll.addAnswer(value.comment, messageId);
        }, shouldDisableSubmitButton: (value) => !value.comment || value.comment === ownAnswer?.answer_text, title: ownAnswer ? t('Update your comment') : t('Add a comment') }));
};