update for type

packages/app/src/client/interfaces/global-notification.ts

@@ -25,9 +25,3 @@ export type IGlobalNotification = {
   slackChannelToSend: string,
   triggerEvents: TriggerEventType[],
 };
-
-export type IGlobalNotificationType = {
-  __t: NotifyType
-  _id: string
-  provider: any
-}

packages/app/src/client/interfaces/notification.ts

@@ -0,0 +1,8 @@
+import type { NotifyType } from './global-notification';
+
+export type INotificationType = {
+  // Global notification -> has '__t: slack|mail'
+  __t: NotifyType | undefined
+  _id: string
+  provider: any
+}

packages/app/src/components/Admin/Notification/GlobalNotificationList.jsx

@@ -11,8 +11,8 @@ import loggerFactory from '~/utils/logger';
 
 import { withUnstatedContainers } from '../../UnstatedUtils';
 
-import { GlobalNotificationTypeIcon } from './GlobalNotificationTypeIcon';
 import NotificationDeleteModal from './NotificationDeleteModal';
+import { NotificationTypeIcon } from './NotificationTypeIcon';
 
 
 const logger = loggerFactory('growi:GolobalNotificationList');
@@ -129,7 +129,7 @@ class GlobalNotificationList extends React.Component {
                 </ul>
               </td>
               <td>
-                <GlobalNotificationTypeIcon notification={notification} />
+                <NotificationTypeIcon notification={notification} />
                 { notification.__t === 'mail' && notification.toEmail }
                 { notification.__t === 'slack' && notification.slackChannels }
               </td>

packages/app/src/components/Admin/Notification/GlobalNotificationTypeIcon.tsx → packages/app/src/components/Admin/Notification/NotificationTypeIcon.tsx

@@ -2,28 +2,30 @@ import React from 'react';
 
 import { UncontrolledTooltip } from 'reactstrap';
 
-import type { IGlobalNotificationType } from '~/client/interfaces/global-notification';
+import type { INotificationType } from '~/client/interfaces/notification';
 
 
-type GlobalNotificationTypeIconProps = {
+type NotificationTypeIconProps = {
   // supports 2 types:
   //   User trigger notification -> has 'provider: slack'
   //   Global notification -> has '__t: slack|mail'
-  notification: IGlobalNotificationType
+  notification: INotificationType
 }
 
-export const GlobalNotificationTypeIcon = (props: GlobalNotificationTypeIconProps): JSX.Element => {
+export const NotificationTypeIcon = (props: NotificationTypeIconProps): JSX.Element => {
   const { __t, _id, provider } = props.notification;
 
+  const type = __t != null && __t === 'mail' ? 'mail' : 'slack';
+
   // User trigger notification
   if (provider != null) {
     // only slack type
   }
 
   // Global notification
-  const elemId = `notification-${__t}-${_id}`;
-  const className = __t === 'mail' ? 'icon-fw fa fa-envelope-o' : 'icon-fw fa fa-hashtag';
-  const toolChip = __t === 'mail' ? 'Mail' : 'Slack';
+  const elemId = `notification-${type}-${_id}`;
+  const className = type === 'mail' ? 'icon-fw fa fa-envelope-o' : 'icon-fw fa fa-hashtag';
+  const toolChip = type === 'mail' ? 'Mail' : 'Slack';
 
   return <><i id={elemId} className={className}></i><UncontrolledTooltip target={elemId}>{toolChip}</UncontrolledTooltip></>;
 };

packages/app/src/components/Admin/Notification/UserNotificationRow.jsx

@@ -7,7 +7,7 @@ import AdminNotificationContainer from '~/client/services/AdminNotificationConta
 
 import { withUnstatedContainers } from '../../UnstatedUtils';
 
-import { GlobalNotificationTypeIcon } from './GlobalNotificationTypeIcon';
+import { NotificationTypeIcon } from './NotificationTypeIcon';
 
 class UserNotificationRow extends React.PureComponent {
 
@@ -22,7 +22,7 @@ class UserNotificationRow extends React.PureComponent {
             {notification.pathPattern}
           </td>
           <td className="px-4">
-            <GlobalNotificationTypeIcon notification={notification} />{notification.channel}
+            <NotificationTypeIcon notification={notification} />{notification.channel}
           </td>
           <td>
             <button type="submit" className="btn btn-outline-danger" onClick={() => { this.props.onClickDeleteBtn(notification._id) }}>{t('Delete')}</button>