Bump zustand from 4.1.5 to 5.0.3 (#1270)

* Bump zustand from 4.1.5 to 5.0.3

Bumps [zustand](https://github.com/pmndrs/zustand) from 4.1.5 to 5.0.3.
- [Release notes](https://github.com/pmndrs/zustand/releases)
- [Commits](pmndrs/zustand@v4.1.5...v5.0.3)

---
updated-dependencies:
- dependency-name: zustand
  dependency-type: direct:production
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <[email protected]>

* migrate: zustand v5.

* migrate(zustand): remove non-existant destroy.

* migrate(zustand): set to null instead of destroy (thanks dai-shi!)

* migrate(zustand): work through the type consequences of setting StoreApi to null.

---------

Signed-off-by: dependabot[bot] <[email protected]>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Chris Hallberg <[email protected]>

package.json

@@ -118,7 +118,7 @@
     "react-intersection-observer": "^9.13.0",
     "waveform-panel": "^1.2.0",
     "xss": "1.0.15",
-    "zustand": "^4.0.0-rc.0"
+    "zustand": "^5.0.3"
   },
   "collective": {
     "type": "opencollective",

src/content-handlers/iiif/extensions/uv-openseadragon-extension/Extension.ts

@@ -488,20 +488,23 @@ export default class OpenSeadragonExtension extends BaseExtension<Config> {
     this.extensionHost.subscribe(
       IIIFEvents.SHOW_DOWNLOAD_DIALOGUE,
       (triggerButton) => {
-        this.store.getState().openDownloadDialogue(triggerButton[0]);
+        const state = this.store.getState();
+        if (state !== null) {
+          state.openDownloadDialogue(triggerButton[0]);
+        }
       }
     );
 
     this.extensionHost.subscribe(IIIFEvents.HIDE_DOWNLOAD_DIALOGUE, () => {
-      this.store.getState().closeDialogue();
+      this.closeActiveDialogue();
     });
 
     this.extensionHost.subscribe(IIIFEvents.CLOSE_ACTIVE_DIALOGUE, () => {
-      this.store.getState().closeDialogue();
+      this.closeActiveDialogue();
     });
 
     this.extensionHost.subscribe(IIIFEvents.ESCAPE, () => {
-      this.store.getState().closeDialogue();
+      this.closeActiveDialogue();
     });
 
     // this.component.subscribe(Events.VIEW_PAGE, (e: any, index: number) => {
@@ -696,24 +699,31 @@ export default class OpenSeadragonExtension extends BaseExtension<Config> {
           );
         },
         onClose: () => {
-          this.store.getState().closeDialogue();
+          this.closeActiveDialogue();
         },
         onDownloadCurrentView: (canvas: Canvas) => {
           const viewer: any = this.getViewer();
           window.open(<string>this.getCroppedImageUri(canvas, viewer));
         },
         onDownloadSelection: () => {
-          this.store.getState().closeDialogue();
+          this.closeActiveDialogue();
           this.extensionHost.publish(IIIFEvents.SHOW_MULTISELECT_DIALOGUE);
         },
         onShowTermsOfUse: () => {
-          this.store.getState().closeDialogue();
+          this.closeActiveDialogue();
           this.extensionHost.publish(IIIFEvents.SHOW_TERMS_OF_USE);
         },
       })
     );
   }
 
+  closeActiveDialogue(): void {
+    const state = this.store.getState();
+    if (state !== null) {
+      state.closeDialogue();
+    }
+  }
+
   checkForTarget(): void {
     if (this.data.target) {
       // Split target into canvas id and selector

src/content-handlers/iiif/extensions/uv-openseadragon-extension/Store.ts

@@ -1,5 +1,5 @@
-import create from "zustand/vanilla";
-import { ExtensionState } from "../../modules/uv-shared-module/ExtensionState";
+import { createStore as create } from "zustand/vanilla";
+import type { ExtensionState } from "../../modules/uv-shared-module/ExtensionState";
 
 export interface OpenSeadragonExtensionState extends ExtensionState {}
 

src/content-handlers/iiif/modules/uv-shared-module/BaseExtension.ts

@@ -45,7 +45,7 @@ import {
 import { defaultLocale, isVisible } from "../../../../Utils";
 import { IIIFEvents } from "../../IIIFEvents";
 import { Events } from "../../../../Events";
-import { StoreApi } from "zustand/vanilla";
+import type { StoreApi } from "zustand/vanilla";
 import { ExtensionState } from "./ExtensionState";
 import { BaseConfig, Metric, MetricType } from "../../BaseConfig";
 
@@ -75,7 +75,7 @@ export class BaseExtension<T extends BaseConfig> implements IExtension {
   restrictedDialogue: RestrictedDialogue;
   shell: Shell;
   shifted: boolean = false;
-  store: StoreApi<ExtensionState>;
+  store: StoreApi<ExtensionState | null>; // null for dispose()
   tabbing: boolean = false;
   browserDetect: BrowserDetect;
   locales = {};
@@ -1172,7 +1172,7 @@ export class BaseExtension<T extends BaseConfig> implements IExtension {
   }
 
   dispose(): void {
-    this.store?.destroy();
+    this.store?.setState(null);
   }
 }