Page MenuHomePhabricator

D10348.diff
No OneTemporary

D10348.diff

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
@@ -30,18 +30,17 @@
threadMenu = <ThreadMenu threadInfo={threadInfo} />;
}
- const bannerText = threadInfo.pinnedCount
- ? pinnedMessageCountText(threadInfo.pinnedCount)
- : '';
+ const bannerText =
+ !!threadInfo.pinnedCount && pinnedMessageCountText(threadInfo.pinnedCount);
const inputState = React.useContext(InputStateContext);
const pushThreadPinsModal = React.useCallback(() => {
pushModal(
<InputStateContext.Provider value={inputState}>
- <PinnedMessagesModal threadInfo={threadInfo} modalName={bannerText} />
+ <PinnedMessagesModal threadInfo={threadInfo} />
</InputStateContext.Provider>,
);
- }, [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
@@ -26,3 +26,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 (
+ <div className={css.noPinnedMessages}>
+ No pinned messages in this thread.
+ </div>
+ );
+ }
+
const items = modifiedItems.map(item => (
<MessageResult
key={item.messageInfo.id}
@@ -148,6 +156,8 @@
return null;
}, [loadingStatus]);
+ const modalName = pinnedMessageCountText(modifiedItems.length);
+
return (
<Modal name={modalName} onClose={popModal} size="large">
<hr className={css.separator} />

File Metadata

Mime Type
text/plain
Expires
Sat, Dec 21, 6:55 PM (20 h, 55 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2688762
Default Alt Text
D10348.diff (3 KB)

Event Timeline