abner/for-legacy-web
1
0
Fork 1
mirror of https://github.com/stoatchat/for-legacy-web.git synced 2026-03-07 17:35:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

Start migration to revolt.js@5.0.0.

Browse Source 
200 error milestone
This commit is contained in:
Paul
2021-07-30 20:24:53 +01:00
parent 564c1d8494
commit 3184269ba4
32 changed files with 215 additions and 834 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/pages/settings/panes/Account.tsx
View File

@@ -2,14 +2,12 @@ import { At } from "@styled-icons/boxicons-regular";
import { Envelope, Key, HelpCircle } from "@styled-icons/boxicons-solid";
import { observer } from "mobx-react-lite";
import { Link, useHistory } from "react-router-dom";
import { Users } from "revolt.js/dist/api/objects";
import { Profile } from "revolt-api/types/Users";
import styles from "./Panes.module.scss";
import { Text } from "preact-i18n";
import { useContext, useEffect, useState } from "preact/hooks";
import { useData } from "../../../mobx/State";
import { useIntermediate } from "../../../context/intermediate/Intermediate";
import {
ClientStatus,
@@ -28,14 +26,10 @@ export const Account = observer(() => {
const status = useContext(StatusContext);
const client = useClient();
const store = useData();
const user = store.users.get(client.user!._id)!;
const [email, setEmail] = useState("...");
const [revealEmail, setRevealEmail] = useState(false);
const [profile, setProfile] = useState<undefined | Users.Profile>(
undefined,
);
const [profile, setProfile] = useState<undefined | Profile>(undefined);
const history = useHistory();
function switchPage(to: string) {
@@ -50,8 +44,8 @@ export const Account = observer(() => {
}
if (profile === undefined && status === ClientStatus.ONLINE) {
client.users
.fetchProfile(user._id)
client
.user!.fetchProfile()
.then((profile) => setProfile(profile ?? {}));
}
}, [status]);
@@ -61,12 +55,14 @@ export const Account = observer(() => {
<div className={styles.banner}>
<UserIcon
className={styles.avatar}
target={user}
target={client.user!}
size={72}
onClick={() => switchPage("profile")}
/>
<div className={styles.userDetail}>
<div className={styles.username}>@{user.username}</div>
<div className={styles.username}>
@{client.user!.username}
</div>
<div className={styles.userid}>
<Tooltip
content={
@@ -75,8 +71,8 @@ export const Account = observer(() => {
<HelpCircle size={16} />
</Tooltip>
<Tooltip content={<Text id="app.special.copy" />}>
<a onClick={() => writeClipboard(user._id)}>
{user._id}
<a onClick={() => writeClipboard(client.user!._id)}>
{client.user!._id}
</a>
</Tooltip>
</div>
@@ -85,7 +81,7 @@ export const Account = observer(() => {
<div className={styles.details}>
{(
[
["username", user.username, <At size={24} />],
["username", client.user!.username, <At size={24} />],
["email", email, <Envelope size={24} />],
["password", "***********", <Key size={24} />],
] as const

30
src/pages/settings/panes/Profile.tsx
View File

@@ -1,5 +1,3 @@
import { Users } from "revolt.js/dist/api/objects";
import styles from "./Panes.module.scss";
import { IntlContext, Text, translate } from "preact-i18n";
import { useContext, useEffect, useState } from "preact/hooks";
@@ -18,6 +16,7 @@ import AutoComplete, {
useAutoComplete,
} from "../../../components/common/AutoComplete";
import Button from "../../../components/ui/Button";
import { Profile } from "revolt-api/types/Users";
export function Profile() {
const { intl } = useContext(IntlContext);
@@ -25,15 +24,15 @@ export function Profile() {
const client = useClient();
const [profile, setProfile] = useState<undefined | Users.Profile>(
const [profile, setProfile] = useState<undefined | Profile>(
undefined,
);
// ! FIXME: temporary solution
// ! we should just announce profile changes through WS
function refreshProfile() {
client.users
.fetchProfile(client.user!._id)
client
.user!.fetchProfile()
.then((profile) => setProfile(profile ?? {}));
}
@@ -85,20 +84,17 @@ export function Profile() {
fileType="avatars"
behaviour="upload"
maxFileSize={4_000_000}
onUpload={(avatar) => client.users.editUser({ avatar })}
onUpload={(avatar) => client.users.edit({ avatar })}
remove={() =>
client.users.editUser({ remove: "Avatar" })
client.users.edit({ remove: "Avatar" })
}
defaultPreview={client.users.getAvatarURL(
client.user!._id,
defaultPreview={client.user!.generateAvatarURL(
{ max_side: 256 },
true,
)}
previewURL={client.users.getAvatarURL(
client.user!._id,
previewURL={client.user!.generateAvatarURL(
{ max_side: 256 },
true,
true,
)}
/>
</div>
@@ -113,21 +109,21 @@ export function Profile() {
fileType="backgrounds"
maxFileSize={6_000_000}
onUpload={async (background) => {
await client.users.editUser({
await client.users.edit({
profile: { background },
});
refreshProfile();
}}
remove={async () => {
await client.users.editUser({
await client.users.edit({
remove: "ProfileBackground",
});
setProfile({ ...profile, background: undefined });
}}
previewURL={
profile?.background
? client.users.getBackgroundURL(
profile,
? client.generateFileURL(
profile.background,
{ width: 1000 },
true,
)
@@ -169,7 +165,7 @@ export function Profile() {
contrast
onClick={() => {
setChanged(false);
client.users.editUser({
client.users.edit({
profile: { content: profile?.content },
});
}}