Dynamic URL that mirros interlex urls + optimizations

src/App.jsx

@@ -126,21 +126,13 @@ function MainContent() {
 						}
 					/>
 					<Route
-						path="/search"
+						path="/:group/search"
 						element={
 							<PageContainer>
 								<SearchResults />
 							</PageContainer>
 						}
 					/>
-					<Route
-						path="/view"
-						element={
-							<PageContainer>
-								<SingleTermView />
-							</PageContainer>
-						}
-					/>
 					<Route
 						path="/organizations"
 						element={
@@ -170,7 +162,7 @@ function MainContent() {
 						}
 					/>
 					<Route
-						path="/dashboard"
+						path="/:group/dashboard"
 						element={
 							<PageContainer>
 								<Dashboard />
@@ -201,6 +193,14 @@ function MainContent() {
 							</ProtectedRoute>
 						}
 					/>
+					<Route
+						path="/:group/:term/:tab?"
+						element={
+							<PageContainer>
+								<SingleTermView />
+							</PageContainer>
+						}
+					/>
 				</Routes>
 			</Layout>
 		</Box>

src/api/endpoints/apiService.ts

@@ -60,9 +60,9 @@ export const userLogout = (group: string) => {
   return createGetRequest<any, any>(endpoint, "application/json")();
 };
 
-export const getSelectedTermLabel = async (searchTerm: string): Promise<string | undefined> => {
+export const getSelectedTermLabel = async (searchTerm: string, group: string = 'base'): Promise<{ label: string | undefined; actualGroup: string }> => {
   try {
-    const response = await createGetRequest<JsonLdResponse, any>(`/base/${searchTerm}.jsonld`)();
+    const response = await createGetRequest<JsonLdResponse, any>(`/${group}/${searchTerm}.jsonld`)();
 
     const label = response['@graph']?.[0]?.['rdfs:label'];
 
@@ -77,10 +77,39 @@ export const getSelectedTermLabel = async (searchTerm: string): Promise<string |
       return label?.['@value'] || '';
     };
 
-    return label ? getLabelValue(label) : undefined
+    return { 
+      label: label ? getLabelValue(label) : undefined, 
+      actualGroup: group 
+    };
   } catch (err: any) {
     console.error(err.message);
-    return undefined;
+    // If the request fails and we're not already trying 'base', try with 'base' as fallback
+    if (group !== 'base') {
+      try {
+        const fallbackResponse = await createGetRequest<JsonLdResponse, any>(`/base/${searchTerm}.jsonld`)();
+        const fallbackLabel = fallbackResponse['@graph']?.[0]?.['rdfs:label'];
+
+        const getLabelValue = (label: LabelType): string => {
+          if (typeof label === 'string') return label;
+          if (Array.isArray(label)) {
+            const en = label.find(
+              l => typeof l === 'string' || (typeof l === 'object' && l?.['@language'] === 'en')
+            );
+            return typeof en === 'string' ? en : en?.['@value'] || '';
+          }
+          return label?.['@value'] || '';
+        };
+
+        return { 
+          label: fallbackLabel ? getLabelValue(fallbackLabel) : undefined, 
+          actualGroup: 'base' 
+        };
+      } catch (fallbackErr: any) {
+        console.error('Fallback request also failed:', fallbackErr.message);
+        return { label: undefined, actualGroup: group };
+      }
+    }
+    return { label: undefined, actualGroup: group };
   }
 };
 
@@ -222,6 +251,16 @@ export const getMatchTerms = async (group: string, term: string, filters = {}) =
     return termParser(response, term);
   } catch (err: any) {
     console.error(err.message);
+    // If the request fails and we're not already trying 'base', try with 'base' as fallback
+    if (group !== 'base') {
+      try {
+        const fallbackResponse = await createGetRequest<any, any>(`/base/${term}.${BASE_EXTENSION}`, "application/json")();
+        return termParser(fallbackResponse, term);
+      } catch (fallbackErr: any) {
+        console.error('Fallback request also failed:', fallbackErr.message);
+        return undefined;
+      }
+    }
     return undefined;
   }
 };
@@ -232,6 +271,16 @@ export const getRawData = async (group: string, termID: string, format: string)
     return response;
   } catch (err: any) {
     console.error(err.message);
+    // If the request fails and we're not already trying 'base', try with 'base' as fallback
+    if (group !== 'base') {
+      try {
+        const fallbackResponse = await createGetRequest<any, any>(`/base/${termID}.${format}`, "application/json")();
+        return fallbackResponse;
+      } catch (fallbackErr: any) {
+        console.error('Fallback request also failed:', fallbackErr.message);
+        return undefined;
+      }
+    }
     return undefined;
   }
 };

src/components/GraphViewer/GraphStructure.jsx

