UI fixes group (#186)
* Scrolling input for group creation * Add group description * Adding members ro existing group
This commit is contained in:
parent
39a02cc0ed
commit
15f64df575
|
@ -48,6 +48,7 @@ export function ChatCreation({
|
|||
}
|
||||
});
|
||||
setQuery("");
|
||||
if (activeChannel) addMembers(styledGroup, activeChannel.id);
|
||||
},
|
||||
[setStyledGroup, styledGroup]
|
||||
);
|
||||
|
@ -86,9 +87,9 @@ export function ChatCreation({
|
|||
className="narrow"
|
||||
/>
|
||||
)}
|
||||
<InputBar>
|
||||
<InputBar className={`${narrow && "narrow"}`}>
|
||||
<InputText>To:</InputText>
|
||||
<StyledList>
|
||||
<StyledList className={`${narrow && "narrow"}`}>
|
||||
{styledGroup.map((member) => (
|
||||
<StyledMember key={member}>
|
||||
<StyledName>{member.slice(0, 10)}</StyledName>
|
||||
|
@ -182,6 +183,10 @@ const InputBar = styled.div`
|
|||
margin-right: 16px;
|
||||
|
||||
${textMediumStyles}
|
||||
|
||||
&.narrow {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
`;
|
||||
|
||||
const Input = styled.input`
|
||||
|
@ -216,6 +221,14 @@ const CreationBtn = styled.button`
|
|||
|
||||
const StyledList = styled.div`
|
||||
display: flex;
|
||||
|
||||
&.narrow {
|
||||
overflow-x: scroll;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledMember = styled.div`
|
||||
|
|
|
@ -40,6 +40,7 @@ export function useGroupChats(
|
|||
id: chat.chatId,
|
||||
name: chat.name ?? chat.chatId,
|
||||
type: "group",
|
||||
description: `${chat.members.length} members`,
|
||||
members: members,
|
||||
};
|
||||
setChannels((prev) => {
|
||||
|
|
Loading…
Reference in New Issue