From e2e47b4d7042aaa48e6be401a690346c523a75eb Mon Sep 17 00:00:00 2001
From: "Kim, Allen" <allen.kim@ontariohealth.ca>
Date: Wed, 10 Sep 2025 10:56:26 -0400
Subject: [PATCH 1/3] React StrictMode

---
 .storybook/preview.tsx | 15 +++++++++++++++
 src/lib/Map.tsx        | 11 ++++++-----
 2 files changed, 21 insertions(+), 5 deletions(-)
 create mode 100644 .storybook/preview.tsx

diff --git a/.storybook/preview.tsx b/.storybook/preview.tsx
new file mode 100644
index 0000000..c32c085
--- /dev/null
+++ b/.storybook/preview.tsx
@@ -0,0 +1,15 @@
+import React from 'react';
+import type { Preview, Decorator } from '@storybook/react';
+import preview from './preview';
+
+// Wrap all stories in React.StrictMode
+export const decorators: Decorator[] = [
+  (Story) => (
+    <React.StrictMode>
+      <Story />
+    </React.StrictMode>
+  ),
+];
+
+export * from './preview';
+export default preview;
diff --git a/src/lib/Map.tsx b/src/lib/Map.tsx
index 55af0fe..093af64 100644
--- a/src/lib/Map.tsx
+++ b/src/lib/Map.tsx
@@ -35,11 +35,11 @@ export const Map = forwardRef<OlMap | undefined, MapProps>((props, ref) => {
 
   useImperativeHandle(ref, () => map, [map]);
 
-  const mounted = useRef(false);
   const defaultLayer = new TileLayer({ source: new OSM() });
 
   useEffect(() => {
-    if (!mapRef.current || mounted.current) return;
+    if (!mapRef.current) return;
+    // Always create a new map instance on mount
     const mapProps = {
       ...{
         target: mapRef.current,
@@ -50,15 +50,16 @@ export const Map = forwardRef<OlMap | undefined, MapProps>((props, ref) => {
           zoom: 2, // Default zoom level
         }),
       },
-      ...props, // Override with props.view if provided
+      ...props, // Override with props if provided
     };
     const olMap = new OlMap(mapProps);
     setMap(olMap);
-    mounted.current = true;
     return () => {
       olMap.setTarget(undefined);
+      setMap(undefined);
+      console.log('Map unmounted');
     };
-  }, []);
+  }, [mapRef]);
 
   return (
     <MapContext.Provider value={map}>

From 980f535c5802c76bd60c277066b5fb6c2f30c40d Mon Sep 17 00:00:00 2001
From: "Kim, Allen" <allen.kim@ontariohealth.ca>
Date: Wed, 10 Sep 2025 10:56:49 -0400
Subject: [PATCH 2/3] 10.5.1

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 29df4ec..e432b33 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-openlayers",
-  "version": "10.5.0",
+  "version": "10.5.1",
   "description": "React + OpenLayers",
   "author": "Allen Kim",
   "type": "module",

From eb8bf0eea73f3178278c41bbd5eb88e39980cd68 Mon Sep 17 00:00:00 2001
From: "Kim, Allen" <allen.kim@ontariohealth.ca>
Date: Wed, 10 Sep 2025 11:02:03 -0400
Subject: [PATCH 3/3] Combined two preview files

---
 .storybook/preview.ts  | 20 --------------------
 .storybook/preview.tsx | 21 +++++++++++++++++++--
 2 files changed, 19 insertions(+), 22 deletions(-)
 delete mode 100644 .storybook/preview.ts

diff --git a/.storybook/preview.ts b/.storybook/preview.ts
deleted file mode 100644
index 2ad27f4..0000000
--- a/.storybook/preview.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { Preview } from "@storybook/react";
-import './style.css';
-
-const preview: Preview = {
-  parameters: {
-    controls: {
-      matchers: {
-        color: /(background|color)$/i,
-        date: /Date$/,
-      },
-    },
-    options: {
-      storySort: {
-        order: ['Intro', 'Layers', 'Controls', 'Interactions'],
-      },
-    },
-  },
-};
-
-export default preview;
diff --git a/.storybook/preview.tsx b/.storybook/preview.tsx
index c32c085..0cc8884 100644
--- a/.storybook/preview.tsx
+++ b/.storybook/preview.tsx
@@ -1,6 +1,23 @@
 import React from 'react';
 import type { Preview, Decorator } from '@storybook/react';
-import preview from './preview';
+import './style.css';
+
+// Storybook parameters
+const preview: Preview = {
+  parameters: {
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/,
+      },
+    },
+    options: {
+      storySort: {
+        order: ['Intro', 'Layers', 'Controls', 'Interactions'],
+      },
+    },
+  },
+};
 
 // Wrap all stories in React.StrictMode
 export const decorators: Decorator[] = [
@@ -11,5 +28,5 @@ export const decorators: Decorator[] = [
   ),
 ];
 
-export * from './preview';
+// Provides Storybook with your global config.
 export default preview;