Merge pull request #12 from cayuu/master

Add a timeout prop to dismiss the notification
pburtchaell · May 15, 2015 · 4ecbcce · 4ecbcce
2 parents 9ac2e29 + bf5e2ac
commit 4ecbcce
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 0 deletions.
diff --git a/README.md b/README.md
@@ -33,6 +33,7 @@ See [here](/bin/tests/test.js).
 | message   | string          | The message for the notification                    | true      |
 | action    | string          | The name of the action, e.g., "close" or "undo"     |           |
 | styles    | object || bool  | Styles to apply to the component*                   |           |
+| dismissAfter | integer      | Time in milliseconds to dismiss the notification (eg. `2000` for 2 seconds) |           |
 
 *Setting this prop to `false` will disable all inline styles. This is useful if you aren't using React inline styles and would like to use CSS instead. See [styles](#styles) for more.
 

diff --git a/src/notification.js b/src/notification.js
@@ -123,6 +123,15 @@ var Notification = React.createClass({
     };
   },
 
+  componentWillReceiveProps: function (nextProps) {
+    if (!nextProps.dismissAfter) return;
+
+    if (this.state.timeoutId) clearTimeout( this.state.timeoutId );
+    this.state.timeoutId = setTimeout( this.hide(), nextProps.dismissAfter );
+
+    this.setState(this.state);
+  },
+
   render: function () {
     return (
       <div className="notification-bar" style={this.getBarStyles()}>