Removing chaining promises

Question

New to react-native and at the moment I'm working on chaining promises.

myFunction(human, destination = null) {
    const { navigation } = this.props;
    const { onRefresh } = navigation.state.params;
    this.setState({ isLoading: true });
    return PeopleService.closeService(
      human.humanId,
      destinationPoint && destinationPoint.humanId,
    )
      .then((result) => {
        if (result) {
          PeopleHelperService.refreshInfo().then(() => {
            if (onRefresh) {
              onRefresh();
            }
            navigation.popToTop();
            PopUp.showSuccess(
              "Success message",
            );
          });
        }
        PopUp.showError(
          "Failing message",
        );
        return null;
      })
      .finally(() => this.setState({ isLoading: false }));
  }

Things that I want to achieve is removing chain responsibility and make it simple without chaining.

Could anyone guide me on how can I achieve this? Links to some documentation and other source will be very helpful for me to understand how to make it.

UPDATE: Seems to be the answer with async/await working.

Answer 1

If you don't want using promise then using async await. Here it is.

myFunction = async (human, destination = null) => {
    const { navigation } = this.props;
    const { onRefresh } = navigation.state.params;
    this.setState({ isLoading: true });
    let result = await PeopleService.closeService(
      human.humanId,
      destinationPoint && destinationPoint.humanId,
    );

    if (result) {
        await PeopleHelperService.refreshInfo();
        if (onRefresh) {
            onRefresh();
        }
        navigation.popToTop();
        PopUp.showSuccess(
            "Success message",
        );
    }
    PopUp.showError(
        "Failing message",
    );
    this.setState({ isLoading: false })
}