enable user login #22
Conversation
| @@ -0,0 +1,59 @@ | |||
| import React, { useState, useEffect } from 'react' | |||
| import {redirectTo, getCookieValue, setCookie} from '../utils' | |||
There was a problem hiding this comment.
Please consider using an existing library to manage cookies. For example js-cookie which allows you to .set, .get, .remove and other methods that also allows you to set other attributes.
| import {redirectTo, getCookieValue, setCookie} from '../utils' | ||
| import * as styles from '../index.module.sass' | ||
| | ||
| const HOME = 'http://localhost:8000' |
There was a problem hiding this comment.
Please use environment variables with self-descriptive names. For example: URL_HOME and URL_OAUTH_LOGIN.
| const HOME = 'http://localhost:8000' | ||
| const SERVER_OUTH_LOGIN = 'http://localhost:3000/oauth/login' | ||
| | ||
| const resetUserCookies = () => { |
There was a problem hiding this comment.
Please move this function to the utils.js file and pass the cookies to delete as an argument. For example:
const deleteCookies = (cookiesToDelete: string[]): void => { ... }| }) | ||
| } | ||
| | ||
| interface user { |
There was a problem hiding this comment.
Please use names in PascaCase format for TypeScript interfaces, type, enums, etc. For example: User
| } | ||
| | ||
| const Login = () => { | ||
| const [user, setUser] = useState<user | undefined>(undefined) |
There was a problem hiding this comment.
There is no need to pass undefined as argument since it's the default value for a the useState hook.
| | ||
| useEffect(() => { | ||
| const userCookie = getCookieValue('user') | ||
| if(userCookie) { |
There was a problem hiding this comment.
nit: you can use a breaker instead:
... if (!userCookie) return ...| } | ||
| } , []) | ||
| | ||
| const onLogoutClick = () => { |
There was a problem hiding this comment.
Please use the useCallback hook to wrap this function.
| redirectTo(HOME) | ||
| } | ||
| | ||
| const onLoginClick = () => { |
There was a problem hiding this comment.
Same here about using useCallback.
| ) | ||
| } | ||
| | ||
| export default Login No newline at end of file |
There was a problem hiding this comment.
I would strongly recommend using a named export instead of the default one.
| @@ -0,0 +1,14 @@ | |||
| export const redirectTo = (url: string) => (window.location.href = url) | |||
| | |||
| export const getCookieValue = (name: string): string|undefined => ( | |||
There was a problem hiding this comment.
Please remove this cookie helpers after using a js library to manage cookies.
2 participants
Add user login