mirror of
https://bitbucket.org/wisemapping/wisemapping-frontend.git
synced 2024-11-10 17:33:24 +01:00
Add error message
This commit is contained in:
parent
c1e3deec76
commit
5aecc2ab91
File diff suppressed because one or more lines are too long
39
package-lock.json
generated
39
package-lock.json
generated
@ -5,7 +5,6 @@
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "wisemapping-reactp",
|
||||
"version": "0.1.0",
|
||||
"dependencies": {
|
||||
"@testing-library/jest-dom": "^5.11.6",
|
||||
@ -4741,7 +4740,8 @@
|
||||
"version": "1.5.1",
|
||||
"resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
|
||||
"integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==",
|
||||
"funding": [{
|
||||
"funding": [
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/feross"
|
||||
},
|
||||
@ -4978,7 +4978,8 @@
|
||||
"version": "5.2.1",
|
||||
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
|
||||
"integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
|
||||
"funding": [{
|
||||
"funding": [
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/feross"
|
||||
},
|
||||
@ -6848,10 +6849,12 @@
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.0.2.tgz",
|
||||
"integrity": "sha512-wFwTwCVebUrMgGeAwRL/NhZtHAUyT9n9yg4IMDwf10+6iCMxSkVq9MGCVEH+QZWo1nNidy8kNvwmv4zWHDTqvA==",
|
||||
"funding": [{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/fb55"
|
||||
}]
|
||||
"funding": [
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/fb55"
|
||||
}
|
||||
]
|
||||
},
|
||||
"node_modules/domain-browser": {
|
||||
"version": "1.2.0",
|
||||
@ -8677,10 +8680,12 @@
|
||||
"version": "1.13.0",
|
||||
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.13.0.tgz",
|
||||
"integrity": "sha512-aq6gF1BEKje4a9i9+5jimNFIpq4Q1WiwBToeRK5NvZBd/TRsmW8BsJfOEGkr76TbOyPVD3OVDN910EcUNtRYEA==",
|
||||
"funding": [{
|
||||
"type": "individual",
|
||||
"url": "https://github.com/sponsors/RubenVerborgh"
|
||||
}],
|
||||
"funding": [
|
||||
{
|
||||
"type": "individual",
|
||||
"url": "https://github.com/sponsors/RubenVerborgh"
|
||||
}
|
||||
],
|
||||
"engines": {
|
||||
"node": ">=4.0"
|
||||
}
|
||||
@ -9336,7 +9341,8 @@
|
||||
"version": "5.2.1",
|
||||
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
|
||||
"integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
|
||||
"funding": [{
|
||||
"funding": [
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/feross"
|
||||
},
|
||||
@ -9798,7 +9804,8 @@
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",
|
||||
"integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==",
|
||||
"funding": [{
|
||||
"funding": [
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/feross"
|
||||
},
|
||||
@ -17076,7 +17083,8 @@
|
||||
"version": "1.1.10",
|
||||
"resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.1.10.tgz",
|
||||
"integrity": "sha512-zb/1OuZ6flOlH6tQyMPUrE3x3Ulxjlo9WIVXR4yVYi4H9UXQaeIsPbLn2R3O3vQCnDKkAl2qHiuocKKX4Tz/Sw==",
|
||||
"funding": [{
|
||||
"funding": [
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/feross"
|
||||
},
|
||||
@ -18429,7 +18437,8 @@
|
||||
"version": "5.2.1",
|
||||
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
|
||||
"integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
|
||||
"funding": [{
|
||||
"funding": [
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/feross"
|
||||
},
|
||||
|
@ -20,6 +20,13 @@
|
||||
"extract": "formatjs extract",
|
||||
"compile": "formatjs compile"
|
||||
},
|
||||
"author": {
|
||||
"name": "Paulo Veiga",
|
||||
"email": "pveiga@wisemapping.com"
|
||||
},
|
||||
"contributors": [
|
||||
"Ezequiel Bergamaschi"
|
||||
],
|
||||
"eslintConfig": {
|
||||
"extends": [
|
||||
"react-app",
|
||||
@ -39,8 +46,8 @@
|
||||
]
|
||||
},
|
||||
"homepage": "http://localhost:8080/react/login/",
|
||||
"license": "https://wisemapping.atlassian.net/wiki/spaces/WS/pages/524357/WiseMapping+Public+License+Version+1.0+WPL",
|
||||
"devDependencies": {
|
||||
"@formatjs/cli": "^2.13.14"
|
||||
}
|
||||
|
||||
}
|
@ -1,3 +1,13 @@
|
||||
<!-- This is a temporal hack only with the purpose to allow the transition with Spring MVC-->
|
||||
<script>
|
||||
if (!loginErrorCode) {
|
||||
function loginErrorCode() {
|
||||
return 3;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
@ -6,8 +16,9 @@
|
||||
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta name="description" content="Web site created using create-react-app" />
|
||||
<meta name="description" content="WiseMappping" />
|
||||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/favicon.png" />
|
||||
|
||||
<!--
|
||||
manifest.json provides metadata used when your web app is installed on a
|
||||
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
|
||||
|
@ -22,15 +22,45 @@ class ConfigStatusMessage extends React.Component {
|
||||
}
|
||||
}
|
||||
|
||||
class LoginError extends React.Component {
|
||||
constructor(props) {
|
||||
super(props)
|
||||
this.state = {
|
||||
errorCode: props.errorCode
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
const errorCode = this.state.errorCode;
|
||||
let result;
|
||||
if (errorCode) {
|
||||
if (errorCode == 3) {
|
||||
result = (
|
||||
<div class='error'>
|
||||
<FormattedMessage id="USER_INACTIVE" defaultMessage="Sorry, your account has not been activated yet. You'll receive a notification email when it becomes active. Stay tuned!." />
|
||||
</div>)
|
||||
} else {
|
||||
result = (
|
||||
<div class='error'>
|
||||
<FormattedMessage id="LOGIN_ERROR" defaultMessage="The email address or password you entered is incorrect." />
|
||||
</div>)
|
||||
}
|
||||
}
|
||||
return (<span>{result}</span>);
|
||||
}
|
||||
}
|
||||
|
||||
class LoginForm extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
const errorCode = props.errorCode
|
||||
this.state = {
|
||||
email: '',
|
||||
password: '',
|
||||
staySignIn: false
|
||||
staySignIn: false,
|
||||
errorCode: errorCode
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
render() {
|
||||
@ -40,15 +70,16 @@ class LoginForm extends React.Component {
|
||||
<h1><FormattedMessage id="WELCOME" defaultMessage="Welcome" /></h1>
|
||||
<p><FormattedMessage id="LOG_INTO" defaultMessage="Log Into Your Account" /></p>
|
||||
|
||||
<LoginError errorCode={this.state.errorCode} />
|
||||
|
||||
<form action="/c/perform-login" method="POST">
|
||||
<input type="email" name="username" placeholder={intl.formatMessage({ id: "EMAIL", defaultMessage: 'Email' })} value={this.state.value} onChange={this.handleInputChange} required />
|
||||
<input type="password" name="password" placeholder={intl.formatMessage({ id: "PASSWORD", defaultMessage: 'Password' })} value={this.state.value} onChange={this.handleInputChange} required />
|
||||
|
||||
<div>
|
||||
<input name="_spring_security_remember_me" id="staySignIn" type="checkbox"/>
|
||||
<input name="_spring_security_remember_me" id="staySignIn" type="checkbox" />
|
||||
<label for="staySignIn"><FormattedMessage id="REMEMBER_ME" defaultMessage="Remember me" /></label>
|
||||
</div>
|
||||
|
||||
<input type="submit" value={intl.formatMessage({ id: "SING_IN", defaultMessage: 'Sign In' })} />
|
||||
</form>
|
||||
<a href="/c/user/resetPassword"><FormattedMessage id="FORGOT_PASSWORD" defaultMessage="Forgot Password ?" /></a>
|
||||
@ -70,9 +101,12 @@ class LoginPage extends React.Component {
|
||||
|
||||
const messages = props.messages;
|
||||
const locale = props.locale;
|
||||
const errorCode = props.errorCode
|
||||
|
||||
this.state = {
|
||||
locale: locale,
|
||||
message: messages
|
||||
message: messages,
|
||||
errorCode: errorCode
|
||||
};
|
||||
|
||||
intl = createIntl(
|
||||
@ -90,7 +124,7 @@ class LoginPage extends React.Component {
|
||||
<IntlProvider locale={this.state.locale} defaultLocale="en" messages={this.state.messages}>
|
||||
<div>
|
||||
<Header type='login' />
|
||||
<LoginForm />
|
||||
<LoginForm errorCode={this.state.errorCode} />
|
||||
{/* <ConfigStatusMessage enabled='true' /> */}
|
||||
<Footer />
|
||||
</div>
|
||||
|
@ -72,3 +72,13 @@ input[type=submit]:hover {
|
||||
padding: 15px 30px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.error {
|
||||
margin: 10px auto;
|
||||
width: 260px;
|
||||
font-size: 14px;
|
||||
background-color: #e97450;
|
||||
padding: 10px 10px;
|
||||
border-radius: 9px;
|
||||
color: white;
|
||||
}
|
11
src/index.js
11
src/index.js
@ -14,12 +14,17 @@ function loadLocaleData(locale) {
|
||||
}
|
||||
|
||||
async function bootstrapApplication(locale) {
|
||||
const messages = loadLocaleData(locale)
|
||||
const messages = loadLocaleData(locale);
|
||||
|
||||
// @Todo: how to share the state
|
||||
let errorCode = null;
|
||||
if(typeof loginErrorCode !== "undefined"){
|
||||
errorCode = eval("loginErrorCode");
|
||||
}
|
||||
|
||||
ReactDOM.render(
|
||||
<LoginPage locale={locale} messages={messages} />,
|
||||
<LoginPage locale={locale} messages={messages} errorCode={errorCode}/>,
|
||||
document.getElementById('root')
|
||||
)
|
||||
}
|
||||
// @Todo: Is this correct ?
|
||||
bootstrapApplication('en')
|
Loading…
Reference in New Issue
Block a user