Add 'create event' button to profile dropdown for now

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>

app/soapbox/components/ui/textarea/textarea.tsx

@@ -1,7 +1,7 @@
 import classNames from 'clsx';
 import React from 'react';
 
-interface ITextarea extends Pick<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'maxLength' | 'onChange' | 'required' | 'disabled' | 'rows' | 'readOnly'> {
+interface ITextarea extends Pick<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'maxLength' | 'onChange' | 'onKeyDown' | 'required' | 'disabled' | 'rows' | 'readOnly'> {
   /** Put the cursor into the input on mount. */
   autoFocus?: boolean,
   /** The initial text in the input. */

app/soapbox/features/account/components/header.tsx

@@ -66,6 +66,7 @@ const messages = defineMessages({
   removeFromFollowersConfirm: { id: 'confirmations.remove_from_followers.confirm', defaultMessage: 'Remove' },
   userEndorsed: { id: 'account.endorse.success', defaultMessage: 'You are now featuring @{acct} on your profile' },
   userUnendorsed: { id: 'account.unendorse.success', defaultMessage: 'You are no longer featuring @{acct}' },
+  composeEvent: { od: 'navigation.compose_event', defaultMessage: 'Create new event' },
 });
 
 interface IHeader {
@@ -207,6 +208,10 @@ const Header: React.FC<IHeader> = ({ account }) => {
     history.push('/search');
   };
 
+  const onComposeEvent = () => {
+    dispatch(openModal('COMPOSE_EVENT'));
+  };
+
   const onAvatarClick = () => {
     const avatar = normalizeAttachment({
       type: 'image',
@@ -291,6 +296,13 @@ const Header: React.FC<IHeader> = ({ account }) => {
         to: '/blocks',
         icon: require('@tabler/icons/ban.svg'),
       });
+      if (features.events) {
+        menu.push({
+          text: intl.formatMessage(messages.composeEvent),
+          action: onComposeEvent,
+          icon: require('@tabler/icons/calendar.svg'),
+        });
+      }
     } else {
       menu.push({
         text: intl.formatMessage(messages.mention, { name: account.username }),

app/soapbox/features/ui/components/modals/join-event-modal.tsx

@@ -3,10 +3,11 @@ import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
 
 import { joinEvent } from 'soapbox/actions/events';
 import { closeModal } from 'soapbox/actions/modals';
-import { Modal, Text } from 'soapbox/components/ui';
+import { FormGroup, Modal, Textarea } from 'soapbox/components/ui';
 import { useAppDispatch } from 'soapbox/hooks';
 
 const messages = defineMessages({
+  hint: { id: 'join_event.hint', defaultMessage: 'You can tell the organizer why do you want to participate in this event:' },
   placeholder: { id: 'join_event.placeholder', defaultMessage: 'Message to organizer' },
   join: { id: 'join_event.join', defaultMessage: 'Request join' },
 });
@@ -51,12 +52,8 @@ const AccountNoteModal: React.FC<IAccountNoteModal> = ({ statusId }) => {
       confirmationText={intl.formatMessage(messages.join)}
       confirmationDisabled={isSubmitting}
     >
-      <Text theme='muted'>
-        <FormattedMessage id='join_event.hint' defaultMessage='You can tell the organizer why do you want to participate in this event:' />
-      </Text>
-
-      <textarea
-        className='setting-text light'
+      <FormGroup labelText={intl.formatMessage(messages.hint)}>
+        <Textarea
           placeholder={intl.formatMessage(messages.placeholder)}
           value={participationMessage}
           onChange={handleChange}
@@ -64,6 +61,7 @@ const AccountNoteModal: React.FC<IAccountNoteModal> = ({ statusId }) => {
           disabled={isSubmitting}
           autoFocus
         />
+      </FormGroup>
     </Modal>
   );
 };

app/soapbox/features/ui/components/modals/report-modal/report-modal.tsx

@@ -20,8 +20,6 @@ const messages = defineMessages({
   blankslate: { id: 'report.reason.blankslate', defaultMessage: 'You have removed all statuses from being selected.' },
   done: { id: 'report.done', defaultMessage: 'Done' },
   next: { id: 'report.next', defaultMessage: 'Next' },
-  close: { id: 'lightbox.close', defaultMessage: 'Close' },
-  placeholder: { id: 'report.placeholder', defaultMessage: 'Additional comments' },
   submit: { id: 'report.submit', defaultMessage: 'Submit' },
 });
 

app/soapbox/utils/features.ts

@@ -279,6 +279,8 @@ const getInstanceFeatures = (instance: Instance) => {
      */
     ethereumLogin: v.software === MITRA,
 
+    events: v.software === PLEROMA && v.build === SOAPBOX && gte(v.version, '2.4.50'),
+
     /**
      * Ability to address recipients of a status explicitly (with `to`).
      * @see POST /api/v1/statuses