Skip to content

Instantly share code, notes, and snippets.

@paulruescher
Last active December 8, 2015 06:17
Show Gist options
  • Save paulruescher/180e70b15c599f427b50 to your computer and use it in GitHub Desktop.
Save paulruescher/180e70b15c599f427b50 to your computer and use it in GitHub Desktop.
const NotificationHoC = function(Component) {
return React.createClass({
componentDidMount() {
const success = (notifications) => {
this.setState({
notifications: notifications,
});
};
$.ajax({
url: '/notifications',
dataType: 'json',
success: success,
});
},
onMarkAsRead(id) {
// some mark as read logic
},
render() {
return (
<Component
notifications={this.state.notifications}
onMarkAsRead={this.onMarkAsRead}
/>
);
},
});
}
const Notifications = NotificationHoC(React.createClass({
renderNotification({notification}) {
const { id, date, message } = notification;
return (
<div>
<span>{message} — {date}</span>
<button onClick={this.props.onMarkAsRead.bind(null, id)}>Mark as Read</button>
</div>
);
},
render() {
return <div>{this.props.notifications.map(renderNotification)}</div>;
},
}));
const App = React.createClass({
render() {
return <Notifications />
},
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment