Is it OK to store a Promise in state?

[PrasadJayakumar]

I have a use case where I need to de-duplicate axios call. Just in-case, if multiple components fire the same request concurrently, I prefer to the store the promise and make all the caller wait, until the response is ready.

From this context, my question is Is it OK to store a Promise in state?

const state = () => ({
  promises: {},
});

const actions = {
  cleanUp(id) {
    try {
      if (id) delete this.promises[id];
    } catch (error) {
      console.error('useDedup.cleanUp has errored: ', error);
    }
  },

  async fetchData(id) {
    try {
      const state = this;

      let cachedPromise = state.promises[id];
      if (!cachedPromise) {
        cachedPromise = apiClientCall();
        state.promises[id] = cachedPromise;
      }

      const resp = await cachedPromise;
      console.log('Got my copy: ', resp);
    } catch (error) {
      console.error('Caught the error: ', error);
    } finally {
      this.cleanUp(id);
    }
  },
};