fix(auth): fix the issue with oauth at a non root path (#3840)

extensions/cornerstone-dicom-seg/package.json

@@ -44,8 +44,8 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.20.13",
-    "@cornerstonejs/adapters": "^1.32.2",
+    "@cornerstonejs/adapters": "^1.36.1",
-    "@cornerstonejs/tools": "^1.32.2",
+    "@cornerstonejs/tools": "^1.36.1",
     "@kitware/vtk.js": "27.3.1",
     "react-color": "^2.19.3"
   }

extensions/cornerstone-dicom-sr/package.json

@@ -44,9 +44,9 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.20.13",
-    "@cornerstonejs/adapters": "^1.32.2",
+    "@cornerstonejs/adapters": "^1.36.1",
-    "@cornerstonejs/core": "^1.32.2",
+    "@cornerstonejs/core": "^1.36.1",
-    "@cornerstonejs/tools": "^1.32.2",
+    "@cornerstonejs/tools": "^1.36.1",
     "classnames": "^2.3.2"
   }
 }

extensions/cornerstone/package.json

@@ -36,7 +36,7 @@
     "@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2",
     "@cornerstonejs/codec-openjpeg": "^1.2.2",
     "@cornerstonejs/codec-openjph": "^2.4.2",
-    "@cornerstonejs/dicom-image-loader": "^1.32.2",
+    "@cornerstonejs/dicom-image-loader": "^1.36.1",
     "@ohif/core": "3.8.0-beta.26",
     "@ohif/ui": "3.8.0-beta.26",
     "dcmjs": "^0.29.12",
@@ -52,10 +52,10 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.20.13",
-    "@cornerstonejs/adapters": "^1.32.2",
+    "@cornerstonejs/adapters": "^1.36.1",
-    "@cornerstonejs/core": "^1.32.2",
+    "@cornerstonejs/core": "^1.36.1",
-    "@cornerstonejs/streaming-image-volume-loader": "^1.32.2",
+    "@cornerstonejs/streaming-image-volume-loader": "^1.36.1",
-    "@cornerstonejs/tools": "^1.32.2",
+    "@cornerstonejs/tools": "^1.36.1",
     "@kitware/vtk.js": "27.3.1",
     "html2canvas": "^1.4.1",
     "lodash.debounce": "4.0.8",

extensions/measurement-tracking/package.json

