App crashes after refresh - reactjs

Question

I have got a problem with my app. Everything is fine untill I press the refresh button. I assume it is happening because of some stuff is not ready to be rendered yet.
import React from 'react'
import { Meteor } from 'meteor/meteor'
import { createContainer } from 'meteor/react-meteor-data'
import { withRouter } from 'react-router'
import LeftNavbar from '../dashboard/LeftNavbar'
import UpperBar from '../dashboard/UpperBar'
import NewGreetingsForm from './NewGreetingsForm'
import ConfigureButtons from './ConfigureButtons'
import Fanpages from '../../../api/Fanpages.js'
import './Greetings.scss'
export class Greetings extends React.Component {
constructor (props) {
super(props)
this.fanpage = this.props.user.profile.fanpages
this.state = {
newGreetingsText: '',
newGreetingsCharCount: 0
}
}
componentDidMount () {
}
render () {
const currentFanpage = Fanpages.findOne({fanpageName: this.fanpage})
const currentGreeting = currentFanpage.fanpageInfo.fanpageInfo.config.greeting[0].text
return (
<div className='container page'>
<UpperBar title={'Konfiguracja fanpage / Zdefiniuj greetings'} />
<LeftNavbar />
<div className='main-content'>
<h4 id='main-title'>{this.fanpage}</h4>
<div className='container'>
<div className='row'>
<ConfigureButtons />
<div>
<h5 id='configure-content-right'>Zmień obecną informację</h5>
<NewGreetingsForm fanpageName={this.fanpage} placeholder={currentGreeting} />
</div>
</div>
</div>
</div>
</div>
)
}
}
export default withRouter(createContainer(() => ({
user: Meteor.user()
}), Greetings))
Any idea where I should move those variables from render method? So it works as it should after page refresh? Thanks a lot for any participation.

Answer 1

Assuming there's subscription management going on above this component you can just defend against the data not being ready:
render () {
const currentFanpage = Fanpages.findOne({fanpageName: this.fanpage});
if (!currentFanpage) {
return (
<div />
);
} else {
const currentGreeting = currentFanpage.fanpageInfo.config.greeting[0].text
return (
// your html
)
}
}
Better yet, have the parent component render a spinner until the subscription is .ready()
Update
You asked about using createContainer with withRouter. I don't normally use withRouter and I haven't tested this but it should go something like:
const container = () => {
const sub = Meteor.subscribe('mysub');
const loading = sub.ready();
const user = Meteor.user();
return { loading, user };
}
export default withRouter(container, Greetings))
The important thing being that the container have a loading key that's tied to the state of the subscription.
Container tutorial