From 90de21269baa5a46a46c61e75a6e2782c4c65e96 Mon Sep 17 00:00:00 2001 From: Morgan Higby-Flowers Date: Mon, 11 Nov 2024 14:30:28 -0600 Subject: [PATCH 1/7] login gateing studies teminologies and ontologies --- src/AppRouter.jsx | 40 +++++++++++++++++++++---------- src/components/Auth/Login.jsx | 1 + src/components/Auth/LoginPage.jsx | 8 +++++++ src/components/Auth/Logout.jsx | 1 + 4 files changed, 37 insertions(+), 13 deletions(-) create mode 100644 src/components/Auth/LoginPage.jsx diff --git a/src/AppRouter.jsx b/src/AppRouter.jsx index 6db2e0c..d169a87 100644 --- a/src/AppRouter.jsx +++ b/src/AppRouter.jsx @@ -4,9 +4,11 @@ import { Outlet, Route, Routes, - Navigate, + Navigate, } from 'react-router-dom'; import { NavBar } from './components/Nav/NavBar'; +import { Login } from './components/Auth/Login.jsx'; +import { LoginPage } from './components/Auth/LoginPage.jsx'; import { Breadcrumbs } from './components/Nav/Breadcrumbs.jsx'; import { Footer } from './components/Nav/Footer'; import { SearchResults } from './components/Search/SearchResults'; @@ -15,7 +17,6 @@ import { TableDetails } from './components/Projects/Tables/TableDetails'; import { DDDetails } from './components/Projects/DataDictionaries/DDDetails'; import { StudyDetails } from './components/Projects/Studies/StudyDetails'; import { StudyList } from './components/Projects/Studies/StudyList'; - import './App.scss'; import { PageLayout } from './components/Styling/PageLayout.jsx'; import { MappingContextRoot } from './Contexts/MappingContext.jsx'; @@ -26,6 +27,18 @@ import { SearchContextRoot } from './Contexts/SearchContext.jsx'; import { About } from './components/About/About.jsx'; export const AppRouter = () => { + + const isLoggedIn = () => { + const token = localStorage.getItem('googleToken'); + if (token) { + return true; + } else { + return false; + } + } + + + return ( @@ -48,45 +61,46 @@ export const AppRouter = () => { }> } /> } /> - } /> + : } /> } /> - } /> + : } /> + : } /> } /> }> }> - } /> + : } /> } /> - } /> + : } /> - } /> + : } /> } + element={isLoggedIn() ? : } /> - } /> + : } /> } + element={isLoggedIn() ? : } /> } + element={isLoggedIn() ? : } /> } + element={isLoggedIn() ? : } /> } + element={isLoggedIn() ? : } /> diff --git a/src/components/Auth/Login.jsx b/src/components/Auth/Login.jsx index 9534a4a..19405d0 100644 --- a/src/components/Auth/Login.jsx +++ b/src/components/Auth/Login.jsx @@ -22,6 +22,7 @@ export const Login = () => { { + localStorage.setItem('googleToken', credentialResponse.access_token); const credentialResponseDecoded = jwtDecode( credentialResponse.credential ); diff --git a/src/components/Auth/LoginPage.jsx b/src/components/Auth/LoginPage.jsx new file mode 100644 index 0000000..8dc8395 --- /dev/null +++ b/src/components/Auth/LoginPage.jsx @@ -0,0 +1,8 @@ +import { Login } from "./Login" +export const LoginPage = () => { + return <> +
+ +
+ +} \ No newline at end of file diff --git a/src/components/Auth/Logout.jsx b/src/components/Auth/Logout.jsx index 6ff80c0..38e0920 100644 --- a/src/components/Auth/Logout.jsx +++ b/src/components/Auth/Logout.jsx @@ -7,6 +7,7 @@ export const Logout = ({ user, setUser }) => { const logOut = () => { googleLogout(); setUser(null); + localStorage.removeItem('googleToken'); localStorage.removeItem('user'); }; From f4163cc94f1cba651cfb5e56163c425e391ef2a2 Mon Sep 17 00:00:00 2001 From: Morgan Higby-Flowers Date: Mon, 11 Nov 2024 14:52:46 -0600 Subject: [PATCH 2/7] fixing spacing bug --- src/App.scss | 9 +++++++-- src/AppRouter.jsx | 6 ++++-- src/components/Nav/NavBar.scss | 2 -- src/components/Projects/Studies/StudyStyling.scss | 1 - src/components/Search/OntologySearch.scss | 3 +-- 5 files changed, 12 insertions(+), 9 deletions(-) diff --git a/src/App.scss b/src/App.scss index d453759..f90502e 100644 --- a/src/App.scss +++ b/src/App.scss @@ -1,11 +1,16 @@ .approuter_div { display: flex; + min-height: 100vh; flex-direction: column; justify-content: space-between; } .outlet_div { - min-height: 100vh; - height: 100%; position: relative; } + +.header { + z-index: 100; + position: sticky; + top:0; +} diff --git a/src/AppRouter.jsx b/src/AppRouter.jsx index 6db2e0c..01d9447 100644 --- a/src/AppRouter.jsx +++ b/src/AppRouter.jsx @@ -34,8 +34,10 @@ export const AppRouter = () => { element={ <>
- - +
+ + +
diff --git a/src/components/Nav/NavBar.scss b/src/components/Nav/NavBar.scss index a48d239..48efebd 100644 --- a/src/components/Nav/NavBar.scss +++ b/src/components/Nav/NavBar.scss @@ -11,8 +11,6 @@ nav.navbar { display: flex; flex-direction: row; justify-content: center; - position: sticky; - top: 0; li { list-style-type: none; diff --git a/src/components/Projects/Studies/StudyStyling.scss b/src/components/Projects/Studies/StudyStyling.scss index 7a2cae2..a0d63ba 100644 --- a/src/components/Projects/Studies/StudyStyling.scss +++ b/src/components/Projects/Studies/StudyStyling.scss @@ -1,7 +1,6 @@ .studies_container { margin: 5vh 10vw 10vh 10vw; line-height: 1.5rem; - height: 100vh; } .cards_container { diff --git a/src/components/Search/OntologySearch.scss b/src/components/Search/OntologySearch.scss index 3b7753f..4bb37fd 100644 --- a/src/components/Search/OntologySearch.scss +++ b/src/components/Search/OntologySearch.scss @@ -1,8 +1,7 @@ @import '../Styling/Variables'; .search_page { - height: 100%; - min-height: 100vh; + display: flex; flex-direction: column; align-items: center; From 8b7df8ebea8dbc60c93bcc9ad19988989f08656a Mon Sep 17 00:00:00 2001 From: Morgan Higby-Flowers Date: Thu, 14 Nov 2024 06:04:46 -0600 Subject: [PATCH 3/7] main routes are protected --- src/AppRouter.jsx | 24 +++++++++++++++++++----- src/components/Auth/Login.jsx | 8 ++++++-- 2 files changed, 25 insertions(+), 7 deletions(-) diff --git a/src/AppRouter.jsx b/src/AppRouter.jsx index d169a87..c198640 100644 --- a/src/AppRouter.jsx +++ b/src/AppRouter.jsx @@ -4,7 +4,8 @@ import { Outlet, Route, Routes, - Navigate, + Navigate, + useLocation } from 'react-router-dom'; import { NavBar } from './components/Nav/NavBar'; import { Login } from './components/Auth/Login.jsx'; @@ -37,7 +38,19 @@ export const AppRouter = () => { } } + + + function ProtectedRoute({ children }) { + const location = useLocation(); + + // If the user is not logged in, redirect to login with the intended destination path + if (!isLoggedIn()) { + return ; + } + // Otherwise, render the child component (e.g., DDDetails) + return children; + } return ( @@ -61,17 +74,18 @@ export const AppRouter = () => { }> } /> } /> - : } /> + + } /> } /> - : } /> - : } /> + } /> + }/> } /> }> }> - : } /> + } /> } /> : } /> diff --git a/src/components/Auth/Login.jsx b/src/components/Auth/Login.jsx index 19405d0..7daa5fb 100644 --- a/src/components/Auth/Login.jsx +++ b/src/components/Auth/Login.jsx @@ -3,10 +3,12 @@ import { jwtDecode } from 'jwt-decode'; import { useContext, useEffect } from 'react'; import { Logout } from './Logout'; import { myContext } from '../../App'; - +import { useLocation, useNavigate } from 'react-router-dom'; export const Login = () => { const { user, setUser } = useContext(myContext); - + const location = useLocation(); + const navigate = useNavigate(); + const from = location.state?.from?.pathname || '/' useEffect(() => { const storedUser = localStorage.getItem('user'); if (storedUser) { @@ -31,6 +33,8 @@ export const Login = () => { 'user', JSON.stringify(credentialResponseDecoded) ); + navigate(from, { replace: true }); + }} onError={() => { console.log('Login Failed'); From bf0bdf18856ad0a055ce311eb0a96fddc21b5bef Mon Sep 17 00:00:00 2001 From: Morgan Higby-Flowers Date: Thu, 14 Nov 2024 06:12:33 -0600 Subject: [PATCH 4/7] fixed background issue --- src/App.scss | 11 +++++++++++ src/components/Search/OntologySearch.scss | 8 +------- src/components/Styling/PageLayout.jsx | 7 ++----- 3 files changed, 14 insertions(+), 12 deletions(-) diff --git a/src/App.scss b/src/App.scss index f90502e..7fa32b7 100644 --- a/src/App.scss +++ b/src/App.scss @@ -1,3 +1,11 @@ +body{ + + background: url('./assets/Background.png'); + background-size: 100vw; + background-repeat: no-repeat; + background-position: calc(50% - 50px) 50%; + +} .approuter_div { display: flex; min-height: 100vh; @@ -7,6 +15,7 @@ .outlet_div { position: relative; + background-color: rgba(255,255,255,.6); } .header { @@ -14,3 +23,5 @@ position: sticky; top:0; } + + diff --git a/src/components/Search/OntologySearch.scss b/src/components/Search/OntologySearch.scss index 4bb37fd..02814e6 100644 --- a/src/components/Search/OntologySearch.scss +++ b/src/components/Search/OntologySearch.scss @@ -6,13 +6,7 @@ flex-direction: column; align-items: center; justify-content: center; - background: { - image: url('../../assets/Background.png'); - size: 100vw; - repeat: no-repeat; - position: calc(50% - 50px) 50%; - } - z-index: -1; +padding:10rem 0rem; } .search_field { diff --git a/src/components/Styling/PageLayout.jsx b/src/components/Styling/PageLayout.jsx index d95aab8..fec5483 100644 --- a/src/components/Styling/PageLayout.jsx +++ b/src/components/Styling/PageLayout.jsx @@ -3,11 +3,8 @@ import Background from '../../assets/Background.png'; export const PageLayout = () => { return ( -
-
- -
+ <> -
+ ); }; From f84c7e5ee532039243b9314804c1263c3b6f40ab Mon Sep 17 00:00:00 2001 From: Morgan Higby-Flowers Date: Tue, 19 Nov 2024 11:43:21 -0600 Subject: [PATCH 5/7] fixed backgound --- src/App.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/App.scss b/src/App.scss index 7fa32b7..38d8058 100644 --- a/src/App.scss +++ b/src/App.scss @@ -4,6 +4,7 @@ body{ background-size: 100vw; background-repeat: no-repeat; background-position: calc(50% - 50px) 50%; + background-attachment: fixed; } .approuter_div { @@ -15,7 +16,7 @@ body{ .outlet_div { position: relative; - background-color: rgba(255,255,255,.6); + background-color: rgba(255,255,255,.3); } .header { From 849b9d13fde1f4bc2620dd689de9eaa721e3e3b5 Mon Sep 17 00:00:00 2001 From: Yelena Cox Date: Tue, 19 Nov 2024 13:09:36 -0600 Subject: [PATCH 6/7] Using system from ontologyAPI endpoint --- .../MappingsFunctions/GetMappingsModal.jsx | 6 +++-- .../MappingsFunctions/MappingReset.jsx | 4 +++- .../MappingsFunctions/MappingSearch.jsx | 4 +++- src/components/Manager/Utilitiy.jsx | 23 +++++++++---------- .../Tables/EditMappingsTableModal.jsx | 3 ++- .../Projects/Terminologies/APIResults.jsx | 15 +++++++++--- .../Terminologies/EditMappingModal.jsx | 3 ++- 7 files changed, 37 insertions(+), 21 deletions(-) diff --git a/src/components/Manager/MappingsFunctions/GetMappingsModal.jsx b/src/components/Manager/MappingsFunctions/GetMappingsModal.jsx index 80d8005..f741e3c 100644 --- a/src/components/Manager/MappingsFunctions/GetMappingsModal.jsx +++ b/src/components/Manager/MappingsFunctions/GetMappingsModal.jsx @@ -42,6 +42,7 @@ export const GetMappingsModal = ({ apiPreferencesCode, setUnformattedPref, prefTypeKey, + ontologyApis, } = useContext(SearchContext); const [page, setPage] = useState(0); const entriesPerPage = 1000; @@ -159,7 +160,7 @@ export const GetMappingsModal = ({ code: item.obo_id, display: item.label, description: item.description[0], - system: systemsMatch(item.obo_id.split(':')[0]), + system: systemsMatch(item.obo_id.split(':')[0], ontologyApis), })); const mappingsDTO = { mappings: selectedMappings, @@ -479,7 +480,8 @@ export const GetMappingsModal = ({ display: d.label, description: d.description[0], system: systemsMatch( - d?.obo_id?.split(':')[0] + d?.obo_id?.split(':')[0], + ontologyApis ), }), label: checkBoxDisplay(d, index), diff --git a/src/components/Manager/MappingsFunctions/MappingReset.jsx b/src/components/Manager/MappingsFunctions/MappingReset.jsx index dfb508e..df686b7 100644 --- a/src/components/Manager/MappingsFunctions/MappingReset.jsx +++ b/src/components/Manager/MappingsFunctions/MappingReset.jsx @@ -26,6 +26,7 @@ export const MappingReset = ({ setApiPreferencesCode, apiPreferencesCode, setUnformattedPref, + ontologyApis, } = useContext(SearchContext); const [page, setPage] = useState(0); const entriesPerPage = 1000; @@ -380,7 +381,8 @@ export const MappingReset = ({ display: d.label, // description: d.description[0], system: systemsMatch( - d?.obo_id?.split(':')[0] + d?.obo_id?.split(':')[0], + ontologyApis ), }), label: checkBoxDisplay(d, index), diff --git a/src/components/Manager/MappingsFunctions/MappingSearch.jsx b/src/components/Manager/MappingsFunctions/MappingSearch.jsx index 18c8e96..90938c8 100644 --- a/src/components/Manager/MappingsFunctions/MappingSearch.jsx +++ b/src/components/Manager/MappingsFunctions/MappingSearch.jsx @@ -27,6 +27,7 @@ export const MappingSearch = ({ setApiPreferencesCode, apiPreferencesCode, setUnformattedPref, + ontologyApis, } = useContext(SearchContext); const [page, setPage] = useState(0); @@ -475,7 +476,8 @@ export const MappingSearch = ({ display: d.label, description: d.description[0], system: systemsMatch( - d?.obo_id?.split(':')[0] + d?.obo_id?.split(':')[0], + ontologyApis ), }), label: newSearchDisplay(d, index), diff --git a/src/components/Manager/Utilitiy.jsx b/src/components/Manager/Utilitiy.jsx index 787a5d3..0f4ef32 100644 --- a/src/components/Manager/Utilitiy.jsx +++ b/src/components/Manager/Utilitiy.jsx @@ -27,18 +27,17 @@ export const ontologyReducer = d => { results: [], filteredResults: [] } ); -/* The backend API does not yet have a way to affix the system URL to each ontology. - This displays the system for each ontology searched. */ -export const ontologySystems = { - MONDO: 'http://purl.obolibrary.org/obo/mondo.owl', - HP: 'http://purl.obolibrary.org/obo/hp.owl', - MAXO: 'http://purl.obolibrary.org/obo/maxo.owl', - NCIT: 'http://purl.obolibrary.org/obo/ncit.owl', -}; - -// This function matches the ontology prop to its system (listed in object above) in the object that will be sent to the API -export const systemsMatch = ont => { - return ontologySystems[ont]; +// This function matches the ontology prop to its system in the object that will be sent to the API +export const systemsMatch = (ontologyCode, ontologyApis) => { + // Searches for the ontology that contains the requested ontology code + const ontologyApi = ontologyApis.find( + api => api.ontologies[ontologyCode.toLowerCase()] + ); + if (ontologyApi) { + // Return the system URL for the matching ontology + return ontologyApi.ontologies[ontologyCode.toLowerCase()].system; + } + return null; // If not found, return null or handle accordingly }; // Iterates over the facet counts in the result to make an object of search results per ontology diff --git a/src/components/Projects/Tables/EditMappingsTableModal.jsx b/src/components/Projects/Tables/EditMappingsTableModal.jsx index 474d4f0..4ad2682 100644 --- a/src/components/Projects/Tables/EditMappingsTableModal.jsx +++ b/src/components/Projects/Tables/EditMappingsTableModal.jsx @@ -41,6 +41,7 @@ export const EditMappingsTableModal = ({ setApiPreferencesCode, preferenceType, prefTypeKey, + ontologyApis, } = useContext(SearchContext); useEffect(() => { @@ -208,7 +209,7 @@ export const EditMappingsTableModal = ({ code: item.obo_id, display: item.label, description: item.description[0], - system: systemsMatch(item.obo_id.split(':')[0]), + system: systemsMatch(item.obo_id.split(':')[0], ontologyApis), })); const mappingsDTO = { mappings: [ diff --git a/src/components/Projects/Terminologies/APIResults.jsx b/src/components/Projects/Terminologies/APIResults.jsx index cf125c1..c1e9096 100644 --- a/src/components/Projects/Terminologies/APIResults.jsx +++ b/src/components/Projects/Terminologies/APIResults.jsx @@ -9,8 +9,14 @@ export const APIResults = ({ displaySelectedMappings, onSelectedChange, }) => { - const { apiResults, apiResultsCount, apiPage, setApiPage, apiTotalCount } = - useContext(SearchContext); + const { + apiResults, + apiResultsCount, + apiPage, + setApiPage, + apiTotalCount, + ontologyApis, + } = useContext(SearchContext); const [filteredResultsCount, setFilteredResultsCount] = useState(0); const [lastCount, setLastCount] = useState(0); //save last count as count of the results before you fetch data again @@ -108,7 +114,10 @@ export const APIResults = ({ code: d.obo_id, display: d.label, description: d.description[0], - system: systemsMatch(d?.obo_id?.split(':')[0]), + system: systemsMatch( + d?.obo_id?.split(':')[0], + ontologyApis + ), }), label: checkBoxDisplay(d, index), }; diff --git a/src/components/Projects/Terminologies/EditMappingModal.jsx b/src/components/Projects/Terminologies/EditMappingModal.jsx index 2bb49c0..84232d3 100644 --- a/src/components/Projects/Terminologies/EditMappingModal.jsx +++ b/src/components/Projects/Terminologies/EditMappingModal.jsx @@ -35,6 +35,7 @@ export const EditMappingsModal = ({ setApiPreferencesCode, preferenceType, prefTypeKey, + ontologyApis, } = useContext(SearchContext); const [loading, setLoading] = useState(false); const [reset, setReset] = useState(false); @@ -210,7 +211,7 @@ export const EditMappingsModal = ({ code: item.obo_id, display: item.label, description: item.description[0], - system: systemsMatch(item.obo_id.split(':')[0]), + system: systemsMatch(item.obo_id.split(':')[0], ontologyApis), })); const mappingsDTO = { mappings: [ From 7fa421d3052df6afea0445f6a23bc0792bb1afa7 Mon Sep 17 00:00:00 2001 From: Morgan Higby-Flowers Date: Tue, 19 Nov 2024 13:45:24 -0600 Subject: [PATCH 7/7] app routes protected --- src/AppRouter.jsx | 30 +++++++---------------- src/components/Auth/Login.jsx | 11 +++------ src/components/Auth/LoginPage.jsx | 12 +++++++--- src/components/Auth/Logout.jsx | 3 +-- src/components/Nav/NavBar.jsx | 40 +++++++++++++++++++++++++------ src/components/Nav/NavBar.scss | 2 ++ 6 files changed, 57 insertions(+), 41 deletions(-) diff --git a/src/AppRouter.jsx b/src/AppRouter.jsx index c198640..acf9ebd 100644 --- a/src/AppRouter.jsx +++ b/src/AppRouter.jsx @@ -5,8 +5,9 @@ import { Route, Routes, Navigate, - useLocation } from 'react-router-dom'; +import { useContext } from 'react'; +import { myContext } from './App.jsx'; import { NavBar } from './components/Nav/NavBar'; import { Login } from './components/Auth/Login.jsx'; import { LoginPage } from './components/Auth/LoginPage.jsx'; @@ -28,30 +29,17 @@ import { SearchContextRoot } from './Contexts/SearchContext.jsx'; import { About } from './components/About/About.jsx'; export const AppRouter = () => { + const {user} = useContext(myContext); const isLoggedIn = () => { - const token = localStorage.getItem('googleToken'); - if (token) { + const storedUser = localStorage.getItem('user'); + + if (storedUser) { return true; } else { return false; } } - - - - function ProtectedRoute({ children }) { - const location = useLocation(); - - // If the user is not logged in, redirect to login with the intended destination path - if (!isLoggedIn()) { - return ; - } - - // Otherwise, render the child component (e.g., DDDetails) - return children; - } - return ( @@ -75,9 +63,9 @@ export const AppRouter = () => { } /> } /> - } /> + } /> } /> - } /> + : } /> }/> { /> }> }> - } /> + : } /> } /> : } /> diff --git a/src/components/Auth/Login.jsx b/src/components/Auth/Login.jsx index 7daa5fb..99e230a 100644 --- a/src/components/Auth/Login.jsx +++ b/src/components/Auth/Login.jsx @@ -3,12 +3,10 @@ import { jwtDecode } from 'jwt-decode'; import { useContext, useEffect } from 'react'; import { Logout } from './Logout'; import { myContext } from '../../App'; -import { useLocation, useNavigate } from 'react-router-dom'; + export const Login = () => { const { user, setUser } = useContext(myContext); - const location = useLocation(); - const navigate = useNavigate(); - const from = location.state?.from?.pathname || '/' + useEffect(() => { const storedUser = localStorage.getItem('user'); if (storedUser) { @@ -24,7 +22,6 @@ export const Login = () => { { - localStorage.setItem('googleToken', credentialResponse.access_token); const credentialResponseDecoded = jwtDecode( credentialResponse.credential ); @@ -33,8 +30,6 @@ export const Login = () => { 'user', JSON.stringify(credentialResponseDecoded) ); - navigate(from, { replace: true }); - }} onError={() => { console.log('Login Failed'); @@ -42,4 +37,4 @@ export const Login = () => { />
); -}; +}; \ No newline at end of file diff --git a/src/components/Auth/LoginPage.jsx b/src/components/Auth/LoginPage.jsx index 8dc8395..9df1e10 100644 --- a/src/components/Auth/LoginPage.jsx +++ b/src/components/Auth/LoginPage.jsx @@ -1,8 +1,14 @@ import { Login } from "./Login" +import { useContext } from 'react'; +import { myContext } from '../../App'; export const LoginPage = () => { - return <> -
+ const {user} = useContext(myContext); + return
+ {user && +

You are logged in and can navigate to the rest of the site

} +
- + +
} \ No newline at end of file diff --git a/src/components/Auth/Logout.jsx b/src/components/Auth/Logout.jsx index 38e0920..3aa8d16 100644 --- a/src/components/Auth/Logout.jsx +++ b/src/components/Auth/Logout.jsx @@ -7,7 +7,6 @@ export const Logout = ({ user, setUser }) => { const logOut = () => { googleLogout(); setUser(null); - localStorage.removeItem('googleToken'); localStorage.removeItem('user'); }; @@ -27,4 +26,4 @@ export const Logout = ({ user, setUser }) => {
); -}; +}; \ No newline at end of file diff --git a/src/components/Nav/NavBar.jsx b/src/components/Nav/NavBar.jsx index 155727e..2aa7411 100644 --- a/src/components/Nav/NavBar.jsx +++ b/src/components/Nav/NavBar.jsx @@ -1,9 +1,23 @@ -import { NavLink } from 'react-router-dom'; +import { NavLink, useNavigate } from 'react-router-dom'; import './NavBar.scss'; import { Login } from '../Auth/Login'; -import { GoogleOAuthProvider } from '@react-oauth/google'; +import { useContext, useState } from 'react' +import { myContext } from '../../App'; +import { RequiredLogin } from '../Auth/RequiredLogin'; export const NavBar = () => { + const [routeTo, setRouteTo] = useState(null); + const { user } = useContext(myContext); + const navigate = useNavigate(); + const handleSuccess = () => { + navigate(routeTo); + }; + const login = RequiredLogin({ handleSuccess: handleSuccess }); + const handleLogin = (route) => { + setRouteTo(route); + login(); + } + return ( <> + ); }; diff --git a/src/components/Nav/NavBar.scss b/src/components/Nav/NavBar.scss index a48d239..b07deeb 100644 --- a/src/components/Nav/NavBar.scss +++ b/src/components/Nav/NavBar.scss @@ -70,6 +70,8 @@ nav.navbar { padding: 0 4px; width: $navHeight; border-radius: 10px; + font-weight: bold; + cursor: pointer; } .nav_link:hover {