community/device-mgt-core
1
0
Fork 0
mirror of https://repository.entgra.net/community/device-mgt-core.git synced 2025-10-06 02:01:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'application-mgt-new' into 'application-mgt-new'

Browse Source 
Get configuration with React Context in APPM store

See merge request entgra/carbon-device-mgt!185
This commit is contained in:
Dharmakeerthi Lasantha 2019-07-26 12:30:30 +00:00
commit 7951267a69
23 changed files with 953 additions and 740 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/App.js vendored
View File

@ -3,30 +3,89 @@ import "antd/dist/antd.less";
import RouteWithSubRoutes from "./components/RouteWithSubRoutes"; import RouteWithSubRoutes from "./components/RouteWithSubRoutes";
import { import {
BrowserRouter as Router, BrowserRouter as Router,
Link, Redirect, Switch, Redirect, Switch,
} from 'react-router-dom'; } from 'react-router-dom';
import axios from "axios";
import {Layout, Spin, Result} from "antd";
import ConfigContext from "./context/ConfigContext";
const {Content} = Layout;
const loadingView = (
<Layout>
<Content style={{
padding: '0 0',
paddingTop: 300,
backgroundColor: '#fff',
textAlign: 'center'
}}>
<Spin tip="Loading..."/>
</Content>
</Layout>
);
const errorView = (
<Result
style={{
paddingTop: 200
}}
status="500"
title="Error occurred while loading the configuration"
subTitle="Please refresh your browser window"
/>
);
class App extends React.Component { class App extends React.Component {
routes;
constructor(props) { constructor(props) {
super(props); super(props);
this.routes = props.routes; this.state = {
loading: true,
error: false,
config: {}
}
}
componentDidMount() {
axios.get(
window.location.origin + "/publisher/public/conf/config.json",
).then(res => {
console.log(res);
this.setState({
loading: false,
config: res.data
})
}).catch((error) => {
this.setState({
loading: false,
error: true
})
});
} }
render() { render() {
return ( const {loading, error} = this.state;
const applicationView = (
<Router> <Router>
<ConfigContext.Provider value={this.state.config}>
<div> <div>
<Switch> <Switch>
<Redirect exact from="/publisher" to="/publisher/apps"/> <Redirect exact from="/publisher" to="/publisher/apps"/>
{this.routes.map((route) => ( {this.props.routes.map((route) => (
<RouteWithSubRoutes key={route.path} {...route} /> <RouteWithSubRoutes key={route.path} {...route} />
))} ))}
</Switch> </Switch>
</div> </div>
</ConfigContext.Provider>
</Router> </Router>
);
return (
<div>
{loading && loadingView}
{!loading && !error && applicationView}
{error && errorView}
</div>
); );
} }
} }

11
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js vendored
View File

