Function NewChannelModal

apps/web/ui/NewChannelModal/index.tsx:32–184

({
  permissions,
  show,
  close,
  api,
  CustomRouterPush,
}: Props)

}

export default function NewChannelModal({
  permissions,
  show,
  close,
  api,
  CustomRouterPush,
}: Props) {
  const [loading, setLoading] = useState(false);
  const [channelPrivate, setChannelPrivate] = useState(false);
  const [viewType, setViewType] = useState<ChannelViewType>(
    ChannelViewType.CHAT
  );
  const [users, setUsers] = useState<SerializedUser[]>(
    permissions.user ? [permissions.user] : []
  );

  async function onSubmit(e: any) {
    setLoading(true);
    try {
      e.preventDefault();
      const form = e.target;
      const channelName = form.channelName.value;

      if (channelPrivate) {
        await api.createChannel({
          accountId: permissions.accountId!,
          channelName,
          channelPrivate: true,
          viewType,
          usersId: users.map((u) => u.id),
        });
      } else {
        await api.createChannel({
          accountId: permissions.accountId!,
          channelName,
          viewType,
        });
      }

      close();
      CustomRouterPush({
        path: `/c/${channelName}`,
      });
    } catch (error) {
      Toast.error('Something went wrong');
    } finally {
      setLoading(false);
    }
  }

  function onPrivateToggle(checked: boolean) {
    setChannelPrivate(checked);
  }

  function removeUser(user: SerializedUser) {
    setUsers((users) => users.filter((u) => u.id !== user.id));
  }