LdapAuthTest.jsx 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146
  1. import React from 'react';
  2. import PropTypes from 'prop-types';
  3. import { withTranslation } from 'react-i18next';
  4. import AdminLdapSecurityContainer from '~/client/services/AdminLdapSecurityContainer';
  5. import AppContainer from '~/client/services/AppContainer';
  6. import { toastSuccess, toastError } from '~/client/util/apiNotification';
  7. import { apiPost } from '~/client/util/apiv1-client';
  8. import loggerFactory from '~/utils/logger';
  9. import { withUnstatedContainers } from '../../UnstatedUtils';
  10. const logger = loggerFactory('growi:security:AdminLdapSecurityContainer');
  11. class LdapAuthTest extends React.Component {
  12. constructor(props) {
  13. super(props);
  14. this.state = {
  15. logs: '',
  16. errorMessage: null,
  17. successMessage: null,
  18. };
  19. this.addLogs = this.addLogs.bind(this);
  20. this.testLdapCredentials = this.testLdapCredentials.bind(this);
  21. }
  22. /**
  23. * add logs
  24. */
  25. addLogs(log) {
  26. const newLog = `${new Date()} - ${log}\n\n`;
  27. this.setState({
  28. logs: `${newLog}${this.state.logs}`,
  29. });
  30. }
  31. /**
  32. * Test ldap auth
  33. */
  34. async testLdapCredentials() {
  35. try {
  36. const response = await apiPost('/login/testLdap', {
  37. loginForm: {
  38. username: this.props.username,
  39. password: this.props.password,
  40. },
  41. });
  42. // add logs
  43. if (response.err) {
  44. toastError(response.err);
  45. this.addLogs(response.err);
  46. }
  47. if (response.status === 'warning') {
  48. this.addLogs(response.message);
  49. this.setState({ errorMessage: response.message, successMessage: null });
  50. }
  51. if (response.status === 'success') {
  52. toastSuccess(response.message);
  53. this.setState({ successMessage: response.message, errorMessage: null });
  54. }
  55. if (response.ldapConfiguration) {
  56. const prettified = JSON.stringify(response.ldapConfiguration.server, undefined, 4);
  57. this.addLogs(`LDAP Configuration : ${prettified}`);
  58. }
  59. if (response.ldapAccountInfo) {
  60. const prettified = JSON.stringify(response.ldapAccountInfo, undefined, 4);
  61. this.addLogs(`Retrieved LDAP Account : ${prettified}`);
  62. }
  63. }
  64. // Catch server communication error
  65. catch (err) {
  66. toastError(err);
  67. logger.error(err);
  68. }
  69. }
  70. render() {
  71. const { t } = this.props;
  72. return (
  73. <React.Fragment>
  74. {this.state.successMessage != null && <div className="alert alert-success">{this.state.successMessage}</div>}
  75. {this.state.errorMessage != null && <div className="alert alert-warning">{this.state.errorMessage}</div>}
  76. <div className="form-group row">
  77. <label htmlFor="username" className="col-3 col-form-label">{t('username')}</label>
  78. <div className="col-6">
  79. <input
  80. className="form-control"
  81. name="username"
  82. value={this.props.username}
  83. onChange={(e) => { this.props.onChangeUsername(e.target.value) }}
  84. />
  85. </div>
  86. </div>
  87. <div className="form-group row">
  88. <label htmlFor="password" className="col-3 col-form-label">{t('Password')}</label>
  89. <div className="col-6">
  90. <input
  91. className="form-control"
  92. type="password"
  93. name="password"
  94. value={this.props.password}
  95. onChange={(e) => { this.props.onChangePassword(e.target.value) }}
  96. />
  97. </div>
  98. </div>
  99. <div className="form-group">
  100. <label><h5>Logs</h5></label>
  101. <textarea id="taLogs" className="col form-control" rows="4" value={this.state.logs} readOnly />
  102. </div>
  103. <div>
  104. <button type="button" className="btn btn-outline-secondary offset-5 col-2" onClick={this.testLdapCredentials}>Test</button>
  105. </div>
  106. </React.Fragment>
  107. );
  108. }
  109. }
  110. LdapAuthTest.propTypes = {
  111. t: PropTypes.func.isRequired, // i18next
  112. appContainer: PropTypes.instanceOf(AppContainer).isRequired,
  113. adminLdapSecurityContainer: PropTypes.instanceOf(AdminLdapSecurityContainer).isRequired,
  114. username: PropTypes.string.isRequired,
  115. password: PropTypes.string.isRequired,
  116. onChangeUsername: PropTypes.func.isRequired,
  117. onChangePassword: PropTypes.func.isRequired,
  118. };
  119. const LdapAuthTestWrapper = withUnstatedContainers(LdapAuthTest, [AppContainer, AdminLdapSecurityContainer]);
  120. export default withTranslation()(LdapAuthTestWrapper);