simplify config

extensions/cornerstone/src/initWADOImageLoader.js

@@ -42,8 +42,7 @@ export default function initWADOImageLoader(
       // // Patch Mario:
       const authToken = sessionStorage.getItem('ohif-auth-token');
       if (!authToken) {
-        // window.location.href = '/login'; // Kalau mau pakae login tinggal uncomment
+        window.location.href = '/login';
-        window.location.href = '/';
         return;
       }
 

extensions/default/src/Components/SidePanelWithServices.tsx

@@ -26,8 +26,6 @@ const SidePanelWithServices = ({
   const [sidePanelOpen, setSidePanelOpen] = useState(activeTabIndexProp !== null);
   const [activeTabIndex, setActiveTabIndex] = useState(activeTabIndexProp);
   const [tabs, setTabs] = useState(tabsProp ?? panelService.getPanels(side));
-  const [studyInstanceUID, setStudyInstanceUID] = useState('');
-  const [lastActivatedStudyUID, setLastActivatedStudyUID] = useState('');
 
   const handleActiveTabIndexChange = useCallback(({ activeTabIndex }) => {
     setActiveTabIndex(activeTabIndex);
@@ -73,35 +71,11 @@ const SidePanelWithServices = ({
     const activatePanelSubscription = panelService.subscribe(
       panelService.EVENTS.ACTIVATE_PANEL,
       (activatePanelEvent: Types.ActivatePanelEvent) => {
-        const isExpertisePanel = activatePanelEvent.panelId.includes('-exp-');
+        if (sidePanelOpen || activatePanelEvent.forceActive) {
-        const realPanelID = isExpertisePanel
+          const tabIndex = tabs.findIndex(tab => tab.id === activatePanelEvent.panelId);
-          ? activatePanelEvent.panelId.split('-exp-')[0]
+          if (tabIndex !== -1) {
-          : activatePanelEvent.panelId;
+            setActiveTabIndex(tabIndex);
-
+          }
-        // studyInstanceUID = take from activatePanelEvent.panelId after '-exp-
-        setStudyInstanceUID(isExpertisePanel ? activatePanelEvent.panelId.split('-exp-')[1] : null);
-
-        const tabIndex = tabs.findIndex(tab => tab.id === realPanelID);
-
-        if (isExpertisePanel && side === 'right') {
-         // Extract study UID from the panel ID
-         const currentStudyUID = activatePanelEvent.panelId.split('-exp-')[1];
-
-         // Toggle logic - close if same study is clicked again, open if different study
-         if (currentStudyUID === lastActivatedStudyUID && sidePanelOpen) {
-           // Same study - close panel
-           setSidePanelOpen(false);
-           setActiveTabIndex(null);
-           setLastActivatedStudyUID('');
-         } else {
-           // Different study or panel was closed - open panel with new study
-           setSidePanelOpen(true);
-           setActiveTabIndex(tabIndex !== -1 ? tabIndex : null);
-           setStudyInstanceUID(currentStudyUID);
-           setLastActivatedStudyUID(currentStudyUID);
-         }
-        } else if (tabIndex !== -1) {
-          setActiveTabIndex(tabIndex);
         }
       }
     );
@@ -109,7 +83,7 @@ const SidePanelWithServices = ({
     return () => {
       activatePanelSubscription.unsubscribe();
     };
-  }, [tabs, sidePanelOpen, panelService, lastActivatedStudyUID]);
+  }, [tabs, sidePanelOpen, panelService]);
 
   return (
     <SidePanel
@@ -121,8 +95,6 @@ const SidePanelWithServices = ({
       onClose={handleClose}
       onActiveTabIndexChange={handleActiveTabIndexChange}
       expandedWidth={expandedWidth}
-      servicesManager={servicesManager} // Pass servicesManager ke SidePanel
-      studyInstanceUID={studyInstanceUID}
     />
   );
 };

extensions/default/src/DicomWebDataSource/index.js

@@ -88,8 +88,7 @@ function createDicomWebApi(dicomWebConfig, servicesManager) {
 
         const authToken = sessionStorage.getItem('ohif-auth-token');
         if (!authToken) {
-          // window.location.href = '/login'; // Kalau mau pakae login tinggal uncomment
+          window.location.href = '/login';
-          window.location.href = '/';
           return;
         }
         xhrRequestHeaders.Authorization = `Bearer ${authToken}`;

extensions/dicom-pdf/src/viewports/OHIFCornerstonePdfViewport.tsx

@@ -6,8 +6,8 @@ function OHIFCornerstonePdfViewport({ displaySets }) {
   var [url, setUrl] = useState(null);
 
   const sopInstanceUid = displaySets[0].SOPInstanceUID;
-  url = `${window.config.pacs_document_host}:${window.config.pacs_document_port}/rid/IHERetrieveDocument?requestType=DOCUMENT&documentUID=${sopInstanceUid}&preferredContentType=application%2Fpdf`;
+  url = `http://${window.config.pacs_document_host}:${window.config.pacs_document_port}/rid/IHERetrieveDocument?requestType=DOCUMENT&documentUID=${sopInstanceUid}&preferredContentType=application%2Fpdf`;
-  console.log('URL PDF', url);
+  console.log("URL PDF", url);
 
   useEffect(() => {
     document.body.addEventListener('drag', makePdfDropTarget);

platform/app/public/config/default.js

@@ -10,7 +10,7 @@ window.config = {
   extensions: [],
   modes: [],
   customizationService: {},
-  showStudyList: false,
+  showStudyList: true,
   // some windows systems have issues with more than 3 web workers
   maxNumberOfWebWorkers: 3,
   // below flag is for performance reasons, but it might not work for all servers
@@ -29,7 +29,7 @@ window.config = {
   },
   expertise: false, //* Tambahan untuk enable expertise (CustomizableViewportOverlay)
   expertise_host: `https://devone.aplikasi.web.id/one-api/mockup/pacsmwl/Workorder/get_dummy_expertise`, //* Tambahan untuk fetch data Expertise)
-  pacs_document_host: `${window.location.hostname}`,
+  pacs_document_host: `152.42.173.210`,
   pacs_document_port: 8080,
   // filterQueryParam: false,
   // defaultDataSourceName: 'dicomweb',
@@ -51,8 +51,8 @@ window.config = {
       configuration: {
         friendlyName: 'Static WADO Local Data',
         name: 'DCM4CHEE',
-        qidoRoot: `http://${window.location.hostname}:5000/rs`,
+        qidoRoot: `http://152.42.173.210:5000/rs`,
-        wadoRoot: `http://${window.location.hostname}:5000/rs`,
+        wadoRoot: `http://152.42.173.210:5000/rs`,
         qidoSupportsIncludeField: false,
         supportsReject: true,
         supportsStow: true,

platform/app/public/config/google-local.js

@@ -1,57 +0,0 @@
-/** @type {AppTypes.Config} */
-window.config = {
-  routerBasename: '/',
-  pacs_document_host: `http://152.42.173.210`,
-  pacs_document_port: 8585,
-  goProxyHost: `http://152.42.173.210:5555`,
-  expertise: false, //* Tambahan untuk enable expertise (CustomizableViewportOverlay)
-  expertise_host: `https://devone.aplikasi.web.id/one-api/mockup/pacsmwl/Workorder/get_dummy_expertise`, //* Tambahan untuk fetch data Expertise)
-  enableGoogleCloudAdapter: false,
-  // below flag is for performance reasons, but it might not work for all servers
-  showWarningMessageForCrossOrigin: true,
-  showCPUFallbackMessage: true,
-  showLoadingIndicator: true,
-  strictZSpacingForVolumeViewport: true,
-  extensions: [],
-  modes: [],
-  showStudyList: false,
-  // filterQueryParam: false,
-  defaultDataSourceName: 'dicomweb',
-  dataSources: [
-    {
-      namespace: '@ohif/extension-default.dataSourcesModule.dicomweb',
-      sourceName: 'dicomweb',
-      configuration: {
-        friendlyName: 'dcmjs DICOMWeb Server',
-        name: 'GCP',
-        wadoUriRoot: `http://152.42.173.210:5555/dicomWeb`,
-        qidoRoot: `http://152.42.173.210:5555/dicomWeb`,
-        wadoRoot: `http://152.42.173.210:5555/dicomWeb`,
-        qidoSupportsIncludeField: true,
-        imageRendering: 'wadors',
-        thumbnailRendering: 'wadors',
-        enableStudyLazyLoad: true,
-        supportsFuzzyMatching: false,
-        supportsWildcard: true,
-        dicomUploadEnabled: false,
-        omitQuotationForMultipartRequest: true,
-        configurationAPI: 'ohif.dataSourceConfigurationAPI.google',
-      },
-    },
-    {
-      namespace: '@ohif/extension-default.dataSourcesModule.dicomjson',
-      sourceName: 'dicomjson',
-      configuration: {
-        friendlyName: 'dicom json',
-        name: 'json',
-      },
-    },
-    {
-      namespace: '@ohif/extension-default.dataSourcesModule.dicomlocal',
-      sourceName: 'dicomlocal',
-      configuration: {
-        friendlyName: 'dicom local',
-      },
-    },
-  ],
-};

platform/app/public/config/google.js

@@ -1,11 +1,9 @@
 /** @type {AppTypes.Config} */
 window.config = {
   routerBasename: '/',
-  pacs_document_host: `https://${window.location.hostname}`,
+  pacs_document_host: `${window.location.hostname}`,
-  pacs_document_port: 8585,
+  pacs_document_port: 8080,
-  goProxyHost: `https://${window.location.hostname}:5555`,
+  expertise: false,
-  expertise: false, //* Tambahan untuk enable expertise (CustomizableViewportOverlay)
-  expertise_host: `https://devone.aplikasi.web.id/one-api/mockup/pacsmwl/Workorder/get_dummy_expertise`, //* Tambahan untuk fetch data Expertise)
   enableGoogleCloudAdapter: false,
   // below flag is for performance reasons, but it might not work for all servers
   showWarningMessageForCrossOrigin: true,
@@ -24,9 +22,9 @@ window.config = {
       configuration: {
         friendlyName: 'dcmjs DICOMWeb Server',
         name: 'GCP',
-        wadoUriRoot: `https://${window.location.hostname}:5555/dicomWeb`,
+        wadoUriRoot: `http://${window.location.hostname}:5555/dicomWeb`,
-        qidoRoot: `https://${window.location.hostname}:5555/dicomWeb`,
+        qidoRoot: `http://${window.location.hostname}:5555/dicomWeb`,
-        wadoRoot: `https://${window.location.hostname}:5555/dicomWeb`,
+        wadoRoot: `http://${window.location.hostname}:5555/dicomWeb`,
         qidoSupportsIncludeField: true,
         imageRendering: 'wadors',
         thumbnailRendering: 'wadors',

platform/app/public/html-templates/index.html

@@ -14,21 +14,9 @@
       name="mobile-web-app-capable"
       content="yes"
     />
-    <meta
-      property="og:title"
-      content="SAS Dicom Viewer"
-    />
-    <meta
-      property="og:description"
-      content="Web-based Cloud DICOM Viewer by SAS for viewing and analyzing DICOM images. Powered by Open Health Imaging Foundation and Google Cloud Healthcare."
-    />
-    <meta
-      property="og:image"
-      content="<%= PUBLIC_URL %>assets/logo-sismedika.png"
-    />
     <meta
       name="application-name"
-      content="SAS Dicom Viewer"
+      content="OHIF Viewer"
     />
     <meta
       name="apple-mobile-web-app-capable"
@@ -208,7 +196,7 @@
       src="<%= PUBLIC_URL %>init-service-worker.js"
     ></script>
 
-    <title>SAS Dicom Viewer</title>
+    <title>OHIF Viewer</title>
 
     <!-- WEB FONTS -->
     <link
@@ -228,6 +216,7 @@
       }
     </script>
 
+
     <!-- EXTENSIONS -->
     <!-- <script type="text/javascript" src="path/to/some-extension.js"></script>
 
@@ -247,6 +236,7 @@
   <body>
     <noscript> You need to enable JavaScript to run this app. </noscript>
     <div id="react-portal"></div>
-    <div id="root"></div>
+    <div id="root">
+    </div>
   </body>
 </html>

platform/app/public/html-templates/rollbar.html

@@ -14,21 +14,9 @@
       name="mobile-web-app-capable"
       content="yes"
     />
-    <meta
-      property="og:title"
-      content="SAS Dicom Viewer"
-    />
-    <meta
-      property="og:description"
-      content="Web-based Cloud DICOM Viewer by SAS for viewing and analyzing DICOM images. Powered by Open Health Imaging Foundation and Google Cloud Healthcare."
-    />
-    <meta
-      property="og:image"
-      content="<%= PUBLIC_URL %>assets/logo-sismedika.png"
-    />
     <meta
       name="application-name"
-      content="SAS Dicom Viewer"
+      content="OHIF Viewer"
     />
     <meta
       name="apple-mobile-web-app-capable"
@@ -203,7 +191,7 @@
       src="<%= PUBLIC_URL %>init-service-worker.js"
     ></script>
 
-    <title>SAS Dicom Viewer</title>
+    <title>OHIF Viewer</title>
 
     <!-- WEB FONTS -->
     <link

platform/app/src/App.tsx

@@ -63,7 +63,7 @@ function injectAuth() {
           // Check for auth errors (401/403) and redirect to login if needed
           if (this.status === 401 || this.status === 403) {
             window.sessionStorage.removeItem('ohif-auth-token');
-            // window.location.href = '/login'; // Kalau mau pakae login tinggal uncomment
+            window.location.href = '/login';
           }
         } catch (e) {
           console.error('Error handling auth response:', e);

platform/app/src/routes/Login.tsx

@@ -1,7 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { useNavigate, useLocation } from 'react-router-dom';
 import { useUserAuthentication } from '@ohif/ui';
-import { Icons } from '@ohif/ui-next';
 
 const Login = () => {
   const [email, setEmail] = useState('');
@@ -32,7 +31,7 @@ const Login = () => {
 
     try {
       // Use window.config.goProxyHost for authentication endpoint
-      const proxyHost = window.config?.goProxyHost || `https://${window.location.hostname}:5555`;
+      const proxyHost = window.config?.goProxyHost || `http://${window.location.hostname}:5555`;
       const authEndpoint = `${proxyHost}/auth/login`;
 
       // Call go-ohif-proxy login endpoint
@@ -84,13 +83,8 @@ const Login = () => {
 
   return (
     <div className="flex h-screen w-screen items-center justify-center bg-black">
-      <div className="bg-popover w-88 rounded p-8 shadow-lg">
+      <div className="bg-primary-dark w-96 rounded p-8 shadow-lg">
-        <div className="mb-4 flex justify-center">
+        <h1 className="mb-8 text-center text-2xl font-bold text-white">Login to OHIF Viewer</h1>
-          <Icons.OHIFLogo className="h-12 text-white" />
-        </div>
-
-        <h2 className="text-md text-center font-bold text-white">Login to</h2>
-        <h1 className="mb-8 text-center text-2xl font-bold text-white">Cloud DICOM Viewer</h1>
 
         {error && <div className="mb-4 rounded bg-red-800 px-4 py-2 text-white">{error}</div>}
 
@@ -126,9 +120,6 @@ const Login = () => {
               {isLoading ? 'Logging in...' : 'Log In'}
             </button>
           </div>
-          <p className="text-muted-foreground mt-8 text-center text-sm">
-            Powered by OHIF & Google Cloud DICOM Storage
-          </p>
         </form>
       </div>
     </div>

platform/app/src/routes/ShortlinkLogin.tsx

@@ -1,7 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { useNavigate, useLocation } from 'react-router-dom';
 import { useUserAuthentication } from '@ohif/ui';
-import { Icons } from '@ohif/ui-next';
 
 const ShortlinkLogin = () => {
   const [dob, setDob] = useState('');
@@ -23,7 +22,7 @@ const ShortlinkLogin = () => {
       // No short token found, redirect to regular login
       setError('No shortlink token found in URL');
       setTimeout(() => {
-        navigate('/', { replace: true });
+        navigate('/login', { replace: true });
       }, 3000);
     }
   }, [location.search, navigate]);
@@ -36,7 +35,7 @@ const ShortlinkLogin = () => {
 
     try {
       // Use window.config.goProxyHost for authentication endpoint
-      const proxyHost = window.config?.goProxyHost || `https://${window.location.hostname}:5555`;
+      const proxyHost = window.config?.goProxyHost || `http://${window.location.hostname}:5555`;
       const authEndpoint = `${proxyHost}/auth/shortlink`;
 
       // Call the shortlink authentication endpoint
@@ -94,19 +93,15 @@ const ShortlinkLogin = () => {
 
   return (
     <div className="flex h-screen w-screen items-center justify-center bg-black">
-      <div className="bg-popover w-88 rounded p-8 shadow-lg">
+      <div className="bg-primary-dark w-96 rounded p-8 shadow-lg">
-        <div className="mb-4 flex justify-center">
+        <h1 className="mb-8 text-center text-2xl font-bold text-white">Patient Access</h1>
-          <Icons.OHIFLogo className="h-12 text-white" />
-        </div>
-
-        <h1 className="mb-8 text-center text-2xl font-bold text-white">Cloud DICOM Viewer</h1>
 
         {error && <div className="mb-4 rounded bg-red-800 px-4 py-2 text-white">{error}</div>}
 
         <form onSubmit={handleSubmit}>
           <div className="mb-6">
             <label className="mb-2 block text-sm font-bold text-white">
-              Masukkan tanggal lahir Anda:
+              Please enter your date of birth
             </label>
             <input
               type="date"
@@ -124,12 +119,9 @@ const ShortlinkLogin = () => {
               className="focus:shadow-outline w-full rounded bg-blue-500 py-2 px-4 font-bold text-white hover:bg-blue-700 focus:outline-none"
               disabled={isLoading || !shortToken}
             >
-              {isLoading ? 'Verifying...' : 'View'}
+              {isLoading ? 'Verifying...' : 'Access My Images'}
             </button>
           </div>
-          <p className="text-muted-foreground mt-8 text-center text-sm">
-            Powered by OHIF & Google Cloud DICOM Storage
-          </p>
         </form>
       </div>
     </div>

platform/app/src/utils/initUserAuthenticationService.js

@@ -25,8 +25,7 @@ export function initializeCustomAuth(userAuthenticationService) {
       window.sessionStorage.removeItem('ohif-auth-token');
 
       // Redirect to login page with the redirect URL in query params
-      // window.location.href = `/login?redirect=${encodeURIComponent(currentPath)}`;
+      window.location.href = `/login?redirect=${encodeURIComponent(currentPath)}`;
-      window.location.href = '/';
 
       // Return null to prevent rendering while redirecting
       return null;

platform/ui-next/src/components/SidePanel/SidePanel.tsx

@@ -4,7 +4,6 @@ import React, { useCallback, useEffect, useState } from 'react';
 import { Icons } from '../Icons';
 import { TooltipTrigger, TooltipContent, TooltipProvider, Tooltip } from '../Tooltip';
 import { Separator } from '../Separator';
-import { ScrollArea } from '../ScrollArea';
 
 type StyleMap = {
   open: {
@@ -153,23 +152,10 @@ const SidePanel = ({
   onClose,
   expandedWidth = 280,
   onActiveTabIndexChange,
-  servicesManager, // Tambah servicesManager as a prop
-  studyInstanceUID,
 }) => {
   const [panelOpen, setPanelOpen] = useState(activeTabIndexProp !== null);
   const [activeTabIndex, setActiveTabIndex] = useState(0);
 
-  const [isExpertiseVisible, setIsExpertiseVisible] = useState(false); // New state for expertise visibility
-  const [expertiseData, setExpertiseData] = useState(null);
-  const [isExpertiseLoading, setIsExpertiseLoading] = useState(false);
-
-  const { cornerstoneViewportService } = servicesManager.services;
-  const [viewportData, setViewportData] = useState(null);
-
-  // Harusnya (viewportId), tapi karena gabutuh perubahan viewport maka dihardcode 'default'
-  // const viewportInfo = cornerstoneViewportService.getViewportInfo('default');
-  // const studyInstanceUID = viewportInfo?.viewportData?.data?.[0]?.StudyInstanceUID || '';
-
   const styleMap = createStyleMap(expandedWidth, borderSize, collapsedWidth);
   const baseStyle = createBaseStyle(expandedWidth);
   const gridAvailableWidth = expandedWidth - closeIconWidth - gridHorizontalPadding;
@@ -210,16 +196,6 @@ const SidePanel = ({
     updateActiveTabIndex(activeTabIndexProp);
   }, [activeTabIndexProp, updateActiveTabIndex]);
 
-  const toggleExpertiseVisibility = () => {
-    const shouldOpenExpertise = !isExpertiseVisible;
-    setIsExpertiseVisible(shouldOpenExpertise);
-
-    // Open the side panel if the expertise panel is being shown
-    if (shouldOpenExpertise && !panelOpen) {
-      updatePanelOpen(true);
-    }
-  };
-
   const getCloseStateComponent = () => {
     const _childComponents = Array.isArray(tabs) ? tabs : [tabs];
     return (
@@ -279,235 +255,6 @@ const SidePanel = ({
     );
   };
 
-  // Tambahkan di atas useEffect fetchExpertiseData
-  useEffect(() => {
-    const fetchAccessionNumber = async () => {
-      if (!studyInstanceUID) {
-        console.warn('No StudyInstanceUID available');
-        return;
-      }
-
-      try {
-        const qidoRootUrl = getQidoRootUrl();
-        if (!qidoRootUrl) {
-          console.warn('QIDO root URL not configured');
-          return;
-        }
-
-        // Create request headers with Authorization if token exists
-        const authToken = window.sessionStorage.getItem('ohif-auth-token');
-
-        const headers: HeadersInit = {};
-        if (authToken) {
-          headers['Authorization'] = `Bearer ${authToken}`;
-        }
-
-        // Fetch data with specific fields including Accession Number
-        const response = await fetch(
-          `${qidoRootUrl}/studies?includefield=00080050&StudyInstanceUID=${studyInstanceUID}`,
-          {
-            headers,
-          }
-        );
-
-        if (!response.ok) {
-          throw new Error('Failed to fetch study data');
-        }
-
-        const data = await response.json();
-
-        if (data && data.length > 0) {
-          // Extract accession number from DICOM tag 00080050
-          const accessionNumber = data[0]['00080050']?.Value?.[0] || '';
-
-          // If we have an accession number, call fetchExpertiseData
-          if (accessionNumber) {
-            console.log('Found Accession Number:', accessionNumber);
-            fetchExpertiseData(accessionNumber);
-          } else {
-            console.warn('Accession number not found in study data');
-          }
-        } else {
-          console.warn('No study data returned');
-        }
-      } catch (error) {
-        console.error('Error fetching accession number:', error);
-      }
-    };
-
-    // Helper function to get QIDO root URL
-    const getQidoRootUrl = () => {
-      const { config } = window;
-      if (!config?.dataSources || !config.defaultDataSourceName) {
-        return null;
-      }
-
-      const dataSource = config.dataSources.find(
-        ds => ds.sourceName === config.defaultDataSourceName
-      );
-
-      return dataSource?.configuration?.qidoRoot;
-    };
-
-    fetchAccessionNumber();
-  }, [studyInstanceUID]); // Run when studyInstanceUID changes
-
-  // Ubah fungsi fetchExpertiseData menjadi dengan parameter accessionNumber
-  const fetchExpertiseData = async accessionNumber => {
-    try {
-      // Check if window.config.expertise_host exists
-      if (!window.config?.expertise_host) {
-        console.warn('Expertise host not configured in window.config.expertise_host');
-        return;
-      }
-
-      if (!accessionNumber) {
-        console.warn('No accession number available for expertise lookup');
-        return;
-      }
-
-      setIsExpertiseLoading(true);
-      const url = `${window.config.expertise_host}?accessionNo=${accessionNumber}`;
-
-      const response = await fetch(url);
-      const data = await response.json();
-      if (data?.status === 'OK' && data?.data) {
-        // Create expertise data in the format expected by your component
-        const formattedExpertiseData = {
-          ordering_physician: data.data.senderDoctorName,
-          radiologist: data.data.pjDoctorName,
-          expertise_dttm: data.data.expTime,
-          // Convert the expertise object to a string format that parseExpertise can handle
-          expertise: formatExpertiseToString(data.data.expertise),
-        };
-
-        setExpertiseData(formattedExpertiseData);
-      }
-    } catch (error) {
-      console.error('Error fetching expertise data:', error);
-    } finally {
-      setIsExpertiseLoading(false);
-    }
-  };
-
-  // Helper function to convert expertise object to string format
-  const formatExpertiseToString = expertiseObj => {
-    if (!expertiseObj) return '';
-
-    let result = '';
-
-    // Add each section with proper formatting
-    if (expertiseObj.Indikasi) {
-      result += `KLINIS: ${expertiseObj.Indikasi}\r\n`;
-    }
-
-    if (expertiseObj.Teknik) {
-      result += `TEKNIK: ${expertiseObj.Teknik}\r\n\r\n`;
-    }
-
-    if (expertiseObj.Deskripsi) {
-      result += `KETERANGAN:\r\n${expertiseObj.Deskripsi.replace(/\n/g, '\r\n')}\r\n\r\n`;
-    }
-
-    if (expertiseObj.Kesan) {
-      result += `KESAN: ${expertiseObj.Kesan}`;
-    }
-
-    return result;
-  };
-
-  const getExpertisePanel = () => {
-    if (side !== 'right') return null; // Only show in the right side panel
-
-    if (isExpertiseLoading) {
-      return (
-        <div className="flex h-[500px] w-[350px] items-center justify-center text-white">
-          Loading expertise data...
-        </div>
-      );
-    }
-
-    if (!expertiseData) {
-      return null;
-    }
-
-    const parseExpertise = text => {
-      if (!text) return {};
-
-      const result = {};
-      let currentSection = 'Keterangan';
-
-      // Split expertise text by lines and process each line
-      const lines = text.split('\r\n').filter(line => line.trim() !== '');
-
-      lines.forEach(line => {
-        // Check if this is a section header
-        if (line.includes(':') && !line.trim().startsWith('-')) {
-          const parts = line.split(':');
-          currentSection = parts[0].trim();
-          const value = parts[1]?.trim() || '';
-
-          if (value) {
-            if (!result[currentSection]) {
-              result[currentSection] = [];
-            }
-            result[currentSection].push(value);
-          }
-        } else if (line.toLowerCase().includes('kesan')) {
-          currentSection = 'Kesan';
-        } else {
-          // Add line to current section
-          if (!result[currentSection]) {
-            result[currentSection] = [];
-          }
-          result[currentSection].push(line.trim());
-        }
-      });
-
-      return result;
-    };
-
-    const parsedSections = parseExpertise(expertiseData.expertise);
-
-    // Create formatted data structure
-    const formattedData = [
-      { label: 'Dokter Pengirim', value: expertiseData.ordering_physician || '' },
-      { label: 'Dokter Radiologis', value: expertiseData.radiologist || '' },
-      { label: 'Waktu Expertise', value: expertiseData.expertise_dttm || '' },
-    ];
-
-    // Add additional sections from parsed text
-    Object.entries(parsedSections).forEach(([key, value]) => {
-      formattedData.push({
-        label: key,
-        value: Array.isArray(value) ? value : [value],
-      });
-    });
-
-    return (
-      <ScrollArea className="border-input bg-background h-[500px] w-[350px] rounded-md border p-2 text-sm text-white">
-        <h3 className="mb-4 text-lg font-bold">Expertise</h3>
-        {formattedData.map((section, index) => (
-          <div
-            key={index}
-            className="mb-4"
-          >
-            <h5 className="text-base font-bold">{section.label}:</h5>
-            {Array.isArray(section.value) ? (
-              <ul className="list-disc pl-6">
-                {section.value.map((item, idx) => (
-                  <li key={idx}>{item}</li>
-                ))}
-              </ul>
-            ) : (
-              <p>{section.value}</p>
-            )}
-          </div>
-        ))}
-      </ScrollArea>
-    );
-  };
-
   const getCloseIcon = () => {
     return (
       <div
@@ -639,7 +386,6 @@ const SidePanel = ({
             }
             return null;
           })}
-          {getExpertisePanel()} {/* Add expertise panel here */}
         </>
       ) : (
         <React.Fragment>{getCloseStateComponent()}</React.Fragment>
@@ -667,8 +413,6 @@ SidePanel.propTypes = {
   onClose: PropTypes.func,
   onActiveTabIndexChange: PropTypes.func,
   expandedWidth: PropTypes.number,
-  servicesManager: PropTypes.object.isRequired, // Tambah servicesManager prop
-  studyInstanceUID: PropTypes.string, // Tambahkan prop studyInstanceUID
 };
 
 export { SidePanel };

platform/ui-next/src/components/StudyBrowser/StudyBrowser.tsx

@@ -62,8 +62,6 @@ const StudyBrowser = ({
               data-cy="thumbnail-list"
               viewPreset={viewPreset}
               onThumbnailContextMenu={onThumbnailContextMenu}
-              servicesManager={servicesManager} // Pass servicesManager ke Study Item
-              studyInstanceUid={studyInstanceUid}
             />
           </React.Fragment>
         );

platform/ui-next/src/components/StudyItem/StudyItem.tsx

@@ -20,11 +20,7 @@ const StudyItem = ({
   onClickUntrack,
   viewPreset = 'thumbnails',
   onThumbnailContextMenu,
-  servicesManager, // Tambah servicesManager as a prop
-  studyInstanceUid = '',
 }: withAppTypes) => {
-  // FETCHING ACCESSION NUMBER DAN EXPERTISE
-
   return (
     <Accordion
       type="single"
@@ -59,33 +55,15 @@ const StudyItem = ({
           }}
         >
           {isExpanded && displaySets && (
-            <>
+            <ThumbnailList
-              {/* Expertise Button */}
+              thumbnails={displaySets}
-              <div
+              activeDisplaySetInstanceUIDs={activeDisplaySetInstanceUIDs}
-                className="bg-primary-dark hover:bg-primary-active mx-8 my-4 cursor-pointer rounded-lg border border-white py-3 text-center text-white"
+              onThumbnailClick={onClickThumbnail}
-                onClick={() => {
+              onThumbnailDoubleClick={onDoubleClickThumbnail}
-                  // Trigger the expertise panel in the right side panel (segmentation Panel)
+              onClickUntrack={onClickUntrack}
-                  servicesManager.services.panelService.activatePanel(
+              viewPreset={viewPreset}
-                    // '@ohif/extension-cornerstone.panelModule.panelSegmentation-exp',
+              onThumbnailContextMenu={onThumbnailContextMenu}
-                    `@ohif/extension-cornerstone.panelModule.panelSegmentation-exp-${studyInstanceUid}`,
+            />
-                    true
-                  );
-                }}
-              >
-                Expertise
-              </div>
-
-              {/* Thumbnails */}
-              <ThumbnailList
-                thumbnails={displaySets}
-                activeDisplaySetInstanceUIDs={activeDisplaySetInstanceUIDs}
-                onThumbnailClick={onClickThumbnail}
-                onThumbnailDoubleClick={onDoubleClickThumbnail}
-                onClickUntrack={onClickUntrack}
-                viewPreset={viewPreset}
-                onThumbnailContextMenu={onThumbnailContextMenu}
-              />
-            </>
           )}
         </AccordionContent>
       </AccordionItem>
@@ -108,8 +86,6 @@ StudyItem.propTypes = {
   onDoubleClickThumbnail: PropTypes.func,
   onClickUntrack: PropTypes.func,
   viewPreset: PropTypes.string,
-  servicesManager: PropTypes.object.isRequired, // Tambah servicesManager prop
-  studyInstanceUid: PropTypes.string.string,
 };
 
 export { StudyItem };