community/device-mgt-core
1
0
Fork 0
mirror of https://repository.entgra.net/community/device-mgt-core.git synced 2025-10-06 02:01:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add UI improvemnts to APPM UI

Browse Source 
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
This commit is contained in:
Jayasanka 2019-07-15 15:40:56 +05:30
parent a5f75df99a
commit 4d59b8d900
33 changed files with 562 additions and 504 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/public/conf/config.json
View File

@ -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."
}
}
}

9
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js vendored
View File

@ -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.",
});
}
});
};

37
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppDetailsDrawer/AppDetailsDrawer.js vendored
View File

@ -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});

40
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/Filters.js vendored
View File

@ -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

2
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/ListApps.js vendored
View File

@ -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";

9
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/appsTable/AppsTable.js vendored
View File

@ -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});

39
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/LifeCycle.js vendored
View File

@ -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 (
<div>
<Title level={4}>Manage Lifecycle</Title>
@ -163,6 +169,7 @@ class LifeCycle extends React.Component {
state to another. <br/>Note: ‘Change State To’ displays only the next states allowed from the
current state
</Paragraph>
<LifeCycleDetailsModal lifecycle={lifecycle}/>
<Divider dashed={true}/>
<Text strong={true}>Current State: </Text> <Tag color="blue">{currentStatus}</Tag><br/><br/>
<Text>Change State to: </Text>
@ -198,30 +205,6 @@ class LifeCycle extends React.Component {
<Divider/>
<Text strong={true}>Lorem Ipsum</Text>
<Collapse defaultActiveKey={currentStatus}>
{
Object.keys(lifecycle).map(lifecycleState => {
return (
<Panel header={lifecycleState} key={lifecycleState}>
{
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 (
<Tag
disabled={!isEnabled}
key={state} style={{marginBottom: 5}} color={color}>{state}</Tag>
)
})
}
</Panel>
)
})
}
</Collapse>
<Modal
title="Confirm changing lifecycle state"

96
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/lifeCycleDetailsModal/lifeCycleDetailsModal.js vendored Normal file
View File

@ -0,0 +1,96 @@
import React from "react";
import {Modal, Button, Tag, Collapse, List,Typography} from 'antd';
import pSBC from "shade-blend-color";
import config from "../../../../../../public/conf/config.json";
const {Text} = Typography;
const lifeCycleConfig = config.lifecycle;
class LifeCycleDetailsModal extends React.Component {
constructor(props) {
super(props);
this.state = {visible: false};
}
showModal = () => {
this.setState({
visible: true,
});
};
handleCancel = e => {
console.log(e);
this.setState({
visible: false,
});
};
render() {
const {lifecycle} = this.props;
return (
<div>
<Button
size="small"
icon="question-circle"
onClick={this.showModal}
>
Learn more
</Button>
<Modal
title="Lifecycle"
visible={this.state.visible}
footer = {null}
onCancel={this.handleCancel}
>
<List
itemLayout="horizontal"
dataSource={Object.keys(lifecycle)}
renderItem={lifecycleState => {
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 (
<List.Item>
<List.Item.Meta
title={lifecycleState}
/>
{text}
<br/>
<Text type="secondary">{footerText}</Text>
<div>
{
nextProceedingStates.map(lifecycleState => {
return (
<Tag
key={lifecycleState}
style={{margin: 5}}
color={pSBC(0.30, config.theme.primaryColor)}
>
{lifecycleState}
</Tag>
)
})
}
</div>
</List.Item>
)
}}
/>
</Modal>
</div>
);
}
}
export default LifeCycleDetailsModal;

10
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/review/Reviews.js vendored
View File

@ -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.",
});
}
});
};

68
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js vendored
View File

