diff --git a/lms/djangoapps/support/static/support/jsx/single_support_form.jsx b/lms/djangoapps/support/static/support/jsx/single_support_form.jsx
index bfbe535e86..4c23849ee3 100644
--- a/lms/djangoapps/support/static/support/jsx/single_support_form.jsx
+++ b/lms/djangoapps/support/static/support/jsx/single_support_form.jsx
@@ -5,6 +5,9 @@
import PropTypes from 'prop-types';
import React from 'react';
import ReactDOM from 'react-dom';
+import { StatusAlert } from '@edx/paragon';
+
+import StringUtils from 'edx-ui-toolkit/js/utils/string-utils';
import ShowErrors from './errors_list';
import LoggedInUser from './logged_in_user';
@@ -25,15 +28,11 @@ class RenderForm extends React.Component {
this.userInformation = this.props.context.user;
const course = this.userInformation ? this.userInformation.course_id : '';
this.courseDiscussionURL = '/courses/{course_id}/discussion/forum';
- this.learnerSupportCenterURL = 'https://support.edx.org/';
this.submitButton = null;
this.state = {
currentRequest: null,
errorList: initialFormErrors,
success: false,
- activeSuggestion: 0,
- suggestions: [],
- typingTimeout: 0,
formData: {
course,
subject: '',
@@ -48,17 +47,7 @@ class RenderForm extends React.Component {
};
this.handleClick = this.handleClick.bind(this);
this.reDirectUser = this.reDirectUser.bind(this);
- this.handleInputChange = this.handleInputChange.bind(this);
this.formOnChangeCallback = this.formOnChangeCallback.bind(this);
- this.handleSearchButton = this.handleSearchButton.bind(this);
- this.onKeyDown = this.onKeyDown.bind(this);
- this.handleSuggestionClick = this.handleSuggestionClick.bind(this);
- this.ignoreBlur = false;
- this.handleBlur = this.handleBlur.bind(this);
- }
-
- setIgnoreBlur(ignore) {
- this.ignoreBlur = ignore;
}
getFormDataFromState() {
@@ -122,12 +111,12 @@ class RenderForm extends React.Component {
handleClick(event) {
event.preventDefault();
this.submitButton = event.currentTarget;
- this.submitButton.setAttribute('disabled', true);
+ this.submitButton.setAttribute("disabled", true);
const formData = this.getFormDataFromState();
this.clearErrorState();
this.validateFormData(formData);
if (this.formHasErrors()) {
- this.submitButton.removeAttribute('disabled');
+ this.submitButton.removeAttribute("disabled");
return this.scrollToTop();
}
this.createZendeskTicket(formData);
@@ -153,18 +142,18 @@ class RenderForm extends React.Component {
request.send(JSON.stringify(data));
request.onreadystatechange = function success() {
if (request.readyState === 4) {
- this.submitButton.removeAttribute('disabled');
+ this.submitButton.removeAttribute("disabled");
if (request.status === 201) {
- this.setState({
- success: true,
- });
+ this.setState({
+ success: true,
+ });
}
}
}.bind(this);
request.onerror = function error() {
this.updateErrorInState('request', this.formValidationErrors.request);
- this.submitButton.removeAttribute('disabled');
+ this.submitButton.removeAttribute("disabled");
this.scrollToTop();
}.bind(this);
}
@@ -194,71 +183,8 @@ class RenderForm extends React.Component {
);
}
- async handleInputChange(event) {
- event.preventDefault();
- const queryString = event.target.value;
- if (this.typingTimeout) { clearTimeout(this.typingTimeout); }
- this.typingTimeout = setTimeout(async () => {
- if (queryString.length > 2) {
- let suggestions = [];
- console.log(this);
- await fetch(`${this.learnerSupportCenterURL}/hc/api/internal/instant_search.json?query=${queryString}&locale=en-us`, { headers: {
- 'Content-Type': 'application/json',
- } }).then((response) => {
- suggestions = response.json.results;
- this.setState({ suggestions });
- });
- } else {
- this.setState({
- suggestions: [],
- activeSuggestion: 0,
- });
- }
- }, 500);
- }
-
- onKeyDown(event) {
- const { activeSuggestion, suggestions } = this.state;
- const enterKeyCode = 13,
- upArrowKeyCode = 38,
- downArrowKeyCode = 40;
-
- if (event.keyCode === enterKeyCode) {
- window.location.href = this.learnerSupportCenterURL + suggestions[activeSuggestion].url;
- } else if (event.keyCode === upArrowKeyCode) {
- (activeSuggestion === 0) ?
- this.setState({ activeSuggestion: suggestions.length - 1 }) :
- this.setState({ activeSuggestion: activeSuggestion - 1 });
- } else if (event.keyCode === downArrowKeyCode) {
- (activeSuggestion + 1 === suggestions.length) ?
- this.setState({ activeSuggestion: 0 }) :
- this.setState({ activeSuggestion: activeSuggestion + 1 });
- }
- }
-
- handleBlur(event) {
- if (!this.ignoreBlur) {
- this.setState({
- suggestions: [],
- activeSuggestion: 0,
- });
- }
- }
-
- handleSearchButton(query) {
- const queryString = query.replace(' ', '+');
-
- window.location.href = `${this.learnerSupportCenterURL}/hc/en-us/search?&query=${queryString}`;
- }
-
- handleSuggestionClick(url) {
- window.location.href = this.learnerSupportCenterURL + url;
- }
-
renderSupportForm() {
- const { activeSuggestion, suggestions } = this.state;
- let userElement,
- suggestionsListComponent = null;
+ let userElement;
if (this.userInformation) {
userElement = (