Typings cleanup and improvements

frontend/src/InteractiveImport/Interactive/InteractiveImportRow.tsx

@@ -27,6 +27,7 @@ import {
   reprocessInteractiveImportItems,
   updateInteractiveImportItem,
 } from 'Store/Actions/interactiveImportActions';
+import { SelectStateInputProps } from 'typings/props';
 import Rejection from 'typings/Rejection';
 import formatBytes from 'Utilities/Number/formatBytes';
 import InteractiveImportRowCellPlaceholder from './InteractiveImportRowCellPlaceholder';
@@ -40,6 +41,10 @@ type SelectType =
   | 'quality'
   | 'language';
 
+type SelectedChangeProps = SelectStateInputProps & {
+  hasEpisodeFileId: boolean;
+};
+
 interface InteractiveImportRowProps {
   id: number;
   allowSeriesChange: boolean;
@@ -58,7 +63,7 @@ interface InteractiveImportRowProps {
   isReprocessing?: boolean;
   isSelected?: boolean;
   modalTitle: string;
-  onSelectedChange(...args: unknown[]): void;
+  onSelectedChange(result: SelectedChangeProps): void;
   onValidRowChange(id: number, isValid: boolean): void;
 }
 
@@ -88,7 +93,7 @@ function InteractiveImportRow(props: InteractiveImportRowProps) {
   const dispatch = useDispatch();
 
   const isSeriesColumnVisible = useMemo(
-    () => columns.find((c) => c.name === 'series').isVisible,
+    () => columns.find((c) => c.name === 'series')?.isVisible ?? false,
     [columns]
   );
 
@@ -110,6 +115,7 @@ function InteractiveImportRow(props: InteractiveImportRowProps) {
           id,
           hasEpisodeFileId: !!episodeFileId,
           value: true,
+          shiftKey: false,
         });
       }
     },
@@ -143,7 +149,7 @@ function InteractiveImportRow(props: InteractiveImportRowProps) {
   ]);
 
   const onSelectedChangeWrapper = useCallback(
-    (result) => {
+    (result: SelectedChangeProps) => {
       onSelectedChange({
         ...result,
         hasEpisodeFileId: !!episodeFileId,
@@ -158,6 +164,7 @@ function InteractiveImportRow(props: InteractiveImportRowProps) {
         id,
         hasEpisodeFileId: !!episodeFileId,
         value: true,
+        shiftKey: false,
       });
     }
   }, [id, episodeFileId, isSelected, onSelectedChange]);
@@ -312,9 +319,10 @@ function InteractiveImportRow(props: InteractiveImportRowProps) {
     );
   });
 
+  const requiresSeasonNumber = isNaN(Number(seasonNumber));
   const showSeriesPlaceholder = isSelected && !series;
   const showSeasonNumberPlaceholder =
-    isSelected && !!series && isNaN(seasonNumber) && !isReprocessing;
+    isSelected && !!series && requiresSeasonNumber && !isReprocessing;
   const showEpisodeNumbersPlaceholder =
     isSelected && Number.isInteger(seasonNumber) && !episodes.length;
   const showReleaseGroupPlaceholder = isSelected && !releaseGroup;
@@ -364,9 +372,11 @@ function InteractiveImportRow(props: InteractiveImportRowProps) {
       </TableRowCellButton>
 
       <TableRowCellButton
-        isDisabled={!series || isNaN(seasonNumber)}
+        isDisabled={!series || requiresSeasonNumber}
         title={
-          series && !isNaN(seasonNumber) ? 'Click to change episode' : undefined
+          series && !requiresSeasonNumber
+            ? 'Click to change episode'
+            : undefined
         }
         onPress={onSelectEpisodePress}
       >
@@ -456,7 +466,7 @@ function InteractiveImportRow(props: InteractiveImportRowProps) {
 
       <SelectSeasonModal
         isOpen={selectModalOpen === 'season'}
-        seriesId={series && series.id}
+        seriesId={series?.id}
         modalTitle={modalTitle}
         onSeasonSelect={onSeasonSelect}
         onModalClose={onSelectModalClose}
@@ -465,7 +475,7 @@ function InteractiveImportRow(props: InteractiveImportRowProps) {
       <SelectEpisodeModal
         isOpen={selectModalOpen === 'episode'}
         selectedIds={[id]}
-        seriesId={series && series.id}
+        seriesId={series?.id}
         isAnime={isAnime}
         seasonNumber={seasonNumber}
         selectedDetails={relativePath}