visualize-admin · mburri · May 29, 2026 · May 20, 2026 · May 20, 2026 · May 26, 2026
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -29,7 +29,7 @@ You can also check the
     makes Visualize winding order agnostic and fixes a specific bug with newer
     CCW geometries from Swisstopo where map diagrams were zoomed to the world
     instead of Switzerland (older geometries all had CW winding order).
-  - Improve dimension values query performance. 
+  - Improve dimension values query performance.
 - Maintenance
   - Remove Google Analytics integration (it is no longer in use)
   - Set Maptiler API key from `MAPTILER_API_KEY` environment variable at
@@ -40,6 +40,7 @@ You can also check the
   - Remove dependencies which used old versions of `node-fetch`
   - Upgrade dependencies which used old versions of `nth-check`
   - Updated `@deck.gl/*` packages and `fast-xml-parser`
+  - Upgrade playwright to v1.60
   - Rename package
 - Documentation
   - Add publiccode.yml for discoverability

diff --git a/app/docs/chart-selection-tabs.docs.mdx b/app/docs/chart-selection-tabs.docs.mdx
@@ -3,28 +3,31 @@ import {
   ConfiguratorStateConfiguringChart,
   ConfiguratorStateProvider,
 } from "@/configurator";
-import palmerPenguinsFixture from "@/test/__fixtures/config/int/scatterplot-palmer-penguins.json";
-import { Canvas, Meta } from '@storybook/blocks';
-import * as ChartSelectionTabsStories from './chart-selection-tabs.stories';
+import scatterplotGreenhouseGasesFixture from "@/test/__fixtures/config/int/scatterplot-greenhouse-gases.json";
+import { Canvas, Meta } from "@storybook/blocks";
+import * as ChartSelectionTabsStories from "./chart-selection-tabs.stories";
 
-> Chart Selection Tabs are used in ChartPreview and ChartPublished to enable selecting a chart type in any stage of creating a chart.
+> Chart Selection Tabs are used in ChartPreview and ChartPublished to enable
+> selecting a chart type in any stage of creating a chart.
 
-They can be either _editable_, to display a button to show ChartTypeSelector (used when creating a chart) or not, to disable that functionality (used in published charts).
+They can be either _editable_, to display a button to show ChartTypeSelector
+(used when creating a chart) or not, to disable that functionality (used in
+published charts).
 
 <Meta of={ChartSelectionTabsStories} />
 
-
 ## Editable
 
 <Canvas of={ChartSelectionTabsStories.Editable} />
 
-
 ## Non-editable
 
 <Canvas of={ChartSelectionTabsStories.NonEditable} />
 
 ## For developers
 
-This component is based on MUI's Tabs & Tab components, styled in the federal theme.
+This component is based on MUI's Tabs & Tab components, styled in the federal
+theme.
 
-Currently it does not support multiple tabs, as this will be implemented together with chart composition.
+Currently it does not support multiple tabs, as this will be implemented
+together with chart composition.
diff --git a/app/docs/chart-selection-tabs.stories.tsx b/app/docs/chart-selection-tabs.stories.tsx
@@ -2,7 +2,7 @@ import { Meta, StoryObj } from "@storybook/react";
 
 import { ChartSelectionTabs } from "@/components/chart-selection-tabs";
 import { ConfiguratorState, ConfiguratorStateProvider } from "@/configurator";
