extract hasPhotoChanges util and add tests

src/pages/edit-profile/EditProfile.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState, useMemo, useCallback } from 'react'
+import { useEffect, useState, useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
 import {
   Link,
@@ -20,8 +20,6 @@ import SidebarMenu from '~/components/sidebar-menu/SidebarMenu'
 import {
   ButtonVariantEnum,
   SizeEnum,
-  UpdatedPhoto,
-  EditProfilePhoto,
   UpdateUserParams,
   UserProfileTabsEnum,
   UserRole,
@@ -37,10 +35,9 @@ import { LoadingStatusEnum } from '~/redux/redux.constants'
 import { openAlert } from '~/redux/features/snackbarSlice'
 import { snackbarVariants } from '~/constants'
 import { authRoutes } from '~/router/constants/authRoutes'
-import { areAllValuesEmptyStrings } from '~/utils/are-all-values-empty-strings'
-import { isUpdatedPhoto } from '~/utils/is-updated-photo'
 
 import { styles } from '~/pages/edit-profile/EditProfile.styles'
+import { hasPhotoChanges } from '~/utils/has-photo-changes'
 
 const EditProfile = () => {
   const [initialEditProfileState, setInitialEditProfileState] = useState<
@@ -84,45 +81,6 @@ const EditProfile = () => {
     return JSON.stringify(initialData) !== JSON.stringify(currentData)
   }
 
-  const hasPhotoChanges = useCallback(
-    (
-      initialPhoto: EditProfilePhoto,
-      currentPhoto: EditProfilePhoto
-    ): boolean => {
-      if (initialPhoto !== '' && currentPhoto === '') {
-        return true
-      }
-
-      if (
-        typeof initialPhoto === 'string' &&
-        isUpdatedPhoto(currentPhoto) &&
-        (currentPhoto as UpdatedPhoto).name !== initialPhoto
-      ) {
-        return true
-      }
-
-      if (
-        initialPhoto === null &&
-        isUpdatedPhoto(currentPhoto) &&
-        areAllValuesEmptyStrings(currentPhoto as UpdatedPhoto)
-      ) {
-        return true
-      }
-
-      if (
-        isUpdatedPhoto(initialPhoto) &&
-        isUpdatedPhoto(currentPhoto) &&
-        (initialPhoto as UpdatedPhoto).name !==
-          (currentPhoto as UpdatedPhoto).name
-      ) {
-        return true
-      }
-
-      return false
-    },
-    []
-  )
-
   useEffect(() => {
     const fetchData = async () => {
       await dispatch(
@@ -174,7 +132,7 @@ const EditProfile = () => {
     } else {
       return {}
     }
-  }, [profileState, initialEditProfileState, hasPhotoChanges])
+  }, [profileState, initialEditProfileState])
 
   const isChanged = useMemo<boolean>(
     () => Object.keys(changedFields).length > 0,

src/utils/has-photo-changes.ts

@@ -0,0 +1,38 @@
+import { EditProfilePhoto, UpdatedPhoto } from '~/types'
+import { isUpdatedPhoto } from '~/utils/is-updated-photo'
+import { areAllValuesEmptyStrings } from '~/utils/are-all-values-empty-strings'
+
+export const hasPhotoChanges = (
+  initialPhoto: EditProfilePhoto,
+  currentPhoto: EditProfilePhoto
+): boolean => {
+  if (initialPhoto !== '' && currentPhoto === '') {
+    return true
+  }
+
+  if (
+    typeof initialPhoto === 'string' &&
+    isUpdatedPhoto(currentPhoto) &&
+    (currentPhoto as UpdatedPhoto).name !== initialPhoto
+  ) {
+    return true
+  }
+
+  if (
+    initialPhoto === null &&
+    isUpdatedPhoto(currentPhoto) &&
+    areAllValuesEmptyStrings(currentPhoto as UpdatedPhoto)
+  ) {
+    return true
+  }
+
+  if (
+    isUpdatedPhoto(initialPhoto) &&
+    isUpdatedPhoto(currentPhoto) &&
+    (initialPhoto as UpdatedPhoto).name !== (currentPhoto as UpdatedPhoto).name
+  ) {
+    return true
+  }
+
+  return false
+}

tests/unit/utils/has-photo-changes.spec.js

@@ -0,0 +1,45 @@
+import { hasPhotoChanges } from '~/utils/has-photo-changes'
+
+describe('hasPhotoChanges', () => {
+  it('should return true if initialPhoto is not empty and currentPhoto is empty', () => {
+    const initialPhoto = 'initialPhoto'
+    const currentPhoto = ''
+    expect(hasPhotoChanges(initialPhoto, currentPhoto)).toBe(true)
+  })
+
+  it('should return true if initialPhoto is a string and currentPhoto is an UpdatedPhoto with a different name', () => {
+    const initialPhoto = 'initialPhoto'
+    const currentPhoto = { src: 'src', name: 'newName' }
+    expect(hasPhotoChanges(initialPhoto, currentPhoto)).toBe(true)
+  })
+
+  it('should return true if initialPhoto is null and currentPhoto is an UpdatedPhoto with all values empty strings', () => {
+    const initialPhoto = null
+    const currentPhoto = { src: '', name: '' }
+    expect(hasPhotoChanges(initialPhoto, currentPhoto)).toBe(true)
+  })
+
+  it('should return true if both initialPhoto and currentPhoto are UpdatedPhotos with different names', () => {
+    const initialPhoto = { src: 'src1', name: 'name1' }
+    const currentPhoto = { src: 'src2', name: 'name2' }
+    expect(hasPhotoChanges(initialPhoto, currentPhoto)).toBe(true)
+  })
+
+  it('should return false if there are no changes', () => {
+    const initialPhoto = { src: 'src', name: 'name' }
+    const currentPhoto = { src: 'src', name: 'name' }
+    expect(hasPhotoChanges(initialPhoto, currentPhoto)).toBe(false)
+  })
+
+  it('should return false if both initialPhoto and currentPhoto are empty strings', () => {
+    const initialPhoto = ''
+    const currentPhoto = ''
+    expect(hasPhotoChanges(initialPhoto, currentPhoto)).toBe(false)
+  })
+
+  it('should return false if both initialPhoto and currentPhoto are null', () => {
+    const initialPhoto = null
+    const currentPhoto = null
+    expect(hasPhotoChanges(initialPhoto, currentPhoto)).toBe(false)
+  })
+})