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' into 'application-mgt-new'

Browse Source 
Add UI improvements to APPM UI

See merge request entgra/carbon-device-mgt!331
This commit is contained in:
Inosh Perara 2019-10-19 16:50:03 +00:00
commit 7477c4052b
13 changed files with 196 additions and 195 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -15,11 +15,15 @@
"acorn": "^6.2.0",
"antd": "^3.23.6",
"axios": "^0.19.0",
"babel-eslint": "^9.0.0",
"d3": "^5.9.7",
"dagre": "^0.8.4",
"eslint": "^5.16.0",
"eslint-plugin-import": "^2.18.2",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-react": "^7.16.0",
"fetch": "^1.1.0",
"gapi": "0.0.3",
"gapi-client": "0.0.3",
"imagemin": "^6.1.0",
"keymirror": "^0.1.1",
"rc-tween-one": "^2.4.1",
"react-d3-graph": "^2.1.0",
@ -34,7 +38,8 @@
"react-star-ratings": "^2.3.0",
"redux-thunk": "^2.3.0",
"shade-blend-color": "^1.0.0",
"storm-react-diagrams": "^5.2.1"
"storm-react-diagrams": "^5.2.1",
"typescript": "^3.6.4"
},
"devDependencies": {
"@babel/core": "^7.5.0",

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

@ -64,6 +64,7 @@ class App extends React.Component {
}
componentDidMount() {
this.updateFavicon();
axios.get(
window.location.origin + "/publisher/public/conf/config.json",
).then(res => {
@ -130,6 +131,14 @@ class App extends React.Component {
});
};
updateFavicon = () =>{
const link = document.querySelector("link[rel*='icon']") || document.createElement('link');
link.type = 'image/x-icon';
link.rel = 'shortcut icon';
link.href = window.location.origin+'/devicemgt/public/uuf.unit.favicon/img/favicon.png';
document.getElementsByTagName('head')[0].appendChild(link);
};
render() {
const {loading, error} = this.state;

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

@ -57,10 +57,10 @@ class ListApps extends React.Component {
return (
<Card>
<Row gutter={28}>
<Col md={7}>
<Col md={6}>
<Filters setFilters={this.setFilters}/>
</Col>
<Col md={17}>
<Col md={18}>
<Row>
<Col span={6}>
<Title level={4}>Apps</Title>

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

@ -34,6 +34,7 @@ import {
Select
} from 'antd';
import axios from "axios";
import "@babel/polyfill";
import {withConfigContext} from "../../../../context/ConfigContext";
const {TextArea} = Input;
@ -59,7 +60,7 @@ function getBase64(file) {
}
class EditReleaseModal extends React.Component {
// To add subscription type & tenancy sharing, refer https://gitlab.com/entgra/carbon-device-mgt/merge_requests/331
constructor(props) {
super(props);
this.state = {
@ -162,12 +163,6 @@ class EditReleaseModal extends React.Component {
},
releaseDescription: {
value: release.description
},
price: {
value: release.price
},
isSharedWithAllTenants: {
value: release.isSharedWithAllTenants
}
});
@ -252,7 +247,7 @@ class EditReleaseModal extends React.Component {
this.setState({
loading: true
});
const {price, isSharedWithAllTenants, releaseDescription, releaseType} = values;
const {releaseDescription, releaseType} = values;
const {icons, screenshots, binaryFiles} = this.state;
@ -261,8 +256,8 @@ class EditReleaseModal extends React.Component {
//add release data
const release = {
description: releaseDescription,
price: (price === undefined) ? 0 : parseInt(price),
isSharedWithAllTenants,
price: 0,
isSharedWithAllTenants: false,
metaData: JSON.stringify(this.state.metaData),
releaseType: releaseType,
};
@ -282,10 +277,6 @@ class EditReleaseModal extends React.Component {
if (specificElements.hasOwnProperty("url")) {
release.url = values.url;
}
//
// if (specificElements.hasOwnProperty("packageName")) {
// release.packageName = values.packageName;
// }
if (icons.length === 1) {
data.append('icon', icons[0].originFileObj);
@ -589,30 +580,6 @@ class EditReleaseModal extends React.Component {
)}
</Form.Item>
)}
<Form.Item {...formItemLayout} label="Price">
{getFieldDecorator('price', {
rules: [{
required: false
}],
})(
<Input prefix="$" placeholder="00.00"/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Is Shared?">
{getFieldDecorator('isSharedWithAllTenants', {
rules: [{
required: true,
message: 'Please select'
}],
initialValue: false
})(
<Switch checkedChildren={<Icon type="check"/>}
unCheckedChildren={<Icon type="close"/>}
/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Meta Data">
{getFieldDecorator('meta', {
rules: [{

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

@ -91,8 +91,8 @@ class NewAppUploadForm extends React.Component {
//add release data
const release = {
description: releaseDescription,
price: (price === undefined) ? 0 : parseInt(price),
isSharedWithAllTenants,
price: 0,
isSharedWithAllTenants: false,
metaData: JSON.stringify(this.state.metaData),
releaseType: releaseType
};
@ -405,7 +405,12 @@ class NewAppUploadForm extends React.Component {
label="Supported OS Versions"
validateStatus={osVersionsValidateStatus}
help={osVersionsHelperText}>
{getFieldDecorator('supportedOS')(
{getFieldDecorator('supportedOS', {
rules: [{
required: true
}],
initialValue: false
})(
<div>
<InputGroup>
<Row gutter={8}>
@ -428,7 +433,14 @@ class NewAppUploadForm extends React.Component {
<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}>
@ -443,49 +455,6 @@ class NewAppUploadForm extends React.Component {
)}
</Form.Item>
)}
<Form.Item {...formItemLayout} label="Price Type">
{getFieldDecorator('select', {
rules: [{required: true, message: 'Please select price Type'}],
})(
<Select
placeholder="Please select a price type"
onChange={this.handlePriceTypeChange}>
<Option value="free">Free</Option>
<Option value="paid">Paid</Option>
</Select>,
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Price">
{getFieldDecorator('price', {
rules: [{
required: !isFree
}],
})(
<InputNumber
disabled={isFree}
options={{
initialValue: 1
}}
min={0}
max={10000}
formatter={value => `$ ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')}
parser={value => value.replace(/\$\s?|(,*)/g, '')}
/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Is Shared?">
{getFieldDecorator('isSharedWithAllTenants', {
rules: [{
required: true,
message: 'Please select'
}],
initialValue: false
})(
<Switch checkedChildren={<Icon type="check"/>}
unCheckedChildren={<Icon type="close"/>}
/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Meta Data">
{getFieldDecorator('meta', {})(
<div>

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

@ -64,6 +64,7 @@ class App extends React.Component {
}
componentDidMount() {
this.updateFavicon();
axios.get(
window.location.origin + "/store/public/conf/config.json",
).then(res => {
@ -77,6 +78,14 @@ class App extends React.Component {
});
}
updateFavicon = () =>{
const link = document.querySelector("link[rel*='icon']") || document.createElement('link');
link.type = 'image/x-icon';
link.rel = 'shortcut icon';
link.href = window.location.origin+'/devicemgt/public/uuf.unit.favicon/img/favicon.png';
document.getElementsByTagName('head')[0].appendChild(link);
};
checkUserLoggedIn = (config) => {
axios.post(
window.location.origin + "/store-ui-request-handler/user",

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

@ -29,46 +29,9 @@ const { Text } = Typography;
class DetailedRating extends React.Component{
constructor(props){
super(props);
this.state={
detailedRating: null
}
}
componentDidMount() {
const {type,uuid} = this.props;
this.getData(type,uuid);
}
componentDidUpdate(prevProps, prevState) {
if (prevProps.uuid !== this.props.uuid) {
const {type,uuid} = this.props;
this.getData(type,uuid);
}
}
getData = (type, uuid)=>{
const config = this.props.context;
return axios.get(
window.location.origin+ config.serverConfig.invoker.uri +config.serverConfig.invoker.store+"/reviews/"+uuid+"/"+type+"-rating",
).then(res => {
if (res.status === 200) {
let detailedRating = res.data.data;
this.setState({
detailedRating
})
}
}).catch(function (error) {
handleApiError(error,"Error occurred while trying to load ratings.");
});
};
render() {
const detailedRating = this.state.detailedRating;
const {detailedRating} = this.props;
if(detailedRating ==null){
return null;

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

@ -29,6 +29,7 @@ import AppUninstallModal from "./install/AppUninstallModal";
import CurrentUsersReview from "./review/CurrentUsersReview";
import {withConfigContext} from "../../../context/ConfigContext";
import {handleApiError} from "../../../js/Utils";
import ReviewContainer from "./review/ReviewContainer";
const {Title, Text, Paragraph} = Typography;
@ -193,15 +194,7 @@ class ReleaseView extends React.Component {
{(metaData.length === 0) && (<Text type="secondary">No meta data available.</Text>)}
</Row>
<Divider/>
<CurrentUsersReview uuid={release.uuid}/>
<Divider dashed={true}/>
<Text>REVIEWS</Text>
<Row>
<Col lg={18} md={24}>
<DetailedRating type="app" uuid={release.uuid}/>
</Col>
</Row>
<Reviews type="app" uuid={release.uuid}/>
<ReviewContainer uuid={release.uuid}/>
</div>
</div>
);

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

@ -86,10 +86,7 @@ class AddReview extends React.Component {
description:
'Your review has been posted successfully.',
});
setTimeout(() => {
window.location.href = uuid;
}, 2000)
this.props.onUpdateReview();
} else {
this.setState({
loading: false,

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

@ -28,48 +28,9 @@ const {Text, Paragraph} = Typography;
class CurrentUsersReview extends React.Component {
constructor(props) {
super(props);
this.state = {
data: []
};
}
componentDidMount() {
this.fetchData();
}
fetchData = () => {
const {uuid} = this.props;
const config = this.props.context;
axios.get(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/app/user/" + uuid,
).then(res => {
if (res.status === 200) {
const data = res.data.data.data;
this.setState({data});
}
}).catch((error) => {
handleApiError(error,"Error occurred while trying to get your review.");
});
};
deleteCallback = () =>{
this.setState({
data: []
});
};
addCallBack =(review) =>{
};
render() {
const {data} = this.state;
const {uuid} = this.props;
const {uuid, currentUserReviews} = this.props;
return (
<div>
<Text>MY REVIEW</Text>
@ -78,13 +39,20 @@ class CurrentUsersReview extends React.Component {
paddingTop: 8,
paddingLeft: 24
}}>
{data.length > 0 && (
{currentUserReviews.length > 0 && (
<div>
<List
dataSource={data}
dataSource={currentUserReviews}
renderItem={item => (
<List.Item key={item.id}>
<SingleReview uuid={uuid} review={item} isDeletable={true} isEditable={true} deleteCallback={this.deleteCallback} isPersonalReview={true}/>
<SingleReview
uuid={uuid}
review={item}
isDeletable={true}
isEditable={true}
deleteCallback={this.props.deleteCallback}
onUpdateReview={this.props.onUpdateReview}
isPersonalReview={true}/>
</List.Item>
)}
>
@ -92,7 +60,7 @@ class CurrentUsersReview extends React.Component {
</div>
)}
{data.length === 0 && (
{currentUserReviews.length === 0 && (
<div>
<Empty
image={Empty.PRESENTED_IMAGE_DEFAULT}
@ -104,7 +72,9 @@ class CurrentUsersReview extends React.Component {
}
>
{/*<Button type="primary">Add review</Button>*/}
<AddReview uuid={uuid}/>
<AddReview
uuid={uuid}
onUpdateReview={this.props.onUpdateReview}/>
</Empty>
</div>
)}

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

@ -0,0 +1,119 @@
/*
* Copyright (c) 2019, Entgra (pvt) Ltd. (http://entgra.io) All Rights Reserved.
*
* Entgra (pvt) Ltd. licenses this file to you under the Apache License,
* Version 2.0 (the "License"); you may not use this file except
* in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
import React from "react";
import CurrentUsersReview from "./CurrentUsersReview";
import {Col, Divider, Row, Typography} from "antd";
import DetailedRating from "../DetailedRating";
import Reviews from "./Reviews";
import axios from "axios";
import {handleApiError} from "../../../../js/Utils";
import {withConfigContext} from "../../../../context/ConfigContext";
const {Text} = Typography;
class ReviewContainer extends React.Component {
constructor(props) {
super(props);
this.state = {
currentUserReviews: [],
detailedRating: null
}
}
componentDidMount() {
this.fetchCurrentUserReviews();
this.fetchDetailedRating("app", this.props.uuid);
}
fetchCurrentUserReviews = () => {
const {uuid} = this.props;
const config = this.props.context;
axios.get(
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/app/user/" + uuid,
).then(res => {
if (res.status === 200) {
const currentUserReviews = res.data.data.data;
this.setState({currentUserReviews});
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to get your review.");
});
};
deleteCurrentUserReviewCallback = () => {
this.setState({
currentUserReviews: []
});
this.fetchDetailedRating("app", this.props.uuid);
};
fetchDetailedRating = (type, uuid) => {
const config = this.props.context;
axios.get(
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/" + uuid + "/" + type + "-rating",
).then(res => {
if (res.status === 200) {
let detailedRating = res.data.data;
this.setState({
detailedRating
})
}
}).catch(function (error) {
handleApiError(error, "Error occurred while trying to load ratings.");
});
};
onUpdateReview = () => {
this.fetchCurrentUserReviews();
this.fetchDetailedRating("app", this.props.uuid);
};
render() {
const {uuid} = this.props;
const {currentUserReviews,detailedRating} = this.state;
return (
<div>
<CurrentUsersReview
uuid={uuid}
currentUserReviews={currentUserReviews}
onUpdateReview={this.onUpdateReview}
deleteCallback={this.deleteCurrentUserReviewCallback}/>
<Divider dashed={true}/>
<Text>REVIEWS</Text>
<Row>
<Col lg={18} md={24}>
<DetailedRating
type="app"
detailedRating={detailedRating}/>
</Col>
</Row>
<Reviews
type="app"
uuid={uuid}
deleteCallback={this.onUpdateReview}/>
</div>
)
}
}
export default withConfigContext(ReviewContainer);

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

@ -107,6 +107,7 @@ class Reviews extends React.Component {
data: res,
});
});
this.props.deleteCallback();
};
render() {
@ -119,16 +120,14 @@ class Reviews extends React.Component {
pageStart={0}
loadMore={this.handleInfiniteOnLoad}
hasMore={!loading && hasMore}
useWindow={true}
>
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/>

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

@ -52,6 +52,7 @@ class SingleReview extends React.Component {
this.setState({
review
});
this.props.onUpdateReview();
};
deleteReview = () => {