system-praktyk/system-praktyk-front
2
0
Fork 1
Code Issues Pull Requests Releases Wiki Activity

Persist user in session storage

Browse Source
This commit is contained in:
Kacper Donat 2020-07-18 16:53:48 +02:00
parent e9d0f6d348
commit f450a8dc4e
5 changed files with 60 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -16,6 +16,7 @@
"@types/react-redux": "^7.1.9", "@types/react-redux": "^7.1.9",
"@types/react-router-dom": "^5.1.5", "@types/react-router-dom": "^5.1.5",
"@types/redux": "^3.6.0", "@types/redux": "^3.6.0",
"@types/redux-persist": "^4.3.1",
"@typescript-eslint/eslint-plugin": "^2.10.0", "@typescript-eslint/eslint-plugin": "^2.10.0",
"@typescript-eslint/parser": "^2.10.0", "@typescript-eslint/parser": "^2.10.0",
"babel-core": "^6.26.3", "babel-core": "^6.26.3",
@ -47,6 +48,7 @@
"react-router-dom": "^5.2.0", "react-router-dom": "^5.2.0",
"redux": "^4.0.5", "redux": "^4.0.5",
"redux-devtools-extension": "^2.13.8", "redux-devtools-extension": "^2.13.8",
"redux-persist": "^6.0.0",
"sass-loader": "8.0.2", "sass-loader": "8.0.2",
"style-loader": "0.23.1", "style-loader": "0.23.1",
"ts-loader": "^7.0.5", "ts-loader": "^7.0.5",

59
src/app.tsx
View File

@ -7,7 +7,7 @@ import { BrowserRouter, Link, Route, Switch } from "react-router-dom"
import moment, { Moment } from "moment"; import moment, { Moment } from "moment";
import { route, routes } from "@/routing"; import { route, routes } from "@/routing";
import { Provider, useDispatch, useSelector } from "react-redux"; import { Provider, useDispatch, useSelector } from "react-redux";
import store from "@/state/store"; import store, { persistor } from "@/state/store";
import { AppState } from "@/state/reducer"; import { AppState } from "@/state/reducer";
import { StudentAction, StudentActions } from "@/state/actions/student"; import { StudentAction, StudentActions } from "@/state/actions/student";
import { sampleStudent } from "@/provider/dummy/student"; import { sampleStudent } from "@/provider/dummy/student";
@ -20,6 +20,7 @@ import '@/styles/overrides.scss'
import '@/styles/header.scss' import '@/styles/header.scss'
import classNames from "classnames"; import classNames from "classnames";
import { Button } from "@material-ui/core"; import { Button } from "@material-ui/core";
import { PersistGate } from 'redux-persist/integration/react';
moment.locale("pl") moment.locale("pl")
@ -80,33 +81,35 @@ const LanguageSwitcher = ({ className, ...props }: HTMLProps<HTMLUListElement>)
function App() { function App() {
return ( return (
<Provider store={ store }> <Provider store={ store }>
<StylesProvider injectFirst> <PersistGate loading={ null } persistor={ persistor }>
<MuiPickersUtilsProvider utils={ LocalizedMomentUtils } libInstance={ moment }> <StylesProvider injectFirst>
<ThemeProvider theme={ studentTheme }> <MuiPickersUtilsProvider utils={ LocalizedMomentUtils } libInstance={ moment }>
<BrowserRouter> <ThemeProvider theme={ studentTheme }>
<header className="header"> <BrowserRouter>
<div id="logo" className="header__logo"> <header className="header">
<Link to={ route('home') }> <div id="logo" className="header__logo">
<img src="img/pg-logotyp.svg"/> <Link to={ route('home') }>
</Link> <img src="img/pg-logotyp.svg"/>
</div> </Link>
<div className="header__nav"> </div>
<nav className="header__top"> <div className="header__nav">
<ul className="header__menu"></ul> <nav className="header__top">
<UserMenu className="header__user"/> <ul className="header__menu"></ul>
<div className="header__divider" /> <UserMenu className="header__user"/>
<LanguageSwitcher className="header__language-switcher"/> <div className="header__divider" />
</nav> <LanguageSwitcher className="header__language-switcher"/>
<nav className="header__bottom"> </nav>
<ul className="header__menu header__menu--main"></ul> <nav className="header__bottom">
</nav> <ul className="header__menu header__menu--main"></ul>
</div> </nav>
</header> </div>
<Switch>{ routes.map(({ name, content, ...route }) => <Route { ...route } key={ name }>{ content() }</Route>) }</Switch> </header>
</BrowserRouter> <Switch>{ routes.map(({ name, content, ...route }) => <Route { ...route } key={ name }>{ content() }</Route>) }</Switch>
</ThemeProvider> </BrowserRouter>
</MuiPickersUtilsProvider> </ThemeProvider>
</StylesProvider> </MuiPickersUtilsProvider>
</StylesProvider>
</PersistGate>
</Provider> </Provider>
); );
} }

