vmario/wisemapping-frontend
1
0
Fork 0
mirror of https://bitbucket.org/wisemapping/wisemapping-frontend.git synced 2024-11-10 17:33:24 +01:00
Code Issues Packages Projects Releases Wiki Activity

Add error message

Browse Source
This commit is contained in:
Paulo Gustavo Veiga 2020-11-28 08:04:49 -08:00
parent c1e3deec76
commit 5aecc2ab91
7 changed files with 105 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.eslintcache
View File

File diff suppressed because one or more lines are too long

31
package-lock.json generated
View File

@ -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": [{
"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": [{
"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"
},

9
package.json
View File

@ -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"
}
}

13
public/index.html
View File

@ -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/

46
src/LoginPage.js
View File

@ -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>

10
src/css/login.css
View File

@ -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
View File

@ -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')