@ -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 = {
@ -58,7 +75,6 @@ class ManageCategories extends React.Component {
});
axios.delete(
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"]({
@ -84,7 +100,12 @@ class ManageCategories 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.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
@ -199,7 +220,6 @@ class ManageCategories extends React.Component {
axios.post(
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"]({
@ -223,7 +243,12 @@ class ManageCategories 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.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
@ -262,7 +287,6 @@ 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,
{},
).then(res => {
if (res.status === 200) {
notification["success"]({
@ -285,7 +309,12 @@ class ManageCategories 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.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 (
<div style={{marginBottom: 16}}>
<Card title="Categories">
<Card>
<Spin tip="Working on it..." spinning={this.state.loading}>
<Row>
<Col span={16}>
<Title level={4}>Categories</Title>
</Col>
<Col span={8}>
{!isAddNewVisible &&
<div style={{float: "right"}}>
<Button
icon="plus"
// type="primary"
size="small"
onClick={() => {
this.setState({
isAddNewVisible: true,
inputVisible: true
}, () => this.input.focus())
}} htmlType="button">Add Categories
}} htmlType="button">Add
</Button>
</div>
}
</Col>
</Row>
{isAddNewVisible &&
<div>
<Divider/>
<div style={{marginBottom: 16}}>
<TweenOneGroup
enter={{
@ -360,14 +401,18 @@ class ManageCategories extends React.Component {
</TweenOneGroup>
</div>
<div>
{tempElements.length > 0 && (
<span>
<Button
onClick={this.handleSave}
htmlType="button" type="primary"
size="small"
disabled={tempElements.length === 0}>
>
Save
</Button>
<Divider type="vertical"/>
</span>
)}
<Button
onClick={this.handleCloseButton}
size="small">
@ -402,7 +447,8 @@ class ManageCategories extends React.Component {
onCancel={this.closeEditModal}
onOk={this.editItem}
>
<Input value={this.state.editingValue} ref={(input) => this.editingInput = input} onChange={this.handleEditInputChange}/>
<Input value={this.state.editingValue} ref={(input) => this.editingInput = input}
onChange={this.handleEditInputChange}/>
</Modal>
</div>
);

68
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js vendored
View File

@ -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 = {
@ -35,8 +51,12 @@ class ManageTags 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
@ -84,7 +104,12 @@ class ManageTags 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.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
@ -221,7 +246,12 @@ class ManageTags 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.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
@ -260,7 +290,6 @@ 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,
{},
).then(res => {
if (res.status === 200) {
notification["success"]({
@ -283,7 +312,12 @@ class ManageTags 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.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 (
<div style={{marginBottom: 16}}>
<Card title="Tags">
<Card>
<Spin tip="Working on it..." spinning={this.state.loading}>
<Row>
<Col span={16}>
<Title level={4}>Tags</Title>
</Col>
<Col span={8}>
{!isAddNewVisible &&
<div style={{float: "right"}}>
<Button
icon="plus"
// type="primary"
size="small"
onClick={() => {
this.setState({
isAddNewVisible: true,
inputVisible: true
}, () => this.input.focus())
}} htmlType="button">Add Tags
}} htmlType="button">Add
</Button>
</div>
}
</Col>
</Row>
{isAddNewVisible &&
<div>
<Divider/>
<div style={{marginBottom: 16}}>
<TweenOneGroup
enter={{
@ -358,6 +404,8 @@ class ManageTags extends React.Component {
</TweenOneGroup>
</div>
<div>
{tempElements.length > 0 && (
<span>
<Button
onClick={this.handleSave}
htmlType="button" type="primary"
@ -366,6 +414,8 @@ class ManageTags extends React.Component {
Save
</Button>
<Divider type="vertical"/>
</span>
)}
< Button
onClick={this.handleCloseButton}
size="small">

16
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/AddNewAppForm.js vendored
View File

@ -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

136
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/actions/index.js vendored
View File

@ -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
});
}
});
};

15
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/constants/ActionTypes.js vendored
View File

@ -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;

64
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/reducers/index.js vendored
View File

@ -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;

5
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/store/index.js vendored
View File

@ -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;

56
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/utils/dagre-utils.ts
View File

@ -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)
);
}

9
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/Login.js vendored
View File

@ -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

10
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/release/Release.js vendored
View File

@ -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});
});
};

33
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppList.js vendored
View File

@ -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
}
}
@ -36,14 +36,13 @@ class AppList extends React.Component {
} 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/",
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,10 +73,19 @@ class AppList extends React.Component {
};
render() {
const {apps} = this.state;
const {apps,loading} = this.state;
return (
<Skeleton loading={loading} active>
<Row gutter={16}>
{apps.length === 0 && (
<Result
status="404"
title="No apps, yet."
subTitle="No apps available, yet! When the administration uploads, apps will show up here."
// extra={<Button type="primary">Back Home</Button>}
/>
)}
{apps.map(app => (
<Col key={app.id} xs={12} sm={6} md={6} lg={4} xl={3}>
<AppCard key={app.id}
@ -80,6 +94,7 @@ class AppList extends React.Component {
</Col>
))}
</Row>
</Skeleton>
);
}
}

6
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/ReleaseView.js vendored
View File

@ -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.",
});

15
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/AppInstallModal.js vendored
View File

@ -17,21 +17,20 @@ class AppInstallModal extends React.Component{
<Modal
title="Install App"
visible={this.props.visible}
// onOk={this.handleOk}
onCancel={this.props.onClose}
footer={null}
>
<Tabs defaultActiveKey="1">
<TabPane tab="User" key="1">
<UserInstall onInstall={this.props.onInstall}/>
</TabPane>
<TabPane tab="Device" key="2">
<Tabs defaultActiveKey="device">
<TabPane tab="Device" key="device">
<DeviceInstall onInstall={this.props.onInstall}/>
</TabPane>
<TabPane tab="Role" key="3">
<TabPane tab="User" key="user">
<UserInstall onInstall={this.props.onInstall}/>
</TabPane>
<TabPane tab="Role" key="role">
<RoleInstall onInstall={this.props.onInstall}/>
</TabPane>
<TabPane tab="Group" key="4">
<TabPane tab="Group" key="group">
<GroupInstall onInstall={this.props.onInstall}/>
</TabPane>
</Tabs>

11
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js vendored
View File

@ -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});

7
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupInstall.js vendored
View File

@ -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});

7
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleInstall.js vendored
View File

@ -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});

7
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserInstall.js vendored
View File

@ -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});

6
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/AddReview.js vendored
View File

@ -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.",
});

9
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/CurrentUsersReview.js vendored
View File

@ -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.",
});
}
});
};

10
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.js vendored
View File

@ -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.",
});
}
});
};

3
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/singleReview/SingleReview.js vendored
View File

@ -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..",
});

6
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/singleReview/editReview/EditReview.js vendored
View File

@ -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.",
});

2
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js vendored
View File

@ -14,7 +14,7 @@ class Apps extends React.Component {
const {deviceType} = this.props.match.params;
return (
<div>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 780}}>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 760}}>
{deviceType!==null && <AppList changeSelectedMenuItem={this.props.changeSelectedMenuItem} deviceType={deviceType}/>}
</div>

9
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js vendored
View File

@ -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});