How do I use yield put() action inside a callback to save its data?

Question

I'm using redux-saga for my store and https://github.com/chirag04/react-native-in-app-utils to load my Apple in-app purchase products.

The format to retrieve is:

var products = [
   'com.xyz.abc',
];
InAppUtils.loadProducts(products, (error, products) => {
   //update store here.
});

I can't use the conventional yield put(actions.saveMethod(data)) because it isn't a generator.

I have this code in a subscription saga that looks like this:

export function* iosSubscriptionSaga() {
    let resp = yield validateUserReceipt();

    let respProducts = call(InAppUtils.loadProducts, products);

    put(IapActions.loadSubscriptionProduct(products[0])) //doesn't work

}

How do I save the products into my store?

EDIT: I was able to get it working by wrapping it inside a Promise.

export function* iosSubscriptionSaga() {
    // validate subscription receipt here

    let productsResp = yield loadProducts();
    if (productsResp) {
        yield put(IapActions.loadSubscriptionProduct(productsResp[0]));
        yield put(IapActions.loadSubscriptionsSuccess());
    } else {
        yield put(IapActions.loadSubscriptionsFailure('Error: Failed to load products from iTunes Connect.'))
    }
}

function loadProducts() {
    return new Promise((resolve, reject) => {
        InAppUtils.loadProducts(products, (error, products) => {
            if (!error) {
                resolve(products);
            } else reject(error);
        });
    });
}

I am not sure I am doing the error handling right though.

Answer 1

Just await for InAppUtils.loadProducts. You can use yield to do so.

export function* iosSubscriptionSaga() {
    try {
        let resp = yield validateUserReceipt();
        let respProducts = yield call(InAppUtils.loadProducts, products);
        yield put(IapActions.loadSubscriptionProduct(products[0]))
    } catch (e) {
        yield put(IapActions.loadSubscriptionsFailure('Error: Failed to load products from iTunes Connect.'))
    }
}

To use yield keyword in loadProducts callback, rewrite callback as generator function.

InAppUtils.loadProducts(products, function* onComplete(error, products) {
  yield put(...);
});

I suggest to read more on generators topic - it will make your life easier and code easier to read ;)