error handling

src/client/js/components/Admin/Security/TwitterSecuritySetting.jsx

@@ -18,18 +18,35 @@ class TwitterSecurityManagement extends React.Component {
   constructor(props) {
     super(props);
 
+    this.state = {
+      retrieveError: null,
+    };
+
     this.onClickSubmit = this.onClickSubmit.bind(this);
   }
 
+  async componentDidMount() {
+    const { adminTwitterSecurityContainer } = this.props;
+
+    try {
+      await adminTwitterSecurityContainer.retrieveSecurityData();
+    }
+    catch (err) {
+      toastError(err);
+      logger.error(err);
+    }
+  }
+
   async onClickSubmit() {
-    const { t } = this.props;
+    const { t, adminTwitterSecurityContainer } = this.props;
 
     try {
-      await this.props.adminTwitterSecurityContainer.updateTwitterSetting();
+      await adminTwitterSecurityContainer.updateTwitterSetting();
       toastSuccess(t('security_setting.OAuth.Twitter.updated_twitter'));
     }
     catch (err) {
       toastError(err);
+      this.setState({ retrieveError: err });
       logger.error(err);
     }
   }
@@ -44,6 +61,12 @@ class TwitterSecurityManagement extends React.Component {
           { t('security_setting.OAuth.Twitter.name') } { t('security_setting.configuration') }
         </h2>
 
+        {this.state.retrieveError != null && (
+        <div className="alert alert-danger">
+          <p>{t('Error occurred')}</p>
+        </div>
+        )}
+
         <div className="row mb-5">
           <strong className="col-xs-3 text-right">{ t('security_setting.OAuth.Twitter.name') }</strong>
           <div className="col-xs-6 text-left">

src/client/js/services/AdminTwitterSecurityContainer.js

@@ -23,23 +23,21 @@ export default class AdminTwitterSecurityContainer extends Container {
       callbackUrl: urljoin(pathUtils.removeTrailingSlash(appContainer.config.crowi.url), '/passport/twitter/callback'),
       twitterConsumerKey: '',
       twitterConsumerSecret: '',
-      isSameUsernameTreatedAsIdenticalUser: true,
+      isSameUsernameTreatedAsIdenticalUser: false,
     };
 
-    this.init();
-
   }
 
   /**
    * retrieve security data
    */
-  async init() {
+  async retrieveSecurityData() {
     const response = await this.appContainer.apiv3.get('/security-setting/');
     const { twitterOAuth } = response.data.securityParams;
     this.setState({
-      twitterConsumerKey: twitterOAuth.twitterConsumerKey,
-      twitterConsumerSecret: twitterOAuth.twitterConsumerSecret,
-      isSameUsernameTreatedAsIdenticalUser: twitterOAuth.isSameUsernameTreatedAsIdenticalUser,
+      twitterConsumerKey: twitterOAuth.twitterConsumerKey || '',
+      twitterConsumerSecret: twitterOAuth.twitterConsumerSecret || '',
+      isSameUsernameTreatedAsIdenticalUser: twitterOAuth.isSameUsernameTreatedAsIdenticalUser || false,
     });
   }
 

src/server/routes/apiv3/security-setting.js

@@ -106,9 +106,9 @@ module.exports = (crowi) => {
         isTwitterOAuthEnabled: await crowi.configManager.getConfig('crowi', 'security:passport-twitter:isEnabled'),
       },
       twitterOAuth: {
-        twitterConsumerKey: await crowi.configManager.getConfig('crowi', 'security:passport-twitter:consumerKey') || '',
-        twitterConsumerSecret: await crowi.configManager.getConfig('crowi', 'security:passport-twitter:consumerSecret') || '',
-        isSameUsernameTreatedAsIdenticalUser: await crowi.configManager.getConfig('crowi', 'security:passport-twitter:isSameUsernameTreatedAsIdenticalUser') || false,
+        twitterConsumerKey: await crowi.configManager.getConfig('crowi', 'security:passport-twitter:consumerKey'),
+        twitterConsumerSecret: await crowi.configManager.getConfig('crowi', 'security:passport-twitter:consumerSecret'),
+        isSameUsernameTreatedAsIdenticalUser: await crowi.configManager.getConfig('crowi', 'security:passport-twitter:isSameUsernameTreatedAsIdenticalUser'),
       },
     };