refactor StaffCredit

src/client/js/components/Hotkeys/HotkeysManager.jsx

@@ -1,16 +1,17 @@
 import React, { useState } from 'react';
 
 import HotkeysDetector from './HotkeysDetector';
-import StaffCredit from '../StaffCredit/StaffCredit';
-import MirrorMode from '../MirrorMode/MirrorMode';
+
+import ShowStaffCredit from './Subscribers/ShowStaffCredit';
+import SwitchToMirrorMode from './Subscribers/SwitchToMirrorMode';
 import ShowShortcutsModal from './Subscribers/ShowShortcutsModal';
 import CreatePage from './Subscribers/CreatePage';
 import EditPage from './Subscribers/EditPage';
 
 // define supported components list
 const SUPPORTED_COMPONENTS = [
-  // StaffCredit,
-  // MirrorMode,
+  ShowStaffCredit,
+  SwitchToMirrorMode,
   ShowShortcutsModal,
   CreatePage,
   EditPage,

src/client/js/components/Hotkeys/Subscribers/ShowStaffCredit.jsx

@@ -0,0 +1,20 @@
+import React, { useEffect } from 'react';
+import PropTypes from 'prop-types';
+
+import StaffCredit from '../../StaffCredit/StaffCredit';
+
+const ShowStaffCredit = (props) => {
+
+  return <StaffCredit onClose={() => props.onDeleteRender(this)} />;
+
+};
+
+ShowStaffCredit.propTypes = {
+  onDeleteRender: PropTypes.func.isRequired,
+};
+
+ShowStaffCredit.getHotkeyStrokes = () => {
+  return [['ArrowUp', 'ArrowUp', 'ArrowDown', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowLeft', 'ArrowRight', 'b', 'a']];
+};
+
+export default ShowStaffCredit;

src/client/js/components/StaffCredit/StaffCredit.jsx

@@ -14,28 +14,20 @@ import contributors from './Contributor';
  * @extends {React.Component}
  */
 
+// eslint-disable-next-line no-unused-vars
+const logger = loggerFactory('growi:cli:StaffCredit');
 
 export default class StaffCredit extends React.Component {
 
   constructor(props) {
 
     super(props);
-    this.logger = loggerFactory('growi:StaffCredit');
     this.state = {
       isShown: true,
     };
     this.deleteCredit = this.deleteCredit.bind(this);
   }
 
-  // when this is called it returns the hotkey stroke
-  static getHotkeyStroke() {
-    return [['ArrowUp', 'ArrowUp', 'ArrowDown', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowLeft', 'ArrowRight', 'b', 'a']];
-  }
-
-  static getComponent(onDeleteRender) {
-    return <StaffCredit onDeleteRender={onDeleteRender} />;
-  }
-
   // to delete the staffCredit and to inform that to Hotkeys.jsx
   deleteCredit() {
     if (this.state.isShown) {
@@ -109,10 +101,16 @@ export default class StaffCredit extends React.Component {
   }
 
   render() {
+    const { onClosed } = this.props;
+
     return (
       <Modal
         isOpen={this.state.isShown}
-        onClosed={() => { return () => { this.props.onDeleteRender(this) } }}
+        onClosed={() => {
+          if (onClosed != null) {
+            onClosed();
+          }
+        }}
         toggle={this.deleteCredit}
         scrollable
         className="staff-credit"
@@ -126,5 +124,5 @@ export default class StaffCredit extends React.Component {
 
 }
 StaffCredit.propTypes = {
-  onDeleteRender: PropTypes.func,
+  onClosed: PropTypes.func,
 };