Show user flags and the bot owner.

This commit is contained in:
Paul 2021-08-12 14:40:13 +01:00
parent 8137409dae
commit c27f596d40
4 changed files with 89 additions and 33 deletions

View file

@ -116,7 +116,7 @@
"react-virtuoso": "^1.10.4", "react-virtuoso": "^1.10.4",
"redux": "^4.1.0", "redux": "^4.1.0",
"revolt-api": "^0.5.2-alpha.0", "revolt-api": "^0.5.2-alpha.0",
"revolt.js": "5.0.1-alpha.0", "revolt.js": "5.0.1-alpha.1",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"sass": "^1.35.1", "sass": "^1.35.1",
"shade-blend-color": "^1.0.0", "shade-blend-color": "^1.0.0",

View file

@ -136,34 +136,34 @@
a { a {
min-width: 0; min-width: 0;
} }
}
.entry { .entry {
gap: 8px; gap: 8px;
min-width: 0;
padding: 12px;
display: flex;
cursor: pointer;
align-items: center;
transition: background-color 0.1s;
color: var(--secondary-foreground);
border-radius: var(--border-radius);
background-color: var(--secondary-background);
&:hover {
background-color: var(--primary-background);
}
img {
width: 32px;
height: 32px;
border-radius: 50%;
}
span {
min-width: 0; min-width: 0;
padding: 12px; overflow: hidden;
display: flex; white-space: nowrap;
cursor: pointer; text-overflow: ellipsis;
align-items: center;
transition: background-color 0.1s;
color: var(--secondary-foreground);
border-radius: var(--border-radius);
background-color: var(--secondary-background);
&:hover {
background-color: var(--primary-background);
}
img {
width: 32px;
height: 32px;
border-radius: 50%;
}
span {
min-width: 0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
} }
} }

View file

@ -13,9 +13,11 @@ import { useContext, useEffect, useLayoutEffect, useState } from "preact/hooks";
import ChannelIcon from "../../../components/common/ChannelIcon"; import ChannelIcon from "../../../components/common/ChannelIcon";
import Tooltip from "../../../components/common/Tooltip"; import Tooltip from "../../../components/common/Tooltip";
import UserIcon from "../../../components/common/user/UserIcon"; import UserIcon from "../../../components/common/user/UserIcon";
import { Username } from "../../../components/common/user/UserShort";
import UserStatus from "../../../components/common/user/UserStatus"; import UserStatus from "../../../components/common/user/UserStatus";
import IconButton from "../../../components/ui/IconButton"; import IconButton from "../../../components/ui/IconButton";
import Modal from "../../../components/ui/Modal"; import Modal from "../../../components/ui/Modal";
import Overline from "../../../components/ui/Overline";
import Preloader from "../../../components/ui/Preloader"; import Preloader from "../../../components/ui/Preloader";
import Markdown from "../../../components/markdown/Markdown"; import Markdown from "../../../components/markdown/Markdown";
@ -112,7 +114,9 @@ export const UserProfile = observer(
const backgroundURL = const backgroundURL =
profile && profile &&
client.generateFileURL(profile.background, { width: 1000 }, true); client.generateFileURL(profile.background, { width: 1000 }, true);
const badges = user.badges ?? 0; const badges = user.badges ?? 0;
const flags = user.flags ?? 0;
return ( return (
<Modal <Modal
@ -218,11 +222,63 @@ export const UserProfile = observer(
<div className={styles.content}> <div className={styles.content}>
{tab === "profile" && ( {tab === "profile" && (
<div> <div>
{!(profile?.content || badges > 0) && ( {!(
profile?.content ||
badges > 0 ||
flags > 0 ||
user.bot
) && (
<div className={styles.empty}> <div className={styles.empty}>
<Text id="app.special.popovers.user_profile.empty" /> <Text id="app.special.popovers.user_profile.empty" />
</div> </div>
)} )}
{flags & 1 ? (
/** ! FIXME: i18n this area */
<Overline type="error" block>
User is suspended
</Overline>
) : undefined}
{flags & 2 ? (
<Overline type="error" block>
User deleted their account
</Overline>
) : undefined}
{flags & 4 ? (
<Overline type="error" block>
User is banned
</Overline>
) : undefined}
{user.bot ? (
<>
<div className={styles.category}>
bot owner
</div>
<div
onClick={() =>
user.bot &&
openScreen({
id: "profile",
user_id: user.bot.owner,
})
}
className={styles.entry}
key={user.bot.owner}>
<UserIcon
size={32}
target={client.users.get(
user.bot.owner,
)}
/>
<span>
<Username
user={client.users.get(
user.bot.owner,
)}
/>
</span>
</div>
</>
) : undefined}
{badges > 0 && ( {badges > 0 && (
<div className={styles.category}> <div className={styles.category}>
<Text id="app.special.popovers.user_profile.sub.badges" /> <Text id="app.special.popovers.user_profile.sub.badges" />

View file

@ -3605,10 +3605,10 @@ revolt-api@^0.5.2-alpha.0:
resolved "https://registry.yarnpkg.com/revolt-api/-/revolt-api-0.5.2-alpha.0.tgz#a41f44ee38622636c9b5b5843f9e2798a79f00d3" resolved "https://registry.yarnpkg.com/revolt-api/-/revolt-api-0.5.2-alpha.0.tgz#a41f44ee38622636c9b5b5843f9e2798a79f00d3"
integrity sha512-VI/o4nQTPXrDCVdFpZFfZfj7Q4nunj62gftdmYJtuSmXx+6eN2Nve7QQZjNt6UIH6Dc/IDgiFDcBdafBF9YXug== integrity sha512-VI/o4nQTPXrDCVdFpZFfZfj7Q4nunj62gftdmYJtuSmXx+6eN2Nve7QQZjNt6UIH6Dc/IDgiFDcBdafBF9YXug==
revolt.js@5.0.1-alpha.0: revolt.js@5.0.1-alpha.1:
version "5.0.1-alpha.0" version "5.0.1-alpha.1"
resolved "https://registry.yarnpkg.com/revolt.js/-/revolt.js-5.0.1-alpha.0.tgz#3c79313ffe595ba5a4881692d5f3d2f5f6237bdb" resolved "https://registry.yarnpkg.com/revolt.js/-/revolt.js-5.0.1-alpha.1.tgz#9af021d05d3cd098d0383c64e1fe10c70f2fb07a"
integrity sha512-fdYQgYA/aSx7JZn7yAwqb/8hix+nI/AErt6oAkb412qAyTFxHD7LHeUWofRMJ+I0rAreQUYUwtC5FJH82S58pQ== integrity sha512-QIbnR25ICey8iopMzu0FBueo7gd0ddZQVoyyC++jg4Rvt0zlcAHJfx/YTapZxzTFo0/u/YEgD68GuTh8ybmFdg==
dependencies: dependencies:
axios "^0.19.2" axios "^0.19.2"
eventemitter3 "^4.0.7" eventemitter3 "^4.0.7"