feat: support paginated notifications

This reverts commit 7dd1f1b3d0.

backend/src/main/java/com/openisle/controller/NotificationController.java

@@ -24,16 +24,18 @@ public class NotificationController {
 
     @GetMapping
     public List<NotificationDto> list(@RequestParam(value = "page", defaultValue = "0") int page,
+                                      @RequestParam(value = "size", defaultValue = "30") int size,
                                       Authentication auth) {
-        return notificationService.listNotifications(auth.getName(), null, page).stream()
+        return notificationService.listNotifications(auth.getName(), page, size).stream()
                 .map(notificationMapper::toDto)
                 .collect(Collectors.toList());
     }
 
     @GetMapping("/unread")
     public List<NotificationDto> listUnread(@RequestParam(value = "page", defaultValue = "0") int page,
+                                            @RequestParam(value = "size", defaultValue = "30") int size,
                                             Authentication auth) {
-        return notificationService.listNotifications(auth.getName(), false, page).stream()
+        return notificationService.listUnreadNotifications(auth.getName(), page, size).stream()
                 .map(notificationMapper::toDto)
                 .collect(Collectors.toList());
     }

backend/src/main/java/com/openisle/repository/NotificationRepository.java

@@ -15,9 +15,8 @@ import java.util.List;
 public interface NotificationRepository extends JpaRepository<Notification, Long> {
     List<Notification> findByUserOrderByCreatedAtDesc(User user);
     List<Notification> findByUserAndReadOrderByCreatedAtDesc(User user, boolean read);
-
-    Page<Notification> findByUserOrderByCreatedAtDesc(User user, Pageable pageable);
-    Page<Notification> findByUserAndReadOrderByCreatedAtDesc(User user, boolean read, Pageable pageable);
+    Page<Notification> findByUser(User user, Pageable pageable);
+    Page<Notification> findByUserAndRead(User user, boolean read, Pageable pageable);
     long countByUserAndRead(User user, boolean read);
     List<Notification> findByPost(Post post);
     List<Notification> findByComment(Comment comment);

backend/src/main/java/com/openisle/service/NotificationService.java

@@ -25,7 +25,9 @@ import java.util.ArrayList;
 import java.util.concurrent.Executor;
 import java.util.stream.Collectors;
 import org.springframework.data.domain.Page;
+import org.springframework.data.domain.PageRequest;
 import org.springframework.data.domain.Pageable;
+import org.springframework.data.domain.Sort;
 
 /** Service for creating and retrieving notifications. */
 @Service
@@ -182,22 +184,26 @@ public class NotificationService {
         userRepository.save(user);
     }
 
-    public List<Notification> listNotifications(String username, Boolean read) {
-        return listNotifications(username, read, 0);
+    public List<Notification> listNotifications(String username, int page, int size) {
+        return listNotifications(username, null, page, size);
     }
 
-    public List<Notification> listNotifications(String username, Boolean read, int page) {
+    public List<Notification> listUnreadNotifications(String username, int page, int size) {
+        return listNotifications(username, false, page, size);
+    }
+
+    private List<Notification> listNotifications(String username, Boolean read, int page, int size) {
         User user = userRepository.findByUsername(username)
                 .orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
         Set<NotificationType> disabled = user.getDisabledNotificationTypes();
-        Page<Notification> p;
-        Pageable pageable = org.springframework.data.domain.PageRequest.of(page, 50);
+        Pageable pageable = PageRequest.of(page, size, Sort.by(Sort.Direction.DESC, "createdAt"));
+        Page<Notification> list;
         if (read == null) {
-            p = notificationRepository.findByUserOrderByCreatedAtDesc(user, pageable);
+            list = notificationRepository.findByUser(user, pageable);
         } else {
-            p = notificationRepository.findByUserAndReadOrderByCreatedAtDesc(user, read, pageable);
+            list = notificationRepository.findByUserAndRead(user, read, pageable);
         }
-        return p.getContent().stream().filter(n -> !disabled.contains(n.getType())).collect(Collectors.toList());
+        return list.stream().filter(n -> !disabled.contains(n.getType())).collect(Collectors.toList());
     }
 
     public void markRead(String username, List<Long> ids) {

backend/src/test/java/com/openisle/controller/NotificationControllerTest.java

@@ -45,7 +45,7 @@ class NotificationControllerTest {
         p.setId(2L);
         n.setPost(p);
         n.setCreatedAt(LocalDateTime.now());
-        when(notificationService.listNotifications("alice", null, 0))
+        when(notificationService.listNotifications("alice", 0, 30))
                 .thenReturn(List.of(n));
 
         NotificationDto dto = new NotificationDto();
@@ -65,18 +65,18 @@ class NotificationControllerTest {
     @Test
     void listUnreadNotifications() throws Exception {
         Notification n = new Notification();
-        n.setId(3L);
-        n.setType(NotificationType.POST_VIEWED);
-        when(notificationService.listNotifications("alice", false, 0)).thenReturn(List.of(n));
+        n.setId(1L);
+        when(notificationService.listUnreadNotifications("alice", 0, 30))
+                .thenReturn(List.of(n));
 
         NotificationDto dto = new NotificationDto();
-        dto.setId(3L);
+        dto.setId(1L);
         when(notificationMapper.toDto(n)).thenReturn(dto);
 
         mockMvc.perform(get("/api/notifications/unread")
-                        .principal(new UsernamePasswordAuthenticationToken("alice", "p")))
+                        .principal(new UsernamePasswordAuthenticationToken("alice","p")))
                 .andExpect(status().isOk())
-                .andExpect(jsonPath("$[0].id").value(3));
+                .andExpect(jsonPath("$[0].id").value(1));
     }
 
     @Test

backend/src/test/java/com/openisle/service/NotificationServiceTest.java

@@ -11,6 +11,7 @@ import org.mockito.Mockito;
 
 import java.util.List;
 import java.util.Optional;
+import org.springframework.data.domain.Pageable;
 
 import static org.junit.jupiter.api.Assertions.*;
 import static org.mockito.Mockito.*;
@@ -65,15 +66,12 @@ class NotificationServiceTest {
         when(uRepo.findByUsername("bob")).thenReturn(Optional.of(user));
 
         Notification n = new Notification();
-        org.springframework.data.domain.Page<Notification> page =
-                new org.springframework.data.domain.PageImpl<>(List.of(n));
-        when(nRepo.findByUserOrderByCreatedAtDesc(eq(user), any(org.springframework.data.domain.Pageable.class)))
-                .thenReturn(page);
+        when(nRepo.findByUser(eq(user), any(Pageable.class))).thenReturn(new org.springframework.data.domain.PageImpl<>(List.of(n)));
 
-        List<Notification> list = service.listNotifications("bob", null);
+        List<Notification> list = service.listNotifications("bob", 0, 30);
 
         assertEquals(1, list.size());
-        verify(nRepo).findByUserOrderByCreatedAtDesc(eq(user), any(org.springframework.data.domain.Pageable.class));
+        verify(nRepo).findByUser(eq(user), any(Pageable.class));
     }
 
     @Test

frontend_nuxt/pages/message.vue

@@ -505,18 +505,18 @@
             </div>
           </template>
         </BaseTimeline>
-        <InfiniteLoadMore :key="ioKey" :on-load="fetchNextPage" :pause="isLoadingMessage" />
+        <InfiniteLoadMore :key="selectedTab" :on-load="fetchMore" :pause="isLoadingMessage" />
       </div>
     </template>
   </div>
 </template>
 
 <script setup>
-import { onActivated, ref, watch } from 'vue'
+import { ref, watch, onActivated } from 'vue'
 import BasePlaceholder from '~/components/BasePlaceholder.vue'
 import BaseTimeline from '~/components/BaseTimeline.vue'
-import NotificationContainer from '~/components/NotificationContainer.vue'
 import InfiniteLoadMore from '~/components/InfiniteLoadMore.vue'
+import NotificationContainer from '~/components/NotificationContainer.vue'
 import { toast } from '~/main'
 import { authState, getToken } from '~/utils/auth'
 import { stripMarkdownLength } from '~/utils/markdown'
@@ -539,7 +539,16 @@ const selectedTab = ref(
   ['all', 'unread', 'control'].includes(route.query.tab) ? route.query.tab : 'unread',
 )
 const notificationPrefs = ref([])
-const ioKey = ref(0)
+
+const fetchMore = () => fetchNotifications()
+
+const loadInitial = async () => {
+  await fetchNotifications({ reset: true, read: selectedTab.value === 'unread' ? false : null })
+}
+
+watch(selectedTab, async (t) => {
+  await fetchNotifications({ reset: true, read: t === 'unread' ? false : null })
+})
 
 const fetchPrefs = async () => {
   notificationPrefs.value = await fetchNotificationPreferences()
@@ -549,7 +558,7 @@ const togglePref = async (pref) => {
   const ok = await updateNotificationPreference(pref.type, !pref.enabled)
   if (ok) {
     pref.enabled = !pref.enabled
-    await fetchNotifications(selectedTab.value, true)
+    await fetchNotifications({ reset: true, read: selectedTab.value === 'unread' ? false : null })
     await fetchUnreadCount()
   } else {
     toast.error('操作失败')
@@ -630,20 +639,9 @@ const formatType = (t) => {
 }
 
 onActivated(() => {
-  fetchNotifications(selectedTab.value, true)
+  loadInitial()
   fetchPrefs()
 })
-
-watch(selectedTab, (tab) => {
-  if (tab !== 'control') {
-    fetchNotifications(tab, true)
-  } else {
-    fetchPrefs()
-  }
-  ioKey.value++
-})
-
-const fetchNextPage = () => fetchNotifications(selectedTab.value)
 </script>
 
 <style scoped>
@@ -657,8 +655,6 @@ const fetchNextPage = () => fetchNotifications(selectedTab.value)
 .message-page {
   background-color: var(--background-color);
   overflow-x: hidden;
-  height: calc(100vh - var(--header-height));
-  overflow-y: auto;
 }
 
 .message-page-header {

frontend_nuxt/utils/notification.js

@@ -119,29 +119,27 @@ function createFetchNotifications() {
   const notifications = ref([])
   const isLoadingMessage = ref(false)
   const page = ref(0)
-  const finished = ref(false)
-  const currentTab = ref('all')
-
-  const fetchNotifications = async (tab = 'all', reset = false) => {
+  const pageSize = 30
+  const readFilter = ref(null)
+  const fetchNotifications = async ({ reset = false, read = null } = {}) => {
     const config = useRuntimeConfig()
     const API_BASE_URL = config.public.apiBaseUrl
+    if (isLoadingMessage.value) return false
     try {
       const token = getToken()
       if (!token) {
         toast.error('请先登录')
         return true
       }
-      if (reset || tab !== currentTab.value) {
+      if (reset) {
         notifications.value = []
         page.value = 0
-        finished.value = false
-        currentTab.value = tab
+        readFilter.value = read
       }
-      if (finished.value) return true
       isLoadingMessage.value = true
       let url = `${API_BASE_URL}/api/notifications`
-      if (currentTab.value === 'unread') url += '/unread'
-      url += `?page=${page.value}`
+      if (readFilter.value === false) url += '/unread'
+      url += `?page=${page.value}&size=${pageSize}`
       const res = await fetch(url, {
         headers: {
           Authorization: `Bearer ${token}`,
@@ -153,6 +151,7 @@ function createFetchNotifications() {
         return true
       }
       const data = await res.json()
+
       for (const n of data) {
         if (n.type === 'COMMENT_REPLY') {
           notifications.value.push({
@@ -193,7 +192,7 @@ function createFetchNotifications() {
             iconClick: () => {
               if (n.post) {
                 markRead(n.id)
-                navigateTo(`/posts/${n.post.id}`)
+                router.push(`/posts/${n.post.id}`)
               }
             },
           })
@@ -204,7 +203,7 @@ function createFetchNotifications() {
             iconClick: () => {
               if (n.post) {
                 markRead(n.id)
-                navigateTo(`/posts/${n.post.id}`)
+                router.push(`/posts/${n.post.id}`)
               }
             },
           })
@@ -295,12 +294,8 @@ function createFetchNotifications() {
           })
         }
       }
-      const done = data.length < 50
-      if (!done) {
-        page.value++
-      } else {
-        finished.value = true
-      }
+      const done = data.length < pageSize
+      if (!done) page.value++
       return done
     } catch (e) {
       console.error(e)