HMC/handmade-revolt
2
0
Fork 0
forked from abner/for-legacy-web
Code Pull Requests Actions 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

2
src/components/common/AgeGate.tsx
View File

@@ -1,11 +1,11 @@
import { observer } from "mobx-react-lite";
import { useHistory } from "react-router-dom";
import { Channel } from "revolt.js/dist/maps/Channels";
import styled from "styled-components";
import { Text } from "preact-i18n";
import { useState } from "preact/hooks";
import { Channel } from "../../mobx";
import { dispatch, getState } from "../../redux";
import Button from "../ui/Button";

32
src/components/common/AutoComplete.tsx
View File

@@ -1,13 +1,11 @@
import { useStore } from "react-redux";
import { SYSTEM_USER_ID } from "revolt.js";
import { Channels } from "revolt.js/dist/api/objects";
import { Channel } from "revolt.js/dist/maps/Channels";
import { User } from "revolt.js/dist/maps/Users";
import styled, { css } from "styled-components";
import { StateUpdater, useState } from "preact/hooks";
import { Channel, User } from "../../mobx";
import { useData } from "../../mobx/State";
import { useClient } from "../../context/revoltjs/RevoltClient";
import { emojiDictionary } from "../../assets/emojis";
@@ -57,7 +55,6 @@ export function useAutoComplete(
const [state, setState] = useState<AutoCompleteState>({ type: "none" });
const [focused, setFocused] = useState(false);
const client = useClient();
const store = useData();
function findSearchString(
el: HTMLTextAreaElement,
@@ -132,7 +129,7 @@ export function useAutoComplete(
let users: User[] = [];
switch (searchClues.users.type) {
case "all":
users = [...store.users.values()];
users = [...client.users.values()];
break;
case "channel": {
const channel = client.channels.get(
@@ -141,22 +138,15 @@ export function useAutoComplete(
switch (channel?.channel_type) {
case "Group":
case "DirectMessage":
users = channel.recipients
.map((x) => store.users.get(x))
.filter(
(x) => typeof x !== "undefined",
) as User[];
users = channel.recipients!.filter(
(x) => typeof x !== "undefined",
) as User[];
break;
case "TextChannel":
const server = channel.server;
users = client.members
.toArray()
.filter(
(x) => x._id.substr(0, 26) === server,
)
.map((x) =>
store.users.get(x._id.substr(26)),
)
const server = channel.server_id;
users = [...client.members.keys()]
.filter((x) => x.server === server)
.map((x) => client.users.get(x.user))
.filter(
(x) => typeof x !== "undefined",
) as User[];
@@ -197,7 +187,7 @@ export function useAutoComplete(
if (type === "channel" && searchClues?.channels) {
const channels = client.servers
.get(searchClues.channels.server)
?.channels.map((x) => store.channels.get(x))
?.channels.map((x) => client.channels.get(x))
.filter((x) => typeof x !== "undefined") as Channel[];
const matches = (

29
src/components/common/messaging/Message.tsx
View File

@@ -1,15 +1,14 @@
import { observer } from "mobx-react-lite";
import { Message as MessageObject } from "revolt.js/dist/maps/Messages";
import { attachContextMenu } from "preact-context-menu";
import { memo } from "preact/compat";
import { useContext, useState } from "preact/hooks";
import { useState } from "preact/hooks";
import { useData } from "../../../mobx/State";
import { QueuedMessage } from "../../../redux/reducers/queue";
import { useIntermediate } from "../../../context/intermediate/Intermediate";
import { AppContext } from "../../../context/revoltjs/RevoltClient";
import { MessageObject } from "../../../context/revoltjs/util";
import { useClient } from "../../../context/revoltjs/RevoltClient";
import Overline from "../../ui/Overline";
@@ -46,15 +45,14 @@ const Message = observer(
head: preferHead,
queued,
}: Props) => {
const store = useData();
const user = store.users.get(message.author);
const client = useClient();
const user = message.author;
const client = useContext(AppContext);
const { openScreen } = useIntermediate();
const content = message.content as string;
const head =
preferHead || (message.replies && message.replies.length > 0);
preferHead || (message.reply_ids && message.reply_ids.length > 0);
// ! FIXME: tell fatal to make this type generic
// bree: Fatal please...
@@ -66,28 +64,33 @@ const Message = observer(
: undefined;
const openProfile = () =>
openScreen({ id: "profile", user_id: message.author });
openScreen({ id: "profile", user_id: message.author_id });
// ! FIXME: animate on hover
const [animate, setAnimate] = useState(false);
return (
<div id={message._id}>
{message.replies?.map((message_id, index) => (
{message.reply_ids?.map((message_id, index) => (
<MessageReply
index={index}
id={message_id}
channel={message.channel}
channel={message.channel!}
/>
))}
<MessageBase
highlight={highlight}
head={
head && !(message.replies && message.replies.length > 0)
(head &&
!(
message.reply_ids &&
message.reply_ids.length > 0
)) ??
false
}
contrast={contrast}
sending={typeof queued !== "undefined"}
mention={message.mentions?.includes(client.user!._id)}
mention={message.mention_ids?.includes(client.user!._id)}
failed={typeof queued?.error !== "undefined"}
onContextMenu={
attachContext

36
src/components/common/messaging/attachments/MessageReply.tsx
View File

@@ -2,8 +2,10 @@ import { Reply } from "@styled-icons/boxicons-regular";
import { File } from "@styled-icons/boxicons-solid";
import { observer } from "mobx-react-lite";
import { useHistory } from "react-router-dom";
import { RelationshipStatus } from "revolt-api/types/Users";
import { SYSTEM_USER_ID } from "revolt.js";
import { Users } from "revolt.js/dist/api/objects";
import { Channel } from "revolt.js/dist/maps/Channels";
import { Message } from "revolt.js/dist/maps/Messages";
import styled, { css } from "styled-components";
import { Text } from "preact-i18n";
@@ -11,17 +13,14 @@ import { useLayoutEffect, useState } from "preact/hooks";
import { useRenderState } from "../../../../lib/renderer/Singleton";
import { useData } from "../../../../mobx/State";
import { useClient } from "../../../../context/revoltjs/RevoltClient";
import { mapMessage, MessageObject } from "../../../../context/revoltjs/util";
import Markdown from "../../../markdown/Markdown";
import UserShort from "../../user/UserShort";
import { SystemMessage } from "../SystemMessage";
interface Props {
channel: string;
channel: Channel;
index: number;
id: string;
}
@@ -124,13 +123,11 @@ export const ReplyBase = styled.div<{
`;
export const MessageReply = observer(({ index, channel, id }: Props) => {
const client = useClient();
const view = useRenderState(channel);
const view = useRenderState(channel._id);
if (view?.type !== "RENDER") return null;
const [message, setMessage] = useState<MessageObject | undefined>(
undefined,
);
const [message, setMessage] = useState<Message | undefined>(undefined);
useLayoutEffect(() => {
// ! FIXME: We should do this through the message renderer, so it can fetch it from cache if applicable.
const m = view.messages.find((x) => x._id === id);
@@ -138,9 +135,7 @@ export const MessageReply = observer(({ index, channel, id }: Props) => {
if (m) {
setMessage(m);
} else {
client.channels
.fetchMessage(channel, id)
.then((m) => setMessage(mapMessage(m)));
channel.fetchMessage(id).then(setMessage);
}
}, [view.messages]);
@@ -155,33 +150,32 @@ export const MessageReply = observer(({ index, channel, id }: Props) => {
);
}
const store = useData();
const user = store.users.get(message.author);
const history = useHistory();
return (
<ReplyBase head={index === 0}>
<Reply size={16} />
{user?.relationship === Users.Relationship.Blocked ? (
{message.author?.relationship === RelationshipStatus.Blocked ? (
<>
<Text id="app.main.channel.misc.blocked_user" />
</>
) : (
<>
{message.author === SYSTEM_USER_ID ? (
{message.author_id === SYSTEM_USER_ID ? (
<SystemMessage message={message} hideInfo />
) : (
<>
<div className="user">
<UserShort user={user} size={16} />
<UserShort user={message.author} size={16} />
</div>
<div
className="content"
onClick={() => {
const obj = client.channels.get(channel);
if (obj?.channel_type === "TextChannel") {
if (
channel.channel_type === "TextChannel"
) {
history.push(
`/server/${obj.server}/channel/${obj._id}/${message._id}`,
`/server/${channel.server}/channel/${channel._id}/${message._id}`,
);
} else {
history.push(