use localforage for storing data

This commit is contained in:
2018-06-08 21:06:43 +03:00
parent 846a42f616
commit 0d45a772fc
9 changed files with 54 additions and 26 deletions

View File

@@ -5239,6 +5239,11 @@
"resolved": "https://registry.npmjs.org/ignore/-/ignore-3.3.8.tgz",
"integrity": "sha1-P46cNdOHCKOn4Omrtsc+fudweys="
},
"immediate": {
"version": "3.0.6",
"resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz",
"integrity": "sha1-nbHb0Pr43m++D13V5Wu2BigN5ps="
},
"import-lazy": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/import-lazy/-/import-lazy-2.1.0.tgz",
@@ -6710,6 +6715,14 @@
"type-check": "~0.3.2"
}
},
"lie": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/lie/-/lie-3.1.1.tgz",
"integrity": "sha1-mkNrLMd0bKWd56QfpGmz77dr2H4=",
"requires": {
"immediate": "~3.0.5"
}
},
"load-json-file": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
@@ -6783,6 +6796,14 @@
"json5": "^0.5.0"
}
},
"localforage": {
"version": "1.7.1",
"resolved": "https://registry.npmjs.org/localforage/-/localforage-1.7.1.tgz",
"integrity": "sha1-5JJ+BCMCuGTbMPMhHxO1xvDell0=",
"requires": {
"lie": "3.1.1"
}
},
"locate-path": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",

View File

