From 95750509b14ab5f5a5d8c9a5defafd95ee7efbe3 Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Thu, 17 Mar 2022 14:01:45 -0400
Subject: Fetch real data from backend

---
 src/modules/announcements.js | 60 ++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 60 insertions(+)
 create mode 100644 src/modules/announcements.js

(limited to 'src/modules/announcements.js')

diff --git a/src/modules/announcements.js b/src/modules/announcements.js
new file mode 100644
index 00000000..2ab2600c
--- /dev/null
+++ b/src/modules/announcements.js
@@ -0,0 +1,60 @@
+import { set } from 'vue'
+
+const FETCH_ANNOUNCEMENT_INTERVAL_MS = 1000 * 60 * 5
+
+export const defaultState = {
+  announcements: [],
+  fetchAnnouncementsTimer: undefined
+}
+
+export const mutations = {
+  setAnnouncements (state, announcements) {
+    set(state, 'announcements', announcements)
+  },
+  setAnnouncementRead (state, { id, read }) {
+    if (!state.announcements[id]) {
+      return
+    }
+
+    set(state.announcements[id], 'read', read)
+  },
+  setFetchAnnouncementsTimer (state, timer) {
+    set(state, 'fetchAnnouncementsTimer', announcements)
+  }
+}
+
+const announcements = {
+  state: defaultState,
+  mutations,
+  actions: {
+    fetchAnnouncements (store) {
+      return store.rootState.api.backendInteractor.fetchAnnouncements()
+        .then(announcements => {
+          store.commit('setAnnouncements', announcements)
+        })
+    },
+    markAnnouncementAsRead (store, id) {
+      return store.rootState.api.backendInteractor.dismissAnnouncement({ id })
+        .then(() => {
+          store.commit('setAnnouncementRead', { id, read: true })
+        })
+    },
+    startFetchingAnnouncements (store) {
+      if (store.state.fetchAnnouncementsTimer) {
+        return
+      }
+
+      const interval = setInterval(() => store.dispatch('fetchAnnouncements'), FETCH_ANNOUNCEMENT_INTERVAL_MS)
+      store.commit('setFetchAnnouncementsTimer', interval)
+
+      return store.dispatch('fetchAnnouncements')
+    },
+    stopFetchingAnnouncements (store) {
+      const interval = store.state.fetchAnnouncementsTimer
+      store.commit('setFetchAnnouncementsTimer', undefined)
+      clearInterval(interval)
+    }
+  }
+}
+
+export default announcements
-- 
cgit v1.2.3-70-g09d2


From e494e746439e3e622c5b12a182b6c6a9de540821 Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Thu, 17 Mar 2022 14:54:52 -0400
Subject: Implement posting announcements

---
 .../announcements_page/announcements_page.js       | 28 ++++++++
 .../announcements_page/announcements_page.vue      | 76 ++++++++++++++++++++++
 src/modules/announcements.js                       |  6 ++
 src/services/api/api.service.js                    | 27 +++++++-
 4 files changed, 136 insertions(+), 1 deletion(-)

(limited to 'src/modules/announcements.js')

diff --git a/src/components/announcements_page/announcements_page.js b/src/components/announcements_page/announcements_page.js
index a2a218fd..ec038361 100644
--- a/src/components/announcements_page/announcements_page.js
+++ b/src/components/announcements_page/announcements_page.js
@@ -1,16 +1,44 @@
+import { mapState } from 'vuex'
 import Announcement from '../announcement/announcement.vue'
 
 const AnnouncementsPage = {
   components: {
     Announcement
   },
+  data () {
+    return {
+      newAnnouncement: {
+        content: ''
+      },
+      posting: false,
+      error: undefined
+    }
+  },
   mounted () {
     this.$store.dispatch('fetchAnnouncements')
   },
   computed: {
+    ...mapState({
+      currentUser: state => state.users.currentUser
+    }),
     announcements () {
       return this.$store.state.announcements.announcements
     }
+  },
+  methods: {
+    postAnnouncement () {
+      this.posting = true
+      this.$store.dispatch('postAnnouncement', this.newAnnouncement)
+        .catch(error => {
+          this.error = error.error
+        })
+        .finally(() => {
+          this.posting = false
+        })
+    },
+    clearError () {
+      this.error = undefined
+    }
   }
 }
 
diff --git a/src/components/announcements_page/announcements_page.vue b/src/components/announcements_page/announcements_page.vue
index 16b2f955..1b3bd578 100644
--- a/src/components/announcements_page/announcements_page.vue
+++ b/src/components/announcements_page/announcements_page.vue
@@ -6,6 +6,51 @@
       </span>
     </div>
     <div class="panel-body">
+      <section
+        v-if="currentUser && currentUser.role === 'admin'"
+      >
+        <div class="post-form">
+          <div class="heading">
+            <h4>{{ $t('announcements.post_form_header') }}</h4>
+          </div>
+          <div class="body">
+            <textarea
+              ref="textarea"
+              v-model="newAnnouncement.content"
+              class="post-textarea"
+              rows="1"
+              cols="1"
+              :placeholder="$t('announcements.post_placeholder')"
+              :disabled="posting"
+            />
+          </div>
+          <div class="footer">
+            <button
+              class="btn button-default post-button"
+              :disabled="posting"
+              @click.prevent="postAnnouncement"
+            >
+              {{ $t('announcements.post_action') }}
+            </button>
+            <div
+              v-if="error"
+              class="alert error"
+            >
+              {{ $t('announcements.post_error', { error }) }}
+              <button
+                class="button-unstyled"
+                @click="clearError"
+              >
+                <FAIcon
+                  class="fa-scale-110 fa-old-padding"
+                  icon="times"
+                  :title="$t('announcements.close_error')"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+      </section>
       <section
         v-for="announcement in announcements"
         :key="announcement.id"
@@ -19,3 +64,34 @@
 </template>
 
 <script src="./announcements_page.js"></script>
+
+<style lang="scss">
+@import "../../variables";
+
+.announcements-page {
+  .post-form {
+    padding: var(--status-margin, $status-margin);
+
+    .heading, .body {
+      margin-bottom: var(--status-margin, $status-margin);
+    }
+
+    .body {
+      display: flex;
+      align-items: stretch;
+      flex-direction: column;
+    }
+
+    .post-textarea {
+      resize: vertical;
+      height: 10em;
+      overflow: none;
+      box-sizing: content-box;
+    }
+
+    .post-button {
+      min-width: 10em;
+    }
+  }
+}
+</style>
diff --git a/src/modules/announcements.js b/src/modules/announcements.js
index 2ab2600c..76cea154 100644
--- a/src/modules/announcements.js
+++ b/src/modules/announcements.js
@@ -53,6 +53,12 @@ const announcements = {
       const interval = store.state.fetchAnnouncementsTimer
       store.commit('setFetchAnnouncementsTimer', undefined)
       clearInterval(interval)
+    },
+    postAnnouncement (store, { content, startsAt, endsAt, allDay }) {
+      return store.rootState.api.backendInteractor.postAnnouncement({ content, startsAt, endsAt, allDay })
+        .then(() => {
+          return store.dispatch('fetchAnnouncements')
+        })
     }
   }
 }
diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
index 10d43632..5206602d 100644
--- a/src/services/api/api.service.js
+++ b/src/services/api/api.service.js
@@ -102,6 +102,7 @@ const PLEROMA_CHAT_READ_URL = id => `/api/v1/pleroma/chats/${id}/read`
 const PLEROMA_DELETE_CHAT_MESSAGE_URL = (chatId, messageId) => `/api/v1/pleroma/chats/${chatId}/messages/${messageId}`
 const PLEROMA_ADMIN_REPORTS = '/api/pleroma/admin/reports'
 const PLEROMA_BACKUP_URL = '/api/v1/pleroma/backups'
+const PLEROMA_POST_ANNOUNCEMENT_URL = '/api/v1/pleroma/admin/announcements'
 
 const oldfetch = window.fetch
 
@@ -1375,6 +1376,29 @@ const dismissAnnouncement = ({ id, credentials }) => {
   })
 }
 
+const postAnnouncement = ({ credentials, content, startsAt, endsAt, allDay }) => {
+  const payload = { content }
+
+  if (typeof startsAt !== 'undefined') {
+    payload['starts_at'] = startsAt
+  }
+
+  if (typeof endsAt !== 'undefined') {
+    payload['ends_at'] = endsAt
+  }
+
+  if (typeof allDay !== 'undefined') {
+    payload['all_day'] = allDay
+  }
+
+  return promisedRequest({
+    url: PLEROMA_POST_ANNOUNCEMENT_URL,
+    credentials,
+    method: 'POST',
+    payload
+  })
+}
+
 export const getMastodonSocketURI = ({ credentials, stream, args = {} }) => {
   return Object.entries({
     ...(credentials
@@ -1703,7 +1727,8 @@ const apiService = {
   setReportState,
   fetchUserInLists,
   fetchAnnouncements,
-  dismissAnnouncement
+  dismissAnnouncement,
+  postAnnouncement
 }
 
 export default apiService
-- 
cgit v1.2.3-70-g09d2


From e877fedb0e60e795bd5c6aa3e706c64f12746c66 Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Thu, 17 Mar 2022 15:07:04 -0400
Subject: Implement deleting announcement

---
 src/components/announcement/announcement.js  |  7 +++++++
 src/components/announcement/announcement.vue | 18 ++++++++++++++++++
 src/modules/announcements.js                 |  6 ++++++
 src/services/api/api.service.js              | 12 +++++++++++-
 4 files changed, 42 insertions(+), 1 deletion(-)

(limited to 'src/modules/announcements.js')

diff --git a/src/components/announcement/announcement.js b/src/components/announcement/announcement.js
index 9e043e48..b1f5ee77 100644
--- a/src/components/announcement/announcement.js
+++ b/src/components/announcement/announcement.js
@@ -1,9 +1,13 @@
+import { mapState } from 'vuex'
 
 const Announcement = {
   props: {
     announcement: Object
   },
   computed: {
+    ...mapState({
+      currentUser: state => state.users.currentUser
+    }),
     content () {
       return this.announcement.content
     },
@@ -16,6 +20,9 @@ const Announcement = {
       if (!this.isRead) {
         return this.$store.dispatch('markAnnouncementAsRead', this.announcement.id)
       }
+    },
+    deleteAnnouncement () {
+      return this.$store.dispatch('deleteAnnouncement', this.announcement.id)
     }
   }
 }
diff --git a/src/components/announcement/announcement.vue b/src/components/announcement/announcement.vue
index d8591468..d6f35b9f 100644
--- a/src/components/announcement/announcement.vue
+++ b/src/components/announcement/announcement.vue
@@ -12,12 +12,20 @@
     </div>
     <div class="footer">
       <button
+        v-if="currentUser"
         class="btn button-default"
         :class="{ toggled: isRead }"
         @click="markAsRead"
       >
         {{ $t('announcements.mark_as_read_action') }}
       </button>
+      <button
+        v-if="currentUser && currentUser.role === 'admin'"
+        class="btn button-default"
+        @click="deleteAnnouncement"
+      >
+        {{ $t('announcements.delete_action') }}
+      </button>
     </div>
   </div>
 </template>
@@ -37,5 +45,15 @@
   .heading, .body {
     margin-bottom: var(--status-margin, $status-margin);
   }
+
+  .footer {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-around;
+
+    .btn {
+      min-width: 10em;
+    }
+  }
 }
 </style>
diff --git a/src/modules/announcements.js b/src/modules/announcements.js
index 76cea154..ddc51c33 100644
--- a/src/modules/announcements.js
+++ b/src/modules/announcements.js
@@ -59,6 +59,12 @@ const announcements = {
         .then(() => {
           return store.dispatch('fetchAnnouncements')
         })
+    },
+    deleteAnnouncement (store, id) {
+      return store.rootState.api.backendInteractor.deleteAnnouncement({ id })
+        .then(() => {
+          return store.dispatch('fetchAnnouncements')
+        })
     }
   }
 }
diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
index 5206602d..96b8bd70 100644
--- a/src/services/api/api.service.js
+++ b/src/services/api/api.service.js
@@ -103,6 +103,7 @@ const PLEROMA_DELETE_CHAT_MESSAGE_URL = (chatId, messageId) => `/api/v1/pleroma/
 const PLEROMA_ADMIN_REPORTS = '/api/pleroma/admin/reports'
 const PLEROMA_BACKUP_URL = '/api/v1/pleroma/backups'
 const PLEROMA_POST_ANNOUNCEMENT_URL = '/api/v1/pleroma/admin/announcements'
+const PLEROMA_DELETE_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcements/${id}`
 
 const oldfetch = window.fetch
 
@@ -1399,6 +1400,14 @@ const postAnnouncement = ({ credentials, content, startsAt, endsAt, allDay }) =>
   })
 }
 
