Role check component

package.json

@@ -34,7 +34,9 @@
   "author": "Tim Mikeladze",
   "license": "MIT",
   "dependencies": {
-    "lodash": "^4.16.4"
+    "lodash": "^4.16.4",
+    "react": "^15.4.2",
+    "roles-client": "0.0.1"
   },
   "devDependencies": {
     "babel-cli": "^6.18.0",

src/RoleCheck.js

@@ -0,0 +1,40 @@
+import { Component, PropTypes } from 'react';
+import Roles from 'roles-client';
+
+class RoleCheck extends Component {
+  static propTypes = {
+    children: PropTypes.node.isRequired,
+    roles: PropTypes.oneOfType([
+      PropTypes.string,
+      PropTypes.array,
+    ]),
+    group: PropTypes.string.isRequired,
+  }
+  constructor(props, context) {
+    super(props, context);
+    this.state = {
+      isLoading: true,
+      hasAccess: false,
+    };
+  }
+  async componentDidMount() {
+    const { roles, group } = this.props;
+    // TODO Catch and handle promise error
+    let hasAccess = false;
+    if (roles && group) {
+      hasAccess = await Roles.userIsInRole(roles, group);
+    } else if (group) {
+      hasAccess = await Roles.userIsInGroup(group);
+    }
+    // eslint-disable-next-line react/no-did-mount-set-state
+    this.setState({
+      isLoading: false,
+      hasAccess,
+    });
+  }
+  render() {
+    return this.state.hasAccess && this.props.children;
+  }
+}
+
+export default RoleCheck;

src/index.js

@@ -1,39 +1,3 @@
-// import { Component, PropTypes } from 'react';
-// import Roles from './roles';
-//
-// class RoleCheck extends Component {
-//   static propTypes = {
-//     children: PropTypes.node.isRequired,
-//     roles: PropTypes.oneOfType([
-//       PropTypes.string,
-//       PropTypes.array,
-//     ]),
-//     group: PropTypes.string.isRequired,
-//     userId: PropTypes.string.isRequired,
-//   }
-//   constructor(props, context) {
-//     super(props, context);
-//     this.state = {
-//       isLoading: true,
-//       hasAccess: false,
-//     };
-//   }
-//   componentDidMount() {
-//     const { roles, group, userId } = this.props;
-//     // TODO Catch and handle promise error
-//     const promise = roles
-//       ? Roles.userIsInRole(userId, roles, group)
-//       : Roles.userIsInGroup(userId, group);
-//     promise.then((res) => {
-//       this.setState({
-//         isLoading: false,
-//         hasAccess: res,
-//       });
-//     });
-//   }
-//   render() {
-//     return this.state.hasAccess && this.props.children;
-//   }
-// }
-//
-// export default RoleCheck;
+import RoleCheck from './RoleCheck';
+
+export default RoleCheck;