Mizah/mizzkey
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'notification-read-api' into swn

Browse source
This commit is contained in:
tamaina 2021-11-13 12:27:54 +09:00
commit 7c6ed8d9e5
52 changed files with 621 additions and 452 deletions
Download patch file Download diff file Expand all files Collapse all files

43
packages/client/src/components/notification.vue
View file

@ -69,6 +69,7 @@
<script lang="ts">
import { defineComponent, ref, onMounted, onUnmounted, watch } from 'vue';
import * as misskey from 'misskey-js';
import { getNoteSummary } from '@/scripts/get-note-summary';
import XReactionIcon from './reaction-icon.vue';
import MkFollowButton from './follow-button.vue';
@ -77,6 +78,7 @@ import notePage from '@/filters/note';
import { userPage } from '@/filters/user';
import { i18n } from '@/i18n';
import * as os from '@/os';
import { useTooltip } from '@/scripts/use-tooltip';
export default defineComponent({
components: {
@ -105,7 +107,7 @@ export default defineComponent({
const reactionRef = ref(null);
onMounted(() => {
let readObserver: IntersectionObserver = null;
let readObserver: IntersectionObserver | null = null;
let connection = null;
if (!props.notification.isRead) {
@ -156,50 +158,17 @@ export default defineComponent({
os.api('users/groups/invitations/reject', { invitationId: props.notification.invitation.id });
};
let isReactionHovering = false;
let reactionTooltipTimeoutId;
const onReactionMouseover = () => {
if (isReactionHovering) return;
isReactionHovering = true;
reactionTooltipTimeoutId = setTimeout(openReactionTooltip, 300);
};
const onReactionMouseleave = () => {
if (!isReactionHovering) return;
isReactionHovering = false;
clearTimeout(reactionTooltipTimeoutId);
closeReactionTooltip();
};
let changeReactionTooltipShowingState: () => void;
const openReactionTooltip = () => {
closeReactionTooltip();
if (!isReactionHovering) return;
const showing = ref(true);
const { onMouseover: onReactionMouseover, onMouseleave: onReactionMouseleave } = useTooltip((showing) => {
os.popup(XReactionTooltip, {
showing,
reaction: props.notification.reaction ? props.notification.reaction.replace(/^:(\w+):$/, ':$1@.:') : props.notification.reaction,
emojis: props.notification.note.emojis,
source: reactionRef.value.$el,
}, {}, 'closed');
changeReactionTooltipShowingState = () => {
showing.value = false;
};
};
const closeReactionTooltip = () => {
if (changeReactionTooltipShowingState != null) {
changeReactionTooltipShowingState();
changeReactionTooltipShowingState = null;
}
};
});
return {
getNoteSummary: (text: string) => getNoteSummary(text, i18n),
getNoteSummary: (note: misskey.entities.Note) => getNoteSummary(note, i18n),
followRequestDone,
groupInviteDone,
notePage,