cswimr/revite
1
0
Fork 0
mirror of https://github.com/revoltchat/revite.git synced 2024-12-04 21:00:58 -05:00
Code Issues Projects Releases Packages Wiki Activity

feat(profile): added statistics to bot profile

Browse source
This commit is contained in:
trashtemp 2021-12-21 17:03:51 +01:00
parent 8eabc47915
commit 4889830c06
No known key found for this signature in database
GPG key ID: D1F0DB65081B0FC6
2 changed files with 101 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
src/context/intermediate/popovers/UserProfile.module.scss
View file

@ -123,6 +123,29 @@
} }
} }
.botStats {
background: var(--secondary-background);
border-radius: var(--border-radius);
padding: 10px;
font-size: 12px;
.stat {
display: flex;
align-items: center;
gap: 5px;
opacity: 0.5;
&:nth-child(1) {
opacity: 1;
> svg {
color: var(--accent);
}
}
}
}
> div { > div {
> span { > span {
font-size: 15px; font-size: 15px;
@ -152,6 +175,10 @@
border-radius: var(--border-radius); border-radius: var(--border-radius);
background-color: var(--secondary-background); background-color: var(--secondary-background);
.info {
flex-grow: 1;
}
&:hover { &:hover {
background-color: var(--primary-background); background-color: var(--primary-background);
} }
@ -167,5 +194,19 @@
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
font-size: 14px;
}
}
.botContainer {
display: flex;
flex-direction: column;
gap: 8px;
margin-bottom: 18px;
.owner {
text-transform: uppercase;
font-size: 10px;
font-weight: 600;
} }
} }

47
src/context/intermediate/popovers/UserProfile.tsx
View file

@ -1,10 +1,17 @@
import { ListUl } from "@styled-icons/boxicons-regular"; import {
ListUl,
DotsVerticalRounded,
ChevronRight,
} from "@styled-icons/boxicons-regular";
import { import {
Envelope, Envelope,
Edit, Edit,
UserPlus, UserPlus,
Group, Group,
InfoCircle, InfoCircle,
BadgeCheck,
Cog,
TimeFive,
} from "@styled-icons/boxicons-solid"; } from "@styled-icons/boxicons-solid";
import { observer } from "mobx-react-lite"; import { observer } from "mobx-react-lite";
import { Link, useHistory } from "react-router-dom"; import { Link, useHistory } from "react-router-dom";
@ -157,7 +164,6 @@ export const UserProfile = observer(
backgroundImage: backgroundImage:
backgroundURL && backgroundURL &&
`linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ), url('${backgroundURL}')`, `linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ), url('${backgroundURL}')`,
paddingBottom: "1px",
}}> }}>
<div className={styles.profile}> <div className={styles.profile}>
<UserIcon <UserIcon
@ -234,6 +240,9 @@ export const UserProfile = observer(
<UserPlus size={28} /> <UserPlus size={28} />
</IconButton> </IconButton>
)} )}
{/*<IconButton onClick={() => user.addFriend()}>
<DotsVerticalRounded size={26} />
</IconButton>*/}
</div> </div>
<div className={styles.tabs}> <div className={styles.tabs}>
<div <div
@ -288,7 +297,27 @@ export const UserProfile = observer(
{user.bot ? ( {user.bot ? (
<> <>
<div className={styles.category}> <div className={styles.category}>
bot owner Bot information
</div>
<div className={styles.botContainer}>
<div className={styles.botStats}>
<div className={styles.stat}>
<BadgeCheck size="15" />
<b>
This bot has been
officially verified by
Revolt
</b>
</div>
<div className={styles.stat}>
<Cog size="15" />
Used in <b>456 servers</b>
</div>
<div className={styles.stat}>
<TimeFive size="14" />
Bot active since{" "}
<b>Apr 15, 2019</b>
</div>
</div> </div>
<div <div
onClick={() => onClick={() =>
@ -306,13 +335,21 @@ export const UserProfile = observer(
user.bot.owner, user.bot.owner,
)} )}
/> />
<span> <div className={styles.info}>
<Username <Username
user={client.users.get( user={client.users.get(
user.bot.owner, user.bot.owner,
)} )}
/> />
</span> <div
className={
styles.owner
}>
Bot owner
</div>
</div>
<ChevronRight size="24" />
</div>
</div> </div>
</> </>
) : undefined} ) : undefined}