From caa3717dcb192526c07b9ee9a54e5e1e13ef40cf Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Fri, 14 Jun 2019 11:29:39 +0530 Subject: [PATCH 1/9] Create components to install by device --- .../react-app/package.json | 1 + .../apps/release/install/AppInstallModal.js | 8 +- .../apps/release/install/DeviceInstall.js | 226 ++++++++++++++++++ 3 files changed, 233 insertions(+), 2 deletions(-) create mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js 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 ac80be19a0..784a4bc702 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 @@ -15,6 +15,7 @@ "axios": "^0.18.0", "d3": "^5.9.2", "dagre": "^0.8.4", + "javascript-time-ago": "^2.0.1", "keymirror": "^0.1.1", "lodash.debounce": "^4.0.8", "rc-viewer": "0.0.9", diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/AppInstallModal.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/AppInstallModal.js index 0cced3824f..990eea393e 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/AppInstallModal.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/AppInstallModal.js @@ -3,10 +3,14 @@ import {Button, Modal, Tabs} from "antd"; import UserInstall from "./UserInstall"; import GroupInstall from "./GroupInstall"; import RoleInstall from "./RoleInstall"; +import DeviceInstall from "./DeviceInstall"; const { TabPane } = Tabs; class AppInstallModal extends React.Component{ + state={ + data:[] + }; render() { return (
@@ -17,12 +21,12 @@ class AppInstallModal extends React.Component{ onCancel={this.props.onClose} footer={null} > - + {console.log("changed");}}> - Device install + 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 new file mode 100644 index 0000000000..0a19afcf04 --- /dev/null +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js @@ -0,0 +1,226 @@ +import React from "react"; +import axios from "axios"; +import config from "../../../../../public/conf/config.json"; +import {Button, message, Table} from "antd"; +import TimeAgo from 'javascript-time-ago' + +// Load locale-specific relative date/time formatting rules. +import en from 'javascript-time-ago/locale/en' + +const columns = [ + { + title: 'Device', + dataIndex: 'name', + fixed: 'left', + width: 100, + }, + { + title: 'Modal', + dataIndex: 'deviceInfo', + key:'modal', + render: deviceInfo => `${deviceInfo.vendor} ${deviceInfo.deviceModel}` + // todo add filtering options + }, + { + title: 'Owner', + dataIndex: 'enrolmentInfo', + key: 'owner', + render: enrolmentInfo => enrolmentInfo.owner + // todo add filtering options + }, + { + title: 'Last Updated', + dataIndex: 'enrolmentInfo', + key: 'dateOfLastUpdate', + render: (data) => { + return (getTimeAgo(data.dateOfLastUpdate)); + } + // todo add filtering options + }, + { + title: 'Status', + dataIndex: 'enrolmentInfo', + key: 'status', + render: enrolmentInfo => enrolmentInfo.status + // todo add filtering options + }, + { + title: 'Ownership', + dataIndex: 'enrolmentInfo', + key: 'ownership', + render: enrolmentInfo => enrolmentInfo.ownership + // todo add filtering options + }, + { + title: 'OS Version', + dataIndex: 'deviceInfo', + key:'osVersion', + render: deviceInfo => deviceInfo.osVersion + // todo add filtering options + }, + { + title: 'IMEI', + dataIndex: 'properties', + key:'imei', + render: properties => { + let imei = "not-found"; + for (let i = 0; i < properties.length; i++) { + if(properties[i].name==="IMEI"){ + imei = properties[i].value; + } + } + return imei; + } + // todo add filtering options + }, +]; + +const getTimeAgo = (time) => { + const timeAgo = new TimeAgo('en-US'); + return timeAgo.format(time); +}; + + +class DeviceInstall extends React.Component { + constructor(props) { + super(props); + TimeAgo.addLocale(en); + this.state = { + data: [], + pagination: {}, + loading: false, + selectedRows:[] + }; + } + + rowSelection = { + onChange: (selectedRowKeys, selectedRows) => { + console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows); + this.setState({ + selectedRows: selectedRows + }) + }, + getCheckboxProps: record => ({ + disabled: record.name === 'Disabled User', // Column configuration not to be checked + name: record.name, + }), + }; + + + + + componentDidMount() { + this.fetch(); + } + + //fetch data from api + fetch = (params = {}) => { + this.setState({loading: true}); + + // get current page + const currentPage = (params.hasOwnProperty("page")) ? params.page : 1; + + const extraParams = { + offset: 10 * (currentPage - 1), //calculate the offset + limit: 10, + status: "INACTIVE", + requireDeviceInfo: true + }; + + // note: encode with '%26' not '&' + const encodedExtraParams = Object.keys(extraParams).map(key => key + '=' + extraParams[key]).join('%26'); + + const parameters = { + method: "get", + 'content-type': "application/json", + payload: "{}", + 'api-endpoint': "/device-mgt/v1.0/devices?" + encodedExtraParams + }; + + //url-encode parameters + 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.invokerUri, request + ).then(res => { + if (res.status === 200) { + const pagination = {...this.state.pagination}; + console.log(res.data.data.devices); + this.setState({ + loading: false, + data: res.data.data.devices, + pagination, + }); + + } + + }).catch((error) => { + if (error.hasOwnProperty("status") && error.response.status === 401) { + //todo display a popop with error + message.error('You are not logged in'); + window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/store/login'; + } else { + message.error('Something went wrong... :('); + } + + this.setState({loading: false}); + }); + }; + + handleTableChange = (pagination, filters, sorter) => { + const pager = {...this.state.pagination}; + pager.current = pagination.current; + this.setState({ + pagination: pager, + }); + this.fetch({ + results: pagination.pageSize, + page: pagination.current, + sortField: sorter.field, + sortOrder: sorter.order, + ...filters, + }); + }; + + install = () => { + const {selectedRows} = this.state; + const payload = []; + selectedRows.map(device => { + payload.push({ + deviceIdentifier: device.deviceIdentifier, + type: device.type + }); + }); + this.props.onInstall("device", payload); + }; + + + render() { + const {data,pagination,loading,selectedRows} = this.state; + return ( +
+ record.deviceIdentifier} + dataSource={data} + pagination={{ + ...pagination, + size: "small", + // position: "top", + showTotal: (total, range) => `showing ${range[0]}-${range[1]} of ${total} devices` + // showQuickJumper: true + }} + loading={loading} + onChange={this.handleTableChange} + rowSelection={this.rowSelection} + scroll={{x: 1000}} + /> +
+ +
+ + ); + } +} + +export default DeviceInstall; \ No newline at end of file From b56430feb2747cda0596dbd493ca544084e5b41c Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Fri, 14 Jun 2019 11:54:01 +0530 Subject: [PATCH 2/9] Disable install button when selected nothing --- .../src/components/apps/release/install/DeviceInstall.js | 3 --- .../src/components/apps/release/install/GroupInstall.js | 2 +- .../src/components/apps/release/install/RoleInstall.js | 2 +- .../src/components/apps/release/install/UserInstall.js | 3 +-- 4 files changed, 3 insertions(+), 7 deletions(-) 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 0a19afcf04..234c46fefd 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 @@ -106,9 +106,6 @@ class DeviceInstall extends React.Component { }), }; - - - componentDidMount() { this.fetch(); } 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 e57374f91f..f2da36c473 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 @@ -110,7 +110,7 @@ class GroupInstall extends React.Component { ))}
- +
); 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 358a29ae2e..4befab07e5 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 @@ -110,7 +110,7 @@ class RoleInstall extends React.Component { ))}
- +
); 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 27ee3b8382..0fcf7dada8 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 @@ -86,7 +86,6 @@ class UserInstall extends React.Component { }; render() { - const {fetching, data, value} = this.state; return ( @@ -110,7 +109,7 @@ class UserInstall extends React.Component { ))}
- +
); From 336612904b64e8d3070481198f3723256e2e2906 Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Fri, 14 Jun 2019 13:48:05 +0530 Subject: [PATCH 3/9] Remove redux from release view in store --- .../react-app/src/components/apps/AppCard.js | 3 +- .../components/apps/release/ReleaseView.js | 3 +- .../react-app/src/index.js | 6 +- .../src/pages/dashboard/Dashboard.js | 12 +- .../src/pages/dashboard/apps/Apps.js | 13 -- .../pages/dashboard/apps/release/Release.js | 116 +++++++++--------- 6 files changed, 68 insertions(+), 85 deletions(-) diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppCard.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppCard.js index 091dd984a7..6078e71479 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppCard.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppCard.js @@ -29,11 +29,10 @@ class ConnectedAppCard extends React.Component { render() { const app = this.props.app; const release = this.props.app.applicationReleases[0]; - // console.log(this.props); const description = (
- +
icon 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 d95377e1c9..7872e0f308 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 @@ -89,7 +89,8 @@ class ReleaseView extends React.Component { }; render() { - const release = this.props.release; + const app = this.props.app; + const release = app.applicationReleases[0]; return (
- Apps - Apps - Add New - App + Android + iOS + Web Clips - + {this.state.routes.map((route) => ( ))} diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js index 90e68ed1d0..1a64984858 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js @@ -33,20 +33,7 @@ class Apps extends React.Component { render() { return (
-
- -
- console.log(value)} - style={{ width: 200}} - /> - - - diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js index 27afea477e..5434ea66ef 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js @@ -1,61 +1,80 @@ import React from "react"; import '../../../../App.css'; -import {Skeleton, Typography, Row, Col, Card} from "antd"; -import {connect} from "react-redux"; +import {Skeleton, Typography, Row, Col, Card, message} from "antd"; import ReleaseView from "../../../../components/apps/release/ReleaseView"; -import {getRelease, setLoading} from "../../../../js/actions"; +import axios from "axios"; +import config from "../../../../../public/conf/config.json"; const {Title} = Typography; -const routes = [ - { - path: 'index', - breadcrumbName: 'store', - }, - { - path: 'first', - breadcrumbName: 'Dashboard', - }, - { - path: 'second', - breadcrumbName: 'Apps', - }, -]; - -const mapStateToProps = state => { - return { - release: state.release, - releaseLoading: state.loadingState.release - } -}; - -const mapDispatchToProps = dispatch => ({ - getRelease: (uuid) => dispatch(getRelease(uuid)), - setLoading: (stateToLoad) => dispatch(setLoading(stateToLoad)) -}); - -class ConnectedRelease extends React.Component { +class Release extends React.Component { routes; constructor(props) { super(props); this.routes = props.routes; + this.state={ + loading: true, + app: null + } } componentDidMount() { const {uuid} = this.props.match.params; - this.props.setLoading("release"); - this.props.getRelease(uuid); + this.fetchData(uuid); } - render() { + componentDidUpdate(prevProps, prevState, snapshot) { + if (prevProps !== this.props) { + this.fetchData(uuid); + } + } + + fetchData = (uuid)=>{ + const parameters = { + method: "get", + 'content-type': "application/json", + payload: "{}", + 'api-endpoint': "/application-mgt-store/v1.0/applications/" + uuid + }; + + //url-encode parameters + 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.invokerUri, request + ).then(res => { + if (res.status === 200) { + let app = res.data.data; + + console.log(app); + + this.setState({ + app: app, + loading: false + }) + } + + }).catch((error) => { + if (error.hasOwnProperty("response") && error.response.status === 401) { + //todo display a popop with error + message.error('You are not logged in'); + window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/store/login'; + } else { + message.error('Something went wrong... :('); + } + + this.setState({loading: false}); + }); + }; - const release = this.props.release; + render() { + const {app, loading} = this.state; let content = No Releases Found; - if (release != null) { - content = ; + if (app != null && app.applicationReleases.length!==0) { + content = ; } @@ -67,7 +86,7 @@ class ConnectedRelease extends React.Component { - + {content} @@ -76,29 +95,8 @@ class ConnectedRelease extends React.Component { ); - - - // //todo remove uppercase - // return ( - //
- //
- // - //
- // - // - // - // - // - // - // - // - // - // - // - // ); } } -const Release = connect(mapStateToProps, mapDispatchToProps)(ConnectedRelease); export default Release; From 164b3415aee23fbed77c5811818f93056c25e5bd Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Fri, 14 Jun 2019 14:12:09 +0530 Subject: [PATCH 4/9] Change routes in store --- .../react-app/src/components/apps/AppCard.js | 2 +- .../src/components/apps/release/ReleaseView.js | 4 ++-- .../react-app/src/index.js | 10 ++-------- .../react-app/src/pages/dashboard/Dashboard.js | 11 +++++++---- .../src/pages/dashboard/apps/release/Release.js | 1 + 5 files changed, 13 insertions(+), 15 deletions(-) diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppCard.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppCard.js index 6078e71479..44082e690b 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppCard.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppCard.js @@ -32,7 +32,7 @@ class ConnectedAppCard extends React.Component { const description = (
- +
icon 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 7872e0f308..ea96028b80 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 @@ -101,10 +101,10 @@ class ReleaseView extends React.Component { icon- App Name + {app.name}Version : {release.version}

@@ -28,12 +31,12 @@ class Dashboard extends React.Component { - Android - iOS - Web Clips + Android + iOS + Web Clips diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js index 5434ea66ef..acdf7763f7 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js @@ -26,6 +26,7 @@ class Release extends React.Component { } componentDidUpdate(prevProps, prevState, snapshot) { + const {uuid} = this.props.match.params; if (prevProps !== this.props) { this.fetchData(uuid); } From 7b682a35e532090e3a7757b6730f9f6e29d11379 Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Mon, 17 Jun 2019 13:14:08 +0530 Subject: [PATCH 5/9] Fix typos in app installation components --- .../apps/release/install/DeviceInstall.js | 6 ++++-- .../components/apps/release/install/GroupInstall.js | 3 +-- .../components/apps/release/install/RoleInstall.js | 3 +-- .../components/apps/release/install/UserInstall.js | 3 +-- .../react-app/src/pages/Login.js | 4 ++-- .../react-app/src/pages/dashboard/Dashboard.js | 5 +---- .../react-app/src/pages/dashboard/apps/Apps.js | 8 +++----- .../src/pages/dashboard/apps/release/Release.js | 13 ++++++++----- 8 files changed, 21 insertions(+), 24 deletions(-) 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 234c46fefd..c1c7a5f2e5 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceInstall.js @@ -1,12 +1,12 @@ import React from "react"; import axios from "axios"; import config from "../../../../../public/conf/config.json"; -import {Button, message, Table} from "antd"; +import {Button, message, Table, Typography} from "antd"; import TimeAgo from 'javascript-time-ago' // Load locale-specific relative date/time formatting rules. import en from 'javascript-time-ago/locale/en' - +const {Text} = Typography; const columns = [ { title: 'Device', @@ -196,7 +196,9 @@ class DeviceInstall extends React.Component { const {data,pagination,loading,selectedRows} = this.state; return (
+ 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.
record.deviceIdentifier} dataSource={data} 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 f2da36c473..535fefec22 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 @@ -90,8 +90,7 @@ class GroupInstall extends React.Component { return (
- Lorem ipsum dolor sit amet, ne tation labores quo, errem facilisis expetendis vel in. Ut choro - decore ubique sed, + 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.

- Lorem ipsum dolor sit amet, ne tation labores quo, errem facilisis expetendis vel in. Ut choro - decore ubique sed, + 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.

Select users

} placeholder="Username"/> )} @@ -100,7 +100,7 @@ class NormalLoginForm extends React.Component { {getFieldDecorator('password', { rules: [{required: true, message: 'Please input your Password!'}], })( - } type="password" placeholder="Password"/> )} diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/Dashboard.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/Dashboard.js index fd331a5429..d8190b9b1a 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/Dashboard.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/Dashboard.js @@ -18,9 +18,6 @@ class Dashboard extends React.Component { } render() { - const {deviceType} = this.props.match.params; - console.log(this.props.match.params); - console.log(deviceType); return (
@@ -36,7 +33,7 @@ class Dashboard extends React.Component { > Android iOS - Web Clips + Web Clips diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js index 1a64984858..d8bb0d134e 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js @@ -1,10 +1,7 @@ import React from "react"; import "antd/dist/antd.css"; -import {PageHeader, Typography,Input, Button, Row, Col} from "antd"; import AppList from "../../../components/apps/AppList"; -import ReleaseModal from "../../../components/apps/ReleaseModal"; -const Search = Input.Search; const routes = [ { @@ -30,12 +27,13 @@ class Apps extends React.Component { } + render() { + const {deviceType} = this.props.match.params; return (
- - + {deviceType!==null && }
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js index acdf7763f7..c982c173fc 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js @@ -15,7 +15,8 @@ class Release extends React.Component { this.routes = props.routes; this.state={ loading: true, - app: null + app: null, + uuid: null } } @@ -26,8 +27,9 @@ class Release extends React.Component { } componentDidUpdate(prevProps, prevState, snapshot) { - const {uuid} = this.props.match.params; - if (prevProps !== this.props) { + console.log(prevState); + if (prevState.uuid !== this.state.uuid) { + const {uuid} = this.props.match.params; this.fetchData(uuid); } } @@ -53,7 +55,8 @@ class Release extends React.Component { this.setState({ app: app, - loading: false + loading: false, + uuid: uuid }) } @@ -80,7 +83,7 @@ class Release extends React.Component { return ( -
+
From 4a38f877a06108e1c29d792056a85c8d2b28a2f6 Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Mon, 17 Jun 2019 15:07:17 +0530 Subject: [PATCH 6/9] Pass props via router --- .../src/components/RouteWithSubRoutes.js | 2 +- .../react-app/src/components/apps/AppList.js | 87 +++++++++++++++---- .../src/pages/dashboard/Dashboard.js | 18 +++- .../src/pages/dashboard/apps/Apps.js | 19 +--- .../pages/dashboard/apps/release/Release.js | 6 +- 5 files changed, 91 insertions(+), 41 deletions(-) diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/RouteWithSubRoutes.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/RouteWithSubRoutes.js index 41cb84caf8..226db5ff22 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/RouteWithSubRoutes.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/RouteWithSubRoutes.js @@ -9,7 +9,7 @@ class RouteWithSubRoutes extends React.Component{ render() { return( ( - + )}/> ); } diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppList.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppList.js index e41c30290a..767843d710 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppList.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppList.js @@ -1,31 +1,88 @@ import React from "react"; import AppCard from "./AppCard"; -import {Col, Row} from "antd"; -import {connect} from "react-redux"; -import {getApps} from "../../js/actions"; +import {Col, message, Row} from "antd"; +import axios from "axios"; +import config from "../../../public/conf/config.json"; -// connecting state.apps with the component -const mapStateToProps= state => { - return {apps : state.apps} -}; - - -class ConnectedAppList extends React.Component { +class AppList extends React.Component { constructor(props) { super(props); + this.state = { + apps: [], + loading: false + } } + componentDidMount() { - this.props.getApps(); + console.log("mounted"); + const {deviceType} = this.props; + console.log(this.props); + this.props.changeSelectedMenuItem(deviceType); + this.fetchData(deviceType); } + + componentDidUpdate(prevProps, prevState) { + if (prevProps.deviceType !== this.props.deviceType) { + const {deviceType} = this.props; + this.props.changeSelectedMenuItem(deviceType); + this.fetchData(deviceType); + } + } + + fetchData = (deviceType) => { + + const payload = {}; + if(deviceType==="web-clip"){ + payload.appType= "WEB_CLIP"; + }else{ + payload.deviceType= deviceType; + } + const parameters = { + method: "post", + 'content-type': "application/json", + payload: JSON.stringify(payload), + 'api-endpoint': "/application-mgt-store/v1.0/applications/" + }; + + //url-encode parameters + 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.invokerUri, request + ).then(res => { + if (res.status === 200) { + //todo remove this property check after backend improvement + let apps = (res.data.data.hasOwnProperty("applications")) ? res.data.data.applications : []; + this.setState({ + apps: apps, + loading: false + }) + } + + }).catch((error) => { + if (error.hasOwnProperty("response") && error.response.status === 401) { + //todo display a popup with error + message.error('You are not logged in'); + window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/store/login'; + } else { + message.error('Something went wrong... :('); + } + + this.setState({loading: false}); + }); + }; + render() { + const {apps} = this.state; + return ( - {this.props.apps.map(app => ( + {apps.map(app => ( + app={app} + /> ))} @@ -33,6 +90,4 @@ class ConnectedAppList extends React.Component { } } -const AppList = connect(mapStateToProps,{getApps})(ConnectedAppList); - export default AppList; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/Dashboard.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/Dashboard.js index d8190b9b1a..458adf8d94 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/Dashboard.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/Dashboard.js @@ -13,11 +13,21 @@ class Dashboard extends React.Component { constructor(props) { super(props); this.state = { - routes: props.routes + routes: props.routes, + selectedKeys : [] } } + changeSelectedMenuItem = (key) =>{ + console.log("called", key); + this.setState({ + selectedKeys: [key] + }) + }; + render() { + const {selectedKeys} = this.state; + console.log(selectedKeys); return (
@@ -28,12 +38,12 @@ class Dashboard extends React.Component { Android iOS - Web Clips + Web Clips @@ -42,7 +52,7 @@ class Dashboard extends React.Component { {this.state.routes.map((route) => ( - + ))} diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js index d8bb0d134e..cb9ab7720a 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/Apps.js @@ -2,23 +2,6 @@ import React from "react"; import "antd/dist/antd.css"; import AppList from "../../../components/apps/AppList"; - -const routes = [ - { - path: 'index', - breadcrumbName: 'store', - }, - { - path: 'first', - breadcrumbName: 'Dashboard', - }, - { - path: 'second', - breadcrumbName: 'Apps', - }, -]; - - class Apps extends React.Component { routes; constructor(props) { @@ -33,7 +16,7 @@ class Apps extends React.Component { return (
- {deviceType!==null && } + {deviceType!==null && }
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js index c982c173fc..d6b3308b49 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/apps/release/Release.js @@ -22,15 +22,17 @@ class Release extends React.Component { } componentDidMount() { - const {uuid} = this.props.match.params; + const {uuid, deviceType} = this.props.match.params; this.fetchData(uuid); + this.props.changeSelectedMenuItem(deviceType); } componentDidUpdate(prevProps, prevState, snapshot) { console.log(prevState); if (prevState.uuid !== this.state.uuid) { - const {uuid} = this.props.match.params; + const {uuid,deviceType} = this.props.match.params; this.fetchData(uuid); + this.props.changeSelectedMenuItem(deviceType); } } From d188b18bc5bb8ef1c9713b94c0c73fb9d60d608c Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Mon, 17 Jun 2019 15:28:15 +0530 Subject: [PATCH 7/9] Remove redux from detailed rating component --- .../apps/detailed-rating/DetailedRating.js | 4 +- .../components/apps/release/DetailedRating.js | 50 +++++++++++++------ 2 files changed, 37 insertions(+), 17 deletions(-) diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js index da83fc878f..18fa46f812 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js @@ -21,8 +21,8 @@ class DetailedRating extends React.Component{ this.getData(this.props.uuid); } - componentDidUpdate(nextProps) { - if (nextProps !== this.props) { + componentDidUpdate(prevProps, prevState) { + if (prevProps.uuid !== this.props.uuid) { this.getData(this.props.uuid); } } diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/DetailedRating.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/DetailedRating.js index b5dad1088c..f8dc026b8e 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/DetailedRating.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/DetailedRating.js @@ -1,31 +1,52 @@ import React from "react"; import {Row, Typography, Icon} from "antd"; import StarRatings from "react-star-ratings"; +import axios from "axios"; import "./DetailedRating.css"; -import {connect} from "react-redux"; -import {getDetailedRating} from "../../../js/actions"; +import config from "../../../../public/conf/config.json"; const { Text } = Typography; -// connecting state. with the component -const mapStateToProps= state => { - return {detailedRating : state.detailedRating} -}; +class DetailedRating extends React.Component{ -const mapDispatchToProps = dispatch => ({ - getDetailedRating: (uuid) => dispatch(getDetailedRating(uuid)) -}); + constructor(props){ + super(props); + this.state={ + detailedRating: null + } + } + componentDidMount() { + this.getData(this.props.uuid); + } + componentDidUpdate(prevProps, prevState) { + if (prevProps.uuid !== this.props.uuid) { + this.getData(this.props.uuid); + } + } -class ConnectedDetailedRating extends React.Component{ + getData = (uuid)=>{ + const request = "method=get&content-type=application/json&payload={}&api-endpoint=/application-mgt-store/v1.0/reviews/"+uuid+"/rating"; - componentDidMount() { - this.props.getDetailedRating(this.props.uuid); - } + return axios.post(config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request + ).then(res => { + if (res.status === 200) { + let detailedRating = res.data.data; + this.setState({ + detailedRating + }) + } + + }).catch(function (error) { + if (error.response.status === 401) { + window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; + } + }); + }; render() { - const detailedRating = this.props.detailedRating; + const detailedRating = this.state.detailedRating; console.log(detailedRating); @@ -96,6 +117,5 @@ class ConnectedDetailedRating extends React.Component{ } } -const DetailedRating = connect(mapStateToProps,mapDispatchToProps)(ConnectedDetailedRating); export default DetailedRating; \ No newline at end of file From ff7158bf00fa4b15472cb0cc02181761db88ad0f Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Mon, 17 Jun 2019 15:41:34 +0530 Subject: [PATCH 8/9] Remove redux from APPM store --- .../react-app/package.json | 3 - .../react-app/src/components/apps/AppCard.js | 16 +- .../src/components/apps/ReleaseModal.js | 85 --------- .../react-app/src/index.js | 7 +- .../react-app/src/js/actions/index.js | 168 ------------------ .../react-app/src/js/constants/ActionTypes.js | 17 -- .../react-app/src/js/reducers/index.js | 83 --------- .../react-app/src/js/store/index.js | 5 - 8 files changed, 4 insertions(+), 380 deletions(-) delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/ReleaseModal.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/actions/index.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/constants/ActionTypes.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/reducers/index.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/store/index.js 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 784a4bc702..6b4aba3fbd 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 @@ -31,7 +31,6 @@ "react-scripts": "2.1.8", "react-star-ratings": "^2.3.0", "react-virtualized": "^9.21.1", - "redux-thunk": "^2.3.0", "reqwest": "^2.0.5", "storm-react-diagrams": "^5.2.1" }, @@ -66,8 +65,6 @@ "react": "^15.6.2", "react-dom": "^15.6.2", "react-intl": "^2.4.0", - "react-redux": "^7.0.2", - "redux": "^4.0.1", "sass-loader": "^6.0.7", "style-loader": "^0.18.2", "url-loader": "^1.1.2", diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppCard.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppCard.js index 44082e690b..1ef3f3333a 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppCard.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/AppCard.js @@ -1,21 +1,13 @@ -import { - Skeleton, Switch, Card, Icon, Avatar, Typography, Col, Row, Rate -} from 'antd'; +import {Card, Typography, Col, Row} from 'antd'; import React from "react"; -import {openReleasesModal} from "../../js/actions"; -import {connect} from "react-redux"; import {Link} from "react-router-dom"; import "../../App.css"; import StarRatings from 'react-star-ratings'; const {Meta} = Card; -const {Text, Title} = Typography; +const {Text} = Typography; -const mapDispatchToProps = dispatch => ({ - openReleasesModal: (app) => dispatch(openReleasesModal(app)) -}); - -class ConnectedAppCard extends React.Component { +class AppCard extends React.Component { constructor(props) { super(props); @@ -65,6 +57,4 @@ class ConnectedAppCard extends React.Component { } } -const AppCard = connect(null, mapDispatchToProps)(ConnectedAppCard); - export default AppCard; \ 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/ReleaseModal.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/ReleaseModal.js deleted file mode 100644 index 2265aa6d3f..0000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/ReleaseModal.js +++ /dev/null @@ -1,85 +0,0 @@ -import React from "react"; -import {Modal, Typography,List, Avatar} from 'antd'; -import {connect} from 'react-redux'; -import {Link} from "react-router-dom"; - -// connecting state.releaseView with the component -const mapStateToProps = state => { - return {releaseView: state.releaseView} -}; - -const Text = Typography; - -class ConnectedReleaseModal extends React.Component { - constructor(props) { - super(props); - this.state = { - visible: false, - app: null - }; - } - - componentWillReceiveProps(nextProps) { - if (nextProps !== this.props) { - this.setState({ - visible: nextProps.releaseView.visible, - app: nextProps.releaseView.app - }) - } - } - - showModal = () => { - this.setState({ - visible: true, - }); - }; - - handleOk = (e) => { - this.setState({ - visible: false, - }); - }; - - handleCancel = (e) => { - this.setState({ - visible: false, - }); - }; - - render() { - if (this.props.releaseView.app != null) { - const app = this.props.releaseView.app; - return ( -
- -

Some contents...

- ( - - } - title={{release.version}} - description={release.description} - /> - - )} - /> -
-
- ); - } else { - return null; - } - } -} - -const ReleaseModal = connect(mapStateToProps, null)(ConnectedReleaseModal); - -export default ReleaseModal; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/index.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/index.js index f98a4a1939..3e415a3cee 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/index.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/index.js @@ -7,9 +7,6 @@ import Dashboard from "./pages/dashboard/Dashboard"; import Apps from "./pages/dashboard/apps/Apps"; import Release from "./pages/dashboard/apps/release/Release"; import './index.css'; -import store from "./js/store/index"; -import {Provider} from "react-redux"; - const routes = [ { @@ -38,9 +35,7 @@ const routes = [ ReactDOM.render( - - - , + , document.getElementById('root')); // If you want your app to work offline and load faster, you can change diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/actions/index.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/actions/index.js deleted file mode 100644 index aad30831b3..0000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/actions/index.js +++ /dev/null @@ -1,168 +0,0 @@ -import axios from "axios"; -import ActionTypes from "../constants/ActionTypes"; -import config from "../../../public/conf/config.json"; - -export const getApps = () => dispatch => { - - const request = "method=post&content-type=application/json&payload={}&api-endpoint=/application-mgt-store/v1.0/applications"; - - return axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request - ).then(res => { - if (res.status === 200) { - let apps = []; - - if (res.data.data.hasOwnProperty("applications")) { - apps = res.data.data.applications; - } - dispatch({type: ActionTypes.GET_APPS, payload: apps}); - } - - }).catch(function (error) { - if (error.response.status === 401) { - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/store/login'; - } - }); - -}; - -export const getRelease = (uuid) => dispatch => { - - const request = "method=get&content-type=application/json&payload={}&api-endpoint=/application-mgt-store/v1.0/applications/" + uuid; - - return axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request - ).then(res => { - if (res.status === 200) { - let release = res.data.data.applicationReleases[0]; - dispatch({ - type: ActionTypes.GET_RELEASE, - payload: { - release: release, - releaseLoading: false - } - }); - } - }).catch(function (error) { - if (error.response.status === 401) { - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/store/login'; - }else if(error.response.status===404){ - dispatch({ - type: ActionTypes.GET_RELEASE, - payload: { - release: null, - releaseLoading: false - }}); - } - }); - - -}; - -export const openReleasesModal = (app) => dispatch => { - dispatch({ - type: ActionTypes.OPEN_RELEASES_MODAL, - payload: { - app: app - } - }); -}; - - -export const openLifecycleModal = (nextState) => dispatch => { - dispatch({ - type: ActionTypes.OPEN_LIFECYCLE_MODAL, - payload: { - nextState: nextState - } - }); -}; - -export const closeLifecycleModal = () => dispatch => { - dispatch({ - type: ActionTypes.CLOSE_LIFECYCLE_MODAL - }); -}; - -export const setLoading = (stateToLoad) => dispatch => { - dispatch({ - type: ActionTypes.SET_LOADING_STATE, - payload: { - stateToLoad: stateToLoad - } - }); -}; - -export const getLifecycle = () => dispatch => { - const request = "method=get&content-type=application/json&payload={}&api-endpoint=/application-mgt-store/v1.0/applications/lifecycle-config"; - - return axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request - ).then(res => { - if (res.status === 200) { - let lifecycle = res.data.data; - dispatch({type: ActionTypes.GET_LIFECYCLE, payload: lifecycle}); - } - - }).catch(function (error) { - if (error.response.status === 401) { - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/store/login'; - } - }); -}; - -export const updateLifecycleState = (uuid, nextState, reason) => dispatch => { - - const payload = { - action: nextState, - reason: reason - }; - - const request = "method=post&content-type=application/json&payload=" + JSON.stringify(payload) + "&api-endpoint=/application-mgt-store/v1.0/applications/life-cycle/" + uuid; - - - return axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request - ).then(res => { - if (res.status === 201) { - let release = res.data.data; - dispatch({type: ActionTypes.UPDATE_LIFECYCLE_STATE, payload: release}); - }else { - alert("error"); - dispatch({ - type: ActionTypes.CLOSE_LIFECYCLE_MODAL - }); - } - - }).catch(function (error) { - if (error.response.status === 401) { - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/store/login'; - } else if (error.response.status === 500) { - alert("error"); - dispatch({ - type: ActionTypes.CLOSE_LIFECYCLE_MODAL - }); - } - }); - - -}; - -export const getDetailedRating = (uuid) => dispatch => { - const request = "method=get&content-type=application/json&payload={}&api-endpoint=/application-mgt-store/v1.0/reviews/"+uuid+"/rating"; - - return axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request - ).then(res => { - if (res.status === 200) { - let detailedRating = res.data.data; - dispatch({type: ActionTypes.GET_DETAILED_RATING, payload: detailedRating}); - } - - }).catch(function (error) { - if (error.response.status === 401) { - window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/store/login'; - } else{ - dispatch({ - type: ActionTypes.GET_DETAILED_RATING, payload: null - }); - } - }); - - -}; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/constants/ActionTypes.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/constants/ActionTypes.js deleted file mode 100644 index bd47f22074..0000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/constants/ActionTypes.js +++ /dev/null @@ -1,17 +0,0 @@ -import keyMirror from 'keymirror'; - -const ActionTypes = keyMirror({ - LOGIN: null, - GET_APPS: null, - OPEN_RELEASES_MODAL: null, - CLOSE_RELEASES_MODAL: null, - GET_RELEASE: null, - GET_LIFECYCLE: null, - OPEN_LIFECYCLE_MODAL: null, - CLOSE_LIFECYCLE_MODAL: null, - UPDATE_LIFECYCLE_STATE: null, - SET_LOADING_STATE: null, - GET_DETAILED_RATING: null -}); - -export default ActionTypes; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/reducers/index.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/reducers/index.js deleted file mode 100644 index fcf1aa7db6..0000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/reducers/index.js +++ /dev/null @@ -1,83 +0,0 @@ -import ActionTypes from "../constants/ActionTypes"; - -const initialState = { - apps: [], - releaseView: { - visible: false, - app: null - }, - release: null, - lifecycle: null, - lifecycleModal: { - visible: false, - nextState: null - }, - loadingState: { - release: true - }, - detailedRating: null - -}; - -function rootReducer(state = initialState, action) { - if (action.type === ActionTypes.GET_APPS) { - return Object.assign({}, state, { - apps: action.payload - }); - } else if (action.type === ActionTypes.OPEN_RELEASES_MODAL) { - return Object.assign({}, state, { - releaseView: { - visible: true, - app: action.payload.app - } - }); - } else if (action.type === ActionTypes.GET_RELEASE) { - let loadingState = {...state.loadingState}; - loadingState.release = action.payload.releaseLoading; - return Object.assign({}, state, { - release: action.payload.release, - loadingState: loadingState - }); - } else if (action.type === ActionTypes.GET_LIFECYCLE) { - return Object.assign({}, state, { - lifecycle: action.payload - }); - } else if (action.type === ActionTypes.OPEN_LIFECYCLE_MODAL) { - return Object.assign({}, state, { - lifecycleModal: { - visible: true, - nextState: action.payload.nextState - } - }); - } else if (action.type === ActionTypes.CLOSE_LIFECYCLE_MODAL) { - return Object.assign({}, state, { - lifecycleModal: { - visible: false, - nextState: null - } - }); - } else if (action.type === ActionTypes.UPDATE_LIFECYCLE_STATE) { - return Object.assign({}, state, { - lifecycleModal: { - visible: false, - nextState: null, - }, - release: action.payload - }); - } else if (action.type === ActionTypes.SET_LOADING_STATE) { - let loadingState = {...state.loadingState}; - loadingState[action.payload.stateToLoad] = true; - return Object.assign({}, state, { - loadingState: loadingState - }); - } else if (action.type === ActionTypes.GET_DETAILED_RATING) { - return Object.assign({}, state, { - detailedRating: action.payload - }); - } - - return state; -} - - -export default rootReducer; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/store/index.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/store/index.js deleted file mode 100644 index 04957eb39a..0000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/js/store/index.js +++ /dev/null @@ -1,5 +0,0 @@ -import { createStore, applyMiddleware } from "redux"; -import rootReducer from "../reducers/index"; -import thunk from "redux-thunk"; -const store = createStore(rootReducer, applyMiddleware(thunk)); -export default store; \ No newline at end of file From 3a3de0ff00773c325c6b584245187e96ae288c91 Mon Sep 17 00:00:00 2001 From: Jayasanka Date: Mon, 17 Jun 2019 15:53:49 +0530 Subject: [PATCH 9/9] Remove redux from apps table component --- .../react-app/src/components/apps/AppCard.js | 60 ------------------- .../react-app/src/components/apps/AppList.js | 42 ------------- .../components/apps/list-apps/AppsTable.js | 9 +-- .../src/pages/dashboard/apps/Apps-old.js | 60 ------------------- 4 files changed, 1 insertion(+), 170 deletions(-) delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/AppCard.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/AppList.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/Apps-old.js diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/AppCard.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/AppCard.js deleted file mode 100644 index 2d78b65697..0000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/AppCard.js +++ /dev/null @@ -1,60 +0,0 @@ -import { - Skeleton, Switch, Card, Icon, Avatar, Typography -} from 'antd'; -import React from "react"; -import config from "../../../public/conf/config.json"; -import {openReleasesModal} from "../../js/actions"; -import {connect} from "react-redux"; - -const { Meta } = Card; -const { Text } = Typography; - -const mapDispatchToProps = dispatch => ({ - openReleasesModal: (app) => dispatch(openReleasesModal(app)) -}); - -class ConnectedAppCard extends React.Component { - - constructor(props){ - super(props); - this.handleReleasesClick = this.handleReleasesClick.bind(this); - } - - handleReleasesClick(){ - this.props.openReleasesModal(this.props.app); - } - - - render() { - const defaultPlatformIcons = config.defaultPlatformIcons; - let icon = defaultPlatformIcons.default; - if(defaultPlatformIcons.hasOwnProperty(this.props.platform)){ - icon = defaultPlatformIcons[this.props.platform]; - } - let descriptionText = this.props.description; - if(descriptionText.length>50){ - descriptionText = descriptionText.substring(0,50)+"..."; - } - const description = ( -
-

{descriptionText}

- {this.props.type} - {this.props.subType} -
- ); - - return ( - , , ]}> - } - title={this.props.name} - description={description} - /> - - ); - } -} - -const AppCard = connect(null,mapDispatchToProps)(ConnectedAppCard); - -export default AppCard; \ 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/AppList.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/AppList.js deleted file mode 100644 index 00f715825f..0000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/AppList.js +++ /dev/null @@ -1,42 +0,0 @@ -import React from "react"; -import AppCard from "./AppCard"; -import {Col, Row} from "antd"; -import {connect} from "react-redux"; -import {getApps} from "../../js/actions"; - -// connecting state.apps with the component -const mapStateToProps= state => { - return {apps : state.apps} -}; - - -class ConnectedAppList extends React.Component { - constructor(props) { - super(props); - } - componentDidMount() { - this.props.getApps(); - } - - render() { - return ( - - {this.props.apps.map(app => ( -
- - - ))} - - ); - } -} - -const AppList = connect(mapStateToProps,{getApps})(ConnectedAppList); - -export default AppList; \ 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/list-apps/AppsTable.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppsTable.js index 89949eb56e..16a6659af8 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppsTable.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppsTable.js @@ -7,11 +7,6 @@ import config from "../../../../public/conf/config.json"; const {Title} = Typography; -// connecting state.apps with the component -const mapStateToProps = state => { - return {apps: state.apps} -}; - const columns = [ { title: '', @@ -71,7 +66,7 @@ const columns = [ }, ]; -class ConnectedAppsTable extends React.Component { +class AppsTable extends React.Component { constructor(props) { super(props); this.state = { @@ -175,6 +170,4 @@ class ConnectedAppsTable extends React.Component { } } -const AppsTable = connect(mapStateToProps, {getApps})(ConnectedAppsTable); - export default AppsTable; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/Apps-old.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/Apps-old.js deleted file mode 100644 index e24f40a6ea..0000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/Apps-old.js +++ /dev/null @@ -1,60 +0,0 @@ -import React from "react"; -import "antd/dist/antd.css"; -import {PageHeader, Typography,Input, Button, Row, Col} from "antd"; -import AppList from "../../../components/apps/AppList"; -import ReleaseModal from "../../../components/apps/ReleaseModal"; - -const Search = Input.Search; - -const routes = [ - { - path: 'index', - breadcrumbName: 'Publisher', - }, - { - path: 'first', - breadcrumbName: 'Dashboard', - }, - { - path: 'second', - breadcrumbName: 'Apps', - }, -]; - - -class Apps extends React.Component { - routes; - constructor(props) { - super(props); - this.routes = props.routes; - - } - - render() { - return ( -
- -
- -
- console.log(value)} - style={{ width: 200}} - /> - - - - - - - - - - ); - } -} - -export default Apps;