diff --git a/frontend/src/Settings/ImportLists/ImportListExclusions/EditImportListExclusionModal.tsx b/frontend/src/Settings/ImportLists/ImportListExclusions/EditImportListExclusionModal.tsx index b889a8105..7f5feafab 100644 --- a/frontend/src/Settings/ImportLists/ImportListExclusions/EditImportListExclusionModal.tsx +++ b/frontend/src/Settings/ImportLists/ImportListExclusions/EditImportListExclusionModal.tsx @@ -19,7 +19,7 @@ function EditImportListExclusionModal( const dispatch = useDispatch(); - const onModalClosePress = useCallback(() => { + const handleModalClose = useCallback(() => { dispatch( clearPendingChanges({ section: 'settings.importListExclusions', @@ -29,10 +29,10 @@ function EditImportListExclusionModal( }, [dispatch, onModalClose]); return ( - + ); diff --git a/frontend/src/Settings/ImportLists/ImportListExclusions/EditImportListExclusionModalContent.tsx b/frontend/src/Settings/ImportLists/ImportListExclusions/EditImportListExclusionModalContent.tsx index d1aa0852d..766f883c9 100644 --- a/frontend/src/Settings/ImportLists/ImportListExclusions/EditImportListExclusionModalContent.tsx +++ b/frontend/src/Settings/ImportLists/ImportListExclusions/EditImportListExclusionModalContent.tsx @@ -32,12 +32,6 @@ const newImportListExclusion = { tmdbId: 0, }; -interface EditImportListExclusionModalContentProps { - id?: number; - onModalClose: () => void; - onDeleteImportListExclusionPress?: () => void; -} - function createImportListExclusionSelector(id?: number) { return createSelector( (state: AppState) => state.settings.importListExclusions, @@ -63,12 +57,24 @@ function createImportListExclusionSelector(id?: number) { ); } -function EditImportListExclusionModalContent( - props: EditImportListExclusionModalContentProps -) { - const { id, onModalClose, onDeleteImportListExclusionPress } = props; +interface EditImportListExclusionModalContentProps { + id?: number; + onModalClose: () => void; + onDeleteImportListExclusionPress?: () => void; +} + +function EditImportListExclusionModalContent({ + id, + onModalClose, + onDeleteImportListExclusionPress, +}: EditImportListExclusionModalContentProps) { + const { isFetching, isSaving, item, error, saveError, ...otherProps } = + useSelector(createImportListExclusionSelector(id)); + + const { movieTitle, movieYear, tmdbId } = item; const dispatch = useDispatch(); + const previousIsSaving = usePrevious(isSaving); const dispatchSetImportListExclusionValue = (payload: { name: string; @@ -78,20 +84,10 @@ function EditImportListExclusionModalContent( dispatch(setImportListExclusionValue(payload)); }; - const { isFetching, isSaving, item, error, saveError, ...otherProps } = - useSelector(createImportListExclusionSelector(props.id)); - const previousIsSaving = usePrevious(isSaving); - - const { movieTitle, movieYear, tmdbId } = item; - useEffect(() => { if (!id) { - Object.keys(newImportListExclusion).forEach((name) => { - dispatchSetImportListExclusionValue({ - name, - value: - newImportListExclusion[name as keyof typeof newImportListExclusion], - }); + Object.entries(newImportListExclusion).forEach(([name, value]) => { + dispatchSetImportListExclusionValue({ name, value }); }); } // eslint-disable-next-line react-hooks/exhaustive-deps @@ -101,7 +97,7 @@ function EditImportListExclusionModalContent( if (previousIsSaving && !isSaving && !saveError) { onModalClose(); } - }); + }, [previousIsSaving, isSaving, saveError, onModalClose]); const onSavePress = useCallback(() => { dispatch(saveImportListExclusion({ id })); diff --git a/frontend/src/Settings/Profiles/Release/EditReleaseProfileModal.tsx b/frontend/src/Settings/Profiles/Release/EditReleaseProfileModal.tsx index d4ecfc59c..cb7c2cef1 100644 --- a/frontend/src/Settings/Profiles/Release/EditReleaseProfileModal.tsx +++ b/frontend/src/Settings/Profiles/Release/EditReleaseProfileModal.tsx @@ -19,7 +19,7 @@ function EditReleaseProfileModal({ }: EditReleaseProfileModalProps) { const dispatch = useDispatch(); - const onModalClosePress = useCallback(() => { + const handleModalClose = useCallback(() => { dispatch( clearPendingChanges({ section: 'settings.releaseProfiles', @@ -29,10 +29,10 @@ function EditReleaseProfileModal({ }, [dispatch, onModalClose]); return ( - + ); diff --git a/frontend/src/Settings/Profiles/Release/EditReleaseProfileModalContent.tsx b/frontend/src/Settings/Profiles/Release/EditReleaseProfileModalContent.tsx index 9f672ea4a..5b2b4289c 100644 --- a/frontend/src/Settings/Profiles/Release/EditReleaseProfileModalContent.tsx +++ b/frontend/src/Settings/Profiles/Release/EditReleaseProfileModalContent.tsx @@ -63,11 +63,11 @@ interface EditReleaseProfileModalContentProps { onDeleteReleaseProfilePress?: () => void; } -function EditReleaseProfileModalContent( - props: EditReleaseProfileModalContentProps -) { - const { id, onModalClose, onDeleteReleaseProfilePress } = props; - +function EditReleaseProfileModalContent({ + id, + onModalClose, + onDeleteReleaseProfilePress, +}: EditReleaseProfileModalContentProps) { const { item, isFetching, isSaving, error, saveError, ...otherProps } = useSelector(createReleaseProfileSelector(id)); @@ -78,14 +78,9 @@ function EditReleaseProfileModalContent( useEffect(() => { if (!id) { - Object.keys(newReleaseProfile).forEach((name) => { - dispatch( - // @ts-expect-error 'setReleaseProfileValue' isn't typed yet - setReleaseProfileValue({ - name, - value: newReleaseProfile[name as keyof typeof newReleaseProfile], - }) - ); + Object.entries(newReleaseProfile).forEach(([name, value]) => { + // @ts-expect-error 'setReleaseProfileValue' isn't typed yet + dispatch(setReleaseProfileValue({ name, value })); }); } // eslint-disable-next-line react-hooks/exhaustive-deps @@ -95,7 +90,7 @@ function EditReleaseProfileModalContent( if (previousIsSaving && !isSaving && !saveError) { onModalClose(); } - }); + }, [previousIsSaving, isSaving, saveError, onModalClose]); const handleSavePress = useCallback(() => { dispatch(saveReleaseProfile({ id }));