How to use a Generator function with typescript? instead of async await?

[MiniSuperDev]

How can I write this two async await examples using a generator?

My goal is to reduce the boilerplate, I don't like to use the runInAction and and even less create a separate function

In the docs I see you recommend to use a generator https://mobx.js.org/actions.html#asynchronous-actions

But I don't know how to use it, please help me.

Thanks

import { makeAutoObservable, runInAction } from 'mobx';

async function getNumber(): Promise<number> {
  return 2;
}

async function getString(): Promise<string> {
  return 'B';
}

class MyStore {
  value = {
    number: 1,
    string: 'A',
  };

  constructor() {
    makeAutoObservable(this);
  }

  async asyncAwaitFun(): Promise<void> {
    const aNumber = await getNumber();
    runInAction(() => {
      this.value.number = aNumber;
    });

    const aString = await getString();
    runInAction(() => {
      this.value.string = aString;
    });
  }

  // How to make this work?
  // What is the return type?
  *generatorFun() {
    const aNumber = yield getNumber();
    this.value.number = aNumber;
    const aString = yield getString();
    this.value.string = aString;
  }
}

And I have this other case where I read an AsyncGenerator from open ai chat

How can I use the mobx generator syntax?
I want to remove I want to remove all those runInAction

Thanks

import { makeAutoObservable, runInAction } from 'mobx';
import OpenAI from 'openai';

class ChatStore {
  constructor() {
    makeAutoObservable(this);
  }

  isLoading = false;
  content = '';
  error: unknown | null = null;

  async getCompletion(): Promise<void> {
    try {
      this.isLoading = true;
      const openai = new OpenAI();
      const stream = await openai.chat.completions.create({
        model: 'gpt-4',
        messages: [{ role: 'user', content: 'Say this is a test' }],
        stream: true,
      });

      for await (const part of stream) {
        runInAction(() => {
          this.content += part.choices[0]?.delta?.content || '';
        });
      }
      runInAction(() => {
        this.isLoading = false;
      });
    } catch (e) {
      runInAction(() => {
        this.error = e;
        this.isLoading = false;
      });
    }
  }
}

[urugator]

#3195