1
src/state/reducer/index.ts
View File

@ -1,4 +1,5 @@
import { combineReducers } from "redux"; import { combineReducers } from "redux";
import studentReducer from "./student" import studentReducer from "./student"
const rootReducer = combineReducers({ const rootReducer = combineReducers({

15
src/state/store.ts
View File

@ -1,7 +1,20 @@
import { createStore } from "redux"; import { createStore } from "redux";
import rootReducer from "@/state/reducer"; import rootReducer from "@/state/reducer";
import { devToolsEnhancer } from "redux-devtools-extension"; import { devToolsEnhancer } from "redux-devtools-extension";
import { persistReducer, persistStore } from "redux-persist"
import sessionStorage from "redux-persist/lib/storage/session"
const store = createStore(rootReducer, devToolsEnhancer({ })); const store = createStore(
persistReducer(
{
key: 'state',
storage: sessionStorage
},
rootReducer
),
devToolsEnhancer({})
);
export const persistor = persistStore(store)
export default store; export default store;

12
yarn.lock
View File

@ -1245,6 +1245,13 @@
"@types/prop-types" "*" "@types/prop-types" "*"
csstype "^2.2.0" csstype "^2.2.0"
"@types/redux-persist@^4.3.1":
version "4.3.1"
resolved "https://registry.yarnpkg.com/@types/redux-persist/-/redux-persist-4.3.1.tgz#aa4c876859e0bea5155e5f7980e5b8c4699dc2e6"
integrity sha1-qkyHaFngvqUVXl95gOW4xGmdwuY=
dependencies:
redux-persist "*"
"@types/redux@^3.6.0": "@types/redux@^3.6.0":
version "3.6.0" version "3.6.0"
resolved "https://registry.yarnpkg.com/@types/redux/-/redux-3.6.0.tgz#f1ebe1e5411518072e4fdfca5c76e16e74c1399a" resolved "https://registry.yarnpkg.com/@types/redux/-/redux-3.6.0.tgz#f1ebe1e5411518072e4fdfca5c76e16e74c1399a"
@ -7498,6 +7505,11 @@ redux-devtools-extension@^2.13.8:
resolved "https://registry.yarnpkg.com/redux-devtools-extension/-/redux-devtools-extension-2.13.8.tgz#37b982688626e5e4993ff87220c9bbb7cd2d96e1" resolved "https://registry.yarnpkg.com/redux-devtools-extension/-/redux-devtools-extension-2.13.8.tgz#37b982688626e5e4993ff87220c9bbb7cd2d96e1"
integrity sha512-8qlpooP2QqPtZHQZRhx3x3OP5skEV1py/zUdMY28WNAocbafxdG2tRD1MWE7sp8obGMNYuLWanhhQ7EQvT1FBg== integrity sha512-8qlpooP2QqPtZHQZRhx3x3OP5skEV1py/zUdMY28WNAocbafxdG2tRD1MWE7sp8obGMNYuLWanhhQ7EQvT1FBg==
redux-persist@*, redux-persist@^6.0.0:
version "6.0.0"
resolved "https://registry.yarnpkg.com/redux-persist/-/redux-persist-6.0.0.tgz#b4d2972f9859597c130d40d4b146fecdab51b3a8"
integrity sha512-71LLMbUq2r02ng2We9S215LtPu3fY0KgaGE0k8WRgl6RkqxtGfl7HUozz1Dftwsb0D/5mZ8dwAaPbtnzfvbEwQ==
redux@*, redux@^4.0.0, redux@^4.0.5: redux@*, redux@^4.0.0, redux@^4.0.5:
version "4.0.5" version "4.0.5"
resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.5.tgz#4db5de5816e17891de8a80c424232d06f051d93f" resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.5.tgz#4db5de5816e17891de8a80c424232d06f051d93f"