hiding x overflow on topic message

This commit is contained in:
Roland Osborne 2022-10-27 21:24:00 -07:00
parent 4fdba26371
commit a72389b1a8
2 changed files with 18 additions and 3 deletions

View File

@ -59,8 +59,13 @@ export function Conversation({ closeConversation, openDetails, cardId, channelId
)} )}
</div> </div>
<div class="thread" ref={thread} onScroll={scrollThread}> <div class="thread" ref={thread} onScroll={scrollThread}>
<List local={{ emptyText: '' }} itemLayout="horizontal" dataSource={state.topics} gutter="0" { state.topics.length === 0 && (
renderItem={topicRenderer} /> <div class="empty">This Topic Has No Messages</div>
)}
{ state.topics.length !== 0 && (
<List local={{ emptyText: '' }} itemLayout="horizontal" dataSource={state.topics}
gutter="0" renderItem={topicRenderer} />
)}
{ state.loadingInit && ( { state.loadingInit && (
<div class="loading"> <div class="loading">
<Spin size="large" delay={250} /> <Spin size="large" delay={250} />

View File

@ -54,10 +54,20 @@ export const ConversationWrapper = styled.div`
position: relative; position: relative;
flex-grow: 1; flex-grow: 1;
min-height: 0; min-height: 0;
overflow: auto; overflow-x: hidden;
overflow-y: auto;
display: flex; display: flex;
flex-direction: column-reverse; flex-direction: column-reverse;
.empty {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: 20;
color: ${Colors.grey};
}
.loading { .loading {
position: absolute; position: absolute;
width: 100%; width: 100%;