Initial commit

src/common/components/Alert/index.js

@@ -0,0 +1,36 @@
+import React from 'react';
+import {observer, inject} from 'mobx-react';
+import Dialog from 'material-ui/Dialog';
+import FlatButton from 'material-ui/FlatButton';
+import RaisedButton from 'material-ui/RaisedButton';
+import {DIALOG} from "../../stores/global_ui";
+
+@inject('appstate')
+@observer
+export default class Alert extends React.Component {
+  constructor(props) {
+    super(props);
+    this.props = props;
+  }
+
+  render() {
+    const actions = [
+      <FlatButton
+        label="OK"
+        primary={true}
+        onClick={() => this.props.appstate.globalUI.hideAlert()}
+      />,
+    ];
+    
+    return (<div>
+      <Dialog
+        actions={actions}
+        modal={false}
+        open={this.props.appstate.globalUI[DIALOG.UI.ALERT]}
+        onRequestClose={() => this.props.appstate.globalUI.hideAlert()}
+      >
+        {this.props.appstate.globalUI.globalAlert}
+      </Dialog>
+    </div>);
+  }
+}

src/common/components/ConfirmationDialog/index.js

@@ -0,0 +1,61 @@
+import React from 'react';
+import Dialog from 'material-ui/Dialog';
+import FlatButton from 'material-ui/FlatButton';
+import RaisedButton from 'material-ui/RaisedButton';
+import { confirmable } from 'react-confirm';
+
+import lightBaseTheme from 'material-ui/styles/baseThemes/lightBaseTheme';
+import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
+import getMuiTheme from 'material-ui/styles/getMuiTheme';
+
+const Theme = (props) => (
+  <MuiThemeProvider muiTheme={getMuiTheme(lightBaseTheme)}>
+    { props.children }
+  </MuiThemeProvider>
+);
+
+class Confirmation extends React.Component {
+
+  render() {
+    const {
+      okLabel = 'OK',
+      cancelLabel = 'Cancel',
+      title,
+      confirmation,
+      show,
+      proceed,
+      dismiss,
+      cancel,
+      modal,
+    } = this.props;
+
+    const actions = [
+      <FlatButton
+        label={cancelLabel}
+        secondary={true}
+        onClick={cancel}
+      />,
+      <FlatButton
+        label={okLabel}
+        primary={true}
+        onClick={proceed}
+      />,
+    ];
+
+    return (
+      <Theme>
+      <Dialog
+        title={title}
+        actions={actions}
+        modal={modal}
+        open={show}
+        onRequestClose={dismiss}
+      >
+        {confirmation}
+      </Dialog>
+      </Theme>
+    );
+  }
+}
+
+export default confirmable(Confirmation);