martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-02-15 04:59:16 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

prevent flicker of message placeholder

Browse Source
This commit is contained in:
Roland Osborne 2022-12-20 16:12:22 -08:00
parent 2a7d1423e2
commit b0c97b86f5
2 changed files with 14 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
net/web/src/session/conversation/Conversation.jsx
View File

@ -69,7 +69,7 @@ export function Conversation({ closeConversation, openDetails, cardId, channelId
)} )}
</div> </div>
<div class="thread" ref={thread} onScroll={scrollThread}> <div class="thread" ref={thread} onScroll={scrollThread}>
{ state.topics.length === 0 && ( { state.delayed && state.topics.length === 0 && (
<div class="empty">This Topic Has No Messages</div> <div class="empty">This Topic Has No Messages</div>
)} )}
{ state.topics.length !== 0 && ( { state.topics.length !== 0 && (

14
net/web/src/session/conversation/useConversation.hook.js
View File

@ -24,6 +24,7 @@ export function useConversation(cardId, channelId) {
error: false, error: false,
sealed: false, sealed: false,
sealKey: null, sealKey: null,
delayed: false,
}); });
const account = useContext(AccountContext); const account = useContext(AccountContext);
@ -90,7 +91,10 @@ export function useConversation(cardId, channelId) {
}, [cardId, channelId, upload]); }, [cardId, channelId, upload]);
useEffect(() => { useEffect(() => {
updateState({ topics: [] }); updateState({ delayed: false, topics: [] });
setTimeout(() => {
updateState({ delayed: true });
}, 250);
conversation.actions.setConversationId(cardId, channelId); conversation.actions.setConversationId(cardId, channelId);
// eslint-disable-next-line // eslint-disable-next-line
}, [cardId, channelId]); }, [cardId, channelId]);
@ -107,6 +111,14 @@ export function useConversation(cardId, channelId) {
} }
return 1; return 1;
}); });
if (topics.length) {
updateState({ delayed: false });
}
else {
setTimeout(() => {
updateState({ delayed: true });
}, 250);
}
const { error, loadingInit, loadingMore, subject, logoUrl, logoImg } = conversation.state; const { error, loadingInit, loadingMore, subject, logoUrl, logoImg } = conversation.state;
updateState({ topics, error, loadingInit, loadingMore, subject, logoUrl, logoImg }); updateState({ topics, error, loadingInit, loadingMore, subject, logoUrl, logoImg });
store.actions.setValue(`${channelId}::${cardId}`, Number(conversation.state.revision)); store.actions.setValue(`${channelId}::${cardId}`, Number(conversation.state.revision));