Fix react warning on notifications column (#1832)

diff --git a/app/javascript/flavours/glitch/features/notifications/index.js b/app/javascript/flavours/glitch/features/notifications/index.js
index 075e729b18b22b498867fa44344bf75bbaa82a93..2682dd29b5b3d70c2d54c08a828d059e9e908a75 100644 (file)
--- a/app/javascript/flavours/glitch/features/notifications/index.js
+++ b/app/javascript/flavours/glitch/features/notifications/index.js
@@ -283,13 +283,14 @@ class Notifications extends React.PureComponent {
     if (canMarkAsRead) {
       extraButtons.push(
         <button
+          key='mark-as-read'
           aria-label={intl.formatMessage(messages.markAsRead)}
           title={intl.formatMessage(messages.markAsRead)}
           onClick={this.handleMarkAsRead}
           className='column-header__button'
         >
           <Icon id='check' />
-        </button>
+        </button>,
       );
     }
 
@@ -306,13 +307,14 @@ class Notifications extends React.PureComponent {
 
     extraButtons.push(
       <button
+        key='notif-cleaning'
         aria-label={msgEnterNotifCleaning}
         title={msgEnterNotifCleaning}
         onClick={this.onEnterCleaningMode}
         className={notifCleaningButtonClassName}
       >
         <Icon id='eraser' />
-      </button>
+      </button>,
     );
 
     const notifCleaningDrawer = (
@@ -323,6 +325,12 @@ class Notifications extends React.PureComponent {
       </div>
     );
 
+    const extraButton = (
+      <>
+        {extraButtons}
+      </>
+    );
+
     return (
       <Column
         bindToDocument={!multiColumn}
@@ -341,7 +349,7 @@ class Notifications extends React.PureComponent {
           pinned={pinned}
           multiColumn={multiColumn}
           localSettings={this.props.localSettings}
-          extraButton={extraButtons}
+          extraButton={extraButton}
           appendContent={notifCleaningDrawer}
         >
           <ColumnSettingsContainer />