Navigate to /announcements if there are more than three unreads

This commit is contained in:
naskya 2023-07-08 21:02:11 +00:00
parent 20fbb4f57e
commit 8b79f59d8d
No known key found for this signature in database
GPG Key ID: 164DFF24E2D40139
4 changed files with 81 additions and 2 deletions

View File

@ -1116,6 +1116,7 @@ enableServerMachineStats: "Enable server hardware statistics"
enableIdenticonGeneration: "Enable Identicon generation" enableIdenticonGeneration: "Enable Identicon generation"
showPopup: "Notify users about this announcement with a popup" showPopup: "Notify users about this announcement with a popup"
isGoodNews: "This is a good news" isGoodNews: "This is a good news"
youHaveUnreadAnnouncements: "You have unread announcements"
_sensitiveMediaDetection: _sensitiveMediaDetection:
description: "Reduces the effort of server moderation through automatically recognizing description: "Reduces the effort of server moderation through automatically recognizing

View File

@ -982,6 +982,7 @@ enableServerMachineStats: "サーバーのマシン情報を公開する"
enableIdenticonGeneration: "ユーザーごとのIdenticon生成を有効にする" enableIdenticonGeneration: "ユーザーごとのIdenticon生成を有効にする"
showPopup: "ポップアップを表示してユーザーに知らせる" showPopup: "ポップアップを表示してユーザーに知らせる"
isGoodNews: "これは良いニュースです" isGoodNews: "これは良いニュースです"
youHaveUnreadAnnouncements: "未読のお知らせがあります"
_sensitiveMediaDetection: _sensitiveMediaDetection:
description: "機械学習を使って自動でセンシティブなメディアを検出し、モデレーションに役立てられます。サーバーの負荷が少し増えます。" description: "機械学習を使って自動でセンシティブなメディアを検出し、モデレーションに役立てられます。サーバーの負荷が少し増えます。"

View File

@ -0,0 +1,67 @@
<template>
<MkModal ref="modal" :z-priority="'middle'" @closed="$emit('closed')">
<div :class="$style.root">
<p :class="$style.title">
{{ i18n.ts.youHaveUnreadAnnouncements }}
</p>
<MkButton
:class="$style.gotIt"
primary
full
@click="checkAnnouncements()"
>{{ i18n.ts.gotIt }}</MkButton
>
</div>
</MkModal>
</template>
<script lang="ts" setup>
import { shallowRef } from "vue";
import MkModal from "@/components/MkModal.vue";
import MkButton from "@/components/MkButton.vue";
import { version } from "@/config";
import { i18n } from "@/i18n";
import * as os from "@/os";
const modal = shallowRef<InstanceType<typeof MkModal>>();
const checkAnnouncements = () => {
modal.value.close();
location.href = "/announcements";
};
</script>
<style lang="scss" module>
.root {
margin: auto;
position: relative;
padding: 32px;
min-width: 320px;
max-width: 480px;
box-sizing: border-box;
text-align: center;
background: var(--panel);
border-radius: var(--radius);
}
.title {
font-weight: bold;
}
.version {
margin: 1em 0;
}
.image {
max-width: 500px;
}
.gotIt {
margin: 8px 0 0 0;
}
.releaseNotes {
> img {
border-radius: 10px;
}
}
</style>

View File

@ -272,14 +272,24 @@ function checkForSplash() {
} }
} }
if ($i) { if (
$i &&
!["/announcements", "/announcements/"].includes(window.location.pathname)
) {
api("announcements", { withUnreads: true, limit: 10 }) api("announcements", { withUnreads: true, limit: 10 })
.then((announcements) => { .then((announcements) => {
const unreadAnnouncements = announcements.filter((item) => { const unreadAnnouncements = announcements.filter((item) => {
return !item.isRead; return !item.isRead;
}); });
if (unreadAnnouncements.length > 3) { if (unreadAnnouncements.length > 3) {
// TODO: navigate to the announcements page when there are too many unreads popup(
defineAsyncComponent(
() => import("@/components/MkManyAnnouncements.vue"),
),
{},
{},
"closed",
);
} else { } else {
unreadAnnouncements.forEach((item) => { unreadAnnouncements.forEach((item) => {
if (item.showPopup) if (item.showPopup)