Skip to content
Snippets Groups Projects
Commit 71bc4383 authored by nizune's avatar nizune
Browse files

Fix: small fixes for members sidebar

parent ff21d4ef
Branches
No related merge requests found
Subproject commit 588b882a3acca644c2f65b67cd341c88fd97989d
Subproject commit 4ef73335436f3118d660cec24ff7972d3ccd5984
......@@ -64,7 +64,7 @@ const Blocked = styled.div`
svg {
flex-shrink: 0;
margin-inline-end: 8px;
margin-inline-end: 10px;
}
`;
......
......@@ -17,11 +17,15 @@
color: var(--tertiary-foreground);
&.normal {
height: 38px;
height: 42px;
}
&.compact {
height: 32px;
&[data-mobile="true"] { // TOFIX: make sure this works on mobile
height: 50px;
}
}
&.user {
......@@ -65,6 +69,7 @@
}
&.avatar {
display: flex;
flex-shrink: 0;
}
......
import styles from './Panes.module.scss';
import { useEffect, useState } from "preact/hooks";
import { Servers } from "revolt.js/dist/api/objects";
import Checkbox from "../../../components/ui/Checkbox";
import Tip from "../../../components/ui/Tip";
import UserIcon from "../../../components/common/user/UserIcon";
import { useForceUpdate, useUsers } from "../../../context/revoltjs/hooks";
interface Props {
......@@ -21,37 +21,15 @@ export function Members({ server }: Props) {
}, [ ]);
return (
<div>
<Tip warning>This section is under construction.</Tip>
{ members && members.length > 0 && users?.map(x => x && <div>
<br/>
<br/>
<br/>
<span>@{x.username}</span>
{ server.roles && Object.keys(server.roles).map(id => {
let role = server.roles?.[id]!;
let member = members.find(y => x._id === y._id.user)!;
return (
<Checkbox checked={member.roles?.includes(id) ?? false} onChange={selected => {
let roles = (member.roles ?? []).filter(z => z !== id);
if (selected) roles.push(id);
ctx.client.servers.members.editMember(server._id, x._id, { roles });
setMembers(
[
...members.filter(e => e._id.user !== x._id),
{
...member,
roles
}
]
);
}}>{ role.name }</Checkbox>
)
}) }
</div>) }
<div className={styles.members}>
<div className={styles.subtitle}>
X Members
</div>
{ members && members.length > 0 && users?.map(x => x &&
<div className={styles.member}>
<div>@{x.username}</div>
</div>)
}
</div>
);
}
......@@ -55,3 +55,24 @@
}
}
}
.members {
.subtitle {
display: flex;
justify-content: space-between;
font-size: 13px;
text-transform: uppercase;
color: var(--secondary-foreground);
font-weight: 700;
}
.member {
gap: 8px;
padding: 10px;
display: flex;
align-items: center;
flex-direction: row;
background: var(--secondary-background);
}
}
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment