From 1f646377c35b65b97d6eeebb1e88f6d8307e1ef0 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Mon, 29 Jun 2020 23:59:15 +0300 Subject: feat!: create useAuth hook --- src/hooks/useAuth.tsx | 75 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 75 insertions(+) create mode 100644 src/hooks/useAuth.tsx (limited to 'src/hooks/useAuth.tsx') diff --git a/src/hooks/useAuth.tsx b/src/hooks/useAuth.tsx new file mode 100644 index 0000000..4f76593 --- /dev/null +++ b/src/hooks/useAuth.tsx @@ -0,0 +1,75 @@ +import React, { useState, useEffect, useContext, createContext } from 'react'; +import { User } from 'which-types'; +import { post, get } from '../requests'; + + +interface ContextType { + user: User | null, + setUser: (user: User) => void; + login: (username: string, password: string, remember?: boolean) => Promise; + logout: () => void; + isAuthenticated: () => boolean; +} + +const authContext = createContext({ + user: null, + setUser: () => {}, + login: async () => false, + logout: () => {}, + isAuthenticated: () => false +}); + +const useProvideAuth = () => { + const [user, setUser] = useState(null); + + const login = (username: string, password: string, remember = true): Promise => { + return post('/authentication', { + strategy: 'local', + username, + password + }).then(response => { + const me = response.data.user; + const token = response.data.accessToken; + setUser(me); + // navigate('profile', me._id); + localStorage.setItem('userId', me._id); + localStorage.setItem('token', token); + if (!remember) localStorage.setItem('shouldClear', 'true'); + return true; + }).catch(() => false); + }; + + const logout = () => { + setUser(null); + localStorage.removeItem('userId'); + localStorage.removeItem('token'); + // navigate('auth'); + }; + + const isAuthenticated = () => Boolean(user); + + useEffect(() => { + if (localStorage.getItem('shouldClear')) { + localStorage.clear(); + } + const userId = localStorage.getItem('userId'); + if (userId) { + get(`/users/${userId}`).then(response => { + setUser(response.data); + }); + } + }, []); + + return { user, setUser, login, logout, isAuthenticated }; +}; + +export const AuthProvider: React.FC = ({ children }) => { + const auth = useProvideAuth(); + const { Provider } = authContext; + return {children} +}; + +export const useAuth = () => { + return useContext(authContext); +} + -- cgit v1.2.3 From 5ccb1ec0be71ed4efb22b4942d70d9132415f69e Mon Sep 17 00:00:00 2001 From: eug-vs Date: Tue, 30 Jun 2020 00:43:48 +0300 Subject: style: fix some eslint errors --- src/hooks/useAuth.tsx | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) (limited to 'src/hooks/useAuth.tsx') diff --git a/src/hooks/useAuth.tsx b/src/hooks/useAuth.tsx index 4f76593..00d0c7c 100644 --- a/src/hooks/useAuth.tsx +++ b/src/hooks/useAuth.tsx @@ -1,4 +1,6 @@ -import React, { useState, useEffect, useContext, createContext } from 'react'; +import React, { + useState, useEffect, useContext, createContext +} from 'react'; import { User } from 'which-types'; import { post, get } from '../requests'; @@ -60,16 +62,18 @@ const useProvideAuth = () => { } }, []); - return { user, setUser, login, logout, isAuthenticated }; + return { + user, setUser, login, logout, isAuthenticated + }; }; export const AuthProvider: React.FC = ({ children }) => { const auth = useProvideAuth(); const { Provider } = authContext; - return {children} + return {children}; }; export const useAuth = () => { return useContext(authContext); -} +}; -- cgit v1.2.3 From b31ed66aafbe1d5dbe70d0cdfd70864204510d81 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Tue, 30 Jun 2020 01:27:39 +0300 Subject: fix: re-implement navigation logic --- src/hooks/useAuth.tsx | 2 -- 1 file changed, 2 deletions(-) (limited to 'src/hooks/useAuth.tsx') diff --git a/src/hooks/useAuth.tsx b/src/hooks/useAuth.tsx index 00d0c7c..de64c46 100644 --- a/src/hooks/useAuth.tsx +++ b/src/hooks/useAuth.tsx @@ -33,7 +33,6 @@ const useProvideAuth = () => { const me = response.data.user; const token = response.data.accessToken; setUser(me); - // navigate('profile', me._id); localStorage.setItem('userId', me._id); localStorage.setItem('token', token); if (!remember) localStorage.setItem('shouldClear', 'true'); @@ -45,7 +44,6 @@ const useProvideAuth = () => { setUser(null); localStorage.removeItem('userId'); localStorage.removeItem('token'); - // navigate('auth'); }; const isAuthenticated = () => Boolean(user); -- cgit v1.2.3 From e170d04d5d2c8c86d2683f3accb4feb2d94c881a Mon Sep 17 00:00:00 2001 From: eug-vs Date: Tue, 30 Jun 2020 01:34:51 +0300 Subject: style: fix linting errors --- src/hooks/useAuth.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src/hooks/useAuth.tsx') diff --git a/src/hooks/useAuth.tsx b/src/hooks/useAuth.tsx index de64c46..55e142c 100644 --- a/src/hooks/useAuth.tsx +++ b/src/hooks/useAuth.tsx @@ -24,7 +24,7 @@ const authContext = createContext({ const useProvideAuth = () => { const [user, setUser] = useState(null); - const login = (username: string, password: string, remember = true): Promise => { + const login: ContextType['login'] = (username, password, remember = true) => { return post('/authentication', { strategy: 'local', username, @@ -71,7 +71,7 @@ export const AuthProvider: React.FC = ({ children }) => { return {children}; }; -export const useAuth = () => { +export const useAuth = (): ContextType => { return useContext(authContext); }; -- cgit v1.2.3