diff --git a/web/src/components/Navbar.vue b/web/src/components/Navbar.vue index 8d3e16d..c45209e 100644 --- a/web/src/components/Navbar.vue +++ b/web/src/components/Navbar.vue @@ -7,7 +7,7 @@ - Example + About @@ -16,10 +16,18 @@ - Profile - Sign Out +
+ Profile + Sign Out +
+
+ Sign Up + Sign In +
+
@@ -29,7 +37,13 @@ \ No newline at end of file diff --git a/web/src/components/SigninForm.vue b/web/src/components/SigninForm.vue index bcbcb23..2cacbc9 100644 --- a/web/src/components/SigninForm.vue +++ b/web/src/components/SigninForm.vue @@ -53,7 +53,7 @@ } }, methods: { - ...mapMutations(['setToken', 'setUsername']), + ...mapMutations(['setToken', 'setUser']), signin() { this.error = false @@ -65,7 +65,7 @@ }) .then(response => { this.setToken({token: response.data.token}) - this.setUsername({username: this.form.username}) + this.setUser({username: this.form.username}) }) .catch(error => { console.log(error) diff --git a/web/src/store/mutations.js b/web/src/store/mutations.js index 166d7d7..e9c38e7 100644 --- a/web/src/store/mutations.js +++ b/web/src/store/mutations.js @@ -1,4 +1,5 @@ import {setToken, clearToken} from '@/jwt' +import {setUser, clearUser} from '@/user' export default { setToken: (state, {token}) => { @@ -9,7 +10,12 @@ export default { state.token = null clearToken() }, - setUsername: (state, {username}) => { - state.username = username + setUser: (state, {username}) => { + state.user = {username} + setUser(username) + }, + clearUser: state => { + state.user = null + clearUser() } } \ No newline at end of file diff --git a/web/src/store/state.js b/web/src/store/state.js index 462e926..373079c 100644 --- a/web/src/store/state.js +++ b/web/src/store/state.js @@ -1,6 +1,7 @@ import {getToken} from '@/jwt' +import {getUser} from '@/user' export default { token: getToken(), - username: null + user: getUser() } \ No newline at end of file diff --git a/web/src/user/index.js b/web/src/user/index.js new file mode 100644 index 0000000..7ed58f2 --- /dev/null +++ b/web/src/user/index.js @@ -0,0 +1,19 @@ +export function setUser(username) { + const user = JSON.stringify({ + username + }) + localStorage.setItem('user', user) +} + +// should only be run at initialization, use VueX store after +export function getUser() { + const userJson = localStorage.getItem('user') + if(!userJson) return null + return JSON.parse(userJson) +} + +export function clearUser() { + localStorage.removeItem('user') +} + +export default {setUser, getUser, clearUser} \ No newline at end of file