cswimr/revite
1
0
Fork 0
mirror of https://github.com/revoltchat/revite.git synced 2024-12-01 11:20:58 -05:00
Code Issues Projects Releases Packages Wiki Activity

Include @ symbol when reply is a mention.

Browse source
This commit is contained in:
Paul 2021-08-16 18:08:44 +01:00
parent b4f16f0d00
commit 1f2e58b10e
3 changed files with 95 additions and 81 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/components/common/messaging/Message.tsx
View file

@ -81,6 +81,7 @@ const Message = observer(
index={index} index={index}
id={message_id} id={message_id}
channel={message.channel!} channel={message.channel!}
parent_mentions={message.mention_ids ?? []}
/> />
))} ))}
<MessageBase <MessageBase

169
src/components/common/messaging/attachments/MessageReply.tsx
View file

@ -18,6 +18,7 @@ import UserShort from "../../user/UserShort";
import { SystemMessage } from "../SystemMessage"; import { SystemMessage } from "../SystemMessage";
interface Props { interface Props {
parent_mentions: string[];
channel: Channel; channel: Channel;
index: number; index: number;
id: string; id: string;
@ -33,7 +34,6 @@ export const ReplyBase = styled.div<{
display: flex; display: flex;
margin-inline-start: 30px; margin-inline-start: 30px;
margin-inline-end: 12px; margin-inline-end: 12px;
/*margin-bottom: 4px;*/
font-size: 0.8em; font-size: 0.8em;
user-select: none; user-select: none;
align-items: center; align-items: center;
@ -137,91 +137,98 @@ export const ReplyBase = styled.div<{
`} `}
`; `;
export const MessageReply = observer(({ index, channel, id }: Props) => { export const MessageReply = observer(
const view = getRenderer(channel); ({ index, channel, id, parent_mentions }: Props) => {
if (view.state !== "RENDER") return null; const view = getRenderer(channel);
if (view.state !== "RENDER") return null;
const [message, setMessage] = useState<Message | undefined>(undefined); const [message, setMessage] = useState<Message | undefined>(undefined);
useLayoutEffect(() => { useLayoutEffect(() => {
const message = channel.client.messages.get(id); const message = channel.client.messages.get(id);
if (message) { if (message) {
setMessage(message); setMessage(message);
} else { } else {
channel.fetchMessage(id).then(setMessage); channel.fetchMessage(id).then(setMessage);
}
}, [id, channel, view.messages]);
if (!message) {
return (
<ReplyBase head={index === 0} fail>
<Reply size={16} />
<span>
<Text id="app.main.channel.misc.failed_load" />
</span>
</ReplyBase>
);
} }
}, [id, channel, view.messages]);
if (!message) { const history = useHistory();
return ( return (
<ReplyBase head={index === 0} fail> <ReplyBase head={index === 0}>
<Reply size={16} /> <Reply size={16} />
<span> {message.author?.relationship === RelationshipStatus.Blocked ? (
<Text id="app.main.channel.misc.failed_load" /> <Text id="app.main.channel.misc.blocked_user" />
</span> ) : (
<>
{message.author_id === SYSTEM_USER_ID ? (
<SystemMessage message={message} hideInfo />
) : (
<>
<div className="user">
<UserShort
user={message.author}
size={16}
showServerIdentity
prefixAt={parent_mentions.includes(
message.author_id,
)}
/>
</div>
<div
className="content"
onClick={() => {
const channel = message.channel!;
if (
channel.channel_type ===
"TextChannel"
) {
history.push(
`/server/${channel.server_id}/channel/${channel._id}/${message._id}`,
);
} else {
history.push(
`/channel/${channel._id}/${message._id}`,
);
}
}}>
{message.attachments && (
<>
<File size={16} />
<em>
{message.attachments.length >
1 ? (
<Text id="app.main.channel.misc.sent_multiple_files" />
) : (
<Text id="app.main.channel.misc.sent_file" />
)}
</em>
</>
)}
<Markdown
disallowBigEmoji
content={(
message.content as string
).replace(/\n/g, " ")}
/>
</div>
</>
)}
</>
)}
</ReplyBase> </ReplyBase>
); );
} },
);
const history = useHistory();
return (
<ReplyBase head={index === 0}>
<Reply size={16} />
{message.author?.relationship === RelationshipStatus.Blocked ? (
<Text id="app.main.channel.misc.blocked_user" />
) : (
<>
{message.author_id === SYSTEM_USER_ID ? (
<SystemMessage message={message} hideInfo />
) : (
<>
<div className="user">
<UserShort
user={message.author}
size={16}
showServerIdentity
/>
</div>
<div
className="content"
onClick={() => {
const channel = message.channel!;
if (
channel.channel_type === "TextChannel"
) {
history.push(
`/server/${channel.server_id}/channel/${channel._id}/${message._id}`,
);
} else {
history.push(
`/channel/${channel._id}/${message._id}`,
);
}
}}>
{message.attachments && (
<>
<File size={16} />
<em>
{message.attachments.length > 1 ? (
<Text id="app.main.channel.misc.sent_multiple_files" />
) : (
<Text id="app.main.channel.misc.sent_file" />
)}
</em>
</>
)}
<Markdown
disallowBigEmoji
content={(
message.content as string
).replace(/\n/g, " ")}
/>
</div>
</>
)}
</>
)}
</ReplyBase>
);
});

6
src/components/common/user/UserShort.tsx
View file

@ -28,10 +28,12 @@ const BotBadge = styled.div`
export const Username = observer( export const Username = observer(
({ ({
user, user,
prefixAt,
showServerIdentity, showServerIdentity,
...otherProps ...otherProps
}: { }: {
user?: User; user?: User;
prefixAt?: boolean;
showServerIdentity?: boolean; showServerIdentity?: boolean;
} & JSX.HTMLAttributes<HTMLElement>) => { } & JSX.HTMLAttributes<HTMLElement>) => {
let username = user?.username; let username = user?.username;
@ -84,6 +86,7 @@ export const Username = observer(
return ( return (
<span {...otherProps} style={{ color }}> <span {...otherProps} style={{ color }}>
{prefixAt ? "@" : undefined}
{username ?? <Text id="app.main.channel.unknown_user" />} {username ?? <Text id="app.main.channel.unknown_user" />}
</span> </span>
); );
@ -93,10 +96,12 @@ export const Username = observer(
export default function UserShort({ export default function UserShort({
user, user,
size, size,
prefixAt,
showServerIdentity, showServerIdentity,
}: { }: {
user?: User; user?: User;
size?: number; size?: number;
prefixAt?: boolean;
showServerIdentity?: boolean; showServerIdentity?: boolean;
}) { }) {
const { openScreen } = useIntermediate(); const { openScreen } = useIntermediate();
@ -115,6 +120,7 @@ export default function UserShort({
user={user} user={user}
showServerIdentity={showServerIdentity} showServerIdentity={showServerIdentity}
onClick={openProfile} onClick={openProfile}
prefixAt={prefixAt}
/> />
</> </>
); );