Fixed: Artists posters flickering when width changes repeatedly

(cherry picked from commit 53cf5308931069638c23925596a3fd8aaccc5d98)

Closes #64448

frontend/src/App/State/AppState.ts

@@ -39,8 +39,17 @@ export interface CustomFilter {
   filers: PropertyFilter[];
 }
 
+export interface AppSectionState {
+  dimensions: {
+    isSmallScreen: boolean;
+    width: number;
+    height: number;
+  };
+}
+
 interface AppState {
   albums: AlbumAppState;
+  app: AppSectionState;
   artist: ArtistAppState;
   artistIndex: ArtistIndexAppState;
   history: HistoryAppState;

frontend/src/Artist/Index/Posters/ArtistIndexPosters.tsx

@@ -213,13 +213,18 @@ export default function ArtistIndexPosters(props: ArtistIndexPostersProps) {
     if (current) {
       const width = current.clientWidth;
       const padding = bodyPadding - 5;
+      const finalWidth = width - padding * 2;
+
+      if (Math.abs(size.width - finalWidth) < 20 || size.width === finalWidth) {
+        return;
+      }
 
       setSize({
-        width: width - padding * 2,
+        width: finalWidth,
         height: window.innerHeight,
       });
     }
-  }, [isSmallScreen, scrollerRef, bounds]);
+  }, [isSmallScreen, size, scrollerRef, bounds]);
 
   useEffect(() => {
     const currentScrollListener = isSmallScreen ? window : scrollerRef.current;

frontend/src/Store/Selectors/createDimensionsSelector.ts

@@ -1,8 +1,9 @@
 import { createSelector } from 'reselect';
+import AppState from 'App/State/AppState';
 
 function createDimensionsSelector() {
   return createSelector(
-    (state) => state.app.dimensions,
+    (state: AppState) => state.app.dimensions,
     (dimensions) => {
       return dimensions;
     }