fix: hooks warnings

tntconcept · May 16, 2024 · 8ffebed · 8ffebed
1 parent 087269e
commit 8ffebed
Show file tree

Hide file tree

Showing 5 changed files with 42 additions and 25 deletions.
diff --git a/...res/binnacle/features/activity/ui/calendar-desktop/calendar-controls/next-month-arrow.tsx b/...res/binnacle/features/activity/ui/calendar-desktop/calendar-controls/next-month-arrow.tsx
@@ -17,15 +17,18 @@ export const NextMonthArrow = () => {
     setSelectedDate(nextMonth)
   }, [selectedDate, setSelectedDate])
 
-  const handlePressedKey = (e: KeyboardEvent) => {
-    handleKeyPressWhenModalIsNotOpenedOrInputIsNotFocused(e.key, 'n', handleNextMonthClick)
-  }
+  const handlePressedKey = useCallback(
+    (e: KeyboardEvent) => {
+      handleKeyPressWhenModalIsNotOpenedOrInputIsNotFocused(e.key, 'n', handleNextMonthClick)
+    },
+    [handleNextMonthClick]
+  )
 
   useEffect(() => {
     document.addEventListener('keydown', handlePressedKey)
 
     return () => document.removeEventListener('keydown', handlePressedKey)
-  }, [selectedDate, setSelectedDate])
+  }, [handlePressedKey, selectedDate, setSelectedDate])
 
   const ariaLabel = t('accessibility.next_month', {
     monthStr: chrono(selectedDate).plus(1, 'month').format('LLLL yyyy')

diff --git a/...res/binnacle/features/activity/ui/calendar-desktop/calendar-controls/prev-month-arrow.tsx b/...res/binnacle/features/activity/ui/calendar-desktop/calendar-controls/prev-month-arrow.tsx
@@ -16,15 +16,18 @@ export const PrevMonthArrow = () => {
     setSelectedDate(prevMonth)
   }, [selectedDate, setSelectedDate])
 
-  const handlePressedKey = (e: KeyboardEvent) => {
-    handleKeyPressWhenModalIsNotOpenedOrInputIsNotFocused(e.key, 'p', handlePrevMonthClick)
-  }
+  const handlePressedKey = useCallback(
+    (e: KeyboardEvent) => {
+      handleKeyPressWhenModalIsNotOpenedOrInputIsNotFocused(e.key, 'p', handlePrevMonthClick)
+    },
+    [handlePrevMonthClick]
+  )
 
   useEffect(() => {
     document.addEventListener('keydown', handlePressedKey)
 
     return () => document.removeEventListener('keydown', handlePressedKey)
-  }, [selectedDate, setSelectedDate])
+  }, [handlePressedKey, selectedDate, setSelectedDate])
 
   const ariaLabel = t('accessibility.prev_month', {
     monthStr: chrono(selectedDate).minus(1, 'month').format('LLLL yyyy')

diff --git a/...eatures/binnacle/features/activity/ui/calendar-desktop/calendar-controls/today-button.tsx b/...eatures/binnacle/features/activity/ui/calendar-desktop/calendar-controls/today-button.tsx
@@ -1,5 +1,5 @@
 import { Button, Text } from '@chakra-ui/react'
-import { FC, useEffect, useState } from 'react'
+import { FC, useCallback, useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { chrono } from '../../../../../../../shared/utils/chrono'
 import { useCalendarContext } from '../../contexts/calendar-context'
@@ -16,21 +16,24 @@ export const TodayButton: FC = () => {
     setIsCurrentMonth(chrono(selectedDate).isThisMonth())
   }, [selectedDate])
 
-  const handlePressedKey = (e: KeyboardEvent) => {
-    handleKeyPressWhenModalIsNotOpenedOrInputIsNotFocused(e.key, 't', handleSetCurrentMonth)
-  }
+  const handleSetCurrentMonth = useCallback(() => {
+    if (isCurrentMonth) return
+
+    setSelectedDate(new Date())
+  }, [isCurrentMonth, setSelectedDate])
+
+  const handlePressedKey = useCallback(
+    (e: KeyboardEvent) => {
+      handleKeyPressWhenModalIsNotOpenedOrInputIsNotFocused(e.key, 't', handleSetCurrentMonth)
+    },
+    [handleSetCurrentMonth]
+  )
 
   useEffect(() => {
     document.addEventListener('keydown', handlePressedKey)
 
     return () => document.removeEventListener('keydown', handlePressedKey)
-  }, [selectedDate, isCurrentMonth])
-
-  const handleSetCurrentMonth = () => {
-    if (isCurrentMonth) return
-
-    setSelectedDate(new Date())
-  }
+  }, [handlePressedKey, selectedDate, isCurrentMonth])
 
   return (
     <Button variant={'outline'} onClick={handleSetCurrentMonth}>

diff --git a/...e/features/activity/ui/components/activity-form/components/combos/project-roles-combo.tsx b/...e/features/activity/ui/components/activity-form/components/combos/project-roles-combo.tsx
@@ -41,7 +41,7 @@ export const ProjectRolesCombo = forwardRef<HTMLInputElement, ComboProps>((props
     }).then((roles) => {
       setItems(roles)
     })
-  }, [project?.id, executeUseCase, selectedDate])
+  }, [props.userId, project?.id, executeUseCase, selectedDate])
 
   return (
     <ComboField

diff --git a/...es/binnacle/features/availability/ui/components/availability-table/availability-table.tsx b/...es/binnacle/features/availability/ui/components/availability-table/availability-table.tsx
@@ -1,4 +1,4 @@
-import { FC, useEffect, useMemo, useState } from 'react'
+import { FC, useCallback, useEffect, useMemo, useState } from 'react'
 import { Box, Flex, Spinner, Table, Tbody, Td, Text, Th, Thead, Tr } from '@chakra-ui/react'
 import { chrono } from '../../../../../../../shared/utils/chrono'
 import { useExecuteUseCaseOnMount } from '../../../../../../../shared/arch/hooks/use-execute-use-case-on-mount'
@@ -45,9 +45,9 @@ export const AvailabilityTable: FC = () => {
     selectedDateInterval.start.getFullYear()
   )
 
-  const requiredFiltersAreSelected = () =>
-    absenceFilters.organizationIds !== undefined || absenceFilters.userIds !== undefined
-
+  const requiredFiltersAreSelected = useCallback(() => {
+    return absenceFilters.organizationIds !== undefined || absenceFilters.userIds !== undefined
+  }, [absenceFilters.organizationIds, absenceFilters.userIds])
   useEffect(() => {
     if (
       requiredFiltersAreSelected() &&
@@ -66,7 +66,15 @@ export const AvailabilityTable: FC = () => {
         setRequiredFiltersChange(false)
       })
     }
-  }, [absenceFilters, selectedDateInterval, previousDate])
+  }, [
+    getAbsencesQry,
+    requiredFiltersAreSelected,
+    requiredFiltersChange,
+    selectedDate,
+    absenceFilters,
+    selectedDateInterval,
+    previousDate
+  ])
 
   const checkIfHoliday = (day: Date) =>
     holidays.some((holiday) => chrono(day).isSameDay(holiday.date))