message: refactor: refactoring useEffect
diff: @@ -19,27 +19,19 @@ const Pagination: React.FC<IPagination> = ({
  isLoading = false,
  onChange = () => null,
  }: IPagination) => {
  - const [isMobile, setIsMobile] = useState(false)
  -
  - useEffect(() => {
  - let doit: NodeJS.Timeout
  - const timeOut = 200
  const maxPhoneWidth = 420
  + const [isMobile, setIsMobile] = useState(false)
  const checkDevice = () => setIsMobile(window.innerWidth <= maxPhoneWidth)
  - checkDevice()
  - const onResize = () => {
  - clearTimeout(doit)
  - doit = setTimeout(() => checkDevice(), timeOut)
  - }
  - window.addEventListener('resize', onResize)
  + const debounce = (func: () => void, wait: number) => {
  + let timer: NodeJS.Timeout
  return () => {
  - clearTimeout(doit)
  - window.removeEventListener('resize', onResize)
  + clearTimeout(timer)
  + timer = setTimeout(() => func(), wait)
  + }
  }
  - }, [])
  const isInvalid = () => page < 1 || page > count || count < 1
  @@ -68,6 +60,12 @@ const Pagination: React.FC<IPagination> = ({
  )
  const range = getAllIndexes().slice(startOfRange, endOfRange)
  + useEffect(() => {
  + checkDevice()
  + window.addEventListener('resize', debounce(checkDevice, 200))
  + return () => window.removeEventListener('resize', checkDevice)
  + }, [])
  +
  return !isInvalid() ? (
  <section
  className={`${styles.pagination} ${isMobile ? styles.isMobile : ''}`}
  