From 2103e0ea48b125f538ca71a9d8450f04b989d287 Mon Sep 17 00:00:00 2001 From: nipun Date: Tue, 1 Oct 2019 13:14:33 +0530 Subject: [PATCH] Modify the uninstall UI of the APPM store --- .../src/pages/dashboard/Dashboard.css | 6 +++--- .../src/pages/dashboard/Dashboard.js | 18 +++++++--------- .../components/apps/release/ReleaseView.js | 21 ++++++++++--------- .../apps/release/install/DeviceInstall.js | 2 +- .../apps/release/install/DeviceUninstall.js | 2 +- .../apps/release/install/GroupInstall.js | 2 +- .../apps/release/install/GroupUninstall.js | 2 +- .../apps/release/install/RoleInstall.js | 2 +- .../apps/release/install/RoleUninstall.js | 2 +- .../apps/release/install/UserInstall.js | 2 +- .../apps/release/install/UserUninstall.js | 2 +- .../src/pages/dashboard/Dashboard.css | 6 +++--- .../src/pages/dashboard/Dashboard.js | 18 +++++++--------- 13 files changed, 39 insertions(+), 46 deletions(-) diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/Dashboard.css b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/Dashboard.css index c0484b7a419..63cb9777e6f 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/Dashboard.css +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/Dashboard.css @@ -58,7 +58,7 @@ } .mobile-menu-button{ - margin-top: 4%; + margin-top: 15px; } Header{ @@ -68,7 +68,7 @@ } .dashboard-body{ - margin-top: 14%; + margin-top: 50px; } .logo-image { @@ -80,7 +80,7 @@ @media screen and (max-height: 350px) { .mobile-menu-button{ - margin-top: 2%; + margin-top: 15px; } .dashboard-body{ margin-top: 9%; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/Dashboard.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/Dashboard.js index 1ec219c8137..5c49461cef0 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/Dashboard.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/Dashboard.js @@ -32,26 +32,22 @@ class Dashboard extends React.Component { constructor(props) { super(props); this.state = { - routes: props.routes + routes: props.routes, + visible: false, + collapsed: false }; const config = this.props.context; this.Logo = config.theme.logo; } - //functions for show the drawer - state = { - visible: false, - collapsed: false - }; - - showDrawer = () => { + showMobileNavigationBar = () => { this.setState({ visible: true, collapsed: !this.state.collapsed }); }; - onClose = () => { + onCloseMobileNavigationBar = () => { this.setState({ visible: false, }); @@ -113,7 +109,7 @@ class Dashboard extends React.Component {
-
@@ -122,7 +118,7 @@ class Dashboard extends React.Component { width={"60%"}/>} placement="left" closable={false} - onClose={this.onClose} + onClose={this.onCloseMobileNavigationBar} visible={this.state.visible} getContainer={false} style={{position: 'absolute'}} 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 0ef4dd8adce..1d3e6d0826d 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 @@ -42,7 +42,7 @@ class ReleaseView extends React.Component { } } - installApp = (type, payload) => { + appOperation = (type, payload, operation) => { const config = this.props.context; const release = this.props.app.applicationReleases[0]; const {uuid} = release; @@ -50,7 +50,7 @@ class ReleaseView extends React.Component { this.setState({ loading: true, }); - const url = window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/subscription/" + uuid + "/" + type + "/install"; + const url = window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/subscription/" + uuid + "/" + type + "/" + operation; axios.post( url, payload, @@ -66,7 +66,7 @@ class ReleaseView extends React.Component { notification["success"]({ message: 'Done!', description: - 'App installed triggered.', + 'App '+operation+'ed triggered.', }); } else { this.setState({ @@ -76,11 +76,11 @@ class ReleaseView extends React.Component { message: "There was a problem", duration: 0, description: - "Error occurred while installing app", + "Error occurred while "+operation+"ing app", }); } }).catch((error) => { - handleApiError(error,"Error occurred while installing the app."); + handleApiError(error,"Error occurred while "+operation+"ing the app."); }); }; @@ -90,7 +90,8 @@ class ReleaseView extends React.Component { appInstallModalVisible: true }); }; - closeAppInstallModal = () => { + + closeAppOperationModal = () => { this.setState({ appInstallModalVisible: false, appUninstallModalVisible: false @@ -112,14 +113,14 @@ class ReleaseView extends React.Component { uuid={release.uuid} visible={this.state.appInstallModalVisible} deviceType = {deviceType} - onClose={this.closeAppInstallModal} - onInstall={this.installApp}/> + onClose={this.closeAppOperationModal} + onInstall={this.appOperation}/> + onClose={this.closeAppOperationModal} + onUninstall={this.appOperation}/>
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 4b7f11bbd22..14fbb0ce670 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 @@ -196,7 +196,7 @@ class DeviceInstall extends React.Component { type: device.type }); }); - this.props.onInstall("devices", payload); + this.props.onInstall("devices", payload, "install"); }; render() { diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceUninstall.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceUninstall.js index 60cc8980802..f9d30db39fc 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceUninstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/DeviceUninstall.js @@ -192,7 +192,7 @@ class DeviceUninstall extends React.Component { type: device.type }); }); - this.props.onUninstall("devices", payload); + this.props.onUninstall("devices", payload, "uninstall"); }; render() { 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 1722d27952c..47d3b628c46 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 @@ -85,7 +85,7 @@ class GroupInstall extends React.Component { value.map(val=>{ data.push(val.key); }); - this.props.onInstall("group",data); + this.props.onInstall("group", data, "install"); }; render() { diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupUninstall.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupUninstall.js index e976cbb3031..f3aeebc9748 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupUninstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/GroupUninstall.js @@ -87,7 +87,7 @@ class GroupUninstall extends React.Component { value.map(val=>{ data.push(val.key); }); - this.props.onInstall("group",data); + this.props.onInstall("group", data, "uninstall"); }; render() { 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 0f6da0f2d7a..b9edba286e0 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 @@ -85,7 +85,7 @@ class RoleInstall extends React.Component { value.map(val=>{ data.push(val.key); }); - this.props.onInstall("role",data); + this.props.onInstall("role", data, "install"); }; render() { diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleUninstall.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleUninstall.js index 0bd14bfb4d4..53c3a6c5574 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleUninstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/RoleUninstall.js @@ -86,7 +86,7 @@ class RoleUninstall extends React.Component { value.map(val=>{ data.push(val.key); }); - this.props.onInstall("role",data); + this.props.onInstall("role", data, "uninstall"); }; render() { 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 d04d11a24c1..7be794f9ae2 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 @@ -87,7 +87,7 @@ class UserInstall extends React.Component { value.map(val => { data.push(val.key); }); - this.props.onInstall("user", data); + this.props.onInstall("user", data, "install"); }; render() { diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserUninstall.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserUninstall.js index 97219d8e0a1..5c68455abdc 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserUninstall.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/UserUninstall.js @@ -86,7 +86,7 @@ class UserUninstall extends React.Component { value.map(val => { data.push(val.key); }); - this.props.onUninstall("user", data); + this.props.onUninstall("user", data, "uninstall"); }; render() { diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/Dashboard.css b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/Dashboard.css index e1138ad3f5c..c62c54c6b10 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/Dashboard.css +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/Dashboard.css @@ -58,7 +58,7 @@ } .mobile-menu-button { - margin-top: 4%; + margin-top: 15px; } Header{ @@ -68,7 +68,7 @@ } .dashboard-body{ - margin-top: 15%; + margin-top: 50px; } .logo-image { @@ -80,7 +80,7 @@ @media only screen and (max-height: 350px) { .mobile-menu-button{ - margin-top: 2%; + margin-top: 15px; } .dashboard-body{ 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 044dae53782..2ee3aba497f 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 @@ -36,7 +36,9 @@ class Dashboard extends React.Component { this.state = { routes: props.routes, selectedKeys: [], - deviceTypes: [] + deviceTypes: [], + visible: false, + collapsed: false }; this.logo = this.props.context.theme.logo; } @@ -72,20 +74,14 @@ class Dashboard extends React.Component { }) }; - //functions for show the drawer - state = { - visible: false, - collapsed: false - }; - - showDrawer = () => { + showMobileNavigationBar = () => { this.setState({ visible: true, collapsed: !this.state.collapsed, }); }; - onClose = () => { + onCloseMobileNavigationBar = () => { this.setState({ visible: false, }); @@ -153,7 +149,7 @@ class Dashboard extends React.Component {
-
@@ -163,7 +159,7 @@ class Dashboard extends React.Component { } placement="left" closable={false} - onClose={this.onClose} + onClose={this.onCloseMobileNavigationBar} visible={this.state.visible} getContainer={false} style={{position: 'absolute'}}