diff --git a/app/soapbox/features/ui/components/modals/birthdays-modal.tsx b/app/soapbox/features/ui/components/modals/birthdays-modal.tsx
index 2eb9504eca..fa5fd36def 100644
--- a/app/soapbox/features/ui/components/modals/birthdays-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/birthdays-modal.tsx
@@ -28,6 +28,7 @@ const BirthdaysModal = ({ onClose }: IBirthdaysModal) => {
{accountIds.map(id =>
diff --git a/app/soapbox/features/ui/components/modals/event-participants-modal.tsx b/app/soapbox/features/ui/components/modals/event-participants-modal.tsx
index c975ea22c3..1bb6844e69 100644
--- a/app/soapbox/features/ui/components/modals/event-participants-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/event-participants-modal.tsx
@@ -2,7 +2,8 @@ import React, { useEffect } from 'react';
import { FormattedMessage } from 'react-intl';
import { fetchEventParticipations } from 'soapbox/actions/events';
-import { Modal, Spinner, Stack } from 'soapbox/components/ui';
+import ScrollableList from 'soapbox/components/scrollable-list';
+import { Modal, Spinner } from 'soapbox/components/ui';
import AccountContainer from 'soapbox/containers/account-container';
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
@@ -33,16 +34,19 @@ const EventParticipantsModal: React.FC = ({ onClose, st
if (!accountIds) {
body = ;
} else {
+ const emptyMessage = ;
+
body = (
-
- {accountIds.size > 0 ? (
- accountIds.map((id) =>
- ,
- )
- ) : (
-
+
+ {accountIds.map(id =>
+ ,
)}
-
+
);
}
diff --git a/app/soapbox/features/ui/components/modals/favourites-modal.tsx b/app/soapbox/features/ui/components/modals/favourites-modal.tsx
index 9e2b72a611..e8ec1db398 100644
--- a/app/soapbox/features/ui/components/modals/favourites-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/favourites-modal.tsx
@@ -2,7 +2,8 @@ import React, { useEffect } from 'react';
import { FormattedMessage } from 'react-intl';
import { fetchFavourites } from 'soapbox/actions/interactions';
-import { Modal, Spinner, Stack } from 'soapbox/components/ui';
+import ScrollableList from 'soapbox/components/scrollable-list';
+import { Modal, Spinner } from 'soapbox/components/ui';
import AccountContainer from 'soapbox/containers/account-container';
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
@@ -33,16 +34,19 @@ const FavouritesModal: React.FC = ({ onClose, statusId }) => {
if (!accountIds) {
body = ;
} else {
+ const emptyMessage = ;
+
body = (
-
- {accountIds.size > 0 ? (
- accountIds.map((id) =>
- ,
- )
- ) : (
-
+
+ {accountIds.map(id =>
+ ,
)}
-
+
);
}
diff --git a/app/soapbox/features/ui/components/modals/mentions-modal.tsx b/app/soapbox/features/ui/components/modals/mentions-modal.tsx
index 1df00fb085..d131687c2f 100644
--- a/app/soapbox/features/ui/components/modals/mentions-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/mentions-modal.tsx
@@ -41,6 +41,7 @@ const MentionsModal: React.FC = ({ onClose, statusId }) => {
body = (
{accountIds.map(id =>
diff --git a/app/soapbox/features/ui/components/modals/reactions-modal.tsx b/app/soapbox/features/ui/components/modals/reactions-modal.tsx
index 60c8bd1585..7afe96f866 100644
--- a/app/soapbox/features/ui/components/modals/reactions-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/reactions-modal.tsx
@@ -1,3 +1,4 @@
+import classNames from 'clsx';
import { List as ImmutableList } from 'immutable';
import React, { useEffect, useState } from 'react';
import { FormattedMessage, defineMessages, useIntl } from 'react-intl';
@@ -84,7 +85,9 @@ const ReactionsModal: React.FC = ({ onClose, statusId, reaction
0,
+ })}
itemClassName='pb-3'
>
{accounts.map((account) =>
diff --git a/app/soapbox/features/ui/components/modals/reblogs-modal.tsx b/app/soapbox/features/ui/components/modals/reblogs-modal.tsx
index 526e7507f9..6f5e7d70c4 100644
--- a/app/soapbox/features/ui/components/modals/reblogs-modal.tsx
+++ b/app/soapbox/features/ui/components/modals/reblogs-modal.tsx
@@ -41,6 +41,7 @@ const ReblogsModal: React.FC = ({ onClose, statusId }) => {
{accountIds.map((id) =>