@@ -31,11 +31,15 @@ export const getGraphStructure = (pred) => {
 
     let getExistingObject = uniqueObjects?.find( c => c.id === child.object );
     if ( getExistingObject ) {
+      // Object already exists, just add it to the predicate's children
       let getExistingPredicate = data.children?.find( c => c.id === child.predicate );
       if ( getExistingPredicate ) {
         getExistingPredicate.children.push(newChild)
       }
     } else {
+      // New object, add it to uniqueObjects and process normally
+      uniqueObjects.push(newChild);
+
       let getExistingPredicate = data?.children?.find( c => c.id === child.predicate );
       if ( getExistingPredicate ) {
         getExistingPredicate.children.push(newChild)

src/components/Header/Search.jsx

@@ -90,7 +90,12 @@ const Search = () => {
   const [terms, setTerms] = useState([]);
   const [organizations, setOrganizations] = useState([]);
   const [ontologies, setOntologies] = useState([]);
-  const { storedSearchTerm, updateStoredSearchTerm} = useContext(GlobalDataContext)
+  const { storedSearchTerm, updateStoredSearchTerm, user } = useContext(GlobalDataContext);
+
+  // Get the group name based on user login status
+  const getGroupName = () => {
+    return user?.groupname || 'base';
+  };
 
   const handleOpenList = () => setOpenList(true);
   const handleCloseList = () => setOpenList(false);
@@ -100,13 +105,15 @@ const Search = () => {
     if (!newInputValue) return;
 
     handleCloseList();
-    navigate(`/view?searchTerm=${newInputValue?.ilx}`);
+    const groupName = getGroupName();
+    navigate(`/${groupName}/${newInputValue?.ilx}/overview`);
     updateStoredSearchTerm(newInputValue?.label)
   };
 
   const handleSearchTermClick = () => {
     handleCloseList();
-    navigate(`/search?searchTerm=${searchTerm}`);
+    const groupName = getGroupName();
+    navigate(`/${groupName}/search?searchTerm=${searchTerm}`);
   };
 
   const handleInputFocus = (event) => {

src/components/Header/index.jsx

@@ -141,18 +141,6 @@ const NavMenu = [
     }
 ]
 
-const UserNavMenu = [
-    {
-        label: 'My dashboard',
-        icon: <UserIcon />,
-        href: '/dashboard'
-    },
-    {
-        label: 'Log out',
-        icon: <LogoutIcon />
-    }
-]
-
 const Header = () => {
     const [anchorEl, setAnchorEl] = React.useState(null);
     const [anchorElUser, setAnchorElUser] = React.useState(null);
@@ -164,6 +152,23 @@ const Header = () => {
     // eslint-disable-next-line no-unused-vars
     const [existingCookies, setCookie, removeCookie] = useCookies(['session']);
 
+    // Get the group name based on user login status
+    const getGroupName = () => {
+        return user?.groupname || 'base';
+    };
+
+    const UserNavMenu = [
+        {
+            label: 'My dashboard',
+            icon: <UserIcon />,
+            href: `/${getGroupName()}/dashboard`
+        },
+        {
+            label: 'Log out',
+            icon: <LogoutIcon />
+        }
+    ];
+
     const handleNewTermDialogClose = () => {
         setOpenNewTermDialog(false);
     }

src/components/SearchResults/ListView.jsx

@@ -13,9 +13,11 @@ const { gray200, gray500, gray700, brand50, brand200, brand600, brand700, error5
 
 const TitleSection = ({ searchResult }) => {
     const navigate = useNavigate();
+    const { user } = useContext(GlobalDataContext);
 
     const handleClick = (e, term) => {
-        navigate(`/view?searchTerm=${term}`);
+        const groupName = user?.groupname || 'base';
+        navigate(`/${groupName}/${term}/overview`);
     };
 
     return (
@@ -131,11 +133,12 @@ const InfoSection = ({ searchResult }) => {
 
 const ListView = ({ searchResults, loading }) => {
     const navigate = useNavigate();
-    const { updateStoredSearchTerm } = useContext(GlobalDataContext);
+    const { updateStoredSearchTerm, user } = useContext(GlobalDataContext);
 
     const handleClick = (searchResult) => {
-        updateStoredSearchTerm(searchResult?.label)
-        navigate(`/view?searchTerm=${searchResult?.ilx}`);
+        updateStoredSearchTerm(searchResult?.label);
+        const groupName = user?.groupname || 'base';
+        navigate(`/${groupName}/${searchResult?.ilx}/overview`);
     };
 
 

src/components/SingleTermView/OverView/OverView.jsx

@@ -12,7 +12,7 @@ import RawDataViewer from "./RawDataViewer";
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { getMatchTerms, getRawData } from "../../../api/endpoints/apiService";
 
-const OverView = ({ searchTerm, isCodeViewVisible, selectedDataFormat }) => {
+const OverView = ({ searchTerm, isCodeViewVisible, selectedDataFormat, group = "base" }) => {
   const [data, setData] = useState(null);
   const [loading, setLoading] = useState(true);
   const [jsonData, setJsonData] = useState(null);
@@ -21,21 +21,21 @@ const OverView = ({ searchTerm, isCodeViewVisible, selectedDataFormat }) => {
   const fetchTerms = useCallback(
     debounce((searchTerm) => {
       if (searchTerm) {
-        getMatchTerms("base", searchTerm).then(data => {
+        getMatchTerms(group, searchTerm).then(data => {
           console.log("data from api call: ", data)
           setData(data?.results?.[0]);
           setLoading(false);
         });
       }
     }, 300),
-    []
+    [group]
   );
 
   const fetchJSONFile = useCallback(() => {
-    getRawData("base", searchTerm, 'jsonld').then(rawResponse => {
+    getRawData(group, searchTerm, 'jsonld').then(rawResponse => {
       setJsonData(rawResponse);
     })
-  }, [searchTerm]);
+  }, [searchTerm, group]);
 
   useEffect(() => {
     setLoading(true);
@@ -75,7 +75,8 @@ const OverView = ({ searchTerm, isCodeViewVisible, selectedDataFormat }) => {
 OverView.propTypes = {
   searchTerm: PropTypes.string,
   isCodeViewVisible: PropTypes.bool,
-  selectedDataFormat: PropTypes.string
+  selectedDataFormat: PropTypes.string,
+  group: PropTypes.string
 }
 
 export default OverView;