mirror of
https://github.com/thelounge/thelounge.git
synced 2026-07-30 22:55:50 -04:00
f77e4d1e6f
Relies on https://github.com/kiwiirc/irc-framework/pull/411 https://ircv3.net/specs/client-tags/reply.html Design feedback very welcome <img width="1718" height="278" alt="Screenshot 2026-04-11 at 21-00-22 #thelounge — The Lounge" src="https://github.com/user-attachments/assets/ba6e7c69-2477-4a7b-b196-901d19ca9cba" /> 1. we lack a 'thread' view (irccloud, slack, etc). can be a followup if we do want it 2. need to test scrolling to messages outside of the current buffer 3. due to lack of client support, i opted to auto prefill the input with \`<targetNick>: \` so people can follow along even without reply support 4. CSS can definitely be improved (once a design is settled on) --------- Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Co-authored-by: Copilot Autofix powered by AI <223894421+github-code-quality[bot]@users.noreply.github.com>
43 lines
1.3 KiB
Vue
43 lines
1.3 KiB
Vue
<template>
|
|
<component
|
|
:is="parentInHistory ? 'div' : 'span'"
|
|
:class="[
|
|
'reply-context',
|
|
{
|
|
disabled: !parentInHistory,
|
|
tooltipped: !parentInHistory,
|
|
'tooltipped-e': !parentInHistory,
|
|
},
|
|
]"
|
|
:role="parentInHistory ? 'button' : undefined"
|
|
:tabindex="parentInHistory ? 0 : undefined"
|
|
:aria-label="!parentInHistory ? 'Original message is no longer in scrollback' : undefined"
|
|
@click="parentInHistory ? $emit('scroll-to-parent') : undefined"
|
|
@keydown.enter.prevent="parentInHistory ? $emit('scroll-to-parent') : undefined"
|
|
@keydown.space.prevent="parentInHistory ? $emit('scroll-to-parent') : undefined"
|
|
>
|
|
<span class="reply-context-icon" aria-hidden="true" />
|
|
<template v-if="message.replyToNick">
|
|
<span class="reply-context-nick">{{ message.replyToNick }}</span>
|
|
<span v-if="message.replyToText" class="reply-context-text">{{
|
|
message.replyToText
|
|
}}</span>
|
|
</template>
|
|
<span v-else class="reply-context-unknown">In reply to a message</span>
|
|
</component>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import {defineComponent, PropType} from "vue";
|
|
import type {ClientMessage} from "../js/types";
|
|
|
|
export default defineComponent({
|
|
name: "ReplyContext",
|
|
props: {
|
|
message: {type: Object as PropType<ClientMessage>, required: true},
|
|
parentInHistory: {type: Boolean, required: true},
|
|
},
|
|
emits: ["scroll-to-parent"],
|
|
});
|
|
</script>
|