@ -1,9 +1,9 @@
import React from "react"; import React from "react";
import {Row, Typography, Icon, message, notification} from "antd"; import {Row, Typography, Icon, notification} from "antd";
import StarRatings from "react-star-ratings"; import StarRatings from "react-star-ratings";
import "./DetailedRating.css"; import "./DetailedRating.css";
import config from "../../../../public/conf/config.json";
import axios from "axios"; import axios from "axios";
import {withConfigContext} from "../../../context/ConfigContext";
const { Text } = Typography; const { Text } = Typography;
@ -30,8 +30,9 @@ class DetailedRating extends React.Component{
} }
getData = (type, uuid)=>{ getData = (type, uuid)=>{
const config = this.props.context;
return axios.get( return axios.get(
config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/admin/reviews/"+uuid+"/"+type+"-rating", window.location.origin+ config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/admin/reviews/"+uuid+"/"+type+"-rating",
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
let detailedRating = res.data.data; let detailedRating = res.data.data;
@ -42,7 +43,7 @@ class DetailedRating extends React.Component{
}).catch(function (error) { }).catch(function (error) {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = window.location.origin+'/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -125,4 +126,4 @@ class DetailedRating extends React.Component{
} }
export default DetailedRating; export default withConfigContext(DetailedRating);

39
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppDetailsDrawer/AppDetailsDrawer.js vendored
View File

@ -15,17 +15,17 @@ import {
Card Card
} from 'antd'; } from 'antd';
const {Meta} = Card;
import "../../../../App.css"; import "../../../../App.css";
import DetailedRating from "../../detailed-rating/DetailedRating"; import DetailedRating from "../../detailed-rating/DetailedRating";
import {Link} from "react-router-dom"; import {Link} from "react-router-dom";
import axios from "axios"; import axios from "axios";
import config from "../../../../../public/conf/config.json";
import ReactQuill from "react-quill"; import ReactQuill from "react-quill";
import ReactHtmlParser, {processNodes, convertNodeToElement, htmlparser2} from 'react-html-parser'; import ReactHtmlParser, {processNodes, convertNodeToElement, htmlparser2} from 'react-html-parser';
import "./AppDetailsDrawer.css"; import "./AppDetailsDrawer.css";
import pSBC from "shade-blend-color"; import pSBC from "shade-blend-color";
import {withConfigContext} from "../../../../context/ConfigContext";
const {Meta} = Card;
const {Text, Title} = Typography; const {Text, Title} = Typography;
const {Option} = Select; const {Option} = Select;
@ -91,8 +91,9 @@ class AppDetailsDrawer extends React.Component {
} }
getCategories = () => { getCategories = () => {
const config = this.props.context;
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories" window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories"
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
const categories = JSON.parse(res.data.data); const categories = JSON.parse(res.data.data);
@ -114,7 +115,7 @@ class AppDetailsDrawer extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -130,8 +131,9 @@ class AppDetailsDrawer extends React.Component {
}; };
getTags = () => { getTags = () => {
const config = this.props.context;
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags" window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags"
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
const tags = JSON.parse(res.data.data); const tags = JSON.parse(res.data.data);
@ -153,7 +155,7 @@ class AppDetailsDrawer extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -171,11 +173,12 @@ class AppDetailsDrawer extends React.Component {
// change the app name // change the app name
handleNameSave = name => { handleNameSave = name => {
const config = this.props.context;
const {id} = this.props.app; const {id} = this.props.app;
if (name !== this.state.name && name !== "") { if (name !== this.state.name && name !== "") {
const data = {name: name}; const data = {name: name};
axios.put( axios.put(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id, window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id,
data data
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
@ -192,7 +195,7 @@ class AppDetailsDrawer extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -245,6 +248,7 @@ class AppDetailsDrawer extends React.Component {
// change app categories // change app categories
handleCategorySave = () => { handleCategorySave = () => {
const config = this.props.context;
const {id} = this.props.app; const {id} = this.props.app;
const {temporaryCategories, categories} = this.state; const {temporaryCategories, categories} = this.state;
@ -255,7 +259,7 @@ class AppDetailsDrawer extends React.Component {
if (difference.length !== 0 && temporaryCategories.length !== 0) { if (difference.length !== 0 && temporaryCategories.length !== 0) {
const data = {categories: temporaryCategories}; const data = {categories: temporaryCategories};
axios.put( axios.put(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id, window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id,
data data
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
@ -273,7 +277,7 @@ class AppDetailsDrawer extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -308,6 +312,7 @@ class AppDetailsDrawer extends React.Component {
// change app tags // change app tags
handleTagsSave = () => { handleTagsSave = () => {
const config = this.props.context;
const {id} = this.props.app; const {id} = this.props.app;
const {temporaryTags, tags} = this.state; const {temporaryTags, tags} = this.state;
@ -319,7 +324,7 @@ class AppDetailsDrawer extends React.Component {
if (difference.length !== 0 && temporaryTags.length !== 0) { if (difference.length !== 0 && temporaryTags.length !== 0) {
const data = {tags: temporaryTags}; const data = {tags: temporaryTags};
axios.put( axios.put(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id, window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id,
data data
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
@ -336,7 +341,7 @@ class AppDetailsDrawer extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -353,14 +358,14 @@ class AppDetailsDrawer extends React.Component {
//handle description save //handle description save
handleDescriptionSave = () => { handleDescriptionSave = () => {
const config = this.props.context;
const {id} = this.props.app; const {id} = this.props.app;
const {description, temporaryDescription} = this.state; const {description, temporaryDescription} = this.state;
if (temporaryDescription !== description && temporaryDescription !== "<p><br></p>") { if (temporaryDescription !== description && temporaryDescription !== "<p><br></p>") {
const data = {description: temporaryDescription}; const data = {description: temporaryDescription};
axios.put( axios.put(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id, window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id,
data data
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
@ -377,7 +382,7 @@ class AppDetailsDrawer extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
message.error('Something went wrong... :('); message.error('Something went wrong... :(');
} }
@ -391,6 +396,7 @@ class AppDetailsDrawer extends React.Component {
render() { render() {
const config = this.props.context;
const {app, visible, onClose} = this.props; const {app, visible, onClose} = this.props;
const { const {
name, loading, description, isDescriptionEditEnabled, isCategoriesEditEnabled, name, loading, description, isDescriptionEditEnabled, isCategoriesEditEnabled,
@ -402,7 +408,6 @@ class AppDetailsDrawer extends React.Component {
} }
return ( return (
<div> <div>
<Drawer <Drawer
placement="right" placement="right"
width={640} width={640}
@ -600,4 +605,4 @@ class AppDetailsDrawer extends React.Component {
} }
} }
export default AppDetailsDrawer; export default withConfigContext(AppDetailsDrawer);

21
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/Filters.js vendored
View File

@ -15,7 +15,7 @@ import {
notification notification
} from "antd"; } from "antd";
import axios from "axios"; import axios from "axios";
import config from "../../../../public/conf/config.json"; import {withConfigContext} from "../../../context/ConfigContext";
const {Option} = Select; const {Option} = Select;
const {Title} = Typography; const {Title} = Typography;
@ -62,8 +62,9 @@ class FiltersForm extends React.Component {
} }
getCategories = () => { getCategories = () => {
const config = this.props.context;
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories" window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories"
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
let categories = JSON.parse(res.data.data); let categories = JSON.parse(res.data.data);
@ -75,7 +76,7 @@ class FiltersForm extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -91,8 +92,9 @@ class FiltersForm extends React.Component {
}; };
getTags = () => { getTags = () => {
const config = this.props.context;
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags" window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags"
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
let tags = JSON.parse(res.data.data); let tags = JSON.parse(res.data.data);
@ -104,7 +106,7 @@ class FiltersForm extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -121,8 +123,9 @@ class FiltersForm extends React.Component {
getDeviceTypes = () => { getDeviceTypes = () => {
const config = this.props.context;
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt + "/device-types" window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt + "/device-types"
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
const deviceTypes = JSON.parse(res.data.data); const deviceTypes = JSON.parse(res.data.data);
@ -134,7 +137,7 @@ class FiltersForm extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -293,7 +296,7 @@ class FiltersForm extends React.Component {
} }
const Filters = Form.create({name: 'filter-apps'})(FiltersForm); const Filters = withConfigContext(Form.create({name: 'filter-apps'})(FiltersForm));
export default Filters; export default withConfigContext(Filters);

9
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/ListApps.js vendored
View File

@ -1,16 +1,11 @@
import React from "react"; import React from "react";
import {Avatar, Card, Col, Row, Table, Typography, Input, Divider, Checkbox, Select, Button} from "antd"; import {Card, Col, Row, Typography, Input, Divider} from "antd";
import AppsTable from "./appsTable/AppsTable"; import AppsTable from "./appsTable/AppsTable";
import Filters from "./Filters"; import Filters from "./Filters";
import AppDetailsDrawer from "./AppDetailsDrawer/AppDetailsDrawer"; import AppDetailsDrawer from "./AppDetailsDrawer/AppDetailsDrawer";
const {Option} = Select; const {Title} = Typography;
const {Title, Text} = Typography;
const Search = Input.Search; const Search = Input.Search;
// connecting state.apps with the component
// const mapStateToProps = state => {
// return {apps: state.apps}
// };
class ListApps extends React.Component { class ListApps extends React.Component {

13
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/appsTable/AppsTable.js vendored
View File

@ -2,8 +2,10 @@ import React from "react";
import {Avatar, Table, Tag, Icon, message, notification} from "antd"; import {Avatar, Table, Tag, Icon, message, notification} from "antd";
import axios from "axios"; import axios from "axios";
import pSBC from 'shade-blend-color'; import pSBC from 'shade-blend-color';
import config from "../../../../../public/conf/config.json";
import "./AppsTable.css"; import "./AppsTable.css";
import {withConfigContext} from "../../../../context/ConfigContext";
let config = null;
const columns = [ const columns = [
{ {
@ -74,6 +76,7 @@ class AppsTable extends React.Component {
apps: [], apps: [],
filters: {} filters: {}
}; };
config = this.props.context;
} }
componentDidMount() { componentDidMount() {
@ -114,6 +117,7 @@ class AppsTable extends React.Component {
fetch = (filters,params = {}) => { fetch = (filters,params = {}) => {
this.setState({loading: true}); this.setState({loading: true});
const config = this.props.context;
if(!params.hasOwnProperty("page")){ if(!params.hasOwnProperty("page")){
params.page = 1; params.page = 1;
@ -124,10 +128,9 @@ class AppsTable extends React.Component {
limit: 10, limit: 10,
...filters ...filters
}; };
console.log("f", data);
axios.post( axios.post(
config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/applications", window.location.origin+ config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/applications",
data, data,
).then(res => { ).then(res => {
@ -153,7 +156,7 @@ class AppsTable extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = window.location.origin+'/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -190,4 +193,4 @@ class AppsTable extends React.Component {
} }
} }
export default AppsTable; export default withConfigContext(AppsTable);

5
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/ReleaseView.js vendored
View File

@ -3,14 +3,15 @@ import {Divider, Row, Col, Typography, Button, Drawer, Icon} from "antd";
import StarRatings from "react-star-ratings"; import StarRatings from "react-star-ratings";
import Reviews from "./review/Reviews"; import Reviews from "./review/Reviews";
import "../../../App.css"; import "../../../App.css";
import config from "../../../../public/conf/config.json";
import DetailedRating from "../detailed-rating/DetailedRating"; import DetailedRating from "../detailed-rating/DetailedRating";
import EditRelease from "./edit-release/EditRelease"; import EditRelease from "./edit-release/EditRelease";
import {withConfigContext} from "../../../context/ConfigContext";
const {Title, Text, Paragraph} = Typography; const {Title, Text, Paragraph} = Typography;
class ReleaseView extends React.Component { class ReleaseView extends React.Component {
render() { render() {
const config = this.props.context;
const app = this.props.app; const app = this.props.app;
const release = (app !== null) ? app.applicationReleases[0] : null; const release = (app !== null) ? app.applicationReleases[0] : null;
if (release == null) { if (release == null) {
@ -102,4 +103,4 @@ class ReleaseView extends React.Component {
} }
} }
export default ReleaseView; export default withConfigContext(ReleaseView);

9
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/edit-release/EditRelease.js vendored
View File

@ -1,7 +1,7 @@
import React from "react"; import React from "react";
import {Modal, Button, Icon, notification, Spin, Row, Col, Card, Upload, Input, Switch, Form} from 'antd'; import {Modal, Button, Icon, notification, Spin, Row, Col, Card, Upload, Input, Switch, Form} from 'antd';
import config from "../../../../../public/conf/config.json";
import axios from "axios"; import axios from "axios";
import {withConfigContext} from "../../../../context/ConfigContext";
const {TextArea} = Input; const {TextArea} = Input;
@ -116,6 +116,7 @@ class EditReleaseModal extends React.Component {
handleSubmit = e => { handleSubmit = e => {
e.preventDefault(); e.preventDefault();
const {uuid} = this.props; const {uuid} = this.props;
const config = this.props.context;
const {formConfig} = this.state; const {formConfig} = this.state;
const {specificElements} = formConfig; const {specificElements} = formConfig;
@ -180,7 +181,7 @@ class EditReleaseModal extends React.Component {
data.append("applicationRelease", blob); data.append("applicationRelease", blob);
const url = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications" + formConfig.endpoint + "/" + uuid; const url = window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications" + formConfig.endpoint + "/" + uuid;
axios.put( axios.put(
url, url,
@ -205,7 +206,7 @@ class EditReleaseModal extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "Something went wrong!", message: "Something went wrong!",
@ -412,6 +413,6 @@ class EditReleaseModal extends React.Component {
} }
} }
const EditRelease = Form.create({name: 'add-new-release'})(EditReleaseModal); const EditRelease = withConfigContext(Form.create({name: 'add-new-release'})(EditReleaseModal));
export default EditRelease; export default EditRelease;

16
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/LifeCycle.js vendored
View File

@ -1,16 +1,14 @@
import React from "react"; import React from "react";
import {Typography, Tag, Divider, Select, Button, Modal, message, notification, Collapse} from "antd"; import {Typography, Tag, Divider, Select, Button, Modal, message, notification, Collapse} from "antd";
import axios from "axios"; import axios from "axios";
import config from "../../../../../public/conf/config.json";
import pSBC from "shade-blend-color";
import ReactQuill from 'react-quill'; import ReactQuill from 'react-quill';
import 'react-quill/dist/quill.snow.css'; import 'react-quill/dist/quill.snow.css';
import './LifeCycle.css'; import './LifeCycle.css';
import LifeCycleDetailsModal from "./lifeCycleDetailsModal/lifeCycleDetailsModal"; import LifeCycleDetailsModal from "./lifeCycleDetailsModal/lifeCycleDetailsModal";
import {withConfigContext} from "../../../../context/ConfigContext";
const {Text, Title, Paragraph} = Typography; const {Text, Title, Paragraph} = Typography;
const {Option} = Select; const {Option} = Select;
const Panel = Collapse.Panel;
const modules = { const modules = {
toolbar: [ toolbar: [
@ -57,8 +55,9 @@ class LifeCycle extends React.Component {
fetchData = () => { fetchData = () => {
const config = this.props.context;
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/lifecycle-config" window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/lifecycle-config"
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
const lifecycle = res.data.data; const lifecycle = res.data.data;
@ -69,7 +68,7 @@ class LifeCycle extends React.Component {
}).catch(function (error) { }).catch(function (error) {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -102,6 +101,7 @@ class LifeCycle extends React.Component {
}; };
addLifeCycle = () => { addLifeCycle = () => {
const config = this.props.context;
const {selectedStatus, reasonText} = this.state; const {selectedStatus, reasonText} = this.state;
const {uuid} = this.props; const {uuid} = this.props;
const data = { const data = {
@ -114,7 +114,7 @@ class LifeCycle extends React.Component {
}); });
axios.post( axios.post(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/life-cycle/" + uuid, window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/life-cycle/" + uuid,
data data
).then(res => { ).then(res => {
if (res.status === 201) { if (res.status === 201) {
@ -135,7 +135,7 @@ class LifeCycle extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "Error", message: "Error",
@ -235,4 +235,4 @@ class LifeCycle extends React.Component {
} }
export default LifeCycle; export default withConfigContext(LifeCycle);

9
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/lifeCycleDetailsModal/lifeCycleDetailsModal.js vendored
View File

@ -1,10 +1,9 @@
import React from "react"; import React from "react";
import {Modal, Button, Tag, Collapse, List,Typography} from 'antd'; import {Modal, Button, Tag, List, Typography} from 'antd';
import pSBC from "shade-blend-color"; import pSBC from "shade-blend-color";
import config from "../../../../../../public/conf/config.json"; import {withConfigContext} from "../../../../../context/ConfigContext";
const {Text} = Typography; const {Text} = Typography;
const lifeCycleConfig = config.lifecycle;
class LifeCycleDetailsModal extends React.Component { class LifeCycleDetailsModal extends React.Component {
@ -27,6 +26,8 @@ class LifeCycleDetailsModal extends React.Component {
}; };
render() { render() {
const config = this.props.context;
const lifeCycleConfig = config.lifecycle;
const {lifecycle} = this.props; const {lifecycle} = this.props;
return ( return (
<div> <div>
@ -93,4 +94,4 @@ class LifeCycleDetailsModal extends React.Component {
} }
} }
export default LifeCycleDetailsModal; export default withConfigContext(LifeCycleDetailsModal);

9
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/review/Reviews.js vendored
View File

@ -5,7 +5,7 @@ import "./Reviews.css";
import InfiniteScroll from 'react-infinite-scroller'; import InfiniteScroll from 'react-infinite-scroller';
import SingleReview from "./SingleReview"; import SingleReview from "./SingleReview";
import axios from "axios"; import axios from "axios";
import config from "../../../../../public/conf/config.json"; import {withConfigContext} from "../../../../context/ConfigContext";
const limit = 5; const limit = 5;
@ -27,11 +27,12 @@ class Reviews extends React.Component {
} }
fetchData = (offset, limit, callback) => { fetchData = (offset, limit, callback) => {
const config = this.props.context;
const {uuid, type} = this.props; const {uuid, type} = this.props;
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/reviews/" + type + "/" + uuid window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/reviews/" + type + "/" + uuid
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
let reviews = res.data.data.data; let reviews = res.data.data.data;
@ -40,7 +41,7 @@ class Reviews extends React.Component {
}).catch(function (error) { }).catch(function (error) {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -121,4 +122,4 @@ class Reviews extends React.Component {
} }
} }
export default Reviews; export default withConfigContext(Reviews);

26
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js vendored
View File

@ -17,9 +17,9 @@ import {
Typography Typography
} from "antd"; } from "antd";
import axios from "axios"; import axios from "axios";
import config from "../../../../public/conf/config.json";
import {TweenOneGroup} from 'rc-tween-one'; import {TweenOneGroup} from 'rc-tween-one';
import pSBC from "shade-blend-color"; import pSBC from "shade-blend-color";
import {withConfigContext} from "../../../context/ConfigContext";
const {Title} = Typography; const {Title} = Typography;
@ -38,8 +38,9 @@ class ManageCategories extends React.Component {
}; };
componentDidMount() { componentDidMount() {
const config = this.props.context;
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories", window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories",
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
let categories = JSON.parse(res.data.data); let categories = JSON.parse(res.data.data);
@ -51,7 +52,7 @@ class ManageCategories extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong');
@ -70,11 +71,12 @@ class ManageCategories extends React.Component {
}; };
deleteCategory = (id) => { deleteCategory = (id) => {
const config = this.props.context;
this.setState({ this.setState({
loading: true loading: true
}); });
axios.delete( axios.delete(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories/" + id, window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories/" + id,
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
notification["success"]({ notification["success"]({
@ -98,7 +100,7 @@ class ManageCategories extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -114,6 +116,7 @@ class ManageCategories extends React.Component {
}; };
renderElement = (category) => { renderElement = (category) => {
const config = this.props.context;
const categoryName = category.categoryName; const categoryName = category.categoryName;
const tagElem = ( const tagElem = (
<Tag <Tag
@ -157,6 +160,7 @@ class ManageCategories extends React.Component {
}; };
renderTempElement = (category) => { renderTempElement = (category) => {
const config = this.props.context;
const tagElem = ( const tagElem = (
<Tag <Tag
closable closable
@ -210,6 +214,7 @@ class ManageCategories extends React.Component {
}; };
handleSave = () => { handleSave = () => {
const config = this.props.context;
const {tempElements, categories} = this.state; const {tempElements, categories} = this.state;
this.setState({ this.setState({
loading: true loading: true
@ -218,7 +223,7 @@ class ManageCategories extends React.Component {
const data = tempElements.map(category => category.categoryName); const data = tempElements.map(category => category.categoryName);
axios.post( axios.post(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories", window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories",
data, data,
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
@ -241,7 +246,7 @@ class ManageCategories extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -276,6 +281,7 @@ class ManageCategories extends React.Component {
}; };
editItem = () => { editItem = () => {
const config = this.props.context;
const {editingValue, currentlyEditingId, categories} = this.state; const {editingValue, currentlyEditingId, categories} = this.state;
@ -285,7 +291,7 @@ class ManageCategories extends React.Component {
}); });
axios.put( axios.put(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories/rename?from=" + currentlyEditingId + "&to=" + editingValue, window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/categories/rename?from=" + currentlyEditingId + "&to=" + editingValue,
{}, {},
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
@ -307,7 +313,7 @@ class ManageCategories extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -455,4 +461,4 @@ class ManageCategories extends React.Component {
} }
} }
export default ManageCategories; export default withConfigContext(ManageCategories);

27
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js vendored
View File

@ -16,8 +16,8 @@ import {
Typography Typography
} from "antd"; } from "antd";
import axios from "axios"; import axios from "axios";
import config from "../../../../public/conf/config.json";
import {TweenOneGroup} from 'rc-tween-one'; import {TweenOneGroup} from 'rc-tween-one';
import {withConfigContext} from "../../../context/ConfigContext";
const {Title} = Typography; const {Title} = Typography;
@ -36,8 +36,9 @@ class ManageTags extends React.Component {
}; };
componentDidMount() { componentDidMount() {
const config = this.props.context;
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags", window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags",
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
let tags = JSON.parse(res.data.data); let tags = JSON.parse(res.data.data);
@ -49,7 +50,7 @@ class ManageTags extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -72,13 +73,14 @@ class ManageTags extends React.Component {
}; };
deleteTag = (id) => { deleteTag = (id) => {
const config = this.props.context;
this.setState({ this.setState({
loading: true loading: true
}); });
axios.delete( axios.delete(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/tags/" + id window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/applications/tags/" + id
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
notification["success"]({ notification["success"]({
@ -102,7 +104,7 @@ class ManageTags extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -214,6 +216,7 @@ class ManageTags extends React.Component {
}; };
handleSave = () => { handleSave = () => {
const config = this.props.context;
const {tempElements, tags} = this.state; const {tempElements, tags} = this.state;
this.setState({ this.setState({
loading: true loading: true
@ -221,7 +224,7 @@ class ManageTags extends React.Component {
const data = tempElements.map(tag => tag.tagName); const data = tempElements.map(tag => tag.tagName);
axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags", axios.post(window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags",
data, data,
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
@ -244,7 +247,7 @@ class ManageTags extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -279,6 +282,7 @@ class ManageTags extends React.Component {
}; };
editItem = () => { editItem = () => {
const config = this.props.context;
const {editingValue, currentlyEditingId, tags} = this.state; const {editingValue, currentlyEditingId, tags} = this.state;
@ -288,7 +292,7 @@ class ManageTags extends React.Component {
}); });
axios.put( axios.put(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags/rename?from=" + currentlyEditingId + "&to=" + editingValue, window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags/rename?from=" + currentlyEditingId + "&to=" + editingValue,
{}, {},
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
@ -310,7 +314,7 @@ class ManageTags extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -450,11 +454,12 @@ class ManageTags extends React.Component {
onCancel={this.closeEditModal} onCancel={this.closeEditModal}
onOk={this.editItem} onOk={this.editItem}
> >
<Input value={this.state.editingValue} ref={(input) => this.editingInput = input} onChange={this.handleEditInputChange}/> <Input value={this.state.editingValue} ref={(input) => this.editingInput = input}
onChange={this.handleEditInputChange}/>
</Modal> </Modal>
</div> </div>
); );
} }
} }
export default ManageTags; export default withConfigContext(ManageTags);

542
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/AddNewAppForm.js vendored
View File

@ -2,35 +2,22 @@ import React from "react";
import { import {
Card, Card,
Button, Button,
message, Steps,
Row, Row,
Col, Col,
Input,
Icon,
Select,
Switch,
Form, Form,
Upload, Result,
Divider,
notification, notification,
Spin Spin
} from "antd"; } from "antd";
import axios from "axios"; import axios from "axios";
import {withRouter} from 'react-router-dom' import {withRouter} from 'react-router-dom';
import config from "../../../public/conf/config.json"; import NewAppDetailsForm from "./subForms/NewAppDetailsForm";
import NewAppUploadForm from "./subForms/NewAppUploadForm";
import {withConfigContext} from "../../context/ConfigContext";
const {Option} = Select; const {Step} = Steps;
const {TextArea} = Input;
const InputGroup = Input.Group;
const formItemLayout = {
labelCol: {
span: 5,
},
wrapperCol: {
span: 19,
},
};
class AddNewAppFormComponent extends React.Component { class AddNewAppFormComponent extends React.Component {
@ -43,148 +30,40 @@ class AddNewAppFormComponent extends React.Component {
icons: [], icons: [],
screenshots: [], screenshots: [],
loading: false, loading: false,
binaryFiles: [] binaryFiles: [],
application: null,
release: null,
isError: false
}; };
} }
componentDidMount() { onSuccessApplicationData = (application) => {
this.getCategories();
this.getTags();
}
getCategories = () => {
axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories"
).then(res => {
if (res.status === 200) {
let categories = JSON.parse(res.data.data);
this.setState({ this.setState({
categories: categories, application,
loading: false current: 1
});
}
}).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else {
notification["error"]({
message: "There was a problem",
duration: 0,
description:
"Error occurred while trying to load categories.",
});
}
this.setState({
loading: false
});
}); });
}; };
getTags = () => { onSuccessReleaseData = (releaseData) => {
axios.get( const config = this.props.context;
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags"
).then(res => {
if (res.status === 200) {
let tags = JSON.parse(res.data.data);
this.setState({ this.setState({
tags: tags, loading: true,
loading: false, isError: false
}); });
} const {application} = this.state;
const {data, release} = releaseData;
}).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else {
notification["error"]({
message: "There was a problem",
duration: 0,
description:
"Error occurred while trying to load tags.",
});
}
this.setState({
loading: false
});
});
};
handleCategoryChange = (value) => {
// console.log(`selected ${value}`);
};
handleSubmit = e => {
e.preventDefault();
const {formConfig} = this.props; const {formConfig} = this.props;
const {specificElements} = formConfig;
this.props.form.validateFields((err, values) => {
if (!err) {
this.setState({
loading: true
});
const {name, description, categories, tags, price, isSharedWithAllTenants, binaryFile, icon, screenshots, releaseDescription, releaseType} = values;
const application = {
name,
description,
categories,
subMethod: (price === undefined || parseInt(price) === 0) ? "FREE" : "PAID",
tags,
unrestrictedRoles: [],
};
const data = new FormData();
if (formConfig.installationType !== "WEB_CLIP") {
application.deviceType = values.deviceType;
} else {
application.type = "WEB_CLIP";
application.deviceType = "ALL";
}
if (specificElements.hasOwnProperty("binaryFile")) {
data.append('binaryFile', binaryFile[0].originFileObj);
}
//add release data
const release = {
description: releaseDescription,
price: (price === undefined) ? 0 : parseInt(price),
isSharedWithAllTenants,
metaData: "string",
releaseType: releaseType
};
if (formConfig.installationType !== "WEB_CLIP") {
release.supportedOsVersions = "4.0-10.0";
}
if (specificElements.hasOwnProperty("version")) {
release.version = values.version;
}
if (specificElements.hasOwnProperty("url")) {
release.url = values.url;
}
if (specificElements.hasOwnProperty("packageName")) {
release.packageName = values.packageName;
}
//add release wrapper //add release wrapper
application[formConfig.releaseWrapperName] = [release]; application[formConfig.releaseWrapperName] = [release];
data.append('icon', icon[0].originFileObj);
data.append('screenshot1', screenshots[0].originFileObj);
data.append('screenshot2', screenshots[1].originFileObj);
data.append('screenshot3', screenshots[2].originFileObj);
const json = JSON.stringify(application); const json = JSON.stringify(application);
const blob = new Blob([json], { const blob = new Blob([json], {
type: 'application/json' type: 'application/json'
}); });
data.append(formConfig.jsonPayloadName, blob); data.append(formConfig.jsonPayloadName, blob);
const url = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications" + formConfig.endpoint; const url = window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications" + formConfig.endpoint;
axios.post( axios.post(
url, url,
@ -198,23 +77,19 @@ class AddNewAppFormComponent extends React.Component {
if (res.status === 201) { if (res.status === 201) {
this.setState({ this.setState({
loading: false, loading: false,
current: 2
}); });
} else {
notification["success"]({ this.setState({
message: "Done!", loading: false,
description: isError: true,
"New app was added successfully", current: 2
}); });
this.props.history.push('/publisher/apps');
// window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/apps';
} }
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "Something went wrong!", message: "Something went wrong!",
@ -224,337 +99,66 @@ class AddNewAppFormComponent extends React.Component {
} }
this.setState({ this.setState({
loading: false loading: false,
isError: true,
current: 2
}); });
}); });
}
});
}; };
normFile = e => { onClickBackButton = () => {
if (Array.isArray(e)) { const current = this.state.current - 1;
return e; this.setState({current});
}
return e && e.fileList;
};
handleIconChange = ({fileList}) => this.setState({icons: fileList});
handleBinaryFileChange = ({fileList}) => this.setState({binaryFiles: fileList});
handleScreenshotChange = ({fileList}) => this.setState({screenshots: fileList});
validateIcon = (rule, value, callback) => {
const {icons} = this.state;
if (icons.length !== 1) {
callback("Please select icon file");
}
callback();
}; };
render() { render() {
const {categories, tags, icons, screenshots, loading, binaryFiles} = this.state; const { loading, current, isError} = this.state;
const {getFieldDecorator} = this.props.form;
const {formConfig} = this.props; const {formConfig} = this.props;
return ( return (
<div> <div>
<Spin tip="Uploading..." spinning={loading}> <Spin tip="Uploading..." spinning={loading}>
<Row> <Row>
<Col span={20} offset={2}> <Col span={16} offset={4}>
<Card> <Steps style={{minHeight: 32}} current={current}>
<Form labelAlign="left" layout="horizontal" <Step key="Application" title="Application"/>
hideRequiredMark <Step key="Release" title="Release"/>
onSubmit={this.handleSubmit}> <Step key="Result" title="Result"/>
<Row> </Steps>
<Col span={12}> <Card style={{marginTop: 24}}>
<div> <div style={{display: (current === 0 ? 'unset' : 'none')}}>
<NewAppDetailsForm
{formConfig.installationType !== "WEB_CLIP" && ( formConfig={formConfig}
<Form.Item {...formItemLayout} label="Device Type"> onSuccessApplicationData={this.onSuccessApplicationData}/>
{getFieldDecorator('deviceType', { </div>
rules: [ <div style={{display: (current === 1 ? 'unset' : 'none')}}>
{ <NewAppUploadForm
required: true, formConfig={formConfig}
message: 'Please select device type' onSuccessReleaseData={this.onSuccessReleaseData}
}, onClickBackButton={this.onClickBackButton}/>
{
// validator: this.validateIcon
}
],
}
)(
<Select placeholder="select device type">
<Option key="android">Android</Option>
<Option key="ios">iOS</Option>
</Select>
)}
</Form.Item>
)}
{/*app name*/}
<Form.Item {...formItemLayout} label="App Name">
{getFieldDecorator('name', {
rules: [{
required: true,
message: 'Please input a name'
}],
})(
<Input placeholder="ex: Lorem App"/>
)}
</Form.Item>
{/*description*/}
<Form.Item {...formItemLayout} label="Description">
{getFieldDecorator('description', {
rules: [{
required: true,
message: 'Please enter a description'
}],
})(
<TextArea placeholder="Enter the description..." rows={7}/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Categories">
{getFieldDecorator('categories', {
rules: [{
required: true,
message: 'Please select categories'
}],
})(
<Select
mode="multiple"
style={{width: '100%'}}
placeholder="Select a Category"
onChange={this.handleCategoryChange}
>
{
categories.map(category => {
return (
<Option
key={category.categoryName}>
{category.categoryName}
</Option>
)
})
}
</Select>
)}
</Form.Item>
<Divider/>
<Form.Item {...formItemLayout} label="Tags">
{getFieldDecorator('tags', {
rules: [{
required: true,
message: 'Please select tags'
}],
})(
<Select
mode="tags"
style={{width: '100%'}}
placeholder="Tags"
>
{
tags.map(tag => {
return (
<Option
key={tag.tagName}>
{tag.tagName}
</Option>
)
})
}
</Select>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Meta Data">
<InputGroup>
<Row gutter={8}>
<Col span={10}>
<Input placeholder="Key"/>
</Col>
<Col span={12}>
<Input placeholder="value"/>
</Col>
<Col span={2}>
<Button type="dashed" shape="circle" icon="plus"/>
</Col>
</Row>
</InputGroup>
</Form.Item>
</div> </div>
</Col>
<Col span={12} style={{paddingLeft: 20}}>
<p>Release Data</p>
{formConfig.specificElements.hasOwnProperty("binaryFile") && ( <div style={{display: (current === 2 ? 'unset' : 'none')}}>
<Form.Item {...formItemLayout} label="Application">
{getFieldDecorator('binaryFile', { {!isError && (<Result
valuePropName: 'binaryFile', status="success"
getValueFromEvent: this.normFile, title="Application created successfully!"
required: true, extra={[
message: 'Please select application' <Button type="primary" key="console"
})( onClick={() => this.props.history.push('/publisher/apps')}>
<Upload Go to applications
name="binaryFile"
onChange={this.handleBinaryFileChange}
beforeUpload={() => false}
>
{binaryFiles.length !== 1 && (
<Button>
<Icon type="upload"/> Click to upload
</Button> </Button>
)} ]}
</Upload>, />)}
)}
</Form.Item>
)}
<Form.Item {...formItemLayout} label="Icon"> {isError && (<Result
{getFieldDecorator('icon', { status="500"
valuePropName: 'icon', title="Error occurred while creating the application."
getValueFromEvent: this.normFile, subTitle="Go back to edit the details and submit again."
required: true, extra={<Button onClick={this.onClickBackButton}>Back</Button>}
message: 'Please select a icon' />)}
})( </div>
<Upload
name="logo"
onChange={this.handleIconChange}
beforeUpload={() => false}
>
{icons.length !== 1 && (
<Button>
<Icon type="upload"/> Click to upload
</Button>
)}
</Upload>,
)}
</Form.Item>
<Row style={{marginTop: 40}}>
<Col span={24}>
</Col>
</Row>
<Form.Item {...formItemLayout} label="Screenshots">
{getFieldDecorator('screenshots', {
valuePropName: 'icon',
getValueFromEvent: this.normFile,
required: true,
message: 'Please select a icon'
})(
<Upload
name="screenshots"
onChange={this.handleScreenshotChange}
beforeUpload={() => false}
multiple
>
{screenshots.length < 3 && (
<Button>
<Icon type="upload"/> Click to upload
</Button>
)}
</Upload>,
)}
</Form.Item>
{formConfig.specificElements.hasOwnProperty("packageName") && (
<Form.Item {...formItemLayout} label="Package Name">
{getFieldDecorator('packageName', {
rules: [{
required: true,
message: 'Please input the package name'
}],
})(
<Input placeholder="Package Name"/>
)}
</Form.Item>
)}
{formConfig.specificElements.hasOwnProperty("url") && (
<Form.Item {...formItemLayout} label="URL">
{getFieldDecorator('url', {
rules: [{
required: true,
message: 'Please input the url'
}],
})(
<Input placeholder="url"/>
)}
</Form.Item>
)}
{formConfig.specificElements.hasOwnProperty("version") && (
<Form.Item {...formItemLayout} label="Version">
{getFieldDecorator('version', {
rules: [{
required: true,
message: 'Please input the version'
}],
})(
<Input placeholder="Version"/>
)}
</Form.Item>
)}
<Form.Item {...formItemLayout} label="Release Type">
{getFieldDecorator('releaseType', {
rules: [{
required: true,
message: 'Please input the Release Type'
}],
})(
<Input placeholder="Release Type"/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Description">
{getFieldDecorator('releaseDescription', {
rules: [{
required: true,
message: 'Please enter a description for release'
}],
})(
<TextArea placeholder="Enter a description for release" rows={5}/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Price">
{getFieldDecorator('price', {
rules: [{
required: false
}],
})(
<Input prefix="$" placeholder="00.00"/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Is Shared?">
{getFieldDecorator('isSharedWithAllTenants', {
rules: [{
required: true,
message: 'Please select'
}],
initialValue: false
})(
<Switch checkedChildren={<Icon type="check"/>}
unCheckedChildren={<Icon type="close"/>}
/>
)}
</Form.Item>
</Col>
</Row>
<Form.Item style={{float: "right"}}>
<Button type="primary" htmlType="submit">
Submit
</Button>
</Form.Item>
</Form>
</Card> </Card>
</Col> </Col>
</Row> </Row>
@ -566,4 +170,4 @@ class AddNewAppFormComponent extends React.Component {
} }
const AddNewAppForm = withRouter(Form.create({name: 'add-new-app'})(AddNewAppFormComponent)); const AddNewAppForm = withRouter(Form.create({name: 'add-new-app'})(AddNewAppFormComponent));
export default AddNewAppForm; export default withConfigContext(AddNewAppForm);

268
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/subForms/NewAppDetailsForm.js vendored Normal file
View File

@ -0,0 +1,268 @@
import React from "react";
import {Button, Col, Divider, Form, Icon, Input, notification, Row, Select, Switch, Upload} from "antd";
import axios from "axios";
import {withConfigContext} from "../../../context/ConfigContext";
const formItemLayout = {
labelCol: {
xs: { span: 24 },
sm: { span: 5 },
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 19 },
},
};
const {Option} = Select;
const {TextArea} = Input;
class NewAppDetailsForm extends React.Component {
constructor(props) {
super(props);
this.state = {
categories: [],
tags: []
}
}
handleSubmit = e => {
e.preventDefault();
const {formConfig} = this.props;
const {specificElements} = formConfig;
this.props.form.validateFields((err, values) => {
if (!err) {
this.setState({
loading: true
});
const {name, description, categories, tags, price, isSharedWithAllTenants, binaryFile, icon, screenshots, releaseDescription, releaseType} = values;
const application = {
name,
description,
categories,
subMethod: (price === undefined || parseInt(price) === 0) ? "FREE" : "PAID",
tags,
unrestrictedRoles: [],
};
if (formConfig.installationType !== "WEB_CLIP") {
application.deviceType = values.deviceType;
} else {
application.type = "WEB_CLIP";
application.deviceType = "ALL";
}
this.props.onSuccessApplicationData(application);
}
});
};
componentDidMount() {
this.getCategories();
this.getTags();
}
getCategories = () => {
const config = this.props.context;
axios.get(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories"
).then(res => {
if (res.status === 200) {
let categories = JSON.parse(res.data.data);
this.setState({
categories: categories,
loading: false
});
}
}).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = window.location.origin+ '/publisher/login';
} else {
notification["error"]({
message: "There was a problem",
duration: 0,
description:
"Error occurred while trying to load categories.",
});
}
this.setState({
loading: false
});
});
};
getTags = () => {
const config = this.props.context;
axios.get(
window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags"
).then(res => {
if (res.status === 200) {
let tags = JSON.parse(res.data.data);
this.setState({
tags: tags,
loading: false,
});
}
}).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = window.location.origin+ '/publisher/login';
} else {
notification["error"]({
message: "There was a problem",
duration: 0,
description:
"Error occurred while trying to load tags.",
});
}
this.setState({
loading: false
});
});
};
render() {
const {formConfig} = this.props;
const {categories, tags} = this.state;
const {getFieldDecorator} = this.props.form;
return (
<div>
<Row>
<Col md={5}>
</Col>
<Col md={14}>
<Form
labelAlign="right"
layout="horizontal"
onSubmit={this.handleSubmit}
>
{formConfig.installationType !== "WEB_CLIP" && (
<Form.Item {...formItemLayout} label="Device Type">
{getFieldDecorator('deviceType', {
rules: [
{
required: true,
message: 'Please select device type'
}
],
}
)(
<Select placeholder="select device type">
<Option key="android">Android</Option>
<Option key="ios">iOS</Option>
</Select>
)}
</Form.Item>
)}
{/*app name*/}
<Form.Item {...formItemLayout} label="App Name">
{getFieldDecorator('name', {
rules: [{
required: true,
message: 'Please input a name'
}],
})(
<Input placeholder="ex: Lorem App"/>
)}
</Form.Item>
{/*description*/}
<Form.Item {...formItemLayout} label="Description">
{getFieldDecorator('description', {
rules: [{
required: true,
message: 'Please enter a description'
}],
})(
<TextArea placeholder="Enter the description..." rows={7}/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Categories">
{getFieldDecorator('categories', {
rules: [{
required: true,
message: 'Please select categories'
}],
})(
<Select
mode="multiple"
style={{width: '100%'}}
placeholder="Select a Category"
onChange={this.handleCategoryChange}
>
{
categories.map(category => {
return (
<Option
key={category.categoryName}>
{category.categoryName}
</Option>
)
})
}
</Select>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Tags">
{getFieldDecorator('tags', {
rules: [{
required: true,
message: 'Please select tags'
}],
})(
<Select
mode="tags"
style={{width: '100%'}}
placeholder="Tags"
>
{
tags.map(tag => {
return (
<Option
key={tag.tagName}>
{tag.tagName}
</Option>
)
})
}
</Select>
)}
</Form.Item>
//todo implement add meta data
{/*<Form.Item {...formItemLayout} label="Meta Data">*/}
{/*<InputGroup>*/}
{/*<Row gutter={8}>*/}
{/*<Col span={10}>*/}
{/*<Input placeholder="Key"/>*/}
{/*</Col>*/}
{/*<Col span={12}>*/}
{/*<Input placeholder="value"/>*/}
{/*</Col>*/}
{/*<Col span={2}>*/}
{/*<Button type="dashed" shape="circle" icon="plus"/>*/}
{/*</Col>*/}
{/*</Row>*/}
{/*</InputGroup>*/}
{/*</Form.Item>*/}
<Form.Item style={{float: "right"}}>
<Button type="primary" htmlType="submit">
Next
</Button>
</Form.Item>
</Form>
</Col>
</Row>
</div>
);
}
}
export default withConfigContext(Form.create({name: 'app-details-form'})(NewAppDetailsForm));

323
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/subForms/NewAppUploadForm.js vendored Normal file
View File

@ -0,0 +1,323 @@
import React from "react";
import {Button, Col, Form, Icon, Input, Row, Select, Switch, Upload, InputNumber} from "antd";
const formItemLayout = {
labelCol: {
xs: {span: 24},
sm: {span: 5},
},
wrapperCol: {
xs: {span: 24},
sm: {span: 19},
},
};
const {Option} = Select;
const {TextArea} = Input;
class NewAppUploadForm extends React.Component {
constructor(props) {
super(props);
this.state = {
icons: [],
screenshots: [],
loading: false,
binaryFiles: [],
application: null,
isFree: true
}
}
normFile = e => {
if (Array.isArray(e)) {
return e;
}
return e && e.fileList;
};
handleSubmit = e => {
e.preventDefault();
const {formConfig} = this.props;
const {specificElements} = formConfig;
this.props.form.validateFields((err, values) => {
if (!err) {
this.setState({
loading: true
});
console.log(values);
const {price, isSharedWithAllTenants, binaryFile, icon, screenshots, releaseDescription, releaseType} = values;
//add release data
const release = {
description: releaseDescription,
price: (price === undefined) ? 0 : parseInt(price),
isSharedWithAllTenants,
metaData: "string",
releaseType: releaseType
};
if (formConfig.installationType !== "WEB_CLIP") {
release.supportedOsVersions = "4.0-10.0";
}
if (specificElements.hasOwnProperty("version")) {
release.version = values.version;
}
if (specificElements.hasOwnProperty("url")) {
release.url = values.url;
}
if (specificElements.hasOwnProperty("packageName")) {
release.packageName = values.packageName;
}
const data = new FormData();
if (specificElements.hasOwnProperty("binaryFile")) {
data.append('binaryFile', binaryFile[0].originFileObj);
}
data.append('icon', icon[0].originFileObj);
data.append('screenshot1', screenshots[0].originFileObj);
data.append('screenshot2', screenshots[1].originFileObj);
data.append('screenshot3', screenshots[2].originFileObj);
this.props.onSuccessReleaseData({data, release});
}
});
};
handleIconChange = ({fileList}) => this.setState({icons: fileList});
handleBinaryFileChange = ({fileList}) => this.setState({binaryFiles: fileList});
handleScreenshotChange = ({fileList}) => this.setState({screenshots: fileList});
handlePriceTypeChange = (value) => {
this.setState({
isFree: (value === 'free')
})
};
render() {
const {formConfig} = this.props;
const {getFieldDecorator} = this.props.form;
const {icons, screenshots, binaryFiles, isFree} = this.state;
return (
<div>
<Row>
<Col md={5}>
</Col>
<Col md={14}>
<Form
labelAlign="right"
layout="horizontal"
onSubmit={this.handleSubmit}
>
{formConfig.specificElements.hasOwnProperty("binaryFile") && (
<Form.Item {...formItemLayout} label="Application">
{getFieldDecorator('binaryFile', {
valuePropName: 'binaryFile',
getValueFromEvent: this.normFile,
required: true,
message: 'Please select application'
})(
<Upload
name="binaryFile"
onChange={this.handleBinaryFileChange}
beforeUpload={() => false}
>
{binaryFiles.length !== 1 && (
<Button>
<Icon type="upload"/> Click to upload
</Button>
)}
</Upload>,
)}
</Form.Item>
)}
<Form.Item {...formItemLayout} label="Icon">
{getFieldDecorator('icon', {
valuePropName: 'icon',
getValueFromEvent: this.normFile,
required: true,
message: 'Please select a icon'
})(
<Upload
name="logo"
onChange={this.handleIconChange}
beforeUpload={() => false}
>
{icons.length !== 1 && (
<Button>
<Icon type="upload"/> Click to upload
</Button>
)}
</Upload>,
)}
</Form.Item>
<Row style={{marginTop: 40}}>
<Col span={24}>
</Col>
</Row>
<Form.Item {...formItemLayout} label="Screenshots">
{getFieldDecorator('screenshots', {
valuePropName: 'icon',
getValueFromEvent: this.normFile,
required: true,
message: 'Please select a icon'
})(
<Upload
name="screenshots"
onChange={this.handleScreenshotChange}
beforeUpload={() => false}
multiple
>
{screenshots.length < 3 && (
<Button>
<Icon type="upload"/> Click to upload
</Button>
)}
</Upload>,
)}
</Form.Item>
{formConfig.specificElements.hasOwnProperty("packageName") && (
<Form.Item {...formItemLayout} label="Package Name">
{getFieldDecorator('packageName', {
rules: [{
required: true,
message: 'Please input the package name'
}],
})(
<Input placeholder="Package Name"/>
)}
</Form.Item>
)}
{formConfig.specificElements.hasOwnProperty("url") && (
<Form.Item {...formItemLayout} label="URL">
{getFieldDecorator('url', {
rules: [{
required: true,
message: 'Please input the url'
}],
})(
<Input placeholder="url"/>
)}
</Form.Item>
)}
{formConfig.specificElements.hasOwnProperty("version") && (
<Form.Item {...formItemLayout} label="Version">
{getFieldDecorator('version', {
rules: [{
required: true,
message: 'Please input the version'
}],
})(
<Input placeholder="Version"/>
)}
</Form.Item>
)}
<Form.Item {...formItemLayout} label="Release Type">
{getFieldDecorator('releaseType', {
rules: [{
required: true,
message: 'Please input the Release Type'
}],
})(
<Input placeholder="Release Type"/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Description">
{getFieldDecorator('releaseDescription', {
rules: [{
required: true,
message: 'Please enter a description for release'
}],
})(
<TextArea placeholder="Enter a description for release" rows={5}/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Price Type">
{getFieldDecorator('select', {
rules: [{required: true, message: 'Please select price Type'}],
})(
<Select
placeholder="Please select a price type"
onChange={this.handlePriceTypeChange}>
<Option value="free">Free</Option>
<Option value="paid">Paid</Option>
</Select>,
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Price">
{getFieldDecorator('price', {
rules: [{
required: !isFree
}],
})(
<InputNumber
disabled={isFree}
options={{
initialValue: 1
}}
min={0}
max={10000}
formatter={value => `$ ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')}
parser={value => value.replace(/\$\s?|(,*)/g, '')}
/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Is Shared?">
{getFieldDecorator('isSharedWithAllTenants', {
rules: [{
required: true,
message: 'Please select'
}],
initialValue: false
})(
<Switch checkedChildren={<Icon type="check"/>}
unCheckedChildren={<Icon type="close"/>}
/>
)}
</Form.Item>
<Form.Item style={{float: "right", marginLeft: 8}}>
<Button type="primary" htmlType="submit">
Submit
</Button>
</Form.Item>
<Form.Item style={{float: "right"}}>
<Button htmlType="button" onClick={this.props.onClickBackButton}>
Back
</Button>
</Form.Item>
</Form>
</Col>
</Row>
</div>
);
}
}
export default (Form.create({name: 'app-upload-form'})(NewAppUploadForm));

13
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-release/AddReleaseForm.js vendored
View File

@ -17,7 +17,7 @@ import {
} from "antd"; } from "antd";
import axios from "axios"; import axios from "axios";
import {withRouter} from 'react-router-dom' import {withRouter} from 'react-router-dom'
import config from "../../../public/conf/config.json"; import {withConfigContext} from "../../context/ConfigContext";
const {Option} = Select; const {Option} = Select;
const {TextArea} = Input; const {TextArea} = Input;
@ -47,11 +47,8 @@ class AddNewReleaseFormComponent extends React.Component {
}; };
} }
componentDidMount() {
}
handleSubmit = e => { handleSubmit = e => {
const config = this.props.context;
e.preventDefault(); e.preventDefault();
const {appId} = this.props; const {appId} = this.props;
@ -88,7 +85,7 @@ class AddNewReleaseFormComponent extends React.Component {
data.append("applicationRelease", blob); data.append("applicationRelease", blob);
const url = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/ent-app/" + appId; const url = window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/ent-app/" + appId;
axios.post( axios.post(
url, url,
@ -117,7 +114,7 @@ class AddNewReleaseFormComponent extends React.Component {
}).catch((error) => { }).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "Something went wrong!", message: "Something went wrong!",
@ -299,4 +296,4 @@ class AddNewReleaseFormComponent extends React.Component {
} }
const AddReleaseForm = withRouter(Form.create({name: 'add-new-release'})(AddNewReleaseFormComponent)); const AddReleaseForm = withRouter(Form.create({name: 'add-new-release'})(AddNewReleaseFormComponent));
export default AddReleaseForm; export default withConfigContext(AddReleaseForm);

16
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/context/ConfigContext.js vendored Normal file
View File

@ -0,0 +1,16 @@
import React from "react";
const ConfigContext = React.createContext();
export const withConfigContext = Component => {
return props => (
<ConfigContext.Consumer>
{context => {
return <Component {...props} context={context}/>;
}}
</ConfigContext.Consumer>
);
};
export default ConfigContext;

12
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/Login.js vendored
View File

@ -2,14 +2,15 @@ import React from "react";
import {Typography, Row, Col, Form, Icon, Input, Button, Checkbox, message, notification} from 'antd'; import {Typography, Row, Col, Form, Icon, Input, Button, Checkbox, message, notification} from 'antd';
import './Login.css'; import './Login.css';
import axios from 'axios'; import axios from 'axios';
import config from "../../public/conf/config.json";
import "./Login.css"; import "./Login.css";
import {withConfigContext} from "../context/ConfigContext";
const {Title} = Typography; const {Title} = Typography;
const {Text} = Typography; const {Text} = Typography;
class Login extends React.Component { class Login extends React.Component {
render() { render() {
const config = this.props.context;
return ( return (
<div> <div>
<div className="background"> <div className="background">
@ -57,6 +58,7 @@ class NormalLoginForm extends React.Component {
} }
handleSubmit = (e) => { handleSubmit = (e) => {
const config = this.props.context;
const thisForm = this; const thisForm = this;
e.preventDefault(); e.preventDefault();
this.props.form.validateFields((err, values) => { this.props.form.validateFields((err, values) => {
@ -75,10 +77,10 @@ class NormalLoginForm extends React.Component {
const request = Object.keys(parameters).map(key => key + '=' + parameters[key]).join('&'); const request = Object.keys(parameters).map(key => key + '=' + parameters[key]).join('&');
axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.loginUri, request axios.post(window.location.origin+ config.serverConfig.loginUri, request
).then(res=>{ ).then(res=>{
if (res.status === 200) { if (res.status === 200) {
window.location = res.data.url; window.location = window.location.origin+"publisher";
} }
}).catch(function (error) { }).catch(function (error) {
if (error.hasOwnProperty("response") && error.response.status === 400) { if (error.hasOwnProperty("response") && error.response.status === 400) {
@ -151,6 +153,6 @@ class NormalLoginForm extends React.Component {
} }
} }
const WrappedNormalLoginForm = Form.create({name: 'normal_login'})(NormalLoginForm); const WrappedNormalLoginForm = Form.create({name: 'normal_login'})(withConfigContext(NormalLoginForm));
export default Login; export default withConfigContext(Login);

6
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/Dashboard.js vendored
View File

@ -4,7 +4,7 @@ import {Switch, Link} from "react-router-dom";
import RouteWithSubRoutes from "../../components/RouteWithSubRoutes" import RouteWithSubRoutes from "../../components/RouteWithSubRoutes"
import {Redirect} from 'react-router' import {Redirect} from 'react-router'
import "../../App.css"; import "../../App.css";
import config from "../../../public/conf/config.json"; import {withConfigContext} from "../../context/ConfigContext";
const {Header, Content, Footer} = Layout; const {Header, Content, Footer} = Layout;
const {SubMenu} = Menu; const {SubMenu} = Menu;
@ -15,7 +15,7 @@ class Dashboard extends React.Component {
this.state = { this.state = {
routes: props.routes routes: props.routes
}; };
const config = this.props.context;
this.Logo = config.theme.logo; this.Logo = config.theme.logo;
} }
@ -73,4 +73,4 @@ class Dashboard extends React.Component {
} }
} }
export default Dashboard; export default withConfigContext(Dashboard);

60
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/Apps-old.js vendored
View File

@ -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 (
<div>
<PageHeader
breadcrumb={{routes}}
/>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 780}}>
<Row style={{padding:10}}>
<Col span={6} offset={18}>
<Search
placeholder="search"
// onSearch={value => console.log(value)}
style={{ width: 200}}
/>
<Button style={{margin:5}}>Advanced Search</Button>
</Col>
</Row>
{/*<ReleaseModal/>*/}
<AppList/>
</div>
</div>
);
}
}
export default Apps;

19
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/Apps.js vendored
View File

@ -1,25 +1,6 @@
import React from "react"; import React from "react";
import {PageHeader, Typography,Input, Button, Row, Col} from "antd";
import ListApps from "../../../components/apps/list-apps/ListApps"; import ListApps from "../../../components/apps/list-apps/ListApps";
const Search = Input.Search;
const routes = [
{
path: 'index',
breadcrumbName: 'Publisher',
},
{
path: 'first',
breadcrumbName: 'Dashboard',
},
{
path: 'second',
breadcrumbName: 'Apps',
},
];
class Apps extends React.Component { class Apps extends React.Component {
routes; routes;
constructor(props) { constructor(props) {

9
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/release/Release.js vendored
View File

@ -2,9 +2,9 @@ import React from "react";
import '../../../../App.css'; import '../../../../App.css';
import {Typography, Row, Col, message, Card, notification} from "antd"; import {Typography, Row, Col, message, Card, notification} from "antd";
import axios from 'axios'; import axios from 'axios';
import config from "../../../../../public/conf/config.json";
import ReleaseView from "../../../../components/apps/release/ReleaseView"; import ReleaseView from "../../../../components/apps/release/ReleaseView";
import LifeCycle from "../../../../components/apps/release/lifeCycle/LifeCycle"; import LifeCycle from "../../../../components/apps/release/lifeCycle/LifeCycle";
import {withConfigContext} from "../../../../context/ConfigContext";
const {Title} = Typography; const {Title} = Typography;
@ -43,10 +43,11 @@ class Release extends React.Component {
}; };
fetchData = (uuid) => { fetchData = (uuid) => {
const config = this.props.context;
//send request to the invoker //send request to the invoker
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/release/"+ uuid, window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/release/"+ uuid,
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
const app = res.data.data; const app = res.data.data;
@ -65,7 +66,7 @@ class Release extends React.Component {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
//todo display a popop with error //todo display a popop with error
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = window.location.origin+ '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({
message: "There was a problem", message: "There was a problem",
@ -112,4 +113,4 @@ class Release extends React.Component {
} }
} }
export default Release; export default withConfigContext(Release);