From 5af270b28a043306224142fc5f30e6863cbc89ee Mon Sep 17 00:00:00 2001
From: keiya01 <34934510+keiya01@users.noreply.github.com>
Date: Wed, 16 Oct 2024 18:52:07 +0900
Subject: [PATCH] fix: update readonly props without strict mode

---
 src/ImageryLayer/ImageLayer.stories.tsx | 41 ++++++++++++++++++++++---
 src/ImageryLayer/ImageryLayer.ts        |  7 ++---
 src/core/hooks.ts                       |  4 +--
 3 files changed, 41 insertions(+), 11 deletions(-)

diff --git a/src/ImageryLayer/ImageLayer.stories.tsx b/src/ImageryLayer/ImageLayer.stories.tsx
index 6ebc91225..0934d96fe 100644
--- a/src/ImageryLayer/ImageLayer.stories.tsx
+++ b/src/ImageryLayer/ImageLayer.stories.tsx
@@ -1,5 +1,6 @@
 import { Meta, StoryObj } from "@storybook/react";
-import { ArcGisMapServerImageryProvider, IonImageryProvider } from "cesium";
+import { ArcGisMapServerImageryProvider, IonImageryProvider, IonWorldImageryStyle } from "cesium";
+import { StrictMode } from "react";
 
 import Viewer from "../Viewer";
 
@@ -13,15 +14,45 @@ export default {
 } as Meta;
 
 export const Basic: Story = {
-  render: args => (
+  argTypes: {
+    tile: { options: ["arcgis", "cesium"], control: { type: "select" } },
+  } as any,
+  render: ({ tile, ...args }: any) => (
     <Viewer full>
       <ImageryLayer
         {...args}
-        imageryProvider={ArcGisMapServerImageryProvider.fromUrl(
-          "https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer",
-        )}
+        imageryProvider={
+          tile === "arcgis"
+            ? ArcGisMapServerImageryProvider.fromUrl(
+                "https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer",
+              )
+            : IonImageryProvider.fromAssetId(IonWorldImageryStyle.AERIAL)
+        }
       />
       <ImageryLayer alpha={0.5} imageryProvider={IonImageryProvider.fromAssetId(3812, {})} />
     </Viewer>
   ),
 };
+
+export const Strict: Story = {
+  argTypes: {
+    tile: { options: ["arcgis", "cesium"], control: { type: "select" } },
+  } as any,
+  render: ({ tile, ...args }: any) => (
+    <StrictMode>
+      <Viewer full>
+        <ImageryLayer
+          {...args}
+          imageryProvider={
+            tile === "arcgis"
+              ? ArcGisMapServerImageryProvider.fromUrl(
+                  "https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer",
+                )
+              : IonImageryProvider.fromAssetId(IonWorldImageryStyle.AERIAL)
+          }
+        />
+        <ImageryLayer alpha={0.5} imageryProvider={IonImageryProvider.fromAssetId(3812, {})} />
+      </Viewer>
+    </StrictMode>
+  ),
+};
diff --git a/src/ImageryLayer/ImageryLayer.ts b/src/ImageryLayer/ImageryLayer.ts
index 3589e0a5b..f94c0c5e6 100644
--- a/src/ImageryLayer/ImageryLayer.ts
+++ b/src/ImageryLayer/ImageryLayer.ts
@@ -55,8 +55,7 @@ export type ImageryLayerCesiumReadonlyProps = Omit<
   imageryProvider: ImageryProvider | Promise<ImageryProvider>;
 };
 
-export type ImageryLayerProps = ImageryLayerCesiumProps &
-  ImageryLayerCesiumReadonlyProps;
+export type ImageryLayerProps = ImageryLayerCesiumProps & ImageryLayerCesiumReadonlyProps;
 
 const cesiumProps = [
   "alpha",
@@ -109,8 +108,8 @@ const ImageryLayer = createCesiumComponent<CesiumImageryLayer, ImageryLayerProps
 
     // Remove the awaited result from the waiting list.
     if (context.__$internal?.imageryLayerWaitingList) {
-      context.__$internal.imageryLayerWaitingList =
-        context.__$internal.imageryLayerWaitingList.filter(i => i !== imageryProvider);
+      const index = context.__$internal.imageryLayerWaitingList.indexOf(imageryProvider);
+      context.__$internal.imageryLayerWaitingList.splice(index, 1);
     }
 
     if (!result) return;
diff --git a/src/core/hooks.ts b/src/core/hooks.ts
index 994567041..413eb6d4b 100644
--- a/src/core/hooks.ts
+++ b/src/core/hooks.ts
@@ -287,8 +287,8 @@ export const useCesiumComponent = <Element, Props extends RootComponentInternalP
   // Update properties of cesium element
   useEffect(() => {
     const update = async () => {
-      if (mountReadyRef.current) {
-        await mountReadyRef.current;
+      if (unmountReadyRef.current) {
+        await unmountReadyRef.current;
       }
 
       const propsWC = propsWithChildren(props);