mobx-state-tree: `process` is a very bad function name

in my case what i’m using is a map function to process:

import { process as co } from 'mobx-state-tree';
const mapToProcess = (props = {}) => {
  return Object.keys(props).reduce((result, key) => {
    if (
      props[key].constructor &&
      props[key].constructor.name === 'GeneratorFunction'
    ) {
      result[key] = co(props[key]);
      return result;
    }

    result[key] = props[key];
    return result;
  }, {});
};

so in your actions definition you can do this:

...
.actions(self => mapToProcess({
  changeName(name) {
    ...
  },
  *fetchRandomName() {
    ...
  }
}))

any tools out there that secretly inject flow globals 😛 ?

Op ma 25 sep. 2017 om 12:00 schreef Mattia Manzati <notifications@github.com

:

Flow is a very good one!

— You are receiving this because you commented.

Reply to this email directly, view it on GitHub https://github.com/mobxjs/mobx-state-tree/issues/399#issuecomment-331835010, or mute the thread https://github.com/notifications/unsubscribe-auth/ABvGhC7PD4yC1SVtnenldkG95XoLDMKxks5sl3m4gaJpZM4PhHBO .

I like the abstraction behind the word: activity but I can live with flow too 😄

Flow is a very good one!

@nickbreaton In the past it worked like that, but was changed due to problems imlied by transpilation. See #279.

What if it was renamed to fromGeneratorToAsync as suggested by @aretecode, but it was implied by using a generator function in actions.

types
  .model({
    name: 'default'
  })
  .actions(self => ({
    changeName(name) {
      self.name = name
    },
    *fetchRandomName() { 
      const response = yield axios('.....')
      self.name = response.data
    }
  }))

instead of

  types
    .model({
      name: 'default'
    })
    .actions(self => ({
      changeName(name) {
        self.name = name
      },
      /* this would replace 'process', and would still be valid, but verbose */
      fetchRandomName: fromGeneratorToAsync(function* () { 
        const response = yield axios('.....')
        self.name = response.data
      })
    }))

This can be detected by checking the constructor name:

(function a() {}).constructor.name  // => "Function"
(function* b() {}).constructor.name  // => "GeneratorFunction"