Using a React mixin to ensure an authenticated user

Hey,

I’m only familiar with React through Meteor so I apologize is what I write seems really bad :).

After reading what @arunoda wrote on his FlowRouter issue that “authentication management” shouldn’t really be part of FlowRouter the first thing that came to mind was to try and use React mixin for this.

We start off by making a new mixin to use:

EnsureAuthenticated = {
  componentWillMount() {
    if(!Meteor.user() && FlowRouter._current.path !== '/login') {
      FlowRouter.go('/login');
    }
  }
}; 

Then, when creating our component we add that mixin:

RecordsComponent.List = React.createClass({
  mixins: [EnsureAuthenticated],
  render() {
    return (<h1>Auth test</h1>);
  }
});

Can anyone comment if this is a good/proper way to deal with this?

P.S. Yes, I know I could have had this auth logic in the FlowRouter trigger but from what I gathered I’d be better to decouple this from the router as much as possible

Your code idea is correct. But there need to change a lot. Wait couple of days for the flow router guide for more info on these.

1 Like