From d609a0ed3874408a09e65104dede61a7ddc7cea7 Mon Sep 17 00:00:00 2001
From: Tobias Drisch <tobias.drisch@wheregroup.com>
Date: Tue, 24 Oct 2023 16:16:06 +0200
Subject: [PATCH 1/4] fixed double appearances of demo buttons

---
 src/components/DemoContextProvider.js | 31 +++++++++++++++++++--------
 src/components/StoryDetailView.js     | 10 ++++-----
 2 files changed, 26 insertions(+), 15 deletions(-)

diff --git a/src/components/DemoContextProvider.js b/src/components/DemoContextProvider.js
index 5a56d52..4e6ef14 100644
--- a/src/components/DemoContextProvider.js
+++ b/src/components/DemoContextProvider.js
@@ -65,6 +65,13 @@ const DemoContextProvider = ({ children }) => {
   /**
    * enrich storybook mc_meta.json data with thumbnail URL and demo URLs from stories.json
    */
+
+  /*
+componentData.stories.push(_storyData.filter((el) => {
+return  (el.name === 'Catalogue Demo');
+}));
+*/
+
   const applyStorybookDataToMcMeta = ({
     componentData,
     storybookData,
@@ -73,17 +80,23 @@ const DemoContextProvider = ({ children }) => {
   }) => {
     for (var storyId in storybookData.stories) {
       let _storyData = storybookData.stories[storyId];
+      console.log(_storyData);
       let _compName = _storyData.kind.split("/");
       if (typeof _compName[1] !== "undefined" && _compName[1] === compId) {
-        componentData.stories.push(_storyData);
-        componentData.url = url;
-        componentData.demos ||= [];
-        componentData.demos.push({
-          name: _storyData.name === "Example Config" ? "demo" : _storyData.name,
-          url: url + "/iframe.html?id=" + _storyData.id + "&viewMode=story",
-          id: _storyData.id,
-        });
-        componentData.thumbnail = url + "/thumbnails/" + _compName[1] + ".png";
+        if (
+          _storyData.name === "Catalogue Demo" ||
+          _storyData.name === "Example Config"
+        ) {
+          componentData.url = url;
+          componentData.demos ||= [];
+          componentData.demos.push({
+            name: "demo",
+            url: url + "/iframe.html?id=" + _storyData.id + "&viewMode=story",
+            id: _storyData.id,
+          });
+          componentData.thumbnail =
+            url + "/thumbnails/" + _compName[1] + ".png";
+        }
       }
     }
     return componentData;
diff --git a/src/components/StoryDetailView.js b/src/components/StoryDetailView.js
index e993286..6d0e313 100644
--- a/src/components/StoryDetailView.js
+++ b/src/components/StoryDetailView.js
@@ -105,6 +105,8 @@ function StoryDetailView(props) {
     fetchDescription();
   }, [fetchDescription]);
 
+  console.log(componentData.demos);
+
   return (
     <>
       <Grid container>
@@ -170,11 +172,7 @@ function StoryDetailView(props) {
         >
           <Grid container spacing={0}>
             <Grid item xs={12} key="demo_link">
-              <h3>Demos</h3>
-              <Divider
-                variant="fullWidth"
-                sx={{ bgcolor: theme.palette.secondary.main }}
-              ></Divider>
+              <h3> </h3>
 
               <Grid container spacing={2} style={{ marginTop: "0px" }}>
                 {componentData &&
@@ -184,7 +182,7 @@ function StoryDetailView(props) {
                       item
                       xs={6}
                       style={{ marginTop: "16px", paddingTop: "0px" }}
-                      key={demo.id ? demo.id : demo.name}
+                      key={demo.name}
                     >
                       <Button
                         style={{

From 8850ac270717a0cae013606b57f52aed899359e8 Mon Sep 17 00:00:00 2001
From: Tobias Drisch <tobias.drisch@wheregroup.com>
Date: Fri, 24 Nov 2023 15:29:54 +0100
Subject: [PATCH 2/4] Removed Coms, fixed  "Demo" Button appearing twice

---
 src/components/DemoContextProvider.js | 41 +++++++--------------------
 1 file changed, 11 insertions(+), 30 deletions(-)

diff --git a/src/components/DemoContextProvider.js b/src/components/DemoContextProvider.js
index 4e6ef14..0268569 100644
--- a/src/components/DemoContextProvider.js
+++ b/src/components/DemoContextProvider.js
@@ -2,18 +2,6 @@ import React, { useMemo, useState, useRef, useEffect } from "react";
 import PropTypes from "prop-types";
 import { DemoContextProviderCore } from "./DemoContext";
 
-//function camelCaseToDash(str) {
-//  if (typeof str === "string") {
-//    return str.replace(/([a-zA-Z])(?=[A-Z])/g, "$1-").toLowerCase();
-//  }
-//  return "";
-//}
-
-//function storiesJsonElToComponentId(el) {
-//  return camelCaseToDash(el.kind + el.name)
-//    .replace("/", "-")
-//    .replaceAll(" ", "-");
-//}
 
 let storybookUrls = [
   "https://mapcomponents.github.io/react-map-components-maplibre", // MapLibre
@@ -27,14 +15,6 @@ let demoProviderUrls = [
   "https://mapcomponents.github.io/european_wolves_app/mc_meta.json",
 ];
 
-/**
-if (window.location.host.indexOf("mapcomponents.org") === -1) {
-  storybookUrls = [
-    "http://" + window.location.hostname + ":6006", // MapLibre
-  ];
-}
- */
-
 const DemoContextProvider = ({ children }) => {
   const [menuDrawerOpen, setMenuDrawerOpen] = useState(false);
 
@@ -66,12 +46,6 @@ const DemoContextProvider = ({ children }) => {
    * enrich storybook mc_meta.json data with thumbnail URL and demo URLs from stories.json
    */
 
-  /*
-componentData.stories.push(_storyData.filter((el) => {
-return  (el.name === 'Catalogue Demo');
-}));
-*/
-
   const applyStorybookDataToMcMeta = ({
     componentData,
     storybookData,
@@ -83,10 +57,17 @@ return  (el.name === 'Catalogue Demo');
       console.log(_storyData);
       let _compName = _storyData.kind.split("/");
       if (typeof _compName[1] !== "undefined" && _compName[1] === compId) {
-        if (
-          _storyData.name === "Catalogue Demo" ||
-          _storyData.name === "Example Config"
-        ) {
+        if (_storyData.name === "Catalogue Demo") {
+          componentData.url = url;
+          componentData.demos ||= [];
+          componentData.demos.push({
+            name: "demo",
+            url: url + "/iframe.html?id=" + _storyData.id + "&viewMode=story",
+            id: _storyData.id,
+          });
+          componentData.thumbnail =
+            url + "/thumbnails/" + _compName[1] + ".png";
+        } else if (_storyData.name === "Example Config") {
           componentData.url = url;
           componentData.demos ||= [];
           componentData.demos.push({

From f775d300c0194a1d348810cf083746361b5077d5 Mon Sep 17 00:00:00 2001
From: Max Tobias Weber <tobias.weber@wheregroup.com>
Date: Fri, 1 Dec 2023 11:16:12 +0100
Subject: [PATCH 3/4] make sure component demos open in new window

---
 src/components/StoryDetailView.js | 14 +++-----------
 1 file changed, 3 insertions(+), 11 deletions(-)

diff --git a/src/components/StoryDetailView.js b/src/components/StoryDetailView.js
index 6d0e313..ea4b3ef 100644
--- a/src/components/StoryDetailView.js
+++ b/src/components/StoryDetailView.js
@@ -194,17 +194,9 @@ function StoryDetailView(props) {
                           color: theme.palette.common.white,
                           borderRadius: "8px",
                         }}
-                        target="blank"
-                        component={Link}
+                        target="_blank"
                         variant="contained"
-                        to={
-                          "/" +
-                          i18n.resolvedLanguage +
-                          "/demo/" +
-                          componentData.name +
-                          "/" +
-                          (demo.id ? demo.id : demo.name)
-                        }
+                        href={demo.url}
                         key={demo.name}
                       >
                         <span
@@ -254,4 +246,4 @@ function StoryDetailView(props) {
   );
 }
 
-export default StoryDetailView;
\ No newline at end of file
+export default StoryDetailView;

From 0649c1c5e2170e7d4b07fda974bae4efc2c628aa Mon Sep 17 00:00:00 2001
From: Max Tobias Weber <tobias.weber@wheregroup.com>
Date: Fri, 1 Dec 2023 11:16:37 +0100
Subject: [PATCH 4/4] make sure only one demo button per components is shown

---
 src/components/DemoContextProvider.js | 28 +++++++++++++++------------
 1 file changed, 16 insertions(+), 12 deletions(-)

diff --git a/src/components/DemoContextProvider.js b/src/components/DemoContextProvider.js
index 0268569..81e2098 100644
--- a/src/components/DemoContextProvider.js
+++ b/src/components/DemoContextProvider.js
@@ -2,7 +2,6 @@ import React, { useMemo, useState, useRef, useEffect } from "react";
 import PropTypes from "prop-types";
 import { DemoContextProviderCore } from "./DemoContext";
 
-
 let storybookUrls = [
   "https://mapcomponents.github.io/react-map-components-maplibre", // MapLibre
   "https://mapcomponents.github.io/react-map-components-maplibre-lab", // MapLibre-Lab
@@ -52,22 +51,27 @@ const DemoContextProvider = ({ children }) => {
     compId,
     url,
   }) => {
+    let catalogueDemoExists = false;
     for (var storyId in storybookData.stories) {
+      let _compName = storybookData.stories[storyId].kind.split("/");
+      if (
+        typeof _compName[1] !== "undefined" &&
+        _compName[1] === compId &&
+        storybookData.stories[storyId].name === "Catalogue Demo"
+      ) {
+        catalogueDemoExists = true;
+      }
+    }
+
+    for (storyId in storybookData.stories) {
       let _storyData = storybookData.stories[storyId];
       console.log(_storyData);
       let _compName = _storyData.kind.split("/");
       if (typeof _compName[1] !== "undefined" && _compName[1] === compId) {
-        if (_storyData.name === "Catalogue Demo") {
-          componentData.url = url;
-          componentData.demos ||= [];
-          componentData.demos.push({
-            name: "demo",
-            url: url + "/iframe.html?id=" + _storyData.id + "&viewMode=story",
-            id: _storyData.id,
-          });
-          componentData.thumbnail =
-            url + "/thumbnails/" + _compName[1] + ".png";
-        } else if (_storyData.name === "Example Config") {
+        if (
+          _storyData.name === "Catalogue Demo" ||
+          (!catalogueDemoExists && _storyData.name === "Example Config")
+        ) {
           componentData.url = url;
           componentData.demos ||= [];
           componentData.demos.push({