How to call one of multiple functions - JavaScript?

Question

I have three functions:

1. Change Email
2. Change password
3. Change otherData

And One Button to call them , when the user changes his da

Answer 1

I think you have two options, option add more variables to state which you can use to compare the new data with and option two use three boolean values, one for password, email and other.

Option 1

constructor(props) {
  super(props);
  this.state = {
    currentPassword: "",
    newPassword: "",
    email: '',
    currentUser: {
      username: "",
      email: "",
      city: "",
      mobileNumber: "",
    },
    username: '',
    city: '',
    mobileNumber: '',
    data: {},
    loading: true
  }
}

_updateProfileData = async () => {

  const { currentPassword, email, currentUser, newPassword,
    mobileNumber, username, city } = this.state;

  if (currentPassword === "") {
    alert("please write your current password first!")
    return;
  }

  if (email !== currentUser.email) {
    // email changed update
    await this.changeEmail();
  }

  if (newPassword !== currentPassword) {
    // password changed update
    await this.changePassword();
  }

  if (city !== currentUser.city || mobileNumber !== currentUser.mobileNumber || username !== currentUser.username) {
    await this._updateData();
  }
}

async componentDidMount() {
  try {
    const userId = firebase.auth().currentUser.uid;
    await this.setState({ userId });
    console.log("@uid", this.state.userId);
    let recentPostsRef = firebase.database().ref(`users/${userId}`);
    await recentPostsRef.once('value').then(snapshot => {
      const currentUser = snapshot.val();
      this.setState({ currentUser: currentUser, email: currentUser.email, username: currentUser.username, city: currentUser.city, mobileNumber: currentUser.mobileNumber, loading: false })
      console.log(this.state.currentUser)
    }).catch((error) => console.log("@error", error));
  } catch (error) {
    console.log("@CError", error);
  }
}

Option 2, have three booleans, passwordChanged,emailChanged,otherChanged when the user types in one of the inputs, set the value to true and in your _updateProfileData check if the value is true, then update the value.

constructor(props) {
  super(props);
  this.state = {
    currentPassword: "",
    newPassword: "",
    currentUser: {
      username: "",
      email: "",
      city: "",
      mobileNumber: "",
    },
    data: {},
    // boolean values for email, password and other
    passwordChanged: false,
    emailChanged: false,
    otherChanged: false,
    loading: true
  }
}

_updateProfileData = async () => {

  const { currentPassword, passwordChanged, emailChanged, otherChanged } = this.state;

  if (currentPassword === "") {
    alert("please write your current password first!")
    return;
  }

  if (emailChanged) {
    // email changed update
    await this.changeEmail();
  }

  if (passwordChanged) {
    // password changed update
    await this.changePassword();
  }

  if (otherChanged) {
    await this._updateData();
  }
}

Answer 2

Please do the following:

// You have to change the method _updateProfileData as following
_updateProfileData = async () => {
        if (this.state.currentPassword === "") {
            alert("please write your current password first!")
            return;
        } if (this.state.currentUser.email === "") {
            alert("Email can't be blank")
            return;
        } if (this.state.currentUser.username === "") {
            alert("Username can't be blank")
            return;
        } if (this.state.currentUser.city === "") {
            alert("City can't be blank")
            return;
        } if (this.state.currentUser.mobileNumber === "") {
            alert("Mobile number can't be blank")
            return;
        } else {
            this._getCurrentUserData((oldUserData) => {
            if(oldUserData.email !== this.state.currentUser.email) {
                 await this.changeEmail();
            }

            if(this.state.newPassword !== this.state.currentPassword) {
                 await this.changePassword();
            }

            if(oldUserData.username !== this.state.currentUser.username || oldUserData.city !== this.state.currentUser.city || oldUserData.mobileNumber !== this.state.currentUser.mobileNumber ) {
                 await this._updateData();
            }
            );
        }
    }

// You have to add this method in your component
_getCurrentUserData = (callBack) => {
   AsyncStorage.getItem('@MyProfile:data')
            .then(json => JSON.parse(json))
            .then(currentUser => callBack(currentUser))
            .catch(error => console.log('@error' + error));
}