+const deleteAnnouncement = ({ id, credentials }) => {
+  return promisedRequest({
+    url: PLEROMA_DELETE_ANNOUNCEMENT_URL(id),
+    credentials,
+    method: 'DELETE'
+  })
+}
+
 export const getMastodonSocketURI = ({ credentials, stream, args = {} }) => {
   return Object.entries({
     ...(credentials
@@ -1728,7 +1737,8 @@ const apiService = {
   fetchUserInLists,
   fetchAnnouncements,
   dismissAnnouncement,
-  postAnnouncement
+  postAnnouncement,
+  deleteAnnouncement
 }
 
 export default apiService
-- 
cgit v1.2.3-70-g09d2


From 04fbb6d93d6217812dc1b594b65f237bcee692a7 Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Thu, 17 Mar 2022 16:51:32 -0400
Subject: Show announcement dates

---
 src/components/announcement/announcement.js        | 35 ++++++++++++++
 src/components/announcement/announcement.vue       | 54 ++++++++++++++++------
 .../announcement_editor/announcement_editor.js     | 13 ++++++
 .../announcement_editor/announcement_editor.vue    | 52 +++++++++++++++++++++
 .../announcements_page/announcements_page.js       |  4 +-
 .../announcements_page/announcements_page.vue      | 41 +---------------
 src/modules/announcements.js                       |  7 ++-
 src/services/api/api.service.js                    |  8 +++-
 8 files changed, 156 insertions(+), 58 deletions(-)
 create mode 100644 src/components/announcement_editor/announcement_editor.js
 create mode 100644 src/components/announcement_editor/announcement_editor.vue

(limited to 'src/modules/announcements.js')

diff --git a/src/components/announcement/announcement.js b/src/components/announcement/announcement.js
index b1f5ee77..309eecea 100644
--- a/src/components/announcement/announcement.js
+++ b/src/components/announcement/announcement.js
@@ -1,6 +1,21 @@
 import { mapState } from 'vuex'
+import AnnouncementEditor from '../announcement_editor/announcement_editor.vue'
+import localeService from '../../services/locale/locale.service.js'
 
 const Announcement = {
+  components: {
+    AnnouncementEditor
+  },
+  data () {
+    return {
+      editing: false,
+      newAnnouncement: {
+        content: '',
+        startsAt: undefined,
+        endsAt: undefined
+      }
+    }
+  },
   props: {
     announcement: Object
   },
@@ -13,6 +28,22 @@ const Announcement = {
     },
     isRead () {
       return this.announcement.read
+    },
+    startsAt () {
+      const time = this.announcement['starts_at']
+      if (!time) {
+        return
+      }
+
+      return this.formatTimeOrDate(time, localeService.internalToBrowserLocale(this.$i18n.locale))
+    },
+    endsAt () {
+      const time = this.announcement['ends_at']
+      if (!time) {
+        return
+      }
+
+      return this.formatTimeOrDate(time, localeService.internalToBrowserLocale(this.$i18n.locale))
     }
   },
   methods: {
@@ -23,6 +54,10 @@ const Announcement = {
     },
     deleteAnnouncement () {
       return this.$store.dispatch('deleteAnnouncement', this.announcement.id)
+    },
+    formatTimeOrDate (time, locale) {
+      const d = new Date(time)
+      return this.announcement['all_day'] ? d.toLocaleDateString(locale) : d.toLocaleString(locale)
     }
   }
 }
diff --git a/src/components/announcement/announcement.vue b/src/components/announcement/announcement.vue
index d6f35b9f..5ddeebf5 100644
--- a/src/components/announcement/announcement.vue
+++ b/src/components/announcement/announcement.vue
@@ -5,27 +5,42 @@
     </div>
     <div class="body">
       <rich-content
+        v-if="!editing"
         :html="content"
         :emoji="announcement.emojis"
         :handle-links="true"
       />
+      <announcement-editor
+        v-else
+        :announcement="newAnnouncement"
+      />
     </div>
     <div class="footer">
-      <button
-        v-if="currentUser"
-        class="btn button-default"
-        :class="{ toggled: isRead }"
-        @click="markAsRead"
-      >
-        {{ $t('announcements.mark_as_read_action') }}
-      </button>
-      <button
-        v-if="currentUser && currentUser.role === 'admin'"
-        class="btn button-default"
-        @click="deleteAnnouncement"
-      >
-        {{ $t('announcements.delete_action') }}
-      </button>
+      <div class="times">
+        <span v-if="startsAt">
+          {{ $t('announcements.start_time_display', { time: startsAt }) }}
+        </span>
+        <span v-if="endsAt">
+          {{ $t('announcements.end_time_display', { time: endsAt }) }}
+        </span>
+      </div>
+      <div class="actions">
+        <button
+          v-if="currentUser"
+          class="btn button-default"
+          :class="{ toggled: isRead }"
+          @click="markAsRead"
+        >
+          {{ $t('announcements.mark_as_read_action') }}
+        </button>
+        <button
+          v-if="currentUser && currentUser.role === 'admin'"
+          class="btn button-default"
+          @click="deleteAnnouncement"
+        >
+          {{ $t('announcements.delete_action') }}
+        </button>
+      </div>
     </div>
   </div>
 </template>
@@ -47,6 +62,15 @@
   }
 
   .footer {
+    display: flex;
+    flex-direction: column;
+    .times {
+      display: flex;
+      flex-direction: column;
+    }
+  }
+
+  .footer .actions {
     display: flex;
     flex-direction: row;
     justify-content: space-around;
diff --git a/src/components/announcement_editor/announcement_editor.js b/src/components/announcement_editor/announcement_editor.js
new file mode 100644
index 00000000..79a03afe
--- /dev/null
+++ b/src/components/announcement_editor/announcement_editor.js
@@ -0,0 +1,13 @@
+import Checkbox from '../checkbox/checkbox.vue'
+
+const AnnouncementEditor = {
+  components: {
+    Checkbox
+  },
+  props: {
+    announcement: Object,
+    disabled: Boolean
+  }
+}
+
+export default AnnouncementEditor
diff --git a/src/components/announcement_editor/announcement_editor.vue b/src/components/announcement_editor/announcement_editor.vue
new file mode 100644
index 00000000..e2418b8d
--- /dev/null
+++ b/src/components/announcement_editor/announcement_editor.vue
@@ -0,0 +1,52 @@
+<template>
+  <div class="announcement-editor">
+    <textarea
+      ref="textarea"
+      v-model="announcement.content"
+      class="post-textarea"
+      rows="1"
+      cols="1"
+      :placeholder="$t('announcements.post_placeholder')"
+      :disabled="disabled"
+    />
+    <span class="announcement-metadata">
+      <label for="announcement-start-time">{{ $t('announcements.start_time_prompt') }}</label>
+      <input
+        id="announcement-start-time"
+        v-model="announcement.startsAt"
+        :type="announcement.allDay ? 'date' : 'datetime-local'"
+        :disabled="disabled"
+      >
+    </span>
+    <span class="announcement-metadata">
+      <label for="announcement-end-time">{{ $t('announcements.end_time_prompt') }}</label>
+      <input
+        id="announcement-end-time"
+        v-model="announcement.endsAt"
+        :type="announcement.allDay ? 'date' : 'datetime-local'"
+        :disabled="disabled"
+      >
+    </span>
+    <span class="announcement-metadata">
+      <Checkbox
+        id="announcement-all-day"
+        v-model="announcement.allDay"
+        :disabled="disabled"
+      />
+      <label for="announcement-all-day">{{ $t('announcements.all_day_prompt') }}</label>
+    </span>
+  </div>
+</template>
+
+<script src="./announcement_editor.js"></script>
+
+<style lang="scss">
+    .announcement-editor {
+      display: flex;
+      align-items: stretch;
+      flex-direction: column;
+      .announcement-metadata {
+        margin-top: 0.5em;
+      }
+    }
+</style>
diff --git a/src/components/announcements_page/announcements_page.js b/src/components/announcements_page/announcements_page.js
index 30759533..0bb4892e 100644
--- a/src/components/announcements_page/announcements_page.js
+++ b/src/components/announcements_page/announcements_page.js
@@ -1,11 +1,11 @@
 import { mapState } from 'vuex'
 import Announcement from '../announcement/announcement.vue'
-import Checkbox from '../checkbox/checkbox.vue'
+import AnnouncementEditor from '../announcement_editor/announcement_editor.vue'
 
 const AnnouncementsPage = {
   components: {
     Announcement,
-    Checkbox
+    AnnouncementEditor
   },
   data () {
     return {
diff --git a/src/components/announcements_page/announcements_page.vue b/src/components/announcements_page/announcements_page.vue
index e81edee1..54307c4d 100644
--- a/src/components/announcements_page/announcements_page.vue
+++ b/src/components/announcements_page/announcements_page.vue
@@ -14,38 +14,10 @@
             <h4>{{ $t('announcements.post_form_header') }}</h4>
           </div>
           <div class="body">
-            <textarea
-              ref="textarea"
-              v-model="newAnnouncement.content"
-              class="post-textarea"
-              rows="1"
-              cols="1"
-              :placeholder="$t('announcements.post_placeholder')"
+            <announcement-editor
+              :announcement="newAnnouncement"
               :disabled="posting"
             />
-            <span class="announcement-metadata">
-              <label for="announcement-start-time">{{ $t('announcements.start_time_prompt') }}</label>
-              <input
-                id="announcement-start-time"
-                v-model="newAnnouncement.startsAt"
-                :type="newAnnouncement.allDay ? 'date' : 'datetime-local'"
-              >
-            </span>
-            <span class="announcement-metadata">
-              <label for="announcement-end-time">{{ $t('announcements.end_time_prompt') }}</label>
-              <input
-                id="announcement-end-time"
-                v-model="newAnnouncement.endsAt"
-                :type="newAnnouncement.allDay ? 'date' : 'datetime-local'"
-              >
-            </span>
-            <span class="announcement-metadata">
-              <Checkbox
-                id="announcement-all-day"
-                v-model="newAnnouncement.allDay"
-              />
-              <label for="announcement-all-day">{{ $t('announcements.all_day_prompt') }}</label>
-            </span>
           </div>
           <div class="footer">
             <button
@@ -99,15 +71,6 @@
       margin-bottom: var(--status-margin, $status-margin);
     }
 
-    .body {
-      display: flex;
-      align-items: stretch;
-      flex-direction: column;
-      .announcement-metadata {
-        margin-top: 0.5em;
-      }
-    }
-
     .post-textarea {
       resize: vertical;
       height: 10em;
diff --git a/src/modules/announcements.js b/src/modules/announcements.js
index ddc51c33..a42acf93 100644
--- a/src/modules/announcements.js
+++ b/src/modules/announcements.js
@@ -28,7 +28,12 @@ const announcements = {
   mutations,
   actions: {
     fetchAnnouncements (store) {
-      return store.rootState.api.backendInteractor.fetchAnnouncements()
+      const currentUser = store.rootState.users.currentUser
+      const isAdmin = currentUser && currentUser.role === 'admin'
+
+      return (isAdmin
+        ? store.rootState.api.backendInteractor.adminFetchAnnouncements()
+        : store.rootState.api.backendInteractor.fetchAnnouncements())
         .then(announcements => {
           store.commit('setAnnouncements', announcements)
         })
diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
index 752d5811..c2bfe8cc 100644
--- a/src/services/api/api.service.js
+++ b/src/services/api/api.service.js
@@ -102,6 +102,7 @@ const PLEROMA_CHAT_READ_URL = id => `/api/v1/pleroma/chats/${id}/read`
 const PLEROMA_DELETE_CHAT_MESSAGE_URL = (chatId, messageId) => `/api/v1/pleroma/chats/${chatId}/messages/${messageId}`
 const PLEROMA_ADMIN_REPORTS = '/api/pleroma/admin/reports'
 const PLEROMA_BACKUP_URL = '/api/v1/pleroma/backups'
+const PLEROMA_ANNOUNCEMENTS_URL = '/api/v1/pleroma/admin/announcements'
 const PLEROMA_POST_ANNOUNCEMENT_URL = '/api/v1/pleroma/admin/announcements'
 const PLEROMA_DELETE_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcements/${id}`
 
@@ -1365,6 +1366,10 @@ const dismissNotification = ({ credentials, id }) => {
   })
 }
 
+const adminFetchAnnouncements = ({ credentials }) => {
+  return promisedRequest({ url: PLEROMA_ANNOUNCEMENTS_URL, credentials })
+}
+
 const fetchAnnouncements = ({ credentials }) => {
   return promisedRequest({ url: MASTODON_ANNOUNCEMENTS_URL, credentials })
 }
@@ -1738,7 +1743,8 @@ const apiService = {
   fetchAnnouncements,
   dismissAnnouncement,
   postAnnouncement,
-  deleteAnnouncement
+  deleteAnnouncement,
+  adminFetchAnnouncements
 }
 
 export default apiService
-- 
cgit v1.2.3-70-g09d2


From 89c49b6fb46e607aee07afd5bc436e8f2f605bfe Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Thu, 17 Mar 2022 17:11:53 -0400
Subject: Allow editing announcements

---
 src/components/announcement/announcement.js        | 31 +++++++++++++-
 src/components/announcement/announcement.vue       | 50 +++++++++++++++++++++-
 .../announcement_editor/announcement_editor.vue    | 24 +++++++----
 .../announcements_page/announcements_page.vue      |  7 ---
 src/modules/announcements.js                       |  6 +++
 src/services/api/api.service.js                    | 23 ++++++++--
 6 files changed, 118 insertions(+), 23 deletions(-)

(limited to 'src/modules/announcements.js')

diff --git a/src/components/announcement/announcement.js b/src/components/announcement/announcement.js
index 309eecea..253e2bb2 100644
--- a/src/components/announcement/announcement.js
+++ b/src/components/announcement/announcement.js
@@ -12,8 +12,10 @@ const Announcement = {
       newAnnouncement: {
         content: '',
         startsAt: undefined,
-        endsAt: undefined
-      }
+        endsAt: undefined,
+        allDay: undefined
+      },
+      editError: ''
     }
   },
   props: {
@@ -58,6 +60,31 @@ const Announcement = {
     formatTimeOrDate (time, locale) {
       const d = new Date(time)
       return this.announcement['all_day'] ? d.toLocaleDateString(locale) : d.toLocaleString(locale)
+    },
+    enterEditMode () {
+      this.newAnnouncement.content = this.announcement.pleroma['raw_content']
+      this.newAnnouncement.startsAt = this.announcement['starts_at']
+      this.newAnnouncement.endsAt = this.announcement['ends_at']
+      this.newAnnouncement.allDay = this.announcement['all_day']
+      this.editing = true
+    },
+    submitEdit () {
+      this.$store.dispatch('editAnnouncement', {
+        id: this.announcement.id,
+        ...this.newAnnouncement
+      })
+        .then(() => {
+          this.editing = false
+        })
+        .catch(error => {
+          this.editError = error.error
+        })
+    },
+    cancelEdit () {
+      this.editing = false
+    },
+    clearError () {
+      this.editError = undefined
     }
   }
 }
diff --git a/src/components/announcement/announcement.vue b/src/components/announcement/announcement.vue
index 5ddeebf5..1e4edcca 100644
--- a/src/components/announcement/announcement.vue
+++ b/src/components/announcement/announcement.vue
@@ -16,7 +16,10 @@
       />
     </div>
     <div class="footer">
-      <div class="times">
+      <div
+        v-if="!editing"
+        class="times"
+      >
         <span v-if="startsAt">
           {{ $t('announcements.start_time_display', { time: startsAt }) }}
         </span>
@@ -24,7 +27,10 @@
           {{ $t('announcements.end_time_display', { time: endsAt }) }}
         </span>
       </div>
-      <div class="actions">
+      <div
+        v-if="!editing"
+        class="actions"
+      >
         <button
           v-if="currentUser"
           class="btn button-default"
@@ -33,6 +39,13 @@
         >
           {{ $t('announcements.mark_as_read_action') }}
         </button>
+        <button
+          v-if="currentUser && currentUser.role === 'admin'"
+          class="btn button-default"
+          @click="enterEditMode"
+        >
+          {{ $t('announcements.edit_action') }}
+        </button>
         <button
           v-if="currentUser && currentUser.role === 'admin'"
           class="btn button-default"
@@ -41,6 +54,39 @@
           {{ $t('announcements.delete_action') }}
         </button>
       </div>
+      <div
+        v-else
+        class="actions"
+      >
+        <button
+          class="btn button-default"
+          @click="submitEdit"
+        >
+          {{ $t('announcements.submit_edit_action') }}
+        </button>
+        <button
+          class="btn button-default"
+          @click="cancelEdit"
+        >
+          {{ $t('announcements.cancel_edit_action') }}
+        </button>
+        <div
+          v-if="editing && editError"
+          class="alert error"
+        >
+          {{ $t('announcements.edit_error', { error }) }}
+          <button
+            class="button-unstyled"
+            @click="clearError"
+          >
+            <FAIcon
+              class="fa-scale-110 fa-old-padding"
+              icon="times"
+              :title="$t('announcements.close_error')"
+            />
+          </button>
+        </div>
+      </div>
     </div>
   </div>
 </template>
diff --git a/src/components/announcement_editor/announcement_editor.vue b/src/components/announcement_editor/announcement_editor.vue
index e2418b8d..0f29f9f7 100644
--- a/src/components/announcement_editor/announcement_editor.vue
+++ b/src/components/announcement_editor/announcement_editor.vue
@@ -41,12 +41,20 @@
 <script src="./announcement_editor.js"></script>
 
 <style lang="scss">
-    .announcement-editor {
-      display: flex;
-      align-items: stretch;
-      flex-direction: column;
-      .announcement-metadata {
-        margin-top: 0.5em;
-      }
-    }
+.announcement-editor {
+  display: flex;
+  align-items: stretch;
+  flex-direction: column;
+
+  .announcement-metadata {
+    margin-top: 0.5em;
+  }
+
+  .post-textarea {
+    resize: vertical;
+    height: 10em;
+    overflow: none;
+    box-sizing: content-box;
+  }
+}
 </style>
diff --git a/src/components/announcements_page/announcements_page.vue b/src/components/announcements_page/announcements_page.vue
index 54307c4d..b1489dec 100644
--- a/src/components/announcements_page/announcements_page.vue
+++ b/src/components/announcements_page/announcements_page.vue
@@ -71,13 +71,6 @@
       margin-bottom: var(--status-margin, $status-margin);
     }
 
-    .post-textarea {
-      resize: vertical;
-      height: 10em;
-      overflow: none;
-      box-sizing: content-box;
-    }
-
     .post-button {
       min-width: 10em;
     }
diff --git a/src/modules/announcements.js b/src/modules/announcements.js
index a42acf93..1d97c67c 100644
--- a/src/modules/announcements.js
+++ b/src/modules/announcements.js
@@ -65,6 +65,12 @@ const announcements = {
           return store.dispatch('fetchAnnouncements')
         })
     },
+    editAnnouncement (store, { id, content, startsAt, endsAt, allDay }) {
+      return store.rootState.api.backendInteractor.editAnnouncement({ id, content, startsAt, endsAt, allDay })
+        .then(() => {
+          return store.dispatch('fetchAnnouncements')
+        })
+    },
     deleteAnnouncement (store, id) {
       return store.rootState.api.backendInteractor.deleteAnnouncement({ id })
         .then(() => {
diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
index c2bfe8cc..0d4c674a 100644
--- a/src/services/api/api.service.js
+++ b/src/services/api/api.service.js
@@ -104,6 +104,7 @@ const PLEROMA_ADMIN_REPORTS = '/api/pleroma/admin/reports'
 const PLEROMA_BACKUP_URL = '/api/v1/pleroma/backups'
 const PLEROMA_ANNOUNCEMENTS_URL = '/api/v1/pleroma/admin/announcements'
 const PLEROMA_POST_ANNOUNCEMENT_URL = '/api/v1/pleroma/admin/announcements'
+const PLEROMA_EDIT_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcements/${id}`
 const PLEROMA_DELETE_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcements/${id}`
 
 const oldfetch = window.fetch
@@ -1382,26 +1383,39 @@ const dismissAnnouncement = ({ id, credentials }) => {
   })
 }
 
-const postAnnouncement = ({ credentials, content, startsAt, endsAt, allDay }) => {
+const announcementToPayload = ({ content, startsAt, endsAt, allDay }) => {
   const payload = { content }
 
   if (typeof startsAt !== 'undefined') {
-    payload['starts_at'] = new Date(startsAt).toISOString()
+    payload['starts_at'] = startsAt ? new Date(startsAt).toISOString() : null
   }
 
   if (typeof endsAt !== 'undefined') {
-    payload['ends_at'] = new Date(endsAt).toISOString()
+    payload['ends_at'] = endsAt ? new Date(endsAt).toISOString() : null
   }
 
   if (typeof allDay !== 'undefined') {
     payload['all_day'] = allDay
   }
 
+  return payload
+}
+
+const postAnnouncement = ({ credentials, content, startsAt, endsAt, allDay }) => {
   return promisedRequest({
     url: PLEROMA_POST_ANNOUNCEMENT_URL,
     credentials,
     method: 'POST',
-    payload
+    payload: announcementToPayload({ content, startsAt, endsAt, allDay })
+  })
+}
+
+const editAnnouncement = ({ id, credentials, content, startsAt, endsAt, allDay }) => {
+  return promisedRequest({
+    url: PLEROMA_EDIT_ANNOUNCEMENT_URL(id),
+    credentials,
+    method: 'PATCH',
+    payload: announcementToPayload({ content, startsAt, endsAt, allDay })
   })
 }
 
@@ -1743,6 +1757,7 @@ const apiService = {
   fetchAnnouncements,
   dismissAnnouncement,
   postAnnouncement,
+  editAnnouncement,
   deleteAnnouncement,
   adminFetchAnnouncements
 }
-- 
cgit v1.2.3-70-g09d2


From 458ce5414363f37df94ebbc672dad784ad8fa1ee Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Thu, 17 Mar 2022 17:32:16 -0400
Subject: Mark inactive and active announcements for admin

---
 src/components/announcement/announcement.js  |  3 +++
 src/components/announcement/announcement.vue |  2 ++
 src/modules/announcements.js                 | 33 +++++++++++++++++++++++-----
 3 files changed, 33 insertions(+), 5 deletions(-)

(limited to 'src/modules/announcements.js')

diff --git a/src/components/announcement/announcement.js b/src/components/announcement/announcement.js
index 253e2bb2..893a07e0 100644
--- a/src/components/announcement/announcement.js
+++ b/src/components/announcement/announcement.js
@@ -46,6 +46,9 @@ const Announcement = {
       }
 
       return this.formatTimeOrDate(time, localeService.internalToBrowserLocale(this.$i18n.locale))
+    },
+    inactive () {
+      return this.announcement.inactive
     }
   },
   methods: {
diff --git a/src/components/announcement/announcement.vue b/src/components/announcement/announcement.vue
index 1e4edcca..f3b73d89 100644
--- a/src/components/announcement/announcement.vue
+++ b/src/components/announcement/announcement.vue
@@ -35,6 +35,8 @@
           v-if="currentUser"
           class="btn button-default"
           :class="{ toggled: isRead }"
+          :disabled="inactive"
+          :title="inactive ? $t('announcements.inactive_message') : ''"
           @click="markAsRead"
         >
           {{ $t('announcements.mark_as_read_action') }}
diff --git a/src/modules/announcements.js b/src/modules/announcements.js
index 1d97c67c..8470fb2a 100644
--- a/src/modules/announcements.js
+++ b/src/modules/announcements.js
@@ -12,11 +12,13 @@ export const mutations = {
     set(state, 'announcements', announcements)
   },
   setAnnouncementRead (state, { id, read }) {
-    if (!state.announcements[id]) {
+    const index = state.announcements.findIndex(a => a.id === id)
+
+    if (index < 0) {
       return
     }
 
-    set(state.announcements[id], 'read', read)
+    set(state.announcements[index], 'read', read)
   },
   setFetchAnnouncementsTimer (state, timer) {
     set(state, 'fetchAnnouncementsTimer', announcements)
@@ -31,9 +33,30 @@ const announcements = {
       const currentUser = store.rootState.users.currentUser
       const isAdmin = currentUser && currentUser.role === 'admin'
 
-      return (isAdmin
-        ? store.rootState.api.backendInteractor.adminFetchAnnouncements()
-        : store.rootState.api.backendInteractor.fetchAnnouncements())
+      const getAnnouncements = async () => {
+        if (!isAdmin) {
+          return store.rootState.api.backendInteractor.fetchAnnouncements()
+        }
+
+        const all = await store.rootState.api.backendInteractor.adminFetchAnnouncements()
+        const visible = await store.rootState.api.backendInteractor.fetchAnnouncements()
+        const visibleObject = visible.reduce((a, c) => {
+          a[c.id] = c
+          return a
+        }, {})
+
+        all.forEach(announcement => {
+          if (!visibleObject[announcement.id]) {
+            announcement.inactive = true
+          } else {
+            announcement.read = visibleObject[announcement.id].read
+          }
+        })
+
+        return all
+      }
+
+      return getAnnouncements()
         .then(announcements => {
           store.commit('setAnnouncements', announcements)
         })
-- 
cgit v1.2.3-70-g09d2


From b4a7e58bec86205e23adda2b0625d237acd5aa91 Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Thu, 17 Mar 2022 17:51:39 -0400
Subject: Show badges for unread announcements

---
 src/components/mobile_nav/mobile_nav.js       | 2 +-
 src/components/mobile_nav/mobile_nav.vue      | 2 +-
 src/components/nav_panel/nav_panel.js         | 2 +-
 src/components/navigation/navigation.js       | 3 ++-
 src/components/notifications/notifications.js | 4 ++--
 src/components/side_drawer/side_drawer.js     | 2 +-
 src/components/side_drawer/side_drawer.vue    | 6 ++++++
 src/modules/announcements.js                  | 9 +++++++++
 8 files changed, 23 insertions(+), 7 deletions(-)

(limited to 'src/modules/announcements.js')

diff --git a/src/components/mobile_nav/mobile_nav.js b/src/components/mobile_nav/mobile_nav.js
index fb8ffa30..cdbbb812 100644
--- a/src/components/mobile_nav/mobile_nav.js
+++ b/src/components/mobile_nav/mobile_nav.js
@@ -54,7 +54,7 @@ const MobileNav = {
     isChat () {
       return this.$route.name === 'chat'
     },
-    ...mapGetters(['unreadChatCount']),
+    ...mapGetters(['unreadChatCount', 'unreadAnnouncementCount']),
     chatsPinned () {
       return new Set(this.$store.state.serverSideStorage.prefsStorage.collections.pinnedNavItems).has('chats')
     }
diff --git a/src/components/mobile_nav/mobile_nav.vue b/src/components/mobile_nav/mobile_nav.vue
index d642008b..0f1fe621 100644
--- a/src/components/mobile_nav/mobile_nav.vue
+++ b/src/components/mobile_nav/mobile_nav.vue
@@ -19,7 +19,7 @@
             icon="bars"
           />
           <div
-            v-if="unreadChatCount && !chatsPinned"
+            v-if="(unreadChatCount && !chatsPinned) || unreadAnnouncementCount"
             class="alert-dot"
           />
         </button>
diff --git a/src/components/nav_panel/nav_panel.js b/src/components/nav_panel/nav_panel.js
index 66c8a4cd..438615da 100644
--- a/src/components/nav_panel/nav_panel.js
+++ b/src/components/nav_panel/nav_panel.js
@@ -117,7 +117,7 @@ const NavPanel = {
         }
       )
     },
-    ...mapGetters(['unreadChatCount'])
+    ...mapGetters(['unreadChatCount', 'unreadAnnouncementCount'])
   }
 }
 
diff --git a/src/components/navigation/navigation.js b/src/components/navigation/navigation.js
index 4541e60b..40100f97 100644
--- a/src/components/navigation/navigation.js
+++ b/src/components/navigation/navigation.js
@@ -75,6 +75,7 @@ export const ROOT_ITEMS = {
   announcements: {
     route: 'announcements',
     icon: 'bullhorn',
-    label: 'nav.announcements'
+    label: 'nav.announcements',
+    badgeGetter: 'unreadAnnouncementCount'
   }
 }
diff --git a/src/components/notifications/notifications.js b/src/components/notifications/notifications.js
index c3acd9e0..dde9c93e 100644
--- a/src/components/notifications/notifications.js
+++ b/src/components/notifications/notifications.js
@@ -69,7 +69,7 @@ const Notifications = {
       return this.unseenNotifications.length
     },
     unseenCountTitle () {
-      return this.unseenCount + (this.unreadChatCount)
+      return this.unseenCount + (this.unreadChatCount) + this.unreadAnnouncementCount
     },
     loading () {
       return this.$store.state.statuses.notifications.loading
@@ -94,7 +94,7 @@ const Notifications = {
       return this.filteredNotifications.slice(0, this.unseenCount + this.seenToDisplayCount)
     },
     noSticky () { return this.$store.getters.mergedConfig.disableStickyHeaders },
-    ...mapGetters(['unreadChatCount'])
+    ...mapGetters(['unreadChatCount', 'unreadAnnouncementCount'])
   },
   mounted () {
     this.scrollerRef = this.$refs.root.closest('.column.-scrollable')
diff --git a/src/components/side_drawer/side_drawer.js b/src/components/side_drawer/side_drawer.js
index bb22446b..680216dd 100644
--- a/src/components/side_drawer/side_drawer.js
+++ b/src/components/side_drawer/side_drawer.js
@@ -97,7 +97,7 @@ const SideDrawer = {
     ...mapState({
       pleromaChatMessagesAvailable: state => state.instance.pleromaChatMessagesAvailable
     }),
-    ...mapGetters(['unreadChatCount'])
+    ...mapGetters(['unreadChatCount', 'unreadAnnouncementCount'])
   },
   methods: {
     toggleDrawer () {
diff --git a/src/components/side_drawer/side_drawer.vue b/src/components/side_drawer/side_drawer.vue
index dccb8ab7..4101cb03 100644
--- a/src/components/side_drawer/side_drawer.vue
+++ b/src/components/side_drawer/side_drawer.vue
@@ -202,6 +202,12 @@
               class="fa-scale-110 fa-old-padding"
               icon="bullhorn"
             /> {{ $t("nav.announcements") }}
+            <span
+              v-if="unreadAnnouncementCount"
+              class="badge badge-notification"
+            >
+              {{ unreadAnnouncementCount }}
+            </span>
           </router-link>
         </li>
         <li
diff --git a/src/modules/announcements.js b/src/modules/announcements.js
index 8470fb2a..f04ba50e 100644
--- a/src/modules/announcements.js
+++ b/src/modules/announcements.js
@@ -25,9 +25,18 @@ export const mutations = {
   }
 }
 
+export const getters = {
+  unreadAnnouncementCount (state) {
+    return state.announcements.reduce((acc, cur) => {
+      return (!cur.inactive && !cur.read) ? acc + 1 : acc
+    }, 0)
+  }
+}
+
 const announcements = {
   state: defaultState,
   mutations,
+  getters,
   actions: {
     fetchAnnouncements (store) {
       const currentUser = store.rootState.users.currentUser
-- 
cgit v1.2.3-70-g09d2


From d6dd394cd9446a972bef4071d304b1edb63ec057 Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Thu, 17 Mar 2022 18:04:35 -0400
Subject: Do not count unread announcements for guests

---
 src/modules/announcements.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

(limited to 'src/modules/announcements.js')

diff --git a/src/modules/announcements.js b/src/modules/announcements.js
index f04ba50e..876bcdaf 100644
--- a/src/modules/announcements.js
+++ b/src/modules/announcements.js
@@ -26,7 +26,11 @@ export const mutations = {
 }
 
 export const getters = {
-  unreadAnnouncementCount (state) {
+  unreadAnnouncementCount (state, _getters, rootState) {
+    if (!rootState.users.currentUser) {
+      return 0
+    }
+
     return state.announcements.reduce((acc, cur) => {
       return (!cur.inactive && !cur.read) ? acc + 1 : acc
     }, 0)
-- 
cgit v1.2.3-70-g09d2


From eac0008002116efa9bf435c428a91cc2c0a2dd42 Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Sun, 20 Mar 2022 13:26:57 -0400
Subject: Readablify unreadAnnouncementCount

---
 src/modules/announcements.js | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

(limited to 'src/modules/announcements.js')

diff --git a/src/modules/announcements.js b/src/modules/announcements.js
index 876bcdaf..2606b786 100644
--- a/src/modules/announcements.js
+++ b/src/modules/announcements.js
@@ -31,9 +31,8 @@ export const getters = {
       return 0
     }
 
-    return state.announcements.reduce((acc, cur) => {
-      return (!cur.inactive && !cur.read) ? acc + 1 : acc
-    }, 0)
+    const unread = state.announcements.filter(announcement => !(announcement.inactive || announcement.read))
+    return unread.length
   }
 }
 
-- 
cgit v1.2.3-70-g09d2


From dd5cc08a3ed1fe1b4f2629bbf9aeea3f8cae7a6d Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Fri, 29 Apr 2022 20:56:54 -0400
Subject: Port away from Vue2 Vue.set()

---
 src/modules/announcements.js | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

(limited to 'src/modules/announcements.js')

diff --git a/src/modules/announcements.js b/src/modules/announcements.js
index 2606b786..ab16626c 100644
--- a/src/modules/announcements.js
+++ b/src/modules/announcements.js
@@ -1,5 +1,3 @@
-import { set } from 'vue'
-
 const FETCH_ANNOUNCEMENT_INTERVAL_MS = 1000 * 60 * 5
 
 export const defaultState = {
@@ -9,7 +7,7 @@ export const defaultState = {
 
 export const mutations = {
   setAnnouncements (state, announcements) {
-    set(state, 'announcements', announcements)
+    state.announcements = announcements
   },
   setAnnouncementRead (state, { id, read }) {
     const index = state.announcements.findIndex(a => a.id === id)
@@ -18,10 +16,10 @@ export const mutations = {
       return
     }
 
-    set(state.announcements[index], 'read', read)
+    state.announcements[index].read = read
   },
   setFetchAnnouncementsTimer (state, timer) {
-    set(state, 'fetchAnnouncementsTimer', announcements)
+    state.fetchAnnouncementsTimer = timer
   }
 }
 
-- 
cgit v1.2.3-70-g09d2


From f3d97cf917172735d9058ad4f308ea401832e7d6 Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Thu, 14 Jul 2022 18:49:36 -0400
Subject: Improve readability in fetchAnnouncements()

---
 src/modules/announcements.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

(limited to 'src/modules/announcements.js')

diff --git a/src/modules/announcements.js b/src/modules/announcements.js
index ab16626c..0f8b6d09 100644
--- a/src/modules/announcements.js
+++ b/src/modules/announcements.js
@@ -54,12 +54,14 @@ const announcements = {
           a[c.id] = c
           return a
         }, {})
+        const getWithinVisible = announcement => visibleObject[announcement.id]
 
         all.forEach(announcement => {
-          if (!visibleObject[announcement.id]) {
+          const visibleAnnouncement = getWithinVisible(announcement)
+          if (!visibleAnnouncement) {
             announcement.inactive = true
           } else {
-            announcement.read = visibleObject[announcement.id].read
+            announcement.read = visibleAnnouncement.read
           }
         })
 
-- 
cgit v1.2.3-70-g09d2


From d74d5a8ce29311bc4b5c79527558f84c59965932 Mon Sep 17 00:00:00 2001
From: tusooa <tusooa@kazv.moe>
Date: Thu, 24 Nov 2022 18:39:42 -0500
Subject: Detect backend support for announcements

---
 src/components/nav_panel/nav_panel.js      |  2 ++
 src/components/navigation/filter.js        |  3 ++-
 src/components/navigation/navigation.js    |  3 ++-
 src/components/side_drawer/side_drawer.js  |  3 ++-
 src/components/side_drawer/side_drawer.vue |  1 +
 src/modules/announcements.js               | 17 +++++++++++++++++
 6 files changed, 26 insertions(+), 3 deletions(-)

(limited to 'src/modules/announcements.js')

diff --git a/src/components/nav_panel/nav_panel.js b/src/components/nav_panel/nav_panel.js
index 438615da..28fafed8 100644
--- a/src/components/nav_panel/nav_panel.js
+++ b/src/components/nav_panel/nav_panel.js
@@ -88,6 +88,7 @@ const NavPanel = {
       privateMode: state => state.instance.private,
       federating: state => state.instance.federating,
       pleromaChatMessagesAvailable: state => state.instance.pleromaChatMessagesAvailable,
+      supportsAnnouncements: state => state.announcements.supportsAnnouncements,
       pinnedItems: state => new Set(state.serverSideStorage.prefsStorage.collections.pinnedNavItems),
       collapsed: state => state.serverSideStorage.prefsStorage.simple.collapseNav
     }),
@@ -98,6 +99,7 @@ const NavPanel = {
           .map(([k, v]) => ({ ...v, name: k })),
         {
           hasChats: this.pleromaChatMessagesAvailable,
+          hasAnnouncements: this.supportsAnnouncements,
           isFederating: this.federating,
           isPrivate: this.privateMode,
           currentUser: this.currentUser
diff --git a/src/components/navigation/filter.js b/src/components/navigation/filter.js
index 31b55486..5474a8ac 100644
--- a/src/components/navigation/filter.js
+++ b/src/components/navigation/filter.js
@@ -1,4 +1,4 @@
-export const filterNavigation = (list = [], { hasChats, isFederating, isPrivate, currentUser }) => {
+export const filterNavigation = (list = [], { hasChats, hasAnnouncements, isFederating, isPrivate, currentUser }) => {
   return list.filter(({ criteria, anon, anonRoute }) => {
     const set = new Set(criteria || [])
     if (!isFederating && set.has('federating')) return false
@@ -6,6 +6,7 @@ export const filterNavigation = (list = [], { hasChats, isFederating, isPrivate,
     if (!currentUser && !(anon || anonRoute)) return false
     if ((!currentUser || !currentUser.locked) && set.has('lockedUser')) return false
     if (!hasChats && set.has('chats')) return false
+    if (!hasAnnouncements && set.has('announcements')) return false
     return true
   })
 }
diff --git a/src/components/navigation/navigation.js b/src/components/navigation/navigation.js
index 40100f97..7f096316 100644
--- a/src/components/navigation/navigation.js
+++ b/src/components/navigation/navigation.js
@@ -76,6 +76,7 @@ export const ROOT_ITEMS = {
     route: 'announcements',
     icon: 'bullhorn',
     label: 'nav.announcements',
-    badgeGetter: 'unreadAnnouncementCount'
+    badgeGetter: 'unreadAnnouncementCount',
+    criteria: ['announcements']
   }
 }
diff --git a/src/components/side_drawer/side_drawer.js b/src/components/side_drawer/side_drawer.js
index 680216dd..27019577 100644
--- a/src/components/side_drawer/side_drawer.js
+++ b/src/components/side_drawer/side_drawer.js
@@ -95,7 +95,8 @@ const SideDrawer = {
       }
     },
     ...mapState({
-      pleromaChatMessagesAvailable: state => state.instance.pleromaChatMessagesAvailable
+      pleromaChatMessagesAvailable: state => state.instance.pleromaChatMessagesAvailable,
+      supportsAnnouncements: state => state.announcements.supportsAnnouncements
     }),
     ...mapGetters(['unreadChatCount', 'unreadAnnouncementCount'])
   },
diff --git a/src/components/side_drawer/side_drawer.vue b/src/components/side_drawer/side_drawer.vue
index 4101cb03..887596f8 100644
--- a/src/components/side_drawer/side_drawer.vue
+++ b/src/components/side_drawer/side_drawer.vue
@@ -192,6 +192,7 @@
           </a>
         </li>
         <li
+          v-if="currentUser && supportsAnnouncements"
           @click="toggleDrawer"
         >
           <router-link
diff --git a/src/modules/announcements.js b/src/modules/announcements.js
index 0f8b6d09..e4d2d2b0 100644
--- a/src/modules/announcements.js
+++ b/src/modules/announcements.js
@@ -2,6 +2,7 @@ const FETCH_ANNOUNCEMENT_INTERVAL_MS = 1000 * 60 * 5
 
 export const defaultState = {
   announcements: [],
+  supportsAnnouncements: true,
   fetchAnnouncementsTimer: undefined
 }
 
@@ -20,6 +21,9 @@ export const mutations = {
   },
   setFetchAnnouncementsTimer (state, timer) {
     state.fetchAnnouncementsTimer = timer
+  },
+  setSupportsAnnouncements (state, supportsAnnouncements) {
+    state.supportsAnnouncements = supportsAnnouncements
   }
 }
 
@@ -40,6 +44,10 @@ const announcements = {
   getters,
   actions: {
     fetchAnnouncements (store) {
+      if (!store.state.supportsAnnouncements) {
+        return Promise.resolve()
+      }
+
       const currentUser = store.rootState.users.currentUser
       const isAdmin = currentUser && currentUser.role === 'admin'
 
@@ -72,6 +80,15 @@ const announcements = {
         .then(announcements => {
           store.commit('setAnnouncements', announcements)
         })
+        .catch(error => {
+          // If and only if backend does not support announcements, it would return 404.
+          // In this case, silently ignores it.
+          if (error && error.statusCode === 404) {
+            store.commit('setSupportsAnnouncements', false)
+          } else {
+            throw error
+          }
+        })
     },
     markAnnouncementAsRead (store, id) {
       return store.rootState.api.backendInteractor.dismissAnnouncement({ id })
-- 
cgit v1.2.3-70-g09d2