how to get events before subscription?

[zephy358]

Hi, I really like the idea of this project and plan to use it in a small project. But how to handle the following scenario:

The app fetches user info on app starts. There's some component relies on the user info to render. But this component mounts after the fetch user info event fires. So far as I tried, I found the component only subscribes to future events but not the past.

Is there any way to solve this problem other than storing user info to some global store?

[jcouyang]

sorry i dont quite get what do you mean subscribes past event. if you want to control the display of a component, it sounds like a toggle state to me.

userinfo? <A/>:<B/>

or i could be wrong understanding you question. in that case can you make a example?

[zephy358]

for example:

@connect((intent$)=>{
  return {
    add: () => ({type: 'add'})
  }
})
class Example extends React.Component {
  componentDidMount() {
    this.props.actions.add();
    this.props.actions.add();
    this.props.actions.add();
    setTimeout(() => this.setState({
      show: true
    }, () => {
      this.props.actions.add();
      this.props.actions.add();
      this.props.actions.add();
    }), 2000);
  }
  render() {
    return (
      <div>
        <Count />
        {this.state.show ? <Count/> : null}
      </div>
    )
  }
}

@connect((intent$) => {
  return {
    countSink$: intent$.filter(x => x.type === 'add').map(intent => state => ({
      count: state.count + 1;
    })
  }
})
class Count extends Component {
  render() {
    return <div>{this.props.count}</div>
  }
}

These 2 Count components will render different count number. But I wonder if theres any way that two Count Components shows the same count number.

Or I put it in this way: Is there anything like the replay api in rxjs for react-most?

[jcouyang]

ah, I got what you mean here, replay maybe probably multicast in most(but probably won't work here). but the current behavior actually make sense to me, if the component if not mount yet, it means two components will subscribe the stream at different time, all the actions will not go though that component. this is why FRP should be descriptive programming, not imperative.
also the 2 Count are actually 2 different components with different states. if you really want to sync this two components, probably need to move the state outside of Count, pass the state as data to Count

[zephy358]

I think this feature matters because it is common that app fetches user info on start, but many components mount after user info fetching have to use the user info.

The connect decorator is executed upon import and the view is independent of the data. Therefore, I think it's possible and maybe more reasonable that all the components decorated by connect subscribe the streams upon app start. Or maybe 2 streams, 1 since app start, the other after component mounts, so that we can use react-most to handle all the work of state management.

[jcouyang]

if you see a react component as a function, it won't be called until it's mount

if a function is not called, why it should subscribe to a stream and react to you actions?

map(intent => state => ({
      count: state.count + 1;
    }

the problem here is not subscribe, react-most map intent and state to new state, it's pure without any side effect, at this point if you want to sync the initial state with other Counter, that make things unreasonable to me though. instead it should be data, not state.

I'm still confusing about your use case, yes a lot of components will mount after user info is fetched, but why should those component react to the actions you made before fetching user info? should they only care what user do after your login?

[zephy358]

Well, I'm thinking of using react-most only to manage of the states, which includes the initial state and other global information. I think it is capable of taking the place of redux. If components can't get information before they mount, we still need other mechanism like redux, or context to provide all the necessary data for components.

if we see a react component as a function, it won't be called until it's mount, but the connect function is called once imported. I fell it more intuitive that once connect function is called, it subscribes to the stream.

[jcouyang]

I fell it more intuitive that once connect function is called, it subscribes to the stream

no, all code here is descriptive, you can see connect accepted a function, connect is call doesn't mean that function(which does the subscription) will be called immediately. connect means wrap you component definition to a HOC, not creating a Component, everthing happen lazily once you call it
like <Count />