mirror of
https://github.com/revoltchat/revite.git
synced 2024-11-06 07:25:53 -05:00
feat(messaging): render masqueraded messages
This commit is contained in:
parent
7e7f9d0f23
commit
d82573b5fc
9 changed files with 71 additions and 37 deletions
2
VERSION
2
VERSION
|
@ -1 +1 @@
|
||||||
1.0.0-vite
|
0.5.3-1
|
2
external/lang
vendored
2
external/lang
vendored
|
@ -1 +1 @@
|
||||||
Subproject commit 4dee74edcd717057235301496d41492d9836b51b
|
Subproject commit bf0fd028b7702801483d4d491960b3f8af1b8c81
|
|
@ -53,6 +53,7 @@
|
||||||
"@fontsource/comic-neue": "^4.4.5",
|
"@fontsource/comic-neue": "^4.4.5",
|
||||||
"@fontsource/fira-code": "^4.4.5",
|
"@fontsource/fira-code": "^4.4.5",
|
||||||
"@fontsource/inter": "^4.4.5",
|
"@fontsource/inter": "^4.4.5",
|
||||||
|
"@fontsource/jetbrains-mono": "^4.4.5",
|
||||||
"@fontsource/lato": "^4.4.5",
|
"@fontsource/lato": "^4.4.5",
|
||||||
"@fontsource/montserrat": "^4.4.5",
|
"@fontsource/montserrat": "^4.4.5",
|
||||||
"@fontsource/noto-sans": "^4.4.5",
|
"@fontsource/noto-sans": "^4.4.5",
|
||||||
|
@ -65,7 +66,6 @@
|
||||||
"@fontsource/space-mono": "^4.4.5",
|
"@fontsource/space-mono": "^4.4.5",
|
||||||
"@fontsource/ubuntu": "^4.4.5",
|
"@fontsource/ubuntu": "^4.4.5",
|
||||||
"@fontsource/ubuntu-mono": "^4.4.5",
|
"@fontsource/ubuntu-mono": "^4.4.5",
|
||||||
"@fontsource/jetbrains-mono": "^4.4.5",
|
|
||||||
"@hcaptcha/react-hcaptcha": "^0.3.6",
|
"@hcaptcha/react-hcaptcha": "^0.3.6",
|
||||||
"@preact/preset-vite": "^2.0.0",
|
"@preact/preset-vite": "^2.0.0",
|
||||||
"@rollup/plugin-replace": "^2.4.2",
|
"@rollup/plugin-replace": "^2.4.2",
|
||||||
|
@ -124,8 +124,8 @@
|
||||||
"react-virtualized-auto-sizer": "^1.0.5",
|
"react-virtualized-auto-sizer": "^1.0.5",
|
||||||
"react-virtuoso": "^1.10.4",
|
"react-virtuoso": "^1.10.4",
|
||||||
"redux": "^4.1.0",
|
"redux": "^4.1.0",
|
||||||
"revolt-api": "0.5.3-alpha.0-patch.0",
|
"revolt-api": "^0.5.3-alpha.8-patch.0",
|
||||||
"revolt.js": "5.1.0-alpha.6",
|
"revolt.js": "^5.1.0-alpha.7",
|
||||||
"rimraf": "^3.0.2",
|
"rimraf": "^3.0.2",
|
||||||
"sass": "^1.35.1",
|
"sass": "^1.35.1",
|
||||||
"shade-blend-color": "^1.0.0",
|
"shade-blend-color": "^1.0.0",
|
||||||
|
|
|
@ -3,6 +3,7 @@ import styled, { css } from "styled-components";
|
||||||
|
|
||||||
export interface IconBaseProps<T> {
|
export interface IconBaseProps<T> {
|
||||||
target?: T;
|
target?: T;
|
||||||
|
url?: string;
|
||||||
attachment?: Attachment;
|
attachment?: Attachment;
|
||||||
|
|
||||||
size: number;
|
size: number;
|
||||||
|
|
|
@ -130,6 +130,7 @@ const Message = observer(
|
||||||
<MessageInfo>
|
<MessageInfo>
|
||||||
{head ? (
|
{head ? (
|
||||||
<UserIcon
|
<UserIcon
|
||||||
|
url={message.generateMasqAvatarURL()}
|
||||||
target={user}
|
target={user}
|
||||||
size={36}
|
size={36}
|
||||||
onContextMenu={userContext}
|
onContextMenu={userContext}
|
||||||
|
@ -145,6 +146,7 @@ const Message = observer(
|
||||||
{head && (
|
{head && (
|
||||||
<span className="detail">
|
<span className="detail">
|
||||||
<Username
|
<Username
|
||||||
|
override={message.masquerade?.name}
|
||||||
className="author"
|
className="author"
|
||||||
user={user}
|
user={user}
|
||||||
onContextMenu={userContext}
|
onContextMenu={userContext}
|
||||||
|
|
|
@ -11,9 +11,10 @@ import { useContext } from "preact/hooks";
|
||||||
import { ThemeContext } from "../../../context/Theme";
|
import { ThemeContext } from "../../../context/Theme";
|
||||||
import { useClient } from "../../../context/revoltjs/RevoltClient";
|
import { useClient } from "../../../context/revoltjs/RevoltClient";
|
||||||
|
|
||||||
import IconBase, { IconBaseProps } from "../IconBase";
|
|
||||||
import fallback from "../assets/user.png";
|
import fallback from "../assets/user.png";
|
||||||
|
|
||||||
|
import IconBase, { IconBaseProps } from "../IconBase";
|
||||||
|
|
||||||
type VoiceStatus = "muted" | "deaf";
|
type VoiceStatus = "muted" | "deaf";
|
||||||
interface Props extends IconBaseProps<User> {
|
interface Props extends IconBaseProps<User> {
|
||||||
mask?: string;
|
mask?: string;
|
||||||
|
@ -76,6 +77,8 @@ export default observer(
|
||||||
...svgProps
|
...svgProps
|
||||||
} = props;
|
} = props;
|
||||||
|
|
||||||
|
let { url } = props;
|
||||||
|
if (!url) {
|
||||||
let override;
|
let override;
|
||||||
if (target && showServerIdentity) {
|
if (target && showServerIdentity) {
|
||||||
const { server } = useParams<{ server?: string }>();
|
const { server } = useParams<{ server?: string }>();
|
||||||
|
@ -91,12 +94,13 @@ export default observer(
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const iconURL =
|
url =
|
||||||
client.generateFileURL(
|
client.generateFileURL(
|
||||||
override ?? target?.avatar ?? attachment,
|
override ?? target?.avatar ?? attachment,
|
||||||
{ max_side: 256 },
|
{ max_side: 256 },
|
||||||
animate,
|
animate,
|
||||||
) ?? (target ? target.defaultAvatarURL : fallback);
|
) ?? (target ? target.defaultAvatarURL : fallback);
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<IconBase
|
<IconBase
|
||||||
|
@ -114,7 +118,7 @@ export default observer(
|
||||||
height="32"
|
height="32"
|
||||||
class="icon"
|
class="icon"
|
||||||
mask={mask ?? (status ? "url(#user)" : undefined)}>
|
mask={mask ?? (status ? "url(#user)" : undefined)}>
|
||||||
{<img src={iconURL} draggable={false} loading="lazy" />}
|
{<img src={url} draggable={false} loading="lazy" />}
|
||||||
</foreignObject>
|
</foreignObject>
|
||||||
{props.status && (
|
{props.status && (
|
||||||
<circle
|
<circle
|
||||||
|
|
|
@ -29,11 +29,19 @@ const BotBadge = styled.div`
|
||||||
|
|
||||||
type UsernameProps = JSX.HTMLAttributes<HTMLElement> & {
|
type UsernameProps = JSX.HTMLAttributes<HTMLElement> & {
|
||||||
user?: User;
|
user?: User;
|
||||||
|
override?: string;
|
||||||
prefixAt?: boolean;
|
prefixAt?: boolean;
|
||||||
showServerIdentity?: boolean | "both";
|
showServerIdentity?: boolean | "both";
|
||||||
};
|
};
|
||||||
|
|
||||||
export const Username = observer(
|
export const Username = observer(
|
||||||
({ user, prefixAt, showServerIdentity, ...otherProps }: UsernameProps) => {
|
({
|
||||||
|
user,
|
||||||
|
override,
|
||||||
|
prefixAt,
|
||||||
|
showServerIdentity,
|
||||||
|
...otherProps
|
||||||
|
}: UsernameProps) => {
|
||||||
let username = user?.username;
|
let username = user?.username;
|
||||||
let color;
|
let color;
|
||||||
|
|
||||||
|
@ -75,7 +83,7 @@ export const Username = observer(
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<span {...otherProps} style={{ color }}>
|
<span {...otherProps} style={{ color }}>
|
||||||
{username ?? (
|
{override ?? username ?? (
|
||||||
<Text id="app.main.channel.unknown_user" />
|
<Text id="app.main.channel.unknown_user" />
|
||||||
)}
|
)}
|
||||||
</span>
|
</span>
|
||||||
|
@ -89,7 +97,9 @@ export const Username = observer(
|
||||||
return (
|
return (
|
||||||
<span {...otherProps} style={{ color }}>
|
<span {...otherProps} style={{ color }}>
|
||||||
{prefixAt ? "@" : undefined}
|
{prefixAt ? "@" : undefined}
|
||||||
{username ?? <Text id="app.main.channel.unknown_user" />}
|
{override ?? username ?? (
|
||||||
|
<Text id="app.main.channel.unknown_user" />
|
||||||
|
)}
|
||||||
</span>
|
</span>
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,8 +1,11 @@
|
||||||
/* eslint-disable react-hooks/rules-of-hooks */
|
/* eslint-disable react-hooks/rules-of-hooks */
|
||||||
import { X } from "@styled-icons/boxicons-regular";
|
import { X } from "@styled-icons/boxicons-regular";
|
||||||
|
import isEqual from "lodash.isequal";
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
|
import { Masquerade } from "revolt-api/types/Channels";
|
||||||
import { RelationshipStatus } from "revolt-api/types/Users";
|
import { RelationshipStatus } from "revolt-api/types/Users";
|
||||||
import { Message as MessageI } from "revolt.js/dist/maps/Messages";
|
import { Message as MessageI } from "revolt.js/dist/maps/Messages";
|
||||||
|
import { Nullable } from "revolt.js/dist/util/null";
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
import { decodeTime } from "ulid";
|
import { decodeTime } from "ulid";
|
||||||
|
|
||||||
|
@ -96,8 +99,10 @@ const MessageRenderer = observer(({ renderer, queue, highlight }: Props) => {
|
||||||
function compare(
|
function compare(
|
||||||
current: string,
|
current: string,
|
||||||
curAuthor: string,
|
curAuthor: string,
|
||||||
|
currentMasq: Nullable<Masquerade>,
|
||||||
previous: string,
|
previous: string,
|
||||||
prevAuthor: string,
|
prevAuthor: string,
|
||||||
|
previousMasq: Nullable<Masquerade>,
|
||||||
) {
|
) {
|
||||||
const atime = decodeTime(current),
|
const atime = decodeTime(current),
|
||||||
adate = new Date(atime),
|
adate = new Date(atime),
|
||||||
|
@ -113,7 +118,10 @@ const MessageRenderer = observer(({ renderer, queue, highlight }: Props) => {
|
||||||
head = true;
|
head = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
head = curAuthor !== prevAuthor || Math.abs(btime - atime) >= 420000;
|
head =
|
||||||
|
curAuthor !== prevAuthor ||
|
||||||
|
Math.abs(btime - atime) >= 420000 ||
|
||||||
|
!isEqual(currentMasq, previousMasq);
|
||||||
}
|
}
|
||||||
|
|
||||||
let blocked = 0;
|
let blocked = 0;
|
||||||
|
@ -135,8 +143,10 @@ const MessageRenderer = observer(({ renderer, queue, highlight }: Props) => {
|
||||||
compare(
|
compare(
|
||||||
message._id,
|
message._id,
|
||||||
message.author_id,
|
message.author_id,
|
||||||
|
message.masquerade,
|
||||||
previous._id,
|
previous._id,
|
||||||
previous.author_id,
|
previous.author_id,
|
||||||
|
previous.masquerade,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -187,7 +197,14 @@ const MessageRenderer = observer(({ renderer, queue, highlight }: Props) => {
|
||||||
if (nonces.includes(msg.id)) continue;
|
if (nonces.includes(msg.id)) continue;
|
||||||
|
|
||||||
if (previous) {
|
if (previous) {
|
||||||
compare(msg.id, userId!, previous._id, previous.author_id);
|
compare(
|
||||||
|
msg.id,
|
||||||
|
userId!,
|
||||||
|
null,
|
||||||
|
previous._id,
|
||||||
|
previous.author_id,
|
||||||
|
previous.masquerade,
|
||||||
|
);
|
||||||
|
|
||||||
previous = {
|
previous = {
|
||||||
_id: msg.id,
|
_id: msg.id,
|
||||||
|
|
16
yarn.lock
16
yarn.lock
|
@ -3647,15 +3647,15 @@ reusify@^1.0.4:
|
||||||
resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
|
resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
|
||||||
integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
|
integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
|
||||||
|
|
||||||
revolt-api@0.5.3-alpha.0-patch.0:
|
revolt-api@^0.5.3-alpha.8-patch.0:
|
||||||
version "0.5.3-alpha.0-patch.0"
|
version "0.5.3-alpha.8-patch.0"
|
||||||
resolved "https://registry.yarnpkg.com/revolt-api/-/revolt-api-0.5.3-alpha.0-patch.0.tgz#158556832843bb06cb06a4df50ffca24ab64be3b"
|
resolved "https://registry.yarnpkg.com/revolt-api/-/revolt-api-0.5.3-alpha.8-patch.0.tgz#3c9f981f8100a89aec1299bc110453cf01c51f89"
|
||||||
integrity sha512-76l+kGyrUy6uGMSIziyAHE27r9gD97OEh5gSzb2OJRsQM55TN0NurAsfFIEiB9hUzDDlwsXchtJiqdS4UVAwQw==
|
integrity sha512-ghupcB1nJS7fCiD41L4u+QudFoBWGE381uW4s8cuHsQS3bFXgzAH1lgtjYNoFgrVUekqQAcHWote8Kn2sOABAQ==
|
||||||
|
|
||||||
revolt.js@5.1.0-alpha.6:
|
revolt.js@^5.1.0-alpha.7:
|
||||||
version "5.1.0-alpha.6"
|
version "5.1.0-alpha.7"
|
||||||
resolved "https://registry.yarnpkg.com/revolt.js/-/revolt.js-5.1.0-alpha.6.tgz#bdd1c9f3bdd7e0f45e309a3e1fa5239138e1cb1a"
|
resolved "https://registry.yarnpkg.com/revolt.js/-/revolt.js-5.1.0-alpha.7.tgz#20fe8d3390b95f351361e5bc70e8a1b31467ae69"
|
||||||
integrity sha512-XqdP24tGc+En9M8ccWkk74z/v2DBtH7OboTbFQBQTjWIT4fLMP/ox+GLdDVWSF7Zg6M/xPrMbg4oL/nP+xqZHQ==
|
integrity sha512-4FLh4MEql0kt83h6++jmQ2F4KGNer3odKkRs7avliu4wEJpQDmUD21anChO41Uv1gHBZMXIFdrYt5OCK384pSg==
|
||||||
dependencies:
|
dependencies:
|
||||||
axios "^0.21.4"
|
axios "^0.21.4"
|
||||||
eventemitter3 "^4.0.7"
|
eventemitter3 "^4.0.7"
|
||||||
|
|
Loading…
Reference in a new issue