mirror of
https://github.com/cinnyapp/cinny.git
synced 2025-11-10 17:20:28 +03:00
add simple button to start a thread on reply
This commit is contained in:
parent
225894d327
commit
214b96c18b
2 changed files with 21 additions and 3 deletions
|
|
@ -932,7 +932,7 @@ export function RoomTimeline({
|
||||||
);
|
);
|
||||||
|
|
||||||
const handleReplyClick: MouseEventHandler<HTMLButtonElement> = useCallback(
|
const handleReplyClick: MouseEventHandler<HTMLButtonElement> = useCallback(
|
||||||
(evt) => {
|
(evt, startThread = false) => {
|
||||||
const replyId = evt.currentTarget.getAttribute('data-event-id');
|
const replyId = evt.currentTarget.getAttribute('data-event-id');
|
||||||
if (!replyId) {
|
if (!replyId) {
|
||||||
console.warn('Button should have "data-event-id" attribute!');
|
console.warn('Button should have "data-event-id" attribute!');
|
||||||
|
|
@ -943,7 +943,9 @@ export function RoomTimeline({
|
||||||
const editedReply = getEditedEvent(replyId, replyEvt, room.getUnfilteredTimelineSet());
|
const editedReply = getEditedEvent(replyId, replyEvt, room.getUnfilteredTimelineSet());
|
||||||
const content: IContent = editedReply?.getContent()['m.new_content'] ?? replyEvt.getContent();
|
const content: IContent = editedReply?.getContent()['m.new_content'] ?? replyEvt.getContent();
|
||||||
const { body, formatted_body: formattedBody } = content;
|
const { body, formatted_body: formattedBody } = content;
|
||||||
const { 'm.relates_to': relation } = replyEvt.getWireContent();
|
const { 'm.relates_to': relation } = startThread
|
||||||
|
? { 'm.relates_to': { rel_type: 'm.thread', event_id: replyId } }
|
||||||
|
: replyEvt.getWireContent();
|
||||||
const senderId = replyEvt.getSender();
|
const senderId = replyEvt.getSender();
|
||||||
if (senderId && typeof body === 'string') {
|
if (senderId && typeof body === 'string') {
|
||||||
setReplyDraft({
|
setReplyDraft({
|
||||||
|
|
|
||||||
|
|
@ -669,7 +669,10 @@ export type MessageProps = {
|
||||||
messageSpacing: MessageSpacing;
|
messageSpacing: MessageSpacing;
|
||||||
onUserClick: MouseEventHandler<HTMLButtonElement>;
|
onUserClick: MouseEventHandler<HTMLButtonElement>;
|
||||||
onUsernameClick: MouseEventHandler<HTMLButtonElement>;
|
onUsernameClick: MouseEventHandler<HTMLButtonElement>;
|
||||||
onReplyClick: MouseEventHandler<HTMLButtonElement>;
|
onReplyClick: (
|
||||||
|
ev: Parameters<MouseEventHandler<HTMLButtonElement>>[0],
|
||||||
|
startThread?: boolean
|
||||||
|
) => void;
|
||||||
onEditId?: (eventId?: string) => void;
|
onEditId?: (eventId?: string) => void;
|
||||||
onReactionToggle: (targetEventId: string, key: string, shortcode?: string) => void;
|
onReactionToggle: (targetEventId: string, key: string, shortcode?: string) => void;
|
||||||
reply?: ReactNode;
|
reply?: ReactNode;
|
||||||
|
|
@ -857,6 +860,8 @@ export const Message = as<'div', MessageProps>(
|
||||||
}, 100);
|
}, 100);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const isThreadedMessage = mEvent.threadRootId !== undefined;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<MessageBase
|
<MessageBase
|
||||||
className={classNames(css.MessageBase, className)}
|
className={classNames(css.MessageBase, className)}
|
||||||
|
|
@ -919,6 +924,17 @@ export const Message = as<'div', MessageProps>(
|
||||||
>
|
>
|
||||||
<Icon src={Icons.ReplyArrow} size="100" />
|
<Icon src={Icons.ReplyArrow} size="100" />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
{!isThreadedMessage && (
|
||||||
|
<IconButton
|
||||||
|
onClick={(ev) => onReplyClick(ev, true)}
|
||||||
|
data-event-id={mEvent.getId()}
|
||||||
|
variant="SurfaceVariant"
|
||||||
|
size="300"
|
||||||
|
radii="300"
|
||||||
|
>
|
||||||
|
<Icon src={Icons.Message} size="100" />
|
||||||
|
</IconButton>
|
||||||
|
)}
|
||||||
{canEditEvent(mx, mEvent) && onEditId && (
|
{canEditEvent(mx, mEvent) && onEditId && (
|
||||||
<IconButton
|
<IconButton
|
||||||
onClick={() => onEditId(mEvent.getId())}
|
onClick={() => onEditId(mEvent.getId())}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue