HMC/handmade-revolt
2
0
Fork 0
forked from abner/for-legacy-web
Code Pull Requests Actions Activity

Work towards removing useUsers.

Browse Source
This commit is contained in:
Paul
2021-07-29 15:11:21 +01:00
parent cf3930b094
commit 4dffaad6c1
25 changed files with 580 additions and 501 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,5 +1,6 @@
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";
@@ -7,26 +8,28 @@ 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,
StatusContext,
useClient,
} from "../../../context/revoltjs/RevoltClient";
import { useForceUpdate, useSelf } from "../../../context/revoltjs/hooks";
import { useForceUpdate } from "../../../context/revoltjs/hooks";
import Tooltip from "../../../components/common/Tooltip";
import UserIcon from "../../../components/common/user/UserIcon";
import Button from "../../../components/ui/Button";
import Overline from "../../../components/ui/Overline";
import Tip from "../../../components/ui/Tip";
export function Account() {
export const Account = observer(() => {
const { openScreen, writeClipboard } = useIntermediate();
const status = useContext(StatusContext);
const ctx = useForceUpdate();
const user = useSelf(ctx);
if (!user) return null;
const client = useClient();
const store = useData();
const user = store.users.get(client.user!._id)!;
const [email, setEmail] = useState("...");
const [revealEmail, setRevealEmail] = useState(false);
@@ -41,13 +44,13 @@ export function Account() {
useEffect(() => {
if (email === "..." && status === ClientStatus.ONLINE) {
ctx.client
client
.req("GET", "/auth/user")
.then((account) => setEmail(account.email));
}
if (profile === undefined && status === ClientStatus.ONLINE) {
ctx.client.users
client.users
.fetchProfile(user._id)
.then((profile) => setProfile(profile ?? {}));
}
@@ -180,4 +183,4 @@ export function Account() {
</Tip>
</div>
);
}
});

6
src/pages/settings/panes/Feedback.tsx
View File

@@ -2,7 +2,7 @@ import styles from "./Panes.module.scss";
import { Localizer, Text } from "preact-i18n";
import { useState } from "preact/hooks";
import { useSelf } from "../../../context/revoltjs/hooks";
import { useClient } from "../../../context/revoltjs/RevoltClient";
import Button from "../../../components/ui/Button";
import InputBox from "../../../components/ui/InputBox";
@@ -10,7 +10,7 @@ import Radio from "../../../components/ui/Radio";
import TextArea from "../../../components/ui/TextArea";
export function Feedback() {
const user = useSelf();
const client = useClient();
const [other, setOther] = useState("");
const [description, setDescription] = useState("");
const [state, setState] = useState<"ready" | "sending" | "sent">("ready");
@@ -28,7 +28,7 @@ export function Feedback() {
checked,
other,
description,
name: user?.username ?? "Unknown User",
name: client.user!.username,
}),
mode: "no-cors",
});

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

@@ -11,8 +11,8 @@ import { FileUploader } from "../../../context/revoltjs/FileUploads";
import {
ClientStatus,
StatusContext,
useClient,
} from "../../../context/revoltjs/RevoltClient";
import { useForceUpdate, useSelf } from "../../../context/revoltjs/hooks";
import AutoComplete, {
useAutoComplete,
@@ -23,9 +23,7 @@ export function Profile() {
const { intl } = useContext(IntlContext);
const status = useContext(StatusContext);
const ctx = useForceUpdate();
const user = useSelf();
if (!user) return null;
const client = useClient();
const [profile, setProfile] = useState<undefined | Users.Profile>(
undefined,
@@ -34,8 +32,8 @@ export function Profile() {
// ! FIXME: temporary solution
// ! we should just announce profile changes through WS
function refreshProfile() {
ctx.client.users
.fetchProfile(user!._id)
client.users
.fetchProfile(client.user!._id)
.then((profile) => setProfile(profile ?? {}));
}
@@ -69,7 +67,7 @@ export function Profile() {
</h3>
<div className={styles.preview}>
<UserProfile
user_id={user._id}
user_id={client.user!._id}
dummy={true}
dummyProfile={profile}
onClose={() => {}}
@@ -87,19 +85,17 @@ export function Profile() {
fileType="avatars"
behaviour="upload"
maxFileSize={4_000_000}
onUpload={(avatar) =>
ctx.client.users.editUser({ avatar })
}
onUpload={(avatar) => client.users.editUser({ avatar })}
remove={() =>
ctx.client.users.editUser({ remove: "Avatar" })
client.users.editUser({ remove: "Avatar" })
}
defaultPreview={ctx.client.users.getAvatarURL(
user._id,
defaultPreview={client.users.getAvatarURL(
client.user!._id,
{ max_side: 256 },
true,
)}
previewURL={ctx.client.users.getAvatarURL(
user._id,
previewURL={client.users.getAvatarURL(
client.user!._id,
{ max_side: 256 },
true,
true,
@@ -117,20 +113,20 @@ export function Profile() {
fileType="backgrounds"
maxFileSize={6_000_000}
onUpload={async (background) => {
await ctx.client.users.editUser({
await client.users.editUser({
profile: { background },
});
refreshProfile();
}}
remove={async () => {
await ctx.client.users.editUser({
await client.users.editUser({
remove: "ProfileBackground",
});
setProfile({ ...profile, background: undefined });
}}
previewURL={
profile?.background
? ctx.client.users.getBackgroundURL(
? client.users.getBackgroundURL(
profile,
{ width: 1000 },
true,
@@ -173,7 +169,7 @@ export function Profile() {
contrast
onClick={() => {
setChanged(false);
ctx.client.users.editUser({
client.users.editUser({
profile: { content: profile?.content },
});
}}

19
src/pages/settings/server/Invites.tsx
View File

@@ -1,10 +1,14 @@
import { XCircle } from "@styled-icons/boxicons-regular";
import { observer } from "mobx-react-lite";
import { Invites as InvitesNS, Servers } from "revolt.js/dist/api/objects";
import styles from "./Panes.module.scss";
import { Text } from "preact-i18n";
import { useEffect, useState } from "preact/hooks";
import { useData } from "../../../mobx/State";
import { useClient } from "../../../context/revoltjs/RevoltClient";
import {
useChannels,
useForceUpdate,
@@ -20,16 +24,19 @@ interface Props {
server: Servers.Server;
}
export function Invites({ server }: Props) {
export const Invites = observer(({ server }: Props) => {
const [deleting, setDelete] = useState<string[]>([]);
const [invites, setInvites] = useState<
InvitesNS.ServerInvite[] | undefined
>(undefined);
const ctx = useForceUpdate();
const [deleting, setDelete] = useState<string[]>([]);
const users = useUsers(invites?.map((x) => x.creator) ?? [], ctx);
const channels = useChannels(invites?.map((x) => x.channel) ?? [], ctx);
const store = useData();
const client = useClient();
const users = invites?.map((invite) => store.users.get(invite.creator));
useEffect(() => {
ctx.client.servers
.fetchInvites(server._id)
@@ -53,8 +60,8 @@ export function Invites({ server }: Props) {
</span>
</div>
{typeof invites === "undefined" && <Preloader type="ring" />}
{invites?.map((invite) => {
const creator = users.find((x) => x?._id === invite.creator);
{invites?.map((invite, index) => {
const creator = users![index];
const channel = channels.find((x) => x?._id === invite.channel);
return (
@@ -93,4 +100,4 @@ export function Invites({ server }: Props) {
})}
</div>
);
}
});

25
src/pages/settings/server/Members.tsx
View File

@@ -1,11 +1,15 @@
import { ChevronDown } from "@styled-icons/boxicons-regular";
import { isEqual } from "lodash";
import { observer } from "mobx-react-lite";
import { Servers } from "revolt.js/dist/api/objects";
import styles from "./Panes.module.scss";
import { Text } from "preact-i18n";
import { useEffect, useState } from "preact/hooks";
import { useData } from "../../../mobx/State";
import { useClient } from "../../../context/revoltjs/RevoltClient";
import { useForceUpdate, useUsers } from "../../../context/revoltjs/hooks";
import UserIcon from "../../../components/common/user/UserIcon";
@@ -18,17 +22,18 @@ interface Props {
server: Servers.Server;
}
export function Members({ server }: Props) {
export const Members = observer(({ server }: Props) => {
const [selected, setSelected] = useState<undefined | string>();
const [members, setMembers] = useState<Servers.Member[] | undefined>(
undefined,
);
const ctx = useForceUpdate();
const [selected, setSelected] = useState<undefined | string>();
const users = useUsers(members?.map((x) => x._id.user) ?? [], ctx);
const store = useData();
const client = useClient();
const users = members?.map((member) => store.users.get(member._id.user));
useEffect(() => {
ctx.client.members
client.members
.fetchMembers(server._id)
.then((members) => setMembers(members));
}, []);
@@ -50,10 +55,10 @@ export function Members({ server }: Props) {
{members &&
members.length > 0 &&
members
.map((x) => {
.map((member, index) => {
return {
member: x,
user: users.find((y) => y?._id === x._id.user),
member,
user: users![index],
};
})
.map(({ member, user }) => (
@@ -126,7 +131,7 @@ export function Members({ server }: Props) {
roles,
)}
onClick={async () => {
await ctx.client.members.editMember(
await client.members.editMember(
server._id,
member._id.user,
{
@@ -154,4 +159,4 @@ export function Members({ server }: Props) {
))}
</div>
);
}
});