From 65104aeb2ee6305e6773788497d8529ff3fc2f99 Mon Sep 17 00:00:00 2001 From: Juan Carlos Ruvalcaba Date: Mon, 26 Apr 2021 18:27:33 -0700 Subject: [PATCH] Updates: - Change retirieve data for user to localForage instead of localStorage - Fix retrieve theme data on start. -Fix user logout function. --- src/js/api/config.js | 18 ++++++---- src/js/app.js | 5 ++- src/js/stores/theme.js | 6 ++-- src/js/stores/user.js | 79 ++++++++++++++++++++++++++---------------- 4 files changed, 69 insertions(+), 39 deletions(-) diff --git a/src/js/api/config.js b/src/js/api/config.js index 2ff477b..723a020 100644 --- a/src/js/api/config.js +++ b/src/js/api/config.js @@ -1,14 +1,20 @@ -import url from './key'; +import { url, dbConfig } from './key'; import axios from 'axios'; +import * as localForage from "localforage"; const http = axios.create({ baseURL: `${url}`, }); -const token = localStorage.getItem('token') +localForage.config(dbConfig); -if (token) { - http.defaults.headers.common['Authorization'] = token; -} +async function checkToken (){ + let token = await localForage.getItem('token'); + if (token != null){ + http.defaults.headers.common['Authorization'] = token; + } +}; -export default http; \ No newline at end of file +checkToken(); + +export { http, localForage }; \ No newline at end of file diff --git a/src/js/app.js b/src/js/app.js index 3b02d9a..a8935e4 100644 --- a/src/js/app.js +++ b/src/js/app.js @@ -14,7 +14,7 @@ import cordovaApp from './cordova-app.js'; import routes from './routes.js'; // Import htpp (axios) instance -import http from './api/config.js'; +import { http } from './api/config.js'; // Import main app component import App from '../app.f7.html'; @@ -68,6 +68,9 @@ var app = new Framework7({ cordovaApp.init(f7); } + // Retrieve data for user on app start + user.dispatch('checkData').then(() =>{ }); + //Intercept axios call to determine if it gets (401 Unauthorized) response http.interceptors.response.use(undefined, function (err) { return new Promise(function (resolve, reject) { diff --git a/src/js/stores/theme.js b/src/js/stores/theme.js index 4ad9e13..b2307d2 100644 --- a/src/js/stores/theme.js +++ b/src/js/stores/theme.js @@ -1,6 +1,6 @@ import { createStore } from 'framework7'; import $ from 'dom7'; -import * as localForage from "localforage"; +import { localForage } from "./../api/config.js"; const theme = createStore({ state: { @@ -18,8 +18,8 @@ const theme = createStore({ dispatch('changeTheme', theme); }, async initTheme({state, dispatch}, selector){ - let items = await localForage.length(); - if (items > 0){ + let item = await localForage.getItem('theme'); + if (item != null){ await dispatch('checkTheme', selector); } }, diff --git a/src/js/stores/user.js b/src/js/stores/user.js index a866aca..96068a0 100644 --- a/src/js/stores/user.js +++ b/src/js/stores/user.js @@ -1,46 +1,67 @@ import { createStore } from 'framework7'; -import http from './../api/config.js'; +import { http, localForage } from './../api/config.js'; const user = createStore({ state: { - status: localStorage.getItem('token') ? 'success' : '', - token: localStorage.getItem('token') || '', + status: '', + token: '', user: {}, roles: [], }, actions: { - logIn({ state, dispatch }, data){ - return new Promise((resolve, reject) => { - dispatch('auth_request'); - http.post('/user/login', data).then(response => { - const token = response.data.token; - delete response.data.token; - const user = response.data.user; - const roles = [1, 4, 14]; //Owner, Customer, Seller, Deliverer//response.data.roles; - localStorage.setItem('token', token); - http.defaults.headers.common['Authorization'] = token; - dispatch('auth_success', {token, user, roles}); - resolve(response); - }) - .catch(err => { - dispatch('auth_error'); - localStorage.removeItem('token'); - reject(err); - }); - }); + async setBasicData({ dispatch }, { token, user, roles }){ + await localForage.setItem('user', user); + await localForage.setItem('token', token); + await localForage.setItem('roles', roles); + dispatch('auth_success', { token, user, roles }); }, - logOut({ state, dispatch }){ - return new Promise((resolve, reject) => { - dispatch('logout'); - localStorage.removeItem('token'); - delete http.defaults.headers.common['Authorization']; - resolve(); - }); + async getBasicData({ dispatch }){ + const result = { + user: await localForage.getItem('user'), + token: await localForage.getItem('token'), + roles: await localForage.getItem('roles'), + } + dispatch('auth_success', result); + }, + async clearBasicData(){ + await localForage.removeItem('user'); + await localForage.removeItem('token'); + await localForage.removeItem('roles'); + }, + async checkData({ dispatch }){ + let token = await localForage.getItem('token'); + if (token != null){ + await dispatch('getBasicData'); + } + }, + async logIn({ state, dispatch }, data){ + dispatch('auth_request'); + try { + const response = await http.post('/user/login', data); + const token = response.data.token; + delete response.data.token; + const user = response.data.user; + const roles = [1, 4, 14]; //Owner, Customer, Seller, Deliverer//response.data.roles; + http.defaults.headers.common['Authorization'] = token; + await dispatch('setBasicData', { token, user, roles }); + return response; + } catch (error) { + dispatch('auth_error'); + await clearBasicData(); + throw new error; + } + }, + async logOut({ state, dispatch }){ + dispatch('logout'); + await dispatch('clearBasicData'); + delete http.defaults.headers.common['Authorization']; }, //Mutations logout({ state }){ state.status = ''; state.token = ''; + state.user = {}; + state.roles = []; }, auth_request({ state }){ state.status = 'loading';