@@ -30,8 +30,8 @@
     "start": "yarn run dev"
   },
   "peerDependencies": {
-    "@cornerstonejs/core": "^1.32.2",
+    "@cornerstonejs/core": "^1.36.1",
-    "@cornerstonejs/tools": "^1.32.2",
+    "@cornerstonejs/tools": "^1.36.1",
     "@ohif/core": "3.8.0-beta.26",
     "@ohif/extension-cornerstone-dicom-sr": "3.8.0-beta.26",
     "@ohif/ui": "3.8.0-beta.26",

platform/app/.webpack/webpack.pwa.js

@@ -166,6 +166,7 @@ module.exports = (env, argv) => {
       //writeToDisk: true,
       historyApiFallback: {
         disableDotRule: true,
+        index: PUBLIC_URL + 'index.html',
       },
       headers: {
         'Cross-Origin-Embedder-Policy': 'require-corp',

platform/app/package.json

@@ -50,8 +50,8 @@
     "@cornerstonejs/codec-charls": "^1.2.3",
     "@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2",
     "@cornerstonejs/codec-openjpeg": "^1.2.2",
-    "@cornerstonejs/codec-openjph": "^2.4.2",
+    "@cornerstonejs/codec-openjph": "^2.4.5",
-    "@cornerstonejs/dicom-image-loader": "^1.32.2",
+    "@cornerstonejs/dicom-image-loader": "^1.36.1",
     "@ohif/core": "3.8.0-beta.26",
     "@ohif/extension-cornerstone": "3.8.0-beta.26",
     "@ohif/extension-cornerstone-dicom-rt": "3.8.0-beta.26",

platform/app/public/serve.json

@@ -0,0 +1,12 @@
+{
+  "rewrites": [{ "source": "*", "destination": "index.html" }],
+  "headers": [
+    {
+      "source": "**/*",
+      "headers": [
+        { "key": "Cross-Origin-Embedder-Policy", "value": "require-corp" },
+        { "key": "Cross-Origin-Opener-Policy", "value": "same-origin" }
+      ]
+    }
+  ]
+}

platform/app/src/utils/OpenIdConnectRoutes.tsx

@@ -147,7 +147,10 @@ function OpenIdConnectRoutes({ oidc, routerBasename, userAuthenticationService }
   const location = useLocation();
   const { pathname, search } = location;
 
-  const redirect_uri = new URL(userManager.settings._redirect_uri).pathname; //.replace(routerBasename,'')
+  const redirect_uri = new URL(userManager.settings._redirect_uri).pathname.replace(
+    routerBasename !== '/' ? routerBasename : '',
+    ''
+  );
   const silent_refresh_uri = new URL(userManager.settings._silent_redirect_uri).pathname; //.replace(routerBasename,'')
   const post_logout_redirect_uri = new URL(userManager.settings._post_logout_redirect_uri).pathname; //.replace(routerBasename,'');
 
@@ -158,7 +161,7 @@ function OpenIdConnectRoutes({ oidc, routerBasename, userAuthenticationService }
   }
 
   return (
-    <Routes basename={routerBasename}>
+    <Routes>
       <Route
         path={silent_refresh_uri}
         onEnter={window.location.reload}

platform/core/package.json

@@ -35,7 +35,7 @@
     "@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2",
     "@cornerstonejs/codec-openjpeg": "^1.2.2",
     "@cornerstonejs/codec-openjph": "^2.4.2",
-    "@cornerstonejs/dicom-image-loader": "^1.32.2",
+    "@cornerstonejs/dicom-image-loader": "^1.36.1",
     "@ohif/ui": "3.8.0-beta.26",
     "cornerstone-math": "0.1.9",
     "dicom-parser": "^1.8.21"

platform/docs/docs/configuration/dataSources/dicom-json.md

@@ -190,5 +190,5 @@ handles this, but Azure does not. Consequently, when you attempt to access a lin
 specific URL, a 404 error will be displayed.
 
 This issue also occurs locally, where the http-server does not handle it. However,
-if you utilize the `serve` package (npx serve ./dist -l 8080 -s), it effectively addresses this problem.
+if you utilize the `serve` package (npx serve ./dist -c ../public/serve.json), it effectively addresses this problem.
 :::

platform/docs/docs/configuration/dataSources/static-files.md

@@ -26,7 +26,7 @@ StaticWado/build/install/StaticWado/bin/StaticWado -d /dicomweb /dicom/study1
 cd /dicomweb
 npx http-server -p 5000 --cors -g
 
-# you can use npx serve ./dist -l 8080 -s as an alternative to http-server
+# you can use npx serve ./dist -l 8080 -c ../public/serve.json as an alternative to http-server
 ```
 
 There is then a dev environment in the platform/app directory which can be

platform/docs/docs/deployment/authorization.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 5
+sidebar_position: 6
 sidebar_label: Authorization
 ---
 

platform/docs/docs/deployment/build-for-production.md

@@ -104,10 +104,7 @@ yarn global add http-server
 # Change the directory to the platform/app
 
 # Serve the files in our current directory
-# Accessible at: `http://localhost:8080`
+npx serve ./dist -c ../public/serve.json
-npx http-server ./dist
-
-# you can use npx serve ./dist -l 8080 -s as an alternative to http-server
 ```
 
 :::caution
@@ -118,25 +115,6 @@ In the video below notice that there is `platform/viewer` which has been renamed
     <iframe src="https://player.vimeo.com/video/551957266?badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479"  frameBorder="0" allow="autoplay; fullscreen; picture-in-picture" allowFullScreen style= {{ position:"absolute",top:0,left:0,width:"100%",height:"100%"}} title="measurement-report"></iframe>
 </div>
 
-### Build for non-root path
-
-If you would like to access the viewer from a non-root path (e.g., `/my-awesome-viewer` instead of `/`),
-You can achieve so by using the `PUBLIC_URL` environment variable AND the `routerBasename` configuration option.
-
-1. use a config (e.g. config/myConfig.js) file that is using the `routerBasename` of your choice `/my-awesome-viewer` (note there is only one / - it is not /my-awesome-viewer/).
-2. build the viewer with `PUBLIC_URL=/my-awesome-viewer/ APP_CONFIG=config/myConfig.js yarn build` (note there are two / - it is not /my-awesome-viewer).
-
-
-:::tip
-The PUBLIC_URL tells the application where to find the static assets and the routerBasename will tell the application how to handle the routes
-:::
-
-:::tip
-Testing, you can use `npx http-server` to serve the files in the generated `dist` folder and access the viewer from `http://localhost:8080/my-awesome-viewer`. To achieve
-so, you should first rename the `dist` folder to `my-awesome-viewer` and then change the working directory
-to the `platform/app` folder and run `npx http-server ./`. Then on the browser, you can access the viewer from `http://localhost:8080/my-awesome-viewer`
-:::
-
 
 ### Automating Builds and Deployments
 

platform/docs/docs/deployment/cors.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 6
+sidebar_position: 7
 ---
 
 # Cross-Origin Information for OHIF

platform/docs/docs/deployment/custom-url-access.md

@@ -0,0 +1,74 @@
+---
+sidebar_position: 4
+title: Custom URL Access/Build
+---
+
+
+## Build for non-root path
+
+Sometimes it is desired to access the viewer from a non-root path (e.g., `/my-awesome-viewer` instead of `/`).
+You can achieve so by using the `PUBLIC_URL` environment variable AND the `routerBasename` configuration option.
+
+1. use a config (e.g. `config/myConfig.js`) file that is using the `routerBasename` of your choice `/my-awesome-viewer` (note there is only one / - it is not /my-awesome-viewer/).
+2. build the viewer with `PUBLIC_URL=/my-awesome-viewer/` (note there are two / - it is not /my-awesome-viewer).
+
+
+:::tip
+The PUBLIC_URL tells the application where to find the static assets and the routerBasename will tell the application how to handle the routes
+:::
+
+
+### Testing in Development
+For testing the build locally, you can use the following command:
+
+```bash
+# we use default config file, so we assume you have already set the routerBasename to /my-awesome-viewer in the default config as an example
+PUBLIC_URL=/my-awesome-viewer/ APP_CONFIG=config/default.js yarn dev
+```
+
+
+### Testing in Build (production)
+You need to build the viewer with the following command:
+
+```bash
+PUBLIC_URL=/my-awesome-viewer/ APP_CONFIG=config/default.js yarn build
+```
+
+We can use the `npx serve` to serve the build folder. There are two things you need to consider however,
+1. You need to change the public/serve.json file to reflect the new routerBasename in the destination (see the example below)
+
+
+```json
+// final serve.json
+{
+  "rewrites": [{ "source": "*", "destination": "my-awesome-viewer/index.html" }],
+  "headers": [
+    {
+      "source": "**/*",
+      "headers": [
+        { "key": "Cross-Origin-Embedder-Policy", "value": "require-corp" },
+        { "key": "Cross-Origin-Opener-Policy", "value": "same-origin" }
+      ]
+    }
+  ]
+}
+```
+
+```bash
+cd platform/app;
+
+# rename the dist folder to my-awesome-viewer
+mv dist my-awesome-viewer
+
+# serve the folder with custom json, note that we are using ../public/serve.json and NOT public/serve.json
+npx serve  -c ./public/serve.json
+```
+
+
+:::note
+When you want to authenticate against a sub path, there are a few things you should keep in mind:
+
+1. Set the `routerBasename` to the sub path and also update the `PUBLIC_URL` to match the sub path.
+2. Don't forget to modify the `serve.json` file as mentioned earlier.
+3. Ensure that the sub path is included in the list of allowed callback URLs. For example, in the Google Cloud dashboard, you can set it in the `Authorized redirect URIs` field under the `Credentials` section of the `APIs & Services` menu.
+:::

platform/docs/docs/deployment/docker.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 4
+sidebar_position: 5
 ---
 
 # Docker

platform/docs/docs/deployment/google-cloud-healthcare.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 9
+sidebar_position: 10
 ---
 
 # Google Cloud Healthcare

platform/docs/docs/deployment/iframe.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 7
+sidebar_position: 8
 sidebar_label: iframe
 ---
 
@@ -47,7 +47,7 @@ Then run the
 ```bash
 npx http-server unzipped-folder
 
-# you can use npx serve ./dist -l 8080 -s as an alternative to http-server
+# you can use npx serve ./dist -c ../public/serve.json as an alternative to http-server
 ```
 
 You should be able to see

platform/docs/docs/deployment/nginx--image-archive.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 8
+sidebar_position: 9
 ---
 
 # Nginx + Image Archive

platform/docs/docs/deployment/user-account-control.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 10
+sidebar_position: 11
 ---
 # User Account Control
 

yarn.lock

@@ -1550,10 +1550,10 @@
   resolved "https://registry.yarnpkg.com/@colors/colors/-/colors-1.5.0.tgz#bb504579c1cae923e6576a4f5da43d25f97bdbd9"
   integrity sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==
 
-"@cornerstonejs/adapters@^1.32.2":
+"@cornerstonejs/adapters@^1.36.1":
-  version "1.32.2"
+  version "1.36.1"
-  resolved "https://registry.yarnpkg.com/@cornerstonejs/adapters/-/adapters-1.32.2.tgz#f67ce50b6eab3a033c3847beeea3a54e4041eb30"
+  resolved "https://registry.yarnpkg.com/@cornerstonejs/adapters/-/adapters-1.36.1.tgz#ce6e1c7213adb629926d360f3fff327b22729846"
-  integrity sha512-ToxwxPp3A2bpR9TAlHasK4h7lQYiGENHIkwJ+Z0zdzrYwPGdFNaEHUk6XsA3vGhl6wWF3DhF7IU18nX20XL7kw==
+  integrity sha512-dfiByBlH0Y97rSoqtGehik+e/Ydm+DNmVIfOpsBfbI6XuMoqBWXtcjI04Lwp5i0i4U64bKfQ8IfHA8UQ8jbrDQ==
   dependencies:
     "@babel/runtime-corejs2" "^7.17.8"
     buffer "^6.0.3"
@@ -1607,10 +1607,10 @@
   resolved "https://registry.yarnpkg.com/@cornerstonejs/codec-openjph/-/codec-openjph-2.4.5.tgz#8690b61a86fa53ef38a70eee9d665a79229517c0"
   integrity sha512-MZCUy8VG0VG5Nl1l58+g+kH3LujAzLYTfJqkwpWI2gjSrGXnP6lgwyy4GmPRZWVoS40/B1LDNALK905cNWm+sg==
 
-"@cornerstonejs/core@^1.32.2":
+"@cornerstonejs/core@^1.36.1":
-  version "1.32.2"
+  version "1.36.1"
-  resolved "https://registry.yarnpkg.com/@cornerstonejs/core/-/core-1.32.2.tgz#02010a5a00c592dfbb7d49880fadd0e0b104af9f"
+  resolved "https://registry.yarnpkg.com/@cornerstonejs/core/-/core-1.36.1.tgz#2fba0945cd5eff303ad7569a16cf7904779f5470"
-  integrity sha512-z1dtIFjrcZ92aJqev5JV0mbRxOqPJnfRlyLn3TzcsPAzpwo8OPa4+iLR3nrXcXkORwPA1MZaA94JxiRAxvbfLA==
+  integrity sha512-4vbXWz/4tlsYqnyI0unyY3yLv3gyn4+ARdPkaNFM03/jx1/8i/yp4r8VlXMds57/2XSzpav3ue9eFwCFuI4rVg==
   dependencies:
     "@kitware/vtk.js" "27.3.1"
     comlink "^4.4.1"
@@ -1618,34 +1618,34 @@
     gl-matrix "^3.4.3"
     lodash.clonedeep "4.5.0"
 
-"@cornerstonejs/dicom-image-loader@^1.32.2":
+"@cornerstonejs/dicom-image-loader@^1.36.1":
-  version "1.32.2"
+  version "1.36.1"
-  resolved "https://registry.yarnpkg.com/@cornerstonejs/dicom-image-loader/-/dicom-image-loader-1.32.2.tgz#0eceac4977562d90899f5454c477a677221eded9"
+  resolved "https://registry.yarnpkg.com/@cornerstonejs/dicom-image-loader/-/dicom-image-loader-1.36.1.tgz#5059a4a45b99052457a222b12cd9207f3b298e13"
-  integrity sha512-sToKM5Ei+zllZl8UL1/3kWRyGZon99ds1lZs2Z4BN/0fr7/TIZCvajslY++JsYE0izUMhgAqaXFZZUNaLWFoqw==
+  integrity sha512-lqkZLECZZKTe+88afX9z1KkejyHfcnpQmTWy5WFUsXW7e0dumrVbEKAxG/UAHYj0iY4RyY/Eo/k+LEZXYjB+YA==
   dependencies:
     "@cornerstonejs/codec-charls" "^1.2.3"
     "@cornerstonejs/codec-libjpeg-turbo-8bit" "^1.2.2"
     "@cornerstonejs/codec-openjpeg" "^1.2.2"
     "@cornerstonejs/codec-openjph" "^2.4.5"
-    "@cornerstonejs/core" "^1.32.2"
+    "@cornerstonejs/core" "^1.36.1"
     dicom-parser "^1.8.9"
     pako "^2.0.4"
     uuid "^9.0.0"
 
-"@cornerstonejs/streaming-image-volume-loader@^1.32.2":
+"@cornerstonejs/streaming-image-volume-loader@^1.36.1":
-  version "1.32.2"
+  version "1.36.1"
-  resolved "https://registry.yarnpkg.com/@cornerstonejs/streaming-image-volume-loader/-/streaming-image-volume-loader-1.32.2.tgz#9d29412f6af470fa4ce46d0b43735eed2aebc374"
+  resolved "https://registry.yarnpkg.com/@cornerstonejs/streaming-image-volume-loader/-/streaming-image-volume-loader-1.36.1.tgz#3cf270b624a40e20a3163cdef338b507da83a29f"
-  integrity sha512-VisVikQrWAfVqg4rozDLv/3T1DHOsiqSfQUVUYIqmL8WP7hC88E9R/aJyrL2uj4J/zAIvxlbWJYN1RdkyaxFyQ==
+  integrity sha512-T9q36aPSUobTD0tJsgwayDKsgxlxVzav0cVOMkHxO10kOGC82DniZBm2WSg5mbn2caFo0YezPUaXfXuGqsqvMg==
   dependencies:
-    "@cornerstonejs/core" "^1.32.2"
+    "@cornerstonejs/core" "^1.36.1"
     comlink "^4.4.1"
 
-"@cornerstonejs/tools@^1.32.2":
+"@cornerstonejs/tools@^1.36.1":
-  version "1.32.2"
+  version "1.36.1"
-  resolved "https://registry.yarnpkg.com/@cornerstonejs/tools/-/tools-1.32.2.tgz#45961a1e6788ee7f660af3f1a013c0410b6ff2f6"
+  resolved "https://registry.yarnpkg.com/@cornerstonejs/tools/-/tools-1.36.1.tgz#bb8e48d2363747b844a268205cb39f1bc39c7ce1"
-  integrity sha512-kGL7m0Vk8OovqArTF8lyj/UpO6VBg+xqNnxnkyKXvi1sbLh7/4woRJS4W8sihOt6XBkMxHTMyHEiHEPHASuKbw==
+  integrity sha512-4Qu9hT+fx0tzPHte01wRsctYRSw8VznAu/xMOCVeniF9kIAxKzXLBvcxhKQS+gFr6HRD5nRxtflKKrKlna8nMw==
   dependencies:
-    "@cornerstonejs/core" "^1.32.2"
+    "@cornerstonejs/core" "^1.36.1"
     comlink "^4.4.1"
     lodash.clonedeep "4.5.0"
     lodash.get "^4.4.2"
@@ -14227,7 +14227,7 @@ media-typer@0.3.0:
   resolved "https://registry.yarnpkg.com/media-typer/-/media-typer-0.3.0.tgz#8710d7af0aa626f8fffa1ce00168545263255748"
   integrity sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==
 
-medium-zoom@^1.0.8:
+medium-zoom@^1.0.4:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/medium-zoom/-/medium-zoom-1.1.0.tgz#6efb6bbda861a02064ee71a2617a8dc4381ecc71"
   integrity sha512-ewyDsp7k4InCUp3jRmwHBRFGyjBimKps/AJLjRSox+2q/2H4p/PNpQf+pwONWlJiOudkBXtbdmVbFjqyybfTmQ==