@@ -5,6 +5,7 @@
"dependencies": {
"@material-ui/core": "^1.1.0",
"@material-ui/icons": "^1.1.0",
"localforage": "^1.7.1",
"prop-types": "^15.6.1",
"react": "^16.4.0",
"react-dom": "^16.4.0",

View File

@@ -1,3 +1,4 @@
import localforage from 'localforage';
import { API_ROOT, getToken } from './util';
import { RECIEVE_TODOS } from './todos';
@@ -50,7 +51,7 @@ export function addList(name) {
const response = await fetch(`${API_ROOT}/lists`, {
body: JSON.stringify({ name }),
headers: {
Authorization: `Bearer ${getToken()}`,
Authorization: `Bearer ${await getToken()}`,
'content-type': 'application/json',
},
method: 'POST',
@@ -70,7 +71,7 @@ export function removeList() {
dispatch(invalidateLists());
const response = await fetch(`${API_ROOT}/lists/${list}`, {
headers: {
Authorization: `Bearer ${getToken()}`,
Authorization: `Bearer ${await getToken()}`,
'content-type': 'application/json',
},
method: 'DELETE',
@@ -95,7 +96,7 @@ export function editList(name) {
const response = await fetch(`${API_ROOT}/lists/${list}`, {
body: JSON.stringify({ name }),
headers: {
Authorization: `Bearer ${getToken()}`,
Authorization: `Bearer ${await getToken()}`,
'content-type': 'application/json',
},
method: 'PATCH',
@@ -126,7 +127,7 @@ export function fetchLists() {
dispatch(requestLists());
const response = await fetch(`${API_ROOT}/lists`, {
headers: {
Authorization: `Bearer ${getToken()}`,
Authorization: `Bearer ${await getToken()}`,
},
});
const json = await response.json();
@@ -148,7 +149,7 @@ export function fetchLists() {
if (lists.length !== 0) {
dispatch(changeList(listsObj[Object.keys(listsObj)[0]].id));
}
localStorage.setItem('lists', JSON.stringify(listsObj));
await localforage.setItem('lists', JSON.stringify(listsObj));
};
}
@@ -157,12 +158,12 @@ export function loadLists() {
dispatch(requestLists());
try {
const listsJson = localStorage.getTodo('lists');
const listsJson = await localforage.getTodo('lists');
const listsObj = JSON.parse(listsJson);
dispatch(recieveLists(listsObj));
dispatch(changeList(listsObj[Object.keys(listsObj)[0]].id));
} catch (e) {
localStorage.removeItem('lists');
await localforage.removeItem('lists');
}
dispatch(fetchLists());

View File

@@ -36,7 +36,7 @@ export function addTodo(text) {
const response = await fetch(`${API_ROOT}/lists/${list}/todos`, {
body: JSON.stringify({ text }),
headers: {
Authorization: `Bearer ${getToken()}`,
Authorization: `Bearer ${await getToken()}`,
'content-type': 'application/json',
},
method: 'POST',
@@ -54,7 +54,7 @@ export function removeTodo(id) {
dispatch(invalidateTodos());
const response = await fetch(`${API_ROOT}/todos/${id}`, {
headers: {
Authorization: `Bearer ${getToken()}`,
Authorization: `Bearer ${await getToken()}`,
'content-type': 'application/json',
},
method: 'DELETE',
@@ -76,7 +76,7 @@ export function toggleTodo(id) {
const response = await fetch(`${API_ROOT}/todos/${id}`, {
body: JSON.stringify({ completed }),
headers: {
Authorization: `Bearer ${getToken()}`,
Authorization: `Bearer ${await getToken()}`,
'content-type': 'application/json',
},
method: 'PATCH',
@@ -95,7 +95,7 @@ export function editTodo(id, text) {
const response = await fetch(`${API_ROOT}/todos/${id}`, {
body: JSON.stringify({ text }),
headers: {
Authorization: `Bearer ${getToken()}`,
Authorization: `Bearer ${await getToken()}`,
'content-type': 'application/json',
},
method: 'PATCH',
@@ -114,7 +114,7 @@ export function fetchTodos(list) {
dispatch({ type: REQUEST_TODOS, list });
const response = await fetch(`${API_ROOT}/todos`, {
headers: {
Authorization: `Bearer ${getToken()}`,
Authorization: `Bearer ${await getToken()}`,
},
});
const json = await response.json();

View File

@@ -1,3 +1,4 @@
import localforage from 'localforage';
import { API_ROOT, getToken } from './util';
import { loadLists } from './lists';
@@ -29,17 +30,17 @@ function validateUser() {
export function loadUser() {
return async dispatch => {
if (getToken()) {
if (await getToken()) {
const response = await fetch(`${API_ROOT}/users/user`, {
headers: {
Authorization: `Bearer ${getToken()}`,
Authorization: `Bearer ${await getToken()}`,
'content-type': 'application/json',
},
method: 'GET',
});
const json = await response.json();
if (json.success) {
localStorage.setItem('jwt', json.data.jwt);
await localforage.setItem('jwt', json.data.jwt);
dispatch(loginSuccess(json.data));
dispatch(loadLists());
} else {
@@ -63,7 +64,7 @@ export function login(user) {
});
const json = await response.json();
if (json.success) {
localStorage.setItem('jwt', json.data.jwt);
await localforage.setItem('jwt', json.data.jwt);
dispatch(loginSuccess(json.data));
dispatch(loadLists());
} else {
@@ -92,7 +93,7 @@ export function signup(user) {
});
const json = await response.json();
if (json.success) {
localStorage.setItem('jwt', json.data.jwt);
await await localforage.setItem('jwt', json.data.jwt);
dispatch(signupSuccess(json.data));
dispatch(loadLists());
} else {
@@ -106,8 +107,10 @@ export function reset() {
}
export function logout() {
localStorage.removeItem('jwt');
localStorage.removeItem('lists');
localStorage.removeItem('items');
return { type: LOGOUT };
return async dispatch => {
await localforage.removeItem('jwt');
await localforage.removeItem('lists');
await localforage.removeItem('items');
dispatch({ type: LOGOUT });
};
}

View File

@@ -1,5 +1,7 @@
import localforage from 'localforage';
export const API_ROOT = '/api';
export function getToken() {
return localStorage.getItem('jwt');
export async function getToken() {
return localforage.getItem('jwt');
}

View File

@@ -8,7 +8,7 @@
display: flex;
flex-direction: row;
flex-grow: 0;
max-width: 45%;
max-width: 40%;
}
.loading {

View File

@@ -51,7 +51,7 @@ function LoginForm({ handleSubmit, onLogin, user, history, resetUser }) {
type="password"
/>
<div id="submitbutton">
<Button variant="contained" color="primary" type="submit">
<Button variant="raised" color="primary" type="submit">
Login
</Button>
</div>

View File

@@ -66,7 +66,7 @@ function SignupForm({ handleSubmit, onSignup, user, history, resetUser }) {
type="password"
/>
<div id="submitbutton">
<Button variant="contained" color="primary" type="submit">
<Button variant="raised" color="primary" type="submit">
Signup
</Button>
</div>