Update routing and components to handle activePgroup in URLs

Modified navigation to include activePgroup as a query parameter. Updated ResultsView, SampleTracker, and ResultGrid components to utilize activePgroup for contextual filtering based on the URL. This ensures proper grouping and improved parameter handling across the application.

frontend/src/components/BeamtimeOverview.tsx

@@ -119,7 +119,7 @@ const BeamtimeOverview: React.FC<BeamtimeOverviewProps> = ({ activePgroup }) =>
 
     // Navigate to the ResultsView page for the selected beamtime
     const handleViewResults = (beamtimeId: number) => {
-        navigate(`/results/${beamtimeId}`); // Pass the beamtimeId in the URL
+        navigate(`/results/${beamtimeId}?pgroup=${activePgroup}`);
     };
 
     return (

frontend/src/components/ResultGrid.tsx

@@ -13,7 +13,6 @@ import HourglassEmptyIcon from '@mui/icons-material/HourglassEmpty';
 
 
 
-
 // Extend your image info interface if needed.
 interface ImageInfo {
     id: number;

frontend/src/pages/ResultsView.tsx

@@ -1,13 +1,16 @@
 import React from 'react';
-import { useParams } from 'react-router-dom';
+import { useParams, useSearchParams} from 'react-router-dom';
 import SampleTracker from '../components/SampleTracker';
 import ResultGrid from '../components/ResultGrid';
 
+
 interface ResultsViewProps {}
 
 const ResultsView: React.FC<ResultsViewProps> = () => {
     // Get the selected beamtime ID from the URL
     const { beamtimeId } = useParams();
+    const [searchParams] = useSearchParams();
+    const activePgroup = searchParams.get("pgroup") ?? '';
 
     return (
         <div>
@@ -15,8 +18,8 @@ const ResultsView: React.FC<ResultsViewProps> = () => {
             <h2>Results for Beamtime ID: {beamtimeId}</h2>
 
             {/* Use the beamtimeId to filter or query specific results */}
-            <SampleTracker activePgroup={`beamtime_${beamtimeId}`} />
-            <ResultGrid activePgroup={`beamtime_${beamtimeId}`} />
+            <SampleTracker activePgroup={activePgroup} beamtimeId={beamtimeId} />
+            <ResultGrid activePgroup={activePgroup} beamtimeId={beamtimeId} />
         </div>
     );
 };