sliver/akkoma-fe
1
0
Fork 0
forked from AkkomaGang/akkoma-fe
Code Pull requests Activity

Show visual feedback on login error, redirect on success

Browse source
This commit is contained in:
wakarimasen 2017-03-08 18:28:41 +01:00
parent ccbfc64bfc
commit a6b6fe95c0
3 changed files with 53 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/components/login_form/login_form.js
View file

@ -1,13 +1,17 @@
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')},
() => { this.authError = true }
)
}
}
}

9
src/components/login_form/login_form.vue
View file

@ -17,6 +17,9 @@
<div class='form-group'>
<button :disabled="loggingIn" type='submit' class='btn btn-default base05 base01-background'>Submit</button>
</div>
<div v-if="authError" class='form-group'>
<button disabled='true' class='btn btn-default base05 error'>Error logging in, try again</button>
</div>
</form>
</div>
</div>
@ -39,6 +42,12 @@
margin-top: 1.0em;
min-height: 28px;
}
.error {
margin-top: 0em;
margin-bottom: 0em;
background-color: rgba(255, 48, 16, 0.65);
}
}
</style>

68
src/modules/users.js
View file

@ -65,40 +65,48 @@ 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')
reject()
}
commit('endLogin')
resolve()
})
.catch((error) => {
console.log(error)
commit('endLogin')
reject()
})
})
}
}
}