-import palmerPenguinsFixture from "@/test/__fixtures/config/int/scatterplot-palmer-penguins.json";
+import scatterplotGreenhouseGasesFixture from "@/test/__fixtures/config/int/scatterplot-greenhouse-gases.json";
 
 type Story = StoryObj<typeof ChartSelectionTabs>;
 const meta: Meta<typeof ChartSelectionTabs> = {
@@ -12,7 +12,7 @@ const meta: Meta<typeof ChartSelectionTabs> = {
     (Story, ctx) => {
       return (
         <ConfiguratorStateProvider
-          chartId={palmerPenguinsFixture.key}
+          chartId={scatterplotGreenhouseGasesFixture.key}
           initialState={ctx.parameters.state as ConfiguratorState}
           allowDefaultRedirect={false}
         >
@@ -27,7 +27,7 @@ export const Editable: Story = {
   args: {},
   parameters: {
     state: {
-      ...palmerPenguinsFixture.data,
+      ...scatterplotGreenhouseGasesFixture.data,
       state: "CONFIGURING_CHART",
     },
   },
@@ -37,7 +37,7 @@ export const NonEditable: Story = {
   args: {},
   parameters: {
     state: {
-      ...palmerPenguinsFixture.data,
+      ...scatterplotGreenhouseGasesFixture.data,
       state: "PUBLISHING",
     },
   },

diff --git a/app/package.json b/app/package.json
@@ -196,8 +196,7 @@
     "@lingui/cli": "^4.0.0",
     "@lingui/macro": "^4.0.0",
     "@mdx-js/loader": "^1.6.22",
-    "@playwright-testing-library/test": "^4.5.0",
-    "@playwright/test": "^1.49.1",
+    "@playwright/test": "^1.60.0",
     "@svgr/cli": "^7",
     "@types/autosuggest-highlight": "^3.2.0",
     "@types/clownface": "^2.0.7",
@@ -249,7 +248,6 @@
     "eslint-plugin-unused-imports": "^4.1.4",
     "io-ts-to-json-schema": "^0.2.0",
     "jsdom": "^26.1.0",
-    "playwright-testing-library": "^4.5.0",
     "prettier": "^3.2.5"
   }
 }
diff --git a/app/test/__fixtures/config/int/bathing-water-quality-hierarchie.json b/app/test/__fixtures/config/int/bathing-water-quality-hierarchie.json
@@ -15,9 +15,9 @@
         "it": ""
       }
     },
-    "dataSet": "https://environment.ld.admin.ch/foen/ubd0104/11",
+    "dataSet": "https://environment.ld.admin.ch/foen/ubd01041prod/13",
     "dataSource": {
-      "url": "https://int.cached.lindas.admin.ch/query",
+      "url": "https://cached.lindas.admin.ch/query",
       "type": "sparql"
     },
     "chartConfig": {
@@ -27,18 +27,18 @@
             "sortingType": "byAuto",
             "sortingOrder": "asc"
           },
-          "componentIri": "https://environment.ld.admin.ch/foen/ubd0104/dateofprobing"
+          "componentIri": "https://environment.ld.admin.ch/foen/ubd01041prod/dateofprobing"
         },
         "y": {
-          "componentIri": "https://environment.ld.admin.ch/foen/ubd0104/value"
+          "componentIri": "https://environment.ld.admin.ch/foen/ubd01041prod/value"
         }
       },
       "filters": {
-        "https://environment.ld.admin.ch/foen/ubd0104/location": {
+        "https://environment.ld.admin.ch/foen/ubd01041prod/location": {
           "type": "single",
-          "value": "https://ld.admin.ch/dimension/bgdi/inlandwaters/bathingwater/CH19007"
+          "value": "https://ld.admin.ch/dimension/bgdi/inlandwaters/bathingwater/CH21089"
         },
-        "https://environment.ld.admin.ch/foen/ubd0104/parametertype": {
+        "https://environment.ld.admin.ch/foen/ubd01041prod/parametertype": {
           "type": "single",
           "value": "E.coli"
         }
@@ -62,7 +62,7 @@
         "dataFilters": {
           "active": true,
           "componentIris": [
-            "https://environment.ld.admin.ch/foen/ubd0104/location"
+            "https://environment.ld.admin.ch/foen/ubd01041prod/location"
           ]
         },
         "calculation": {

diff --git a/app/test/__fixtures/config/int/column-heavy-metals.json b/app/test/__fixtures/config/int/column-heavy-metals.json
@@ -15,10 +15,10 @@
         "it": ""
       }
     },
-    "dataSet": "https://environment.ld.admin.ch/foen/ubd0066/15",
+    "dataSet": "https://environment.ld.admin.ch/foen/ubd006601/5",
     "dataSource": {
       "type": "sparql",
-      "url": "https://int.cached.lindas.admin.ch/query"
+      "url": "https://cached.lindas.admin.ch/query"
     },
     "chartConfig": {
       "version": "1.2.1",
@@ -28,20 +28,20 @@
             "sortingType": "byDimensionLabel",
             "sortingOrder": "asc"
           },
-          "componentIri": "https://environment.ld.admin.ch/foen/ubd0066/messparameter"
+          "componentIri": "https://environment.ld.admin.ch/foen/ubd006601/messparameter"
         },
         "y": {
-          "componentIri": "https://environment.ld.admin.ch/foen/ubd0066/wert"
+          "componentIri": "https://environment.ld.admin.ch/foen/ubd006601/wert"
         }
       },
       "filters": {
         "https://environment.ld.admin.ch/foen/ubd0066/station": {
           "type": "single",
-          "value": "https://environment.ld.admin.ch/foen/ubd0066/Station/100_1"
+          "value": "https://environment.ld.admin.ch/foen/ubd006601/Station/100_1"
         },
         "https://environment.ld.admin.ch/foen/ubd0066/samplingperiod": {
           "type": "single",
-          "value": "https://environment.ld.admin.ch/foen/ubd0066/samplingperiod/1"
+          "value": "https://environment.ld.admin.ch/foen/ubd006601/samplingperiod/1"
         }
       },
       "chartType": "column",

