Remove useChannel

This commit is contained in:
Paul
2021-07-29 18:41:01 +01:00
parent 0571c065bd
commit 411fac2527
28 changed files with 259 additions and 257 deletions

View File

@@ -3,7 +3,9 @@ import { Route, useHistory, useParams } from "react-router-dom";
import { Text } from "preact-i18n";
import { useChannel, useForceUpdate } from "../../context/revoltjs/hooks";
import { useData } from "../../mobx/State";
import { useClient } from "../../context/revoltjs/RevoltClient";
import { getChannelName } from "../../context/revoltjs/util";
import Category from "../../components/ui/Category";
@@ -14,8 +16,10 @@ import Permissions from "./channel/Permissions";
export default function ChannelSettings() {
const { channel: cid } = useParams<{ channel: string }>();
const ctx = useForceUpdate();
const channel = useChannel(cid, ctx);
const store = useData();
const client = useClient();
const channel = store.channels.get(cid);
if (!channel) return null;
if (
channel.channel_type === "SavedMessages" ||
@@ -49,7 +53,7 @@ export default function ChannelSettings() {
category: (
<Category
variant="uniform"
text={getChannelName(ctx.client, channel, true)}
text={getChannelName(client, channel, true)}
/>
),
id: "overview",

View File

@@ -1,3 +1,4 @@
import { observer } from "mobx-react-lite";
import { Channels } from "revolt.js/dist/api/objects";
import styled, { css } from "styled-components";
@@ -6,6 +7,8 @@ import { useContext, useEffect, useState } from "preact/hooks";
import TextAreaAutoSize from "../../../lib/TextAreaAutoSize";
import { Channel } from "../../../mobx";
import { FileUploader } from "../../../context/revoltjs/FileUploads";
import { AppContext } from "../../../context/revoltjs/RevoltClient";
@@ -13,10 +16,7 @@ import Button from "../../../components/ui/Button";
import InputBox from "../../../components/ui/InputBox";
interface Props {
channel:
| Channels.GroupChannel
| Channels.TextChannel
| Channels.VoiceChannel;
channel: Channel;
}
const Row = styled.div`
@@ -32,13 +32,13 @@ const Row = styled.div`
}
`;
export default function Overview({ channel }: Props) {
export default observer(({ channel }: Props) => {
const client = useContext(AppContext);
const [name, setName] = useState(channel.name);
const [name, setName] = useState(channel.name ?? undefined);
const [description, setDescription] = useState(channel.description ?? "");
useEffect(() => setName(channel.name), [channel.name]);
useEffect(() => setName(channel.name ?? undefined), [channel.name]);
useEffect(
() => setDescription(channel.description ?? ""),
[channel.description],
@@ -127,4 +127,4 @@ export default function Overview({ channel }: Props) {
</p>
</div>
);
}
});

View File

@@ -1,8 +1,11 @@
import { observer } from "mobx-react-lite";
import { Channels } from "revolt.js/dist/api/objects";
import { ChannelPermission } from "revolt.js/dist/api/permissions";
import { useContext, useEffect, useState } from "preact/hooks";
import { Channel } from "../../../mobx";
import { AppContext } from "../../../context/revoltjs/RevoltClient";
import { useServer } from "../../../context/revoltjs/hooks";
@@ -21,21 +24,18 @@ const DEFAULT_PERMISSION_DM =
ChannelPermission.UploadFiles;
interface Props {
channel:
| Channels.GroupChannel
| Channels.TextChannel
| Channels.VoiceChannel;
channel: Channel;
}
// ! FIXME: bad code :)
export default function Permissions({ channel }: Props) {
export default observer(({ channel }: Props) => {
const [selected, setSelected] = useState("default");
const client = useContext(AppContext);
type R = { name: string; permissions: number };
const roles: { [key: string]: R } = {};
if (channel.channel_type !== "Group") {
const server = useServer(channel.server);
const server = useServer(channel.server!);
const a = server?.roles ?? {};
for (const b of Object.keys(a)) {
roles[b] = {
@@ -110,4 +110,4 @@ export default function Permissions({ channel }: Props) {
</Button>
</div>
);
}
});

View File

@@ -1,5 +1,6 @@
import { XCircle } from "@styled-icons/boxicons-regular";
import isEqual from "lodash.isequal";
import { observer } from "mobx-react-lite";
import { Channels, Servers, Users } from "revolt.js/dist/api/objects";
import { Route } from "revolt.js/dist/api/routes";
import { ulid } from "ulid";
@@ -8,8 +9,9 @@ import styles from "./Panes.module.scss";
import { Text } from "preact-i18n";
import { useContext, useEffect, useState } from "preact/hooks";
import { useData } from "../../../mobx/State";
import { AppContext } from "../../../context/revoltjs/RevoltClient";
import { useChannels } from "../../../context/revoltjs/hooks";
import ChannelIcon from "../../../components/common/ChannelIcon";
import UserIcon from "../../../components/common/user/UserIcon";
@@ -25,12 +27,12 @@ interface Props {
}
// ! FIXME: really bad code
export function Categories({ server }: Props) {
export const Categories = observer(({ server }: Props) => {
const client = useContext(AppContext);
const channels = useChannels(server.channels) as (
| Channels.TextChannel
| Channels.VoiceChannel
)[];
const store = useData();
const channels = server.channels
.map((id) => store.channels.get(id)!)
.filter((x) => typeof x !== "undefined");
const [cats, setCats] = useState<Servers.Category[]>(
server.categories ?? [],
@@ -150,4 +152,4 @@ export function Categories({ server }: Props) {
})}
</div>
);
}
});

View File

@@ -9,7 +9,6 @@ import { useEffect, useState } from "preact/hooks";
import { useData } from "../../../mobx/State";
import { useClient } from "../../../context/revoltjs/RevoltClient";
import { useChannels, useForceUpdate } from "../../../context/revoltjs/hooks";
import { getChannelName } from "../../../context/revoltjs/util";
import UserIcon from "../../../components/common/user/UserIcon";
@@ -26,14 +25,15 @@ export const Invites = observer(({ server }: Props) => {
InvitesNS.ServerInvite[] | undefined
>(undefined);
const ctx = useForceUpdate();
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));
const channels = invites?.map((invite) =>
store.channels.get(invite.channel),
);
useEffect(() => {
ctx.client.servers
client.servers
.fetchInvites(server._id)
.then((invites) => setInvites(invites));
}, []);
@@ -57,7 +57,7 @@ export const Invites = observer(({ server }: Props) => {
{typeof invites === "undefined" && <Preloader type="ring" />}
{invites?.map((invite, index) => {
const creator = users![index];
const channel = channels.find((x) => x?._id === invite.channel);
const channel = channels![index];
return (
<div
@@ -72,14 +72,14 @@ export const Invites = observer(({ server }: Props) => {
</span>
<span>
{channel && creator
? getChannelName(ctx.client, channel, true)
? getChannelName(client, channel, true)
: "#??"}
</span>
<IconButton
onClick={async () => {
setDelete([...deleting, invite._id]);
await ctx.client.deleteInvite(invite._id);
await client.deleteInvite(invite._id);
setInvites(
invites?.filter(

View File

@@ -1,4 +1,5 @@
import isEqual from "lodash.isequal";
import { observer } from "mobx-react-lite";
import { Servers, Server } from "revolt.js/dist/api/objects";
import styles from "./Panes.module.scss";
@@ -7,6 +8,8 @@ import { useContext, useEffect, useState } from "preact/hooks";
import TextAreaAutoSize from "../../../lib/TextAreaAutoSize";
import { useData } from "../../../mobx/State";
import { FileUploader } from "../../../context/revoltjs/FileUploads";
import { AppContext } from "../../../context/revoltjs/RevoltClient";
import { getChannelName } from "../../../context/revoltjs/util";
@@ -19,8 +22,9 @@ interface Props {
server: Servers.Server;
}
export function Overview({ server }: Props) {
export const Overview = observer(({ server }: Props) => {
const client = useContext(AppContext);
const store = useData();
const [name, setName] = useState(server.name);
const [description, setDescription] = useState(server.description ?? "");
@@ -170,15 +174,14 @@ export function Overview({ server }: Props) {
<option value="disabled">
<Text id="general.disabled" />
</option>
{server.channels.map((id) => {
const channel = client.channels.get(id);
if (!channel) return null;
return (
<option value={id}>
{server.channels
.map((id) => store.channels.get(id)!)
.filter((x) => typeof x !== "undefined")
.map((channel) => (
<option value={channel._id}>
{getChannelName(client, channel, true)}
</option>
);
})}
))}
</ComboBox>
</p>
))}
@@ -190,4 +193,4 @@ export function Overview({ server }: Props) {
</p>
</div>
);
}
});