Function AddThreadModal

apps/web/ui/AddThreadModal/index.tsx:55–168

({
  communityId,
  currentUser,
  currentChannel,
  channels = [],
  open,
  close,
  onSend,
  uploadFiles,
  progress,
  uploading,
  uploads,
  api,
}: Props)

}

export default function AddThreadModal({
  communityId,
  currentUser,
  currentChannel,
  channels = [],
  open,
  close,
  onSend,
  uploadFiles,
  progress,
  uploading,
  uploads,
  api,
}: Props) {
  const [message, setMessage] = useState('');
  const [allUsers] = useUsersContext();
  const [channelId, setChannelId] = useState<string>(
    currentChannel ? currentChannel.id : findDefaultChannel(channels)?.id
  );
  const [title, setTitle] = useState<string>('');
  return (
    <Modal open={open} close={close} size="xl">
      <div className={styles.grid}>
        <div className={styles.column}>
          <div className={styles.header}>
            <H3 className={styles.h3}>New Thread</H3>
          </div>
          {!currentChannel && (
            <Field>
              <NativeSelect
                id="new-thread-channel"
                label="Channel"
                options={channels.map((channel) => ({
                  label: channel.channelName,
                  value: channel.id,
                }))}
                icon={<FiHash />}
                theme="gray"
                value={channelId}
                onChange={(event: React.ChangeEvent<HTMLSelectElement>) =>
                  setChannelId(event.target.value)
                }
              />
            </Field>
          )}
          <Field>
            <TextInput
              id="new-thread-title"
              label="Title"
              value={title}
              onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
                setTitle(event.target.value)
              }
              onKeyUp={(event: React.KeyboardEvent<HTMLInputElement>) => {
                event.stopPropagation();
                event.preventDefault();
              }}
            />