diff --git a/web/chat/thread-top-bar.react.js b/web/chat/thread-top-bar.react.js
--- a/web/chat/thread-top-bar.react.js
+++ b/web/chat/thread-top-bar.react.js
@@ -37,10 +37,10 @@
const pushThreadPinsModal = React.useCallback(() => {
pushModal(
-
+
,
);
- }, [pushModal, inputState, threadInfo, bannerText]);
+ }, [pushModal, inputState, threadInfo]);
const pinnedCountBanner = React.useMemo(() => {
if (!bannerText) {
diff --git a/web/modals/chat/pinned-messages-modal.css b/web/modals/chat/pinned-messages-modal.css
--- a/web/modals/chat/pinned-messages-modal.css
+++ b/web/modals/chat/pinned-messages-modal.css
@@ -28,3 +28,10 @@
justify-content: center;
display: flex;
}
+
+.noPinnedMessages {
+ color: var(--text-background-tertiary-default);
+ display: flex;
+ flex: 1;
+ justify-content: center;
+}
diff --git a/web/modals/chat/pinned-messages-modal.react.js b/web/modals/chat/pinned-messages-modal.react.js
--- a/web/modals/chat/pinned-messages-modal.react.js
+++ b/web/modals/chat/pinned-messages-modal.react.js
@@ -20,6 +20,7 @@
import type { RawMessageInfo } from 'lib/types/message-types.js';
import { type ThreadInfo } from 'lib/types/thread-types.js';
import { useDispatchActionPromise } from 'lib/utils/action-utils.js';
+import { pinnedMessageCountText } from 'lib/utils/message-pinning-utils.js';
import css from './pinned-messages-modal.css';
import MessageResult from '../../components/message-result.react.js';
@@ -29,7 +30,6 @@
type Props = {
+threadInfo: ThreadInfo,
- +modalName: string,
};
const loadingStatusSelector = createLoadingStatusSelector(
@@ -37,7 +37,7 @@
);
function PinnedMessagesModal(props: Props): React.Node {
- const { threadInfo, modalName } = props;
+ const { threadInfo } = props;
const { id: threadID } = threadInfo;
const { popModal } = useModalContext();
const [rawMessageResults, setRawMessageResults] = React.useState<
@@ -126,6 +126,14 @@
);
const messageResultsToDisplay = React.useMemo(() => {
+ if (modifiedItems.length === 0) {
+ return (
+
+ No pinned messages in this thread.
+
+ );
+ }
+
const items = modifiedItems.map(item => (
, []);
return (