diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/AssignGroups/index.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/AssignGroups/index.js
new file mode 100644
index 00000000000..38df0b96050
--- /dev/null
+++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/AssignGroups/index.js
@@ -0,0 +1,232 @@
+/*
+ * Copyright (c) 2020, Entgra (pvt) Ltd. (http://entgra.io) All Rights Reserved.
+ *
+ * Entgra (pvt) Ltd. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React from 'react';
+import { withConfigContext } from '../../../../../../../../components/ConfigContext';
+import { Button, Col, Form, message, notification, Radio, Select } from 'antd';
+import axios from 'axios';
+const { Option } = Select;
+
+class AssignGroups extends React.Component {
+ constructor(props) {
+ super(props);
+ this.config = this.props.context;
+ this.userSelector = React.createRef();
+ this.roleSelector = React.createRef();
+ this.state = {
+ roles: [],
+ users: [],
+ groups: [],
+ };
+ }
+ componentDidMount() {
+ this.getRolesList();
+ this.getGroupsList();
+ }
+
+ handleSetUserRoleFormItem = event => {
+ if (event.target.value === 'roleSelector') {
+ this.roleSelector.current.style.cssText = 'display: block;';
+ this.userSelector.current.style.cssText = 'display: none;';
+ } else {
+ this.roleSelector.current.style.cssText = 'display: none;';
+ this.userSelector.current.style.cssText = 'display: block;';
+ }
+ };
+
+ getRolesList = () => {
+ let apiURL =
+ window.location.origin +
+ this.config.serverConfig.invoker.uri +
+ this.config.serverConfig.invoker.deviceMgt +
+ '/roles?user-store=PRIMARY&limit=100';
+
+ axios
+ .get(apiURL)
+ .then(res => {
+ if (res.status === 200) {
+ this.setState({
+ roles: res.data.data.roles,
+ });
+ }
+ })
+ .catch(error => {
+ if (error.hasOwnProperty('response') && error.response.status === 401) {
+ // todo display a popop with error
+
+ message.error('You are not logged in');
+ window.location.href = window.location.origin + '/entgra/login';
+ } else {
+ notification.error({
+ message: 'There was a problem',
+ duration: 0,
+ description: 'Error occurred while trying to load roles.',
+ });
+ }
+ });
+ };
+
+ getUsersList = value => {
+ let apiURL =
+ window.location.origin +
+ this.config.serverConfig.invoker.uri +
+ this.config.serverConfig.invoker.deviceMgt +
+ '/users/search/usernames?filter=' +
+ value +
+ '&domain=Primary';
+ axios
+ .get(apiURL)
+ .then(res => {
+ if (res.status === 200) {
+ let users = JSON.parse(res.data.data);
+ this.setState({
+ users,
+ });
+ }
+ })
+ .catch(error => {
+ if (error.hasOwnProperty('response') && error.response.status === 401) {
+ // todo display a popop with error
+ message.error('You are not logged in');
+ window.location.href = window.location.origin + '/entgra/login';
+ } else {
+ notification.error({
+ message: 'There was a problem',
+ duration: 0,
+ description: 'Error occurred while trying to load users.',
+ });
+ }
+ });
+ };
+
+ // fetch data from api
+ getGroupsList = () => {
+ let apiUrl =
+ window.location.origin +
+ this.config.serverConfig.invoker.uri +
+ this.config.serverConfig.invoker.deviceMgt +
+ '/admin/groups';
+
+ // send request to the invokerss
+ axios
+ .get(apiUrl)
+ .then(res => {
+ if (res.status === 200) {
+ this.setState({
+ groups: res.data.data.deviceGroups,
+ });
+ }
+ })
+ .catch(error => {
+ if (error.hasOwnProperty('response') && error.response.status === 401) {
+ // todo display a popop with error
+ message.error('You are not logged in');
+ window.location.href = window.location.origin + '/entgra/login';
+ } else {
+ notification.error({
+ message: 'There was a problem',
+ duration: 0,
+ description: 'Error occurred while trying to load device groups.',
+ });
+ }
+ });
+ };
+
+ render() {
+ const { getFieldDecorator } = this.props.form;
+ return (
+
+
+
+ Set User role(s)
+ Set User(s)
+
+
+
+ {getFieldDecorator('roles', {})(
+
+ Any
+ {this.state.roles.map(role => (
+
+ {role}
+
+ ))}
+ ,
+ )}
+
+
+
+
+ {getFieldDecorator('users', {})(
+
+ {this.state.users.map(user => (
+
+ {user.username}
+
+ ))}
+ ,
+ )}
+
+
+
+
+ {getFieldDecorator('deviceGroups', {})(
+
+ NONE
+ {this.state.groups.map(group => (
+
+ {group.name}
+
+ ))}
+ ,
+ )}
+
+
+
+
+ Back
+
+
+ Continue
+
+
+
+
- {/*
*/}
- {/* */}
- {/* {this.getOptionForTimeSelectors(1440, 1410, 30)}*/}
- {/* */}
- {/*
*/}
{policyUIConfigurationsList.map((element, i) => {
return (
@@ -729,6 +722,16 @@ class ConfigureProfile extends React.Component {
);
})}
+
+
+
+ Back
+
+
+ Continue
+
+
+
+
+ {getFieldDecorator('policyName', {
+ rules: [
+ {
+ pattern: new RegExp('^.{1,30}$'),
+ message: 'Should be 1-to-30 characters long',
+ },
+ ],
+ })(
+
+ {getFieldDecorator('description', {})()}
+
+
+
+
+ Back
+
+
+ Save & Publish
+
+ Save
+
+
+
+ {policies[i].policyName}
+ ,
+ );
+ }
+ }
+ this.setState({
+ correctivePoliciesList: correctivePolicies,
+ });
+ }
+ })
+ .catch(error => {
+ if (error.hasOwnProperty('response') && error.response.status === 401) {
+ // todo display a popop with error
+ message.error('You are not logged in');
+ window.location.href = window.location.origin + '/entgra/login';
+ } else {
+ notification.error({
+ message: 'There was a problem',
+ duration: 0,
+ description: 'Error occurred while trying to load policies.',
+ });
+ }
+
+ this.setState({ loading: false });
+ });
+ };
+
+ handlePolicyTypes = event => {
+ if (event.target.value === 'GENERAL') {
+ document.getElementById('generalPolicySubPanel').style.display = 'block';
+ } else {
+ document.getElementById('generalPolicySubPanel').style.display = 'none';
+ }
+ };
+
+ render() {
+ const { getFieldDecorator } = this.props.form;
+ return (
+
+
+ {getFieldDecorator('policyType', {
+ initialValue: 'GENERAL',
+ })(
+
+ General Policy
+ Corrective Policy
+ ,
+ )}
+
+
+
+ Select Corrective Policy
+
+
+
+ }
+ >
+ {getFieldDecorator('correctiveActions', {
+ initialValue: 'NONE',
+ })(
+
+ None
+ {this.state.correctivePoliciesList}
+ ,
+ )}
+
+
+
+
+
+ Back
+
+
+ Continue
+
+
+
+
+ >
+
+ >
+
-
+ >
+
- {currentStepIndex > 0 && (
- this.onHandlePrev()}
- >
- Previous
-
- )}
- {currentStepIndex > 0 && currentStepIndex < 5 && (
- this.onHandleNext()}>
- Next
-
- )}
- {currentStepIndex === 5 && Done }
-
-
);