From cc9e034edd6eb79e45240b5940a5296674a0810f Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Thu, 22 Aug 2019 19:58:22 +0530 Subject: [PATCH] Add react device-mgt device view page --- .../react-app/package.json | 11 +- .../react-app/public/conf/config.json | 14 +- .../react-app/src/App.js | 4 +- .../src/components/Devices/DevicesTable.js | 262 ++++++++++++++++++ .../react-app/src/components/apps/AppCard.js | 2 +- .../react-app/src/components/apps/AppList.js | 4 +- .../components/apps/release/DetailedRating.js | 4 +- .../components/apps/release/ReleaseView.js | 4 +- .../apps/release/install/DeviceInstall.js | 2 +- .../apps/release/install/GroupInstall.js | 2 +- .../apps/release/install/RoleInstall.js | 2 +- .../apps/release/install/UserInstall.js | 2 +- .../apps/release/review/AddReview.js | 4 +- .../apps/release/review/CurrentUsersReview.js | 4 +- .../components/apps/release/review/Reviews.js | 4 +- .../review/singleReview/SingleReview.js | 4 +- .../singleReview/editReview/EditReview.js | 4 +- .../react-app/src/index.html | 2 +- .../react-app/src/index.js | 16 +- .../react-app/src/pages/Login.js | 4 +- .../src/pages/dashboard/Dashboard.js | 89 +----- .../pages/dashboard/add-new-app/AddNewApp.js | 2 +- .../pages/dashboard/apps/release/Release.js | 6 +- .../src/pages/dashboard/devices/Devices.js | 67 +++++ .../src/pages/dashboard/logout/Logout.js | 2 +- .../react-app/webpack.config.js | 2 +- 26 files changed, 388 insertions(+), 135 deletions(-) create mode 100644 components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/Devices/DevicesTable.js create mode 100644 components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/devices/Devices.js diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/package.json b/components/device-mgt/io.entgra.device.mgt.ui/react-app/package.json index 77dc59124d4..fb850c9d2ce 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/package.json +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/package.json @@ -1,17 +1,12 @@ { - "name": "store", + "name": "entgra", "version": "1.0.0", - "description": "WSO2 IoT Server App Store", + "description": "Entgra device management", "main": "App.js", - "proxy": "http://localhost:3001", - "repository": { - "type": "git", - "url": "git://github.com/wso2/carbon-devicemgt" - }, "license": "Apache License 2.0", "dependencies": { "acorn": "^6.2.0", - "antd": "^3.20.1", + "antd": "^3.22.0", "axios": "^0.18.1", "d3": "^5.9.7", "dagre": "^0.8.4", diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/public/conf/config.json b/components/device-mgt/io.entgra.device.mgt.ui/react-app/public/conf/config.json index 0d1b5d86f46..43411cf4f81 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/public/conf/config.json +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/public/conf/config.json @@ -6,21 +6,21 @@ "primaryColor": "rgb(24, 144, 255)" }, "serverConfig": { - "invokerUri": "/ui-request-handler/invoke/application-mgt-store/v1.0", + "invokerUri": "/ui-request-handler/invoke/application-mgt-entgra/v1.0", "invoker": { - "uri": "/store-ui-request-handler/invoke", + "uri": "/entgra-ui-request-handler/invoke", "publisher": "/application-mgt-publisher/v1.0", - "store": "/application-mgt-store/v1.0", + "entgra": "/application-mgt-entgra/v1.0", "admin" : "", "deviceMgt" : "/device-mgt/v1.0" }, - "loginUri": "/store-ui-request-handler/login", - "logoutUri": "/store-ui-request-handler/logout", - "platform": "store" + "loginUri": "/entgra-ui-request-handler/login", + "logoutUri": "/entgra-ui-request-handler/logout", + "platform": "entgra" }, "defaultPlatformIcons": { "default": { - "icon": "global", + "icon": "hdd", "color": "#535c68", "theme": "outlined" }, diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/App.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/App.js index 5d8747417f5..68f8823e1a1 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/App.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/App.js @@ -65,7 +65,7 @@ class App extends React.Component { componentDidMount() { axios.get( - window.location.origin + "/store/public/conf/config.json", + window.location.origin + "/entgra/public/conf/config.json", ).then(res => { console.log(res); this.setState({ @@ -88,7 +88,7 @@ class App extends React.Component {
- + {this.props.routes.map((route) => ( ))} diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/Devices/DevicesTable.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/Devices/DevicesTable.js new file mode 100644 index 00000000000..a7bc211fae2 --- /dev/null +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/Devices/DevicesTable.js @@ -0,0 +1,262 @@ +/* + * Copyright (c) 2019, 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 axios from "axios"; +import {Tag, message, notification, Table, Typography, Tooltip, Icon} from "antd"; +import TimeAgo from 'javascript-time-ago' + +// Load locale-specific relative date/time formatting rules. +import en from 'javascript-time-ago/locale/en' +import {withConfigContext} from "../../context/ConfigContext"; + +const {Text} = Typography; + +let config = null; + +const columns = [ + { + title: 'Device', + dataIndex: 'name', + width: 100, + }, + { + title: 'Type', + dataIndex: 'type', + key: 'type', + render: type => { + const defaultPlatformIcons = config.defaultPlatformIcons; + let icon = defaultPlatformIcons.default.icon; + let color = defaultPlatformIcons.default.color; + let theme = defaultPlatformIcons.default.theme; + + if (defaultPlatformIcons.hasOwnProperty(type)) { + icon = defaultPlatformIcons[type].icon; + color = defaultPlatformIcons[type].color; + theme = defaultPlatformIcons[type].theme; + } + + return ( + + + + ); + } + // todo add filtering options + }, + { + title: 'Owner', + dataIndex: 'enrolmentInfo', + key: 'owner', + render: enrolmentInfo => enrolmentInfo.owner + // todo add filtering options + }, + { + title: 'Ownership', + dataIndex: 'enrolmentInfo', + key: 'ownership', + render: enrolmentInfo => enrolmentInfo.ownership + // todo add filtering options + }, + { + title: 'Status', + dataIndex: 'enrolmentInfo', + key: 'status', + render: (enrolmentInfo) => { + const status = enrolmentInfo.status.toLowerCase(); + let color = "#f9ca24"; + switch (status) { + case "active": + color = "#badc58"; + break; + case "created": + color = "#6ab04c"; + break; + case "removed": + color = "#ff7979"; + break; + case "inactive": + color = "#f9ca24"; + break; + case "blocked": + color = "#636e72"; + break; + } + return {status}; + } + // todo add filtering options + }, + { + title: 'Last Updated', + dataIndex: 'enrolmentInfo', + key: 'dateOfLastUpdate', + render: (data) => { + const {dateOfLastUpdate} = data; + const timeAgoString = getTimeAgo(dateOfLastUpdate); + return {timeAgoString}; + } + // todo add filtering options + }, + // { + // title: 'OS Version', + // dataIndex: 'deviceInfo', + // key: 'osVersion', + // render: deviceInfo => deviceInfo.osVersion + // // todo add filtering options + // }, + // { + // title: 'IMEI', + // dataIndex: 'properties', + // key: 'imei', + // render: properties => { + // let imei = "not-found"; + // for (let i = 0; i < properties.length; i++) { + // if (properties[i].name === "IMEI") { + // imei = properties[i].value; + // } + // } + // return imei; + // } + // // todo add filtering options + // }, +]; + +const getTimeAgo = (time) => { + const timeAgo = new TimeAgo('en-US'); + return timeAgo.format(time); +}; + + +class DeviceTable extends React.Component { + constructor(props) { + super(props); + config = this.props.context; + TimeAgo.addLocale(en); + this.state = { + data: [], + pagination: {}, + loading: false, + selectedRows: [] + }; + } + + rowSelection = { + onChange: (selectedRowKeys, selectedRows) => { + // console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows); + this.setState({ + selectedRows: selectedRows + }) + }, + getCheckboxProps: record => ({ + disabled: record.name === 'Disabled User', // Column configuration not to be checked + name: record.name, + }), + }; + + componentDidMount() { + this.fetch(); + } + + //fetch data from api + fetch = (params = {}) => { + const config = this.props.context; + this.setState({loading: true}); + // get current page + const currentPage = (params.hasOwnProperty("page")) ? params.page : 1; + + const extraParams = { + offset: 10 * (currentPage - 1), //calculate the offset + limit: 10, + requireDeviceInfo: true, + }; + + const encodedExtraParams = Object.keys(extraParams).map(key => key + '=' + extraParams[key]).join('&'); + + //send request to the invoker + axios.get( + window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt + + "/devices?" + encodedExtraParams, + ).then(res => { + if (res.status === 200) { + const pagination = {...this.state.pagination}; + this.setState({ + loading: false, + data: res.data.data.devices, + pagination, + }); + } + + }).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 devices.", + }); + } + + this.setState({loading: false}); + }); + }; + + handleTableChange = (pagination, filters, sorter) => { + const pager = {...this.state.pagination}; + pager.current = pagination.current; + this.setState({ + pagination: pager, + }); + this.fetch({ + results: pagination.pageSize, + page: pagination.current, + sortField: sorter.field, + sortOrder: sorter.order, + ...filters, + }); + }; + + render() { + const {data, pagination, loading, selectedRows} = this.state; + return ( +
+ record.deviceIdentifier} + dataSource={data} + pagination={{ + ...pagination, + size: "small", + // position: "top", + showTotal: (total, range) => `showing ${range[0]}-${range[1]} of ${total} devices` + // showQuickJumper: true + }} + loading={loading} + onChange={this.handleTableChange} + rowSelection={this.rowSelection} + scroll={{x: 1000}} + /> + + ); + } +} + +export default withConfigContext(DeviceTable); \ No newline at end of file diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/AppCard.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/AppCard.js index d18aa40bbfa..6e7aea8eecb 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/AppCard.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/AppCard.js @@ -42,7 +42,7 @@ class AppCard extends React.Component { const description = (
- +
icon diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/AppList.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/AppList.js index e6e459e3dc2..3dbea6b779f 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/AppList.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/AppList.js @@ -59,7 +59,7 @@ class AppList extends React.Component { }); //send request to the invoker axios.post( - window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/applications/", + window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.entgra + "/applications/", payload, ).then(res => { if (res.status === 200) { @@ -76,7 +76,7 @@ class AppList extends React.Component { if (error.hasOwnProperty("response") && error.response.status === 401) { //todo display a popup with error message.error('You are not logged in'); - window.location.href = window.location.origin+ '/store/login'; + window.location.href = window.location.origin+ '/entgra/login'; } else { notification["error"]({ message: "There was a problem", diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/DetailedRating.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/DetailedRating.js index 0536e966cf9..74cad82f97e 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/DetailedRating.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/DetailedRating.js @@ -52,7 +52,7 @@ class DetailedRating extends React.Component{ const config = this.props.context; return axios.get( - window.location.origin+ config.serverConfig.invoker.uri +config.serverConfig.invoker.store+"/reviews/"+uuid+"/"+type+"-rating", + window.location.origin+ config.serverConfig.invoker.uri +config.serverConfig.invoker.entgra+"/reviews/"+uuid+"/"+type+"-rating", ).then(res => { if (res.status === 200) { let detailedRating = res.data.data; @@ -63,7 +63,7 @@ class DetailedRating extends React.Component{ }).catch(function (error) { if (error.response.status === 401) { - window.location.href = window.location.origin+'/store/login'; + window.location.href = window.location.origin+'/entgra/login'; } }); }; diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/ReleaseView.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/ReleaseView.js index 6d55b45361d..dd53397b24b 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/ReleaseView.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/ReleaseView.js @@ -47,7 +47,7 @@ class ReleaseView extends React.Component { this.setState({ loading: true, }); - const url = window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/subscription/" + uuid + "/" + type + "/install"; + const url = window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.entgra + "/subscription/" + uuid + "/" + type + "/install"; axios.post( url, payload, @@ -79,7 +79,7 @@ class ReleaseView extends React.Component { }).catch((error) => { if (error.response.status === 401) { - window.location.href = window.location.origin+ '/store/login'; + window.location.href = window.location.origin+ '/entgra/login'; } else { this.setState({ loading: false, diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/DeviceInstall.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/DeviceInstall.js index 34dfefd362c..0f399084311 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/DeviceInstall.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/DeviceInstall.js @@ -168,7 +168,7 @@ class DeviceInstall extends React.Component { if (error.hasOwnProperty("status") && error.response.status === 401) { //todo display a popop with error message.error('You are not logged in'); - window.location.href = window.location.origin + '/store/login'; + window.location.href = window.location.origin + '/entgra/login'; } else { notification["error"]({ message: "There was a problem", diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/GroupInstall.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/GroupInstall.js index a8af7482c9a..9b884454862 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/GroupInstall.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/GroupInstall.js @@ -67,7 +67,7 @@ class GroupInstall extends React.Component { }).catch((error) => { console.log(error); if (error.hasOwnProperty("status") && error.response.status === 401) { message.error('You are not logged in'); - window.location.href = window.location.origin+'/store/login'; + window.location.href = window.location.origin+'/entgra/login'; } else { notification["error"]({ message: "There was a problem", diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/RoleInstall.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/RoleInstall.js index 877fd3a4cb9..ac5a1b86830 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/RoleInstall.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/RoleInstall.js @@ -67,7 +67,7 @@ class RoleInstall extends React.Component { }).catch((error) => { console.log(error); if (error.hasOwnProperty("status") && error.response.status === 401) { message.error('You are not logged in'); - window.location.href = window.location.origin+'/store/login'; + window.location.href = window.location.origin+'/entgra/login'; } else { notification["error"]({ message: "There was a problem", diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/UserInstall.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/UserInstall.js index 8e592d52cf5..d93eb6c81a7 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/UserInstall.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/install/UserInstall.js @@ -69,7 +69,7 @@ class UserInstall extends React.Component { }).catch((error) => { if (error.response.hasOwnProperty(status) && error.response.status === 401) { message.error('You are not logged in'); - window.location.href = window.location.origin+ '/store/login'; + window.location.href = window.location.origin+ '/entgra/login'; } else { notification["error"]({ message: "There was a problem", diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/AddReview.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/AddReview.js index ee2b8f65ffa..497e20bd06c 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/AddReview.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/AddReview.js @@ -72,7 +72,7 @@ class AddReview extends React.Component { }; axios.post( - window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/" + uuid, + window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.entgra + "/reviews/" + uuid, payload, ).then(res => { if (res.status === 201) { @@ -104,7 +104,7 @@ class AddReview extends React.Component { }).catch((error) => { if (error.response.status === 401) { - window.location.href = window.location.origin+ '/store/login'; + window.location.href = window.location.origin+ '/entgra/login'; } else { this.setState({ loading: false, diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/CurrentUsersReview.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/CurrentUsersReview.js index ed1f14711c4..2a901327bf5 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/CurrentUsersReview.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/CurrentUsersReview.js @@ -44,7 +44,7 @@ class CurrentUsersReview extends React.Component { const config = this.props.context; axios.get( - window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/app/user/" + uuid, + window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.entgra + "/reviews/app/user/" + uuid, ).then(res => { if (res.status === 200) { const data = res.data.data.data; @@ -54,7 +54,7 @@ class CurrentUsersReview extends React.Component { }).catch((error) => { if (error.response.hasOwnProperty(status) && error.response.status === 401) { message.error('You are not logged in'); - window.location.href = window.location.origin+ '/store/login'; + window.location.href = window.location.origin+ '/entgra/login'; } else { notification["error"]({ message: "There was a problem", diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/Reviews.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/Reviews.js index ca0e84567c5..82429f6eed8 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/Reviews.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/Reviews.js @@ -50,7 +50,7 @@ class Reviews extends React.Component { const config = this.props.context; axios.get( - window.location.origin+ config.serverConfig.invoker.uri +config.serverConfig.invoker.store+"/reviews/"+type+"/"+uuid, + window.location.origin+ config.serverConfig.invoker.uri +config.serverConfig.invoker.entgra+"/reviews/"+type+"/"+uuid, { headers: {'X-Platform': config.serverConfig.platform} }).then(res => { @@ -61,7 +61,7 @@ class Reviews extends React.Component { }).catch(function (error) { if (error.response.status === 401) { - window.location.href = window.location.origin+ '/store/login'; + window.location.href = window.location.origin+ '/entgra/login'; } else { notification["error"]({ message: "There was a problem", diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/singleReview/SingleReview.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/singleReview/SingleReview.js index 29f44b1a685..227def4664a 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/singleReview/SingleReview.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/singleReview/SingleReview.js @@ -58,7 +58,7 @@ class SingleReview extends React.Component { const {id} = this.state.review; const config = this.props.context; - let url =window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store; + let url =window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.entgra; // call as an admin api if the review is not a personal review if (!this.props.isPersonalReview) { @@ -80,7 +80,7 @@ class SingleReview extends React.Component { }).catch((error) => { console.log(error); if (error.hasOwnProperty("response") && error.response.status === 401) { - window.location.href = window.location.origin+ '/store/login'; + window.location.href = window.location.origin+ '/entgra/login'; } else { notification["error"]({ message: "There was a problem", diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/singleReview/editReview/EditReview.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/singleReview/editReview/EditReview.js index f18bac5079b..5a541f758f8 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/singleReview/editReview/EditReview.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/components/apps/release/review/singleReview/editReview/EditReview.js @@ -86,7 +86,7 @@ class EditReview extends React.Component { }; axios.put( - window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/" + uuid+"/"+id, + window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.entgra + "/reviews/" + uuid+"/"+id, payload, ).then(res => { if (res.status === 200) { @@ -117,7 +117,7 @@ class EditReview extends React.Component { }).catch((error) => { console.log(error); if (error.hasOwnProperty("response") && error.response.status === 401) { - window.location.href = window.location.origin+ '/store/login'; + window.location.href = window.location.origin+ '/entgra/login'; } else { this.setState({ loading: false, diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/index.html b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/index.html index 8f254050f24..f2d81b221cc 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/index.html +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/index.html @@ -20,7 +20,7 @@ - Entgra App Store + Entgra Device Management
\ No newline at end of file diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/index.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/index.js index 480ffce5af6..c8e24e74729 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/index.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/index.js @@ -22,30 +22,24 @@ import * as serviceWorker from './serviceWorker'; import App from "./App"; import Login from "./pages/Login"; import Dashboard from "./pages/dashboard/Dashboard"; -import Apps from "./pages/dashboard/apps/Apps"; -import Release from "./pages/dashboard/apps/release/Release"; import './index.css'; +import Devices from "./pages/dashboard/devices/Devices"; const routes = [ { - path: '/store/login', + path: '/entgra/login', exact: true, component: Login }, { - path: '/store', + path: '/entgra', exact: false, component: Dashboard, routes: [ { - path: '/store/:deviceType', - component: Apps, + path: '/entgra/devices', + component: Devices, exact: true - }, - { - path: '/store/:deviceType/apps/:uuid', - exact: true, - component: Release } ] } diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/Login.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/Login.js index 5aed47a3b41..19bbf40a27e 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/Login.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/Login.js @@ -93,7 +93,7 @@ class NormalLoginForm extends React.Component { const parameters = { username: values.username, password: values.password, - platform: "store" + platform: "entgra" }; const request = Object.keys(parameters).map(key => key + '=' + parameters[key]).join('&'); @@ -101,7 +101,7 @@ class NormalLoginForm extends React.Component { axios.post(window.location.origin+ config.serverConfig.loginUri, request ).then(res => { if (res.status === 200) { - window.location = window.location.origin+ "/store"; + window.location = window.location.origin+ "/entgra"; } }).catch(function (error) { if (error.response.status === 400) { diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/Dashboard.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/Dashboard.js index c7b8c475751..6ba16644bb7 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/Dashboard.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/Dashboard.js @@ -18,18 +18,17 @@ import React from "react"; import {Layout, Menu, Icon} from 'antd'; - -const {Header, Content, Footer} = Layout; -import {Link} from "react-router-dom"; -import RouteWithSubRoutes from "../../components/RouteWithSubRoutes"; -import {Switch} from 'react-router'; -import axios from "axios"; +import {Switch, Link} from "react-router-dom"; +import RouteWithSubRoutes from "../../components/RouteWithSubRoutes" +import {Redirect} from 'react-router' import "../../App.css"; import {withConfigContext} from "../../context/ConfigContext"; import Logout from "./logout/Logout"; +const {Header, Content, Footer} = Layout; const {SubMenu} = Menu; + class Dashboard extends React.Component { constructor(props) { super(props); @@ -41,50 +40,7 @@ class Dashboard extends React.Component { this.logo = this.props.context.theme.logo; } - componentDidMount() { - this.getDeviceTypes(); - } - - getDeviceTypes = () => { - const config = this.props.context; - axios.get( - window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt + "/device-types" - ).then(res => { - if (res.status === 200) { - const deviceTypes = JSON.parse(res.data.data); - this.setState({ - deviceTypes, - loading: false, - }); - } - - }).catch((error) => { - if (error.hasOwnProperty("response") && error.response.status === 401) { - window.location.href = window.location.origin + '/store/login'; - } else { - notification["error"]({ - message: "There was a problem", - duration: 0, - description: - "Error occurred while trying to load device types.", - }); - } - this.setState({ - loading: false - }); - }); - }; - - changeSelectedMenuItem = (key) => { - this.setState({ - selectedKeys: [key] - }) - }; - render() { - const config = this.props.context; - const {selectedKeys, deviceTypes} = this.state; - return (
@@ -95,31 +51,10 @@ class Dashboard extends React.Component { - { - deviceTypes.map((deviceType) => { - const platform = deviceType.name; - const defaultPlatformIcons = config.defaultPlatformIcons; - let icon = defaultPlatformIcons.default.icon; - let theme = defaultPlatformIcons.default.theme; - if (defaultPlatformIcons.hasOwnProperty(platform)) { - icon = defaultPlatformIcons[platform].icon; - theme = defaultPlatformIcons[platform].theme; - } - return ( - - - - {platform} - - - ); - }) - } - Web - Clips + Devices + + - + + {this.state.routes.map((route) => ( - + ))} - -
©2019 entgra.io diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/add-new-app/AddNewApp.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/add-new-app/AddNewApp.js index fbf94498138..0c794c8e0e0 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/add-new-app/AddNewApp.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/add-new-app/AddNewApp.js @@ -48,7 +48,7 @@ const Dragger = Upload.Dragger; const routes = [ { path: 'index', - breadcrumbName: 'store', + breadcrumbName: 'entgra', }, { path: 'first', diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/apps/release/Release.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/apps/release/Release.js index b1eb744b221..1b7ea7867e1 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/apps/release/Release.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/apps/release/Release.js @@ -58,7 +58,7 @@ class Release extends React.Component { //send request to the invoker axios.get( - window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/applications/" + uuid, + window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.entgra + "/applications/" + uuid, ).then(res => { if (res.status === 200) { let app = res.data.data; @@ -75,7 +75,7 @@ class Release extends React.Component { 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 + '/store/login'; + window.location.href = window.location.origin + '/entgra/login'; } else { notification["error"]({ message: "There was a problem", @@ -110,7 +110,7 @@ class Release extends React.Component {
- {deviceType + " apps"} + {deviceType + " apps"} {appName} diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/devices/Devices.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/devices/Devices.js new file mode 100644 index 00000000000..9ca14d0c638 --- /dev/null +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/devices/Devices.js @@ -0,0 +1,67 @@ +/* + * Copyright (c) 2019, 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 { + PageHeader, + Typography, + Breadcrumb, + Icon, + Card +} from "antd"; +import {Link} from "react-router-dom"; +import DeviceTable from "../../../components/Devices/DevicesTable"; + +const {Paragraph} = Typography; + +class Devices extends React.Component { + routes; + + constructor(props) { + super(props); + this.routes = props.routes; + + } + + render() { + return ( +
+ + + + Home + + Devices + +
+

Devices

+ Lorem ipsum dolor sit amet, est similique constituto at, quot inermis id mel, an + illud incorrupte nam. +
+
+
+
+ +
+
+
+ ); + } +} + +export default Devices; diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/logout/Logout.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/logout/Logout.js index 35068cc581b..3a011b9169c 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/logout/Logout.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/pages/dashboard/logout/Logout.js @@ -49,7 +49,7 @@ class Logout extends React.Component { ).then(res => { //if the api call status is correct then user will logout and then it goes to login page if (res.status === 200) { - window.location = window.location.origin + "/store/login"; + window.location = window.location.origin + "/entgra/login"; } }).catch(function (error) { diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/webpack.config.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/webpack.config.js index 2f3874ea211..116b83d79fb 100644 --- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/webpack.config.js +++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/webpack.config.js @@ -23,7 +23,7 @@ const configurations = require("./public/conf/config.json"); const config = { devtool: "source-map", output: { - publicPath: '/store/' + publicPath: '/entgra/' }, watch: false, resolve: {