From c62207f60595e938088e68b1ee496e7975e0ffaa Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Wed, 26 Jun 2019 13:59:25 +0530 Subject: [PATCH 1/2] Add twitter emojis to reviews --- .../react-app/package.json | 1 + .../components/apps/release/review/Reviews.css | 7 +++++++ .../apps/release/review/SingleReview.js | 18 ++++++++++++------ 3 files changed, 20 insertions(+), 6 deletions(-) diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/package.json b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/package.json index 6b4aba3fbd5..24acd03ce48 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/package.json +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/package.json @@ -30,6 +30,7 @@ "react-router-dom": "latest", "react-scripts": "2.1.8", "react-star-ratings": "^2.3.0", + "react-twemoji": "^0.2.3", "react-virtualized": "^9.21.1", "reqwest": "^2.0.5", "storm-react-diagrams": "^5.2.1" diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.css b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.css index 8678c638919..f77c5a31376 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.css +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.css @@ -13,4 +13,11 @@ position: absolute; bottom: -40px; left: 50%; +} + +img.twemoji { + height: 1em; + width: 1em; + margin: 0 .05em 0 .1em; + vertical-align: -0.1em; } \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/SingleReview.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/SingleReview.js index 3834b3ff2e3..d76bb00ed26 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/SingleReview.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/SingleReview.js @@ -1,10 +1,12 @@ import React from "react"; import {Avatar} from "antd"; -import {List,Typography} from "antd"; +import {List, Typography} from "antd"; import StarRatings from "react-star-ratings"; +import Twemoji from "react-twemoji"; +import "./Reviews.css"; const {Text, Paragraph} = Typography; -const colorList = ['#f0932b','#badc58','#6ab04c','#eb4d4b','#0abde3', '#9b59b6','#3498db','#22a6b3']; +const colorList = ['#f0932b', '#badc58', '#6ab04c', '#eb4d4b', '#0abde3', '#9b59b6', '#3498db', '#22a6b3']; class SingleReview extends React.Component { @@ -17,13 +19,17 @@ class SingleReview extends React.Component { {review.createdAt}
- {review.content} + + + {review.content} + + ); @@ -31,7 +37,7 @@ class SingleReview extends React.Component {
+ {avatarLetter} } From 3e3d8fe1acdf470121714f3365a206e02695ce38 Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Wed, 26 Jun 2019 22:26:51 +0530 Subject: [PATCH 2/2] Fix app install functionaity in APPM UI --- .../src/components/apps/release/LifeCycle.js | 56 --------- .../components/apps/release/LifeCycleGraph.js | 117 ------------------ .../components/apps/release/LifecycleModal.js | 111 ----------------- .../react-app/public/conf/config.json | 3 +- .../components/apps/release/ReleaseView.js | 20 ++- .../apps/release/install/DeviceInstall.js | 6 +- .../apps/release/install/GroupInstall.js | 14 +-- .../apps/release/install/RoleInstall.js | 14 +-- .../apps/release/install/UserInstall.js | 2 +- 9 files changed, 27 insertions(+), 316 deletions(-) delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/LifeCycle.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/LifeCycleGraph.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/LifecycleModal.js diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/LifeCycle.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/LifeCycle.js deleted file mode 100644 index 485ff30e29b..00000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/LifeCycle.js +++ /dev/null @@ -1,56 +0,0 @@ -import React from "react"; -import LifeCycleGraph from "./LifeCycleGraph"; -import {connect} from "react-redux"; -import {getLifecycle, openLifecycleModal} from "../../../js/actions"; -import {Button} from "antd"; -import LifecycleModal from "./LifecycleModal"; - -const mapDispatchToProps = dispatch => ({ - getLifecycle: () => dispatch(getLifecycle()), - openLifecycleModal: (nextState) => dispatch(openLifecycleModal(nextState)) -}); - -const mapStateToProps = state => { - return { - lifecycle: state.lifecycle, - currentStatus : state.release.currentStatus.toUpperCase(), - uuid : state.release.uuid - }; -}; - -class ConnectedLifeCycle extends React.Component { - - constructor(props){ - super(props); - - this.openModal = this.openModal.bind(this); - } - - componentDidMount() { - this.props.getLifecycle(); - } - - openModal() { - this.props.openLifecycleModal("IN_REVIEW"); - } - - render() { - const lifecycle = this.props.lifecycle; - if (lifecycle != null) { - return ( -
- - - -
- ); - - } else { - return null; - } - } -} - -const LifeCycle = connect(mapStateToProps, mapDispatchToProps)(ConnectedLifeCycle); - -export default LifeCycle; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/LifeCycleGraph.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/LifeCycleGraph.js deleted file mode 100644 index dd22c00eb48..00000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/LifeCycleGraph.js +++ /dev/null @@ -1,117 +0,0 @@ -import React from "react"; -import {Graph} from 'react-d3-graph'; -import {connect} from "react-redux"; -import {getLifecycle, openLifecycleModal} from "../../../js/actions"; - -const mapDispatchToProps = dispatch => ({ - openLifecycleModal: (nextState) => dispatch(openLifecycleModal(nextState)) -}); - -// the graph configuration, you only need to pass down properties -// that you want to override, otherwise default ones will be used -const myConfig = { - nodeHighlightBehavior: true, - directed: true, - height: 400, - d3: { - alphaTarget: 0.05, - gravity: -200, - linkLength: 200, - linkStrength: 1 - }, - node: { - color: "#d3d3d3", - fontColor: "black", - fontSize: 12, - fontWeight: "normal", - highlightFontSize: 12, - highlightFontWeight: "bold", - highlightStrokeColor: "SAME", - highlightStrokeWidth: 1.5, - labelProperty: "id", - mouseCursor: "pointer", - opacity: 1, - strokeColor: "none", - strokeWidth: 1.5, - svg: "", - symbolType: "circle", - }, - link: { - highlightColor: 'lightblue' - } -}; - - - -class ConnectedLifeCycleGraph extends React.Component { - - - constructor(props){ - super(props); - this.nextStates = null; - this.onClickNode = this.onClickNode.bind(this); - } - - onClickNode = function(nodeId) { - const nextStates = this.nextStates; - if(nextStates.includes(nodeId)){ - this.props.openLifecycleModal(nodeId); - } - }; - - render() { -// graph payload (with minimalist structure) - - const lifecycle = this.props.lifecycle; - const nodes = []; - const links = []; - this.nextStates = lifecycle[this.props.currentStatus].proceedingStates; - - - Object.keys(lifecycle).forEach((stateName) => { - const state = lifecycle[stateName]; - let color = "rgb(83, 92, 104)"; - if (stateName === this.props.currentStatus) { - color = "rgb(39, 174, 96)"; - } else if (this.nextStates.includes(stateName)) { - color = "rgb(0,192,255)"; - } - let node = { - id: stateName, - color: color - }; - nodes.push(node); - - //todo: remove checking property - if (state.hasOwnProperty("proceedingStates")) { - state.proceedingStates.forEach((proceedingState) => { - let link = { - source: stateName, - target: proceedingState - }; - links.push(link); - }); - } - }); - - const data = { - nodes: nodes, - links: links - }; - - - return ( -
- -
- ); - } -} - -const LifeCycleGraph = connect(null,mapDispatchToProps)(ConnectedLifeCycleGraph); -export default LifeCycleGraph; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/LifecycleModal.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/LifecycleModal.js deleted file mode 100644 index df239546e3e..00000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/LifecycleModal.js +++ /dev/null @@ -1,111 +0,0 @@ -import React from "react"; -import {Modal, Typography, Icon, Input, Form, Checkbox, Button} from 'antd'; -import {connect} from 'react-redux'; -import {closeLifecycleModal, updateLifecycleState} from "../../../js/actions"; - -const { TextArea } = Input; -const { Title } = Typography; - -// connecting state.releaseView with the component -const mapStateToProps = state => { - return { - nextState: state.lifecycleModal.nextState, - visible: state.lifecycleModal.visible - } -}; - -const mapDispatchToProps = dispatch => ({ - closeLifecycleModal : () => dispatch(closeLifecycleModal()), - updateLifecycleState : (uuid, nextState, reason) => dispatch(updateLifecycleState(uuid, nextState, reason)) -}); - -const Text = Typography; - -class ConnectedLifecycleModal extends React.Component { - constructor(props) { - super(props); - this.state = { - loading: false, - visible: false - }; - } - - componentWillReceiveProps(nextProps) { - if (nextProps !== this.props) { - this.setState({ - visible: nextProps.visible, - loading: false - }) - } - } - - showModal = () => { - this.setState({ - visible: true, - }); - }; - - handleOk = (e) => { - this.setState({ - visible: false, - }); - this.props.closeLifecycleModal(); - }; - - handleCancel = (e) => { - this.setState({ - visible: false, - loading: false - }); - this.props.closeLifecycleModal(); - }; - handleSubmit = event => { - this.setState({ loading: true }); - event.preventDefault(); - this.props.updateLifecycleState(this.props.uuid, this.props.nextState, this.reason.state.value) - }; - - render() { - if (this.props.nextState != null) { - const nextState = this.props.nextState; - return ( -
- - {this.props.currentStatus} <Icon type="arrow-right" /> {nextState} -
- - - - this.reason = input}/> - - {/**/} - {/* this.input = input}*/} - {/*autosize*/} - {/*/>*/} - {/**/} - , - -
- -
- ); - } else { - return null; - } - } -} - -const LifecycleModal = connect(mapStateToProps, mapDispatchToProps)(ConnectedLifecycleModal); - -export default LifecycleModal; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/public/conf/config.json b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/public/conf/config.json index 642b3fdf38c..87f1691530d 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/public/conf/config.json +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/public/conf/config.json @@ -12,7 +12,8 @@ "uri": "/ui-request-handler/invoke", "publisher": "/application-mgt-publisher/v1.0", "store": "/application-mgt-store/v1.0", - "admin" : "" + "admin" : "", + "deviceMgt" : "/device-mgt/v1.0" }, "loginUri": "/ui-request-handler/login", "platform": "store" diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/ReleaseView.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/ReleaseView.js index e52ddff1928..367dfd7a31f 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/ReleaseView.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/ReleaseView.js @@ -22,21 +22,19 @@ class ReleaseView extends React.Component { } installApp = (type, payload) => { - const {uuid} = this.props.release; + const release = this.props.app.applicationReleases[0]; + const {uuid} = release; - const parameters = { - method: "post", - 'content-type': "application/json", - payload: JSON.stringify(payload), - 'api-endpoint': "/application-mgt-store/v1.0/subscription/install/" + uuid + "/" + type + "/install" - }; - - const request = Object.keys(parameters).map(key => key + '=' + parameters[key]).join('&'); this.setState({ loading: true, }); - - axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.store, request + const url = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/subscription/install/" + uuid + "/" + type + "/install"; + axios.post( + url, + payload, + { + headers: {'X-Platform': config.serverConfig.platform} + } ).then(res => { if (res.status === 201) { this.setState({ diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js index 4f4b7be7fee..d89eba8f1cf 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js @@ -138,7 +138,11 @@ class DeviceInstall extends React.Component { const request = Object.keys(parameters).map(key => key + '=' + parameters[key]).join('&'); //send request to the invoker - axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.store, request + axios.get( + config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt+"devices?" + encodedExtraParams, + { + headers: { 'X-Platform': config.serverConfig.platform } + } ).then(res => { if (res.status === 200) { const pagination = {...this.state.pagination}; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupInstall.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupInstall.js index 82e2de759cb..25bf7486949 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupInstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupInstall.js @@ -27,15 +27,11 @@ class GroupInstall extends React.Component { const fetchId = this.lastFetchId; this.setState({data: [], fetching: true}); - - const parameters = { - method: "get", - 'content-type': "application/json", - payload: "{}", - 'api-endpoint': "/device-mgt/v1.0/admin/groups?name=" + value - }; - - axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.store, request + axios.post( + config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt+"/groups?name=" + value, + { + headers: { 'X-Platform': config.serverConfig.platform } + } ).then(res => { if (res.status === 200) { if (fetchId !== this.lastFetchId) { diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleInstall.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleInstall.js index 3f058e0825a..851d506e407 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleInstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleInstall.js @@ -27,15 +27,11 @@ class RoleInstall extends React.Component { const fetchId = this.lastFetchId; this.setState({data: [], fetching: true}); - - const parameters = { - method: "get", - 'content-type': "application/json", - payload: "{}", - 'api-endpoint': "/device-mgt/v1.0/roles?filter=" + value - }; - - axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.store, request + axios.get( + config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt+"/roles?filter=" + value, + { + headers: { 'X-Platform': config.serverConfig.platform } + } ).then(res => { if (res.status === 200) { if (fetchId !== this.lastFetchId) { diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserInstall.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserInstall.js index 57d87492424..8d38b9287f4 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserInstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserInstall.js @@ -30,7 +30,7 @@ class UserInstall extends React.Component { //send request to the invoker axios.get( - config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.store+"/device-mgt/v1.0/users/search?username=" + value, + config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt+"/users/search?username=" + value, { headers: { 'X-Platform': config.serverConfig.platform } }