diff --git a/package.json b/package.json
index f474ee4..659ecf9 100644
--- a/package.json
+++ b/package.json
@@ -10,9 +10,13 @@
"preview": "vite preview"
},
"dependencies": {
+ "@reduxjs/toolkit": "^1.9.5",
"react": "^18.2.0",
"react-dom": "^18.2.0",
+ "react-redux": "^8.1.2",
"react-router-dom": "^6.15.0",
+ "redux-persist": "^6.0.0",
+ "redux-thunk": "^2.4.2",
"validator": "^13.11.0"
},
"devDependencies": {
diff --git a/src/App.jsx b/src/App.jsx
index 5106fe4..c26321e 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -1,11 +1,18 @@
import { RouterProvider, createBrowserRouter } from 'react-router-dom';
import routes from './routes';
+import { Provider } from 'react-redux';
+import { PersistGate } from 'redux-persist/integration/react';
+import { persistore, store } from './stores/configureStore';
const router = createBrowserRouter(routes)
function App() {
return (
-
+
+
+
+
+
)
}
diff --git a/src/constants/action_type.js b/src/constants/action_type.js
new file mode 100644
index 0000000..e7b86b2
--- /dev/null
+++ b/src/constants/action_type.js
@@ -0,0 +1,2 @@
+export const LOGIN = 'LOGIN';
+export const LOGOUT = 'LOGOUT';
\ No newline at end of file
diff --git a/src/data/articles.json b/src/datas/articles.json
similarity index 100%
rename from src/data/articles.json
rename to src/datas/articles.json
diff --git a/src/data/dashboard.json b/src/datas/dashboard.json
similarity index 100%
rename from src/data/dashboard.json
rename to src/datas/dashboard.json
diff --git a/src/data/users.json b/src/datas/users.json
similarity index 100%
rename from src/data/users.json
rename to src/datas/users.json
diff --git a/src/features/auth/authSlice.js b/src/features/auth/authSlice.js
new file mode 100644
index 0000000..85794f7
--- /dev/null
+++ b/src/features/auth/authSlice.js
@@ -0,0 +1,20 @@
+import { createSlice, current } from "@reduxjs/toolkit";
+
+const initialState = []
+
+const authSlice = createSlice({
+ name: 'auth',
+ initialState,
+ reducers: {
+ authAdded(state, action) {
+ const { current_user } = action.payload;
+ let newState = { ...state }
+ newState = current_user
+ return newState
+ }
+ }
+})
+
+export const { authAdded } = authSlice.actions;
+
+export default authSlice.reducer;
\ No newline at end of file
diff --git a/src/pages/Dashboard/index.jsx b/src/pages/Dashboard/index.jsx
new file mode 100644
index 0000000..19fb638
--- /dev/null
+++ b/src/pages/Dashboard/index.jsx
@@ -0,0 +1,9 @@
+const Dashboard = () => {
+ return (
+ <>
+
Dashboard
+ >
+ )
+}
+
+export default Dashboard;
\ No newline at end of file
diff --git a/src/pages/Login/index.jsx b/src/pages/Login/index.jsx
index fd25441..35bdd47 100644
--- a/src/pages/Login/index.jsx
+++ b/src/pages/Login/index.jsx
@@ -1,5 +1,7 @@
import { useState } from "react";
-import user from "../../data/users.json";
+import user from "../../datas/users.json";
+import { useDispatch, useSelector } from "react-redux";
+import { authAdded } from "../../features/auth/authSlice";
const Login = () => {
const [authForm, setAuthForm] = useState({
@@ -12,6 +14,9 @@ const Login = () => {
message: ''
});
+ const dispatch = useDispatch();
+ const auth = useSelector(state => state.auth);
+
const handleAuthForm = (e) => {
if(err.err) {
setErr({ ...err, err: false})
@@ -36,8 +41,8 @@ const Login = () => {
setErr({ err: true, message: "User not found with this Email / Password"})
return;
}
-
- console.log(current_user);
+ dispatch(authAdded({current_user}));
+ console.log(auth);
}
return (
diff --git a/src/pages/index.js b/src/pages/index.js
index 326cc83..8df7dad 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -1,7 +1,9 @@
import Login from './Login';
import Notfound404 from './Notfound404';
+import Dashboard from './Dashboard';
export {
Login,
- Notfound404
+ Notfound404,
+ Dashboard,
}
\ No newline at end of file
diff --git a/src/reducers/index.js b/src/reducers/index.js
new file mode 100644
index 0000000..e461e9f
--- /dev/null
+++ b/src/reducers/index.js
@@ -0,0 +1,18 @@
+import { combineReducers } from "@reduxjs/toolkit";
+import { LOGOUT } from "../constants/action_type";
+import authSlice from "../features/auth/authSlice";
+
+const appReducer = combineReducers({
+ auth: authSlice
+});
+
+const rootReducer = (state, action) => {
+ if (action.type === LOGOUT) {
+ // remove token
+ state = undefined
+ }
+
+ return appReducer(state, action);
+}
+
+export default rootReducer;
diff --git a/src/routes/index.jsx b/src/routes/index.jsx
index 214ff7f..8fff3d6 100644
--- a/src/routes/index.jsx
+++ b/src/routes/index.jsx
@@ -1,4 +1,5 @@
import {
+ Dashboard,
Login,
Notfound404
} from "../pages";
@@ -8,6 +9,10 @@ const routes = [
path: "/",
element: ,
errorElement:
+ },
+ {
+ path: "/dashboard",
+ element:
}
]
diff --git a/src/stores/configureStore.js b/src/stores/configureStore.js
new file mode 100644
index 0000000..6e7d599
--- /dev/null
+++ b/src/stores/configureStore.js
@@ -0,0 +1,23 @@
+import { applyMiddleware, configureStore, createStore, compose } from '@reduxjs/toolkit'
+import storage from 'redux-persist/lib/storage'
+import persistReducer from 'redux-persist/es/persistReducer';
+import rootReducer from '../reducers';
+import thunk from 'redux-thunk';
+import { persistStore } from 'redux-persist';
+
+const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose
+
+const persistConfig = {
+ key: 'root',
+ blacklist: [],
+ whitelist: [
+ "auth"
+ ],
+ storage
+}
+
+const persistedReducer = persistReducer(persistConfig, rootReducer);
+
+export const store = createStore(persistedReducer, composeEnhancers(applyMiddleware(thunk)))
+
+export const persistore = persistStore(store)
diff --git a/yarn.lock b/yarn.lock
index 3e5de13..eec43ab 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -184,6 +184,13 @@
dependencies:
"@babel/helper-plugin-utils" "^7.22.5"
+"@babel/runtime@^7.12.1", "@babel/runtime@^7.9.2":
+ version "7.22.10"
+ resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.22.10.tgz#ae3e9631fd947cb7e3610d3e9d8fef5f76696682"
+ integrity sha512-21t/fkKLMZI4pqP2wlmsQAWnYW1PDyKyyUV4vCi+B25ydmdaYTKXPwCj0BzSUnZf4seIiYvSA3jcZ3gdsMFkLQ==
+ dependencies:
+ regenerator-runtime "^0.14.0"
+
"@babel/template@^7.22.5":
version "7.22.5"
resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.22.5.tgz#0c8c4d944509875849bd0344ff0050756eefc6ec"
@@ -432,6 +439,16 @@
"@nodelib/fs.scandir" "2.1.5"
fastq "^1.6.0"
+"@reduxjs/toolkit@^1.9.5":
+ version "1.9.5"
+ resolved "https://registry.yarnpkg.com/@reduxjs/toolkit/-/toolkit-1.9.5.tgz#d3987849c24189ca483baa7aa59386c8e52077c4"
+ integrity sha512-Rt97jHmfTeaxL4swLRNPD/zV4OxTes4la07Xc4hetpUW/vc75t5m1ANyxG6ymnEQ2FsLQsoMlYB2vV1sO3m8tQ==
+ dependencies:
+ immer "^9.0.21"
+ redux "^4.2.1"
+ redux-thunk "^2.4.2"
+ reselect "^4.1.8"
+
"@remix-run/router@1.8.0":
version "1.8.0"
resolved "https://registry.yarnpkg.com/@remix-run/router/-/router-1.8.0.tgz#e848d2f669f601544df15ce2a313955e4bf0bafc"
@@ -444,6 +461,14 @@
dependencies:
mini-svg-data-uri "^1.2.3"
+"@types/hoist-non-react-statics@^3.3.1":
+ version "3.3.1"
+ resolved "https://registry.yarnpkg.com/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f"
+ integrity sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==
+ dependencies:
+ "@types/react" "*"
+ hoist-non-react-statics "^3.3.0"
+
"@types/prop-types@*":
version "15.7.5"
resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.5.tgz#5f19d2b85a98e9558036f6a3cacc8819420f05cf"
@@ -470,6 +495,11 @@
resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.3.tgz#cef09e3ec9af1d63d2a6cc5b383a737e24e6dcf5"
integrity sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==
+"@types/use-sync-external-store@^0.0.3":
+ version "0.0.3"
+ resolved "https://registry.yarnpkg.com/@types/use-sync-external-store/-/use-sync-external-store-0.0.3.tgz#b6725d5f4af24ace33b36fafd295136e75509f43"
+ integrity sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA==
+
"@vitejs/plugin-react@^4.0.3":
version "4.0.4"
resolved "https://registry.yarnpkg.com/@vitejs/plugin-react/-/plugin-react-4.0.4.tgz#31c3f779dc534e045c4b134e7cf7b150af0a7646"
@@ -1299,11 +1329,23 @@ has@^1.0.3:
dependencies:
function-bind "^1.1.1"
+hoist-non-react-statics@^3.3.0, hoist-non-react-statics@^3.3.2:
+ version "3.3.2"
+ resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
+ integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
+ dependencies:
+ react-is "^16.7.0"
+
ignore@^5.2.0:
version "5.2.4"
resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.4.tgz#a291c0c6178ff1b960befe47fcdec301674a6324"
integrity sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ==
+immer@^9.0.21:
+ version "9.0.21"
+ resolved "https://registry.yarnpkg.com/immer/-/immer-9.0.21.tgz#1e025ea31a40f24fb064f1fef23e931496330176"
+ integrity sha512-bc4NBHqOqSfRW7POMkHd51LvClaeMXpm8dx0e8oE2GORbq5aRK7Bxl4FyzVLdGtLmvLKL7BTDBG5ACQm4HWjTA==
+
import-fresh@^3.2.1:
version "3.3.0"
resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b"
@@ -1861,11 +1903,28 @@ react-dom@^18.2.0:
loose-envify "^1.1.0"
scheduler "^0.23.0"
-react-is@^16.13.1:
+react-is@^16.13.1, react-is@^16.7.0:
version "16.13.1"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
+react-is@^18.0.0:
+ version "18.2.0"
+ resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.2.0.tgz#199431eeaaa2e09f86427efbb4f1473edb47609b"
+ integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==
+
+react-redux@^8.1.2:
+ version "8.1.2"
+ resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-8.1.2.tgz#9076bbc6b60f746659ad6d51cb05de9c5e1e9188"
+ integrity sha512-xJKYI189VwfsFc4CJvHqHlDrzyFTY/3vZACbE+rr/zQ34Xx1wQfB4OTOSeOSNrF6BDVe8OOdxIrAnMGXA3ggfw==
+ dependencies:
+ "@babel/runtime" "^7.12.1"
+ "@types/hoist-non-react-statics" "^3.3.1"
+ "@types/use-sync-external-store" "^0.0.3"
+ hoist-non-react-statics "^3.3.2"
+ react-is "^18.0.0"
+ use-sync-external-store "^1.0.0"
+
react-refresh@^0.14.0:
version "0.14.0"
resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.14.0.tgz#4e02825378a5f227079554d4284889354e5f553e"
@@ -1907,6 +1966,28 @@ readdirp@~3.6.0:
dependencies:
picomatch "^2.2.1"
+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-thunk@^2.4.2:
+ version "2.4.2"
+ resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.4.2.tgz#b9d05d11994b99f7a91ea223e8b04cf0afa5ef3b"
+ integrity sha512-+P3TjtnP0k/FEjcBL5FZpoovtvrTNT/UXd4/sluaSyrURlSlhLSzEdfsTBW7WsKB6yPvgd7q/iZPICFjW4o57Q==
+
+redux@^4.2.1:
+ version "4.2.1"
+ resolved "https://registry.yarnpkg.com/redux/-/redux-4.2.1.tgz#c08f4306826c49b5e9dc901dee0452ea8fce6197"
+ integrity sha512-LAUYz4lc+Do8/g7aeRa8JkyDErK6ekstQaqWQrNRW//MY1TvCEpMtpTWvlQ+FPbWCx+Xixu/6SHt5N0HR+SB4w==
+ dependencies:
+ "@babel/runtime" "^7.9.2"
+
+regenerator-runtime@^0.14.0:
+ version "0.14.0"
+ resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz#5e19d68eb12d486f797e15a3c6a918f7cec5eb45"
+ integrity sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==
+
regexp.prototype.flags@^1.4.3, regexp.prototype.flags@^1.5.0:
version "1.5.0"
resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.5.0.tgz#fe7ce25e7e4cca8db37b6634c8a2c7009199b9cb"
@@ -1916,6 +1997,11 @@ regexp.prototype.flags@^1.4.3, regexp.prototype.flags@^1.5.0:
define-properties "^1.2.0"
functions-have-names "^1.2.3"
+reselect@^4.1.8:
+ version "4.1.8"
+ resolved "https://registry.yarnpkg.com/reselect/-/reselect-4.1.8.tgz#3f5dc671ea168dccdeb3e141236f69f02eaec524"
+ integrity sha512-ab9EmR80F/zQTMNeneUr4cv+jSwPJgIlvEmVwLerwrWVbpLlBuls9XHzIeTFy4cegU2NHBp3va0LKOzU5qFEYQ==
+
resolve-from@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6"
@@ -2247,6 +2333,11 @@ uri-js@^4.2.2:
dependencies:
punycode "^2.1.0"
+use-sync-external-store@^1.0.0:
+ version "1.2.0"
+ resolved "https://registry.yarnpkg.com/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz#7dbefd6ef3fe4e767a0cf5d7287aacfb5846928a"
+ integrity sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==
+
util-deprecate@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"