How to use the ember-bootstrap/utils/transition-end function in ember-bootstrap

let tooltipShowComplete = () => {
      if (this.get('isDestroyed')) {
        return;
      }
      let prevHoverState = this.get('hoverState');

      this.get('onShown')(this);
      this.set('hoverState', null);

      if (prevHoverState === 'out') {
        this.leave();
      }
    };

    if (skipTransition === false && this.get('usesTransition')) {
      transitionEnd(this.get('overlayElement'), this.get('transitionDuration'))
        .then(tooltipShowComplete);
    } else {
      tooltipShowComplete();
    }
  }

hide() {
    this.get('onHide')();

    this.setProperties({
      transitioning: true,
      active: false
    });
    this.setCollapseSize(this.getExpandedSize('hide'));

    transitionEnd(this.get('element'), this.get('transitionDuration')).then(() => {
      if (this.get('isDestroyed')) {
        return;
      }
      this.set('transitioning', false);
      if (this.get('resetSizeWhenNotCollapsing')) {
        this.setCollapseSize(null);
      }
      this.get('onHidden')();
    });

    next(this, function() {
      if (!this.get('isDestroyed')) {
        this.setCollapseSize(this.get('collapsedSize'));
      }
    });
  }

schedule('afterRender', this, function() {
        let backdrop = this.get('backdropElement');
        assert('Backdrop element should be in DOM', backdrop);
        if (doAnimate) {
          transitionEnd(backdrop, this.get('backdropTransitionDuration'))
            .then(callback);
        } else {
          callback();
        }
      });

} else if (!this.get('isOpen') && this.get('backdrop')) {
      let backdrop = this.get('backdropElement');
      assert('Backdrop element should be in DOM', backdrop);

      let callbackRemove = () => {
        if (this.get('isDestroyed')) {
          return;
        }
        this.set('showBackdrop', false);
        if (callback) {
          callback.call(this);
        }
      };
      if (doAnimate) {
        transitionEnd(backdrop, this.get('backdropTransitionDuration'))
          .then(callbackRemove);
      } else {
        callbackRemove();
      }
    } else if (callback) {
      next(this, callback);
    }
  }

hide() {
    if (!this._isOpen) {
      return;
    }
    this._isOpen = false;

    this.resize();
    this.set('showModal', false);

    if (this.get('usesTransition')) {
      transitionEnd(this.get('modalElement'), this.get('transitionDuration'))
        .then(() => this.hideModal());
    } else {
      this.hideModal();
    }
  }

hide() {
    if (this.get('usesTransition')) {
      transitionEnd(this.get('element'), this.get('fadeDuration'))
        .then(() => {
          if (!this.get('isDestroyed')) {
            this.set('active', false);
          }
        });
      this.set('showContent', false);
    } else {
      this.set('active', false);
    }
  }

show() {
    if (this.get('usesTransition')) {
      transitionEnd(this.get('element'), this.get('fadeDuration'))
        .then(() => {
          if (!this.get('isDestroyed')) {
            this.setProperties({
              active: true,
              showContent: true
            });
          }
        });
    } else {
      this.set('active', true);
    }
  }

show() {
    this.get('onShow')();

    this.setProperties({
      transitioning: true,
      active: true
    });
    this.setCollapseSize(this.get('collapsedSize'));

    transitionEnd(this.get('element'), this.get('transitionDuration')).then(() => {
      if (this.get('isDestroyed')) {
        return;
      }
      this.set('transitioning', false);
      if (this.get('resetSizeWhenNotCollapsing')) {
        this.setCollapseSize(null);
      }
      this.get('onShown')();
    });

    next(this, function() {
      if (!this.get('isDestroyed')) {
        this.setCollapseSize(this.getExpandedSize('show'));
      }
    });
  }