mirror of
https://github.com/revoltchat/revite.git
synced 2024-12-24 06:32:08 -05:00
Support replying to files, show icon in reply.
This commit is contained in:
parent
994ef65200
commit
41470e2cd5
4 changed files with 26 additions and 14 deletions
|
@ -35,9 +35,9 @@ function Message({ attachContext, message, contrast, content: replacement, head:
|
||||||
const userContext = attachContext ? attachContextMenu('Menu', { user: message.author, contextualChannel: message.channel }) : undefined as any; // ! FIXME: tell fatal to make this type generic
|
const userContext = attachContext ? attachContextMenu('Menu', { user: message.author, contextualChannel: message.channel }) : undefined as any; // ! FIXME: tell fatal to make this type generic
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<div id={message._id}>
|
||||||
{ message.replies?.map((message_id, index) => <MessageReply index={index} id={message_id} channel={message.channel} />) }
|
{ message.replies?.map((message_id, index) => <MessageReply index={index} id={message_id} channel={message.channel} />) }
|
||||||
<MessageBase id={message._id}
|
<MessageBase
|
||||||
head={head && !(message.replies && message.replies.length > 0)}
|
head={head && !(message.replies && message.replies.length > 0)}
|
||||||
contrast={contrast}
|
contrast={contrast}
|
||||||
sending={typeof queued !== 'undefined'}
|
sending={typeof queued !== 'undefined'}
|
||||||
|
@ -64,7 +64,7 @@ function Message({ attachContext, message, contrast, content: replacement, head:
|
||||||
<Embed key={index} embed={embed} />) }
|
<Embed key={index} embed={embed} />) }
|
||||||
</MessageContent>
|
</MessageContent>
|
||||||
</MessageBase>
|
</MessageBase>
|
||||||
</>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -2,7 +2,7 @@ import { Text } from "preact-i18n";
|
||||||
import UserShort from "../../user/UserShort";
|
import UserShort from "../../user/UserShort";
|
||||||
import styled, { css } from "styled-components";
|
import styled, { css } from "styled-components";
|
||||||
import Markdown from "../../../markdown/Markdown";
|
import Markdown from "../../../markdown/Markdown";
|
||||||
import { CornerUpRight } from "@styled-icons/feather";
|
import { CornerUpRight, File } from "@styled-icons/feather";
|
||||||
import { useUser } from "../../../../context/revoltjs/hooks";
|
import { useUser } from "../../../../context/revoltjs/hooks";
|
||||||
import { useRenderState } from "../../../../lib/renderer/Singleton";
|
import { useRenderState } from "../../../../lib/renderer/Singleton";
|
||||||
|
|
||||||
|
@ -22,7 +22,12 @@ export const ReplyBase = styled.div<{ head?: boolean, fail?: boolean, preview?:
|
||||||
align-items: center;
|
align-items: center;
|
||||||
color: var(--secondary-foreground);
|
color: var(--secondary-foreground);
|
||||||
|
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
|
flex-shrink: 0;
|
||||||
color: var(--tertiary-foreground);
|
color: var(--tertiary-foreground);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -59,7 +64,8 @@ export function MessageReply({ index, channel, id }: Props) {
|
||||||
<ReplyBase head={index === 0}>
|
<ReplyBase head={index === 0}>
|
||||||
<CornerUpRight size={16} />
|
<CornerUpRight size={16} />
|
||||||
<UserShort user={user} size={16} />
|
<UserShort user={user} size={16} />
|
||||||
<Markdown disallowBigEmoji content={(message.content as string).split('\n').shift()} />
|
{ message.attachments && message.attachments.length > 0 && <File size={16} /> }
|
||||||
|
<Markdown disallowBigEmoji content={(message.content as string).replace(/\n/g, ' ')} />
|
||||||
</ReplyBase>
|
</ReplyBase>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,14 +1,15 @@
|
||||||
|
import { Text } from "preact-i18n";
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
import UserShort from "../../user/UserShort";
|
import UserShort from "../../user/UserShort";
|
||||||
|
import IconButton from "../../../ui/IconButton";
|
||||||
import Markdown from "../../../markdown/Markdown";
|
import Markdown from "../../../markdown/Markdown";
|
||||||
import { AtSign, CornerUpRight, XCircle } from "@styled-icons/feather";
|
|
||||||
import { StateUpdater, useEffect } from "preact/hooks";
|
import { StateUpdater, useEffect } from "preact/hooks";
|
||||||
import { ReplyBase } from "../attachments/MessageReply";
|
import { ReplyBase } from "../attachments/MessageReply";
|
||||||
import { Reply } from "../../../../redux/reducers/queue";
|
import { Reply } from "../../../../redux/reducers/queue";
|
||||||
import { useUsers } from "../../../../context/revoltjs/hooks";
|
import { useUsers } from "../../../../context/revoltjs/hooks";
|
||||||
import { internalSubscribe } from "../../../../lib/eventEmitter";
|
import { internalSubscribe } from "../../../../lib/eventEmitter";
|
||||||
import { useRenderState } from "../../../../lib/renderer/Singleton";
|
import { useRenderState } from "../../../../lib/renderer/Singleton";
|
||||||
import IconButton from "../../../ui/IconButton";
|
import { AtSign, CornerUpRight, File, XCircle } from "@styled-icons/feather";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
channel: string,
|
channel: string,
|
||||||
|
@ -58,7 +59,11 @@ export default function ReplyBar({ channel, replies, setReplies }: Props) {
|
||||||
<div>
|
<div>
|
||||||
{ replies.map((reply, index) => {
|
{ replies.map((reply, index) => {
|
||||||
let message = messages.find(x => reply.id === x._id);
|
let message = messages.find(x => reply.id === x._id);
|
||||||
if (!message) return;
|
// ! FIXME: better solution would be to
|
||||||
|
// ! have a hook for resolving messages from
|
||||||
|
// ! render state along with relevant users
|
||||||
|
// -> which then fetches any unknown messages
|
||||||
|
if (!message) return <span><Text id="app.main.channel.misc.failed_load" /></span>;
|
||||||
|
|
||||||
let user = users.find(x => message!.author === x?._id);
|
let user = users.find(x => message!.author === x?._id);
|
||||||
if (!user) return;
|
if (!user) return;
|
||||||
|
@ -68,7 +73,8 @@ export default function ReplyBar({ channel, replies, setReplies }: Props) {
|
||||||
<ReplyBase preview>
|
<ReplyBase preview>
|
||||||
<CornerUpRight size={22} />
|
<CornerUpRight size={22} />
|
||||||
<UserShort user={user} size={16} />
|
<UserShort user={user} size={16} />
|
||||||
<Markdown disallowBigEmoji content={(message.content as string).split('\n').shift()} />
|
{ message.attachments && message.attachments.length > 0 && <File size={16} /> }
|
||||||
|
<Markdown disallowBigEmoji content={(message.content as string).replace(/\n/g, ' ')} />
|
||||||
</ReplyBase>
|
</ReplyBase>
|
||||||
<span class="actions">
|
<span class="actions">
|
||||||
<IconButton onClick={() => setReplies(replies.map((_, i) => i === index ? { ..._, mention: !_.mention } : _))}>
|
<IconButton onClick={() => setReplies(replies.map((_, i) => i === index ? { ..._, mention: !_.mention } : _))}>
|
||||||
|
|
|
@ -502,15 +502,15 @@ function ContextMenus(props: Props) {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (message && !queued) {
|
if (message && !queued) {
|
||||||
|
generateAction({
|
||||||
|
action: "reply_message",
|
||||||
|
id: message._id
|
||||||
|
});
|
||||||
|
|
||||||
if (
|
if (
|
||||||
typeof message.content === "string" &&
|
typeof message.content === "string" &&
|
||||||
message.content.length > 0
|
message.content.length > 0
|
||||||
) {
|
) {
|
||||||
generateAction({
|
|
||||||
action: "reply_message",
|
|
||||||
id: message._id
|
|
||||||
});
|
|
||||||
|
|
||||||
generateAction({
|
generateAction({
|
||||||
action: "quote_message",
|
action: "quote_message",
|
||||||
content: message.content
|
content: message.content
|
||||||
|
|
Loading…
Reference in a new issue