Fix typos in app installation components

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 (
             <div>
+                <Text>Start installing the application for one or more users by entering the corresponding user name. Select install to automatically start downloading the application for the respective user/users. </Text>
                 <Table
+                    style={{paddingTop:20}}
                     columns={columns}
                     rowKey={record => record.deviceIdentifier}
                     dataSource={data}

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 (
             <div>
-                <Text>Lorem ipsum dolor sit amet, ne tation labores quo, errem facilisis expetendis vel in. Ut choro
-                    decore ubique sed,</Text>
+                <Text>Start installing the application for one or more groups by entering the corresponding group name. Select install to automatically start downloading the application for the respective device group/ groups.</Text>
                 <br/>
                 <br/>
                 <Select

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

@@ -90,8 +90,7 @@ class RoleInstall extends React.Component {
 
         return (
             <div>
-                <Text>Lorem ipsum dolor sit amet, ne tation labores quo, errem facilisis expetendis vel in. Ut choro
-                    decore ubique sed,</Text>
+                <Text>Start installing the application for one or more roles by entering the corresponding role name. Select install to automatically start downloading the application for the respective user role/roles.</Text>
                 <br/>
                 <br/>
                 <Select

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

@@ -90,8 +90,7 @@ class UserInstall extends React.Component {
 
         return (
             <div>
-                <Text>Lorem ipsum dolor sit amet, ne tation labores quo, errem facilisis expetendis vel in. Ut choro
-                    decore ubique sed,</Text>
+                <Text>Start installing the application for one or more users by entering the corresponding user name. Select install to automatically start downloading the application for the respective user/users. </Text>
                 <p>Select users</p>
                 <Select
                     mode="multiple"

components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/Login.js

@@ -92,7 +92,7 @@ class NormalLoginForm extends React.Component {
                     {getFieldDecorator('username', {
                         rules: [{required: true, message: 'Please input your username!'}],
                     })(
-                        <Input style={{height: 32}} prefix={<Icon type="user" style={{color: 'rgba(0,0,0,.25)'}}/>}
+                        <Input name="username" style={{height: 32}} prefix={<Icon type="user" style={{color: 'rgba(0,0,0,.25)'}}/>}
                                placeholder="Username"/>
                     )}
                 </Form.Item>
@@ -100,7 +100,7 @@ class NormalLoginForm extends React.Component {
                     {getFieldDecorator('password', {
                         rules: [{required: true, message: 'Please input your Password!'}],
                     })(
-                        <Input style={{height: 32}} className={styles.input}
+                        <Input name="password" style={{height: 32}} className={styles.input}
                                prefix={<Icon type="lock" style={{color: 'rgba(0,0,0,.25)'}}/>} type="password"
                                placeholder="Password"/>
                     )}

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 (
             <div>
                 <Layout className="layout">
@@ -36,7 +33,7 @@ class Dashboard extends React.Component {
                         >
                             <Menu.Item key="android"><Link to="/store/android"><Icon type="android" theme="filled"/>Android</Link></Menu.Item>
                             <Menu.Item key="ios"><Link to="/store/ios"><Icon type="apple" theme="filled"/>iOS</Link></Menu.Item>
-                            <Menu.Item key="webclip"><Link to="/store/webclips"><Icon type="upload"/>Web Clips</Link></Menu.Item>
+                            <Menu.Item key="webclip"><Link to="/store/web-clip"><Icon type="upload"/>Web Clips</Link></Menu.Item>
                         </Menu>
                     </Header>
                 </Layout>

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 (
             <div>
                 <div style={{background: '#f0f2f5', padding: 24, minHeight: 780}}>
-                    <ReleaseModal/>
-                    <AppList/>
+                    {deviceType!==null && <AppList deviceType={deviceType}/>}
                 </div>
 
             </div>

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 (
-            <div style={{background: '#f0f2f5', padding: 24, minHeight: 780}}>
+            <div style={{background: '#f0f2f5', minHeight: 780}}>
                 <Row style={{padding: 10}}>
                     <Col lg={4}>