From 46bac6ce123909fb0ec27a2f8c798fc7039520e7 Mon Sep 17 00:00:00 2001
From: walesch-yan <yan.walesch@esrf.fr>
Date: Tue, 2 Sep 2025 13:49:45 +0200
Subject: [PATCH] remove UNSAFE component function and clean up state

---
 ui/src/actions/sampleview.js                 | 12 ----------
 ui/src/components/SampleView/SampleImage.jsx | 23 +++++---------------
 ui/src/reducers/sampleview.js                |  9 --------
 3 files changed, 6 insertions(+), 38 deletions(-)

diff --git a/ui/src/actions/sampleview.js b/ui/src/actions/sampleview.js
index 3d59fc851..afc004fc4 100644
--- a/ui/src/actions/sampleview.js
+++ b/ui/src/actions/sampleview.js
@@ -100,14 +100,6 @@ export function deleteShapeAction(id) {
   return { type: 'DELETE_SHAPE', id };
 }
 
-export function saveImageSize(width, height, pixelsPerMm) {
-  return { type: 'SAVE_IMAGE_SIZE', width, height, pixelsPerMm };
-}
-
-export function toggleAutoScale(width = 1) {
-  return { type: 'TOGGLE_AUTO_SCALE', width };
-}
-
 export function videoMessageOverlay(show, msg) {
   return { type: 'SHOW_VIDEO_MESSAGE_OVERLAY', show, msg };
 }
@@ -145,10 +137,6 @@ export function setShapes(shapes) {
   return { type: 'SET_SHAPES', shapes };
 }
 
-export function toggleCinema() {
-  return { type: 'TOOGLE_CINEMA' };
-}
-
 export function setGridOverlay(level) {
   return { type: 'SET_GRID_OVERLAY', level };
 }
diff --git a/ui/src/components/SampleView/SampleImage.jsx b/ui/src/components/SampleView/SampleImage.jsx
index b5f8954b7..52057099f 100644
--- a/ui/src/components/SampleView/SampleImage.jsx
+++ b/ui/src/components/SampleView/SampleImage.jsx
@@ -101,21 +101,12 @@ export default class SampleImage extends React.Component {
     this.initJSMpeg();
   }
 
-  // eslint-disable-next-line react/no-unsafe
-  UNSAFE_componentWillReceiveProps(nextProps) {
-    const { width, cinema } = this.props;
-    if (
-      nextProps.width !== width ||
-      nextProps.cinema !== cinema ||
-      (nextProps.autoScale && this.props.imageRatio !== nextProps.imageRatio)
-    ) {
+  componentDidUpdate(prevProps) {
+    const { imageRatio, width } = this.props; // #NOSONAR
+    if (imageRatio !== prevProps.imageRatio || width !== prevProps.width) {
+      // #NOSONAR
       this.setImageRatio();
     }
-
-    this.drawGridPlugin.setScale(nextProps.imageRatio);
-  }
-
-  componentDidUpdate(prevProps) {
     // Initialize JSMpeg for decoding the MPEG1 stream
     if (prevProps.videoFormat !== 'MPEG1') {
       this.initJSMpeg();
@@ -201,10 +192,8 @@ export default class SampleImage extends React.Component {
   }
 
   setImageRatio() {
-    if (this.props.autoScale) {
-      const { clientWidth } = document.querySelector('#outsideWrapper');
-      this.props.sampleViewActions.setImageRatio(clientWidth);
-    }
+    const { clientWidth } = document.querySelector('#outsideWrapper');
+    this.props.sampleViewActions.setImageRatio(clientWidth);
   }
 
   setVCellSpacing(e) {
diff --git a/ui/src/reducers/sampleview.js b/ui/src/reducers/sampleview.js
index 9726751eb..e02c2ef77 100644
--- a/ui/src/reducers/sampleview.js
+++ b/ui/src/reducers/sampleview.js
@@ -11,7 +11,6 @@ const INITIAL_STATE = {
   videoURL: '',
   sourceIsScalable: false,
   videoSizes: [],
-  autoScale: true,
   imageRatio: 0,
   pixelsPerMm: [0, 0],
   sourceScale: 1,
@@ -21,7 +20,6 @@ const INITIAL_STATE = {
   beamPosition: [0, 0],
   beamShape: 'ellipse',
   beamSize: { x: 0, y: 0 },
-  cinema: false,
   phaseList: [],
   drawGrid: false,
   videoMessageOverlay: { show: false, msg: '' },
@@ -32,9 +30,6 @@ const INITIAL_STATE = {
 // eslint-disable-next-line complexity
 function sampleViewReducer(state = INITIAL_STATE, action = {}) {
   switch (action.type) {
-    case 'TOOGLE_CINEMA': {
-      return { ...state, cinema: !state.cinema };
-    }
     case 'SET_PIXELS_PER_MM': {
       return { ...state, pixelsPerMm: action.pixelsPerMm };
     }
@@ -99,10 +94,6 @@ function sampleViewReducer(state = INITIAL_STATE, action = {}) {
     case 'SET_VIDEO_SIZE': {
       return { ...state, videoSize: action.width };
     }
-    case 'TOGGLE_AUTO_SCALE': {
-      const imageRatio = state.autoScale ? 1 : action.width / state.width;
-      return { ...state, autoScale: !state.autoScale, imageRatio };
-    }
     case 'SET_APERTURE': {
       return { ...state, currentAperture: action.size };
     }