TypeError: from.from is not a function. (In 'from.from(observables[0])', 'from.from' is undefined)

Here is my component

const PlaylistItem = ({playlist}) => {
  console.log(playlist);
    return (
    <List.Item
      title={playlist.title}
      description="by you"
      left={props => <List.Icon {...props} icon="audiotrack" />}
    />
  );
};

const enhance = withObservables(['playlist'], ({playlist}) => ({
  playlist
}));

export default enhance(PlaylistItem);

Here is how I call the component

<FlatList
          data={this.state.playlists}
          renderItem={(item) => <PlaylistItem playlist={item} />}
        />

This is my query

async componentDidMount(){
    const playlists = database.collections.get('playlists');
    const allPlaylists = await playlists.query().fetch();
    console.log("playlist ", allPlaylists);
    this.setState({
      playlists: allPlaylists
    })
  }

Please help me. I am not able to understand the problem. If I remove withObservables and export as it is, it is working fine.

[YajanaRao]

The walk around for this issue is to change var from = require('rxjs/observable/from'); to var from = require('rxjs'); in \node_modules\@nozbe\with-observables\dist\with-observables.cjs.js

[joshfarrant]

Sorry to reopen this discussion, but I was experiencing the same from.from is undefined that @YajanaRao was experiencing.

The solution they proposed (modifying the import in with-observables.cjs.js did resolve the issue, but obviously that’s just a workaround, not a permanent fix.

Are there any suggestions as to what the underlying issue could be, and how that can be resolved? Is it as simple as changing the import, or coudl that have knock-on effects?