show notification action on in-app-notification dropdown

packages/app/src/components/InAppNotification/InAppNotificationDropdown.tsx

@@ -17,17 +17,7 @@ const InAppNotificationDropdown: FC = (props) => {
 
   const [count, setCount] = useState(0);
   const [isLoaded, setIsLoaded] = useState(false);
-  const [notifications, setNotifications] = useState<IInAppNotification[]>([{
-    // This is dummy notification data. Delete it after fetching notification list by #78756
-    _id: '1',
-    user: 'kaori1',
-    targetModel: 'Page',
-    target: 'hogePage',
-    action: 'COMMENT',
-    status: 'hoge',
-    actionUsers: ['taro', 'yamada'],
-    createdAt: 'hoge',
-  }]);
+  const [notifications, setNotifications] = useState([]);
   const [isOpen, setIsOpen] = useState(false);
 
   useEffect(() => {
@@ -46,7 +36,7 @@ const InAppNotificationDropdown: FC = (props) => {
 
       if (props.me === data.user) {
         // TODO: Fetch notification status by #78563
-        // fetchNotificationList();
+        fetchNotificationList(props);
 
         // TODO: Fetch notification list by #78557
         // fetchNotificationStatus();
@@ -88,10 +78,10 @@ const InAppNotificationDropdown: FC = (props) => {
   const fetchNotificationList = async(props) => {
     const limit = 6;
     try {
-      const inAppNotificationList = await props.appContainer.apiv3Get('/in-app-notification/list', { limit });
+      const paginationResult = await props.appContainer.apiv3Get('/in-app-notification/list', { limit });
 
-      // setNotifications(notifications);
-      // setIsLoaded(true);
+      setNotifications(paginationResult.data.docs);
+      setIsLoaded(true);
     }
     catch (err) {
       // TODO: error handling
@@ -147,7 +137,10 @@ const InAppNotificationDropdown: FC = (props) => {
     }
     const notificationList = notifications.map((notification: IInAppNotification) => {
       return (
-        <InAppNotification key={notification._id} notification={notification} onClick={notificationClickHandler} />
+        // temporaly notification list. need to delete by #
+        <div key={notification._id}>action: {notification.action} </div>
+        // use this component to show notification list
+        // <InAppNotification key={notification._id} notification={notification} onClick={notificationClickHandler} />
       );
     });
     return <>{notificationList}</>;

packages/app/src/server/routes/apiv3/in-app-notification.ts

@@ -26,8 +26,8 @@ module.exports = (crowi) => {
 
     const requestLimit = limit + 1;
 
-    const latestInAppNotificationList = await inAppNotificationService.getLatestNotificationsByUser(user._id, requestLimit, offset);
-    return latestInAppNotificationList;
+    const paginationResult = await inAppNotificationService.getLatestNotificationsByUser(user._id, requestLimit, offset);
+    return res.apiv3(paginationResult);
 
   });
 

packages/app/src/server/service/in-app-notification.ts

@@ -73,7 +73,7 @@ export default class InAppNotificationService {
   getLatestNotificationsByUser = async(userId, limitNum, offset) => {
 
     try {
-      const pagenatedInAppNotifications = await InAppNotification.paginate(
+      const paginationResult = await InAppNotification.paginate(
         { user: userId },
         {
           sort: { createdAt: -1 },
@@ -86,41 +86,8 @@ export default class InAppNotificationService {
           ],
         },
       );
-    }
-    catch (err) {
-      logger.error('Error', err);
-      throw new Error(err);
-    }
-
-    try {
-      /**
-       * TODO: return results including notifications,hasPrev and hasNext by #78991
-       * refer to https://github.com/crowi/crowi/blob/eecf2bc821098d2516b58104fe88fae81497d3ea/lib/controllers/notification.ts
-       */
-      // Notification.findLatestNotificationsByUser(user._id, requestLimit, offset)
-      // .then(function (notifications) {
-      //   let hasPrev = false
-      //   if (offset > 0) {
-      //     hasPrev = true
-      //   }
-
-      //   let hasNext = false
-      //   if (notifications.length > limit) {
-      //     hasNext = true
-      //   }
-
-      //   const result = {
-      //     notifications: notifications.slice(0, limit),
-      //     hasPrev: hasPrev,
-      //     hasNext: hasNext,
-      //   }
-
-      //   return res.json(ApiResponse.success(result))
-      // })
-      // .catch(function (err) {
-      //   return res.json(ApiResponse.error(err))
-      // })
 
+      return paginationResult;
     }
     catch (err) {
       logger.error('Error', err);