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

Merge branch 'application-mgt-new' of gitlab.com:entgra/carbon-device-mgt into application-mgt-new

Browse Source
This commit is contained in:
lasanthaDLPDS 2019-10-27 21:01:50 +05:30
commit db0b362244
34 changed files with 1176 additions and 555 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/package.json
View File

@ -39,7 +39,8 @@
"redux-thunk": "^2.3.0",
"shade-blend-color": "^1.0.0",
"storm-react-diagrams": "^5.2.1",
"typescript": "^3.6.4"
"typescript": "^3.6.4",
"lodash.debounce": "latest"
},
"devDependencies": {
"@babel/core": "^7.5.0",

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

@ -61,7 +61,7 @@ class DetailedRating extends React.Component{
}
}).catch(function (error) {
handleApiError(error, "Error occurred while trying to load rating for the release.");
handleApiError(error, "Error occurred while trying to load rating for the release.", true);
});
};

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

@ -136,7 +136,7 @@ class AppDetailsDrawer extends React.Component {
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load app details.");
handleApiError(error, "Error occurred while trying to load categories.", true);
this.setState({
loading: false
});
@ -509,8 +509,8 @@ class AppDetailsDrawer extends React.Component {
title="Published"
style={{
backgroundColor: '#52c41a',
borderRadius:"50%",
color:"white"
borderRadius: "50%",
color: "white"
}}
count={
<Icon
@ -547,10 +547,10 @@ class AppDetailsDrawer extends React.Component {
/>
</div>
<Divider dashed={true}/>
{/*display add new release only if app type is enterprise*/}
{(app.type === "ENTERPRISE") && (
<div>
<Divider dashed={true}/>
<div style={{paddingBottom: 16}}>
<Text>
Add new release for the application

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

@ -30,7 +30,7 @@ import {
Form,
message,
Radio,
notification
notification, Alert
} from "antd";
import axios from "axios";
import {withConfigContext} from "../../../context/ConfigContext";
@ -46,7 +46,12 @@ class FiltersForm extends React.Component {
this.state = {
categories: [],
tags: [],
deviceTypes: []
deviceTypes: [],
forbiddenErrors: {
categories: false,
tags: false,
deviceTypes: false
}
};
}
@ -59,11 +64,11 @@ class FiltersForm extends React.Component {
}
}
if(values.hasOwnProperty("deviceType") && values.deviceType==="ALL"){
if (values.hasOwnProperty("deviceType") && values.deviceType === "ALL") {
delete values["deviceType"];
}
if(values.hasOwnProperty("appType") && values.appType==="ALL"){
if (values.hasOwnProperty("appType") && values.appType === "ALL") {
delete values["appType"];
}
@ -73,16 +78,17 @@ class FiltersForm extends React.Component {
componentDidMount() {
this.getCategories();
this.getTags();
this.getDeviceTypes();
}
getCategories = () => {
const config = this.props.context;
axios.get(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories"
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories"
).then(res => {
if (res.status === 200) {
let categories = JSON.parse(res.data.data);
this.getTags();
this.setState({
categories: categories,
loading: false
@ -90,21 +96,29 @@ class FiltersForm extends React.Component {
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load categories.");
this.setState({
loading: false
});
handleApiError(error, "Error occurred while trying to load categories.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.categories = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
getTags = () => {
const config = this.props.context;
axios.get(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags"
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags"
).then(res => {
if (res.status === 200) {
let tags = JSON.parse(res.data.data);
this.getDeviceTypes();
this.setState({
tags: tags,
loading: false,
@ -112,10 +126,19 @@ class FiltersForm extends React.Component {
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load tags.");
this.setState({
loading: false
});
handleApiError(error, "Error occurred while trying to load tags.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.tags = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -123,7 +146,7 @@ class FiltersForm extends React.Component {
getDeviceTypes = () => {
const config = this.props.context;
axios.get(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt + "/device-types"
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt + "/device-types"
).then(res => {
if (res.status === 200) {
const deviceTypes = JSON.parse(res.data.data);
@ -134,15 +157,24 @@ class FiltersForm extends React.Component {
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load device types.");
this.setState({
loading: false
});
handleApiError(error, "Error occurred while trying to load device types.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.deviceTypes = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
render() {
const {categories, tags, deviceTypes} = this.state;
const {categories, tags, deviceTypes, forbiddenErrors} = this.state;
const {getFieldDecorator} = this.props.form;
return (
@ -170,7 +202,13 @@ class FiltersForm extends React.Component {
</Form.Item>
</Col>
</Row>
{(forbiddenErrors.categories) && (
<Alert
message="You don't have permission to view categories."
type="warning"
banner
closable/>
)}
<Form.Item label="Categories">
{getFieldDecorator('categories', {
rules: [{
@ -182,8 +220,7 @@ class FiltersForm extends React.Component {
mode="multiple"
style={{width: '100%'}}
placeholder="Select a Category"
onChange={this.handleCategoryChange}
>
onChange={this.handleCategoryChange}>
{
categories.map(category => {
return (
@ -198,7 +235,13 @@ class FiltersForm extends React.Component {
)}
</Form.Item>
{(forbiddenErrors.deviceTypes) && (
<Alert
message="You don't have permission to view device types."
type="warning"
banner
closable/>
)}
<Form.Item label="Device Type">
{getFieldDecorator('deviceType', {
rules: [{
@ -208,8 +251,7 @@ class FiltersForm extends React.Component {
})(
<Select
style={{width: '100%'}}
placeholder="Select device types"
>
placeholder="Select device types">
{
deviceTypes.map(deviceType => {
return (
@ -226,7 +268,13 @@ class FiltersForm extends React.Component {
</Select>
)}
</Form.Item>
{(forbiddenErrors.tags) && (
<Alert
message="You don't have permission to view tags."
type="warning"
banner
closable/>
)}
<Form.Item label="Tags">
{getFieldDecorator('tags', {
rules: [{

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

@ -17,7 +17,7 @@
*/
import React from "react";
import {Avatar, Table, Tag, Icon, message, notification, Col, Badge} from "antd";
import {Avatar, Table, Tag, Icon, message, notification, Col, Badge, Alert} from "antd";
import axios from "axios";
import pSBC from 'shade-blend-color';
import "./AppsTable.css";
@ -58,7 +58,7 @@ const columns = [
avatar = (hasPublishedRelease) ? (
<Badge
title="Published"
style={{ backgroundColor: '#52c41a', borderRadius:"50%", color:"white"}}
style={{backgroundColor: '#52c41a', borderRadius: "50%", color: "white"}}
count={
<Icon
type="check-circle"/>
@ -74,7 +74,6 @@ const columns = [
) : (
<Avatar shape="square" size="large"
style={{
marginRight: 20,
borderRadius: "28%",
border: "1px solid #ddd"
}}
@ -148,7 +147,8 @@ class AppsTable extends React.Component {
isDrawerVisible: false,
selectedApp: null,
selectedAppIndex: -1,
loading: false
loading: false,
isForbiddenErrorVisible: false
};
config = this.props.context;
}
@ -240,7 +240,12 @@ class AppsTable extends React.Component {
});
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load apps.");
handleApiError(error, "Error occurred while trying to load apps.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
this.setState({
isForbiddenErrorVisible: true
})
}
this.setState({loading: false});
});
};
@ -256,29 +261,37 @@ class AppsTable extends React.Component {
render() {
const {isDrawerVisible, loading} = this.state;
return (
<div className="apps-table">
<Table
rowKey={record => record.id}
dataSource={this.state.apps}
columns={columns}
pagination={this.state.pagination}
onChange={this.handleTableChange}
rowClassName="app-row"
loading={loading}
onRow={(record, rowIndex) => {
return {
onClick: event => {
this.showDrawer(record, rowIndex);
},
};
}}/>
<AppDetailsDrawer
visible={isDrawerVisible}
onClose={this.closeDrawer}
app={this.state.selectedApp}
onUpdateApp={this.onUpdateApp}/>
<div>
{(this.state.isForbiddenErrorVisible) && (
<Alert
message="You don't have permission to view apps."
type="warning"
banner
closable/>
)}
<div className="apps-table">
<Table
rowKey={record => record.id}
dataSource={this.state.apps}
columns={columns}
pagination={this.state.pagination}
onChange={this.handleTableChange}
rowClassName="app-row"
loading={loading}
onRow={(record, rowIndex) => {
return {
onClick: event => {
this.showDrawer(record, rowIndex);
},
};
}}/>
<AppDetailsDrawer
visible={isDrawerVisible}
onClose={this.closeDrawer}
app={this.state.selectedApp}
onUpdateApp={this.onUpdateApp}/>
</div>
</div>
);
}
}

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

@ -24,6 +24,7 @@ import "../../../App.css";
import DetailedRating from "../detailed-rating/DetailedRating";
import EditRelease from "./edit-release/EditRelease";
import {withConfigContext} from "../../../context/ConfigContext";
import NewAppUploadForm from "../../new-app/subForms/NewAppUploadForm";
const {Title, Text, Paragraph} = Typography;
@ -97,6 +98,7 @@ class ReleaseView extends React.Component {
<Text>Version : {release.version}</Text><br/>
<EditRelease
forbiddenErrors={this.props.forbiddenErrors}
isAppUpdatable={isAppUpdatable}
type={app.type}
deviceType={app.deviceType}

123
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/edit-release/EditRelease.js vendored
View File

@ -31,7 +31,7 @@ import {
Divider,
Row,
Col,
Select
Select, Alert
} from 'antd';
import axios from "axios";
import "@babel/polyfill";
@ -522,63 +522,72 @@ class EditReleaseModal extends React.Component {
)}
</Form.Item>
{(config.deviceTypes.mobileTypes.includes(deviceType)) && (
<Form.Item {...formItemLayout} label="Supported OS Versions">
{getFieldDecorator('supportedOS')(
<div>
<InputGroup>
<Row gutter={8}>
<Col span={11}>
<Form.Item>
{getFieldDecorator('lowerOsVersion', {
rules: [{
required: true,
message: 'Please select Value'
}],
})(
<Select
placeholder="Lower version"
style={{width: "100%"}}
onChange={this.handleLowerOsVersionChange}>
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
)}
</Form.Item>
</Col>
<Col span={2}>
<p> - </p>
</Col>
<Col span={11}>
<Form.Item>
{getFieldDecorator('upperOsVersion', {
rules: [{
required: true,
message: 'Please select Value'
}],
})(
<Select style={{width: "100%"}}
placeholder="Upper version"
onChange={this.handleUpperOsVersionChange}>
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
)}
</Form.Item>
</Col>
</Row>
</InputGroup>
</div>
<div>
{(this.props.forbiddenErrors.supportedOsVersions) && (
<Alert
message="You don't have permission to view supported OS versions."
type="warning"
banner
closable/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Supported OS Versions">
{getFieldDecorator('supportedOS')(
<div>
<InputGroup>
<Row gutter={8}>
<Col span={11}>
<Form.Item>
{getFieldDecorator('lowerOsVersion', {
rules: [{
required: true,
message: 'Please select Value'
}],
})(
<Select
placeholder="Lower version"
style={{width: "100%"}}
onChange={this.handleLowerOsVersionChange}>
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
)}
</Form.Item>
</Col>
<Col span={2}>
<p> - </p>
</Col>
<Col span={11}>
<Form.Item>
{getFieldDecorator('upperOsVersion', {
rules: [{
required: true,
message: 'Please select Value'
}],
})(
<Select style={{width: "100%"}}
placeholder="Upper version"
onChange={this.handleUpperOsVersionChange}>
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
)}
</Form.Item>
</Col>
</Row>
</InputGroup>
</div>
)}
</Form.Item>
</div>
)}
<Form.Item {...formItemLayout} label="Meta Data">
{getFieldDecorator('meta', {

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

@ -17,7 +17,7 @@
*/
import React from "react";
import {List, message, Avatar, Spin, Button, notification} from 'antd';
import {List, message, Avatar, Spin, Button, notification, Alert} from 'antd';
import "./Reviews.css";
import InfiniteScroll from 'react-infinite-scroller';
@ -33,7 +33,10 @@ class Reviews extends React.Component {
data: [],
loading: false,
hasMore: false,
loadMore: false
loadMore: false,
forbiddenErrors: {
reviews: false
}
};
@ -49,17 +52,34 @@ class Reviews extends React.Component {
const config = this.props.context;
const {uuid, type} = this.props;
this.setState({
loading: true
});
axios.get(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/reviews/" + type + "/" + uuid
window.location.origin +
config.serverConfig.invoker.uri +
config.serverConfig.invoker.publisher +
"/admin/reviews/" + type + "/" + uuid
).then(res => {
if (res.status === 200) {
let reviews = res.data.data.data;
callback(reviews);
}
}).catch(function (error) {
handleApiError(error, "Error occurred while trying to load reviews.");
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load reviews.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.reviews = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -101,32 +121,39 @@ class Reviews extends React.Component {
render() {
return (
<div className="demo-infinite-container">
<InfiniteScroll
initialLoad={false}
pageStart={0}
loadMore={this.handleInfiniteOnLoad}
hasMore={!this.state.loading && this.state.hasMore}
useWindow={true}
>
<List
dataSource={this.state.data}
renderItem={item => (
<List.Item key={item.id}>
<SingleReview review={item}/>
</List.Item>
)}
>
{this.state.loading && this.state.hasMore && (
<div className="demo-loading-container">
<Spin/>
</div>
)}
</List>
</InfiniteScroll>
{!this.state.loadMore && (this.state.data.length >= limit) && (<div style={{textAlign: "center"}}>
<Button type="dashed" htmlType="button" onClick={this.enableLoading}>Read All Reviews</Button>
</div>)}
<div>
{(this.state.forbiddenErrors.reviews) && (
<Alert
message="You don't have permission to view reviews."
type="warning"
banner
closable/>
)}
<div className="demo-infinite-container">
<InfiniteScroll
initialLoad={false}
pageStart={0}
loadMore={this.handleInfiniteOnLoad}
hasMore={!this.state.loading && this.state.hasMore}
useWindow={true}>
<List
dataSource={this.state.data}
renderItem={item => (
<List.Item key={item.id}>
<SingleReview review={item}/>
</List.Item>
)}>
{this.state.loading && this.state.hasMore && (
<div className="demo-loading-container">
<Spin/>
</div>
)}
</List>
</InfiniteScroll>
{!this.state.loadMore && (this.state.data.length >= limit) && (<div style={{textAlign: "center"}}>
<Button type="dashed" htmlType="button" onClick={this.enableLoading}>Read All Reviews</Button>
</div>)}
</div>
</div>
);
}

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

@ -32,7 +32,7 @@ import {
Modal,
Row,
Col,
Typography
Typography, Alert
} from "antd";
import axios from "axios";
import {TweenOneGroup} from 'rc-tween-one';
@ -53,13 +53,16 @@ class ManageCategories extends React.Component {
isAddNewVisible: false,
isEditModalVisible: false,
currentlyEditingId: null,
editingValue: null
editingValue: null,
forbiddenErrors: {
categories: false
}
};
componentDidMount() {
const config = this.props.context;
axios.get(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories",
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories",
).then(res => {
if (res.status === 200) {
let categories = JSON.parse(res.data.data);
@ -70,10 +73,19 @@ class ManageCategories extends React.Component {
}
}).catch((error) => {
handleApiError(error, "Error occured while trying to load categories");
this.setState({
loading: false
});
handleApiError(error, "Error occured while trying to load categories", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.categories = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
}
@ -90,7 +102,7 @@ class ManageCategories extends React.Component {
loading: true
});
axios.delete(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories/" + id,
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories/" + id,
).then(res => {
if (res.status === 200) {
notification["success"]({
@ -125,8 +137,7 @@ class ManageCategories extends React.Component {
const tagElem = (
<Tag
color={pSBC(0.30, config.theme.primaryColor)}
style={{marginTop:8}}
>
style={{marginTop: 8}}>
{categoryName}
<Divider type="vertical"/>
<Tooltip title="edit">
@ -150,8 +161,7 @@ class ManageCategories extends React.Component {
}
}}
okText="Yes"
cancelText="No"
>
cancelText="No">
<Icon type="delete"/>
</Popconfirm>
</Tooltip>
@ -168,7 +178,7 @@ class ManageCategories extends React.Component {
const config = this.props.context;
const tagElem = (
<Tag
style={{marginTop:8}}
style={{marginTop: 8}}
closable
onClose={e => {
e.preventDefault();
@ -229,7 +239,7 @@ class ManageCategories extends React.Component {
const data = tempElements.map(category => category.categoryName);
axios.post(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories",
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories",
data,
).then(res => {
if (res.status === 200) {
@ -287,7 +297,7 @@ class ManageCategories extends React.Component {
});
axios.put(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories/rename?from=" + currentlyEditingId + "&to=" + editingValue,
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories/rename?from=" + currentlyEditingId + "&to=" + editingValue,
{},
).then(res => {
if (res.status === 200) {
@ -324,11 +334,18 @@ class ManageCategories extends React.Component {
};
render() {
const {categories, inputVisible, inputValue, tempElements, isAddNewVisible} = this.state;
const {categories, inputVisible, inputValue, tempElements, isAddNewVisible, forbiddenErrors} = this.state;
const categoriesElements = categories.map(this.renderElement);
const temporaryElements = tempElements.map(this.renderTempElement);
return (
<div style={{marginBottom: 16}}>
{(forbiddenErrors.categories) && (
<Alert
message="You don't have permission to view categories."
type="warning"
banner
closable/>
)}
<Card>
<Spin tip="Working on it..." spinning={this.state.loading}>
<Row>

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

@ -31,7 +31,7 @@ import {
Popconfirm,
Modal,
Row, Col,
Typography
Typography, Alert
} from "antd";
import axios from "axios";
import {TweenOneGroup} from 'rc-tween-one';
@ -51,13 +51,16 @@ class ManageTags extends React.Component {
isAddNewVisible: false,
isEditModalVisible: false,
currentlyEditingId: null,
editingValue: null
editingValue: null,
forbiddenErrors: {
tags: false
}
};
componentDidMount() {
const config = this.props.context;
axios.get(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags",
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags",
).then(res => {
if (res.status === 200) {
let tags = JSON.parse(res.data.data);
@ -68,10 +71,19 @@ class ManageTags extends React.Component {
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load tags.");
this.setState({
loading: false
});
handleApiError(error, "Error occurred while trying to load tags.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.tags = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
}
@ -90,7 +102,7 @@ class ManageTags extends React.Component {
});
axios.delete(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/tags/" + id
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/tags/" + id
).then(res => {
if (res.status === 200) {
notification["success"]({
@ -124,7 +136,7 @@ class ManageTags extends React.Component {
const tagElem = (
<Tag
color="#34495e"
style={{marginTop:8}}
style={{marginTop: 8}}
>
{tagName}
<Divider type="vertical"/>
@ -167,7 +179,7 @@ class ManageTags extends React.Component {
const {tempElements} = this.state;
const tagElem = (
<Tag
style={{marginTop:8}}
style={{marginTop: 8}}
closable
onClose={e => {
e.preventDefault();
@ -226,7 +238,7 @@ class ManageTags extends React.Component {
const data = tempElements.map(tag => tag.tagName);
axios.post(window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags",
axios.post(window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags",
data,
).then(res => {
if (res.status === 200) {
@ -284,7 +296,7 @@ class ManageTags extends React.Component {
});
axios.put(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags/rename?from=" + currentlyEditingId + "&to=" + editingValue,
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags/rename?from=" + currentlyEditingId + "&to=" + editingValue,
{},
).then(res => {
if (res.status === 200) {
@ -321,11 +333,18 @@ class ManageTags extends React.Component {
};
render() {
const {tags, inputVisible, inputValue, tempElements, isAddNewVisible} = this.state;
const {tags, inputVisible, inputValue, tempElements, isAddNewVisible, forbiddenErrors} = this.state;
const tagsElements = tags.map(this.renderElement);
const temporaryElements = tempElements.map(this.renderTempElement);
return (
<div style={{marginBottom: 16}}>
{(forbiddenErrors.tags) && (
<Alert
message="You don't have permission to view tags."
type="warning"
banner
closable/>
)}
<Card>
<Spin tip="Working on it..." spinning={this.state.loading}>
<Row>
@ -365,8 +384,7 @@ class ManageTags extends React.Component {
},
}}
leave={{opacity: 0, width: 0, scale: 0, duration: 200}}
appear={false}
>
appear={false}>
{temporaryElements}
{inputVisible && (

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

@ -55,7 +55,10 @@ class AddNewAppFormComponent extends React.Component {
isError: false,
deviceType: null,
supportedOsVersions: [],
errorText: ""
errorText: "",
forbiddenErrors: {
supportedOsVersions: false
}
};
}
@ -143,15 +146,24 @@ class AddNewAppFormComponent extends React.Component {
});
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load supported OS versions.");
this.setState({
loading: false
});
handleApiError(error, "Error occurred while trying to load supported OS versions.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.supportedOsVersions = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
render() {
const {loading, current, isError, supportedOsVersions, errorText} = this.state;
const {loading, current, isError, supportedOsVersions, errorText, forbiddenErrors} = this.state;
const {formConfig} = this.props;
return (
<div>
@ -171,6 +183,7 @@ class AddNewAppFormComponent extends React.Component {
</div>
<div style={{display: (current === 1 ? 'unset' : 'none')}}>
<NewAppUploadForm
forbiddenErrors={forbiddenErrors}
formConfig={formConfig}
supportedOsVersions={supportedOsVersions}
onSuccessReleaseData={this.onSuccessReleaseData}

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

@ -17,10 +17,11 @@
*/
import React from "react";
import {Button, Col, Divider, Form, Icon, Input, notification, Row, Select, Switch, Upload} from "antd";
import {Alert, Button, Col, Divider, Form, Icon, Input, notification, Row, Select, Spin, Switch, Upload} from "antd";
import axios from "axios";
import {withConfigContext} from "../../../context/ConfigContext";
import {handleApiError} from "../../../js/Utils";
import debounce from 'lodash.debounce';
const formItemLayout = {
labelCol: {
@ -42,12 +43,21 @@ class NewAppDetailsForm extends React.Component {
this.state = {
categories: [],
tags: [],
deviceTypes:[]
deviceTypes: [],
fetching: false,
roleSearchValue: [],
unrestrictedRoles: [],
forbiddenErrors: {
categories: false,
tags: false,
deviceTypes: false,
roles: false
}
};
this.lastFetchId = 0;
this.fetchRoles = debounce(this.fetchRoles, 800);
}
handleSubmit = e => {
e.preventDefault();
const {formConfig} = this.props;
@ -58,13 +68,17 @@ class NewAppDetailsForm 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, unrestrictedRoles} = values;
const unrestrictedRolesData = [];
unrestrictedRoles.map(val => {
unrestrictedRolesData.push(val.key);
});
const application = {
name,
description,
categories,
tags,
unrestrictedRoles: [],
unrestrictedRoles: unrestrictedRolesData,
};
if (formConfig.installationType !== "WEB_CLIP") {
@ -81,6 +95,8 @@ class NewAppDetailsForm extends React.Component {
componentDidMount() {
this.getCategories();
this.getTags();
this.getDeviceTypes();
}
getCategories = () => {
@ -95,13 +111,20 @@ class NewAppDetailsForm extends React.Component {
loading: false
});
}
this.getTags();
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load categories.");
this.setState({
loading: false
});
handleApiError(error, "Error occurred while trying to load categories.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.categories = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -117,13 +140,20 @@ class NewAppDetailsForm extends React.Component {
loading: false,
});
}
this.getDeviceTypes();
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load tags.");
this.setState({
loading: false
});
handleApiError(error, "Error occurred while trying to load tags.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.tags = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -141,15 +171,15 @@ class NewAppDetailsForm extends React.Component {
const allowedDeviceTypes = [];
// exclude mobile device types if installation type is custom
if(installationType==="CUSTOM"){
allDeviceTypes.forEach(deviceType=>{
if(!mobileDeviceTypes.includes(deviceType.name)){
if (installationType === "CUSTOM") {
allDeviceTypes.forEach(deviceType => {
if (!mobileDeviceTypes.includes(deviceType.name)) {
allowedDeviceTypes.push(deviceType);
}
});
}else{
allDeviceTypes.forEach(deviceType=>{
if(mobileDeviceTypes.includes(deviceType.name)){
} else {
allDeviceTypes.forEach(deviceType => {
if (mobileDeviceTypes.includes(deviceType.name)) {
allowedDeviceTypes.push(deviceType);
}
});
@ -161,16 +191,76 @@ class NewAppDetailsForm extends React.Component {
});
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load device types.");
this.setState({
loading: false
});
handleApiError(error, "Error occurred while trying to load device types.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.deviceTypes = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
fetchRoles = value => {
const config = this.props.context;
this.lastFetchId += 1;
const fetchId = this.lastFetchId;
this.setState({data: [], fetching: true});
axios.get(
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt + "/roles?filter=" + value,
).then(res => {
if (res.status === 200) {
if (fetchId !== this.lastFetchId) {
// for fetch callback order
return;
}
const data = res.data.data.roles.map(role => ({
text: role,
value: role,
}));
this.setState({
unrestrictedRoles: data,
fetching: false
});
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load roles.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.roles = true;
this.setState({
forbiddenErrors,
fetching: false
})
} else {
this.setState({
fetching: false
});
}
});
};
handleRoleSearch = roleSearchValue => {
this.setState({
roleSearchValue,
unrestrictedRoles: [],
fetching: false,
});
};
render() {
const {formConfig} = this.props;
const {categories, tags, deviceTypes} = this.state;
const {categories, tags, deviceTypes, fetching, roleSearchValue, unrestrictedRoles, forbiddenErrors} = this.state;
const {getFieldDecorator} = this.props.form;
return (
@ -185,34 +275,41 @@ class NewAppDetailsForm extends React.Component {
layout="horizontal"
onSubmit={this.handleSubmit}>
{formConfig.installationType !== "WEB_CLIP" && (
<Form.Item {...formItemLayout} label="Device Type">
{getFieldDecorator('deviceType', {
rules: [
{
required: true,
message: 'Please select device type'
}
],
}
)(
<Select
style={{width: '100%'}}
placeholder="select device type"
onChange={this.handleCategoryChange}
>
{
deviceTypes.map(deviceType => {
return (
<Option
key={deviceType.name}>
{deviceType.name}
</Option>
)
})
}
</Select>
<div>
{(forbiddenErrors.deviceTypes) && (
<Alert
message="You don't have permission to view device types."
type="warning"
banner
closable/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Device Type">
{getFieldDecorator('deviceType', {
rules: [
{
required: true,
message: 'Please select device type'
}
],
}
)(
<Select
style={{width: '100%'}}
placeholder="select device type">
{
deviceTypes.map(deviceType => {
return (
<Option
key={deviceType.name}>
{deviceType.name}
</Option>
)
})
}
</Select>
)}
</Form.Item>
</div>
)}
{/*app name*/}
@ -238,6 +335,43 @@ class NewAppDetailsForm extends React.Component {
<TextArea placeholder="Enter the description..." rows={7}/>
)}
</Form.Item>
{/*Unrestricted Roles*/}
{(forbiddenErrors.roles) && (
<Alert
message="You don't have permission to view roles."
type="warning"
banner
closable/>
)}
<Form.Item {...formItemLayout} label="Unrestricted Roles">
{getFieldDecorator('unrestrictedRoles', {
rules: [],
initialValue: []
})(
<Select
mode="multiple"
labelInValue
// value={roleSearchValue}
placeholder="Search roles"
notFoundContent={fetching ? <Spin size="small"/> : null}
filterOption={false}
onSearch={this.fetchRoles}
onChange={this.handleRoleSearch}
style={{width: '100%'}}>
{unrestrictedRoles.map(d => (
<Option key={d.value}>{d.text}</Option>
))}
</Select>
)}
</Form.Item>
{(forbiddenErrors.categories) && (
<Alert
message="You don't have permission to view categories."
type="warning"
banner
closable/>
)}
<Form.Item {...formItemLayout} label="Categories">
{getFieldDecorator('categories', {
rules: [{
@ -249,8 +383,7 @@ class NewAppDetailsForm extends React.Component {
mode="multiple"
style={{width: '100%'}}
placeholder="Select a Category"
onChange={this.handleCategoryChange}
>
onChange={this.handleCategoryChange}>
{
categories.map(category => {
return (
@ -264,6 +397,13 @@ class NewAppDetailsForm extends React.Component {
</Select>
)}
</Form.Item>
{(forbiddenErrors.tags) && (
<Alert
message="You don't have permission to view tags."
type="warning"
banner
closable/>
)}
<Form.Item {...formItemLayout} label="Tags">
{getFieldDecorator('tags', {
rules: [{
@ -274,8 +414,7 @@ class NewAppDetailsForm extends React.Component {
<Select
mode="tags"
style={{width: '100%'}}
placeholder="Tags"
>
placeholder="Tags">
{
tags.map(tag => {
return (

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

@ -17,7 +17,7 @@
*/
import React from "react";
import {Button, Col, Form, Icon, Input, Row, Select, Switch, Upload, InputNumber, Modal} from "antd";
import {Button, Col, Form, Icon, Input, Row, Select, Switch, Upload, InputNumber, Modal, Alert} from "antd";
import "@babel/polyfill";
import axios from "axios";
import {handleApiError} from "../../../js/Utils";
@ -117,7 +117,7 @@ class NewAppUploadForm extends React.Component {
osVersionsHelperText: 'Please select supported OS versions',
osVersionsValidateStatus: 'error',
});
} else if (this.lowerOsVersion >= this.upperOsVersion) {
} else if (parseFloat(this.lowerOsVersion) >= parseFloat(this.upperOsVersion)) {
isFormValid = false;
this.setState({
osVersionsHelperText: 'Please select valid range',
@ -221,7 +221,7 @@ class NewAppUploadForm extends React.Component {
};
handleLowerOsVersionChange = (lowerOsVersion) => {
this.lowerOsVersion = parseFloat(lowerOsVersion);
this.lowerOsVersion = lowerOsVersion;
this.setState({
osVersionsValidateStatus: 'validating',
osVersionsHelperText: ''
@ -229,7 +229,11 @@ class NewAppUploadForm extends React.Component {
};
handleUpperOsVersionChange = (upperOsVersion) => {
this.upperOsVersion = parseFloat(upperOsVersion);
if (upperOsVersion === "all") {
this.upperOsVersion = this.props.supportedOsVersions[this.props.supportedOsVersions.length - 1]["versionName"];
}else{
this.upperOsVersion = upperOsVersion;
}
this.setState({
osVersionsValidateStatus: 'validating',
osVersionsHelperText: ''
@ -400,60 +404,69 @@ class NewAppUploadForm extends React.Component {
</Form.Item>
{(formConfig.installationType !== "WEB_CLIP" && formConfig.installationType !== "CUSTOM") && (
<Form.Item
{...formItemLayout}
label="Supported OS Versions"
validateStatus={osVersionsValidateStatus}
help={osVersionsHelperText}>
{getFieldDecorator('supportedOS', {
rules: [{
required: true
}],
initialValue: false
})(
<div>
<InputGroup>
<Row gutter={8}>
<Col span={11}>
<Select
placeholder="Lower version"
style={{width: "100%"}}
onChange={this.handleLowerOsVersionChange}>
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
</Col>
<Col span={2}>
<p> - </p>
</Col>
<Col span={11}>
<Select style={{width: "100%"}}
placeholder="Upper version"
defaultActiveFirstOption={true}
onChange={this.handleUpperOsVersionChange}>
{(supportedOsVersions.length > 0) &&(
<Option key="all"
value={supportedOsVersions[supportedOsVersions.length-1]["versionName"]}>
All
</Option>
)}
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
</Col>
</Row>
</InputGroup>
</div>
<div>
{(this.props.forbiddenErrors.supportedOsVersions) && (
<Alert
message="You don't have permission to view supported OS versions."
type="warning"
banner
closable/>
)}
</Form.Item>
<Form.Item
{...formItemLayout}
label="Supported OS Versions"
validateStatus={osVersionsValidateStatus}
help={osVersionsHelperText}>
{getFieldDecorator('supportedOS', {
rules: [{
required: true
}],
initialValue: false
})(
<div>
<InputGroup>
<Row gutter={8}>
<Col span={11}>
<Select
placeholder="Lower version"
style={{width: "100%"}}
onChange={this.handleLowerOsVersionChange}>
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
</Col>
<Col span={2}>
<p> - </p>
</Col>
<Col span={11}>
<Select style={{width: "100%"}}
placeholder="Upper version"
defaultActiveFirstOption={true}
onChange={this.handleUpperOsVersionChange}>
{(supportedOsVersions.length > 0) && (
<Option key="all"
value="all">
All
</Option>
)}
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
</Col>
</Row>
</InputGroup>
</div>
)}
</Form.Item>
</div>
)}
<Form.Item {...formItemLayout} label="Meta Data">
{getFieldDecorator('meta', {})(

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

@ -41,7 +41,10 @@ class AddNewReleaseFormComponent extends React.Component {
supportedOsVersions: [],
application: null,
release: null,
deviceType: null
deviceType: null,
forbiddenErrors: {
supportedOsVersions: false
}
};
}
@ -63,10 +66,19 @@ class AddNewReleaseFormComponent extends React.Component {
});
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load supported OS versions.");
this.setState({
loading: false
});
handleApiError(error, "Error occurred while trying to load supported OS versions.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.supportedOsVersions = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -85,7 +97,7 @@ class AddNewReleaseFormComponent extends React.Component {
data.append("applicationRelease", blob);
const url = window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher +
"/applications/" + deviceType + "/ent-app/" + appId;
"/applications/" + deviceType + "/ent-app/" + appId;
axios.post(
url,
data
@ -122,14 +134,15 @@ class AddNewReleaseFormComponent extends React.Component {
};
render() {
const {loading, supportedOsVersions} = this.state;
const {loading, supportedOsVersions, forbiddenErrors} = this.state;
return (
<div>
<Spin tip="Uploading..." spinning={loading}>
<Row>
<Col span={17} offset={4} >
<Col span={17} offset={4}>
<Card>
<NewAppUploadForm
forbiddenErrors={forbiddenErrors}
formConfig={formConfig}
supportedOsVersions={supportedOsVersions}
onSuccessReleaseData={this.onSuccessReleaseData}

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

@ -18,11 +18,12 @@
import {notification} from "antd";
export const handleApiError = (error, message) => {
export const handleApiError = (error, message, isForbiddenMessageSilent = false) => {
if (error.hasOwnProperty("response") && error.response.status === 401) {
const redirectUrl = encodeURI(window.location.href);
window.location.href = window.location.origin + `/publisher/login?redirect=${redirectUrl}`;
} else {
// silence 403 forbidden message
} else if (!(isForbiddenMessageSilent && error.hasOwnProperty("response") && error.response.status === 403)) {
notification["error"]({
message: "There was a problem",
duration: 10,

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

@ -24,6 +24,7 @@ import ReleaseView from "../../../../components/apps/release/ReleaseView";
import LifeCycle from "../../../../components/apps/release/lifeCycle/LifeCycle";
import {withConfigContext} from "../../../../context/ConfigContext";
import {handleApiError} from "../../../../js/Utils";
import NewAppUploadForm from "../../../../components/new-app/subForms/NewAppUploadForm";
const {Title} = Typography;
@ -40,13 +41,19 @@ class Release extends React.Component {
release: null,
currentLifecycleStatus: null,
lifecycle: null,
supportedOsVersions:[]
supportedOsVersions: [],
forbiddenErrors: {
supportedOsVersions: false,
lifeCycle: false
}
};
}
componentDidMount() {
const {uuid} = this.props.match.params;
this.fetchData(uuid);
this.getLifecycle();
}
componentDidUpdate(prevProps, prevState, snapshot) {
@ -86,10 +93,8 @@ class Release extends React.Component {
loading: false,
uuid: uuid
});
if(config.deviceTypes.mobileTypes.includes(app.deviceType)){
if (config.deviceTypes.mobileTypes.includes(app.deviceType)) {
this.getSupportedOsVersions(app.deviceType);
}else{
this.getLifecycle();
}
}
@ -111,8 +116,15 @@ class Release extends React.Component {
})
}
}).catch(function (error) {
handleApiError(error, "Error occurred while trying to load lifecycle configuration.");
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load lifecycle configuration.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.lifeCycle = true;
this.setState({
forbiddenErrors
})
}
});
};
@ -125,21 +137,28 @@ class Release extends React.Component {
if (res.status === 200) {
let supportedOsVersions = JSON.parse(res.data.data);
this.setState({
supportedOsVersions,
loading: false,
supportedOsVersions
});
this.getLifecycle();
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load supported OS versions.");
this.setState({
loading: false
});
handleApiError(error, "Error occurred while trying to load supported OS versions.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.supportedOsVersions = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
render() {
const {app, release, currentLifecycleStatus, lifecycle, loading} = this.state;
const {app, release, currentLifecycleStatus, lifecycle, loading, forbiddenErrors} = this.state;
if (release == null && loading === false) {
return (
@ -159,12 +178,13 @@ class Release extends React.Component {
<Skeleton loading={loading} avatar={{size: 'large'}} active paragraph={{rows: 18}}>
{(release !== null) && (
<ReleaseView
forbiddenErrors={forbiddenErrors}
app={app}
release={release}
currentLifecycleStatus={currentLifecycleStatus}
lifecycle={lifecycle}
updateRelease={this.updateRelease}
supportedOsVersions = {[...this.state.supportedOsVersions]}
supportedOsVersions={[...this.state.supportedOsVersions]}
/>)
}
</Skeleton>

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

@ -50,7 +50,7 @@ class AppCard extends React.Component {
</Col>
<Col span={24} style={{paddingTop:10}}>
<Text className="app-name" strong level={4}>{app.name}</Text><br/>
<Text type="secondary" level={4}>{app.subMethod.toLowerCase()}</Text><br/>
<Text type="secondary" level={4}>{app.type.toLowerCase()}</Text><br/>
<StarRatings
rating={app.rating}
starRatedColor="#777"

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

@ -18,7 +18,7 @@
import React from "react";
import AppCard from "./AppCard";
import {Col, message, notification, Row, Result, Skeleton} from "antd";
import {Col, message, notification, Row, Result, Skeleton, Alert} from "antd";
import axios from "axios";
import {withConfigContext} from "../../context/ConfigContext";
import {handleApiError} from "../../js/Utils";
@ -28,7 +28,10 @@ class AppList extends React.Component {
super(props);
this.state = {
apps: [],
loading: true
loading: true,
forbiddenErrors: {
apps: false
}
}
}
@ -60,7 +63,7 @@ class AppList extends React.Component {
});
//send request to the invoker
axios.post(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/applications/",
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/applications/",
payload,
).then(res => {
if (res.status === 200) {
@ -73,18 +76,37 @@ class AppList extends React.Component {
}
}).catch((error) => {
handleApiError(error,"Error occurred while trying to load apps.");
this.setState({loading: false});
handleApiError(error, "Error occurred while trying to load apps.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.apps = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
render() {
const {apps,loading} = this.state;
const {apps, loading, forbiddenErrors} = this.state;
return (
<Skeleton loading={loading} active>
<Row gutter={16}>
{apps.length === 0 && (
{(forbiddenErrors.apps) && (
<Result
status="403"
title="403"
subTitle="You don't have permission to view apps."
// extra={<Button type="primary">Back Home</Button>}
/>
)}
{!((forbiddenErrors.apps)) && apps.length === 0 && (
<Result
status="404"
title="No apps, yet."

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

@ -27,7 +27,7 @@ import AppUninstallModal from "./install/AppUninstallModal";
import {withConfigContext} from "../../../context/ConfigContext";
import {handleApiError} from "../../../js/Utils";
import ReviewContainer from "./review/ReviewContainer";
import InstalledDevicesTable from "./InstalledDevicesTable";
import SubscriptionDetails from "./SubscriptionDetails";
const {Title, Text, Paragraph} = Typography;
const {TabPane} = Tabs;
@ -205,7 +205,7 @@ class ReleaseView extends React.Component {
<ReviewContainer uuid={release.uuid}/>
</TabPane>
<TabPane tab="Subscription Details" key="2">
<InstalledDevicesTable uuid={release.uuid}/>
<SubscriptionDetails uuid={release.uuid}/>
</TabPane>
</Tabs>
</div>

64
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/InstalledDevicesTable.js → components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/SubscriptionDetails.js vendored
View File

@ -18,7 +18,20 @@
import React from "react";
import axios from "axios";
import {Tag, message, notification, Table, Typography, Tooltip, Icon, Divider, Button, Modal, Select} from "antd";
import {
Tag,
message,
notification,
Table,
Typography,
Tooltip,
Icon,
Divider,
Button,
Modal,
Select,
Alert
} from "antd";
import TimeAgo from 'javascript-time-ago'
// Load locale-specific relative date/time formatting rules.
@ -53,7 +66,16 @@ const columns = [
title: 'Action',
dataIndex: 'action',
key: 'action',
render: action => action.toLowerCase()
render: action => {
action = action.toLowerCase();
let color = "fff";
if(action==="subscribed"){
color = "#6ab04c"
}else if(action === "unsubscribed"){
color = "#f0932b"
}
return <span style={{color:color}}>{action}</span>
}
},
{
title: 'Triggered By',
@ -128,7 +150,7 @@ const getTimeAgo = (time) => {
};
class InstalledDevicesTable extends React.Component {
class SubscriptionDetails extends React.Component {
constructor(props) {
super(props);
config = this.props.context;
@ -140,7 +162,8 @@ class InstalledDevicesTable extends React.Component {
selectedRows: [],
deviceGroups: [],
groupModalVisible: false,
selectedGroupId: []
selectedGroupId: [],
isForbidden: false
};
}
@ -171,18 +194,25 @@ class InstalledDevicesTable extends React.Component {
`/admin/subscription/${this.props.uuid}?` + encodedExtraParams,
).then(res => {
if (res.status === 200) {
const pagination = {...this.state.pagination};
console.log(res.data.data.data);
this.setState({
loading: false,
data: res.data.data.data,
pagination,
data: res.data.data.data
});
}
}).catch((error) => {
handleApiError(error, "Something went wrong when trying to load subscription data.");
this.setState({loading: false});
handleApiError(error, "Something went wrong when trying to load subscription data.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
this.setState({
isForbidden: true,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -190,11 +220,23 @@ class InstalledDevicesTable extends React.Component {
const {data, pagination, loading, selectedRows} = this.state;
return (
<div>
{(this.state.isForbidden) && (
<Alert
message="You don't have permission to view subscription details."
type="warning"
banner
closable/>
)}
<div style={{paddingBottom: 24}}>
<Text>
The following are the subscription details of the application in each respective device.
The following are the subscription details of the application in each respective device.
</Text>
</div>
<div style={{textAlign: "right", paddingBottom: 6}}>
<Button icon="sync" onClick={this.fetch}>
Refresh
</Button>
</div>
<Table
columns={columns}
rowKey={record => (record.device.deviceIdentifier + record.device.enrolmentInfo.owner + record.device.enrolmentInfo.ownership)}
@ -214,4 +256,4 @@ class InstalledDevicesTable extends React.Component {
}
}
export default withConfigContext(InstalledDevicesTable);
export default withConfigContext(SubscriptionDetails);

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

@ -18,7 +18,7 @@
import React from "react";
import axios from "axios";
import {Button, message, DatePicker, Table, Typography} from "antd";
import {Button, message, DatePicker, Table, Typography, Alert} from "antd";
import TimeAgo from 'javascript-time-ago'
// Load locale-specific relative date/time formatting rules.
@ -112,7 +112,8 @@ class DeviceInstall extends React.Component {
loading: false,
selectedRows: [],
scheduledTime: null,
isScheduledInstallVisible: false
isScheduledInstallVisible: false,
isForbidden: false
};
}
@ -169,8 +170,17 @@ class DeviceInstall extends React.Component {
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load devices.");
this.setState({loading: false});
handleApiError(error, "Error occurred while trying to load devices.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
this.setState({
isForbidden: true,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -209,6 +219,13 @@ class DeviceInstall extends React.Component {
Start installing the application for one or more users by entering the corresponding user name.
Select install to automatically start downloading the application for the respective user/users.
</Text>
{(this.state.isForbidden) && (
<Alert
message="You don't have permission to view devices."
type="warning"
banner
closable/>
)}
<Table
style={{paddingTop: 20}}
columns={columns}

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

@ -18,7 +18,7 @@
import React from "react";
import axios from "axios";
import {Button, Select, Table, Typography} from "antd";
import {Alert, Button, Select, Table, Typography} from "antd";
import TimeAgo from 'javascript-time-ago'
// Load locale-specific relative date/time formatting rules.
@ -109,7 +109,8 @@ class DeviceUninstall extends React.Component {
data: [],
pagination: {},
loading: false,
selectedRows: []
selectedRows: [],
isForbidden: false
};
}
@ -164,8 +165,17 @@ class DeviceUninstall extends React.Component {
});
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load devices.");
this.setState({loading: false});
handleApiError(error, "Error occurred while trying to load devices.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
this.setState({
isForbidden: true,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -204,6 +214,13 @@ class DeviceUninstall extends React.Component {
Start uninstalling the application for devices by selecting the corresponding devices.
Select uninstall to automatically start uninstalling the application for the respective devices.
</Text>
{(this.state.isForbidden) && (
<Alert
message="You don't have permission to view installed devices."
type="warning"
banner
closable/>
)}
<Table
style={{paddingTop: 20}}
columns={columns}

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

@ -17,7 +17,7 @@
*/
import React from "react";
import {Typography, Select, Spin, message, notification, Button} from "antd";
import {Typography, Select, Spin, message, notification, Button, Alert} from "antd";
import debounce from 'lodash.debounce';
import axios from "axios";
import {withConfigContext} from "../../../../context/ConfigContext";
@ -40,6 +40,7 @@ class GroupInstall extends React.Component {
data: [],
value: [],
fetching: false,
isForbidden: false
};
fetchUser = value => {
@ -67,8 +68,17 @@ class GroupInstall extends React.Component {
}
}).catch((error) => {
handleApiError(error,"Error occurred while trying to load groups.");
this.setState({fetching: false});
handleApiError(error,"Error occurred while trying to load groups.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
this.setState({
isForbidden: true,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -96,6 +106,13 @@ class GroupInstall extends React.Component {
return (
<div>
<Text>Start installing the application for one or more groups by entering the corresponding group name. Select install to automatically start downloading the application for the respective device group/ groups.</Text>
{(this.state.isForbidden) && (
<Alert
message="You don't have permission to view groups."
type="warning"
banner
closable/>
)}
<br/>
<br/>
<Select

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

@ -17,7 +17,7 @@
*/
import React from "react";
import {Typography, Select, Spin, message, notification, Button} from "antd";
import {Typography, Select, Spin, message, notification, Button, Alert} from "antd";
import debounce from 'lodash.debounce';
import axios from "axios";
import {withConfigContext} from "../../../../context/ConfigContext";
@ -39,6 +39,7 @@ class GroupUninstall extends React.Component {
data: [],
value: [],
fetching: false,
isForbidden: false
};
fetchUser = value => {
@ -50,9 +51,8 @@ class GroupUninstall extends React.Component {
const uuid = this.props.uuid;
axios.get(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store+ "/subscription/" + uuid + "/"+
"/GROUP?",
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/subscription/" + uuid + "/" +
"/GROUP?",
).then(res => {
if (res.status === 200) {
if (fetchId !== this.lastFetchId) {
@ -69,8 +69,17 @@ class GroupUninstall extends React.Component {
}
}).catch((error) => {
handleApiError(error,"Error occurred while trying to load groups.");
this.setState({fetching: false});
handleApiError(error, "Error occurred while trying to load groups.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
this.setState({
isForbidden: true,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -82,13 +91,13 @@ class GroupUninstall extends React.Component {
});
};
uninstall = (timestamp=null) =>{
uninstall = (timestamp = null) => {
const {value} = this.state;
const data = [];
value.map(val=>{
value.map(val => {
data.push(val.key);
});
this.props.onUninstall("group", data, "uninstall",timestamp);
this.props.onUninstall("group", data, "uninstall", timestamp);
};
render() {
@ -96,26 +105,35 @@ class GroupUninstall extends React.Component {
const {fetching, data, value} = this.state;
return (
<div>
<Text>Start uninstalling the application for one or more groups by entering the corresponding group name. Select uninstall to automatically start uninstalling the application for the respective device group/ groups.</Text>
<br/>
<br/>
<Select
mode="multiple"
labelInValue
value={value}
placeholder="Search groups"
notFoundContent={fetching ? <Spin size="small"/> : null}
filterOption={false}
onSearch={this.fetchUser}
onChange={this.handleChange}
style={{width: '100%'}}>
{data.map(d => (
<Option key={d.value}>{d.text}</Option>
))}
</Select>
<InstallModalFooter type="Uninstall" operation={this.uninstall} disabled={value.length===0}/>
</div>
<div>
<Text>Start uninstalling the application for one or more groups by entering the corresponding group
name. Select uninstall to automatically start uninstalling the application for the respective device
group/ groups.</Text>
{(this.state.isForbidden) && (
<Alert
message="You don't have permission to view installed groups."
type="warning"
banner
closable/>
)}
<br/>
<br/>
<Select
mode="multiple"
labelInValue
value={value}
placeholder="Search groups"
notFoundContent={fetching ? <Spin size="small"/> : null}
filterOption={false}
onSearch={this.fetchUser}
onChange={this.handleChange}
style={{width: '100%'}}>
{data.map(d => (
<Option key={d.value}>{d.text}</Option>
))}
</Select>
<InstallModalFooter type="Uninstall" operation={this.uninstall} disabled={value.length === 0}/>
</div>
);
}
}

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

@ -17,7 +17,7 @@
*/
import React from "react";
import {Typography, Select, Spin, message, notification, Button} from "antd";
import {Typography, Select, Spin, message, notification, Button, Alert} from "antd";
import debounce from 'lodash.debounce';
import axios from "axios";
import {withConfigContext} from "../../../../context/ConfigContext";
@ -40,6 +40,7 @@ class RoleInstall extends React.Component {
data: [],
value: [],
fetching: false,
isForbidden: false
};
fetchUser = value => {
@ -67,8 +68,17 @@ class RoleInstall extends React.Component {
}
}).catch((error) => {
handleApiError(error,"Error occurred while trying to load roles.");
this.setState({fetching: false});
handleApiError(error,"Error occurred while trying to load roles.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
this.setState({
isForbidden: true,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -96,6 +106,13 @@ class RoleInstall extends React.Component {
return (
<div>
<Text>Start installing the application for one or more roles by entering the corresponding role name. Select install to automatically start downloading the application for the respective user role/roles.</Text>
{(this.state.isForbidden) && (
<Alert
message="You don't have permission to view roles."
type="warning"
banner
closable/>
)}
<br/>
<br/>
<Select
@ -107,8 +124,7 @@ class RoleInstall extends React.Component {
filterOption={false}
onSearch={this.fetchUser}
onChange={this.handleChange}
style={{width: '100%'}}
>
style={{width: '100%'}}>
{data.map(d => (
<Option key={d.value}>{d.text}</Option>
))}

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

@ -17,7 +17,7 @@
*/
import React from "react";
import {Typography, Select, Spin, message, notification, Button} from "antd";
import {Typography, Select, Spin, message, notification, Button, Alert} from "antd";
import debounce from 'lodash.debounce';
import axios from "axios";
import {withConfigContext} from "../../../../context/ConfigContext";
@ -39,6 +39,7 @@ class RoleUninstall extends React.Component {
data: [],
value: [],
fetching: false,
isForbidden: false
};
fetchUser = value => {
@ -50,8 +51,8 @@ class RoleUninstall extends React.Component {
const uuid = this.props.uuid;
axios.get(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store+ "/subscription/" + uuid + "/"+
"/ROLE?",
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/subscription/" + uuid + "/" +
"/ROLE?",
).then(res => {
if (res.status === 200) {
if (fetchId !== this.lastFetchId) {
@ -68,53 +69,71 @@ class RoleUninstall extends React.Component {
}
}).catch((error) => {
handleApiError(error,"Error occurred while trying to load roles.");
this.setState({fetching: false});
handleApiError(error, "Error occurred while trying to load roles.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
this.setState({
isForbidden: true,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
handleChange = value => {
this.setState({
value,
data: [],
fetching: false,
});
value,
data: [],
fetching: false,
});
};
uninstall = (timestamp=null) =>{
uninstall = (timestamp = null) => {
const {value} = this.state;
const data = [];
value.map(val=>{
value.map(val => {
data.push(val.key);
});
this.props.onUninstall("role", data, "uninstall",timestamp);
this.props.onUninstall("role", data, "uninstall", timestamp);
};
render() {
const {fetching, data, value} = this.state;
return (
<div>
<Text>Start uninstalling the application for one or more roles by entering the corresponding role name. Select uninstall to automatically start uninstalling the application for the respective user role/roles.</Text>
<br/>
<br/>
<Select
mode="multiple"
labelInValue
value={value}
placeholder="Search roles"
notFoundContent={fetching ? <Spin size="small"/> : null}
filterOption={false}
onSearch={this.fetchUser}
onChange={this.handleChange}
style={{width: '100%'}}
>
{data.map(d => (
<Option key={d.value}>{d.text}</Option>
))}
</Select>
<InstallModalFooter type="Uninstall" operation={this.uninstall} disabled={value.length===0}/>
</div>
<div>
<Text>Start uninstalling the application for one or more roles by entering the corresponding role name.
Select uninstall to automatically start uninstalling the application for the respective user
role/roles.</Text>
{(this.state.isForbidden) && (
<Alert
message="You don't have permission to view uninstalled roles."
type="warning"
banner
closable/>
)}
<br/>
<br/>
<Select
mode="multiple"
labelInValue
value={value}
placeholder="Search roles"
notFoundContent={fetching ? <Spin size="small"/> : null}
filterOption={false}
onSearch={this.fetchUser}
onChange={this.handleChange}
style={{width: '100%'}}
>
{data.map(d => (
<Option key={d.value}>{d.text}</Option>
))}
</Select>
<InstallModalFooter type="Uninstall" operation={this.uninstall} disabled={value.length === 0}/>
</div>
);
}
}

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

@ -17,7 +17,7 @@
*/
import React from "react";
import {Typography, Select, Spin, message, notification, Button} from "antd";
import {Typography, Select, Spin, message, notification, Button, Alert} from "antd";
import debounce from 'lodash.debounce';
import axios from "axios";
import {withConfigContext} from "../../../../context/ConfigContext";
@ -69,8 +69,17 @@ class UserInstall extends React.Component {
}
}).catch((error) => {
handleApiError(error,"Error occurred while trying to load users.");
this.setState({fetching: false});
handleApiError(error,"Error occurred while trying to load users.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
this.setState({
isForbidden: true,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -79,6 +88,7 @@ class UserInstall extends React.Component {
value,
data: [],
fetching: false,
isForbidden: false
});
};
@ -97,6 +107,13 @@ class UserInstall extends React.Component {
return (
<div>
<Text>Start installing the application for one or more users by entering the corresponding user name. Select install to automatically start downloading the application for the respective user/users. </Text>
{(this.state.isForbidden) && (
<Alert
message="You don't have permission to view users."
type="warning"
banner
closable/>
)}
<p>Select users</p>
<Select
mode="multiple"

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

@ -17,7 +17,7 @@
*/
import React from "react";
import {Typography, Select, Spin, message, notification, Button} from "antd";
import {Typography, Select, Spin, message, notification, Button, Alert} from "antd";
import debounce from 'lodash.debounce';
import axios from "axios";
import {withConfigContext} from "../../../../context/ConfigContext";
@ -39,6 +39,7 @@ class UserUninstall extends React.Component {
data: [],
value: [],
fetching: false,
isForbidden: false
};
fetchUser = (value) => {
@ -67,8 +68,17 @@ class UserUninstall extends React.Component {
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load users.");
this.setState({fetching: false});
handleApiError(error, "Error occurred while trying to load users.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
this.setState({
isForbidden: true,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -97,6 +107,13 @@ class UserUninstall extends React.Component {
<Text>Start uninstalling the application for one or more users by entering the corresponding user name.
Select uninstall to automatically start uninstalling the application for the respective
user/users. </Text>
{(this.state.isForbidden) && (
<Alert
message="You don't have permission to view uninstalled users."
type="warning"
banner
closable/>
)}
<p>Select users</p>
<Select
mode="multiple"

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

@ -17,7 +17,7 @@
*/
import React from "react";
import {List, message, Typography, Empty, Button, Row, Col, notification} from "antd";
import {List, message, Typography, Empty, Button, Row, Col, notification, Alert} from "antd";
import SingleReview from "./singleReview/SingleReview";
import axios from "axios";
import AddReview from "./AddReview";
@ -34,52 +34,59 @@ class CurrentUsersReview extends React.Component {
return (
<div>
<Text>MY REVIEW</Text>
<div style={{
overflow: "auto",
paddingTop: 8,
paddingLeft: 24
}}>
{currentUserReviews.length > 0 && (
<div>
<List
dataSource={currentUserReviews}
renderItem={item => (
<List.Item key={item.id}>
<SingleReview
uuid={uuid}
review={item}
isDeletable={true}
isEditable={true}
deleteCallback={this.props.deleteCallback}
onUpdateReview={this.props.onUpdateReview}
isPersonalReview={true}/>
</List.Item>
)}
>
</List>
</div>
)}
{(this.props.forbidden) && (
<Alert
message="You don't have permission to add reviews."
type="warning"
banner
closable/>
)}
{(!this.props.forbidden) && (
<div style={{
overflow: "auto",
paddingTop: 8,
paddingLeft: 24
}}>
{currentUserReviews.length > 0 && (
<div>
<List
dataSource={currentUserReviews}
renderItem={item => (
<List.Item key={item.id}>
<SingleReview
uuid={uuid}
review={item}
isDeletable={true}
isEditable={true}
deleteCallback={this.props.deleteCallback}
onUpdateReview={this.props.onUpdateReview}
isPersonalReview={true}/>
</List.Item>
)}
>
</List>
</div>
)}
{currentUserReviews.length === 0 && (
<div>
<Empty
image={Empty.PRESENTED_IMAGE_DEFAULT}
imagestyle={{
height: 60,
}}
description={
<span>Share your experience with your community by adding a review.</span>
}
>
{/*<Button type="primary">Add review</Button>*/}
<AddReview
uuid={uuid}
onUpdateReview={this.props.onUpdateReview}/>
</Empty>
</div>
)}
</div>
{currentUserReviews.length === 0 && (
<div>
<Empty
image={Empty.PRESENTED_IMAGE_DEFAULT}
imagestyle={{
height: 60,
}}
description={
<span>Share your experience with your community by adding a review.</span>
}>
{/*<Button type="primary">Add review</Button>*/}
<AddReview
uuid={uuid}
onUpdateReview={this.props.onUpdateReview}/>
</Empty>
</div>
)}
</div>
)}
</div>
);
}

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

@ -32,7 +32,12 @@ class ReviewContainer extends React.Component {
super(props);
this.state = {
currentUserReviews: [],
detailedRating: null
detailedRating: null,
forbiddenErrors: {
currentReview: false,
reviews: false,
rating: false
}
}
}
@ -54,7 +59,19 @@ class ReviewContainer extends React.Component {
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to get your review.");
handleApiError(error, "Error occurred while trying to get your review.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.currentReview = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -79,7 +96,7 @@ class ReviewContainer extends React.Component {
}
}).catch(function (error) {
handleApiError(error, "Error occurred while trying to load ratings.");
handleApiError(error, "Error occurred while trying to load ratings.", true);
});
};
@ -90,10 +107,11 @@ class ReviewContainer extends React.Component {
render() {
const {uuid} = this.props;
const {currentUserReviews,detailedRating} = this.state;
const {currentUserReviews,detailedRating, forbiddenErrors} = this.state;
return (
<div>
<CurrentUsersReview
forbidden={forbiddenErrors.currentReview}
uuid={uuid}
currentUserReviews={currentUserReviews}
onUpdateReview={this.onUpdateReview}

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

@ -17,7 +17,7 @@
*/
import React from "react";
import {List, message, Avatar, Spin, Button, notification} from 'antd';
import {List, message, Avatar, Spin, Button, notification, Alert} from 'antd';
import "./Reviews.css";
import InfiniteScroll from 'react-infinite-scroller';
@ -33,7 +33,10 @@ class Reviews extends React.Component {
data: [],
loading: false,
hasMore: false,
loadMore: false
loadMore: false,
forbiddenErrors: {
reviews: false
}
};
@ -51,7 +54,7 @@ class Reviews extends React.Component {
const config = this.props.context;
axios.get(
window.location.origin+ config.serverConfig.invoker.uri +config.serverConfig.invoker.store+"/reviews/"+type+"/"+uuid,
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/" + type + "/" + uuid,
{
headers: {'X-Platform': config.serverConfig.platform}
}).then(res => {
@ -60,8 +63,20 @@ class Reviews extends React.Component {
callback(reviews);
}
}).catch(function (error) {
handleApiError(error,"Error occurred while trying to load reviews.");
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load reviews.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.reviews = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -101,7 +116,7 @@ class Reviews extends React.Component {
});
};
deleteCallback = () =>{
deleteCallback = () => {
this.fetchData(0, limit, res => {
this.setState({
data: res,
@ -114,30 +129,40 @@ class Reviews extends React.Component {
const {loading, hasMore, data, loadMore} = this.state;
const {uuid} = this.props;
return (
<div className="infinite-container">
<InfiniteScroll
initialLoad={false}
pageStart={0}
loadMore={this.handleInfiniteOnLoad}
hasMore={!loading && hasMore}
useWindow={true}>
<List
dataSource={data}
renderItem={item => (
<List.Item key={item.id}>
<SingleReview uuid={uuid} review={item} isDeletable={true} isEditable={false} deleteCallback={this.deleteCallback}/>
</List.Item>
)}>
{loading && hasMore && (
<div className="loading-container">
<Spin/>
</div>
)}
</List>
</InfiniteScroll>
{!loadMore && (data.length >= limit) && (<div style={{textAlign: "center"}}>
<Button type="dashed" htmlType="button" onClick={this.enableLoading}>Read All Reviews</Button>
</div>)}
<div>
{(this.state.forbiddenErrors.reviews) && (
<Alert
message="You don't have permission to view reviews."
type="warning"
banner
closable/>
)}
<div className="infinite-container">
<InfiniteScroll
initialLoad={false}
pageStart={0}
loadMore={this.handleInfiniteOnLoad}
hasMore={!loading && hasMore}
useWindow={true}>
<List
dataSource={data}
renderItem={item => (
<List.Item key={item.id}>
<SingleReview uuid={uuid} review={item} isDeletable={true} isEditable={false}
deleteCallback={this.deleteCallback}/>
</List.Item>
)}>
{loading && hasMore && (
<div className="loading-container">
<Spin/>
</div>
)}
</List>
</InfiniteScroll>
{!loadMore && (data.length >= limit) && (<div style={{textAlign: "center"}}>
<Button type="dashed" htmlType="button" onClick={this.enableLoading}>Read All Reviews</Button>
</div>)}
</div>
</div>
);
}

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

@ -18,14 +18,15 @@
import {notification} from "antd";
export const handleApiError = (error, message) => {
export const handleApiError = (error, message, isForbiddenMessageSilent = false) => {
if (error.hasOwnProperty("response") && error.response.status === 401) {
const redirectUrl = encodeURI(window.location.href);
window.location.href = window.location.origin + `/store/login?redirect=${redirectUrl}`;
} else {
// silence 403 forbidden message
} else if (!(isForbiddenMessageSilent && error.hasOwnProperty("response") && error.response.status === 403)) {
notification["error"]({
message: "There was a problem",
duration: 2,
duration: 10,
description: message,
});
}

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

@ -17,7 +17,8 @@
*/
import React from "react";
import {Layout, Menu, Icon, Drawer, Button} from 'antd';
import {Layout, Menu, Icon, Drawer, Button, Alert} from 'antd';
const {Header, Content, Footer} = Layout;
import {Link} from "react-router-dom";
import RouteWithSubRoutes from "../../components/RouteWithSubRoutes";
@ -38,7 +39,10 @@ class Dashboard extends React.Component {
selectedKeys: [],
deviceTypes: [],
visible: false,
collapsed: false
collapsed: false,
forbiddenErrors: {
deviceTypes: false
}
};
this.logo = this.props.context.theme.logo;
this.config = this.props.context;
@ -62,10 +66,19 @@ class Dashboard extends React.Component {
}
}).catch((error) => {
handleApiError(error,"Error occurred while trying to load device types.");
this.setState({
loading: false
});
handleApiError(error, "Error occurred while trying to load device types.", true);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.deviceTypes = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};
@ -81,7 +94,7 @@ class Dashboard extends React.Component {
collapsed: !this.state.collapsed,
});
};
onCloseMobileNavigationBar = () => {
this.setState({
visible: false,
@ -90,7 +103,7 @@ class Dashboard extends React.Component {
render() {
const config = this.props.context;
const {selectedKeys, deviceTypes} = this.state;
const {selectedKeys, deviceTypes, forbiddenErrors} = this.state;
const DeviceTypesData = deviceTypes.map((deviceType) => {
const platform = deviceType.name;
@ -116,7 +129,7 @@ class Dashboard extends React.Component {
<Layout>
<Header style={{paddingLeft: 0, paddingRight: 0, backgroundColor: "white"}}>
<div className="logo-image">
<Link to="/store/android"><img alt="logo" src={this.logo}/></Link>
<Link to="/store"><img alt="logo" src={this.logo}/></Link>
</div>
<div className="web-layout">
@ -131,7 +144,7 @@ class Dashboard extends React.Component {
<Menu.Item key="web-clip">
<Link to="/store/web-clip">
<Icon type="upload"/>
Web Clips
Web Clips
</Link>
</Menu.Item>
@ -140,7 +153,7 @@ class Dashboard extends React.Component {
<span className="submenu-title-wrapper">
<Icon type="user"/>
{this.config.user}
</span> }>
</span>}>
<Logout/>
</SubMenu>
</Menu>
@ -156,32 +169,32 @@ class Dashboard extends React.Component {
</Button>
</div>
</Layout>
<Drawer
title={<Link to="/store/android" onClick={this.onCloseMobileNavigationBar}>
<img alt="logo" src={this.logo} style={{marginLeft: 30}} width={"60%"}/>
</Link>}
placement="left"
closable={false}
onClose={this.onCloseMobileNavigationBar}
visible={this.state.visible}
getContainer={false}
style={{position: 'absolute'}}>
<Menu
theme="light"
mode="inline"
defaultSelectedKeys={selectedKeys}
style={{lineHeight: '64px', width: 231}}
onClick={this.onCloseMobileNavigationBar}>
<Drawer
title={<Link to="/store" onClick={this.onCloseMobileNavigationBar}>
<img alt="logo" src={this.logo} style={{marginLeft: 30}} width={"60%"}/>
</Link>}
placement="left"
closable={false}
onClose={this.onCloseMobileNavigationBar}
visible={this.state.visible}
getContainer={false}
style={{position: 'absolute'}}>
<Menu
theme="light"
mode="inline"
defaultSelectedKeys={selectedKeys}
style={{lineHeight: '64px', width: 231}}
onClick={this.onCloseMobileNavigationBar}>
{DeviceTypesData}
{DeviceTypesData}
<Menu.Item key="web-clip">
<Link to="/store/web-clip">
<Menu.Item key="web-clip">
<Link to="/store/web-clip">
<Icon type="upload"/>Web Clips
</Link>
</Menu.Item>
</Menu>
</Drawer>
</Link>
</Menu.Item>
</Menu>
</Drawer>
<Layout className="mobile-layout">
<Menu
mode="horizontal"
@ -198,6 +211,13 @@ class Dashboard extends React.Component {
</Layout>
<Layout className="dashboard-body">
{(forbiddenErrors.deviceTypes) && (
<Alert
message="You don't have permission to view device types."
type="warning"
banner
closable/>
)}
<Content style={{padding: '0 0'}}>
<Switch>
{this.state.routes.map((route) => (

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

@ -36,7 +36,10 @@ class Release extends React.Component {
this.state = {
loading: true,
app: null,
uuid: null
uuid: null,
forbiddenErrors: {
app: false
}
};
}
@ -72,8 +75,19 @@ class Release extends React.Component {
}
}).catch((error) => {
handleApiError(error,"Error occurred while trying to load releases.");
this.setState({loading: false});
handleApiError(error,"Error occurred while trying to load releases.", false);
if (error.hasOwnProperty("response") && error.response.status === 403) {
const {forbiddenErrors} = this.state;
forbiddenErrors.app = true;
this.setState({
forbiddenErrors,
loading: false
})
} else {
this.setState({
loading: false
});
}
});
};