fixup! Handle non-verifed users on the front

This commit is contained in:
Zoe Roux 2024-03-09 15:50:30 +01:00
parent 8f7320c298
commit 08c7ca99b6

View File

@ -30,6 +30,7 @@ import { SettingsContainer } from "../settings/base";
import UserI from "@material-symbols/svg-400/rounded/account_circle.svg"; import UserI from "@material-symbols/svg-400/rounded/account_circle.svg";
import Delete from "@material-symbols/svg-400/rounded/delete.svg"; import Delete from "@material-symbols/svg-400/rounded/delete.svg";
import MoreVert from "@material-symbols/svg-400/rounded/more_vert.svg"; import MoreVert from "@material-symbols/svg-400/rounded/more_vert.svg";
import Verifed from "@material-symbols/svg-400/rounded/verified_user.svg";
import Unverifed from "@material-symbols/svg-400/rounded/gpp_bad.svg"; import Unverifed from "@material-symbols/svg-400/rounded/gpp_bad.svg";
import Admin from "@material-symbols/svg-400/rounded/shield_person.svg"; import Admin from "@material-symbols/svg-400/rounded/shield_person.svg";
import { useMutation, useQueryClient } from "@tanstack/react-query"; import { useMutation, useQueryClient } from "@tanstack/react-query";
@ -40,14 +41,14 @@ export const UserGrid = ({
username, username,
avatar, avatar,
isAdmin, isAdmin,
isVerifed, isVerified,
...props ...props
}: WithLoading<{ }: WithLoading<{
id: string; id: string;
username: string; username: string;
avatar: string; avatar: string;
isAdmin: boolean; isAdmin: boolean;
isVerifed: boolean; isVerified: boolean;
}>) => { }>) => {
const { css } = useYoshiki(); const { css } = useYoshiki();
const { t } = useTranslation(); const { t } = useTranslation();
@ -67,14 +68,14 @@ export const UserGrid = ({
<Avatar src={avatar} alt={username} placeholder={username} size={UserGrid.layout.size} fill /> <Avatar src={avatar} alt={username} placeholder={username} size={UserGrid.layout.size} fill />
<View {...css({ flexDirection: "row" })}> <View {...css({ flexDirection: "row" })}>
<Icon <Icon
icon={isVerifed ? Unverifed : isAdmin ? Admin : UserI} icon={!isVerified ? Unverifed : isAdmin ? Admin : UserI}
{...css({ {...css({
alignSelf: "center", alignSelf: "center",
m: ts(1), m: ts(1),
})} })}
{...tooltip( {...tooltip(
t( t(
isVerifed !isVerified
? "admin.users.unverifed" ? "admin.users.unverifed"
: isAdmin : isAdmin
? "admin.users.adminUser" ? "admin.users.adminUser"
@ -86,9 +87,10 @@ export const UserGrid = ({
<P>{username}</P> <P>{username}</P>
</Skeleton> </Skeleton>
<Menu Trigger={IconButton} icon={MoreVert} {...tooltip(t("misc.more"))}> <Menu Trigger={IconButton} icon={MoreVert} {...tooltip(t("misc.more"))}>
{!isVerifed && ( {!isVerified && (
<Menu.Item <Menu.Item
label={t("admin.users.verify")} label={t("admin.users.verify")}
icon={Verifed}
onSelect={() => onSelect={() =>
mutateAsync({ mutateAsync({
permissions: ["overall.read", "overall.play"], permissions: ["overall.read", "overall.play"],
@ -177,7 +179,7 @@ export const UserList = () => {
username={user.username} username={user.username}
avatar={user.logo} avatar={user.logo}
isAdmin={user.permissions?.includes("admin.write")} isAdmin={user.permissions?.includes("admin.write")}
isVerified={user.permissions?.length == 0} isVerified={user.permissions && user.permissions.length > 0}
/> />
)} )}
</InfiniteFetch> </InfiniteFetch>