diff --git a/app/test/__fixtures/config/int/configs.ts b/app/test/__fixtures/config/int/configs.ts
@@ -18,7 +18,7 @@ export const configs: TestConfig[] = [
   },
   {
     chartId: "cfNkIaMvN_xL",
-    name: "Scatterplot - Palmer Penguins",
-    slug: "scatterplot-palmer-penguins",
+    name: "Scatterplot - Greenhouse Gases",
+    slug: "scatterplot-greenhouse-gases",
   },
 ];
diff --git a/app/test/__fixtures/config/int/pie-red-list.json b/app/test/__fixtures/config/int/pie-red-list.json
@@ -1,59 +1,145 @@
 {
   "key": "Z6Re21LHbOoP",
   "data": {
-    "dataSet": "https://environment.ld.admin.ch/foen/UBD003002/5",
+    "version": "5.3.0",
+    "state": "CONFIGURING_CHART",
     "dataSource": {
       "type": "sparql",
-      "url": "https://int.cached.lindas.admin.ch/query"
+      "url": "https://cached.lindas.admin.ch/query"
     },
-    "meta": {
-      "title": {
-        "de": "",
-        "fr": "",
-        "it": "",
-        "en": "Amphibians red list status"
-      },
-      "description": { "de": "", "fr": "", "it": "", "en": "" }
-    },
-    "chartConfig": {
-      "version": "1.2.1",
-      "chartType": "pie",
-      "filters": {
-        "https://environment.ld.admin.ch/foen/UBD003002/artengruppe": {
-          "type": "single",
-          "value": "https://environment.ld.admin.ch/foen/UBD003002/ArtenGruppe/AMPH"
+    "layout": {
+      "type": "tab",
+      "meta": {
+        "title": {
+          "de": "",
+          "en": "",
+          "fr": "",
+          "it": ""
+        },
+        "description": {
+          "de": "",
+          "en": "",
+          "fr": "",
+          "it": ""
+        },
+        "label": {
+          "de": "",
+          "en": "",
+          "fr": "",
+          "it": ""
         }
       },
-      "interactiveFiltersConfig": {
-        "legend": { "active": false, "componentIri": "" },
-        "timeRange": {
-          "active": false,
-          "componentIri": "",
-          "presets": { "type": "range", "from": "", "to": "" }
+      "blocks": [
+        {
+          "type": "chart",
+          "key": "soEEFsNM4O7g",
+          "initialized": false
+        }
+      ]
+    },
+    "chartConfigs": [
+      {
+        "key": "soEEFsNM4O7g",
+        "version": "5.3.0",
+        "meta": {
+          "title": {
+            "en": "",
+            "de": "",
+            "fr": "",
+            "it": ""
+          },
+          "description": {
+            "en": "",
+            "de": "",
+            "fr": "",
+            "it": ""
+          },
+          "label": {
+            "en": "",
+            "de": "",
+            "fr": "",
+            "it": ""
+          }
         },
-        "dataFilters": { "active": false, "componentIris": [] }
-      },
-      "fields": {
-        "y": {
-          "componentIri": "https://environment.ld.admin.ch/foen/UBD003002/value"
+        "cubes": [
+          {
+            "iri": "https://environment.ld.admin.ch/foen/ubd003001/10",
+            "filters": {
+              "https://environment.ld.admin.ch/foen/ubd003001(VISUALIZE.ADMIN_COMPONENT_ID_SEPARATOR)https://environment.ld.admin.ch/foen/ubd003001/groupid": {
+                "type": "single",
+                "value": "https://environment.ld.admin.ch/vocabulary/foen_species_classification/100000"
+              }
+            }
+          }
+        ],
+        "interactiveFiltersConfig": {
+          "legend": {
+            "active": false,
+            "componentId": ""
+          },
+          "timeRange": {
+            "active": false,
+            "componentId": "https://environment.ld.admin.ch/foen/ubd003001(VISUALIZE.ADMIN_COMPONENT_ID_SEPARATOR)https://environment.ld.admin.ch/foen/ubd003001/groupid",
+            "presets": {
+              "type": "range",
+              "from": "",
+              "to": ""
+            }
+          },
+          "dataFilters": {
+            "active": false,
+            "componentIds": [],
+            "defaultValueOverrides": {},
+            "filterTypes": {}
+          },
+          "calculation": {
+            "active": false,
+            "type": "identity"
+          }
         },
-        "segment": {
-          "componentIri": "https://environment.ld.admin.ch/foen/UBD003002/status",
-          "palette": "category10",
-          "sorting": { "sortingType": "byMeasure", "sortingOrder": "asc" },
-          "colorMapping": {
-            "https://environment.ld.admin.ch/foen/UBD003002/Status/DD": "#1f77b4",
-            "https://environment.ld.admin.ch/foen/UBD003002/Status/LC": "#ff7f0e",
-            "https://environment.ld.admin.ch/foen/UBD003002/Status/NT": "#2ca02c",
-            "https://environment.ld.admin.ch/foen/UBD003002/Status/VU": "#d62728",
-            "https://environment.ld.admin.ch/foen/UBD003002/Status/EN": "#9467bd",
-            "https://environment.ld.admin.ch/foen/UBD003002/Status/CR": "#8c564b",
-            "https://environment.ld.admin.ch/foen/UBD003002/Status/RE": "#e377c2",
-            "https://environment.ld.admin.ch/foen/UBD003002/Status/EX": "#7f7f7f"
+        "annotations": [],
+        "limits": {},
+        "conversionUnitsByComponentId": {},
+        "activeField": "segment",
+        "chartType": "pie",
+        "fields": {
+          "y": {
+            "componentId": "https://environment.ld.admin.ch/foen/ubd003001(VISUALIZE.ADMIN_COMPONENT_ID_SEPARATOR)https://environment.ld.admin.ch/foen/ubd003001/value"
+          },
+          "segment": {
+            "componentId": "https://environment.ld.admin.ch/foen/ubd003001(VISUALIZE.ADMIN_COMPONENT_ID_SEPARATOR)https://environment.ld.admin.ch/foen/ubd003001/statuscode",
+            "showValuesMapping": {}
+          },
+          "color": {
+            "type": "segment",
+            "paletteId": "category10",
+            "colorMapping": {
+              "https://environment.ld.admin.ch/vocabulary/iucn_conservation_categories/DD": "#1f77b4",
+              "https://environment.ld.admin.ch/vocabulary/iucn_conservation_categories/LC": "#ff7f0e",
+              "https://environment.ld.admin.ch/vocabulary/iucn_conservation_categories/NT": "#2ca02c",
+              "https://environment.ld.admin.ch/vocabulary/iucn_conservation_categories/VU": "#d62728",
+              "https://environment.ld.admin.ch/vocabulary/iucn_conservation_categories/EN": "#9467bd",
+              "https://environment.ld.admin.ch/vocabulary/iucn_conservation_categories/CR": "#8c564b",
+              "https://environment.ld.admin.ch/vocabulary/iucn_conservation_categories/RE": "#e377c2"
+            }
           }
         }
       }
-    },
-    "activeField": "title"
+    ],
+    "activeChartKey": "soEEFsNM4O7g",
+    "dashboardFilters": {
+      "timeRange": {
+        "active": false,
+        "timeUnit": "",
+        "presets": {
+          "from": "",
+          "to": ""
+        }
+      },
+      "dataFilters": {
+        "componentIds": [],
+        "filters": {}
+      }
+    }
   }
 }