diff --git a/src/components/login_form/login_form.js b/src/components/login_form/login_form.js
index 827c704c..bc801397 100644
--- a/src/components/login_form/login_form.js
+++ b/src/components/login_form/login_form.js
@@ -1,13 +1,21 @@
const LoginForm = {
data: () => ({
- user: {}
+ user: {},
+ authError: false
}),
computed: {
loggingIn () { return this.$store.state.users.loggingIn }
},
methods: {
submit () {
- this.$store.dispatch('loginUser', this.user)
+ this.$store.dispatch('loginUser', this.user).then(
+ () => { this.$router.push('/main/friends')},
+ (error) => {
+ this.authError = error
+ this.user.username = ''
+ this.user.password = ''
+ }
+ )
}
}
}
diff --git a/src/components/login_form/login_form.vue b/src/components/login_form/login_form.vue
index c0273bae..b2fa5341 100644
--- a/src/components/login_form/login_form.vue
+++ b/src/components/login_form/login_form.vue
@@ -17,6 +17,9 @@
+
@@ -39,6 +42,14 @@
margin-top: 1.0em;
min-height: 28px;
}
+
+ .error {
+ border-radius: 5px;
+ text-align: center;
+ background-color: rgba(255, 48, 16, 0.65);
+ min-height: 28px;
+ line-height: 28px;
+ }
}
diff --git a/src/modules/users.js b/src/modules/users.js
index 9367ec68..22e0133c 100644
--- a/src/modules/users.js
+++ b/src/modules/users.js
@@ -67,40 +67,52 @@ const users = {
})
},
loginUser (store, userCredentials) {
- const commit = store.commit
- commit('beginLogin')
- store.rootState.api.backendInteractor.verifyCredentials(userCredentials)
- .then((response) => {
- if (response.ok) {
- response.json()
- .then((user) => {
- user.credentials = userCredentials
- commit('setCurrentUser', user)
- commit('addNewUsers', [user])
+ return new Promise((resolve, reject) => {
+ const commit = store.commit
+ commit('beginLogin')
+ store.rootState.api.backendInteractor.verifyCredentials(userCredentials)
+ .then((response) => {
+ if (response.ok) {
+ response.json()
+ .then((user) => {
+ user.credentials = userCredentials
+ commit('setCurrentUser', user)
+ commit('addNewUsers', [user])
- // Set our new backend interactor
- commit('setBackendInteractor', backendInteractorService(userCredentials))
+ // Set our new backend interactor
+ commit('setBackendInteractor', backendInteractorService(userCredentials))
- // Start getting fresh tweets.
- store.dispatch('startFetching', 'friends')
+ // Start getting fresh tweets.
+ store.dispatch('startFetching', 'friends')
- // Get user mutes and follower info
- store.rootState.api.backendInteractor.fetchMutes().then((mutedUsers) => {
- each(mutedUsers, (user) => { user.muted = true })
- store.commit('addNewUsers', mutedUsers)
+ // Get user mutes and follower info
+ store.rootState.api.backendInteractor.fetchMutes().then((mutedUsers) => {
+ each(mutedUsers, (user) => { user.muted = true })
+ store.commit('addNewUsers', mutedUsers)
+ })
+
+ // Fetch our friends
+ store.rootState.api.backendInteractor.fetchFriends()
+ .then((friends) => commit('addNewUsers', friends))
})
-
- // Fetch our friends
- store.rootState.api.backendInteractor.fetchFriends()
- .then((friends) => commit('addNewUsers', friends))
- })
- }
- commit('endLogin')
- })
- .catch((error) => {
- console.log(error)
- commit('endLogin')
- })
+ } else {
+ // Authentication failed
+ commit('endLogin')
+ if (response.status === 401) {
+ reject('Wrong username or password')
+ } else {
+ reject('An error occurred, please try again')
+ }
+ }
+ commit('endLogin')
+ resolve()
+ })
+ .catch((error) => {
+ console.log(error)
+ commit('endLogin')
+ reject('Failed to connect to server, try again')
+ })
+ })
}
}
}