JS / Vue JS - Redundant if statement for api calls

Question

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);
    }

depperm · Accepted Answer · 2021-08-10 12:27:37Z

2

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)

edited Aug 10, 2021 at 12:27

answered Aug 10, 2021 at 12:03

depperm

10.8k4 gold badges46 silver badges68 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

thelandog Over a year ago

Thanks for your suggestion. The only thing I'm experiencing an issue with is calling uploadProfile(response.filename). If I call the function like this, I won't have access to response.

depperm Over a year ago

the provided code doesn't currently access it, what are you trying/want to do with the response?

thelandog Over a year ago

I need to get the filename from the response itself

depperm Over a year ago

add a return inside if and an else with a different return. To cover your bases you might also add a catch with a return

thelandog Over a year ago

I updated my question to provide a bit more context, as I'm still a bit confused with it

|

Collectives™ on Stack Overflow

JS / Vue JS - Redundant if statement for api calls

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related