Merge pull request #4532 from weseek/imprv/79893-add-page-update-notification

Imprv/79893 add page update notification

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

@@ -1,7 +1,8 @@
 import React from 'react';
 
 import { UserPicture } from '@growi/ui';
-import { PageCommentNotification } from './PageCommentNotification';
+import { PageCommentInAppNotification } from './PageCommentInAppNotification';
+import { PageUpdateInAppNotification } from './PageUpdateInAppNotification';
 import { InAppNotification as IInAppNotification } from '../../interfaces/in-app-notification';
 import FormattedDistanceDate from '../FormattedDistanceDate';
 
@@ -55,7 +56,9 @@ export const InAppNotification = (props: Props): JSX.Element => {
   const renderInAppNotificationContent = (): JSX.Element => {
     switch (componentName) {
       case 'Page:COMMENT':
-        return <PageCommentNotification {...propsNew} onClick={props.onClick(props.notification)} />;
+        return <PageCommentInAppNotification {...propsNew} onClick={props.onClick(props.notification)} />;
+      case 'Page:UPDATE':
+        return <PageUpdateInAppNotification {...propsNew} onClick={props.onClick(props.notification)} />;
       default:
         return <></>;
     }

packages/app/src/components/InAppNotification/PageCommentNotification.tsx → packages/app/src/components/InAppNotification/PageCommentInAppNotification.tsx

@@ -6,7 +6,7 @@ interface Props {
   notification: IInAppNotification
   onClick: () => void
 }
-export const PageCommentNotification = (props: Props) => {
+export const PageCommentInAppNotification = (props: Props): JSX.Element => {
 
   return (
     <>

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

@@ -0,0 +1,17 @@
+import React from 'react';
+import { InAppNotification as IInAppNotification } from '../../interfaces/in-app-notification';
+
+interface Props {
+  actionUsers: string
+  notification: IInAppNotification
+  onClick: () => void
+}
+export const PageUpdateInAppNotification = (props: Props): JSX.Element => {
+
+  return (
+    <>
+      <b>{props.actionUsers}</b> updated {props.notification.target.path}
+    </>
+  );
+
+};