mirror of
https://github.com/revoltchat/revite.git
synced 2024-11-29 18:30:58 -05:00
Zero error milestone.
This commit is contained in:
parent
c21453b281
commit
4c9554c5e9
41 changed files with 242 additions and 370 deletions
|
@ -187,8 +187,9 @@ export function useAutoComplete(
|
||||||
if (type === "channel" && searchClues?.channels) {
|
if (type === "channel" && searchClues?.channels) {
|
||||||
const channels = client.servers
|
const channels = client.servers
|
||||||
.get(searchClues.channels.server)
|
.get(searchClues.channels.server)
|
||||||
?.channels.map((x) => client.channels.get(x))
|
?.channels.filter(
|
||||||
.filter((x) => typeof x !== "undefined") as Channel[];
|
(x) => typeof x !== "undefined",
|
||||||
|
) as Channel[];
|
||||||
|
|
||||||
const matches = (
|
const matches = (
|
||||||
search.length > 0
|
search.length > 0
|
||||||
|
|
|
@ -1,11 +1,9 @@
|
||||||
import { Hash, VolumeFull } from "@styled-icons/boxicons-regular";
|
import { Hash, VolumeFull } from "@styled-icons/boxicons-regular";
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { Channels } from "revolt.js/dist/api/objects";
|
import { Channel } from "revolt.js/dist/maps/Channels";
|
||||||
|
|
||||||
import { useContext } from "preact/hooks";
|
import { useContext } from "preact/hooks";
|
||||||
|
|
||||||
import { Channel } from "../../mobx";
|
|
||||||
|
|
||||||
import { AppContext } from "../../context/revoltjs/RevoltClient";
|
import { AppContext } from "../../context/revoltjs/RevoltClient";
|
||||||
|
|
||||||
import { ImageIconBase, IconBaseProps } from "./IconBase";
|
import { ImageIconBase, IconBaseProps } from "./IconBase";
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { Attachment } from "revolt.js/dist/api/objects";
|
import { Attachment } from "revolt-api/types/Autumn";
|
||||||
import styled, { css } from "styled-components";
|
import styled, { css } from "styled-components";
|
||||||
|
|
||||||
export interface IconBaseProps<T> {
|
export interface IconBaseProps<T> {
|
||||||
|
|
|
@ -2,13 +2,9 @@ import { Cog } from "@styled-icons/boxicons-solid";
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { Link } from "react-router-dom";
|
import { Link } from "react-router-dom";
|
||||||
import { ServerPermission } from "revolt.js/dist/api/permissions";
|
import { ServerPermission } from "revolt.js/dist/api/permissions";
|
||||||
|
import { Server } from "revolt.js/dist/maps/Servers";
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
|
|
||||||
import { Server } from "../../mobx";
|
|
||||||
|
|
||||||
import { useClient } from "../../context/revoltjs/RevoltClient";
|
|
||||||
import { useServerPermission } from "../../context/revoltjs/hooks";
|
|
||||||
|
|
||||||
import Header from "../ui/Header";
|
import Header from "../ui/Header";
|
||||||
import IconButton from "../ui/IconButton";
|
import IconButton from "../ui/IconButton";
|
||||||
|
|
||||||
|
@ -21,14 +17,7 @@ const ServerName = styled.div`
|
||||||
`;
|
`;
|
||||||
|
|
||||||
export default observer(({ server }: Props) => {
|
export default observer(({ server }: Props) => {
|
||||||
const permissions = useServerPermission(server._id);
|
const bannerURL = server.generateBannerURL({ width: 480 });
|
||||||
const client = useClient();
|
|
||||||
|
|
||||||
const bannerURL = client.servers.getBannerURL(
|
|
||||||
server._id,
|
|
||||||
{ width: 480 },
|
|
||||||
true,
|
|
||||||
);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Header
|
<Header
|
||||||
|
@ -39,7 +28,7 @@ export default observer(({ server }: Props) => {
|
||||||
background: bannerURL ? `url('${bannerURL}')` : undefined,
|
background: bannerURL ? `url('${bannerURL}')` : undefined,
|
||||||
}}>
|
}}>
|
||||||
<ServerName>{server.name}</ServerName>
|
<ServerName>{server.name}</ServerName>
|
||||||
{(permissions & ServerPermission.ManageServer) > 0 && (
|
{(server.permission & ServerPermission.ManageServer) > 0 && (
|
||||||
<div className="actions">
|
<div className="actions">
|
||||||
<Link to={`/server/${server._id}/settings`}>
|
<Link to={`/server/${server._id}/settings`}>
|
||||||
<IconButton>
|
<IconButton>
|
||||||
|
|
|
@ -1,10 +1,9 @@
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
|
import { Server } from "revolt.js/dist/maps/Servers";
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
|
|
||||||
import { useContext } from "preact/hooks";
|
import { useContext } from "preact/hooks";
|
||||||
|
|
||||||
import { Server } from "../../mobx";
|
|
||||||
|
|
||||||
import { AppContext } from "../../context/revoltjs/RevoltClient";
|
import { AppContext } from "../../context/revoltjs/RevoltClient";
|
||||||
|
|
||||||
import { IconBaseProps, ImageIconBase } from "./IconBase";
|
import { IconBaseProps, ImageIconBase } from "./IconBase";
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
|
import { observer } from "mobx-react-lite";
|
||||||
|
import { Message } from "revolt.js/dist/maps/Messages";
|
||||||
import styled, { css, keyframes } from "styled-components";
|
import styled, { css, keyframes } from "styled-components";
|
||||||
import { decodeTime } from "ulid";
|
import { decodeTime } from "ulid";
|
||||||
|
|
||||||
|
@ -6,7 +8,6 @@ import { Text } from "preact-i18n";
|
||||||
import { useDictionary } from "../../../lib/i18n";
|
import { useDictionary } from "../../../lib/i18n";
|
||||||
|
|
||||||
import { dayjs } from "../../../context/Locale";
|
import { dayjs } from "../../../context/Locale";
|
||||||
import { MessageObject } from "../../../context/revoltjs/util";
|
|
||||||
|
|
||||||
import Tooltip from "../Tooltip";
|
import Tooltip from "../Tooltip";
|
||||||
|
|
||||||
|
@ -192,57 +193,54 @@ export const DetailBase = styled.div`
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
export function MessageDetail({
|
export const MessageDetail = observer(
|
||||||
message,
|
({ message, position }: { message: Message; position: "left" | "top" }) => {
|
||||||
position,
|
const dict = useDictionary();
|
||||||
}: {
|
|
||||||
message: MessageObject;
|
|
||||||
position: "left" | "top";
|
|
||||||
}) {
|
|
||||||
const dict = useDictionary();
|
|
||||||
|
|
||||||
if (position === "left") {
|
if (position === "left") {
|
||||||
if (message.edited) {
|
if (message.edited) {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<time className="copyTime">
|
||||||
|
<i className="copyBracket">[</i>
|
||||||
|
{dayjs(decodeTime(message._id)).format(
|
||||||
|
dict.dayjs.timeFormat,
|
||||||
|
)}
|
||||||
|
<i className="copyBracket">]</i>
|
||||||
|
</time>
|
||||||
|
<span className="edited">
|
||||||
|
<Tooltip
|
||||||
|
content={dayjs(message.edited).format("LLLL")}>
|
||||||
|
<Text id="app.main.channel.edited" />
|
||||||
|
</Tooltip>
|
||||||
|
</span>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<time className="copyTime">
|
<time>
|
||||||
<i className="copyBracket">[</i>
|
<i className="copyBracket">[</i>
|
||||||
{dayjs(decodeTime(message._id)).format(
|
{dayjs(decodeTime(message._id)).format(
|
||||||
dict.dayjs.timeFormat,
|
dict.dayjs.timeFormat,
|
||||||
)}
|
)}
|
||||||
<i className="copyBracket">]</i>
|
<i className="copyBracket">]</i>
|
||||||
</time>
|
</time>
|
||||||
<span className="edited">
|
|
||||||
<Tooltip content={dayjs(message.edited).format("LLLL")}>
|
|
||||||
<Text id="app.main.channel.edited" />
|
|
||||||
</Tooltip>
|
|
||||||
</span>
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<time>
|
|
||||||
<i className="copyBracket">[</i>
|
|
||||||
{dayjs(decodeTime(message._id)).format(
|
|
||||||
dict.dayjs.timeFormat,
|
|
||||||
)}
|
|
||||||
<i className="copyBracket">]</i>
|
|
||||||
</time>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<DetailBase>
|
<DetailBase>
|
||||||
<time>{dayjs(decodeTime(message._id)).calendar()}</time>
|
<time>{dayjs(decodeTime(message._id)).calendar()}</time>
|
||||||
{message.edited && (
|
{message.edited && (
|
||||||
<Tooltip content={dayjs(message.edited).format("LLLL")}>
|
<Tooltip content={dayjs(message.edited).format("LLLL")}>
|
||||||
<span className="edited">
|
<span className="edited">
|
||||||
<Text id="app.main.channel.edited" />
|
<Text id="app.main.channel.edited" />
|
||||||
</span>
|
</span>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
)}
|
)}
|
||||||
</DetailBase>
|
</DetailBase>
|
||||||
);
|
);
|
||||||
}
|
},
|
||||||
|
);
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import { Send, HappyAlt, ShieldX } from "@styled-icons/boxicons-solid";
|
import { Send, ShieldX } from "@styled-icons/boxicons-solid";
|
||||||
import { Styleshare } from "@styled-icons/simple-icons";
|
|
||||||
import Axios, { CancelTokenSource } from "axios";
|
import Axios, { CancelTokenSource } from "axios";
|
||||||
import { ChannelPermission } from "revolt.js/dist/api/permissions";
|
import { ChannelPermission } from "revolt.js/dist/api/permissions";
|
||||||
|
import { Channel } from "revolt.js/dist/maps/Channels";
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
import { ulid } from "ulid";
|
import { ulid } from "ulid";
|
||||||
|
|
||||||
|
@ -19,7 +19,6 @@ import {
|
||||||
SMOOTH_SCROLL_ON_RECEIVE,
|
SMOOTH_SCROLL_ON_RECEIVE,
|
||||||
} from "../../../lib/renderer/Singleton";
|
} from "../../../lib/renderer/Singleton";
|
||||||
|
|
||||||
import { Channel } from "../../../mobx";
|
|
||||||
import { dispatch, getState } from "../../../redux";
|
import { dispatch, getState } from "../../../redux";
|
||||||
import { Reply } from "../../../redux/reducers/queue";
|
import { Reply } from "../../../redux/reducers/queue";
|
||||||
|
|
||||||
|
@ -31,7 +30,6 @@ import {
|
||||||
uploadFile,
|
uploadFile,
|
||||||
} from "../../../context/revoltjs/FileUploads";
|
} from "../../../context/revoltjs/FileUploads";
|
||||||
import { AppContext } from "../../../context/revoltjs/RevoltClient";
|
import { AppContext } from "../../../context/revoltjs/RevoltClient";
|
||||||
import { useChannelPermission } from "../../../context/revoltjs/hooks";
|
|
||||||
import { takeError } from "../../../context/revoltjs/util";
|
import { takeError } from "../../../context/revoltjs/util";
|
||||||
|
|
||||||
import IconButton from "../../ui/IconButton";
|
import IconButton from "../../ui/IconButton";
|
||||||
|
@ -123,8 +121,7 @@ export default function MessageBox({ channel }: Props) {
|
||||||
const client = useContext(AppContext);
|
const client = useContext(AppContext);
|
||||||
const translate = useTranslation();
|
const translate = useTranslation();
|
||||||
|
|
||||||
const permissions = useChannelPermission(channel._id);
|
if (!(channel.permission & ChannelPermission.SendMessage)) {
|
||||||
if (!(permissions & ChannelPermission.SendMessage)) {
|
|
||||||
return (
|
return (
|
||||||
<Base>
|
<Base>
|
||||||
<Blocked>
|
<Blocked>
|
||||||
|
@ -194,7 +191,8 @@ export default function MessageBox({ channel }: Props) {
|
||||||
playSound("outbound");
|
playSound("outbound");
|
||||||
|
|
||||||
const nonce = ulid();
|
const nonce = ulid();
|
||||||
dispatch({
|
// ! FIXME: queued
|
||||||
|
/*dispatch({
|
||||||
type: "QUEUE_ADD",
|
type: "QUEUE_ADD",
|
||||||
nonce,
|
nonce,
|
||||||
channel: channel._id,
|
channel: channel._id,
|
||||||
|
@ -206,7 +204,7 @@ export default function MessageBox({ channel }: Props) {
|
||||||
content,
|
content,
|
||||||
replies,
|
replies,
|
||||||
},
|
},
|
||||||
});
|
});*/
|
||||||
|
|
||||||
defer(() =>
|
defer(() =>
|
||||||
SingletonMessageRenderer.jumpToBottom(
|
SingletonMessageRenderer.jumpToBottom(
|
||||||
|
@ -216,7 +214,7 @@ export default function MessageBox({ channel }: Props) {
|
||||||
);
|
);
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await client.channels.sendMessage(channel._id, {
|
await channel.sendMessage({
|
||||||
content,
|
content,
|
||||||
nonce,
|
nonce,
|
||||||
replies,
|
replies,
|
||||||
|
@ -290,7 +288,7 @@ export default function MessageBox({ channel }: Props) {
|
||||||
|
|
||||||
const nonce = ulid();
|
const nonce = ulid();
|
||||||
try {
|
try {
|
||||||
await client.channels.sendMessage(channel._id, {
|
await channel.sendMessage({
|
||||||
content,
|
content,
|
||||||
nonce,
|
nonce,
|
||||||
replies,
|
replies,
|
||||||
|
@ -360,7 +358,7 @@ export default function MessageBox({ channel }: Props) {
|
||||||
users: { type: "channel", id: channel._id },
|
users: { type: "channel", id: channel._id },
|
||||||
channels:
|
channels:
|
||||||
channel.channel_type === "TextChannel"
|
channel.channel_type === "TextChannel"
|
||||||
? { server: channel.server! }
|
? { server: channel.server_id! }
|
||||||
: undefined,
|
: undefined,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -403,7 +401,7 @@ export default function MessageBox({ channel }: Props) {
|
||||||
setReplies={setReplies}
|
setReplies={setReplies}
|
||||||
/>
|
/>
|
||||||
<Base>
|
<Base>
|
||||||
{permissions & ChannelPermission.UploadFiles ? (
|
{channel.permission & ChannelPermission.UploadFiles ? (
|
||||||
<Action>
|
<Action>
|
||||||
<FileUploader
|
<FileUploader
|
||||||
size={24}
|
size={24}
|
||||||
|
@ -475,9 +473,7 @@ export default function MessageBox({ channel }: Props) {
|
||||||
placeholder={
|
placeholder={
|
||||||
channel.channel_type === "DirectMessage"
|
channel.channel_type === "DirectMessage"
|
||||||
? translate("app.main.channel.message_who", {
|
? translate("app.main.channel.message_who", {
|
||||||
person: client.users.get(
|
person: channel.recipient?.username,
|
||||||
client.channels.getRecipient(channel._id),
|
|
||||||
)?.username,
|
|
||||||
})
|
})
|
||||||
: channel.channel_type === "SavedMessages"
|
: channel.channel_type === "SavedMessages"
|
||||||
? translate("app.main.channel.message_saved")
|
? translate("app.main.channel.message_saved")
|
||||||
|
|
|
@ -1,14 +1,13 @@
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
|
import { Message } from "revolt.js/dist/maps/Messages";
|
||||||
|
import { User } from "revolt.js/dist/maps/Users";
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
|
|
||||||
import { attachContextMenu } from "preact-context-menu";
|
import { attachContextMenu } from "preact-context-menu";
|
||||||
|
|
||||||
import { TextReact } from "../../../lib/i18n";
|
import { TextReact } from "../../../lib/i18n";
|
||||||
|
|
||||||
import { User } from "../../../mobx";
|
import { useClient } from "../../../context/revoltjs/RevoltClient";
|
||||||
import { useData } from "../../../mobx/State";
|
|
||||||
|
|
||||||
import { MessageObject } from "../../../context/revoltjs/util";
|
|
||||||
|
|
||||||
import UserShort from "../user/UserShort";
|
import UserShort from "../user/UserShort";
|
||||||
import MessageBase, { MessageDetail, MessageInfo } from "./MessageBase";
|
import MessageBase, { MessageDetail, MessageInfo } from "./MessageBase";
|
||||||
|
@ -36,14 +35,14 @@ type SystemMessageParsed =
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
attachContext?: boolean;
|
attachContext?: boolean;
|
||||||
message: MessageObject;
|
message: Message;
|
||||||
highlight?: boolean;
|
highlight?: boolean;
|
||||||
hideInfo?: boolean;
|
hideInfo?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const SystemMessage = observer(
|
export const SystemMessage = observer(
|
||||||
({ attachContext, message, highlight, hideInfo }: Props) => {
|
({ attachContext, message, highlight, hideInfo }: Props) => {
|
||||||
const store = useData();
|
const client = useClient();
|
||||||
|
|
||||||
let data: SystemMessageParsed;
|
let data: SystemMessageParsed;
|
||||||
const content = message.content;
|
const content = message.content;
|
||||||
|
@ -56,8 +55,8 @@ export const SystemMessage = observer(
|
||||||
case "user_remove":
|
case "user_remove":
|
||||||
data = {
|
data = {
|
||||||
type: content.type,
|
type: content.type,
|
||||||
user: store.users.get(content.id)!,
|
user: client.users.get(content.id)!,
|
||||||
by: store.users.get(content.by)!,
|
by: client.users.get(content.by)!,
|
||||||
};
|
};
|
||||||
break;
|
break;
|
||||||
case "user_joined":
|
case "user_joined":
|
||||||
|
@ -66,21 +65,21 @@ export const SystemMessage = observer(
|
||||||
case "user_banned":
|
case "user_banned":
|
||||||
data = {
|
data = {
|
||||||
type: content.type,
|
type: content.type,
|
||||||
user: store.users.get(content.id)!,
|
user: client.users.get(content.id)!,
|
||||||
};
|
};
|
||||||
break;
|
break;
|
||||||
case "channel_renamed":
|
case "channel_renamed":
|
||||||
data = {
|
data = {
|
||||||
type: "channel_renamed",
|
type: "channel_renamed",
|
||||||
name: content.name,
|
name: content.name,
|
||||||
by: store.users.get(content.by)!,
|
by: client.users.get(content.by)!,
|
||||||
};
|
};
|
||||||
break;
|
break;
|
||||||
case "channel_description_changed":
|
case "channel_description_changed":
|
||||||
case "channel_icon_changed":
|
case "channel_icon_changed":
|
||||||
data = {
|
data = {
|
||||||
type: content.type,
|
type: content.type,
|
||||||
by: store.users.get(content.by)!,
|
by: client.users.get(content.by)!,
|
||||||
};
|
};
|
||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { Attachment as AttachmentRJS } from "revolt.js/dist/api/objects";
|
import { Attachment as AttachmentI } from "revolt-api/types/Autumn";
|
||||||
|
|
||||||
import styles from "./Attachment.module.scss";
|
import styles from "./Attachment.module.scss";
|
||||||
import classNames from "classnames";
|
import classNames from "classnames";
|
||||||
|
@ -13,7 +13,7 @@ import Spoiler from "./Spoiler";
|
||||||
import TextFile from "./TextFile";
|
import TextFile from "./TextFile";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
attachment: AttachmentRJS;
|
attachment: AttachmentI;
|
||||||
hasContent: boolean;
|
hasContent: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -5,7 +5,7 @@ import {
|
||||||
Headphone,
|
Headphone,
|
||||||
Video,
|
Video,
|
||||||
} from "@styled-icons/boxicons-regular";
|
} from "@styled-icons/boxicons-regular";
|
||||||
import { Attachment } from "revolt.js/dist/api/objects";
|
import { Attachment } from "revolt-api/types/Autumn";
|
||||||
|
|
||||||
import styles from "./AttachmentActions.module.scss";
|
import styles from "./AttachmentActions.module.scss";
|
||||||
import classNames from "classnames";
|
import classNames from "classnames";
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
import { Attachment } from "revolt.js/dist/api/objects";
|
import { Attachment } from "revolt-api/types/Autumn";
|
||||||
|
|
||||||
import styles from "./Attachment.module.scss";
|
import styles from "./Attachment.module.scss";
|
||||||
import { useContext, useEffect, useState } from "preact/hooks";
|
import { useContext, useEffect, useState } from "preact/hooks";
|
||||||
|
|
|
@ -14,7 +14,6 @@ import { StateUpdater, useEffect } from "preact/hooks";
|
||||||
import { internalSubscribe } from "../../../../lib/eventEmitter";
|
import { internalSubscribe } from "../../../../lib/eventEmitter";
|
||||||
import { useRenderState } from "../../../../lib/renderer/Singleton";
|
import { useRenderState } from "../../../../lib/renderer/Singleton";
|
||||||
|
|
||||||
import { useData } from "../../../../mobx/State";
|
|
||||||
import { Reply } from "../../../../redux/reducers/queue";
|
import { Reply } from "../../../../redux/reducers/queue";
|
||||||
|
|
||||||
import IconButton from "../../../ui/IconButton";
|
import IconButton from "../../../ui/IconButton";
|
||||||
|
@ -74,9 +73,6 @@ export default observer(({ channel, replies, setReplies }: Props) => {
|
||||||
const ids = replies.map((x) => x.id);
|
const ids = replies.map((x) => x.id);
|
||||||
const messages = view.messages.filter((x) => ids.includes(x._id));
|
const messages = view.messages.filter((x) => ids.includes(x._id));
|
||||||
|
|
||||||
const store = useData();
|
|
||||||
const users = messages.map((x) => store.users.get(x.author));
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
{replies.map((reply, index) => {
|
{replies.map((reply, index) => {
|
||||||
|
@ -92,17 +88,16 @@ export default observer(({ channel, replies, setReplies }: Props) => {
|
||||||
</span>
|
</span>
|
||||||
);
|
);
|
||||||
|
|
||||||
const user = users[index];
|
|
||||||
return (
|
return (
|
||||||
<Base key={reply.id}>
|
<Base key={reply.id}>
|
||||||
<ReplyBase preview>
|
<ReplyBase preview>
|
||||||
<ReplyIcon size={22} />
|
<ReplyIcon size={22} />
|
||||||
<UserShort user={user} size={16} />
|
<UserShort user={message.author} size={16} />
|
||||||
{message.attachments &&
|
{message.attachments &&
|
||||||
message.attachments.length > 0 && (
|
message.attachments.length > 0 && (
|
||||||
<File size={16} />
|
<File size={16} />
|
||||||
)}
|
)}
|
||||||
{message.author === SYSTEM_USER_ID ? (
|
{message.author_id === SYSTEM_USER_ID ? (
|
||||||
<SystemMessage message={message} />
|
<SystemMessage message={message} />
|
||||||
) : (
|
) : (
|
||||||
<Markdown
|
<Markdown
|
||||||
|
|
|
@ -1,22 +1,12 @@
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { User } from "revolt.js";
|
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
|
|
||||||
import { Text } from "preact-i18n";
|
import { Text } from "preact-i18n";
|
||||||
import { useContext } from "preact/hooks";
|
|
||||||
|
|
||||||
import { TextReact } from "../../../../lib/i18n";
|
|
||||||
|
|
||||||
import { useData } from "../../../../mobx/State";
|
|
||||||
import { connectState } from "../../../../redux/connector";
|
import { connectState } from "../../../../redux/connector";
|
||||||
import { TypingUser } from "../../../../redux/reducers/typing";
|
import { TypingUser } from "../../../../redux/reducers/typing";
|
||||||
|
|
||||||
import {
|
import { useClient } from "../../../../context/revoltjs/RevoltClient";
|
||||||
AppContext,
|
|
||||||
useClient,
|
|
||||||
} from "../../../../context/revoltjs/RevoltClient";
|
|
||||||
|
|
||||||
import { Username } from "../../user/UserShort";
|
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
typing?: TypingUser[];
|
typing?: TypingUser[];
|
||||||
|
@ -68,9 +58,8 @@ const Base = styled.div`
|
||||||
export const TypingIndicator = observer(({ typing }: Props) => {
|
export const TypingIndicator = observer(({ typing }: Props) => {
|
||||||
if (typing && typing.length > 0) {
|
if (typing && typing.length > 0) {
|
||||||
const client = useClient();
|
const client = useClient();
|
||||||
const store = useData();
|
|
||||||
const users = typing
|
const users = typing
|
||||||
.map((x) => store.users.get(x.id)!)
|
.map((x) => client.users.get(x.id)!)
|
||||||
.filter((x) => typeof x !== "undefined");
|
.filter((x) => typeof x !== "undefined");
|
||||||
|
|
||||||
users.sort((a, b) =>
|
users.sort((a, b) =>
|
||||||
|
@ -113,11 +102,7 @@ export const TypingIndicator = observer(({ typing }: Props) => {
|
||||||
{users.map((user) => (
|
{users.map((user) => (
|
||||||
<img
|
<img
|
||||||
loading="eager"
|
loading="eager"
|
||||||
src={client.users.getAvatarURL(
|
src={user.generateAvatarURL({ max_side: 256 })}
|
||||||
user._id,
|
|
||||||
{ max_side: 256 },
|
|
||||||
true,
|
|
||||||
)}
|
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { Embed as EmbedRJS } from "revolt.js/dist/api/objects";
|
import { Embed as EmbedI } from "revolt-api/types/January";
|
||||||
|
|
||||||
import styles from "./Embed.module.scss";
|
import styles from "./Embed.module.scss";
|
||||||
import classNames from "classnames";
|
import classNames from "classnames";
|
||||||
|
@ -11,7 +11,7 @@ import { MessageAreaWidthContext } from "../../../../pages/channels/messaging/Me
|
||||||
import EmbedMedia from "./EmbedMedia";
|
import EmbedMedia from "./EmbedMedia";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
embed: EmbedRJS;
|
embed: EmbedI;
|
||||||
}
|
}
|
||||||
|
|
||||||
const MAX_EMBED_WIDTH = 480;
|
const MAX_EMBED_WIDTH = 480;
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { Embed } from "revolt.js/dist/api/objects";
|
import { Embed } from "revolt-api/types/January";
|
||||||
|
|
||||||
import styles from "./Embed.module.scss";
|
import styles from "./Embed.module.scss";
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { LinkExternal } from "@styled-icons/boxicons-regular";
|
import { LinkExternal } from "@styled-icons/boxicons-regular";
|
||||||
import { EmbedImage } from "revolt.js/dist/api/objects";
|
import { EmbedImage } from "revolt-api/types/January";
|
||||||
|
|
||||||
import styles from "./Embed.module.scss";
|
import styles from "./Embed.module.scss";
|
||||||
|
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { User } from "../../../mobx";
|
import { User } from "revolt.js/dist/maps/Users";
|
||||||
|
|
||||||
import Checkbox, { CheckboxProps } from "../../ui/Checkbox";
|
import Checkbox, { CheckboxProps } from "../../ui/Checkbox";
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import { Cog } from "@styled-icons/boxicons-solid";
|
import { Cog } from "@styled-icons/boxicons-solid";
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { Link } from "react-router-dom";
|
import { Link } from "react-router-dom";
|
||||||
|
import { User } from "revolt.js/dist/maps/Users";
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
|
|
||||||
import { openContextMenu } from "preact-context-menu";
|
import { openContextMenu } from "preact-context-menu";
|
||||||
|
@ -9,15 +10,12 @@ import { Localizer } from "preact-i18n";
|
||||||
|
|
||||||
import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
|
import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
|
||||||
|
|
||||||
import { User } from "../../../mobx";
|
|
||||||
|
|
||||||
import { useIntermediate } from "../../../context/intermediate/Intermediate";
|
import { useIntermediate } from "../../../context/intermediate/Intermediate";
|
||||||
|
|
||||||
import Header from "../../ui/Header";
|
import Header from "../../ui/Header";
|
||||||
import IconButton from "../../ui/IconButton";
|
import IconButton from "../../ui/IconButton";
|
||||||
|
|
||||||
import Tooltip from "../Tooltip";
|
import Tooltip from "../Tooltip";
|
||||||
import UserIcon from "./UserIcon";
|
|
||||||
import UserStatus from "./UserStatus";
|
import UserStatus from "./UserStatus";
|
||||||
|
|
||||||
const HeaderBase = styled.div`
|
const HeaderBase = styled.div`
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
|
import { User } from "revolt.js/dist/maps/Users";
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
|
|
||||||
import { User } from "../../../mobx";
|
|
||||||
|
|
||||||
import { Children } from "../../../types/Preact";
|
import { Children } from "../../../types/Preact";
|
||||||
import Tooltip from "../Tooltip";
|
import Tooltip from "../Tooltip";
|
||||||
import { Username } from "./UserShort";
|
import { Username } from "./UserShort";
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import { MicrophoneOff } from "@styled-icons/boxicons-regular";
|
import { MicrophoneOff } from "@styled-icons/boxicons-regular";
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { Users } from "revolt.js/dist/api/objects";
|
import { Presence } from "revolt-api/types/Users";
|
||||||
|
import { User } from "revolt.js/dist/maps/Users";
|
||||||
import styled, { css } from "styled-components";
|
import styled, { css } from "styled-components";
|
||||||
|
|
||||||
import { useContext } from "preact/hooks";
|
import { useContext } from "preact/hooks";
|
||||||
|
@ -8,7 +9,6 @@ import { useContext } from "preact/hooks";
|
||||||
import { ThemeContext } from "../../../context/Theme";
|
import { ThemeContext } from "../../../context/Theme";
|
||||||
import { AppContext } from "../../../context/revoltjs/RevoltClient";
|
import { AppContext } from "../../../context/revoltjs/RevoltClient";
|
||||||
|
|
||||||
import { User } from "../../../mobx";
|
|
||||||
import IconBase, { IconBaseProps } from "../IconBase";
|
import IconBase, { IconBaseProps } from "../IconBase";
|
||||||
import fallback from "../assets/user.png";
|
import fallback from "../assets/user.png";
|
||||||
|
|
||||||
|
@ -22,10 +22,10 @@ interface Props extends IconBaseProps<User> {
|
||||||
export function useStatusColour(user?: User) {
|
export function useStatusColour(user?: User) {
|
||||||
const theme = useContext(ThemeContext);
|
const theme = useContext(ThemeContext);
|
||||||
|
|
||||||
return user?.online && user?.status?.presence !== Users.Presence.Invisible
|
return user?.online && user?.status?.presence !== Presence.Invisible
|
||||||
? user?.status?.presence === Users.Presence.Idle
|
? user?.status?.presence === Presence.Idle
|
||||||
? theme["status-away"]
|
? theme["status-away"]
|
||||||
: user?.status?.presence === Users.Presence.Busy
|
: user?.status?.presence === Presence.Busy
|
||||||
? theme["status-busy"]
|
? theme["status-busy"]
|
||||||
: theme["status-online"]
|
: theme["status-online"]
|
||||||
: theme["status-invisible"];
|
: theme["status-invisible"];
|
||||||
|
@ -72,8 +72,7 @@ export default observer(
|
||||||
target?.avatar ?? attachment,
|
target?.avatar ?? attachment,
|
||||||
{ max_side: 256 },
|
{ max_side: 256 },
|
||||||
animate,
|
animate,
|
||||||
) ??
|
) ?? (target ? target.defaultAvatarURL : fallback);
|
||||||
(target ? client.users.getDefaultAvatarURL(target._id) : fallback);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<IconBase
|
<IconBase
|
||||||
|
|
|
@ -1,9 +1,8 @@
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
|
import { User } from "revolt.js/dist/maps/Users";
|
||||||
|
|
||||||
import { Text } from "preact-i18n";
|
import { Text } from "preact-i18n";
|
||||||
|
|
||||||
import { User } from "../../../mobx";
|
|
||||||
|
|
||||||
import UserIcon from "./UserIcon";
|
import UserIcon from "./UserIcon";
|
||||||
|
|
||||||
export const Username = observer(
|
export const Username = observer(
|
||||||
|
|
|
@ -1,9 +1,9 @@
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { Users } from "revolt.js/dist/api/objects";
|
import { Presence } from "revolt-api/types/Users";
|
||||||
|
import { User } from "revolt.js/dist/maps/Users";
|
||||||
|
|
||||||
import { Text } from "preact-i18n";
|
import { Text } from "preact-i18n";
|
||||||
|
|
||||||
import { User } from "../../../mobx";
|
|
||||||
import Tooltip from "../Tooltip";
|
import Tooltip from "../Tooltip";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
|
@ -25,15 +25,15 @@ export default observer(({ user, tooltip }: Props) => {
|
||||||
return <>{user.status.text}</>;
|
return <>{user.status.text}</>;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (user.status?.presence === Users.Presence.Busy) {
|
if (user.status?.presence === Presence.Busy) {
|
||||||
return <Text id="app.status.busy" />;
|
return <Text id="app.status.busy" />;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (user.status?.presence === Users.Presence.Idle) {
|
if (user.status?.presence === Presence.Idle) {
|
||||||
return <Text id="app.status.idle" />;
|
return <Text id="app.status.idle" />;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (user.status?.presence === Users.Presence.Invisible) {
|
if (user.status?.presence === Presence.Invisible) {
|
||||||
return <Text id="app.status.offline" />;
|
return <Text id="app.status.offline" />;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,12 +1,10 @@
|
||||||
import { Search } from "@styled-icons/boxicons-regular";
|
import { Message, Group } from "@styled-icons/boxicons-solid";
|
||||||
import { Message, Group, Inbox } from "@styled-icons/boxicons-solid";
|
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { useHistory, useLocation } from "react-router";
|
import { useHistory, useLocation } from "react-router";
|
||||||
import styled, { css } from "styled-components";
|
import styled, { css } from "styled-components";
|
||||||
|
|
||||||
import ConditionalLink from "../../lib/ConditionalLink";
|
import ConditionalLink from "../../lib/ConditionalLink";
|
||||||
|
|
||||||
import { useData } from "../../mobx/State";
|
|
||||||
import { connectState } from "../../redux/connector";
|
import { connectState } from "../../redux/connector";
|
||||||
import { LastOpened } from "../../redux/reducers/last_opened";
|
import { LastOpened } from "../../redux/reducers/last_opened";
|
||||||
|
|
||||||
|
@ -55,8 +53,7 @@ interface Props {
|
||||||
|
|
||||||
export const BottomNavigation = observer(({ lastOpened }: Props) => {
|
export const BottomNavigation = observer(({ lastOpened }: Props) => {
|
||||||
const client = useClient();
|
const client = useClient();
|
||||||
const store = useData();
|
const user = client.users.get(client.user!._id);
|
||||||
const user = store.users.get(client.user!._id);
|
|
||||||
|
|
||||||
const history = useHistory();
|
const history = useHistory();
|
||||||
const path = useLocation().pathname;
|
const path = useLocation().pathname;
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
import { X, Crown } from "@styled-icons/boxicons-regular";
|
import { X, Crown } from "@styled-icons/boxicons-regular";
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { Channels, Users } from "revolt.js/dist/api/objects";
|
import { Presence } from "revolt-api/types/Users";
|
||||||
|
import { Channel } from "revolt.js/dist/maps/Channels";
|
||||||
|
import { User } from "revolt.js/dist/maps/Users";
|
||||||
|
|
||||||
import styles from "./Item.module.scss";
|
import styles from "./Item.module.scss";
|
||||||
import classNames from "classnames";
|
import classNames from "classnames";
|
||||||
|
@ -10,8 +12,6 @@ import { Localizer, Text } from "preact-i18n";
|
||||||
import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
|
import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
|
||||||
import { stopPropagation } from "../../../lib/stopPropagation";
|
import { stopPropagation } from "../../../lib/stopPropagation";
|
||||||
|
|
||||||
import { Channel, User } from "../../../mobx";
|
|
||||||
|
|
||||||
import { useIntermediate } from "../../../context/intermediate/Intermediate";
|
import { useIntermediate } from "../../../context/intermediate/Intermediate";
|
||||||
|
|
||||||
import ChannelIcon from "../../common/ChannelIcon";
|
import ChannelIcon from "../../common/ChannelIcon";
|
||||||
|
@ -51,8 +51,7 @@ export const UserButton = observer((props: UserProps) => {
|
||||||
data-alert={typeof alert === "string"}
|
data-alert={typeof alert === "string"}
|
||||||
data-online={
|
data-online={
|
||||||
typeof channel !== "undefined" ||
|
typeof channel !== "undefined" ||
|
||||||
(user.online &&
|
(user.online && user.status?.presence !== Presence.Invisible)
|
||||||
user.status?.presence !== Users.Presence.Invisible)
|
|
||||||
}
|
}
|
||||||
onContextMenu={attachContextMenu("Menu", {
|
onContextMenu={attachContextMenu("Menu", {
|
||||||
user: user._id,
|
user: user._id,
|
||||||
|
@ -82,7 +81,7 @@ export const UserButton = observer((props: UserProps) => {
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.button}>
|
<div className={styles.button}>
|
||||||
{context?.channel_type === "Group" &&
|
{context?.channel_type === "Group" &&
|
||||||
context.owner === user._id && (
|
context.owner_id === user._id && (
|
||||||
<Localizer>
|
<Localizer>
|
||||||
<Tooltip
|
<Tooltip
|
||||||
content={<Text id="app.main.groups.owner" />}>
|
content={<Text id="app.main.groups.owner" />}>
|
||||||
|
|
|
@ -6,8 +6,7 @@ import {
|
||||||
} from "@styled-icons/boxicons-solid";
|
} from "@styled-icons/boxicons-solid";
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { Link, Redirect, useLocation, useParams } from "react-router-dom";
|
import { Link, Redirect, useLocation, useParams } from "react-router-dom";
|
||||||
import { Channels } from "revolt.js/dist/api/objects";
|
import { RelationshipStatus } from "revolt-api/types/Users";
|
||||||
import { Users as UsersNS } from "revolt.js/dist/api/objects";
|
|
||||||
|
|
||||||
import { Text } from "preact-i18n";
|
import { Text } from "preact-i18n";
|
||||||
import { useContext, useEffect } from "preact/hooks";
|
import { useContext, useEffect } from "preact/hooks";
|
||||||
|
@ -16,7 +15,6 @@ import ConditionalLink from "../../../lib/ConditionalLink";
|
||||||
import PaintCounter from "../../../lib/PaintCounter";
|
import PaintCounter from "../../../lib/PaintCounter";
|
||||||
import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
|
import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
|
||||||
|
|
||||||
import { useData } from "../../../mobx/State";
|
|
||||||
import { dispatch } from "../../../redux";
|
import { dispatch } from "../../../redux";
|
||||||
import { connectState } from "../../../redux/connector";
|
import { connectState } from "../../../redux/connector";
|
||||||
import { Unreads } from "../../../redux/reducers/unreads";
|
import { Unreads } from "../../../redux/reducers/unreads";
|
||||||
|
@ -42,8 +40,7 @@ const HomeSidebar = observer((props: Props) => {
|
||||||
const { channel } = useParams<{ channel: string }>();
|
const { channel } = useParams<{ channel: string }>();
|
||||||
const { openScreen } = useIntermediate();
|
const { openScreen } = useIntermediate();
|
||||||
|
|
||||||
const store = useData();
|
const channels = [...client.channels.values()]
|
||||||
const channels = [...store.channels.values()]
|
|
||||||
.filter(
|
.filter(
|
||||||
(x) =>
|
(x) =>
|
||||||
x.channel_type === "DirectMessage" ||
|
x.channel_type === "DirectMessage" ||
|
||||||
|
@ -51,7 +48,7 @@ const HomeSidebar = observer((props: Props) => {
|
||||||
)
|
)
|
||||||
.map((x) => mapChannelWithUnread(x, props.unreads));
|
.map((x) => mapChannelWithUnread(x, props.unreads));
|
||||||
|
|
||||||
const obj = store.channels.get(channel);
|
const obj = client.channels.get(channel);
|
||||||
if (channel && !obj) return <Redirect to="/" />;
|
if (channel && !obj) return <Redirect to="/" />;
|
||||||
if (obj) useUnreads({ ...props, channel: obj });
|
if (obj) useUnreads({ ...props, channel: obj });
|
||||||
|
|
||||||
|
@ -87,10 +84,10 @@ const HomeSidebar = observer((props: Props) => {
|
||||||
<ButtonItem
|
<ButtonItem
|
||||||
active={pathname === "/friends"}
|
active={pathname === "/friends"}
|
||||||
alert={
|
alert={
|
||||||
typeof [...store.users.values()].find(
|
typeof [...client.users.values()].find(
|
||||||
(user) =>
|
(user) =>
|
||||||
user?.relationship ===
|
user?.relationship ===
|
||||||
UsersNS.Relationship.Incoming,
|
RelationshipStatus.Incoming,
|
||||||
) !== "undefined"
|
) !== "undefined"
|
||||||
? "unread"
|
? "unread"
|
||||||
: undefined
|
: undefined
|
||||||
|
@ -139,11 +136,7 @@ const HomeSidebar = observer((props: Props) => {
|
||||||
let user;
|
let user;
|
||||||
if (x.channel.channel_type === "DirectMessage") {
|
if (x.channel.channel_type === "DirectMessage") {
|
||||||
if (!x.channel.active) return null;
|
if (!x.channel.active) return null;
|
||||||
|
user = x.channel.recipient;
|
||||||
const recipient = client.channels.getRecipient(
|
|
||||||
x.channel._id,
|
|
||||||
);
|
|
||||||
user = store.users.get(recipient);
|
|
||||||
|
|
||||||
if (!user) {
|
if (!user) {
|
||||||
console.warn(
|
console.warn(
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import { Plus } from "@styled-icons/boxicons-regular";
|
import { Plus } from "@styled-icons/boxicons-regular";
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { useLocation, useParams } from "react-router-dom";
|
import { useLocation, useParams } from "react-router-dom";
|
||||||
import { Channel, Servers, Users } from "revolt.js/dist/api/objects";
|
import { RelationshipStatus } from "revolt-api/types/Users";
|
||||||
import styled, { css } from "styled-components";
|
import styled, { css } from "styled-components";
|
||||||
|
|
||||||
import { attachContextMenu, openContextMenu } from "preact-context-menu";
|
import { attachContextMenu, openContextMenu } from "preact-context-menu";
|
||||||
|
@ -10,7 +10,6 @@ import ConditionalLink from "../../../lib/ConditionalLink";
|
||||||
import PaintCounter from "../../../lib/PaintCounter";
|
import PaintCounter from "../../../lib/PaintCounter";
|
||||||
import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
|
import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
|
||||||
|
|
||||||
import { useData } from "../../../mobx/State";
|
|
||||||
import { connectState } from "../../../redux/connector";
|
import { connectState } from "../../../redux/connector";
|
||||||
import { LastOpened } from "../../../redux/reducers/last_opened";
|
import { LastOpened } from "../../../redux/reducers/last_opened";
|
||||||
import { Unreads } from "../../../redux/reducers/unreads";
|
import { Unreads } from "../../../redux/reducers/unreads";
|
||||||
|
@ -175,14 +174,12 @@ interface Props {
|
||||||
}
|
}
|
||||||
|
|
||||||
export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
|
export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
|
||||||
const store = useData();
|
|
||||||
const client = useClient();
|
const client = useClient();
|
||||||
const self = store.users.get(client.user!._id);
|
|
||||||
|
|
||||||
const { server: server_id } = useParams<{ server?: string }>();
|
const { server: server_id } = useParams<{ server?: string }>();
|
||||||
const server = server_id ? store.servers.get(server_id) : undefined;
|
const server = server_id ? client.servers.get(server_id) : undefined;
|
||||||
const activeServers = [...store.servers.values()];
|
const activeServers = [...client.servers.values()];
|
||||||
const channels = [...store.channels.values()].map((x) =>
|
const channels = [...client.channels.values()].map((x) =>
|
||||||
mapChannelWithUnread(x, unreads),
|
mapChannelWithUnread(x, unreads),
|
||||||
);
|
);
|
||||||
|
|
||||||
|
@ -192,7 +189,7 @@ export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
|
||||||
|
|
||||||
const servers = activeServers.map((server) => {
|
const servers = activeServers.map((server) => {
|
||||||
let alertCount = 0;
|
let alertCount = 0;
|
||||||
for (const id of server.channels) {
|
for (const id of server.channel_ids) {
|
||||||
const channel = channels.find((x) => x.channel?._id === id);
|
const channel = channels.find((x) => x.channel?._id === id);
|
||||||
if (channel?.alertCount) {
|
if (channel?.alertCount) {
|
||||||
alertCount += channel.alertCount;
|
alertCount += channel.alertCount;
|
||||||
|
@ -201,7 +198,7 @@ export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
|
||||||
|
|
||||||
return {
|
return {
|
||||||
server,
|
server,
|
||||||
unread: (typeof server.channels.find((x) =>
|
unread: (typeof server.channel_ids.find((x) =>
|
||||||
unreadChannels.includes(x),
|
unreadChannels.includes(x),
|
||||||
) !== "undefined"
|
) !== "undefined"
|
||||||
? alertCount > 0
|
? alertCount > 0
|
||||||
|
@ -230,8 +227,8 @@ export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (
|
if (
|
||||||
[...store.users.values()].find(
|
[...client.users.values()].find(
|
||||||
(x) => x.relationship === Users.Relationship.Incoming,
|
(x) => x.relationship === RelationshipStatus.Incoming,
|
||||||
)
|
)
|
||||||
) {
|
) {
|
||||||
alertCount++;
|
alertCount++;
|
||||||
|
@ -254,9 +251,13 @@ export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
|
||||||
onClick={() =>
|
onClick={() =>
|
||||||
homeActive && openContextMenu("Status")
|
homeActive && openContextMenu("Status")
|
||||||
}>
|
}>
|
||||||
<UserHover user={self}>
|
<UserHover user={client.user}>
|
||||||
<Icon size={42} unread={homeUnread}>
|
<Icon size={42} unread={homeUnread}>
|
||||||
<UserIcon target={self} size={32} status />
|
<UserIcon
|
||||||
|
target={client.user}
|
||||||
|
size={32}
|
||||||
|
status
|
||||||
|
/>
|
||||||
</Icon>
|
</Icon>
|
||||||
</UserHover>
|
</UserHover>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,6 +1,5 @@
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { Redirect, useParams } from "react-router";
|
import { Redirect, useParams } from "react-router";
|
||||||
import { Channels } from "revolt.js/dist/api/objects";
|
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
|
|
||||||
import { attachContextMenu } from "preact-context-menu";
|
import { attachContextMenu } from "preact-context-menu";
|
||||||
|
@ -9,11 +8,12 @@ import { useEffect } from "preact/hooks";
|
||||||
import ConditionalLink from "../../../lib/ConditionalLink";
|
import ConditionalLink from "../../../lib/ConditionalLink";
|
||||||
import PaintCounter from "../../../lib/PaintCounter";
|
import PaintCounter from "../../../lib/PaintCounter";
|
||||||
|
|
||||||
import { useData } from "../../../mobx/State";
|
|
||||||
import { dispatch } from "../../../redux";
|
import { dispatch } from "../../../redux";
|
||||||
import { connectState } from "../../../redux/connector";
|
import { connectState } from "../../../redux/connector";
|
||||||
import { Unreads } from "../../../redux/reducers/unreads";
|
import { Unreads } from "../../../redux/reducers/unreads";
|
||||||
|
|
||||||
|
import { useClient } from "../../../context/revoltjs/RevoltClient";
|
||||||
|
|
||||||
import CollapsibleSection from "../../common/CollapsibleSection";
|
import CollapsibleSection from "../../common/CollapsibleSection";
|
||||||
import ServerHeader from "../../common/ServerHeader";
|
import ServerHeader from "../../common/ServerHeader";
|
||||||
import Category from "../../ui/Category";
|
import Category from "../../ui/Category";
|
||||||
|
@ -50,14 +50,14 @@ const ServerList = styled.div`
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const ServerSidebar = observer((props: Props) => {
|
const ServerSidebar = observer((props: Props) => {
|
||||||
const store = useData();
|
const client = useClient();
|
||||||
const { server: server_id, channel: channel_id } =
|
const { server: server_id, channel: channel_id } =
|
||||||
useParams<{ server: string; channel?: string }>();
|
useParams<{ server: string; channel?: string }>();
|
||||||
|
|
||||||
const server = store.servers.get(server_id);
|
const server = client.servers.get(server_id);
|
||||||
if (!server) return <Redirect to="/" />;
|
if (!server) return <Redirect to="/" />;
|
||||||
|
|
||||||
const channel = channel_id ? store.channels.get(channel_id) : undefined;
|
const channel = channel_id ? client.channels.get(channel_id) : undefined;
|
||||||
if (channel_id && !channel) return <Redirect to={`/server/${server_id}`} />;
|
if (channel_id && !channel) return <Redirect to={`/server/${server_id}`} />;
|
||||||
if (channel) useUnreads({ ...props, channel });
|
if (channel) useUnreads({ ...props, channel });
|
||||||
|
|
||||||
|
@ -71,11 +71,11 @@ const ServerSidebar = observer((props: Props) => {
|
||||||
});
|
});
|
||||||
}, [channel_id]);
|
}, [channel_id]);
|
||||||
|
|
||||||
const uncategorised = new Set(server.channels);
|
const uncategorised = new Set(server.channel_ids);
|
||||||
const elements = [];
|
const elements = [];
|
||||||
|
|
||||||
function addChannel(id: string) {
|
function addChannel(id: string) {
|
||||||
const entry = store.channels.get(id);
|
const entry = client.channels.get(id);
|
||||||
if (!entry) return;
|
if (!entry) return;
|
||||||
|
|
||||||
const active = channel?._id === entry._id;
|
const active = channel?._id === entry._id;
|
||||||
|
|
|
@ -1,11 +1,12 @@
|
||||||
|
import { autorun } from "mobx";
|
||||||
|
import { Channel } from "revolt.js/dist/maps/Channels";
|
||||||
|
|
||||||
import { useLayoutEffect } from "preact/hooks";
|
import { useLayoutEffect } from "preact/hooks";
|
||||||
|
|
||||||
import { Channel } from "../../../mobx";
|
|
||||||
import { dispatch } from "../../../redux";
|
import { dispatch } from "../../../redux";
|
||||||
import { Unreads } from "../../../redux/reducers/unreads";
|
import { Unreads } from "../../../redux/reducers/unreads";
|
||||||
|
|
||||||
import { useClient } from "../../../context/revoltjs/RevoltClient";
|
import { useClient } from "../../../context/revoltjs/RevoltClient";
|
||||||
import { HookContext, useForceUpdate } from "../../../context/revoltjs/hooks";
|
|
||||||
|
|
||||||
type UnreadProps = {
|
type UnreadProps = {
|
||||||
channel: Channel;
|
channel: Channel;
|
||||||
|
@ -16,7 +17,10 @@ export function useUnreads({ channel, unreads }: UnreadProps) {
|
||||||
const client = useClient();
|
const client = useClient();
|
||||||
|
|
||||||
useLayoutEffect(() => {
|
useLayoutEffect(() => {
|
||||||
function checkUnread(target?: Channel) {
|
function checkUnread(
|
||||||
|
target: Channel,
|
||||||
|
last_message: Channel["last_message"],
|
||||||
|
) {
|
||||||
if (!target) return;
|
if (!target) return;
|
||||||
if (target._id !== channel._id) return;
|
if (target._id !== channel._id) return;
|
||||||
if (
|
if (
|
||||||
|
@ -46,10 +50,7 @@ export function useUnreads({ channel, unreads }: UnreadProps) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
checkUnread(channel);
|
return autorun(() => checkUnread(channel!, channel!.last_message));
|
||||||
|
|
||||||
client.channels.addListener("mutation", checkUnread);
|
|
||||||
return () => client.channels.removeListener("mutation", checkUnread);
|
|
||||||
}, [channel, unreads]);
|
}, [channel, unreads]);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,15 +1,15 @@
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { useParams } from "react-router";
|
|
||||||
import { Link } from "react-router-dom";
|
import { Link } from "react-router-dom";
|
||||||
import { User } from "revolt.js";
|
import { Presence } from "revolt-api/types/Users";
|
||||||
import { Channels, Message, Servers, Users } from "revolt.js/dist/api/objects";
|
import { Channel } from "revolt.js/dist/maps/Channels";
|
||||||
|
import Members, { Member } from "revolt.js/dist/maps/Members";
|
||||||
|
import { Message } from "revolt.js/dist/maps/Messages";
|
||||||
|
import { User } from "revolt.js/dist/maps/Users";
|
||||||
import { ClientboundNotification } from "revolt.js/dist/websocket/notifications";
|
import { ClientboundNotification } from "revolt.js/dist/websocket/notifications";
|
||||||
|
|
||||||
import { Text } from "preact-i18n";
|
import { Text } from "preact-i18n";
|
||||||
import { useContext, useEffect, useState } from "preact/hooks";
|
import { useContext, useEffect, useState } from "preact/hooks";
|
||||||
|
|
||||||
import { Channel } from "../../../mobx";
|
|
||||||
import { useData } from "../../../mobx/State";
|
|
||||||
import { getState } from "../../../redux";
|
import { getState } from "../../../redux";
|
||||||
|
|
||||||
import { useIntermediate } from "../../../context/intermediate/Intermediate";
|
import { useIntermediate } from "../../../context/intermediate/Intermediate";
|
||||||
|
@ -17,8 +17,8 @@ import {
|
||||||
AppContext,
|
AppContext,
|
||||||
ClientStatus,
|
ClientStatus,
|
||||||
StatusContext,
|
StatusContext,
|
||||||
|
useClient,
|
||||||
} from "../../../context/revoltjs/RevoltClient";
|
} from "../../../context/revoltjs/RevoltClient";
|
||||||
import { HookContext } from "../../../context/revoltjs/hooks";
|
|
||||||
|
|
||||||
import CollapsibleSection from "../../common/CollapsibleSection";
|
import CollapsibleSection from "../../common/CollapsibleSection";
|
||||||
import Button from "../../ui/Button";
|
import Button from "../../ui/Button";
|
||||||
|
@ -46,10 +46,10 @@ export const GroupMemberSidebar = observer(
|
||||||
({ channel }: { channel: Channel }) => {
|
({ channel }: { channel: Channel }) => {
|
||||||
const { openScreen } = useIntermediate();
|
const { openScreen } = useIntermediate();
|
||||||
|
|
||||||
const store = useData();
|
const client = useClient();
|
||||||
const members = channel.recipients
|
const members = channel.recipients?.filter(
|
||||||
?.map((member) => store.users.get(member)!)
|
(x) => typeof x !== "undefined",
|
||||||
.filter((x) => typeof x !== "undefined");
|
);
|
||||||
|
|
||||||
/*const voice = useContext(VoiceContext);
|
/*const voice = useContext(VoiceContext);
|
||||||
const voiceActive = voice.roomId === channel._id;
|
const voiceActive = voice.roomId === channel._id;
|
||||||
|
@ -70,14 +70,12 @@ export const GroupMemberSidebar = observer(
|
||||||
// ! FIXME: should probably rewrite all this code
|
// ! FIXME: should probably rewrite all this code
|
||||||
const l =
|
const l =
|
||||||
+(
|
+(
|
||||||
(a.online &&
|
(a!.online && a!.status?.presence !== Presence.Invisible) ??
|
||||||
a.status?.presence !== Users.Presence.Invisible) ??
|
|
||||||
false
|
false
|
||||||
) | 0;
|
) | 0;
|
||||||
const r =
|
const r =
|
||||||
+(
|
+(
|
||||||
(b.online &&
|
(b!.online && b!.status?.presence !== Presence.Invisible) ??
|
||||||
b.status?.presence !== Users.Presence.Invisible) ??
|
|
||||||
false
|
false
|
||||||
) | 0;
|
) | 0;
|
||||||
|
|
||||||
|
@ -86,14 +84,14 @@ export const GroupMemberSidebar = observer(
|
||||||
return n;
|
return n;
|
||||||
}
|
}
|
||||||
|
|
||||||
return a.username.localeCompare(b.username);
|
return a!.username.localeCompare(b!.username);
|
||||||
});
|
});
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<GenericSidebarBase>
|
<GenericSidebarBase>
|
||||||
<GenericSidebarList>
|
<GenericSidebarList>
|
||||||
<ChannelDebugInfo id={channel._id} />
|
<ChannelDebugInfo id={channel._id} />
|
||||||
<Search channel={channel._id} />
|
<Search channel={channel} />
|
||||||
|
|
||||||
{/*voiceActive && voiceParticipants.length !== 0 && (
|
{/*voiceActive && voiceParticipants.length !== 0 && (
|
||||||
<Fragment>
|
<Fragment>
|
||||||
|
@ -163,71 +161,32 @@ export const GroupMemberSidebar = observer(
|
||||||
|
|
||||||
export const ServerMemberSidebar = observer(
|
export const ServerMemberSidebar = observer(
|
||||||
({ channel }: { channel: Channel }) => {
|
({ channel }: { channel: Channel }) => {
|
||||||
const [members, setMembers] = useState<Servers.Member[] | undefined>(
|
const client = useClient();
|
||||||
undefined,
|
|
||||||
);
|
|
||||||
|
|
||||||
const store = useData();
|
|
||||||
const users = members
|
|
||||||
?.map((member) => store.users.get(member._id.user)!)
|
|
||||||
.filter((x) => typeof x !== "undefined");
|
|
||||||
|
|
||||||
const { openScreen } = useIntermediate();
|
const { openScreen } = useIntermediate();
|
||||||
const status = useContext(StatusContext);
|
const status = useContext(StatusContext);
|
||||||
const client = useContext(AppContext);
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (
|
if (status === ClientStatus.ONLINE) {
|
||||||
status === ClientStatus.ONLINE &&
|
channel.server!.fetchMembers();
|
||||||
typeof members === "undefined"
|
|
||||||
) {
|
|
||||||
store
|
|
||||||
.fetchMembers(channel.server!)
|
|
||||||
.then((members) => setMembers(members));
|
|
||||||
}
|
}
|
||||||
}, [status]);
|
}, [status]);
|
||||||
|
|
||||||
// ! FIXME: temporary code
|
let users = [...client.members.keys()]
|
||||||
useEffect(() => {
|
.filter((x) => x.server === channel.server_id)
|
||||||
function onPacket(packet: ClientboundNotification) {
|
.map((y) => client.users.get(y.user)!)
|
||||||
if (!members) return;
|
.filter((z) => typeof z !== "undefined");
|
||||||
if (packet.type === "ServerMemberJoin") {
|
|
||||||
if (packet.id !== channel.server) return;
|
|
||||||
setMembers([
|
|
||||||
...members,
|
|
||||||
{ _id: { server: packet.id, user: packet.user } },
|
|
||||||
]);
|
|
||||||
} else if (packet.type === "ServerMemberLeave") {
|
|
||||||
if (packet.id !== channel.server) return;
|
|
||||||
setMembers(
|
|
||||||
members.filter(
|
|
||||||
(x) =>
|
|
||||||
!(
|
|
||||||
x._id.user === packet.user &&
|
|
||||||
x._id.server === packet.id
|
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
client.addListener("packet", onPacket);
|
|
||||||
return () => client.removeListener("packet", onPacket);
|
|
||||||
}, [members]);
|
|
||||||
|
|
||||||
// copy paste from above
|
// copy paste from above
|
||||||
users?.sort((a, b) => {
|
users.sort((a, b) => {
|
||||||
// ! FIXME: should probably rewrite all this code
|
// ! FIXME: should probably rewrite all this code
|
||||||
const l =
|
const l =
|
||||||
+(
|
+(
|
||||||
(a.online &&
|
(a.online && a.status?.presence !== Presence.Invisible) ??
|
||||||
a.status?.presence !== Users.Presence.Invisible) ??
|
|
||||||
false
|
false
|
||||||
) | 0;
|
) | 0;
|
||||||
const r =
|
const r =
|
||||||
+(
|
+(
|
||||||
(b.online &&
|
(b.online && b.status?.presence !== Presence.Invisible) ??
|
||||||
b.status?.presence !== Users.Presence.Invisible) ??
|
|
||||||
false
|
false
|
||||||
) | 0;
|
) | 0;
|
||||||
|
|
||||||
|
@ -243,9 +202,9 @@ export const ServerMemberSidebar = observer(
|
||||||
<GenericSidebarBase>
|
<GenericSidebarBase>
|
||||||
<GenericSidebarList>
|
<GenericSidebarList>
|
||||||
<ChannelDebugInfo id={channel._id} />
|
<ChannelDebugInfo id={channel._id} />
|
||||||
<Search channel={channel._id} />
|
<Search channel={channel} />
|
||||||
<div>{!members && <Preloader type="ring" />}</div>
|
<div>{users.length === 0 && <Preloader type="ring" />}</div>
|
||||||
{members && (
|
{users.length > 0 && (
|
||||||
<CollapsibleSection
|
<CollapsibleSection
|
||||||
//sticky //will re-add later, need to fix css
|
//sticky //will re-add later, need to fix css
|
||||||
id="members"
|
id="members"
|
||||||
|
@ -256,10 +215,7 @@ export const ServerMemberSidebar = observer(
|
||||||
{users?.length ?? 0}
|
{users?.length ?? 0}
|
||||||
</span>
|
</span>
|
||||||
}>
|
}>
|
||||||
{(users?.length ?? 0) === 0 && (
|
{users.map(
|
||||||
<img src={placeholderSVG} loading="eager" />
|
|
||||||
)}
|
|
||||||
{users?.map(
|
|
||||||
(user) =>
|
(user) =>
|
||||||
user && (
|
user && (
|
||||||
<UserButton
|
<UserButton
|
||||||
|
@ -283,7 +239,7 @@ export const ServerMemberSidebar = observer(
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
|
||||||
function Search({ channel }: { channel: string }) {
|
function Search({ channel }: { channel: Channel }) {
|
||||||
if (!getState().experiments.enabled?.includes("search")) return null;
|
if (!getState().experiments.enabled?.includes("search")) return null;
|
||||||
|
|
||||||
const client = useContext(AppContext);
|
const client = useContext(AppContext);
|
||||||
|
@ -294,11 +250,7 @@ function Search({ channel }: { channel: string }) {
|
||||||
const [results, setResults] = useState<Message[]>([]);
|
const [results, setResults] = useState<Message[]>([]);
|
||||||
|
|
||||||
async function search() {
|
async function search() {
|
||||||
const data = await client.channels.searchWithUsers(
|
const data = await channel.searchWithUsers({ query, sort });
|
||||||
channel,
|
|
||||||
{ query, sort },
|
|
||||||
true,
|
|
||||||
);
|
|
||||||
setResults(data.messages);
|
setResults(data.messages);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -340,7 +292,6 @@ function Search({ channel }: { channel: string }) {
|
||||||
}}>
|
}}>
|
||||||
{results.map((message) => {
|
{results.map((message) => {
|
||||||
let href = "";
|
let href = "";
|
||||||
const channel = client.channels.get(message.channel);
|
|
||||||
if (channel?.channel_type === "TextChannel") {
|
if (channel?.channel_type === "TextChannel") {
|
||||||
href += `/server/${channel.server}`;
|
href += `/server/${channel.server}`;
|
||||||
}
|
}
|
||||||
|
@ -355,10 +306,7 @@ function Search({ channel }: { channel: string }) {
|
||||||
padding: "6px",
|
padding: "6px",
|
||||||
background: "var(--primary-background)",
|
background: "var(--primary-background)",
|
||||||
}}>
|
}}>
|
||||||
<b>
|
<b>@{message.author?.username}</b>
|
||||||
@
|
|
||||||
{client.users.get(message.author)?.username}
|
|
||||||
</b>
|
|
||||||
<br />
|
<br />
|
||||||
{message.content}
|
{message.content}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
|
import { Channel } from "revolt.js/dist/maps/Channels";
|
||||||
|
|
||||||
import { createContext } from "preact";
|
import { createContext } from "preact";
|
||||||
import { useContext, useEffect, useMemo, useRef, useState } from "preact/hooks";
|
import { useContext, useEffect, useMemo, useRef, useState } from "preact/hooks";
|
||||||
|
|
||||||
|
@ -21,7 +23,7 @@ export enum VoiceStatus {
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface VoiceOperations {
|
export interface VoiceOperations {
|
||||||
connect: (channelId: string) => Promise<void>;
|
connect: (channel: Channel) => Promise<Channel>;
|
||||||
disconnect: () => void;
|
disconnect: () => void;
|
||||||
isProducing: (type: ProduceType) => boolean;
|
isProducing: (type: ProduceType) => boolean;
|
||||||
startProducing: (type: ProduceType) => Promise<void>;
|
startProducing: (type: ProduceType) => Promise<void>;
|
||||||
|
@ -79,27 +81,25 @@ export default function Voice({ children }: Props) {
|
||||||
const isConnecting = useRef(false);
|
const isConnecting = useRef(false);
|
||||||
const operations: VoiceOperations = useMemo(() => {
|
const operations: VoiceOperations = useMemo(() => {
|
||||||
return {
|
return {
|
||||||
connect: async (channelId) => {
|
connect: async (channel) => {
|
||||||
if (!client?.supported()) throw new Error("RTC is unavailable");
|
if (!client?.supported()) throw new Error("RTC is unavailable");
|
||||||
|
|
||||||
isConnecting.current = true;
|
isConnecting.current = true;
|
||||||
setStatus(VoiceStatus.CONNECTING, channelId);
|
setStatus(VoiceStatus.CONNECTING, channel._id);
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const call = await revoltClient.channels.joinCall(
|
const call = await channel.joinCall();
|
||||||
channelId,
|
|
||||||
);
|
|
||||||
|
|
||||||
if (!isConnecting.current) {
|
if (!isConnecting.current) {
|
||||||
setStatus(VoiceStatus.READY);
|
setStatus(VoiceStatus.READY);
|
||||||
return;
|
return channel;
|
||||||
}
|
}
|
||||||
|
|
||||||
// ! FIXME: use configuration to check if voso is enabled
|
// ! FIXME: use configuration to check if voso is enabled
|
||||||
// await client.connect("wss://voso.revolt.chat/ws");
|
// await client.connect("wss://voso.revolt.chat/ws");
|
||||||
await client.connect(
|
await client.connect(
|
||||||
"wss://voso.revolt.chat/ws",
|
"wss://voso.revolt.chat/ws",
|
||||||
channelId,
|
channel._id,
|
||||||
);
|
);
|
||||||
|
|
||||||
setStatus(VoiceStatus.AUTHENTICATING);
|
setStatus(VoiceStatus.AUTHENTICATING);
|
||||||
|
@ -111,11 +111,12 @@ export default function Voice({ children }: Props) {
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error(error);
|
console.error(error);
|
||||||
setStatus(VoiceStatus.READY);
|
setStatus(VoiceStatus.READY);
|
||||||
return;
|
return channel;
|
||||||
}
|
}
|
||||||
|
|
||||||
setStatus(VoiceStatus.CONNECTED);
|
setStatus(VoiceStatus.CONNECTED);
|
||||||
isConnecting.current = false;
|
isConnecting.current = false;
|
||||||
|
return channel;
|
||||||
},
|
},
|
||||||
disconnect: () => {
|
disconnect: () => {
|
||||||
if (!client?.supported()) throw new Error("RTC is unavailable");
|
if (!client?.supported()) throw new Error("RTC is unavailable");
|
||||||
|
|
|
@ -1,6 +1,5 @@
|
||||||
import { BrowserRouter as Router } from "react-router-dom";
|
import { BrowserRouter as Router } from "react-router-dom";
|
||||||
|
|
||||||
import MobXState from "../mobx/State";
|
|
||||||
import State from "../redux/State";
|
import State from "../redux/State";
|
||||||
|
|
||||||
import { Children } from "../types/Preact";
|
import { Children } from "../types/Preact";
|
||||||
|
@ -20,9 +19,7 @@ export default function Context({ children }: { children: Children }) {
|
||||||
<Locale>
|
<Locale>
|
||||||
<Intermediate>
|
<Intermediate>
|
||||||
<Client>
|
<Client>
|
||||||
<MobXState>
|
<Voice>{children}</Voice>
|
||||||
<Voice>{children}</Voice>
|
|
||||||
</MobXState>
|
|
||||||
</Client>
|
</Client>
|
||||||
</Intermediate>
|
</Intermediate>
|
||||||
</Locale>
|
</Locale>
|
||||||
|
|
|
@ -57,7 +57,7 @@ export type Screen =
|
||||||
}
|
}
|
||||||
| {
|
| {
|
||||||
type: "create_role";
|
type: "create_role";
|
||||||
server: string;
|
server: Server;
|
||||||
callback: (id: string) => void;
|
callback: (id: string) => void;
|
||||||
}
|
}
|
||||||
))
|
))
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import { useHistory } from "react-router";
|
import { useHistory } from "react-router";
|
||||||
|
import { Server } from "revolt.js/dist/maps/Servers";
|
||||||
import { ulid } from "ulid";
|
import { ulid } from "ulid";
|
||||||
|
|
||||||
import { Text } from "preact-i18n";
|
import { Text } from "preact-i18n";
|
||||||
|
@ -81,7 +82,7 @@ type SpecialProps = { onClose: () => void } & (
|
||||||
| "set_custom_status"
|
| "set_custom_status"
|
||||||
| "add_friend";
|
| "add_friend";
|
||||||
}
|
}
|
||||||
| { type: "create_role"; server: string; callback: (id: string) => void }
|
| { type: "create_role"; server: Server; callback: (id: string) => void }
|
||||||
);
|
);
|
||||||
|
|
||||||
export function SpecialInputModal(props: SpecialProps) {
|
export function SpecialInputModal(props: SpecialProps) {
|
||||||
|
@ -134,10 +135,7 @@ export function SpecialInputModal(props: SpecialProps) {
|
||||||
}
|
}
|
||||||
field={<Text id="app.settings.permissions.role_name" />}
|
field={<Text id="app.settings.permissions.role_name" />}
|
||||||
callback={async (name) => {
|
callback={async (name) => {
|
||||||
const role = await client.servers.createRole(
|
const role = await props.server.createRole(name);
|
||||||
props.server,
|
|
||||||
name,
|
|
||||||
);
|
|
||||||
props.callback(role.id);
|
props.callback(role.id);
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
|
@ -151,7 +149,7 @@ export function SpecialInputModal(props: SpecialProps) {
|
||||||
field={<Text id="app.context_menu.custom_status" />}
|
field={<Text id="app.context_menu.custom_status" />}
|
||||||
defaultValue={client.user?.status?.text}
|
defaultValue={client.user?.status?.text}
|
||||||
callback={(text) =>
|
callback={(text) =>
|
||||||
client.users.editUser({
|
client.users.edit({
|
||||||
status: {
|
status: {
|
||||||
...client.user?.status,
|
...client.user?.status,
|
||||||
text: text.trim().length > 0 ? text : undefined,
|
text: text.trim().length > 0 ? text : undefined,
|
||||||
|
@ -166,7 +164,14 @@ export function SpecialInputModal(props: SpecialProps) {
|
||||||
<InputModal
|
<InputModal
|
||||||
onClose={onClose}
|
onClose={onClose}
|
||||||
question={"Add Friend"}
|
question={"Add Friend"}
|
||||||
callback={(username) => client.users.addFriend(username)}
|
callback={(username) =>
|
||||||
|
client
|
||||||
|
.req(
|
||||||
|
"PUT",
|
||||||
|
`/users/${username}/friend` as "/users/id/friend",
|
||||||
|
)
|
||||||
|
.then(undefined)
|
||||||
|
}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,9 @@
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { useHistory } from "react-router-dom";
|
import { useHistory } from "react-router-dom";
|
||||||
import { Channels, Servers, Users } from "revolt.js/dist/api/objects";
|
import { Channel } from "revolt.js/dist/maps/Channels";
|
||||||
|
import { Message as MessageI } from "revolt.js/dist/maps/Messages";
|
||||||
|
import { Server } from "revolt.js/dist/maps/Servers";
|
||||||
|
import { User } from "revolt.js/dist/maps/Users";
|
||||||
import { ulid } from "ulid";
|
import { ulid } from "ulid";
|
||||||
|
|
||||||
import styles from "./Prompt.module.scss";
|
import styles from "./Prompt.module.scss";
|
||||||
|
@ -9,9 +12,6 @@ import { useContext, useEffect, useState } from "preact/hooks";
|
||||||
|
|
||||||
import { TextReact } from "../../../lib/i18n";
|
import { TextReact } from "../../../lib/i18n";
|
||||||
|
|
||||||
import { Channel, Server, User } from "../../../mobx";
|
|
||||||
import { useData } from "../../../mobx/State";
|
|
||||||
|
|
||||||
import Message from "../../../components/common/messaging/Message";
|
import Message from "../../../components/common/messaging/Message";
|
||||||
import UserIcon from "../../../components/common/user/UserIcon";
|
import UserIcon from "../../../components/common/user/UserIcon";
|
||||||
import InputBox from "../../../components/ui/InputBox";
|
import InputBox from "../../../components/ui/InputBox";
|
||||||
|
@ -21,7 +21,7 @@ import Radio from "../../../components/ui/Radio";
|
||||||
|
|
||||||
import { Children } from "../../../types/Preact";
|
import { Children } from "../../../types/Preact";
|
||||||
import { AppContext } from "../../revoltjs/RevoltClient";
|
import { AppContext } from "../../revoltjs/RevoltClient";
|
||||||
import { mapMessage, takeError } from "../../revoltjs/util";
|
import { takeError } from "../../revoltjs/util";
|
||||||
import { useIntermediate } from "../Intermediate";
|
import { useIntermediate } from "../Intermediate";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
|
@ -60,7 +60,7 @@ type SpecialProps = { onClose: () => void } & (
|
||||||
| { type: "leave_server"; target: Server }
|
| { type: "leave_server"; target: Server }
|
||||||
| { type: "delete_server"; target: Server }
|
| { type: "delete_server"; target: Server }
|
||||||
| { type: "delete_channel"; target: Channel }
|
| { type: "delete_channel"; target: Channel }
|
||||||
| { type: "delete_message"; target: Channels.Message }
|
| { type: "delete_message"; target: MessageI }
|
||||||
| {
|
| {
|
||||||
type: "create_invite";
|
type: "create_invite";
|
||||||
target: Channel;
|
target: Channel;
|
||||||
|
@ -104,9 +104,7 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
|
||||||
name = props.target.username;
|
name = props.target.username;
|
||||||
break;
|
break;
|
||||||
case "close_dm":
|
case "close_dm":
|
||||||
name = client.users.get(
|
name = props.target.recipient?.username;
|
||||||
client.channels.getRecipient(props.target._id),
|
|
||||||
)?.username;
|
|
||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
name = props.target.name;
|
name = props.target.name;
|
||||||
|
@ -137,27 +135,19 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
|
||||||
try {
|
try {
|
||||||
switch (props.type) {
|
switch (props.type) {
|
||||||
case "unfriend_user":
|
case "unfriend_user":
|
||||||
await client.users.removeFriend(
|
await props.target.removeFriend();
|
||||||
props.target._id,
|
|
||||||
);
|
|
||||||
break;
|
break;
|
||||||
case "block_user":
|
case "block_user":
|
||||||
await client.users.blockUser(
|
await props.target.blockUser();
|
||||||
props.target._id,
|
|
||||||
);
|
|
||||||
break;
|
break;
|
||||||
case "leave_group":
|
case "leave_group":
|
||||||
case "close_dm":
|
case "close_dm":
|
||||||
case "delete_channel":
|
case "delete_channel":
|
||||||
await client.channels.delete(
|
props.target.delete();
|
||||||
props.target._id,
|
|
||||||
);
|
|
||||||
break;
|
break;
|
||||||
case "leave_server":
|
case "leave_server":
|
||||||
case "delete_server":
|
case "delete_server":
|
||||||
await client.servers.delete(
|
props.target.delete();
|
||||||
props.target._id,
|
|
||||||
);
|
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -203,11 +193,7 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
|
||||||
setProcessing(true);
|
setProcessing(true);
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await client.channels.deleteMessage(
|
props.target.deleteMessage();
|
||||||
props.target.channel,
|
|
||||||
props.target._id,
|
|
||||||
);
|
|
||||||
|
|
||||||
onClose();
|
onClose();
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
setError(takeError(err));
|
setError(takeError(err));
|
||||||
|
@ -229,7 +215,7 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
|
||||||
id={`app.special.modals.prompt.confirm_delete_message_long`}
|
id={`app.special.modals.prompt.confirm_delete_message_long`}
|
||||||
/>
|
/>
|
||||||
<Message
|
<Message
|
||||||
message={mapMessage(props.target)}
|
message={props.target}
|
||||||
head={true}
|
head={true}
|
||||||
contrast
|
contrast
|
||||||
/>
|
/>
|
||||||
|
@ -247,8 +233,8 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setProcessing(true);
|
setProcessing(true);
|
||||||
|
|
||||||
client.channels
|
props.target
|
||||||
.createInvite(props.target._id)
|
.createInvite()
|
||||||
.then((code) => setCode(code))
|
.then((code) => setCode(code))
|
||||||
.catch((err) => setError(takeError(err)))
|
.catch((err) => setError(takeError(err)))
|
||||||
.finally(() => setProcessing(false));
|
.finally(() => setProcessing(false));
|
||||||
|
@ -306,10 +292,13 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
|
||||||
setProcessing(true);
|
setProcessing(true);
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await client.members.kickMember(
|
client.members
|
||||||
props.target._id,
|
.get({
|
||||||
props.user._id,
|
server: props.target._id,
|
||||||
);
|
user: props.user._id,
|
||||||
|
})
|
||||||
|
?.kick();
|
||||||
|
|
||||||
onClose();
|
onClose();
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
setError(takeError(err));
|
setError(takeError(err));
|
||||||
|
@ -357,11 +346,9 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
|
||||||
setProcessing(true);
|
setProcessing(true);
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await client.servers.banUser(
|
await props.target.banUser(props.user._id, {
|
||||||
props.target._id,
|
reason,
|
||||||
props.user._id,
|
});
|
||||||
{ reason },
|
|
||||||
);
|
|
||||||
onClose();
|
onClose();
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
setError(takeError(err));
|
setError(takeError(err));
|
||||||
|
@ -420,14 +407,11 @@ export const SpecialPromptModal = observer((props: SpecialProps) => {
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const channel =
|
const channel =
|
||||||
await client.servers.createChannel(
|
await props.target.createChannel({
|
||||||
props.target._id,
|
type,
|
||||||
{
|
name,
|
||||||
type,
|
nonce: ulid(),
|
||||||
name,
|
});
|
||||||
nonce: ulid(),
|
|
||||||
},
|
|
||||||
);
|
|
||||||
|
|
||||||
history.push(
|
history.push(
|
||||||
`/server/${props.target._id}/channel/${channel._id}`,
|
`/server/${props.target._id}/channel/${channel._id}`,
|
||||||
|
|
|
@ -1,15 +1,12 @@
|
||||||
import { X } from "@styled-icons/boxicons-regular";
|
import { X } from "@styled-icons/boxicons-regular";
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
|
import { Channel } from "revolt.js/dist/maps/Channels";
|
||||||
|
|
||||||
import styles from "./ChannelInfo.module.scss";
|
import styles from "./ChannelInfo.module.scss";
|
||||||
|
|
||||||
import { Channel } from "../../../mobx";
|
|
||||||
|
|
||||||
import Modal from "../../../components/ui/Modal";
|
import Modal from "../../../components/ui/Modal";
|
||||||
|
|
||||||
import Markdown from "../../../components/markdown/Markdown";
|
import Markdown from "../../../components/markdown/Markdown";
|
||||||
import { useClient } from "../../revoltjs/RevoltClient";
|
|
||||||
import { useForceUpdate } from "../../revoltjs/hooks";
|
|
||||||
import { getChannelName } from "../../revoltjs/util";
|
import { getChannelName } from "../../revoltjs/util";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
|
@ -26,12 +23,11 @@ export const ChannelInfo = observer(({ channel, onClose }: Props) => {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
const client = useClient();
|
|
||||||
return (
|
return (
|
||||||
<Modal visible={true} onClose={onClose}>
|
<Modal visible={true} onClose={onClose}>
|
||||||
<div className={styles.info}>
|
<div className={styles.info}>
|
||||||
<div className={styles.header}>
|
<div className={styles.header}>
|
||||||
<h1>{getChannelName(client, channel, true)}</h1>
|
<h1>{getChannelName(channel, true)}</h1>
|
||||||
<div onClick={onClose}>
|
<div onClick={onClose}>
|
||||||
<X size={36} />
|
<X size={36} />
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,11 +1,7 @@
|
||||||
import {
|
import { Attachment, AttachmentMetadata } from "revolt-api/types/Autumn";
|
||||||
Attachment,
|
import { EmbedImage } from "revolt-api/types/January";
|
||||||
AttachmentMetadata,
|
|
||||||
EmbedImage,
|
|
||||||
} from "revolt.js/dist/api/objects";
|
|
||||||
|
|
||||||
import styles from "./ImageViewer.module.scss";
|
import styles from "./ImageViewer.module.scss";
|
||||||
import { useContext, useEffect } from "preact/hooks";
|
|
||||||
|
|
||||||
import AttachmentActions from "../../../components/common/messaging/attachments/AttachmentActions";
|
import AttachmentActions from "../../../components/common/messaging/attachments/AttachmentActions";
|
||||||
import EmbedMediaActions from "../../../components/common/messaging/embed/EmbedMediaActions";
|
import EmbedMediaActions from "../../../components/common/messaging/embed/EmbedMediaActions";
|
||||||
|
|
|
@ -1,10 +1,9 @@
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
|
import { User } from "revolt.js/dist/maps/Users";
|
||||||
|
|
||||||
import styles from "./UserPicker.module.scss";
|
import styles from "./UserPicker.module.scss";
|
||||||
import { Text } from "preact-i18n";
|
import { Text } from "preact-i18n";
|
||||||
|
|
||||||
import { User } from "../../../mobx";
|
|
||||||
|
|
||||||
import Modal from "../../../components/ui/Modal";
|
import Modal from "../../../components/ui/Modal";
|
||||||
|
|
||||||
import { Friend } from "../../../pages/friends/Friend";
|
import { Friend } from "../../../pages/friends/Friend";
|
||||||
|
|
|
@ -1,14 +1,14 @@
|
||||||
import { Users } from "revolt.js/dist/api/objects";
|
import { RelationshipStatus } from "revolt-api/types/Users";
|
||||||
|
|
||||||
import styles from "./UserPicker.module.scss";
|
import styles from "./UserPicker.module.scss";
|
||||||
import { Text } from "preact-i18n";
|
import { Text } from "preact-i18n";
|
||||||
import { useState } from "preact/hooks";
|
import { useState } from "preact/hooks";
|
||||||
|
|
||||||
import { useData } from "../../../mobx/State";
|
|
||||||
|
|
||||||
import UserCheckbox from "../../../components/common/user/UserCheckbox";
|
import UserCheckbox from "../../../components/common/user/UserCheckbox";
|
||||||
import Modal from "../../../components/ui/Modal";
|
import Modal from "../../../components/ui/Modal";
|
||||||
|
|
||||||
|
import { useClient } from "../../revoltjs/RevoltClient";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
omit?: string[];
|
omit?: string[];
|
||||||
onClose: () => void;
|
onClose: () => void;
|
||||||
|
@ -19,7 +19,7 @@ export function UserPicker(props: Props) {
|
||||||
const [selected, setSelected] = useState<string[]>([]);
|
const [selected, setSelected] = useState<string[]>([]);
|
||||||
const omit = [...(props.omit || []), "00000000000000000000000000"];
|
const omit = [...(props.omit || []), "00000000000000000000000000"];
|
||||||
|
|
||||||
const store = useData();
|
const client = useClient();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Modal
|
<Modal
|
||||||
|
@ -33,11 +33,11 @@ export function UserPicker(props: Props) {
|
||||||
},
|
},
|
||||||
]}>
|
]}>
|
||||||
<div className={styles.list}>
|
<div className={styles.list}>
|
||||||
{[...store.users.values()]
|
{[...client.users.values()]
|
||||||
.filter(
|
.filter(
|
||||||
(x) =>
|
(x) =>
|
||||||
x &&
|
x &&
|
||||||
x.relationship === Users.Relationship.Friend &&
|
x.relationship === RelationshipStatus.Friend &&
|
||||||
!omit.includes(x._id),
|
!omit.includes(x._id),
|
||||||
)
|
)
|
||||||
.map((x) => (
|
.map((x) => (
|
||||||
|
|
|
@ -91,7 +91,7 @@ function VoiceActions({ channel }: Pick<ChannelHeaderProps, "channel">) {
|
||||||
<IconButton
|
<IconButton
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
disconnect();
|
disconnect();
|
||||||
connect(channel._id);
|
connect(channel);
|
||||||
}}>
|
}}>
|
||||||
<PhoneCall size={24} />
|
<PhoneCall size={24} />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
|
|
@ -48,10 +48,10 @@ export const Friend = observer(({ user }: Props) => {
|
||||||
onClick={(ev) =>
|
onClick={(ev) =>
|
||||||
stopPropagation(
|
stopPropagation(
|
||||||
ev,
|
ev,
|
||||||
user.openDM().then((channel) => {
|
user
|
||||||
connect(channel._id);
|
.openDM()
|
||||||
history.push(`/channel/${channel._id}`);
|
.then(connect)
|
||||||
}),
|
.then((x) => history.push(`/channel/${x._id}`)),
|
||||||
)
|
)
|
||||||
}>
|
}>
|
||||||
<PhoneCall size={20} />
|
<PhoneCall size={20} />
|
||||||
|
|
|
@ -97,7 +97,7 @@ export const Roles = observer(({ server }: Props) => {
|
||||||
openScreen({
|
openScreen({
|
||||||
id: "special_input",
|
id: "special_input",
|
||||||
type: "create_role",
|
type: "create_role",
|
||||||
server: server._id,
|
server,
|
||||||
callback: (id) => setRole(id),
|
callback: (id) => setRole(id),
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue