[DEV-197] Message bug (#1113)

* Fix message bug

* Add controlled pattern to message component

* Fix bug in admin panel custom fields form message

* Fix bug in dashboard ticket page message

* Fix bug in staff editor messages

* Fix bug in ticket viewer messages

* Fix bug in admin login page messages

* Fix bug in password recovery messages

* Fix bug in main home page login widget messages

* Fix bug in main signup widget messages

* Fix bug in admin panel custom responses message

* Fix bug in admin panel email settings message

* Fix bug in admin panel ban users message

* Fix bug in admin panel ban users message

* Fix bug in main recover password page messages

* Fix bug in dashboard list tickets page message

* Fix bug in dashboard edit profile page messages

* Fix bug in create ticket form messages

* Fix bug in invite user widget messages

* Fix bug in create ticket form messages

* Fix bug in admin panel list users messages

* Fix bug in admin panel system preferences messages

* Fix bug in admin panel advanced settings messages

* Fix bug in install step 3 database message

* Fix bug in install step 5 settings message

* Fix bug in install step 6 admin message

* Fix bug in install completed message

* Fix bug in ticket query list message

* Fix bug in articles list message

* Fix bug in admin pane search tickets message

* Fix bug in admin panel my tickets message

* Fix bug in admin panel new tickets messages

* Fix bug in ticket list messages

* Fix bug in main home page portal message

* Fix bug in dashboard create ticket page message

* Fix bug in main home page messages
This commit is contained in:
LautaroCesso 2021-12-28 14:03:53 -03:00 committed by GitHub
parent b9f5f7fcf1
commit 9291aa66a4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
36 changed files with 800 additions and 288 deletions

View File

@ -39,7 +39,7 @@ class ArticlesList extends React.Component {
const { errored, loading } = this.props;
if(errored) {
return <Message type="error">{i18n('ERROR_RETRIEVING_ARTICLES')}</Message>;
return <Message showCloseButton={false} type="error">{i18n('ERROR_RETRIEVING_ARTICLES')}</Message>;
}
return loading ? <Loading /> : this.renderContent();

View File

@ -24,13 +24,19 @@ class PasswordRecovery extends React.Component {
renderLogo: false
};
state = {
showRecoverSentMessage: true
}
componentDidUpdate(prevProps) {
if (!prevProps.recoverSent && this.props.recoverSent) {
this.setState({showRecoverSentMessage : true});
}
}
render() {
const {
renderLogo,
formProps,
onBackToLoginClick,
style
} = this.props;
const { renderLogo, formProps, onBackToLoginClick, style } = this.props;
return (
<Widget style={style} className={this.getClass()} title={!renderLogo ? i18n('RECOVER_PASSWORD') : ''}>
{this.renderLogo()}
@ -68,22 +74,29 @@ class PasswordRecovery extends React.Component {
}
renderRecoverStatus() {
let status = null;
if (this.props.recoverSent) {
status = (
<Message className="password-recovery__message" type="info" leftAligned>
{i18n('RECOVER_SENT')}
</Message>
);
}
return status;
return (
this.props.recoverSent ?
<Message
showMessage={this.state.showRecoverSentMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showRecoverSentMessage")}
className="password-recovery__message"
type="info"
leftAligned>
{i18n('RECOVER_SENT')}
</Message> :
null
);
}
focusEmail() {
this.refs.email.focus();
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default PasswordRecovery;

View File

@ -15,6 +15,7 @@ import Checkbox from 'core-components/checkbox';
import Tag from 'core-components/tag';
import Icon from 'core-components/icon';
import Message from 'core-components/message';
import history from 'lib-app/history';
class TicketList extends React.Component {
static propTypes = {
@ -90,9 +91,23 @@ class TicketList extends React.Component {
renderMessage() {
switch (queryString.parse(window.location.search)["message"]) {
case 'success':
return <Message className="create-ticket-form__message" type="success">{i18n('TICKET_SENT')}</Message>
return (
<Message
onCloseMessage={this.onCloseMessage}
className="create-ticket-form__message"
type="success">
{i18n('TICKET_SENT')}
</Message>
);
case 'fail':
return <Message className="create-ticket-form__message" type="error">{i18n('TICKET_SENT_ERROR')}</Message>;
return (
<Message
onCloseMessage={this.onCloseMessage}
className="create-ticket-form__message"
type="error">
{i18n('TICKET_SENT_ERROR')}
</Message>
);
default:
return null;
}
@ -293,6 +308,10 @@ class TicketList extends React.Component {
}
}
}
onCloseMessage() {
history.push(window.location.pathname);
}
}
export default connect((store) => {

View File

@ -21,13 +21,9 @@ class TicketQueryList extends React.Component {
render() {
return (
<div>
{
(this.state.error) ?
<Message type="error">{i18n('ERROR_RETRIEVING_TICKETS')}</Message> :
<TicketList {...this.getTicketListProps()}/>
}
</div>
this.state.error ?
<Message showCloseButton={false} type="error">{i18n('ERROR_RETRIEVING_TICKETS')}</Message> :
<TicketList {...this.getTicketListProps()} />
);
}

View File

@ -71,6 +71,7 @@ class TicketViewer extends React.Component {
editTags: false,
editOwner: false,
editDepartment: false,
showTicketCommentErrorMessage: true
};
componentDidMount() {
@ -529,8 +530,16 @@ class TicketViewer extends React.Component {
}
renderCommentError() {
const { showTicketCommentErrorMessage } = this.state;
return (
<Message className="ticket-viewer__message" type="error">{i18n('TICKET_COMMENT_ERROR')}</Message>
<Message
showMessage={showTicketCommentErrorMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showTicketCommentErrorMessage")}
className="ticket-viewer__message"
type="error">
{i18n('TICKET_COMMENT_ERROR')}
</Message>
);
}
@ -775,7 +784,7 @@ class TicketViewer extends React.Component {
data,
TextEditor.getContentFormData(content)
)
}).then(this.onEditCommentSuccess.bind(this), this.onFailCommentFail.bind(this));
}).then(this.onEditCommentSuccess.bind(this), this.onEditCommentFail.bind(this));
}
onEditCommentSuccess() {
@ -789,10 +798,11 @@ class TicketViewer extends React.Component {
this.onTicketModification();
}
onFailCommentFail() {
onEditCommentFail() {
this.setState({
loading: false,
commentError: true
commentError: true,
showTicketCommentErrorMessage: true
});
}
@ -824,7 +834,8 @@ class TicketViewer extends React.Component {
onCommentFail() {
this.setState({
loading: false,
commentError: true
commentError: true,
showTicketCommentErrorMessage: true
});
}
@ -890,6 +901,12 @@ class TicketViewer extends React.Component {
return false;
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default connect((store) => {

View File

@ -27,11 +27,14 @@ class AdminLoginPage extends React.Component {
recoverFormErrors: {},
recoverSent: false,
loadingLogin: false,
loadingRecover: false
loadingRecover: false,
showRecoverSentMessage: true,
showEmailOrPassordErrorMessage: true
};
componentDidUpdate(prevProps) {
if (!prevProps.session.failed && this.props.session.failed) {
this.setState({showEmailOrPassordErrorMessage : true});
this.refs.loginForm.refs.password.focus();
}
}
@ -108,31 +111,34 @@ class AdminLoginPage extends React.Component {
}
renderRecoverStatus() {
let status = null;
const { showRecoverSentMessage, recoverSent } = this.state;
if (this.state.recoverSent) {
status = (
<Message className="admin-login-page__message" type="info" leftAligned>
{i18n('RECOVER_SENT')}
</Message>
);
}
return status;
return (
recoverSent ?
<Message
showMessage={showRecoverSentMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showRecoverSentMessage")}
className="admin-login-page__message"
type="info"
leftAligned>
{i18n('RECOVER_SENT')}
</Message> :
null
);
}
renderErrorStatus() {
let status = null;
if (this.props.session.failed) {
status = (
<Message className="admin-login-page__error" type="error">
{i18n('EMAIL_OR_PASSWORD')}
</Message>
);
}
return status;
return (
this.props.session.failed ?
<Message
showMessage={this.state.showEmailOrPassordErrorMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showEmailOrPassordErrorMessage")}
className="admin-login-page__error"
type="error">
{i18n('EMAIL_OR_PASSWORD')}
</Message> :
null
);
}
getLoginFormProps() {
@ -147,10 +153,7 @@ class AdminLoginPage extends React.Component {
}
getRecoverFormProps() {
const {
loadingRecover,
recoverFormErrors
} = this.state;
const { loadingRecover, recoverFormErrors } = this.state;
return {
loading: loadingRecover,
@ -222,7 +225,8 @@ class AdminLoginPage extends React.Component {
onRecoverPasswordSent() {
this.setState({
loadingRecover: false,
recoverSent: true
recoverSent: true,
showRecoverSentMessage: true
});
}
@ -236,6 +240,12 @@ class AdminLoginPage extends React.Component {
this.refs.recoverForm.refs.email.focus();
}.bind(this));
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default connect((store) => {

View File

@ -27,7 +27,9 @@ class AdminPanelAdvancedSettings extends React.Component {
messageContent: '',
selectedAPIKey: -1,
APIKeys: [],
error: ''
error: '',
showMessage: true,
showAPIKeyMessage: true
};
componentDidMount() {
@ -36,7 +38,7 @@ class AdminPanelAdvancedSettings extends React.Component {
render() {
const { config } = this.props;
const { messageType, error, selectedAPIKey } = this.state;
const { messageType, error, selectedAPIKey, showAPIKeyMessage } = this.state;
return (
<div className="admin-panel-advanced-settings">
@ -93,7 +95,16 @@ class AdminPanelAdvancedSettings extends React.Component {
<Listing {...this.getListingProps()} />
</div>
<div className="col-md-8 admin-panel-advanced-settings__api-keys__container">
{error ? <Message type="error">{i18n(error)}</Message> : ((selectedAPIKey === -1) ? this.renderNoKey() : this.renderKey())}
{
error ?
<Message
showMessage={showAPIKeyMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showAPIKeyMessage")}
type="error">
{i18n(error)}
</Message> :
((selectedAPIKey === -1) ? this.renderNoKey() : this.renderKey())
}
</div>
</div>
</div>
@ -102,11 +113,16 @@ class AdminPanelAdvancedSettings extends React.Component {
}
renderMessage() {
const { messageType, messageTitle, messageContent } = this.state;
const { messageType, messageTitle, messageContent, showMessage } = this.state;
return (
<Message className="admin-panel-advanced-settings__message" type={messageType} title={messageTitle}>
{messageContent}
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="admin-panel-advanced-settings__message"
type={messageType}
title={messageTitle}>
{messageContent}
</Message>
);
}
@ -270,10 +286,11 @@ class AdminPanelAdvancedSettings extends React.Component {
this.setState({
messageType: 'success',
messageTitle: null,
showMessage: true,
messageContent: config['mandatory-login'] ? i18n('MANDATORY_LOGIN_DISABLED') : i18n('MANDATORY_LOGIN_ENABLED')
});
dispatch(ConfigActions.updateData());
}).catch(() => this.setState({messageType: 'error', messageTitle: null, messageContent: i18n('ERROR_UPDATING_SETTINGS')}));
}).catch(() => this.setState({messageType: 'error', showMessage: true, messageTitle: null, messageContent: i18n('ERROR_UPDATING_SETTINGS')}));
}
onAreYouSureRegistrationOk(password) {
@ -287,11 +304,12 @@ class AdminPanelAdvancedSettings extends React.Component {
}).then(() => {
this.setState({
messageType: 'success',
showMessage: true,
messageTitle: null,
messageContent: config['registration'] ? i18n('REGISTRATION_DISABLED') : i18n('REGISTRATION_ENABLED')
});
dispatch(ConfigActions.updateData());
}).catch(() => this.setState({messageType: 'error', messageTitle: null, messageContent: i18n('ERROR_UPDATING_SETTINGS')}));
}).catch(() => this.setState({messageType: 'error', showMessage: true, messageTitle: null, messageContent: i18n('ERROR_UPDATING_SETTINGS')}));
}
onImportCSV(event) {
@ -308,7 +326,8 @@ class AdminPanelAdvancedSettings extends React.Component {
}
})
.then((result) => this.setState({
messageType: 'success',
messageType: 'success',
showMessage: true,
messageTitle: i18n('SUCCESS_IMPORTING_CSV_DESCRIPTION'),
messageContent: (result.data.length) ? (
<div>
@ -319,7 +338,7 @@ class AdminPanelAdvancedSettings extends React.Component {
</div>
) : null
}))
.catch(() => this.setState({messageType: 'error', messageTitle: null, messageContent: i18n('INVALID_FILE')}));
.catch(() => this.setState({messageType: 'error', showMessage: true, messageTitle: null, messageContent: i18n('INVALID_FILE')}));
}
onBackupDatabase() {
@ -347,12 +366,17 @@ class AdminPanelAdvancedSettings extends React.Component {
data: {
password: password
}
}).then(() => this.setState({messageType: 'success', messageTitle: null, messageContent: i18n('SUCCESS_DELETING_ALL_USERS')}
)).catch(() => this.setState({messageType: 'error', messageTitle: null, messageContent: i18n('ERROR_DELETING_ALL_USERS')}));
}).then(() => this.setState({messageType: 'success', showMessage: true, messageTitle: null, messageContent: i18n('SUCCESS_DELETING_ALL_USERS')}
)).catch(() => this.setState({messageType: 'error', showMessage: true, messageTitle: null, messageContent: i18n('ERROR_DELETING_ALL_USERS')}));
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default connect((store) => {
return {
config: store.config

View File

@ -169,7 +169,7 @@ class AdminPanelEmailSettings extends React.Component {
</SubmitButton>
</div>
</Form>
<Message className="admin-panel-email-settings__imap-message" type="info">
<Message showCloseButton={false} className="admin-panel-email-settings__imap-message" type="info">
{i18n('IMAP_POLLING_DESCRIPTION', {url: `${apiRoot}/system/email-polling`})}
</Message>
</div>

View File

@ -26,7 +26,8 @@ class AdminPanelSystemPreferences extends React.Component {
message: null,
values: {
maintenance: false,
}
},
showMessage: true
};
componentDidMount() {
@ -113,11 +114,29 @@ class AdminPanelSystemPreferences extends React.Component {
}
renderMessage() {
switch (this.state.message) {
const { message, showMessage } = this.state;
switch (message) {
case 'success':
return <Message className="admin-panel-system-preferences__message" type="success">{i18n('SETTINGS_UPDATED')}</Message>;
return (
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="admin-panel-system-preferences__message"
type="success">
{i18n('SETTINGS_UPDATED')}
</Message>
);
case 'fail':
return <Message className="admin-panel-system-preferences__message" type="error">{i18n('ERROR_UPDATING_SETTINGS')}</Message>;
return (
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="admin-panel-system-preferences__message"
type="error">
{i18n('ERROR_UPDATING_SETTINGS')}
</Message>
);
default:
return null;
}
@ -155,14 +174,15 @@ class AdminPanelSystemPreferences extends React.Component {
'allowedLanguages': JSON.stringify(form.allowedLanguages.map(index => languageKeys[index])),
'supportedLanguages': JSON.stringify(form.supportedLanguages.map(index => languageKeys[index]))
}
}).then(this.onSubmitSuccess.bind(this)).catch(() => this.setState({loading: false, message: 'fail'}));
}).then(this.onSubmitSuccess.bind(this)).catch(() => this.setState({loading: false, message: 'fail', showMessage: true}));
}
onSubmitSuccess() {
this.recoverSettings();
this.setState({
message: 'success',
loading: false
loading: false,
showMessage: true
});
}
@ -202,7 +222,8 @@ class AdminPanelSystemPreferences extends React.Component {
onRecoverSettingsFail() {
this.setState({
message: 'error'
message: 'error',
showMessage: true
});
}
@ -211,6 +232,12 @@ class AdminPanelSystemPreferences extends React.Component {
this.setState({loading: true});
this.recoverSettings();
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default AdminPanelSystemPreferences;

View File

@ -43,6 +43,9 @@ class AdminPanelDepartments extends React.Component {
editedAddDepartmentForm: false,
editedDefaultDepartmentForm: false,
errorMessage: null,
showErrorMessage: true,
showSuccessMessage: true,
showDefaultDepartmentErrorMessage: true,
errors: {},
defaultDepartmentError: null,
form: {
@ -55,7 +58,7 @@ class AdminPanelDepartments extends React.Component {
};
render() {
const { errorMessage, formLoading, selectedIndex } = this.state;
const { errorMessage, formLoading, selectedIndex, showErrorMessage } = this.state;
return (
<div className="admin-panel-departments">
@ -65,7 +68,13 @@ class AdminPanelDepartments extends React.Component {
<Listing {...this.getListingProps()} />
</div>
<div className="col-md-8">
{errorMessage ? <Message type="error">{i18n(errorMessage)}</Message> : null}
{
errorMessage ?
<Message showMessage={showErrorMessage} onCloseMessage={this.onCloseMessage.bind(this, "showErrorMessage")} type="error">
{i18n(errorMessage)}
</Message> :
null
}
<Form {...this.getFormProps()}>
<div className="admin-panel-departments__container">
<FormField className="admin-panel-departments__container__name" label={i18n('NAME')} name="name" validation="NAME" required fieldProps={{size: 'large'}} />
@ -98,15 +107,19 @@ class AdminPanelDepartments extends React.Component {
}
renderDefaultDepartmentForm() {
const { defaultDepartmentError, formLoading } = this.state;
const { defaultDepartmentError, formLoading, showSuccessMessage, showDefaultDepartmentErrorMessage } = this.state;
return (
<div className="admin-panel-departments__default-departments-container">
<span className="separator" />
{(defaultDepartmentError !== null) ?
((!defaultDepartmentError) ?
<Message type="success">{i18n('SETTINGS_UPDATED')}</Message> :
<Message type="error">{i18n(defaultDepartmentError)}</Message>) :
<Message showMessage={showSuccessMessage} onCloseMessage={this.onCloseMessage.bind(this, "showSuccessMessage")} type="success">
{i18n('SETTINGS_UPDATED')}
</Message> :
<Message showMessage={showDefaultDepartmentErrorMessage} onCloseMessage={this.onCloseMessage.bind(this, "showDefaultDepartmentErrorMessage")} type="error">
{i18n(defaultDepartmentError)}
</Message>) :
null}
<Form {...this.getDefaultDepartmentFormProps()} className="admin-panel-departments__default-departments-container__form">
<div className="admin-panel-departments__default-departments-container__form__fields" >
@ -234,6 +247,12 @@ class AdminPanelDepartments extends React.Component {
};
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
onItemChange(index) {
if(this.state.editedAddDepartmentForm) {
AreYouSure.openModal(i18n('WILL_LOSE_CHANGES'), this.updateForm.bind(this, index));
@ -255,8 +274,8 @@ class AdminPanelDepartments extends React.Component {
}
}).then(() => {
this.retrieveDepartments(true);
this.setState({formLoading: false, errorMessage: false, defaultDepartmentError: false});
}).catch(result => this.setState({formLoading: false, defaultDepartmentError: result.message}));
this.setState({formLoading: false, errorMessage: false, defaultDepartmentError: false, showSuccessMessage: true});
}).catch(result => this.setState({formLoading: false, defaultDepartmentError: result.message, showDefaultDepartmentErrorMessage: true}));
}
onFormSubmit(form) {
@ -273,7 +292,7 @@ class AdminPanelDepartments extends React.Component {
}).then(() => {
this.setState({formLoading: false, errorMessage: false, defaultDepartmentError: null});
this.retrieveDepartments();
}).catch(result => this.setState({formLoading: false, errorMessage: result.message, defaultDepartmentError: null}));
}).catch(result => this.setState({formLoading: false, errorMessage: result.message, showErrorMessage: true, defaultDepartmentError: null}));
} else {
API.call({
path: '/system/add-department',
@ -287,7 +306,7 @@ class AdminPanelDepartments extends React.Component {
this.onItemChange(-1);
}).catch(result => {
this.onItemChange.bind(this, -1);
this.setState({formLoading: false, errorMessage: result.message, defaultDepartmentError: null});
this.setState({formLoading: false, errorMessage: result.message, showErrorMessage: true, defaultDepartmentError: null});
});
}
}
@ -316,7 +335,7 @@ class AdminPanelDepartments extends React.Component {
this.onItemChange(-1);
this.setState({defaultDepartmentError: null});
})
.catch(result => this.setState({errorMessage: result.message, defaultDepartmentError: null}));
.catch(result => this.setState({errorMessage: result.message, showErrorMessage: true, defaultDepartmentError: null}));
}
updateForm(index) {

View File

@ -56,6 +56,8 @@ class StaffEditor extends React.Component {
loadingReInviteStaff: false,
reInviteStaff: "",
loadingStats: true,
showMessage: true,
showReInviteStaffMessage: true,
rawForm: {
dateRange: statsUtils.getInitialDateRange(),
departments: [],
@ -181,12 +183,17 @@ class StaffEditor extends React.Component {
}
renderReInviteStaffMessage() {
const { reInviteStaff } = this.state;
const { reInviteStaff, showReInviteStaffMessage } = this.state;
if (reInviteStaff) {
return (
<Message className="staff-editor__staff-invitation-message" type={reInviteStaff} leftAligned>
{(reInviteStaff === "success") ? i18n('RESEND_STAFF_INVITATION_SUCCESS') : i18n('RESEND_STAFF_INVITATION_FAIL')}
<Message
showMessage={showReInviteStaffMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showReInviteStaffMessage")}
className="staff-editor__staff-invitation-message"
type={reInviteStaff}
leftAligned>
{(reInviteStaff === "success") ? i18n('RESEND_STAFF_INVITATION_SUCCESS') : i18n('RESEND_STAFF_INVITATION_FAIL')}
</Message>
);
} else {
@ -207,19 +214,21 @@ class StaffEditor extends React.Component {
}).then(() => {
this.setState({
loadingReInviteStaff: false,
reInviteStaff: 'success'
reInviteStaff: 'success',
showReInviteStaffMessage: true
})
}).catch(() => {
this.setState({
loadingReInviteStaff: false,
reInviteStaff: 'error'
reInviteStaff: 'error',
showReInviteStaffMessage: true
})
})
}
renderMessage() {
const { message } = this.state;
let messageType = (message === 'FAIL') ? 'error' : 'success';
const { message, showMessage } = this.state;
const messageType = (message === 'FAIL') ? 'error' : 'success';
let _message = null;
switch (message) {
@ -243,7 +252,15 @@ class StaffEditor extends React.Component {
break;
}
return <Message className="staff-editor__message" type={messageType}>{i18n(_message)}</Message>;
return (
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="staff-editor__message"
type={messageType}>
{i18n(_message)}
</Message>
);
}
renderSendEmailOnNewTicketForm() {
@ -406,6 +423,8 @@ class StaffEditor extends React.Component {
}
onSubmit(eventType, form) {
this.setState({loadingStats: true});
const { myAccount, staffId, onChange } = this.props;
let departments;
@ -428,13 +447,11 @@ class StaffEditor extends React.Component {
}).then(() => {
this.retrieveStaffMembers();
window.scrollTo(0,250);
this.setState({message: eventType});
this.setState({message: eventType, showMessage: true});
const departmentsAssigned = SessionStore.getDepartments().filter((_department, index) => this.state.departments.includes(index));
const departmentsAssignedId = departmentsAssigned.map(department => department.id);
this.setState({loadingStats: true});
statsUtils.retrieveStats({
rawForm: this.state.rawForm,
departments: departmentsAssignedId
@ -448,7 +465,7 @@ class StaffEditor extends React.Component {
onChange && onChange();
}).catch(() => {
window.scrollTo(0,250);
this.setState({message: 'FAIL'});
this.setState({message: 'FAIL', loadingStats: false, showMessage: true});
});
}
@ -462,7 +479,7 @@ class StaffEditor extends React.Component {
}
}).then(onDelete).catch(() => {
window.scrollTo(0,0);
this.setState({message: 'FAIL'});
this.setState({message: 'FAIL', showMessage: true});
});
}
@ -488,7 +505,7 @@ class StaffEditor extends React.Component {
onChange && onChange();
}).catch(() => {
window.scrollTo(0,0);
this.setState({message: 'FAIL', loadingPicture: false});
this.setState({message: 'FAIL', loadingPicture: false, showMessage: true});
});
}
@ -557,6 +574,12 @@ class StaffEditor extends React.Component {
department: newDepartmentFilter ? `[${newDepartmentFilter}]` : undefined
}
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default connect((store) => {

View File

@ -41,7 +41,8 @@ class AdminPanelCustomResponses extends React.Component {
title: '',
content: TextEditor.createEmpty(),
language: this.props.language
}
},
showErrorMessage: true
};
componentDidMount() {
@ -103,8 +104,16 @@ class AdminPanelCustomResponses extends React.Component {
);
}
renderErrorMessage() {
const { showErrorMessage, error } = this.state;
return(
<Message className="admin-panel-custom-responses__message" type="error">{i18n(this.state.error)}</Message>
<Message
showMessage={showErrorMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showErrorMessage")}
className="admin-panel-custom-responses__message"
type="error">
{i18n(error)}
</Message>
)
}
renderOptionalButtons() {
@ -202,7 +211,7 @@ class AdminPanelCustomResponses extends React.Component {
this.onItemChange(-1);
}).catch((e) => {
this.onItemChange.bind(this, -1)
this.setState({error: e.message, formLoading:false});
this.setState({error: e.message, formLoading:false, showErrorMessage: true});
});
}
}
@ -267,6 +276,12 @@ class AdminPanelCustomResponses extends React.Component {
)
);
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default connect((store) => {

View File

@ -36,7 +36,7 @@ class AdminPanelMyTickets extends React.Component {
return (
<div className="admin-panel-my-tickets">
<Header title={i18n('MY_TICKETS')} description={i18n('MY_TICKETS_DESCRIPTION')} />
{(this.props.error) ? <Message type="error">{i18n('ERROR_RETRIEVING_TICKETS')}</Message> : <TicketList {...this.getProps()} />}
{(this.props.error) ? <Message showCloseButton={false} type="error">{i18n('ERROR_RETRIEVING_TICKETS')}</Message> : <TicketList {...this.getProps()} />}
<div style={{textAlign: 'right', marginTop: 10}}>
<Button onClick={this.onCreateTicket.bind(this)} type="secondary" size="medium">
<Icon size="sm" name="plus" /> {i18n('CREATE_TICKET')}

View File

@ -31,8 +31,8 @@ class AdminPanelNewTickets extends React.Component {
return (
<div className="admin-panel-new-tickets">
<Header title={i18n('NEW_TICKETS')} description={i18n('NEW_TICKETS_DESCRIPTION')} />
{(noDepartments) ? <Message className="admin-panel-new-tickets__department-warning" type="warning">{i18n('NO_DEPARTMENT_ASSIGNED')}</Message> : null}
{(this.props.error) ? <Message type="error">{i18n('ERROR_RETRIEVING_TICKETS')}</Message> : <TicketList {...this.getProps()}/>}
{(noDepartments) ? <Message showCloseButton={false} className="admin-panel-new-tickets__department-warning" type="warning">{i18n('NO_DEPARTMENT_ASSIGNED')}</Message> : null}
{(this.props.error) ? <Message showCloseButton={false} type="error">{i18n('ERROR_RETRIEVING_TICKETS')}</Message> : <TicketList {...this.getProps()}/>}
</div>
);
}

View File

@ -49,7 +49,8 @@ updateSearchTicketsFromURL();
class AdminPanelSearchTickets extends React.Component {
render() {
const { listConfig } = this.props;
const { listConfig, error } = this.props;
return (
<div className="admin-panel-search-tickets">
<div className="admin-panel-search-tickets__container">
@ -67,10 +68,9 @@ class AdminPanelSearchTickets extends React.Component {
</div>
<TicketQueryFilters />
{
(this.props.error) ?
<Message type="error">{i18n('ERROR_RETRIEVING_TICKETS')}</Message> :
<TicketQueryList
onChangeOrderBy={this.onChangeOrderBy.bind(this)} />
error ?
<Message showCloseButton={false} type="error">{i18n('ERROR_RETRIEVING_TICKETS')}</Message> :
<TicketQueryList onChangeOrderBy={this.onChangeOrderBy.bind(this)} />
}
</div>
);

View File

@ -21,7 +21,9 @@ class AdminPanelBanUsers extends React.Component {
listError: false,
addBanStatus: 'none',
emails: [],
filteredEmails: []
filteredEmails: [],
showMessage: true,
showListErrorMessage: true
};
componentDidMount() {
@ -29,10 +31,18 @@ class AdminPanelBanUsers extends React.Component {
}
render() {
const { listError, showListErrorMessage } = this.state;
return (
<div className="admin-panel-ban-users row">
<Header title={i18n('BAN_USERS')} description={i18n('BAN_USERS_DESCRIPTION')} />
{(this.state.listError) ? <Message type="error">{i18n('ERROR_RETRIEVING_BAN_LIST')}</Message> : this.renderContent()}
{
listError ?
<Message showMessage={showListErrorMessage} onCloseMessage={this.onCloseMessage.bind(this, "showListErrorMessage")} type="error">
{i18n('ERROR_RETRIEVING_BAN_LIST')}
</Message> :
this.renderContent()
}
</div>
);
}
@ -59,11 +69,29 @@ class AdminPanelBanUsers extends React.Component {
}
renderMessage() {
switch (this.state.addBanStatus) {
const { addBanStatus, showMessage } = this.state;
switch (addBanStatus) {
case 'success':
return <Message className="admin-panel-ban-users__form-message" type="success">{i18n('EMAIL_BANNED_SUCCESSFULLY')}</Message>;
return (
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="admin-panel-ban-users__form-message"
type="success">
{i18n('EMAIL_BANNED_SUCCESSFULLY')}
</Message>
);
case 'fail':
return <Message className="admin-panel-ban-users__form-message" type="error">{i18n('ERROR_BANNING_EMAIL')}</Message>;
return (
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="admin-panel-ban-users__form-message"
type="error">
{i18n('ERROR_BANNING_EMAIL')}
</Message>
);
default:
return null;
}
@ -119,10 +147,11 @@ class AdminPanelBanUsers extends React.Component {
}
}).then(() => {
this.setState({
addBanStatus: 'success'
addBanStatus: 'success',
showMessage: true
});
this.retrieveEmails();
}).catch(() => this.setState({addBanStatus: 'fail', loadingForm: false}));
}).catch(() => this.setState({addBanStatus: 'fail', loadingForm: false, showMessage: true}));
}
onUnBanClick(email) {
@ -150,10 +179,17 @@ class AdminPanelBanUsers extends React.Component {
filteredEmails: result.data
})).catch(() => this.setState({
listError: true,
showListErrorMessage: true,
loadingList: false,
loadingForm: false
}));
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default AdminPanelBanUsers;

View File

@ -26,14 +26,11 @@ class AdminPanelCustomFieldForm extends React.Component {
description: ""
},
addFormOptions: [],
showErrorMessage: true
};
render() {
const {
loading,
addForm,
error
} = this.state;
const { loading, addForm, error } = this.state;
return (
<div className="admin-panel-custom-field-form">
@ -62,9 +59,11 @@ class AdminPanelCustomFieldForm extends React.Component {
}
renderErrorMessage() {
const { error, showErrorMessage } = this.state;
return (
<Message type="error">
{this.state.error}
<Message showMessage={showErrorMessage} onCloseMessage={this.onCloseMessage.bind(this, "showErrorMessage")} type="error">
{error}
</Message>
);
}
@ -88,6 +87,12 @@ class AdminPanelCustomFieldForm extends React.Component {
);
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
onAddOptionClick(event) {
event.preventDefault();
let addFormOptions = _.clone(this.state.addFormOptions);
@ -130,7 +135,7 @@ class AdminPanelCustomFieldForm extends React.Component {
this.setState({loading: false, message: null});
if(this.props.onChange) this.props.onChange();
})
.catch(result => this.setState({loading: false, error: result.message}));
.catch(result => this.setState({loading: false, error: result.message, showErrorMessage: true}));
}
}

View File

@ -28,7 +28,8 @@ class AdminPanelListUsers extends React.Component {
users: [],
usersParams: DEFAULT_USERS_PARAMS,
error: false,
pages: 1
pages: 1,
showMessage: true
};
componentDidMount() {
@ -39,16 +40,28 @@ class AdminPanelListUsers extends React.Component {
return (
<div className="admin-panel-list-users">
<Header title={i18n('LIST_USERS')} description={i18n('LIST_USERS_DESCRIPTION')} />
{(this.state.error) ? <Message type="error">{i18n('ERROR_RETRIEVING_USERS')}</Message> : this.renderTableAndInviteButton()}
{(this.state.error) ? <Message showCloseButton={false} type="error">{i18n('ERROR_RETRIEVING_USERS')}</Message> : this.renderTableAndInviteButton()}
</div>
);
}
renderTableAndInviteButton() {
const { message, showMessage } = this.state;
return (
<div>
<SearchBox className="admin-panel-list-users__search-box" placeholder={i18n('SEARCH_USERS')} onSearch={this.onSearch.bind(this)} />
{this.state.message === 'success' ? <Message className="admin-panel-list-users__success-message" type="success">{i18n('INVITE_USER_SUCCESS')}</Message> : null}
{
(message === 'success') ?
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="admin-panel-list-users__success-message"
type="success">
{i18n('INVITE_USER_SUCCESS')}
</Message> :
null
}
<Table {...this.getTableProps()} />
<div style={{textAlign: 'right', marginTop: 10}}>
<Button onClick={this.onInviteUser.bind(this)} type="secondary" size="medium">
@ -214,7 +227,8 @@ class AdminPanelListUsers extends React.Component {
onChangeMessage(message) {
this.setState({
message
message,
showMessage: true
});
}
@ -247,6 +261,12 @@ class AdminPanelListUsers extends React.Component {
loading: false
});
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default connect((store) => {

View File

@ -13,7 +13,6 @@ import Button from 'core-components/button';
import Message from 'core-components/message';
import InfoTooltip from 'core-components/info-tooltip';
import Autocomplete from 'core-components/autocomplete';
import Tooltip from '../../../../core-components/tooltip';
const INITIAL_API_VALUE = {
page: 1,
@ -32,7 +31,8 @@ class AdminPanelViewUser extends React.Component {
loading: true,
disabled: false,
userList: [],
message: ''
message: '',
showMessage: true
};
componentDidMount() {
@ -52,7 +52,7 @@ class AdminPanelViewUser extends React.Component {
renderInvalid() {
return (
<div className="admin-panel-view-user__invalid">
<Message type="error">{i18n('INVALID_USER')}</Message>
<Message showCloseButton={false} type="error">{i18n('INVALID_USER')}</Message>
</div>
);
}
@ -123,22 +123,32 @@ class AdminPanelViewUser extends React.Component {
}
renderSupervisedUserMessage(){
const { message } = this.state;
const { message, showMessage } = this.state;
if(message) {
if(message != 'success') {
if(message !== 'success') {
return (
<div className="admin-panel-view-user__supervised-users-message">
<Message type="error">{i18n(message)}</Message>
</div>
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="admin-panel-view-user__supervised-users-message"
type="error">
{i18n(message)}
</Message>
);
} else {
return (
<div className= "admin-panel-view-user__supervised-users-message">
<Message type="success">{i18n('SUPERVISED_USERS_UPDATED')}</Message>
</div>
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="admin-panel-view-user__supervised-users-message"
type="success">
{i18n('SUPERVISED_USERS_UPDATED')}
</Message>
);
}
} else {
return null;
}
}
@ -160,12 +170,14 @@ class AdminPanelViewUser extends React.Component {
}).then(r => {
this.setState({
loading: false,
message: 'success'
message: 'success',
showMessage: true
})
}).catch((r) => {
this.setState({
loading: false,
message: r.message
message: r.message,
showMessage: true
})
});
}
@ -372,6 +384,12 @@ class AdminPanelViewUser extends React.Component {
});
});
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default connect((store) => {

View File

@ -30,7 +30,8 @@ class InviteUserWidget extends React.Component {
this.state = {
loading: false,
email: null,
customFields: null
customFields: null,
showMessage: true
};
}
@ -106,11 +107,29 @@ class InviteUserWidget extends React.Component {
}
renderMessage() {
switch (this.state.message) {
case 'success':
return <Message className="invite-user-widget__success-message" type="success">{i18n('INVITE_USER_SUCCESS')}</Message>;
const { message, showMessage } = this.state;
switch (message) {
case 'success': // TODO Remove this message case
return (
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="invite-user-widget__success-message"
type="success">
{i18n('INVITE_USER_SUCCESS')}
</Message>
);
case 'fail':
return <Message className="invite-user-widget__error-message" type="error">{i18n('EMAIL_EXISTS')}</Message>;
return (
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="invite-user-widget__error-message"
type="error">
{i18n('EMAIL_EXISTS')}
</Message>
);
default:
return null;
}
@ -173,7 +192,8 @@ class InviteUserWidget extends React.Component {
this.setState({
loading: false,
message
message,
showMessage: true
});
onChangeMessage && onChangeMessage(message);
@ -186,11 +206,18 @@ class InviteUserWidget extends React.Component {
this.setState({
loading: false,
message
message,
showMessage: true
});
onChangeMessage && onChangeMessage(message);
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default InviteUserWidget;

View File

@ -19,7 +19,7 @@ class InstallCompleted extends React.Component {
render() {
return (
<div className="install-completed">
<Message title={i18n('INSTALLATION_COMPLETED_TITLE')} type="success">
<Message showCloseButton={false} title={i18n('INSTALLATION_COMPLETED_TITLE')} type="success">
{i18n('INSTALLATION_COMPLETED_DESCRIPTION')}
</Message>
</div>

View File

@ -17,6 +17,7 @@ class InstallStep3Database extends React.Component {
state = {
loading: false,
error: false,
showErrorMessage: true,
errorMessage: ''
};
@ -42,17 +43,19 @@ class InstallStep3Database extends React.Component {
}
renderMessage() {
let message = null;
const { error, errorMessage, showErrorMessage } = this.state;
if(this.state.error) {
message = (
<Message className="install-step-3__message" type="error">
{i18n('ERROR_UPDATING_SETTINGS')}: {this.state.errorMessage}
</Message>
);
}
return message;
return (
error ?
<Message
showMessage={showErrorMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showErrorMessage")}
className="install-step-3__message"
type="error">
{i18n('ERROR_UPDATING_SETTINGS')}: {errorMessage}
</Message> :
null
);
}
onPreviousClick(event) {
@ -72,10 +75,17 @@ class InstallStep3Database extends React.Component {
.catch(({message}) => this.setState({
loading: false,
error: true,
showErrorMessage: true,
errorMessage: message
}));
});
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default InstallStep3Database;

View File

@ -20,6 +20,7 @@ class InstallStep5Settings extends React.Component {
loading: false,
form: {},
error: false,
showErrorMessage: true,
errorMessage: ''
};
@ -65,17 +66,19 @@ class InstallStep5Settings extends React.Component {
}
renderMessage() {
let message = null;
const { error, errorMessage, showErrorMessage } = this.state;
if(this.state.error) {
message = (
<Message className="install-step-5__message" type="error">
{i18n('ERROR_UPDATING_SETTINGS')}: {this.state.errorMessage}
</Message>
);
}
return message;
return (
error ?
<Message
showMessage={showErrorMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showErrorMessage")}
className="install-step-5__message"
type="error">
{i18n('ERROR_UPDATING_SETTINGS')}: {errorMessage}
</Message> :
null
);
}
onTestSMTPClick(event) {
@ -125,10 +128,17 @@ class InstallStep5Settings extends React.Component {
.catch(({message}) => this.setState({
loading: false,
error: true,
showErrorMessage: true,
errorMessage: message
}));
});
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default connect((store) => {

View File

@ -15,6 +15,7 @@ class InstallStep6Admin extends React.Component {
state = {
loading: false,
error: false,
showErrorMessage: true,
errorMessage: ''
};
@ -36,17 +37,19 @@ class InstallStep6Admin extends React.Component {
}
renderMessage() {
let message = null;
const { error, errorMessage, showErrorMessage } = this.state;
if(this.state.error) {
message = (
<Message className="install-step-6_message" type="error">
{i18n('ERROR_UPDATING_SETTINGS')}: {this.state.errorMessage}
</Message>
);
}
return message;
return (
error ?
<Message
showMessage={showErrorMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showErrorMessage")}
className="install-step-6_message"
type="error">
{i18n('ERROR_UPDATING_SETTINGS')}: {errorMessage}
</Message> :
null
);
}
onSubmit(form) {
@ -61,10 +64,17 @@ class InstallStep6Admin extends React.Component {
.catch(({message}) => this.setState({
loading: false,
error: true,
showErrorMessage: true,
errorMessage: message
}));
});
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default InstallStep6Admin;
export default InstallStep6Admin;

View File

@ -44,7 +44,8 @@ class CreateTicketForm extends React.Component {
content: TextEditor.createEmpty(),
departmentIndex: getPublicDepartmentIndexFromDepartmentId(this.props.defaultDepartmentId, SessionStore.getDepartments()),
language: this.props.language
}
},
showMessage: true
};
render() {
@ -118,11 +119,31 @@ class CreateTicketForm extends React.Component {
}
renderMessage() {
switch (this.state.message) {
case 'success':
return this.props.userLogged ? <Message className="create-ticket-form__message" type="success">{i18n('TICKET_SENT')}</Message> : null;
const { message, showMessage } = this.state;
switch (message) {
case 'success': // TODO Remove this message case
return (
this.props.userLogged ?
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="create-ticket-form__message"
type="success">
{i18n('TICKET_SENT')}
</Message> :
null
);
case 'fail':
return <Message className="create-ticket-form__message" type="error">{i18n('TICKET_SENT_ERROR')}</Message>;
return (
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
className="create-ticket-form__message"
type="error">
{i18n('TICKET_SENT_ERROR')}
</Message>
);
default:
return null;
}
@ -169,6 +190,7 @@ class CreateTicketForm extends React.Component {
{
loading: false,
message,
showMessage: true,
form: !userLogged ?
{
...form,
@ -186,7 +208,14 @@ class CreateTicketForm extends React.Component {
onTicketFail() {
this.setState({
loading: false,
message: 'fail'
message: 'fail',
showMessage: true
});
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}

View File

@ -17,6 +17,10 @@ class DashboardCreateTicketPage extends React.Component {
userSystemEnabled: React.PropTypes.bool
};
state = {
showMessage: !!queryString.parse(window.location.search)["message"]
};
render() {
let Wrapper = 'div';
@ -27,11 +31,13 @@ class DashboardCreateTicketPage extends React.Component {
return (
<div className={this.getClass()}>
<Wrapper className="dashboard-create-ticket-page__container">
{queryString.parse(window.location.search)["message"] ?
<Message className="dashboard-create-ticket-page__message" type="success">
<Message // TODO Remove this message
showMessage={this.state.showMessage}
onCloseMessage={this.onCloseMessage.bind(this)}
className="dashboard-create-ticket-page__message"
type="success">
{i18n('TICKET_NUMBER_SENT')}
</Message> :
null}
</Message>
<div className={this.getCreateTicketFormClass()}>
<CreateTicketForm
userLogged={(this.props.location.pathname !== '/create-ticket')}
@ -64,6 +70,12 @@ class DashboardCreateTicketPage extends React.Component {
return classNames(classes);
}
onCloseMessage() {
this.setState({
showMessage: false
});
}
}
export default connect((store) => {

View File

@ -33,6 +33,8 @@ class DashboardEditProfilePage extends React.Component {
customFields: [],
customFieldsFrom: {},
loadingCustomFields: false,
showChangeEmailMessage: true,
showChangePasswordMessage: true
};
componentDidMount() {
@ -115,12 +117,7 @@ class DashboardEditProfilePage extends React.Component {
}
renderCustomField(customField, key) {
const {
type,
name,
description,
options
} = customField;
const { type, name, description, options } = customField;
if(type === 'text') {
return (
@ -140,22 +137,58 @@ class DashboardEditProfilePage extends React.Component {
}
renderMessageEmail() {
switch (this.state.messageEmail) {
const { messageEmail, showChangeEmailMessage } = this.state;
switch (messageEmail) {
case 'success':
return <Message className="edit-profile-page__message" type="success">{i18n('EMAIL_CHANGED')}</Message>;
return (
<Message
showMessage={showChangeEmailMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showChangeEmailMessage")}
className="edit-profile-page__message"
type="success">
{i18n('EMAIL_CHANGED')}
</Message>
);
case 'fail':
return <Message className="edit-profile-page__message" type="error">{i18n('EMAIL_EXISTS')}</Message>;
return (
<Message
showMessage={showChangeEmailMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showChangeEmailMessage")}
className="edit-profile-page__message"
type="error">
{i18n('EMAIL_EXISTS')}
</Message>
);
default:
return null;
}
}
renderMessagePass() {
switch (this.state.messagePass) {
const { messagePass, showChangePasswordMessage } = this.state;
switch (messagePass) {
case 'success':
return <Message className="edit-profile-page__message" type="success">{i18n('PASSWORD_CHANGED')}</Message>;
return (
<Message
showMessage={showChangePasswordMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showChangePasswordMessage")}
className="edit-profile-page__message"
type="success">
{i18n('PASSWORD_CHANGED')}
</Message>
);
case 'fail':
return <Message className="edit-profile-page__message" type="error">{i18n('OLD_PASSWORD_INCORRECT')}</Message>;
return (
<Message
showMessage={showChangePasswordMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showChangePasswordMessage")}
className="edit-profile-page__message"
type="error">
{i18n('OLD_PASSWORD_INCORRECT')}
</Message>
);
default:
return null;
}
@ -213,12 +246,14 @@ class DashboardEditProfilePage extends React.Component {
}).then(function () {
this.setState({
loadingEmail: false,
messageEmail: "success"
messageEmail: "success",
showChangeEmailMessage: true
});
}.bind(this)).catch(function (){
this.setState({
loadingEmail: false,
messageEmail: 'fail'
messageEmail: 'fail',
showChangeEmailMessage: true
})
}.bind(this));
}
@ -237,12 +272,14 @@ class DashboardEditProfilePage extends React.Component {
}).then(function () {
this.setState({
loadingPass: false,
messagePass: "success"
messagePass: "success",
showChangePasswordMessage: true
});
}.bind(this)).catch(function (){
this.setState({
loadingPass: false,
messagePass: 'fail'
messagePass: 'fail',
showChangePasswordMessage: true
})
}.bind(this));
}
@ -277,6 +314,12 @@ class DashboardEditProfilePage extends React.Component {
});
});
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default connect((store) => {

View File

@ -33,7 +33,8 @@ class DashboardListTicketsPage extends React.Component {
ownTickets: true
},
message: '',
loading: false
loading: false,
showMessage: true
};
componentDidMount() {
@ -43,7 +44,7 @@ class DashboardListTicketsPage extends React.Component {
render() {
const { userUsers } = this.props;
const { loading, page, pages, tickets, message } = this.state;
const { loading, page, pages, tickets, message, showMessage } = this.state;
return (
<div className="dashboard-ticket-list">
@ -56,7 +57,16 @@ class DashboardListTicketsPage extends React.Component {
pages={pages}
tickets={tickets}
type={userUsers.length ? "secondary" : "primary"} />
{message ? <Message type="error" >{i18n(message)}</Message> : null}
{
message ?
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
type="error">
{i18n(message)}
</Message> :
null
}
</div>
);
}
@ -122,11 +132,18 @@ class DashboardListTicketsPage extends React.Component {
this.setState({
tickets: [],
message: r.message,
showMessage: true,
loading: false
})
});
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}

View File

@ -16,6 +16,7 @@ class DashboardTicketPage extends React.Component {
state = {
error: null,
ticket: null,
showErrorMessage: true
};
componentDidMount() {
@ -23,7 +24,7 @@ class DashboardTicketPage extends React.Component {
}
render() {
const {ticket, error} = this.state;
const { ticket, error } = this.state;
return (
<div className="dashboard-ticket-page">
@ -33,11 +34,11 @@ class DashboardTicketPage extends React.Component {
}
renderContent() {
const {ticket, error} = this.state;
const { ticket, error, showErrorMessage } = this.state;
if(error) {
return (
<Message type="error">
<Message showMessage={showErrorMessage} onCloseMessage={this.onCloseMessage.bind(this, "showErrorMessage")} type="error">
{i18n(error)}
</Message>
);
@ -71,12 +72,18 @@ class DashboardTicketPage extends React.Component {
});
}
})
.catch(result => this.setState({error: result.message}));
.catch(result => this.setState({error: result.message, showErrorMessage: true}));
}
retrieveUserData() {
store.dispatch(SessionActions.getUserData());
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default DashboardTicketPage;

View File

@ -37,11 +37,14 @@ class MainHomePageLoginWidget extends React.Component {
loadingRecover: false,
reSendEMailVerificationLoading: false,
reSendEmailVerificationStep: UNVERIFIED_USER_STEP,
reSendEmailVerificationMessage: ""
reSendEmailVerificationMessage: "",
showRecoverSentMessage: true,
showReSendEmailVerificationMessage: true
};
componentDidUpdate(prevProps) {
if (!prevProps.session.failed && this.props.session.failed) {
this.setState({showReSendEmailVerificationMessage : true});
this.refs.loginForm.refs.password.focus();
}
}
@ -88,31 +91,43 @@ class MainHomePageLoginWidget extends React.Component {
}
renderReSendEmailVerificationSection() {
const { reSendEmailVerificationMessage,reSendEmailVerificationStep, showReSendEmailVerificationMessage } = this.state;
if(this.props.session.failMessage === 'UNVERIFIED_USER') {
switch (this.state.reSendEmailVerificationStep) {
switch (reSendEmailVerificationStep) {
case UNVERIFIED_USER_STEP:
return (
<Button className="login-widget__resend-verification-token" type="link" onClick={this.onReSendEmailVerificationClick.bind(this)}>
{i18n('RESEND_EMAIL_VERIFICATION')}
</Button>
)
);
case LOADING_STEP:
return <Loading className="login-widget__loading" />
return <Loading className="login-widget__loading" />;
case REQUEST_RESULT_STEP:
return (
(this.state.reSendEmailVerificationMessage === "success") ?
<Message className="login-widget__resend-email-verification-success" type="success" leftAligned>
{i18n('RESEND_EMAIL_VERIFICATION_SUCCESS')}
(reSendEmailVerificationMessage === "success") ?
<Message
showMessage={showReSendEmailVerificationMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showReSendEmailVerificationMessage")}
className="login-widget__resend-email-verification-success"
type="success"
leftAligned>
{i18n('RESEND_EMAIL_VERIFICATION_SUCCESS')}
</Message> :
<Message className="login-widget__resend-email-verification-fail" type="error" leftAligned>
{i18n('RESEND_EMAIL_VERIFICATION_FAIL')}
<Message
showMessage={showReSendEmailVerificationMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showReSendEmailVerificationMessage")}
className="login-widget__resend-email-verification-fail"
type="error"
leftAligned>
{i18n('RESEND_EMAIL_VERIFICATION_FAIL')}
</Message>
)
);
}
} else {
return null
return null;
}
}
@ -123,17 +138,20 @@ class MainHomePageLoginWidget extends React.Component {
}
renderRecoverStatus() {
let status = null;
const { recoverSent, showRecoverSentMessage} = this.state;
if (this.state.recoverSent) {
status = (
<Message className="login-widget__message" type="info" leftAligned>
{i18n('RECOVER_SENT')}
</Message>
);
}
return status;
return (
recoverSent ?
<Message
showMessage={showRecoverSentMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showRecoverSentMessage")}
className="login-widget__message"
type="info"
leftAligned>
{i18n('RECOVER_SENT')}
</Message> :
null
);
}
getLoginFormProps() {
@ -221,7 +239,8 @@ class MainHomePageLoginWidget extends React.Component {
onRecoverPasswordSent() {
this.setState({
loadingRecover: false,
recoverSent: true
recoverSent: true,
showRecoverSentMessage: true
});
}
@ -256,6 +275,12 @@ class MainHomePageLoginWidget extends React.Component {
})
});
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}

View File

@ -15,19 +15,20 @@ class MainHomePagePortal extends React.Component {
type: React.PropTypes.oneOf(['default', 'complete'])
};
state = {
showMessage: !!queryString.parse(window.location.search)["message"]
};
render() {
const currentSearchParams = queryString.parse(window.location.search) || {};
return (
<div className="">
{
currentSearchParams["message"] ?
<Message className="dashboard-create-ticket-page__message" type="success">
{i18n('TICKET_NUMBER_SENT')}
</Message> :
null
}
<div className="main-home-page-portal__message">
<Message
showMessage={this.state.showMessage}
onCloseMessage={this.onCloseMessage.bind(this)}
className="dashboard-create-ticket-page__message"
type="success">
{i18n('TICKET_NUMBER_SENT')}
</Message>
<Widget className={classNames('main-home-page-portal', this.props.className)}>
<div className="main-home-page-portal__title">
<Header title={this.props.title || i18n('SUPPORT_CENTER')} description={i18n('SUPPORT_CENTER_DESCRIPTION')} />
@ -89,6 +90,12 @@ class MainHomePagePortal extends React.Component {
onButtonClick: () => history.push('/check-ticket')
};
}
onCloseMessage() {
this.setState({
showMessage: false
});
}
}
export default connect((store) => {

View File

@ -9,12 +9,19 @@ import MainHomePagePortal from 'app/main/main-home/main-home-page-portal';
import Message from 'core-components/message';
class MainHomePage extends React.Component {
state = {
showMessage: true
}
componentDidUpdate(prevProps) {
if (!prevProps.session && this.props.session) {
this.setState({showMessage : true});
}
}
render() {
const {
config,
loginForm
} = this.props;
const { config, loginForm } = this.props;
return (
<div className="main-home-page row">
{this.renderMessage()}
@ -50,16 +57,26 @@ class MainHomePage extends React.Component {
renderSuccess() {
return (
<Message title={i18n('VERIFY_SUCCESS')} type="success" className="main-home-page__message">
{i18n('VERIFY_SUCCESS_DESCRIPTION')}
<Message
showMessage={this.state.showMessage}
onCloseMessage={this.onCloseMessage.bind(this)}
title={i18n('VERIFY_SUCCESS')}
type="success"
className="main-home-page__message">
{i18n('VERIFY_SUCCESS_DESCRIPTION')}
</Message>
);
}
renderFailed() {
return (
<Message title={i18n('VERIFY_FAILED')} type="error" className="main-home-page__message">
{i18n('VERIFY_FAILED_DESCRIPTION')}
<Message
showMessage={this.state.showMessage}
onCloseMessage={this.onCloseMessage.bind(this)}
title={i18n('VERIFY_FAILED')}
type="error"
className="main-home-page__message">
{i18n('VERIFY_FAILED_DESCRIPTION')}
</Message>
);
}
@ -85,6 +102,12 @@ class MainHomePage extends React.Component {
return classNames(classes);
}
onCloseMessage() {
this.setState({
showMessage: false
});
}
}
export default connect((store) => {

View File

@ -23,7 +23,8 @@ class MainRecoverPasswordPage extends React.Component {
this.state = {
recoverStatus: 'waiting',
loading: false
loading: false,
showMessage: true
}
}
@ -47,11 +48,27 @@ class MainRecoverPasswordPage extends React.Component {
}
renderRecoverStatus() {
switch (this.state.recoverStatus) {
const { recoverStatus, showMessage } = this.state;
switch (recoverStatus) {
case 'valid':
return <Message type="success">{i18n('VALID_RECOVER')}</Message>;
return (
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
type="success">
{i18n('VALID_RECOVER')}
</Message>
);
case 'invalid':
return <Message type="error">{i18n('INVALID_RECOVER')}</Message>;
return (
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
type="error">
{i18n('INVALID_RECOVER')}
</Message>
);
case 'waiting':
return null;
}
@ -78,6 +95,7 @@ class MainRecoverPasswordPage extends React.Component {
setTimeout(() => {history.push((response.data.staff*1) ? '/admin' : '/')}, 2000);
this.setState({
recoverStatus: 'valid',
showMessage: true,
loading: false
});
}
@ -85,9 +103,16 @@ class MainRecoverPasswordPage extends React.Component {
onPasswordRecoverFail() {
this.setState({
recoverStatus: 'invalid',
showMessage: true,
loading: false
});
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}
export default MainRecoverPasswordPage;

View File

@ -26,7 +26,9 @@ class MainSignUpWidget extends React.Component {
this.state = {
loading: false,
email: null,
customFields: null
customFields: null,
showMessage: true,
message: null
};
}
@ -89,11 +91,27 @@ class MainSignUpWidget extends React.Component {
}
renderMessage() {
switch (this.state.message) {
const { message, showMessage } = this.state;
switch (message) {
case 'success':
return <Message type="success">{i18n('SIGNUP_SUCCESS')}</Message>;
return (
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
type="success">
{i18n('SIGNUP_SUCCESS')}
</Message>
);
case 'fail':
return <Message type="error">{i18n('EMAIL_EXISTS')}</Message>;
return (
<Message
showMessage={showMessage}
onCloseMessage={this.onCloseMessage.bind(this, "showMessage")}
type="error">
{i18n('EMAIL_EXISTS')}
</Message>
);
default:
return null;
}
@ -153,7 +171,8 @@ class MainSignUpWidget extends React.Component {
onSignupSuccess() {
this.setState({
loading: false,
message: 'success'
message: 'success',
showMessage: true
}, () => {
setTimeout(() => {history.push('/')}, 2000);
});
@ -162,7 +181,14 @@ class MainSignUpWidget extends React.Component {
onSignupFail() {
this.setState({
loading: false,
message: 'fail'
message: 'fail',
showMessage: true
});
}
onCloseMessage(showMessage) {
this.setState({
[showMessage]: false
});
}
}

View File

@ -10,30 +10,24 @@ class Message extends React.Component {
title: React.PropTypes.string,
children: React.PropTypes.node,
leftAligned: React.PropTypes.bool,
onCloseMessage: React.PropTypes.func,
type: React.PropTypes.oneOf(['success', 'error', 'info', 'warning'])
};
static defaultProps = {
type: 'info',
leftAligned: false,
showCloseButton: true
};
state = {
showCloseButton: true,
showMessage: true
}
componentWillReceiveProps() {
this.setState({
showMessage: true
})
}
};
render() {
return (
<Motion {...this.getAnimationProps()}>
{this.renderMessage.bind(this)}
</Motion>
this.props.showMessage ?
<Motion {...this.getAnimationProps()}>
{this.renderMessage.bind(this)}
</Motion> :
null
);
}
@ -49,7 +43,7 @@ class Message extends React.Component {
}
renderMessage(style) {
return this.state.showMessage ? this.renderMessageContent(style) : null
return this.renderMessageContent(style);
}
renderMessageContent(style) {
@ -100,11 +94,17 @@ class Message extends React.Component {
renderCloseButton() {
return (
<span className="message__close-icon" onClick={() => this.setState({showMessage: false})}>
<span className="message__close-icon" onClick={this.onCloseMessage.bind(this)}>
<Icon name="times" size="1x"/>
</span>
);
}
onCloseMessage() {
const { onCloseMessage } = this.props
onCloseMessage && onCloseMessage();
}
}
export default Message;

View File

@ -102,7 +102,6 @@ class EditSettingsController extends Controller {
}
public function checkDefaultDepartmentValid() {
$departmentId = Controller::request('default-department-id');
if($departmentId){