Fix static reported issues.

Author: Greg Trihus

src/renderer/src/components/PassageDetail/PassageDetailMarkVerses.tsx

@@ -224,7 +224,6 @@ export function PassageDetailMarkVerses({ width }: MarkVersesProps) {
     return () => {
       window.removeEventListener('resize', handleResize);
     };
-    /* eslint-disable-next-line react-hooks/exhaustive-deps */
   }, []);
 
   useEffect(() => {
@@ -233,7 +232,7 @@ export function PassageDetailMarkVerses({ width }: MarkVersesProps) {
       ColName.Limits
     );
     playerControlsRef.current?.applyMarkVersesRegionColors?.();
-  }, [data, pastedSegments]);
+  }, [ColName.Limits, data, pastedSegments]);
 
   const rowCells = (row: string[], first = false) =>
     row.map(
@@ -631,7 +630,7 @@ export function PassageDetailMarkVerses({ width }: MarkVersesProps) {
             }))
           )
         : data.map((r) => r.map((c) => ({ ...c, readOnly: true }))),
-    [data, hasPermission]
+    [ColName.Limits, ColName.Ref, data, hasPermission]
   );
 
   const handleRowClick = async (rowIndex: number) => {
@@ -844,7 +843,12 @@ export function PassageDetailMarkVerses({ width }: MarkVersesProps) {
     []
   );
 
-  useEffect(() => () => { scheduleAutosave.clear(); }, [scheduleAutosave]);
+  useEffect(
+    () => () => {
+      scheduleAutosave.clear();
+    },
+    [scheduleAutosave]
+  );
 
   useEffect(() => {
     if (!isChanged(verseToolId) || !hasPermission || savingRef.current) return;

src/renderer/src/components/PassageDetail/mobile/MarkVerses/EditReferenceDropdown.tsx

@@ -181,7 +181,10 @@ export default function EditReferenceDropdown({
               <NativeSelect
                 value={draft.startSuffix}
                 onChange={handleSuffixChange('startSuffix')}
-                inputProps={{ 'aria-label': 'start verse suffix' }}
+                inputProps={{
+                  'aria-label': 'start verse suffix',
+                  title: 'start verse suffix',
+                }}
                 sx={{ ...selectSx, mt: 0.5 }}
               >
                 {suffixOptions.map((option) => (
@@ -218,7 +221,7 @@ export default function EditReferenceDropdown({
                 onChange={handleEndVerseChange}
                 inputProps={{
                   'aria-label': 'end verse number',
-                  title: 'End verse number',
+                  title: 'end verse number',
                 }}
                 sx={verseSelectSx}
               >
@@ -237,7 +240,10 @@ export default function EditReferenceDropdown({
               <NativeSelect
                 value={draft.endSuffix}
                 onChange={handleSuffixChange('endSuffix')}
-                inputProps={{ 'aria-label': 'end verse suffix' }}
+                inputProps={{
+                  'aria-label': 'end verse suffix',
+                  title: 'end verse suffix',
+                }}
                 sx={{ ...selectSx, mt: 0.5 }}
               >
                 {suffixOptions.map((option) => (

src/renderer/src/components/PassageDetail/mobile/MarkVerses/PassageDetailMarkVersesIsMobile.test.tsx

@@ -304,24 +304,6 @@ const markVersesTbody = () => {
   return tbody;
 };
 
-/**
- * Click the n-th data row in tbody (0 = first passage row). Avoids relying on
- * whether `getAllByRole('row')` on the whole table includes thead rows.
- */
-const clickMarkVersesBodyRow = async (
-  user: UserEvent,
-  bodyRowIndex: number
-) => {
-  const rows = within(markVersesTbody()).getAllByRole('row');
-  const row = rows[bodyRowIndex];
-  if (!row) {
-    throw new Error(
-      `mark verses body row ${bodyRowIndex} missing (have ${rows.length} rows)`
-    );
-  }
-  await user.click(row);
-};
-
 /**
  * Click the tbody row whose Limits column shows `limitsText` (requires verse
  * segments / waveform so the cell is not "-"). Scoped to tbody so the label is
@@ -570,7 +552,9 @@ test('saves a split verse range and shifts following references up', async () =>
     within(editReferenceDialog()).getByRole('button', { name: 'Save' })
   );
 
-  expect(screen.getByLabelText('verse-reference-1')).toHaveTextContent('1:1a-2e');
+  expect(screen.getByLabelText('verse-reference-1')).toHaveTextContent(
+    '1:1a-2e'
+  );
   expect(screen.getByLabelText('verse-reference-2')).toHaveTextContent('1:3');
   expect(screen.getByLabelText('verse-reference-3')).toHaveTextContent('1:4');
 });
@@ -802,7 +786,9 @@ test('shows undo after dialog save and restores the previous table', async () =>
   );
 
   expect(screen.getByRole('button', { name: 'Undo' })).toBeInTheDocument();
-  expect(screen.getByLabelText('verse-reference-1')).toHaveTextContent('1:1a-2e');
+  expect(screen.getByLabelText('verse-reference-1')).toHaveTextContent(
+    '1:1a-2e'
+  );
 
   await user.click(screen.getByRole('button', { name: 'Undo' }));
 

src/renderer/src/components/PassageDetail/mobile/MarkVerses/PassageDetailMarkVersesIsMobile.tsx

@@ -6,7 +6,14 @@ import {
   useRef,
   useState,
 } from 'react';
-import { Box, debounce, IconButton, Paper, SxProps, Typography } from '@mui/material';
+import {
+  Box,
+  debounce,
+  IconButton,
+  Paper,
+  SxProps,
+  Typography,
+} from '@mui/material';
 import { shallowEqual, useSelector } from 'react-redux';
 import { useGlobal } from '../../../../context/useGlobal';
 import usePassageDetailContext from '../../../../context/usePassageDetailContext';
@@ -189,8 +196,6 @@ export default function PassageDetailMarkVersesIsMobile({
     currentSegment,
     currentSegmentIndex,
     setCurrentSegment,
-    setStepComplete,
-    gotoNextStep,
     rowData,
   } = usePassageDetailContext();
   const [memory] = useGlobal('memory');
@@ -254,8 +259,6 @@ export default function PassageDetailMarkVersesIsMobile({
     saveCompleted,
     clearRequested,
     clearCompleted,
-    checkSavedFn,
-    waitForSave,
   } = useContext(UnsavedContext).state;
   const hasChanged = useMemo(() => isChanged(verseToolId), [isChanged]);
   const projectSegmentSave = useProjectSegmentSave();
@@ -317,16 +320,19 @@ export default function PassageDetailMarkVersesIsMobile({
     }
   }, [emptyTable, setData]);
 
-  const tableSignature = (tableData: ICell[][]) =>
-    JSON.stringify(
-      tableData.map((row) =>
-        row.map((cell) => ({
-          value: cell.value ?? '',
-          className: cell.className ?? '',
-          readOnly: cell.readOnly ?? false,
-        }))
-      )
-    );
+  const tableSignature = useCallback(
+    (tableData: ICell[][]) =>
+      JSON.stringify(
+        tableData.map((row) =>
+          row.map((cell) => ({
+            value: cell.value ?? '',
+            className: cell.className ?? '',
+            readOnly: cell.readOnly ?? false,
+          }))
+        )
+      ),
+    []
+  );
 
   const media = useMemo(
     () => findRecord(memory, 'mediafile', mediafileId) as MediaFileD,
@@ -471,13 +477,6 @@ export default function PassageDetailMarkVersesIsMobile({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [getPassageRefs, passage]);
 
-  const handleComplete = (complete: boolean) => {
-    waitForSave(undefined, 200).finally(async () => {
-      await setStepComplete(currentstep, complete);
-      if (complete) gotoNextStep();
-    });
-  };
-
   const collectRefs = useCallback(
     (tableData: ICell[][]) => {
       const refs: string[] = [];
@@ -579,7 +578,6 @@ export default function PassageDetailMarkVersesIsMobile({
     requestAnimationFrame(apply);
   }, []);
 
-
   useEffect(() => {
     const ctrl = playerControlsRef.current;
     if (ctrl?.isReady()) {
@@ -607,7 +605,9 @@ export default function PassageDetailMarkVersesIsMobile({
 
   const pushUndoSnapshot = useCallback(() => {
     const snapshot: MarkVersesSnapshot = {
-      tableData: cloneTableData(dataRef.current) as MarkVersesSnapshot['tableData'],
+      tableData: cloneTableData(
+        dataRef.current
+      ) as MarkVersesSnapshot['tableData'],
       segmentsJson: segmentsRef.current,
       pastedSegments,
       waveSegmentsJson,
@@ -955,11 +955,12 @@ export default function PassageDetailMarkVersesIsMobile({
       }
     },
     [
-      cloneTableData,
       getActiveSegmentForRow,
+      cloneTableData,
+      setActiveRowHighlight,
+      tableSignature,
       setCurrentSegment,
       setData,
-      setActiveRowHighlight,
       syncProgressFromPlayer,
     ]
   );
@@ -1173,8 +1174,7 @@ export default function PassageDetailMarkVersesIsMobile({
       const change =
         numSegments !== regions.length ||
         tableSignature(previousData) !== tableSignature(newData);
-      const addedSegment =
-        !init && regions.length > prevRegionCountRef.current;
+      const addedSegment = !init && regions.length > prevRegionCountRef.current;
       prevRegionCountRef.current = regions.length;
 
       if (change) {
@@ -1207,17 +1207,17 @@ export default function PassageDetailMarkVersesIsMobile({
       passage,
       emptyTable,
       rowCells,
-      t.startStop,
-      t.reference,
+      t,
       collectRefs,
       numSegments,
+      tableSignature,
       toolChanged,
       formLim,
       applyActiveRowHighlight,
-      setData,
       isChanged,
-      seekToRowSegment,
+      setData,
       scrollActiveRowIntoView,
+      seekToRowSegment,
     ]
   );
 
@@ -1235,7 +1235,7 @@ export default function PassageDetailMarkVersesIsMobile({
     });
   }, [mediafileId, passageRefsKey, savedVerseSegmentsJson]);
 
-  const setSegments = () => {
+  const setSegments = useCallback(() => {
     const regions: IRegion[] = [];
     dataRef.current.forEach((row, index) => {
       if (index === 0) return;
@@ -1247,15 +1247,15 @@ export default function PassageDetailMarkVersesIsMobile({
       });
     });
     resetSegments(regions);
-  };
+  }, [getSegmentFromRow]);
 
   const flushSetSegments = useCallback(() => {
     if (setSegmentsDebounceRef.current) {
       clearTimeout(setSegmentsDebounceRef.current);
       setSegmentsDebounceRef.current = undefined;
       setSegments();
     }
-  }, []);
+  }, [setSegments]);
 
   const scheduleSetSegments = useCallback(() => {
     if (setSegmentsDebounceRef.current) {
@@ -1265,7 +1265,7 @@ export default function PassageDetailMarkVersesIsMobile({
       setSegmentsDebounceRef.current = undefined;
       setSegments();
     }, REF_SEGMENT_SYNC_DEBOUNCE_MS);
-  }, []);
+  }, [setSegments]);
 
   const flushSetSegmentsRef = useRef(flushSetSegments);
   flushSetSegmentsRef.current = flushSetSegments;
@@ -1315,9 +1315,7 @@ export default function PassageDetailMarkVersesIsMobile({
 
   const restoreUndoSnapshot = useCallback(
     (snapshot: MarkVersesSnapshot) => {
-      const restoredData = cloneTableData(
-        snapshot.tableData as ICell[][]
-      );
+      const restoredData = cloneTableData(snapshot.tableData as ICell[][]);
       segmentsRef.current = snapshot.segmentsJson;
       suppressVerseResyncFromMediaRef.current = true;
       resettingSegmentsRef.current = true;
@@ -1330,9 +1328,7 @@ export default function PassageDetailMarkVersesIsMobile({
         setPastedSegments(snapshot.segmentsJson);
       }, 40);
       setData(restoredData);
-      const restoredRegion = parseCurrentSegmentRegion(
-        snapshot.currentSegment
-      );
+      const restoredRegion = parseCurrentSegmentRegion(snapshot.currentSegment);
       setCurrentSegment(restoredRegion, snapshot.currentSegmentIndex);
       const highlightedRowIndex = findHighlightedRowIndex(restoredData);
       if (highlightedRowIndex > 0) {
@@ -1352,11 +1348,12 @@ export default function PassageDetailMarkVersesIsMobile({
     },
     [
       cloneTableData,
+      setData,
       parseCurrentSegmentRegion,
       setCurrentSegment,
-      setData,
-      toolChanged,
       findHighlightedRowIndex,
+      toolChanged,
+      getSegmentFromRow,
     ]
   );
 
@@ -1617,7 +1614,7 @@ export default function PassageDetailMarkVersesIsMobile({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [toolsChanged]);
 
-  const checkRefs = () => {
+  const checkRefs = useCallback(() => {
     const refs = collectRefs(dataRef.current);
     const noSegRefs = dataRef.current
       .filter((_, index) => index > 0)
@@ -1664,26 +1661,14 @@ export default function PassageDetailMarkVersesIsMobile({
     if (noRefSegs) nextIssues.push(t.noReferences);
     if (hasBtRecordings) nextIssues.push(t.btNotUpdated);
     return nextIssues;
-  };
+  }, [collectRefs, t, hasBtRecordings]);
 
   useEffect(() => {
     if (!hasChanged || !hasPermission || savingRef.current) return;
     const issues = checkRefs();
     if (issues.length > 0) return;
     scheduleAutosave();
-  }, [toolsChanged, hasChanged, hasPermission, scheduleAutosave]);
-
-  const handleCancel = () => {
-    if (savingRef.current) {
-      showMessage(t.canceling);
-      canceling.current = true;
-      return;
-    }
-    checkSavedFn(() => {
-      toolChanged(verseToolId, false);
-      if (hasPermission) handleComplete(true);
-    });
-  };
+  }, [toolsChanged, hasChanged, hasPermission, scheduleAutosave, checkRefs]);
 
   const resetSave = () => {
     setResetConfirmOpen(false);