Michcio/FoundKey-0x7f
1
1
Fork 0
forked from FoundKeyGang/FoundKey
Code Pull requests Releases Activity

Replace toast (sorry!) notifications with browser ones

Browse source 
Icons don't work in Safari just because they don't lmao

This is just barely tested, bear with me
This commit is contained in:
Michcio 2022-09-23 11:42:21 +02:00
parent a903263e00
commit 8fcfdc88d8
1 changed files with 55 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

59
packages/client/src/ui/_common_/common.vue
View file

@ -17,6 +17,7 @@
</template>
<script lang="ts" setup>
import * as foundkey from 'foundkey-js';
import { defineAsyncComponent, Ref, ref } from 'vue';
import { swInject } from './sw-inject';
import { popup as showPopup, popups, pendingApiRequestsCount } from '@/os';
@ -24,12 +25,15 @@ import { uploads } from '@/scripts/upload';
import * as sound from '@/scripts/sound';
import { $i } from '@/account';
import { stream } from '@/stream';
import { instance } from '@/instance';
import { getNoteSummary } from '@/scripts/get-note-summary';
import { acct } from '@/filters/user';
const XStreamIndicator = defineAsyncComponent(() => import('./stream-indicator.vue'));
const XUpload = defineAsyncComponent(() => import('./upload.vue'));
const dev: Ref<boolean> = ref(_DEV_);
const onNotification = (notification: { type: string; id: any; }): void => {
const onNotification = (notification: foundkey.entities.Notification): void => {
if ($i?.mutingNotificationTypes.includes(notification.type)) return;
if (document.visibilityState === 'visible') {
@ -37,9 +41,55 @@ const onNotification = (notification: { type: string; id: any; }): void => {
id: notification.id,
});
showPopup(defineAsyncComponent(() => import('@/components/notification-toast.vue')), {
notification,
}, {}, 'closed');
if (notification.type !== 'app') {
const user = notification.user;
const userName = acct(user);
let title: string;
let body = 'note' in notification ? getNoteSummary(notification.note) : undefined;
switch (notification.type) {
case 'pollEnded':
title = `${userName}'s poll has ended`;
break;
case 'follow':
title = `${userName} followed you`;
break;
case 'followRequestAccepted':
title = `${userName} accepted your follow request`;
break;
case 'mention':
title = `${userName} mentioned you`;
break;
case 'pollVote':
title = `${userName} voted in your poll`;
break;
case 'quote':
title = `${userName} quoted your post`;
break;
case 'reaction':
title = `${userName} ${notification.reaction}ed your post`;
break;
case 'receiveFollowRequest':
title = `${userName} sent you a follow request`;
break;
case 'renote':
title = `${userName} renoted your post`;
break;
case 'reply':
title = `${userName} replied to your post`;
break;
case 'groupInvited':
title = `${userName} invited you to a group`;
break;
}
console.log(user, userName, title, body);
new Notification(title, {
body,
image: user.avatarUrl,
icon: instance.iconUrl,
// TODO: timestamp?
});
}
}
sound.play('notification');
@ -48,6 +98,7 @@ const onNotification = (notification: { type: string; id: any; }): void => {
if ($i) {
const connection = stream.useChannel('main', null, 'UI');
connection.on('notification', onNotification);
Notification.requestPermission();
//#region Listen message from SW
if ('serviceWorker' in navigator) {