diff --git a/src/grid/SpotlightExpandedLayout.tsx b/src/grid/SpotlightExpandedLayout.tsx
index b92460ee..6480d635 100644
--- a/src/grid/SpotlightExpandedLayout.tsx
+++ b/src/grid/SpotlightExpandedLayout.tsx
@@ -40,7 +40,7 @@ export const makeSpotlightExpandedLayout: CallLayout<
 
     const [generation] = useReactiveState<number>(
       (prev) => (prev === undefined ? 0 : prev + 1),
-      [width, height],
+      [width, height, model.spotlight],
     );
 
     const spotlightTileModel: SpotlightTileModel = useMemo(
diff --git a/src/grid/SpotlightLandscapeLayout.tsx b/src/grid/SpotlightLandscapeLayout.tsx
index e3ca1bf9..fd219fa9 100644
--- a/src/grid/SpotlightLandscapeLayout.tsx
+++ b/src/grid/SpotlightLandscapeLayout.tsx
@@ -48,7 +48,7 @@ export const makeSpotlightLandscapeLayout: CallLayout<
     );
     const [generation] = useReactiveState<number>(
       (prev) => (prev === undefined ? 0 : prev + 1),
-      [model.grid.length, width, height],
+      [model.grid.length, width, height, model.spotlight],
     );
 
     return (
diff --git a/src/grid/SpotlightPortraitLayout.tsx b/src/grid/SpotlightPortraitLayout.tsx
index 5b82ca62..6bd44524 100644
--- a/src/grid/SpotlightPortraitLayout.tsx
+++ b/src/grid/SpotlightPortraitLayout.tsx
@@ -59,7 +59,7 @@ export const makeSpotlightPortraitLayout: CallLayout<
     );
     const [generation] = useReactiveState<number>(
       (prev) => (prev === undefined ? 0 : prev + 1),
-      [model.grid.length, width, height],
+      [model.grid.length, width, height, model.spotlight],
     );
 
     return (