From e0f2d1e16ad16feeaa942caf7c521c2706bfa679 Mon Sep 17 00:00:00 2001 From: Jayasanka Weerasinghe Date: Tue, 4 Jun 2019 09:57:41 +0000 Subject: [PATCH] Improve app subscription functionality Further integrate app management component with device mgt --- .../react-app/package.json | 1 + .../manage/categories/ManageCategories.js | 407 ++++++++++++++++++ .../manage/categories/ManageTags.js | 407 ++++++++++++++++++ .../react-app/src/index.js | 12 + .../src/pages/dashboard/Dashboard.js | 4 +- .../src/pages/dashboard/apps/OldApps.js | 226 ---------- .../src/pages/dashboard/manage/Manage.js | 62 +++ .../react-app/src/App.js | 2 +- .../react-app/src/components/apps/AppCard.js | 2 +- .../components/apps/release/DetailedRating.js | 22 +- .../components/apps/release/review/Reviews.js | 6 +- .../react-app/src/pages/Login.js | 1 - .../pages/dashboard/add-new-app/AddNewApp.js | 6 +- .../src/pages/dashboard/add-new-app/Step1.js | 5 +- .../src/pages/dashboard/add-new-app/Step2.js | 1 - .../src/pages/dashboard/add-new-app/Step3.js | 1 - 16 files changed, 918 insertions(+), 247 deletions(-) create mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js create mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/OldApps.js create mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/manage/Manage.js diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/package.json b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/package.json index bb4a357405..89be809f26 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/package.json +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/package.json @@ -16,6 +16,7 @@ "d3": "^5.9.2", "dagre": "^0.8.4", "keymirror": "^0.1.1", + "rc-tween-one": "^2.4.1", "react": "^16.8.4", "react-d3-graph": "^2.0.2", "react-dom": "^16.8.4", diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js new file mode 100644 index 0000000000..40365d0b40 --- /dev/null +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js @@ -0,0 +1,407 @@ +import React from "react"; +import {Card, Tag, message, Icon, Input, notification, Divider, Button, Spin, Tooltip, Popconfirm, Modal} from "antd"; +import axios from "axios"; +import config from "../../../../public/conf/config.json"; +import {TweenOneGroup} from 'rc-tween-one'; + + +class ManageCategories extends React.Component { + state = { + loading: false, + searchText: '', + categories: [], + tempElements: [], + inputVisible: false, + inputValue: '', + isAddNewVisible: false, + isEditModalVisible: false, + currentlyEditingId: null, + editingValue: null + }; + + componentDidMount() { + const request = "method=get&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/applications/categories"; + axios.post('https://' + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request + ).then(res => { + if (res.status === 200) { + let categories = JSON.parse(res.data.data); + this.setState({ + categories: categories, + loading: false + }); + } + + }).catch((error) => { + if (error.response.status === 401) { + window.location.href = 'https://localhost:9443/publisher/login'; + } else { + message.warning('Something went wrong'); + + } + this.setState({ + loading: false + }); + }); + } + + handleCloseButton = () => { + this.setState({ + tempElements: [], + isAddNewVisible: false + }); + }; + + deleteCategory = (id) => { + this.setState({ + loading: true + }); + const request = "method=delete&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/admin/applications/categories/" + id; + axios.post('https://' + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request + ).then(res => { + if (res.status === 200) { + notification["success"]({ + message: "Done!", + description: + "Category Removed Successfully!", + }); + + this.setState({ + loading: false + }); + // this.setState({ + // categories: [...categories, ...tempElements], + // tempElements: [], + // inputVisible: false, + // inputValue: '', + // loading: false, + // isAddNewVisible: false + // }); + } + + }).catch((error) => { + if (error.response.hasOwnProperty("status") && error.response.status === 401) { + message.error('You are not logged in'); + window.location.href = 'https://localhost:9443/publisher/login'; + } else { + message.warning('Something went wrong'); + } + this.setState({ + loading: false + }); + }); + }; + + renderElement = (category) => { + const categoryName = category.categoryName; + const tagElem = ( + + {categoryName} + + + { + this.openEditModal(categoryName) + }} style={{color: 'rgba(0,0,0,0.45)'}} type="edit"/> + + + + { + if (category.isCategoryDeletable) { + this.deleteCategory(categoryName); + } else { + notification["error"]({ + message: 'Cannot delete "' + categoryName + '"', + description: + "This category is currently used. Please unassign the category from apps.", + }); + } + }} + okText="Yes" + cancelText="No" + > + + + + + ); + return ( + + {tagElem} + + ); + }; + + renderTempElement = (category) => { + const {tempElements} = this.state; + const tagElem = ( + { + e.preventDefault(); + const remainingElements = tempElements.filter(function (value) { + + return value.categoryName !== category.categoryName; + + }); + this.setState({ + tempElements: remainingElements + }); + }} + > + {category.categoryName} + + ); + return ( + + {tagElem} + + ); + }; + + showInput = () => { + this.setState({inputVisible: true}, () => this.input.focus()); + }; + + handleInputChange = e => { + this.setState({inputValue: e.target.value}); + }; + + handleInputConfirm = () => { + const {inputValue, categories} = this.state; + let {tempElements} = this.state; + if (inputValue) { + if ((categories.findIndex(i => i.categoryName === inputValue) === -1) && (tempElements.findIndex(i => i.categoryName === inputValue) === -1)) { + tempElements = [...tempElements, {categoryName: inputValue, isCategoryDeletable: true}]; + } else { + message.warning('Category already exists'); + } + } + + this.setState({ + tempElements, + inputVisible: false, + inputValue: '', + }); + }; + + handleSave = () => { + const {tempElements, categories} = this.state; + this.setState({ + loading: true + }); + + const dataArray = JSON.stringify(tempElements.map(category => category.categoryName)); + + const request = "method=post&content-type=application/json&payload=" + dataArray + "&api-endpoint=/application-mgt-publisher/v1.0/admin/applications/categories"; + axios.post('https://' + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request + ).then(res => { + if (res.status === 200) { + notification["success"]({ + message: "Done!", + description: + "New Categories were added successfully", + }); + + this.setState({ + categories: [...categories, ...tempElements], + tempElements: [], + inputVisible: false, + inputValue: '', + loading: false, + isAddNewVisible: false + }); + } + + }).catch((error) => { + if (error.response.hasOwnProperty("status") && error.response.status === 401) { + message.error('You are not logged in'); + window.location.href = 'https://localhost:9443/publisher/login'; + } else { + message.warning('Something went wrong'); + } + this.setState({ + loading: false + }); + }); + + + }; + + saveInputRef = input => (this.input = input); + + closeEditModal = e => { + console.log(e); + this.setState({ + isEditModalVisible: false, + currentlyEditingId: null + }); + }; + + openEditModal = (id) => { + this.setState({ + isEditModalVisible: true, + currentlyEditingId: id, + editingValue: id + }) + }; + + editItem = () => { + + const {editingValue, currentlyEditingId, categories} = this.state; + + this.setState({ + loading: true, + isEditModalVisible: false, + }); + const request = "method=put&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/admin/applications/categories?from="+currentlyEditingId+"%26to="+editingValue; + axios.post('https://' + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request + ).then(res => { + if (res.status === 200) { + notification["success"]({ + message: "Done!", + description: + "Category was edited successfully", + }); + + categories[categories.findIndex(i => i.categoryName === currentlyEditingId)].categoryName = editingValue; + + this.setState({ + categories: categories, + loading: false, + editingValue: null + }); + } + + }).catch((error) => { + if (error.response.hasOwnProperty("status") && error.response.status === 401) { + message.error('You are not logged in'); + window.location.href = 'https://localhost:9443/publisher/login'; + } else { + message.warning('Something went wrong'); + } + this.setState({ + loading: false, + editingValue: null + }); + }); + + + }; + + handleEditInputChange = (e) => { + this.setState({ + editingValue: e.target.value + }); + }; + + render() { + const {categories, inputVisible, inputValue, tempElements, isAddNewVisible} = this.state; + const categoriesElements = categories.map(this.renderElement); + const temporaryElements = tempElements.map(this.renderTempElement); + return ( +
+ + + {!isAddNewVisible && + + } + {isAddNewVisible && +
+
+ { + e.target.style = ''; + }, + }} + leave={{opacity: 0, width: 0, scale: 0, duration: 200}} + appear={false} + > + {temporaryElements} + + {inputVisible && ( + + )} + {!inputVisible && ( + + New Category + + )} + +
+
+ + + +
+
+ } + +
+ { + e.target.style = ''; + }, + }} + leave={{opacity: 0, width: 0, scale: 0, duration: 200}} + appear={false} + > + {categoriesElements} + +
+
+
+ + this.editingInput = input} onChange={this.handleEditInputChange}/> + +
+ ); + } +} + +export default ManageCategories; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js new file mode 100644 index 0000000000..726b9225d2 --- /dev/null +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js @@ -0,0 +1,407 @@ +import React from "react"; +import {Card, Tag, message, Icon, Input, notification, Divider, Button, Spin, Tooltip, Popconfirm, Modal} from "antd"; +import axios from "axios"; +import config from "../../../../public/conf/config.json"; +import {TweenOneGroup} from 'rc-tween-one'; + + +class ManageTags extends React.Component { + state = { + loading: false, + searchText: '', + categories: [], + tempElements: [], + inputVisible: false, + inputValue: '', + isAddNewVisible: false, + isEditModalVisible: false, + currentlyEditingId: null, + editingValue: null + }; + + componentDidMount() { + const request = "method=get&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/applications/tags"; + axios.post('https://' + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request + ).then(res => { + if (res.status === 200) { + let categories = JSON.parse(res.data.data); + this.setState({ + categories: categories, + loading: false + }); + } + + }).catch((error) => { + if (error.response.status === 401) { + window.location.href = 'https://localhost:9443/publisher/login'; + } else { + message.warning('Something went wrong'); + + } + this.setState({ + loading: false + }); + }); + } + + handleCloseButton = () => { + this.setState({ + tempElements: [], + isAddNewVisible: false + }); + }; + + deleteCategory = (id) => { + this.setState({ + loading: true + }); + const request = "method=delete&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/admin/applications/categories/" + id; + axios.post('https://' + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request + ).then(res => { + if (res.status === 200) { + notification["success"]({ + message: "Done!", + description: + "Category Removed Successfully!", + }); + + this.setState({ + loading: false + }); + // this.setState({ + // categories: [...categories, ...tempElements], + // tempElements: [], + // inputVisible: false, + // inputValue: '', + // loading: false, + // isAddNewVisible: false + // }); + } + + }).catch((error) => { + if (error.response.hasOwnProperty("status") && error.response.status === 401) { + message.error('You are not logged in'); + window.location.href = 'https://localhost:9443/publisher/login'; + } else { + message.warning('Something went wrong'); + } + this.setState({ + loading: false + }); + }); + }; + + renderElement = (category) => { + const categoryName = category.tagName; + const tagElem = ( + + {categoryName} + + + { + this.openEditModal(categoryName) + }} style={{color: 'rgba(0,0,0,0.45)'}} type="edit"/> + + + + { + if (category.isTagDeletable) { + this.deleteCategory(categoryName); + } else { + notification["error"]({ + message: 'Cannot delete "' + categoryName + '"', + description: + "This category is currently used. Please unassign the category from apps.", + }); + } + }} + okText="Yes" + cancelText="No" + > + + + + + ); + return ( + + {tagElem} + + ); + }; + + renderTempElement = (category) => { + const {tempElements} = this.state; + const tagElem = ( + { + e.preventDefault(); + const remainingElements = tempElements.filter(function (value) { + + return value.categoryName !== category.categoryName; + + }); + this.setState({ + tempElements: remainingElements + }); + }} + > + {category.categoryName} + + ); + return ( + + {tagElem} + + ); + }; + + showInput = () => { + this.setState({inputVisible: true}, () => this.input.focus()); + }; + + handleInputChange = e => { + this.setState({inputValue: e.target.value}); + }; + + handleInputConfirm = () => { + const {inputValue, categories} = this.state; + let {tempElements} = this.state; + if (inputValue) { + if ((categories.findIndex(i => i.categoryName === inputValue) === -1) && (tempElements.findIndex(i => i.categoryName === inputValue) === -1)) { + tempElements = [...tempElements, {categoryName: inputValue, isTagDeletable: true}]; + } else { + message.warning('Category already exists'); + } + } + + this.setState({ + tempElements, + inputVisible: false, + inputValue: '', + }); + }; + + handleSave = () => { + const {tempElements, categories} = this.state; + this.setState({ + loading: true + }); + + const dataArray = JSON.stringify(tempElements.map(category => category.categoryName)); + + const request = "method=post&content-type=application/json&payload=" + dataArray + "&api-endpoint=/application-mgt-publisher/v1.0/admin/applications/categories"; + axios.post('https://' + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request + ).then(res => { + if (res.status === 200) { + notification["success"]({ + message: "Done!", + description: + "New Categories were added successfully", + }); + + this.setState({ + categories: [...categories, ...tempElements], + tempElements: [], + inputVisible: false, + inputValue: '', + loading: false, + isAddNewVisible: false + }); + } + + }).catch((error) => { + if (error.response.hasOwnProperty("status") && error.response.status === 401) { + message.error('You are not logged in'); + window.location.href = 'https://localhost:9443/publisher/login'; + } else { + message.warning('Something went wrong'); + } + this.setState({ + loading: false + }); + }); + + + }; + + saveInputRef = input => (this.input = input); + + closeEditModal = e => { + console.log(e); + this.setState({ + isEditModalVisible: false, + currentlyEditingId: null + }); + }; + + openEditModal = (id) => { + this.setState({ + isEditModalVisible: true, + currentlyEditingId: id, + editingValue: id + }) + }; + + editItem = () => { + + const {editingValue, currentlyEditingId, categories} = this.state; + + this.setState({ + loading: true, + isEditModalVisible: false, + }); + const request = "method=put&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/admin/applications/categories?from="+currentlyEditingId+"%26to="+editingValue; + axios.post('https://' + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invokerUri, request + ).then(res => { + if (res.status === 200) { + notification["success"]({ + message: "Done!", + description: + "Category was edited successfully", + }); + + categories[categories.findIndex(i => i.categoryName === currentlyEditingId)].categoryName = editingValue; + + this.setState({ + categories: categories, + loading: false, + editingValue: null + }); + } + + }).catch((error) => { + if (error.response.hasOwnProperty("status") && error.response.status === 401) { + message.error('You are not logged in'); + window.location.href = 'https://localhost:9443/publisher/login'; + } else { + message.warning('Something went wrong'); + } + this.setState({ + loading: false, + editingValue: null + }); + }); + + + }; + + handleEditInputChange = (e) => { + this.setState({ + editingValue: e.target.value + }); + }; + + render() { + const {categories, inputVisible, inputValue, tempElements, isAddNewVisible} = this.state; + const categoriesElements = categories.map(this.renderElement); + const temporaryElements = tempElements.map(this.renderTempElement); + return ( +
+ + + {!isAddNewVisible && + + } + {isAddNewVisible && +
+
+ { + e.target.style = ''; + }, + }} + leave={{opacity: 0, width: 0, scale: 0, duration: 200}} + appear={false} + > + {temporaryElements} + + {inputVisible && ( + + )} + {!inputVisible && ( + + New Category + + )} + +
+
+ + + +
+
+ } + +
+ { + e.target.style = ''; + }, + }} + leave={{opacity: 0, width: 0, scale: 0, duration: 200}} + appear={false} + > + {categoriesElements} + +
+
+
+ + this.editingInput = input} onChange={this.handleEditInputChange}/> + +
+ ); + } +} + +export default ManageTags; \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/index.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/index.js index 623840107a..4e19de369c 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/index.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/index.js @@ -7,6 +7,7 @@ import Dashboard from "./pages/dashboard/Dashboard"; import Apps from "./pages/dashboard/apps/Apps"; import Release from "./pages/dashboard/apps/release/Release"; import AddNewApp from "./pages/dashboard/add-new-app/AddNewApp"; +import Mange from "./pages/dashboard/manage/Manage"; import './index.css'; import store from "./js/store/index"; import {Provider} from "react-redux"; @@ -39,6 +40,17 @@ const routes = [ component: Release } ] + },{ + path: '/publisher/manage', + exact: false, + component: Dashboard, + routes: [ + { + path: '/publisher/manage', + component: Mange, + exact: true + } + ] } ]; 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 1528c2d873..3b093b9c8d 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,10 +32,10 @@ class Dashboard extends React.Component { style={{lineHeight: '64px'}} > Apps - Apps Add New App + Manage diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/OldApps.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/OldApps.js deleted file mode 100644 index 75750bfc36..0000000000 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/OldApps.js +++ /dev/null @@ -1,226 +0,0 @@ -import React from "react"; -import "antd/dist/antd.css"; -import {Table, Divider, Tag, Card, PageHeader, Typography, Avatar,Input, Button, Icon, Row, Col} from "antd"; -import Highlighter from 'react-highlight-words'; -import axios from "axios"; - -const Paragraph = Typography; -const Search = Input.Search; - -const routes = [ - { - path: 'index', - breadcrumbName: 'Publisher', - }, - { - path: 'first', - breadcrumbName: 'Dashboard', - }, - { - path: 'second', - breadcrumbName: 'OldApps', - }, -]; - - -class OldApps extends React.Component { - routes; - - state = { - searchText: '', - }; - - - constructor(props) { - super(props); - this.routes = props.routes; - this.state = { - data: [] - }; - - this.loadData = this.loadData.bind(this); - } - - loadData(){ - const thisComponent = this; - const request = "method=post&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/applications"; - axios.post('https://localhost:9443/api/application-mgt-handler/v1.0/invoke', request - ).then(res => { - if(res.status === 200){ - console.log(res.status); - let apps = []; - res.data['data']['applications'].forEach(function (app) { - apps.push({ - key: app.id, - icon: app["applicationReleases"][0]["iconPath"], - name: app.name, - platform: 'undefined', - type: app.type, - status: 'undefined', - version: 'undefined', - updated_at: 'undefined' - }); - }); - thisComponent.setState({ - data : apps - }) - } - - }).catch(function (error) { - if(error.response.status === 401){ - window.location.href = 'https://localhost:9443/publisher/login'; - } - }); - } - - componentDidMount() { - this.loadData(); - - } - - getColumnSearchProps = (dataIndex) => ({ - filterDropdown: ({ - setSelectedKeys, selectedKeys, confirm, clearFilters, - }) => ( -
- { this.searchInput = node; }} - placeholder={`Search ${dataIndex}`} - value={selectedKeys[0]} - onChange={e => setSelectedKeys(e.target.value ? [e.target.value] : [])} - onPressEnter={() => this.handleSearch(selectedKeys, confirm)} - style={{ width: 188, marginBottom: 8, display: 'block' }} - /> - - -
- ), - filterIcon: filtered => , - onFilter: (value, record) => record[dataIndex].toString().toLowerCase().includes(value.toLowerCase()), - onFilterDropdownVisibleChange: (visible) => { - if (visible) { - setTimeout(() => this.searchInput.select()); - } - }, - render: (text) => ( - - ), - }); - - handleSearch = (selectedKeys, confirm) => { - confirm(); - this.setState({ searchText: selectedKeys[0] }); - }; - - handleReset = (clearFilters) => { - clearFilters(); - this.setState({ searchText: '' }); - }; - - - render() { - const columns = [{ - title: '', - dataIndex: 'icon', - key: 'icon', - render: text => , - }, { - title: 'Name', - dataIndex: 'name', - key: 'name', - render: text => {text}, - ...this.getColumnSearchProps('name'), - }, { - title: 'Platform', - dataIndex: 'platform', - key: 'platform', - }, { - title: 'Type', - dataIndex: 'type', - key: 'type', - }, { - title: 'Status', - key: 'status', - dataIndex: 'status', - render: tag => { - let color; - switch (tag) { - case 'published': - color = 'green'; - break; - case 'removed': - color = 'red'; - break; - case 'default': - color = 'blue'; - } - return {tag.toUpperCase()}; - }, - }, { - title: 'Published Version', - dataIndex: 'version', - key: 'version', - }, { - title: 'Last Updated', - dataIndex: 'updated_at', - key: 'updated_at', - },{ - title: 'Action', - key: 'action', - render: () => ( - - Edit - - Manage - - ), - }]; - - return ( -
- -
- - - - - console.log(value)} - style={{ width: 200}} - /> - - - - - - - - - - ); - } -} - -export default OldApps; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/manage/Manage.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/manage/Manage.js new file mode 100644 index 0000000000..268400357a --- /dev/null +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/manage/Manage.js @@ -0,0 +1,62 @@ +import React from "react"; +import "antd/dist/antd.css"; +import {PageHeader, Typography, Input, Button, Row, Col} from "antd"; +import ManageCategories from "../../../components/manage/categories/ManageCategories"; +import ManageTags from "../../../components/manage/categories/ManageTags"; + +const {Paragraph} = Typography; + +const routes = [ + { + path: 'index', + breadcrumbName: 'Publisher', + }, + { + path: 'first', + breadcrumbName: 'Dashboard', + }, + { + path: 'second', + breadcrumbName: 'Manage', + }, +]; + + +class Manage extends React.Component { + routes; + + constructor(props) { + super(props); + this.routes = props.routes; + + } + + render() { + return ( +
+ +
+
+ + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo. + +
+
+
+
+ +
+ + +
+ +
+ + ); + } +} + +export default Manage; diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/App.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/App.js index c730379bdb..ce3c10d81c 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/App.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/App.js @@ -15,7 +15,7 @@ class App extends React.Component { } render() { - console.log(this.routes); + // console.log(this.routes); return (
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 c77feb13a5..091dd984a7 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,7 +29,7 @@ class ConnectedAppCard extends React.Component { render() { const app = this.props.app; const release = this.props.app.applicationReleases[0]; - console.log(this.props); + // console.log(this.props); const description = (
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 6430d740e2..b5dad1088c 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 @@ -27,6 +27,8 @@ class ConnectedDetailedRating extends React.Component{ render() { const detailedRating = this.props.detailedRating; + console.log(detailedRating); + if(detailedRating ==null){ return null; } @@ -42,7 +44,15 @@ class ConnectedDetailedRating extends React.Component{ const maximumRating = Math.max(...ratingArray); - console.log(maximumRating); + const ratingBarPercentages = [0,0,0,0,0]; + + if(maximumRating>0){ + for(let i = 0; i<5; i++){ + ratingBarPercentages[i] = (ratingVariety[(i+1).toString()])/maximumRating*100; + } + } + + console.log(ratingBarPercentages); return ( @@ -62,23 +72,23 @@ class ConnectedDetailedRating extends React.Component{
5 - +
4 - +
3 - +
2 - +
1 - +
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.js index 5d45e4cbc7..6cc4442894 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.js @@ -38,7 +38,9 @@ class Reviews extends React.Component { }).catch(function (error) { if (error.response.status === 401) { window.location.href = 'https://localhost:9443/store/login'; + }else{ message.warning('Something went wrong'); + } }); }; @@ -90,8 +92,8 @@ class Reviews extends React.Component { rating: 4, replies: [] }; - console.log(this.state.loadMore); - console.log(this.state.data.length); + // console.log(this.state.loadMore); + // console.log(this.state.data.length); return (
{ diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/AddNewApp.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/AddNewApp.js index e39e079701..f65353d118 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/AddNewApp.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/AddNewApp.js @@ -50,7 +50,7 @@ const props = { onChange(info) { const status = info.file.status; if (status !== 'uploading') { - console.log(info.file, info.fileList); + // console.log(info.file, info.fileList); } if (status === 'done') { message.success(`${info.file.name} file uploaded successfully.`); @@ -98,7 +98,7 @@ class EditableTagGroup extends React.Component { handleClose = (removedTag) => { const tags = this.state.tags.filter(tag => tag !== removedTag); - console.log(tags); + // console.log(tags); this.setState({tags}); } @@ -116,7 +116,7 @@ class EditableTagGroup extends React.Component { if (inputValue && tags.indexOf(inputValue) === -1) { tags = [...tags, inputValue]; } - console.log(tags); + // console.log(tags); this.setState({ tags, inputVisible: false, diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/Step1.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/Step1.js index 24d7194431..9e58ce5c50 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/Step1.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/Step1.js @@ -24,7 +24,7 @@ class EditableTagGroup extends React.Component { handleClose = (removedTag) => { const tags = this.state.tags.filter(tag => tag !== removedTag); - console.log(tags); + // console.log(tags); this.setState({ tags }); } @@ -42,7 +42,7 @@ class EditableTagGroup extends React.Component { if (inputValue && tags.indexOf(inputValue) === -1) { tags = [...tags, inputValue]; } - console.log(tags); + // console.log(tags); this.setState({ tags, inputVisible: false, @@ -92,7 +92,6 @@ class EditableTagGroup extends React.Component { class Step1 extends React.Component { render() { - console.log("hhhoohh"); return (
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/Step2.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/Step2.js index 103da1a9c2..636e2ecb39 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/Step2.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/Step2.js @@ -2,7 +2,6 @@ import React from "react" class Step2 extends React.Component { render() { - console.log("hhhoohh"); return (

tttoooeeee

); diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/Step3.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/Step3.js index 6ddba9f8e2..e9339ed0a5 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/Step3.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/pages/dashboard/add-new-app/Step3.js @@ -2,7 +2,6 @@ import React from "react" class Step3 extends React.Component { render() { - console.log("hhhoohh"); return (

tttoooeeee

);