JS / Vue JS - Redundant if statement for api calls

Viewed 32

I have the following function in which the if statement feels a bit redundant as I'm repeating my calls for sendProfileData twice. Can someone guide me as to how I can make this cleaner, please?

 function editDetails(formData) {
    const initialImage = teacherProfile.value.profilePictureUrl.substring(teacherProfile.value.profilePictureUrl.indexOf("/teacher"))
      if (!formData.fileUploader) {
        sendProfileData(formData, initialImage).then(response => {
          if (response) {
            // After the successful API call, go back to the teachers profile
            router.push({name: ROUTE_NAMES_TEACHER_PROFILE.TEACHER_PROFILE});
          }
        })
      } else {
        uploadProfilePicture(formData.fileUploader).then(response => {
          if (response) {
            sendProfileData(formData, response.filename).then(response => {
              if (response) {
                // After the successful API call, go back to the teachers profile
                router.push({name: ROUTE_NAMES_TEACHER_PROFILE.TEACHER_PROFILE});
              }
            })
          }
        })
      }
    }

// Dispatch action
    function sendProfileData(data, imageUrl) {
      return store.dispatch(SET_PROFILE_DATA, {data, imageUrl});
    }

    function uploadProfilePicture(file) {
      return store.dispatch(UPLOAD_PROFILE_IMAGE, file);
    }
1 Answers

I'd move it to its own function

function uploadProfile(file) {
  sendProfileData(formData, file).then(response => {
      if (response) {
          // After the successful API call, go back to the teachers profile
          router.push({name: ROUTE_NAMES_TEACHER_PROFILE.TEACHER_PROFILE});
      }
  })
}

then call it from two spots

if (!formData.fileUploader) {
  uploadProfile(initialImage)
...
uploadProfilePicture(formData.fileUploader).then(response => {
  if (response) {
    uploadProfile(response.filename)
Related