From 4d59b8d900a384ba98d3c0ad0968220f9273fe52 Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Mon, 15 Jul 2019 15:40:56 +0530 Subject: [PATCH] Add UI improvemnts to APPM UI The following imrovements are with this commit - Fix issues and change ui in manage page - Change error messages to closable notifications - Create a view to inform user when no apps available - Change error messages - Change install mode order in store - Change the lifecycle UI - Fix typo in error messages in APPM UI --- .../react-app/public/conf/config.json | 30 ++- .../apps/detailed-rating/DetailedRating.js | 9 +- .../AppDetailsDrawer/AppDetailsDrawer.js | 37 +++- .../src/components/apps/list-apps/Filters.js | 40 +++- .../src/components/apps/list-apps/ListApps.js | 2 - .../apps/list-apps/appsTable/AppsTable.js | 9 +- .../apps/release/lifeCycle/LifeCycle.js | 39 +--- .../lifeCycleDetailsModal.js | 96 +++++++++ .../components/apps/release/review/Reviews.js | 10 +- .../manage/categories/ManageCategories.js | 122 +++++++---- .../manage/categories/ManageTags.js | 196 +++++++++++------- .../src/components/new-app/AddNewAppForm.js | 22 +- .../react-app/src/js/actions/index.js | 136 ------------ .../react-app/src/js/constants/ActionTypes.js | 15 -- .../react-app/src/js/reducers/index.js | 64 ------ .../react-app/src/js/store/index.js | 5 - .../react-app/src/js/utils/dagre-utils.ts | 56 ----- .../react-app/src/pages/Login.js | 9 +- .../pages/dashboard/apps/release/Release.js | 10 +- .../react-app/src/components/apps/AppList.js | 59 ++++-- .../components/apps/release/ReleaseView.js | 6 +- .../apps/release/install/AppInstallModal.js | 15 +- .../apps/release/install/DeviceInstall.js | 11 +- .../apps/release/install/GroupInstall.js | 7 +- .../apps/release/install/RoleInstall.js | 7 +- .../apps/release/install/UserInstall.js | 7 +- .../apps/release/review/AddReview.js | 6 +- .../apps/release/review/CurrentUsersReview.js | 9 +- .../components/apps/release/review/Reviews.js | 10 +- .../review/singleReview/SingleReview.js | 3 +- .../singleReview/editReview/EditReview.js | 6 +- .../src/pages/dashboard/apps/Apps.js | 2 +- .../pages/dashboard/apps/release/Release.js | 9 +- 33 files changed, 561 insertions(+), 503 deletions(-) create mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/lifeCycleDetailsModal/lifeCycleDetailsModal.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/actions/index.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/constants/ActionTypes.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/reducers/index.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/store/index.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/utils/dagre-utils.ts diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/public/conf/config.json b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/public/conf/config.json index 4a5890600e6..88a2caa2102 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/public/conf/config.json +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/public/conf/config.json @@ -2,7 +2,7 @@ "theme": { "type": "default", "value": "lightBaseTheme", - "logo" : "https://entgra.io/assets/images/svg/logo.svg", + "logo": "https://entgra.io/assets/images/svg/logo.svg", "primaryColor": "rgb(24, 144, 255)" }, "serverConfig": { @@ -13,7 +13,7 @@ "uri": "/publisher-ui-request-handler/invoke", "publisher": "/application-mgt-publisher/v1.0", "store": "/application-mgt-store/v1.0", - "deviceMgt" : "/device-mgt/v1.0" + "deviceMgt": "/device-mgt/v1.0" }, "loginUri": "/publisher-ui-request-handler/login", "platform": "publisher" @@ -39,5 +39,31 @@ "color": "#008cc4", "theme": "filled" } + }, + "lifecycle": { + "CREATED": { + "text": "The initial most state of an application." + }, + "IN-REVIEW": { + "text": "This state can be applied when the application is being reviewed by approvers." + }, + "APPROVED": { + "text": "The approved state is a compulsory state prior to publishing the application." + }, + "REJECTED": { + "text": "The Approvers can reject an application due to a faulty of the app or not being in compliance with company policies." + }, + "PUBLISHED": { + "text": "The state which is applied for applications which are qualified for your Corporate App Store. Only the applications of Published state can be installed to your corporate devices." + }, + "BLOCKED": { + "text": "This state allows you to block your application either to publish or deprecate at a future date." + }, + "DEPRECATED": { + "text": "The applications which are outdated and no longer suit your app store." + }, + "RETIRED": { + "text": "The final state of an application, where no transition of states will be allowed after this." + } } } diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js index 4854bb7dc2f..b861e212233 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js @@ -1,5 +1,5 @@ import React from "react"; -import {Row, Typography, Icon, message} from "antd"; +import {Row, Typography, Icon, message, notification} from "antd"; import StarRatings from "react-star-ratings"; import "./DetailedRating.css"; import config from "../../../../public/conf/config.json"; @@ -44,7 +44,12 @@ class DetailedRating extends React.Component{ if (error.hasOwnProperty("response") && error.response.status === 401) { window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; } else { - message.error('Something went wrong while trying to load rating for the release... :('); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load rating for the release.", + }); } }); }; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppDetailsDrawer/AppDetailsDrawer.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppDetailsDrawer/AppDetailsDrawer.js index 15ccc407180..c5eb6331b53 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppDetailsDrawer/AppDetailsDrawer.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppDetailsDrawer/AppDetailsDrawer.js @@ -116,8 +116,12 @@ class AppDetailsDrawer extends React.Component { if (error.hasOwnProperty("response") && error.response.status === 401) { window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong while trying to load app details... :('); - + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load app details.", + }); } this.setState({ loading: false @@ -151,8 +155,12 @@ class AppDetailsDrawer extends React.Component { if (error.hasOwnProperty("response") && error.response.status === 401) { window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to load tags.'); - + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load tags.", + }); } this.setState({ loading: false @@ -186,7 +194,12 @@ class AppDetailsDrawer extends React.Component { message.error('You are not logged in'); window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.error('Something went wrong when trying to save the app name... :('); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to save the app name.", + }); } this.setState({loading: false}); @@ -262,7 +275,12 @@ class AppDetailsDrawer extends React.Component { message.error('You are not logged in'); window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.error('Something went wrong when trying to updating categories'); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to updating categories.", + }); } this.setState({loading: false}); @@ -320,7 +338,12 @@ class AppDetailsDrawer extends React.Component { message.error('You are not logged in'); window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.error('Something went wrong when trying to update tags'); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to update tags", + }); } this.setState({loading: false}); diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/Filters.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/Filters.js index 818072ee20f..09446b47c25 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/Filters.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/Filters.js @@ -1,5 +1,19 @@ import React from "react"; -import {Card, Col, Row,Typography, Input, Divider, Icon, Select, Button, Form, message, Radio} from "antd"; +import { + Card, + Col, + Row, + Typography, + Input, + Divider, + Icon, + Select, + Button, + Form, + message, + Radio, + notification +} from "antd"; import axios from "axios"; import config from "../../../../public/conf/config.json"; @@ -63,8 +77,12 @@ class FiltersForm extends React.Component { if (error.hasOwnProperty("response") && error.response.status === 401) { window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong while trying to load categories... :('); - + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load categories.", + }); } this.setState({ loading: false @@ -88,8 +106,12 @@ class FiltersForm extends React.Component { if (error.hasOwnProperty("response") && error.response.status === 401) { window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to load tags'); - + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load tags.", + }); } this.setState({ loading: false @@ -114,8 +136,12 @@ class FiltersForm extends React.Component { if (error.hasOwnProperty("response") && error.response.status === 401) { window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to load device types'); - + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load device types.", + }); } this.setState({ loading: false diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/ListApps.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/ListApps.js index 23f61961574..db65496773c 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/ListApps.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/ListApps.js @@ -1,7 +1,5 @@ import React from "react"; import {Avatar, Card, Col, Row, Table, Typography, Input, Divider, Checkbox, Select, Button} from "antd"; -import {connect} from "react-redux"; -import {getApps} from "../../../js/actions"; import AppsTable from "./appsTable/AppsTable"; import Filters from "./Filters"; import AppDetailsDrawer from "./AppDetailsDrawer/AppDetailsDrawer"; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/appsTable/AppsTable.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/appsTable/AppsTable.js index d62cc350e9e..2d39f518b73 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/appsTable/AppsTable.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/appsTable/AppsTable.js @@ -1,5 +1,5 @@ import React from "react"; -import {Avatar, Table, Tag, Icon, message} from "antd"; +import {Avatar, Table, Tag, Icon, message, notification} from "antd"; import axios from "axios"; import pSBC from 'shade-blend-color'; import config from "../../../../../public/conf/config.json"; @@ -155,7 +155,12 @@ class AppsTable extends React.Component { message.error('You are not logged in'); window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; } else { - message.error('Something went wrong while trying to load apps... :('); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load the apps.", + }); } this.setState({loading: false}); diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/LifeCycle.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/LifeCycle.js index c419d29271a..ecbc782b739 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/LifeCycle.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/LifeCycle.js @@ -2,10 +2,11 @@ import React from "react"; import {Typography, Tag, Divider, Select, Button, Modal, message, notification, Collapse} from "antd"; import axios from "axios"; import config from "../../../../../public/conf/config.json"; - +import pSBC from "shade-blend-color"; import ReactQuill from 'react-quill'; import 'react-quill/dist/quill.snow.css'; import './LifeCycle.css'; +import LifeCycleDetailsModal from "./lifeCycleDetailsModal/lifeCycleDetailsModal"; const {Text, Title, Paragraph} = Typography; const {Option} = Select; @@ -27,6 +28,7 @@ const formats = [ 'link', 'image' ]; + class LifeCycle extends React.Component { constructor(props) { @@ -69,7 +71,12 @@ class LifeCycle extends React.Component { if (error.hasOwnProperty("response") && error.response.status === 401) { window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.error('Something went wrong when trying to load lifecycle configuration'); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load lifecycle configuration.", + }); } }); }; @@ -133,7 +140,7 @@ class LifeCycle extends React.Component { notification["error"]({ message: "Error", description: - "Something went wrong when trying to add lifecycle", + "Error occurred while trying to add lifecycle", }); } this.setState({ @@ -152,7 +159,6 @@ class LifeCycle extends React.Component { if((lifecycle.hasOwnProperty(currentStatus)) && lifecycle[currentStatus].hasOwnProperty("proceedingStates")){ proceedingStates = lifecycle[currentStatus].proceedingStates; } - console.log(lifecycle); return (
Manage Lifecycle @@ -163,6 +169,7 @@ class LifeCycle extends React.Component { state to another.
Note: ‘Change State To’ displays only the next states allowed from the current state + Current State: {currentStatus}

Change State to: @@ -198,30 +205,6 @@ class LifeCycle extends React.Component { - Lorem Ipsum - - { - Object.keys(lifecycle).map(lifecycleState => { - return ( - - { - Object.keys(lifecycle).map(state => { - // console.log(lifecycle[lifecycleState].proceedingStates); - const isEnabled = lifecycle[lifecycleState].hasOwnProperty("proceedingStates") && (lifecycle[lifecycleState].proceedingStates.includes(state)); - const color = isEnabled ? "green" : ""; - return ( - {state} - ) - }) - } - - ) - }) - } - - { + this.setState({ + visible: true, + }); + }; + + handleCancel = e => { + console.log(e); + this.setState({ + visible: false, + }); + }; + + render() { + const {lifecycle} = this.props; + return ( +
+ + + + { + let text = ""; + let footerText = ""; + let nextProceedingStates = []; + + if (lifeCycleConfig.hasOwnProperty(lifecycleState)) { + text = lifeCycleConfig[lifecycleState].text; + } + if (lifecycle[lifecycleState].hasOwnProperty("proceedingStates")) { + nextProceedingStates = lifecycle[lifecycleState].proceedingStates; + footerText = "You can only proceed to one of the following states:" + } + + return ( + + + {text} +
+ {footerText} +
+ { + nextProceedingStates.map(lifecycleState => { + return ( + + {lifecycleState} + + ) + }) + } +
+ + ) + }} + /> + +
+ ); + } +} + +export default LifeCycleDetailsModal; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/review/Reviews.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/review/Reviews.js index 19b508cc21b..865e3efe81a 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/review/Reviews.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/review/Reviews.js @@ -1,5 +1,5 @@ import React from "react"; -import {List, message, Avatar, Spin, Button} from 'antd'; +import {List, message, Avatar, Spin, Button, notification} from 'antd'; import "./Reviews.css"; import InfiniteScroll from 'react-infinite-scroller'; @@ -42,8 +42,12 @@ class Reviews extends React.Component { if (error.hasOwnProperty("response") && error.response.status === 401) { window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to load reviews'); - + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load reviews.", + }); } }); }; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js index 3711368638b..0bafa61da3d 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js @@ -1,10 +1,27 @@ import React from "react"; -import {Card, Tag, message, Icon, Input, notification, Divider, Button, Spin, Tooltip, Popconfirm, Modal} from "antd"; +import { + Card, + Tag, + message, + Icon, + Input, + notification, + Divider, + Button, + Spin, + Tooltip, + Popconfirm, + Modal, + Row, + Col, + Typography +} from "antd"; import axios from "axios"; import config from "../../../../public/conf/config.json"; import {TweenOneGroup} from 'rc-tween-one'; import pSBC from "shade-blend-color"; +const {Title} = Typography; class ManageCategories extends React.Component { state = { @@ -22,8 +39,8 @@ class ManageCategories extends React.Component { componentDidMount() { axios.get( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/applications/categories", - ).then(res => { + config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories", + ).then(res => { if (res.status === 200) { let categories = JSON.parse(res.data.data); this.setState({ @@ -34,7 +51,7 @@ class ManageCategories extends React.Component { }).catch((error) => { if (error.hasOwnProperty("response") && error.response.status === 401) { - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; + window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { message.warning('Something went wrong'); @@ -57,8 +74,7 @@ class ManageCategories extends React.Component { loading: true }); axios.delete( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/admin/applications/categories/"+id, - + config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories/" + id, ).then(res => { if (res.status === 200) { notification["success"]({ @@ -82,9 +98,14 @@ class ManageCategories extends React.Component { }).catch((error) => { if (error.hasOwnProperty("response") && error.response.status === 401) { message.error('You are not logged in'); - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; + window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to load categories'); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load categories.", + }); } this.setState({ loading: false @@ -96,7 +117,7 @@ class ManageCategories extends React.Component { const categoryName = category.categoryName; const tagElem = ( {categoryName} @@ -139,7 +160,7 @@ class ManageCategories extends React.Component { const tagElem = ( { + onClose={e => { e.preventDefault(); const {tempElements} = this.state; const remainingElements = tempElements.filter(function (value) { @@ -197,9 +218,8 @@ class ManageCategories extends React.Component { const data = tempElements.map(category => category.categoryName); axios.post( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/admin/applications/categories", + config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories", data, - ).then(res => { if (res.status === 200) { notification["success"]({ @@ -221,9 +241,14 @@ class ManageCategories extends React.Component { }).catch((error) => { if (error.hasOwnProperty("response") && error.response.status === 401) { message.error('You are not logged in'); - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; + window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to add categories'); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to add categories.", + }); } this.setState({ loading: false @@ -260,9 +285,8 @@ class ManageCategories extends React.Component { }); axios.put( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/admin/applications/categories/rename?from="+currentlyEditingId+"&to="+editingValue, + config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories/rename?from=" + currentlyEditingId + "&to=" + editingValue, {}, - ).then(res => { if (res.status === 200) { notification["success"]({ @@ -283,9 +307,14 @@ class ManageCategories extends React.Component { }).catch((error) => { if (error.hasOwnProperty("response") && error.response.status === 401) { message.error('You are not logged in'); - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; + window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to delete the category'); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to delete the category.", + }); } this.setState({ loading: false, @@ -308,21 +337,33 @@ class ManageCategories extends React.Component { const temporaryElements = tempElements.map(this.renderTempElement); return (
- + - {!isAddNewVisible && - - } + + + Categories + + + {!isAddNewVisible && +
+ +
+ } + + {isAddNewVisible &&
+
- - + + + + )}
); diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js index e3c15950820..9831ab4a3c3 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js @@ -1,9 +1,25 @@ import React from "react"; -import {Card, Tag, message, Icon, Input, notification, Divider, Button, Spin, Tooltip, Popconfirm, Modal} from "antd"; +import { + Card, + Tag, + message, + Icon, + Input, + notification, + Divider, + Button, + Spin, + Tooltip, + Popconfirm, + Modal, + Row, Col, + Typography +} from "antd"; import axios from "axios"; import config from "../../../../public/conf/config.json"; import {TweenOneGroup} from 'rc-tween-one'; +const {Title} = Typography; class ManageTags extends React.Component { state = { @@ -21,8 +37,8 @@ class ManageTags extends React.Component { componentDidMount() { axios.get( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/applications/tags", - ).then(res => { + config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags", + ).then(res => { if (res.status === 200) { let tags = JSON.parse(res.data.data); this.setState({ @@ -33,10 +49,14 @@ class ManageTags extends React.Component { }).catch((error) => { if (error.hasOwnProperty("response") && error.response.status === 401) { - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; + window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to load tags'); - + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load tags.", + }); } this.setState({ loading: false @@ -58,7 +78,7 @@ class ManageTags extends React.Component { }); axios.delete( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/admin/applications/tags/"+id + config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/tags/" + id ).then(res => { if (res.status === 200) { notification["success"]({ @@ -82,9 +102,14 @@ class ManageTags extends React.Component { }).catch((error) => { if (error.hasOwnProperty("response") && error.response.status === 401) { message.error('You are not logged in'); - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; + window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to delete the tag'); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to delete the tag.", + }); } this.setState({ loading: false @@ -196,9 +221,9 @@ class ManageTags extends React.Component { const data = tempElements.map(tag => tag.tagName); - axios.post(config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/applications/tags", + axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags", data, - ).then(res => { + ).then(res => { if (res.status === 200) { notification["success"]({ message: "Done!", @@ -219,9 +244,14 @@ class ManageTags extends React.Component { }).catch((error) => { if (error.hasOwnProperty("response") && error.response.status === 401) { message.error('You are not logged in'); - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; + window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to delete tag'); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to delete tag.", + }); } this.setState({ loading: false @@ -258,9 +288,8 @@ class ManageTags extends React.Component { }); axios.put( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/applications/tags/rename?from="+currentlyEditingId+"&to="+editingValue, + config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags/rename?from=" + currentlyEditingId + "&to=" + editingValue, {}, - ).then(res => { if (res.status === 200) { notification["success"]({ @@ -281,9 +310,14 @@ class ManageTags extends React.Component { }).catch((error) => { if (error.hasOwnProperty("response") && error.response.status === 401) { message.error('You are not logged in'); - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; + window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to edit tag'); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to edit tag.", + }); } this.setState({ loading: false, @@ -306,21 +340,33 @@ class ManageTags extends React.Component { const temporaryElements = tempElements.map(this.renderTempElement); return (
- + - {!isAddNewVisible && - - } + + + Tags + + + {!isAddNewVisible && +
+ +
+ } + + {isAddNewVisible &&
+
- - - + + + )} + < Button onClick={this.handleCloseButton} size="small"> Cancel - + +
+
+ } + +
+ { + e.target.style = ''; + }, + }} + leave={{opacity: 0, width: 0, scale: 0, duration: 200}} + appear={false} + > + {tagsElements} + +
+ + + < Modal + title="Edit" + visible={this.state.isEditModalVisible} + onCancel={this.closeEditModal} + onOk={this.editItem} + > + this.editingInput = input} onChange={this.handleEditInputChange}/> +
-
+ ); + } } - -
- { - e.target.style = ''; - }, - }} - leave={{opacity: 0, width: 0, scale: 0, duration: 200}} - appear={false} - > - {tagsElements} - -
- - - - this.editingInput = input} onChange={this.handleEditInputChange}/> - -
- ); - } -} -export default ManageTags; \ No newline at end of file + export default ManageTags; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/AddNewAppForm.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/AddNewAppForm.js index 95887548e0a..be2b8452153 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/AddNewAppForm.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/AddNewAppForm.js @@ -68,8 +68,12 @@ class AddNewAppFormComponent extends React.Component { if (error.hasOwnProperty("response") && error.response.status === 401) { window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to load categories'); - + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load categories.", + }); } this.setState({ loading: false @@ -93,8 +97,12 @@ class AddNewAppFormComponent extends React.Component { if (error.hasOwnProperty("response") && error.response.status === 401) { window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.warning('Something went wrong when trying to load tags'); - + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load tags.", + }); } this.setState({ loading: false @@ -116,7 +124,7 @@ class AddNewAppFormComponent extends React.Component { this.setState({ loading: true }); - const {name, description, categories, tags, price, isSharedWithAllTenants, binaryFile, icon, screenshots, releaseDescription,releaseType} = values; + const {name, description, categories, tags, price, isSharedWithAllTenants, binaryFile, icon, screenshots, releaseDescription, releaseType} = values; const application = { name, description, @@ -130,9 +138,9 @@ class AddNewAppFormComponent extends React.Component { if (formConfig.installationType !== "WEB_CLIP") { application.deviceType = values.deviceType; - }else{ + } else { application.type = "WEB_CLIP"; - application.deviceType ="ALL"; + application.deviceType = "ALL"; } if (specificElements.hasOwnProperty("binaryFile")) { diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/actions/index.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/actions/index.js deleted file mode 100644 index f810921f458..00000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/actions/index.js +++ /dev/null @@ -1,136 +0,0 @@ -import axios from "axios"; -import ActionTypes from "../constants/ActionTypes"; -import config from "../../../public/conf/config.json"; -import {message} from "antd"; - -export const getApps = () => dispatch => { - - const request = "method=post&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/applications"; - - return axios.post( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher, - request - ).then(res => { - if (res.status === 200) { - let apps = []; - - if (res.data.data.hasOwnProperty("applications")) { - apps = res.data.data.applications; - } - dispatch({type: ActionTypes.GET_APPS, payload: apps}); - } - - }).catch(function (error) { - if (error.hasOwnProperty("response") && error.response.status === 401) { - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; - } else { - message.error('Something went wrong when trying to load applications... :('); - } - }); - -}; - -export const getRelease = (uuid) => dispatch => { - - const request = "method=get&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/applications/release/" + uuid; - - return axios.post( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher, request - ).then(res => { - if (res.status === 200) { - let release = res.data.data; - dispatch({type: ActionTypes.GET_RELEASE, payload: release}); - } - - }).catch(function (error) { - if (error.hasOwnProperty("response") && error.response.status === 401) { - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; - } else { - message.error('Something went wrong... :('); - } - }); - - -}; - -export const openReleasesModal = (app) => dispatch => { - dispatch({ - type: ActionTypes.OPEN_RELEASES_MODAL, - payload: { - app: app - } - }); -}; - - -export const openLifecycleModal = (nextState) => dispatch => { - dispatch({ - type: ActionTypes.OPEN_LIFECYCLE_MODAL, - payload: { - nextState: nextState - } - }); -}; - -export const closeLifecycleModal = () => dispatch => { - dispatch({ - type: ActionTypes.CLOSE_LIFECYCLE_MODAL - }); -}; - -export const getLifecycle = () => dispatch => { - const request = "method=get&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/applications/lifecycle-config"; - - return axios.post( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher, request - ).then(res => { - if (res.status === 200) { - let lifecycle = res.data.data; - dispatch({type: ActionTypes.GET_LIFECYCLE, payload: lifecycle}); - } - - }).catch(function (error) { - if (error.hasOwnProperty("response") && error.response.status === 401) { - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; - } else { - message.error('Something went wrong... :('); - } - }); -}; - -export const updateLifecycleState = (uuid, nextState, reason) => dispatch => { - - const payload = { - action: nextState, - reason: reason - }; - - const request = "method=post&content-type=application/json&payload=" + JSON.stringify(payload) + "&api-endpoint=/application-mgt-publisher/v1.0/applications/life-cycle/" + uuid; - - - return axios.post( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher, request - ).then(res => { - if (res.status === 201) { - let release = res.data.data; - dispatch({type: ActionTypes.UPDATE_LIFECYCLE_STATE, payload: release}); - }else { - alert("error"); - dispatch({ - type: ActionTypes.CLOSE_LIFECYCLE_MODAL - }); - } - - }).catch(function (error) { - if (error.hasOwnProperty("response") && error.response.status === 401) { - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; - } else if (error.response.status === 500) { - alert("error"); - dispatch({ - type: ActionTypes.CLOSE_LIFECYCLE_MODAL - }); - } - }); - - -}; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/constants/ActionTypes.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/constants/ActionTypes.js deleted file mode 100644 index 76ec0da9f7f..00000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/constants/ActionTypes.js +++ /dev/null @@ -1,15 +0,0 @@ -import keyMirror from 'keymirror'; - -const ActionTypes = keyMirror({ - LOGIN: null, - GET_APPS: null, - OPEN_RELEASES_MODAL: null, - CLOSE_RELEASES_MODAL: null, - GET_RELEASE: null, - GET_LIFECYCLE: null, - OPEN_LIFECYCLE_MODAL: null, - CLOSE_LIFECYCLE_MODAL: null, - UPDATE_LIFECYCLE_STATE: null, -}); - -export default ActionTypes; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/reducers/index.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/reducers/index.js deleted file mode 100644 index a03213ef461..00000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/reducers/index.js +++ /dev/null @@ -1,64 +0,0 @@ -import ActionTypes from "../constants/ActionTypes"; - -const initialState = { - apps: [], - releaseView: { - visible: false, - app: null - }, - release: null, - lifecycle: null, - lifecycleModal:{ - visible: false, - nextState: null - } -}; - -function rootReducer(state = initialState, action) { - if (action.type === ActionTypes.GET_APPS) { - return Object.assign({}, state, { - apps: action.payload - }); - } else if (action.type === ActionTypes.OPEN_RELEASES_MODAL) { - return Object.assign({}, state, { - releaseView: { - visible: true, - app: action.payload.app - } - }); - } else if (action.type === ActionTypes.GET_RELEASE) { - return Object.assign({}, state, { - release: action.payload - }); - } else if (action.type === ActionTypes.GET_LIFECYCLE) { - return Object.assign({}, state, { - lifecycle: action.payload - }); - }else if (action.type === ActionTypes.OPEN_LIFECYCLE_MODAL) { - return Object.assign({}, state, { - lifecycleModal: { - visible: true, - nextState: action.payload.nextState - } - }); - }else if (action.type === ActionTypes.CLOSE_LIFECYCLE_MODAL) { - return Object.assign({}, state, { - lifecycleModal: { - visible: false, - nextState: null - } - }); - }else if (action.type === ActionTypes.UPDATE_LIFECYCLE_STATE) { - return Object.assign({}, state, { - lifecycleModal: { - visible: false, - nextState: null, - }, - release: action.payload - }); - } - return state; -} - - -export default rootReducer; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/store/index.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/store/index.js deleted file mode 100644 index 04957eb39a8..00000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/store/index.js +++ /dev/null @@ -1,5 +0,0 @@ -import { createStore, applyMiddleware } from "redux"; -import rootReducer from "../reducers/index"; -import thunk from "redux-thunk"; -const store = createStore(rootReducer, applyMiddleware(thunk)); -export default store; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/utils/dagre-utils.ts b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/utils/dagre-utils.ts deleted file mode 100644 index 58a006f9a93..00000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/utils/dagre-utils.ts +++ /dev/null @@ -1,56 +0,0 @@ -import * as dagre from "dagre"; -import * as _ from "lodash"; - -const size = { - width: 60, - height: 60 -}; - -export function distributeElements(model) { - let clonedModel = _.cloneDeep(model); - let nodes = distributeGraph(clonedModel); - nodes.forEach(node => { - let modelNode = clonedModel.nodes.find(item => item.id === node.id); - modelNode.x = node.x - node.width / 2; - modelNode.y = node.y - node.height / 2; - }); - return clonedModel; -} - -function distributeGraph(model) { - let nodes = mapElements(model); - let edges = mapEdges(model); - let graph = new dagre.graphlib.Graph(); - graph.setGraph({}); - graph.setDefaultEdgeLabel(() => ({})); - //add elements to dagre graph - nodes.forEach(node => { - graph.setNode(node.id, node.metadata); - }); - edges.forEach(edge => { - if (edge.from && edge.to) { - graph.setEdge(edge.from, edge.to); - } - }); - //auto-distribute - dagre.layout(graph); - return graph.nodes().map(node => graph.node(node)); -} - -function mapElements(model) { - // dagre compatible format - return model.nodes.map(node => ({ id: node.id, metadata: { ...size, id: node.id } })); -} - -function mapEdges(model) { - // returns links which connects nodes - // we check are there both from and to nodes in the model. Sometimes links can be detached - return model.links - .map(link => ({ - from: link.source, - to: link.target - })) - .filter( - item => model.nodes.find(node => node.id === item.from) && model.nodes.find(node => node.id === item.to) - ); -} \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/Login.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/Login.js index cc7782747f6..eb0913ab556 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/Login.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/Login.js @@ -1,5 +1,5 @@ import React from "react"; -import {Typography, Row, Col, Form, Icon, Input, Button, Checkbox, message} from 'antd'; +import {Typography, Row, Col, Form, Icon, Input, Button, Checkbox, message, notification} from 'antd'; import './Login.css'; import axios from 'axios'; import config from "../../public/conf/config.json"; @@ -86,7 +86,12 @@ class NormalLoginForm extends React.Component { inValid: true }); } else { - message.error('Something went wrong when trying to login... :('); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to login.", + }); } thisForm.setState({ loading: false diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/release/Release.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/release/Release.js index 1fa7e5656e1..e987994df38 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/release/Release.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/release/Release.js @@ -1,6 +1,6 @@ import React from "react"; import '../../../../App.css'; -import {Typography, Row, Col, message, Card} from "antd"; +import {Typography, Row, Col, message, Card, notification} from "antd"; import axios from 'axios'; import config from "../../../../../public/conf/config.json"; import ReleaseView from "../../../../components/apps/release/ReleaseView"; @@ -67,9 +67,13 @@ class Release extends React.Component { message.error('You are not logged in'); window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; } else { - message.error('Something went wrong when trying to load the release... :('); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load the release.", + }); } - this.setState({loading: false}); }); }; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppList.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppList.js index 7087e49ab1f..0eb6502e744 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppList.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppList.js @@ -1,6 +1,6 @@ import React from "react"; import AppCard from "./AppCard"; -import {Col, message, Row} from "antd"; +import {Col, message, notification, Row, Result, Skeleton} from "antd"; import axios from "axios"; import config from "../../../public/conf/config.json"; @@ -9,7 +9,7 @@ class AppList extends React.Component { super(props); this.state = { apps: [], - loading: false + loading: true } } @@ -31,19 +31,18 @@ class AppList extends React.Component { fetchData = (deviceType) => { const payload = {}; - if(deviceType==="web-clip"){ - payload.appType= "WEB_CLIP"; - }else{ - payload.deviceType= deviceType; + if (deviceType === "web-clip") { + payload.appType = "WEB_CLIP"; + } else { + payload.deviceType = deviceType; } - - console.log("b",config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.store+"/applications/"); - + this.setState({ + loading: true + }); //send request to the invoker axios.post( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.store+"/applications/", + config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/applications/", payload, - ).then(res => { if (res.status === 200) { //todo remove this property check after backend improvement @@ -54,13 +53,19 @@ class AppList extends React.Component { }) } - }).catch((error) => { console.log(error.response); + }).catch((error) => { + console.log(error.response); if (error.hasOwnProperty("response") && error.response.status === 401) { //todo display a popup with error message.error('You are not logged in'); window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/store/login'; } else { - message.error('Something went wrong... :('); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load apps.", + }); } this.setState({loading: false}); @@ -68,18 +73,28 @@ class AppList extends React.Component { }; render() { - const {apps} = this.state; + const {apps,loading} = this.state; return ( - - {apps.map(app => ( - - + + {apps.length === 0 && ( + Back Home} /> - - ))} - + )} + {apps.map(app => ( + + + + ))} + + ); } } diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/ReleaseView.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/ReleaseView.js index affc3da6908..72b2db0e060 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/ReleaseView.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/ReleaseView.js @@ -52,7 +52,8 @@ class ReleaseView extends React.Component { loading: false }); notification["error"]({ - message: 'Something went wrong', + message: "There was a problem", + duration: 0, description: "We are unable to install the app.", }); @@ -68,7 +69,8 @@ class ReleaseView extends React.Component { visible: false }); notification["error"]({ - message: 'Something went wrong', + message: "There was a problem", + duration: 0, description: "We are unable to add your review right now.", }); diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/AppInstallModal.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/AppInstallModal.js index 4567bceb218..17636f7e7a2 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/AppInstallModal.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/AppInstallModal.js @@ -17,21 +17,20 @@ class AppInstallModal extends React.Component{ - - - - - + + - + + + + - + diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js index 54eb95b5b50..01e02901365 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js @@ -1,7 +1,7 @@ import React from "react"; import axios from "axios"; import config from "../../../../../public/conf/config.json"; -import {Button, message, Table, Typography} from "antd"; +import {Button, message, notification, Table, Typography} from "antd"; import TimeAgo from 'javascript-time-ago' // Load locale-specific relative date/time formatting rules. @@ -120,7 +120,7 @@ class DeviceInstall extends React.Component { const extraParams = { offset: 10 * (currentPage - 1), //calculate the offset limit: 10, - status: "INACTIVE", + status: "ACTIVE", requireDeviceInfo: true }; @@ -158,7 +158,12 @@ class DeviceInstall extends React.Component { message.error('You are not logged in'); window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/store/login'; } else { - message.error('Something went wrong... :('); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load devices.", + }); } this.setState({loading: false}); diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupInstall.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupInstall.js index eef70f8836f..b2a2c685054 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupInstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupInstall.js @@ -50,7 +50,12 @@ class GroupInstall extends React.Component { message.error('You are not logged in'); window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/store/login'; } else { - message.error('Something went wrong... :('); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load groups.", + }); } this.setState({fetching: false}); diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleInstall.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleInstall.js index 04bfb2cd6df..27ffc3eb1b5 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleInstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleInstall.js @@ -50,7 +50,12 @@ class RoleInstall extends React.Component { message.error('You are not logged in'); window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/store/login'; } else { - message.error('Something went wrong... :('); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load roles.", + }); } this.setState({fetching: false}); diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserInstall.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserInstall.js index 89afa7cdec5..31c9a6eb6d7 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserInstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserInstall.js @@ -52,7 +52,12 @@ class UserInstall extends React.Component { message.error('You are not logged in'); window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/store/login'; } else { - message.error('Something went wrong... :('); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load users.", + }); } this.setState({fetching: false}); diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/AddReview.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/AddReview.js index 7c1dd36c18e..55f14fbefa6 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/AddReview.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/AddReview.js @@ -76,7 +76,8 @@ class AddReview extends React.Component { visible: false }); notification["error"]({ - message: 'Something went wrong', + message: "There was a problem", + duration: 0, description: "We are unable to add your review right now.", }); @@ -91,7 +92,8 @@ class AddReview extends React.Component { visible: false }); notification["error"]({ - message: 'Something went wrong', + message: "There was a problem", + duration: 0, description: "We are unable to add your review right now.", }); diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/CurrentUsersReview.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/CurrentUsersReview.js index cee5a263f65..810f7b7fb86 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/CurrentUsersReview.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/CurrentUsersReview.js @@ -1,5 +1,5 @@ import React from "react"; -import {List, message, Typography, Empty, Button, Row, Col} from "antd"; +import {List, message, Typography, Empty, Button, Row, Col, notification} from "antd"; import SingleReview from "./singleReview/SingleReview"; import axios from "axios"; import config from "../../../../../public/conf/config.json"; @@ -37,7 +37,12 @@ class CurrentUsersReview extends React.Component { message.error('You are not logged in'); window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/store/login'; } else { - message.error('Something went wrong when trying to get your review... :('); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to get your review.", + }); } }); }; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.js index a8d2fb4b1d5..835702bd056 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.js @@ -1,5 +1,5 @@ import React from "react"; -import {List, message, Avatar, Spin, Button} from 'antd'; +import {List, message, Avatar, Spin, Button, notification} from 'antd'; import "./Reviews.css"; import InfiniteScroll from 'react-infinite-scroller'; @@ -44,8 +44,12 @@ class Reviews extends React.Component { if (error.response.status === 401) { window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/store/login'; } else { - message.warning('Something went wrong'); - + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load reviews.", + }); } }); }; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/singleReview/SingleReview.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/singleReview/SingleReview.js index 2ae260f51cc..a5241f1c164 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/singleReview/SingleReview.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/singleReview/SingleReview.js @@ -65,7 +65,8 @@ class SingleReview extends React.Component { window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/store/login'; } else { notification["error"]({ - message: 'Something went wrong', + message: "There was a problem", + duration: 0, description: "We were unable to delete the review..", }); diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/singleReview/editReview/EditReview.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/singleReview/editReview/EditReview.js index 3a2af32e915..1ec2f613bba 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/singleReview/editReview/EditReview.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/singleReview/editReview/EditReview.js @@ -88,7 +88,8 @@ class EditReview extends React.Component { visible: false }); notification["error"]({ - message: 'Something went wrong', + message: "There was a problem", + duration: 0, description: "We are unable to update your review right now.", }); @@ -104,7 +105,8 @@ class EditReview extends React.Component { visible: false }); notification["error"]({ - message: 'Something went wrong', + message: "There was a problem", + duration: 0, description: "We are unable to add your review right now.", }); diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js index 11cf5d4315c..3c866962e28 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js @@ -14,7 +14,7 @@ class Apps extends React.Component { const {deviceType} = this.props.match.params; return (
-
+
{deviceType!==null && }
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js index cf1ea1f1264..acd6ded3005 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js @@ -1,6 +1,6 @@ import React from "react"; import '../../../../App.css'; -import {Skeleton, Typography, Row, Col, Card, message} from "antd"; +import {Skeleton, Typography, Row, Col, Card, message, notification} from "antd"; import ReleaseView from "../../../../components/apps/release/ReleaseView"; import axios from "axios"; import config from "../../../../../public/conf/config.json"; @@ -57,7 +57,12 @@ class Release extends React.Component { message.error('You are not logged in'); window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/store/login'; } else { - message.error('Something went wrong... :('); + notification["error"]({ + message: "There was a problem", + duration: 0, + description: + "Error occurred while trying to load releases.", + }); } this.setState({loading: false});