Merge remote-tracking branch 'origin/main' into missing-description-confirmation

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

src/components/upload.tsx

@@ -10,14 +10,14 @@ import zoomInIcon from '@tabler/icons/outline/zoom-in.svg';
 import clsx from 'clsx';
 import { List as ImmutableList } from 'immutable';
 import React, { useState } from 'react';
-import { FormattedMessage, defineMessages, useIntl } from 'react-intl';
+import { defineMessages, useIntl } from 'react-intl';
 import { spring } from 'react-motion';
 
 import { openModal } from 'soapbox/actions/modals';
 import Blurhash from 'soapbox/components/blurhash';
 import { HStack, Icon, IconButton } from 'soapbox/components/ui';
 import Motion from 'soapbox/features/ui/util/optional-motion';
-import { useAppDispatch, useSettings } from 'soapbox/hooks';
+import { useAppDispatch } from 'soapbox/hooks';
 import { Attachment } from 'soapbox/types/entities';
 
 export const MIMETYPE_ICONS: Record<string, string> = {
@@ -55,7 +55,6 @@ export const MIMETYPE_ICONS: Record<string, string> = {
 };
 
 const messages = defineMessages({
-  altWarning: { id: 'upload_form.alt_warning', defaultMessage: 'This attachment doesn\'t have a description' },
   description: { id: 'upload_form.description', defaultMessage: 'Describe for the visually impaired' },
   delete: { id: 'upload_form.undo', defaultMessage: 'Delete' },
   preview: { id: 'upload_form.preview', defaultMessage: 'Preview' },
@@ -81,8 +80,6 @@ const Upload: React.FC<IUpload> = ({
   const intl = useIntl();
   const dispatch = useAppDispatch();
 
-  const { missingDescriptionModal } = useSettings();
-
   const [hovered, setHovered] = useState(false);
   const [focused, setFocused] = useState(false);
   const [dirtyDescription, setDirtyDescription] = useState<string | null>(null);
@@ -203,19 +200,6 @@ const Upload: React.FC<IUpload> = ({
               </div>
             )}
 
-            {missingDescriptionModal && !description && (
-              <span
-                title={intl.formatMessage(messages.altWarning)}
-                className={clsx('absolute bottom-2 left-2 z-10 inline-flex items-center gap-1 rounded bg-gray-900 px-2 py-1 text-xs font-medium uppercase text-white transition-opacity duration-100 ease-linear', {
-                  'opacity-0 pointer-events-none': active,
-                  'opacity-100': !active,
-                })}
-              >
-                <Icon className='h-4 w-4' src={require('@tabler/icons/outline/alert-triangle.svg')} />
-                <FormattedMessage id='upload_form.alt_label' defaultMessage='Alt' />
-              </span>
-            )}
-
             <div className='compose-form__upload-preview'>
               {mediaType === 'video' && (
                 <video autoPlay playsInline muted loop>

src/containers/account-container.tsx

@@ -12,7 +12,7 @@ const AccountContainer: React.FC<IAccountContainer> = ({ id, withRelationship, .
   const { account } = useAccount(id, { withRelationship });
 
   return (
-    <Account account={account!} {...props} />
+    <Account account={account!} withRelationship={withRelationship} {...props} />
   );
 };
 

src/features/compose/editor/nodes/emoji-node.tsx

@@ -81,7 +81,7 @@ class EmojiNode extends DecoratorNode<JSX.Element> {
   decorate(): JSX.Element {
     const emoji = this.__emoji;
     if (isNativeEmoji(emoji)) {
-      return  <Component emoji={emoji.native} alt={emoji.colons} className='emojione h-4 w-4' />;
+      return <Component emoji={emoji.native} alt={emoji.colons} className='emojione h-4 w-4' />;
     } else {
       return <Component src={emoji.imageUrl} alt={emoji.colons} className='emojione h-4 w-4' />;
     }

src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx

@@ -1,11 +1,10 @@
 import React from 'react';
-import { defineMessages, useIntl } from 'react-intl';
+import { FormattedMessage, defineMessages, useIntl } from 'react-intl';
 
 import { openModal } from 'soapbox/actions/modals';
 import { cancelScheduledStatus } from 'soapbox/actions/scheduled-statuses';
 import { getSettings } from 'soapbox/actions/settings';
-import IconButton from 'soapbox/components/icon-button';
-import { HStack } from 'soapbox/components/ui';
+import { Button, HStack } from 'soapbox/components/ui';
 import { useAppDispatch } from 'soapbox/hooks';
 
 import type { Status as StatusEntity } from 'soapbox/types/entities';
@@ -46,12 +45,9 @@ const ScheduledStatusActionBar: React.FC<IScheduledStatusActionBar> = ({ status
 
   return (
     <HStack justifyContent='end'>
-      <IconButton
-        title={intl.formatMessage(messages.cancel)}
-        text={intl.formatMessage(messages.cancel)}
-        src={require('@tabler/icons/outline/x.svg')}
-        onClick={handleCancelClick}
-      />
+      <Button theme='danger' size='sm' onClick={handleCancelClick}>
+        <FormattedMessage id='scheduled_status.cancel' defaultMessage='Cancel' />
+      </Button>
     </HStack>
   );
 };

src/features/scheduled-statuses/components/scheduled-status.tsx

@@ -5,7 +5,7 @@ import Account from 'soapbox/components/account';
 import AttachmentThumbs from 'soapbox/components/attachment-thumbs';
 import StatusContent from 'soapbox/components/status-content';
 import StatusReplyMentions from 'soapbox/components/status-reply-mentions';
-import { HStack } from 'soapbox/components/ui';
+import { HStack, Stack } from 'soapbox/components/ui';
 import PollPreview from 'soapbox/features/ui/components/poll-preview';
 import { useAppSelector } from 'soapbox/hooks';
 
@@ -40,28 +40,28 @@ const ScheduledStatus: React.FC<IScheduledStatus> = ({ statusId, ...other }) =>
               account={account}
               timestamp={status.created_at}
               futureTimestamp
-              hideActions
+              action={<ScheduledStatusActionBar status={status} {...other} />}
             />
           </HStack>
         </div>
 
         <StatusReplyMentions status={status} />
 
-        <StatusContent
-          status={status}
-          collapsable
-        />
-
-        {status.media_attachments.size > 0 && (
-          <AttachmentThumbs
-            media={status.media_attachments}
-            sensitive={status.sensitive}
+        <Stack space={4}>
+          <StatusContent
+            status={status}
+            collapsable
           />
-        )}
 
-        {status.poll && <PollPreview pollId={status.poll as string} />}
+          {status.media_attachments.size > 0 && (
+            <AttachmentThumbs
+              media={status.media_attachments}
+              sensitive={status.sensitive}
+            />
+          )}
 
-        <ScheduledStatusActionBar status={status} {...other} />
+          {status.poll && <PollPreview pollId={status.poll as string} />}
+        </Stack>
       </div>
     </div>
   );

src/features/scheduled-statuses/index.tsx

@@ -39,6 +39,7 @@ const ScheduledStatuses = () => {
         isLoading={typeof isLoading === 'boolean' ? isLoading : true}
         onLoadMore={() => handleLoadMore(dispatch)}
         emptyMessage={emptyMessage}
+        listClassName='divide-y divide-solid divide-gray-200 dark:divide-gray-800'
       >
         {statusIds.map((id: string) => <ScheduledStatus key={id} statusId={id} />)}
       </ScrollableList>

src/features/ui/components/pending-status.tsx

@@ -60,7 +60,10 @@ const PendingStatus: React.FC<IPendingStatus> = ({ idempotencyKey, className, mu
     <div className={clsx('opacity-50', className)}>
       <div className={clsx('status', { 'status-reply': !!status.in_reply_to_id, muted })} data-id={status.id}>
         <Card
-          className={clsx('py-6 sm:p-5', `status-${status.visibility}`, { 'status-reply': !!status.in_reply_to_id })}
+          className={clsx(`status-${status.visibility}`, {
+            'py-6 sm:p-5': !thread,
+            'status-reply': !!status.in_reply_to_id,
+          })}
           variant={thread ? 'default' : 'rounded'}
         >
           <div className='mb-4'>

src/locales/en.json

@@ -1590,8 +1590,6 @@
   "upload_error.poll": "File upload not allowed with polls.",
   "upload_error.video_duration_limit": "Video exceeds the current duration limit ({limit, plural, one {# second} other {# seconds}})",
   "upload_error.video_size_limit": "Video exceeds the current file size limit ({limit})",
-  "upload_form.alt_label": "Alt",
-  "upload_form.alt_warning": "This attachment doesn't have a description",
   "upload_form.description": "Describe for the visually impaired",
   "upload_form.preview": "Preview",
   "upload_form.undo": "Delete",