NIH-NCPI · mhigbyflowers · Nov 22, 2024 · Dec 5, 2024 · Dec 9, 2024 · Dec 9, 2024
diff --git a/.env b/.env
@@ -0,0 +1,7 @@
+VITE_SEARCH_ENDPOINT = https://www.ebi.ac.uk/ols4/api/search?
+VITE_MONARCH_SEARCH = https://api-v3.monarchinitiative.org/v3/api/search?
+# VITE_VOCAB_ENDPOINT = http://127.0.0.1:5000/api # local
+VITE_VOCAB_ENDPOINT = https://locutus-dev-110109177269.us-central1.run.app/api # dev
+# VITE_VOCAB_ENDPOINT = https://locutus-uat-1066621297011.us-central1.run.app/api # uat
+VITE_CLIENT_ID = 159970607373-mvkv4lfl4ovpul5bssatuf1re4ucvg8n.apps.googleusercontent.com
+VITE_MAPDRAGON_VERSION = "Development"
diff --git a/src/App.jsx b/src/App.jsx
@@ -2,6 +2,7 @@ import { message } from 'antd';
 import { useState, createContext, useRef, useEffect } from 'react';
 import { AppRouter } from './AppRouter';
 import { GoogleOAuthProvider } from '@react-oauth/google';
+import { getSessionStatus } from './components/Manager/SessionsManager';
 
 export const myContext = createContext();
 
