Merge pull request #796 from Kitware/sample-data-toggle

fix(config): Sample data toggle

Author: PaulHax

.env.example

@@ -14,3 +14,6 @@ VITE_ENABLE_REMOTE_SAVE=true
 
 # VolView server remote URL
 VITE_REMOTE_SERVER_URL=http://localhost:4014
+
+# Controls the initial visibility of the Sample Data section.
+VITE_SHOW_SAMPLE_DATA=true

.github/workflows/e2e.yml

@@ -11,6 +11,7 @@ jobs:
     runs-on: ${{ matrix.os }}
     env:
       DOWNLOAD_TIMEOUT: 220000
+      VITE_SHOW_SAMPLE_DATA: true
     steps:
       - uses: actions/checkout@v4
         with:

docs/configuration_file.md

@@ -57,7 +57,7 @@ hdf5, iwi.cbor, mha, nii, nii.gz, nrrd, vtk
 
 When loading files, VolView can automatically convert images to segment groups
 if they follow a naming convention. For example, an image with name like `foo.segmentation.bar`
-will be converted to a segment group for a base image named like `foo.baz`.  
+will be converted to a segment group for a base image named like `foo.baz`.
 The `segmentation` extension is defined by the `io.segmentGroupExtension` key, which takes a
 string. Files `foo.[segmentGroupExtension].bar` will be automatilly converted to segment groups for a base image named `foo.baz`. The default is `''` and will disable the feature.
 
@@ -87,18 +87,6 @@ To configure a key for an action, add its action name and the key(s) under the `
 }
 ```
 
-## Visibility of Sample Data section
-
-Simplify the data browser by hiding the Sample Data expandable section.
-
-```json
-{
-  "dataBrowser": {
-    "hideSampleData": false
-  }
-}
-```
-
 ## Example JSON:
 
 ```json

netlify.toml

@@ -4,6 +4,9 @@
   status = 200
   force = true
   headers = {apikey = "DICOM_WEB_API_KEY"}
+  
+[build.environment]
+  VITE_SHOW_SAMPLE_DATA= "true"
 
 [build]
 command = "sed -i \"s|DICOM_WEB_API_KEY|${DICOM_WEB_API_KEY}|g; s|DICOM_WEB_ADDRESS|${DICOM_WEB_ADDRESS}|g\" netlify.toml && npm run build"

src/io/import/configJson.ts

@@ -4,7 +4,6 @@ import { ACTIONS } from '@/src/constants';
 
 import { useRectangleStore } from '@/src/store/tools/rectangles';
 import { useRulerStore } from '@/src/store/tools/rulers';
-import { useDataBrowserStore } from '@/src/store/data-browser';
 import { usePolygonStore } from '@/src/store/tools/polygons';
 import { useViewStore } from '@/src/store/views';
 import { useWindowingStore } from '@/src/store/view-configs/windowing';
@@ -22,12 +21,6 @@ const layout = z
   })
   .optional();
 
-const dataBrowser = z
-  .object({
-    hideSampleData: z.boolean().optional(),
-  })
-  .optional();
-
 const shortcuts = z.record(zodEnumFromObjKeys(ACTIONS), z.string()).optional();
 
 // --------------------------------------------------------------------------
@@ -81,7 +74,6 @@ const windowing = z
 
 export const config = z.object({
   layout,
-  dataBrowser,
   labels,
   shortcuts,
   io,
@@ -122,10 +114,6 @@ const applyLabels = (manifest: Config) => {
   applyLabelsToStore(usePolygonStore(), polygonLabels);
 };
 
-const applySampleData = (manifest: Config) => {
-  useDataBrowserStore().hideSampleData = !!manifest.dataBrowser?.hideSampleData;
-};
-
 const applyLayout = (manifest: Config) => {
   if (manifest.layout?.gridSize) {
     useViewStore().setLayoutFromGrid(manifest.layout.gridSize);
@@ -157,7 +145,6 @@ const applyWindowing = (manifest: Config) => {
 
 export const applyPreStateConfig = (manifest: Config) => {
   applyLayout(manifest);
-  applySampleData(manifest);
   applyShortcuts(manifest);
   applyIo(manifest);
   applyWindowing(manifest);

src/store/data-browser.ts

@@ -2,7 +2,8 @@ import { defineStore } from 'pinia';
 import { ref } from 'vue';
 
 export const useDataBrowserStore = defineStore('data-browser', () => {
-  const hideSampleData = ref(false);
+  const hideSampleData = ref(import.meta.env.VITE_SHOW_SAMPLE_DATA !== 'true');
+
   return {
     hideSampleData,
   };