improve code (#4370)

* improve code

* optimized code

frontend/src/components/dialog/generate-upload-link.js

@@ -9,7 +9,6 @@ import { Utils } from '../../utils/utils';
 import UploadLink from '../../models/upload-link';
 import toaster from '../toast';
 import SendLink from '../send-link';
-import SessionExpiredTip from '../session-expired-tip';
 
 const propTypes = {
   itemPath: PropTypes.string.isRequired,
@@ -45,13 +44,11 @@ class GenerateUploadLink extends React.Component {
         this.setState({sharedUploadInfo: sharedUploadInfo});
       }
     }).catch((err) => {
-      if (err.response.status === 403) {
-        toaster.danger(
-          <SessionExpiredTip />,
-          {id: 'session_expired', duration: 3600}
-        );
-        this.props.closeShareDialog();
+      let errMsg = Utils.getErrorMsg(err, true);
+      if (!err.response || err.response.status !== 403) {
+        toaster.danger(errMsg);
       }
+      this.props.closeShareDialog();
     });
   }
 

frontend/src/components/permission-denied-tip.js

@@ -2,10 +2,12 @@ import React from 'react';
 import { gettext, loginUrl } from '../utils/constants';
 
 function PermissionDeniedTip() {
+  let reloginUrl = `${loginUrl}?next=${encodeURIComponent(location.href)}`;
+  let errorTip = gettext('Permission denied. Plaese try {placeholder-left}login again.{placeholder-right}');
+  errorTip = errorTip.replace('{placeholder-left}', '<a class="action-link p-0" href='+ reloginUrl + '>')
+  errorTip = errorTip.replace('{placeholder-right}', '</a>');
   return(
-    <span className="error">{gettext('Permission denied. Please try')}{' '}
-      <a className="action-link p-0" href={`${loginUrl}?next=${encodeURIComponent(location.href)}`}>{gettext('login again.')}</a>
-    </span>
+    <span className="error" dangerouslySetInnerHTML={{__html: errorTip}}></span>
   );
 } 
 

frontend/src/components/session-expired-tip.js

@@ -1,12 +0,0 @@
-import React from 'react';
-import { gettext, loginUrl } from '../utils/constants';
-
-function SessionExpiredTip() {
-  return(
-    <span className="error">{gettext('You are logged out.')}{' '}
-      <a className="action-link p-0" href={`${loginUrl}?next=${encodeURIComponent(location.href)}`}>{gettext('Login again.')}</a>
-    </span>
-  );
-} 
-
-export default SessionExpiredTip;

frontend/src/pages/groups/group-view.js

@@ -96,7 +96,7 @@ class GroupView extends React.Component {
     }).catch((error) => {
       this.setState({
         isLoading: false,
-        errorMsg: Utils.getErrorMsg(error, true) // true: show login tip if 403
+        errMessage: Utils.getErrorMsg(error, true) // true: show login tip if 403
       }); 
     });
   }
@@ -115,7 +115,7 @@ class GroupView extends React.Component {
     }).catch((error) => {
       this.setState({
         isLoading: false,
-        errorMsg: Utils.getErrorMsg(error, true) // true: show login tip if 403
+        errMessage: Utils.getErrorMsg(error, true) // true: show login tip if 403
       }); 
     });
   }
@@ -507,7 +507,7 @@ class GroupView extends React.Component {
             </div>
             <div className="cur-view-content">
               {this.state.isLoading && <Loading />}
-              {(!this.state.isLoading && errMessage) && errMessage}
+              {(!this.state.isLoading && errMessage) && <div className="error text-center mt-2">{errMessage}</div>}
               {(!this.state.isLoading && this.state.repoList.length === 0) && emptyTip}
               {(!this.state.isLoading && this.state.repoList.length > 0) &&
                 <SharedRepoListView 

frontend/src/pages/groups/groups-view.js

@@ -205,7 +205,7 @@ class GroupsView extends React.Component {
             </div>
             <div className="cur-view-content cur-view-content-groups">
               {this.state.isLoading && <Loading />}
-              {(!this.state.isLoading && this.state.errorMsg) && this.state.errorMsg}
+              {(!this.state.isLoading && this.state.errorMsg) && <div className="error text-center mt-2">{this.state.errorMsg}</div>}
               {(!this.state.isLoading && !this.state.errorMsg && this.state.groupList.length == 0) && emptyTip}
               {!this.state.isLoading && this.state.groupList.map((group, index) => {
                 return (

frontend/src/pages/lib-content-view/lib-content-view.js

@@ -18,7 +18,6 @@ import LibDecryptDialog from '../../components/dialog/lib-decrypt-dialog';
 import LibContentToolbar from './lib-content-toolbar';
 import LibContentContainer from './lib-content-container';
 import FileUploader from '../../components/file-uploader/file-uploader';
-import SessionExpiredTip from '../../components/session-expired-tip';
 
 const propTypes = {
   pathPrefix: PropTypes.array.isRequired,
@@ -449,11 +448,9 @@ class LibContentView extends React.Component {
         });
       });
     }).catch((err) => {
-      if (err.response.status === 403) {
-        toaster.danger(
-          <SessionExpiredTip />,
-          {id: 'session_expired', duration: 3600}
-        );
+      let errMsg = Utils.getErrorMsg(err, true);
+      if (!err.response || err.response.status !== 403) {
+        toaster.danger(errMsg);
       }
       this.setState({
         isFileLoading: false,
@@ -496,11 +493,8 @@ class LibContentView extends React.Component {
         this.getThumbnails(repoID, path, this.state.direntList);
       }
     }).catch((err) => {
-      if (err.response.status === 403) {
-        toaster.danger(
-          <SessionExpiredTip />,
-          {id: 'session_expired', duration: 3600}
-        );
+      Utils.getErrorMsg(err, true);
+      if (err.response && err.response.status === 403) {
         this.setState({isDirentListLoading: false});
         return;
       }

frontend/src/utils/utils.js

@@ -981,7 +981,6 @@ export const Utils = {
             <PermissionDeniedTip />,
             {id: 'permission_denied', duration: 3600}
           );
-          return;
         }
         errorMsg = gettext('Permission denied');
       } else if (error.response.data &&