@@ -36,11 +37,15 @@ function App() {
   const [study, setStudy] = useState(initialStudy);
   const [selectedKey, setSelectedKey] = useState(null);
   const [user, setUser] = useState(null);
+  const [userPic, setUserPic] = useState(null);
   const [ontologyForPagination, setOntologyForPagination] = useState([]);
 
   message.config({
     top: '25vh',
   });
+  useEffect(() => {
+    // getSessionStatus(vocabUrl);
+  });
   return (
     <GoogleOAuthProvider clientId={clientId}>
       <myContext.Provider
@@ -75,6 +80,8 @@ function App() {
           setExportState,
           user,
           setUser,
+          userPic,
+          setUserPic,
           importState,
           setImportState,
           ontologyForPagination,

diff --git a/src/AppRouter.jsx b/src/AppRouter.jsx
@@ -29,9 +29,10 @@ import { SearchContextRoot } from './Contexts/SearchContext.jsx';
 import { About } from './components/About/About.jsx';
 
 export const AppRouter = () => {
+  const { user, vocabUrl } = useContext(myContext);
   const isLoggedIn = () => {
     const storedUser = localStorage.getItem('user');
-
+    
     if (storedUser) {
       return true;
     } else {

diff --git a/src/components/Auth/Login.jsx b/src/components/Auth/Login.jsx
@@ -3,19 +3,22 @@ import { jwtDecode } from 'jwt-decode';
 import { useContext, useEffect } from 'react';
 import { Logout } from './Logout';
 import { myContext } from '../../App';
+import { startSession } from '../Manager/SessionsManager';
 
 export const Login = () => {
-  const { user, setUser } = useContext(myContext);
+  const { user, setUser,setUserPic, userPic, vocabUrl } = useContext(myContext);
 
   useEffect(() => {
     const storedUser = localStorage.getItem('user');
+    const storedUserPic = localStorage.getItem('userPic');
     if (storedUser) {
       setUser(JSON.parse(storedUser));
+      setUserPic(JSON.parse(storedUserPic));
     }
   }, []);
   // If there is a user, it displays the Logout function with user information. Otherwise, it displays the login button
   return user ? (
-    <Logout user={user} setUser={setUser} />
+    <Logout user={user} setUser={setUser} userPic={userPic} setUserPic={setUserPic} />
   ) : (
     // Logs user in, decodes the JWT token, saves the decoded JWT in local storage and sets user to it
     <div>
@@ -25,16 +28,23 @@ export const Login = () => {
           const credentialResponseDecoded = jwtDecode(
             credentialResponse.credential
           );
-          setUser(credentialResponseDecoded);
+          console.log(credentialResponseDecoded,"credentialResponseDecoded");
           localStorage.setItem(
             'user',
-            JSON.stringify(credentialResponseDecoded)
+            JSON.stringify(credentialResponseDecoded.email)
           );
+          localStorage.setItem(
+            'picture',
+            JSON.stringify(credentialResponseDecoded.picture)
+          );
+          startSession(vocabUrl, credentialResponseDecoded.email);
+          setUser(credentialResponseDecoded.email);
+          setUserPic(credentialResponseDecoded.picture);
         }}
         onError={() => {
           console.log('Login Failed');
         }}
       />
     </div>
   );
-};
+};
diff --git a/src/components/Auth/LoginPage.jsx b/src/components/Auth/LoginPage.jsx
@@ -1,14 +1,14 @@
 import { Login } from "./Login"
 import { useContext } from 'react';
 import { myContext } from '../../App';
+import { getSessionStatus } from "../Manager/SessionsManager";
 export const LoginPage = () => {
-    const {user} = useContext(myContext);
+    const {user,vocabUrl} = useContext(myContext);
     return <div style={{background:"rgba(0,0,0,.2"}}>
         {user &&
         <h2 style={{textAlign:"center",paddingTop:'5rem'}}>You are logged in and can navigate to the rest of the site</h2>}
         <div style={{ height:"5rem",display:"flex",flexDirection:"column",justifyContent:"space-around",alignItems:"center"}}>
             <Login />
         </div>
-
     </div>
 }
diff --git a/src/components/Auth/Logout.jsx b/src/components/Auth/Logout.jsx
@@ -2,20 +2,28 @@ import { googleLogout } from '@react-oauth/google';
 import './Auth.scss';
 import { LogoutOutlined } from '@ant-design/icons';
 import { Tooltip } from 'antd';
+import { endSession } from '../Manager/SessionsManager';
+import { useContext } from 'react';
+import { myContext } from '../../App';
+
+export const Logout = ({ user, setUser,userPic,setUserPic }) => {
+  const { vocabUrl } = useContext(myContext)
 
-export const Logout = ({ user, setUser }) => {
   const logOut = () => {
+
     googleLogout();
+    endSession(vocabUrl);
     setUser(null);
+    setUserPic(null);
     localStorage.removeItem('user');
   };
 
   return (
     <>
       <div className="logged_in_user">
         <div className="user_email">
-          <img className="user_image" src={user.picture} />
-          {user?.email}
+          <img className="user_image" src={userPic} />
+          {user}
         </div>
         <Tooltip mouseEnterDelay={0.5} placement="bottom" title="Log out">
           <LogoutOutlined
@@ -26,4 +34,4 @@ export const Logout = ({ user, setUser }) => {
       </div>
     </>
   );
-};
+};
diff --git a/src/components/Manager/FetchManager.jsx b/src/components/Manager/FetchManager.jsx
@@ -4,6 +4,7 @@ import { ontologyReducer } from './Utilitiy';
 export const getAll = (vocabUrl, name, navigate) => {
   return fetch(`${vocabUrl}/${name}`, {
     method: 'GET',
+    credentials: 'include',
     headers: {
       'Content-Type': 'application/json',
     },
@@ -24,6 +25,7 @@ export const getAll = (vocabUrl, name, navigate) => {
 export const getById = async (vocabUrl, name, id, navigate) => {
   return fetch(`${vocabUrl}/${name}/${id}`, {
     method: 'GET',
+    credentials: 'include',
     headers: {
       'Content-Type': 'application/json',
     },
@@ -46,13 +48,12 @@ export const getById = async (vocabUrl, name, id, navigate) => {
 
 // Deletes one element by its id
 export const handleDelete = (evt, vocabUrl, name, component, user) => {
-  const options = { method: 'DELETE' };
+  const options = { method: 'DELETE', credentials: 'include', };
 
   if (name === 'Table' || name === 'Terminology') {
     options.headers = {
       'Content-Type': 'application/json',
     };
-    options.body = JSON.stringify({ editor: user.email });
   }
   return fetch(`${vocabUrl}/${name}/${component.id}`, options)
     .then(response => {
@@ -82,6 +83,7 @@ export const handleDelete = (evt, vocabUrl, name, component, user) => {
 export const handleUpdate = (vocabUrl, name, component, values) => {
   return fetch(`${vocabUrl}/${name}/${component.id}`, {
     method: 'PUT',
+    credentials: 'include',
     headers: {
       'Content-Type': 'application/json',
     },
@@ -101,6 +103,7 @@ export const handleUpdate = (vocabUrl, name, component, values) => {
 export const handlePost = (vocabUrl, name, body) => {
   return fetch(`${vocabUrl}/${name}`, {
     method: 'POST',
+    credentials: 'include',
     headers: {
       'Content-Type': 'application/json',
     },
@@ -119,6 +122,7 @@ export const handlePost = (vocabUrl, name, body) => {
 export const handlePatch = (vocabUrl, name, component, body) => {
   return fetch(`${vocabUrl}/${name}/${component.id}/rename`, {
     method: 'PATCH',
+    credentials: 'include',
     headers: {
       'Content-Type': 'application/json',
     },
@@ -137,6 +141,7 @@ export const handlePatch = (vocabUrl, name, component, body) => {
 export const getProvenanceByCode = async (vocabUrl, name, id, code) => {
   return fetch(`${vocabUrl}/Provenance/${name}/${id}/code/${code}`, {
     method: 'GET',
+    credentials: 'include',
     headers: {
       'Content-Type': 'application/json',
     },
@@ -154,6 +159,7 @@ export const getProvenanceByCode = async (vocabUrl, name, id, code) => {
 export const getOntologies = vocabUrl => {
   return fetch(`${vocabUrl}/OntologyAPI`, {
     method: 'GET',
+    credentials: 'include',
     headers: {
       'Content-Type': 'application/json',
     },
@@ -189,6 +195,7 @@ export const olsFilterOntologiesSearch = (
     `${searchUrl}q=${query}&ontology=${ontologiesToSearch}&rows=${entriesPerPage}&start=${pageStart}`,
     {
       method: 'GET',
+      credentials: 'include',
       headers: {
         'Content-Type': 'application/json',
       },
@@ -248,6 +255,7 @@ export const getFiltersByCode = (
     }`,
     {
       method: 'GET',
+      credentials: 'include',
       headers: {
         'Content-Type': 'application/json',
       },

diff --git a/src/components/Manager/MappingsFunctions/AssignMappings.jsx b/src/components/Manager/MappingsFunctions/AssignMappings.jsx
@@ -70,7 +70,6 @@ export const AssignMappings = ({
     }));
     const mappingsDTO = {
       mappings: selectedMappings,
-      editor: user.email,
     };
 
     fetch(

diff --git a/src/components/Manager/MappingsFunctions/ClearMappings.jsx b/src/components/Manager/MappingsFunctions/ClearMappings.jsx
@@ -18,10 +18,6 @@ export const ClearMappings = ({ propId, component }) => {
   const handleDelete = evt => {
     return fetch(`${vocabUrl}/${component}/${propId}/mapping`, {
       method: 'DELETE',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify({ editor: user.email }),
     })
       .then(res => {
         if (res.ok) {

diff --git a/src/components/Manager/MappingsFunctions/FilterAPI.jsx b/src/components/Manager/MappingsFunctions/FilterAPI.jsx
@@ -59,6 +59,7 @@ export const FilterAPI = ({
     return (
       setTableLoading(true),
       fetch(`${vocabUrl}/OntologyAPI/${active}`, {
+        credentials: 'include',
         method: 'GET',
         headers: {
           'Content-Type': 'application/json',

diff --git a/src/components/Manager/MappingsFunctions/FilterReset.jsx b/src/components/Manager/MappingsFunctions/FilterReset.jsx
@@ -20,14 +20,14 @@ export const FilterReset = ({ table, terminology }) => {
       `${vocabUrl}/${
         table
           ? `Table/${table.id}/filter/self`
-          : `Terminology/${terminology.id}/filter}`
+          : `Terminology/${terminology.id}/filter`
       }`,
       {
+        credentials: 'include',
         method: 'DELETE',
         headers: {
           'Content-Type': 'application/json',
         },
-        body: JSON.stringify({ editor: user.email }),
       }
     )
       .then(res => {
@@ -48,9 +48,10 @@ export const FilterReset = ({ table, terminology }) => {
           `${vocabUrl}/${
             table
               ? `Table/${table.id}/filter/self`
-              : `Terminology/${terminology.id}/filter}`
+              : `Terminology/${terminology.id}/filter`
           }`,
           {
+            credentials: 'include',
             method: 'GET',
             headers: {
               'Content-Type': 'application/json',

diff --git a/src/components/Manager/MappingsFunctions/FilterSelect.jsx b/src/components/Manager/MappingsFunctions/FilterSelect.jsx
@@ -124,7 +124,6 @@ export const FilterSelect = ({ component, table, terminology }) => {
 
     const apiPreferenceDTO = {
       api_preference: apiPreference?.api_preference,
-      editor: user.email,
     };
 
     const method =
@@ -138,6 +137,7 @@ export const FilterSelect = ({ component, table, terminology }) => {
         ? `Table/${table.id}/filter/self`
         : `Terminology/${terminology.id}/filter`)}`,
       {
+        credentials: 'include',
         method: method,
         headers: {
           'Content-Type': 'application/json',
@@ -158,6 +158,7 @@ export const FilterSelect = ({ component, table, terminology }) => {
             ? `Table/${table.id}/filter/self`
             : `Terminology/${terminology.id}/filter`)}`,
           {
+            credentials: 'include',
             method: 'GET',
             headers: {
               'Content-Type': 'application/json',

diff --git a/src/components/Manager/MappingsFunctions/GetMappingsModal.jsx b/src/components/Manager/MappingsFunctions/GetMappingsModal.jsx
@@ -165,10 +165,10 @@ export const GetMappingsModal = ({
 
     const mappingsDTO = {
       mappings: selectedMappings,
-      editor: user.email,
     };
 
     setLoading(true);
+    console.log(user);
     fetch(
       `${vocabUrl}/${componentString}/${component.id}/mapping/${mappingProp}?user_input=true&user=${user?.email}`,
       {

diff --git a/src/components/Manager/MappingsFunctions/OntologyFilterCodeSubmit.jsx b/src/components/Manager/MappingsFunctions/OntologyFilterCodeSubmit.jsx
@@ -22,6 +22,7 @@ export const OntologyFilterCodeSubmit = (
     apiPreference.api_preference.ols = apiPreferencesCode;
 
     fetch(`${vocabUrl}/Table/${table.id}/filter/${mappingProp}`, {
+      credentials: 'include',
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',
-Original file line number
+Diff line change
@@ Expand Up / @@ -70,7 +70,6 @@ export const AssignMappings = ({ @@
         }));
         const mappingsDTO = {
           mappings: selectedMappings,
-          editor: user.email,
         };
         fetch(
@@ Expand Down @@