mirror of
https://repository.entgra.net/community/device-mgt-core.git
synced 2025-10-06 02:01:45 +00:00
Changes as per the code review.
This commit is contained in:
Menaka Jayawardena
parent
426dea0afc
commit
cec54c3dc0
@ -16,22 +16,19 @@
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
import Theme from './theme';
|
||||
import React, {Component} from 'react';
|
||||
import AuthHandler from './api/authHandler';
|
||||
import createHistory from 'history/createBrowserHistory';
|
||||
import {BrowserRouter as Router, Redirect, Route, Switch} from 'react-router-dom'
|
||||
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
|
||||
import getMuiTheme from 'material-ui/styles/getMuiTheme';
|
||||
import {
|
||||
ApplicationCreate,
|
||||
ApplicationEdit,
|
||||
ApplicationListing,
|
||||
BaseLayout,
|
||||
Login,
|
||||
NotFound,
|
||||
PlatformCreate,
|
||||
PlatformListing,
|
||||
ApplicationEdit
|
||||
PlatformListing
|
||||
} from './components';
|
||||
|
||||
|
||||
@ -64,19 +61,13 @@ class Base extends Component {
|
||||
if (!AuthHandler.isTokenExpired()) {
|
||||
this.setState({user: user});
|
||||
} else {
|
||||
console.log("expired!");
|
||||
this.setState({user: null});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
|
||||
}
|
||||
|
||||
render() {
|
||||
if (this.state.user !== null) {
|
||||
console.log("Have User.");
|
||||
return (
|
||||
<div>
|
||||
<BaseLayout user={this.state.user}>
|
||||
@ -98,7 +89,6 @@ class Base extends Component {
|
||||
</div>
|
||||
)
|
||||
} else {
|
||||
console.log("No user");
|
||||
return (<Redirect to={"/login"}/>)
|
||||
}
|
||||
|
||||
@ -119,61 +109,18 @@ class Publisher extends Component {
|
||||
selectedType: null,
|
||||
selectedTheme: null
|
||||
};
|
||||
this.setTheme = this.setTheme.bind(this);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
/**
|
||||
*Loading the theme files based on the the user-preference.
|
||||
*/
|
||||
let themeConfig = Theme.loadThemeConfigs();
|
||||
themeConfig.then(this.setTheme).catch(function (error) {
|
||||
console.log(error);
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* To set the theme based on the configuration file.
|
||||
* @param response Configuration file data.
|
||||
*/
|
||||
setTheme(response) {
|
||||
this.setState({
|
||||
selectedType: response.data.theme.type,
|
||||
selectedTheme: response.data.theme.value
|
||||
});
|
||||
|
||||
Theme.currentThemeType = this.state.selectedType;
|
||||
Theme.currentTheme = this.state.selectedTheme;
|
||||
Theme.selectedTheme =
|
||||
(Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
|
||||
|
||||
if (this.state.selectedType === "default") {
|
||||
let defaultTheme = require("material-ui/styles/baseThemes/" + this.state.selectedTheme);
|
||||
this.setState({
|
||||
muiTheme: getMuiTheme(defaultTheme.default)
|
||||
});
|
||||
} else {
|
||||
let customTheme = require("./themes/" + this.state.selectedTheme);
|
||||
this.setState({
|
||||
muiTheme: getMuiTheme(customTheme.default)
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div className="App">
|
||||
<MuiThemeProvider>
|
||||
<Router basename="publisher" history={history}>
|
||||
<Switch>
|
||||
<Route path="/login" component={Login}/>
|
||||
<Route path="/logout" component={Login}/>
|
||||
<Route component={Base}/>
|
||||
</Switch>
|
||||
</Router>
|
||||
</MuiThemeProvider>
|
||||
<Router basename="publisher" history={history}>
|
||||
<Switch>
|
||||
<Route path="/login" component={Login}/>
|
||||
<Route path="/logout" component={Login}/>
|
||||
<Route component={Base}/>
|
||||
</Switch>
|
||||
</Router>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -88,7 +88,7 @@ class BaseLayout extends Component {
|
||||
id="search"
|
||||
name="search"
|
||||
placeholder={'Search for Applications'}
|
||||
onChange={(event) => console.log(event.target.value)}
|
||||
onChange={(event) => console.log(event.target.value)} //TODO: Remove this
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -16,7 +16,6 @@
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
import Theme from '../../theme';
|
||||
import React, {Component} from 'react';
|
||||
import {withRouter} from 'react-router-dom';
|
||||
import {Button, Col, Row, Table} from 'reactstrap';
|
||||
@ -48,13 +47,13 @@ class ApplicationListing extends Component {
|
||||
application: {},
|
||||
drawer: {},
|
||||
appListStyle: {},
|
||||
//TODO: Remove this declaration.
|
||||
image: [{id: "1", src: "https://www.greenfoot.org/images/logos/macos.png"},
|
||||
{
|
||||
id: "2",
|
||||
src: "http://dl1.cbsistatic.com/i/r/2016/08/08/0e67e43a-5a45-41ab-b81d-acfba8708044/resize/736x552/0c0ee669677b5060a0fa1bfb0c7873b4/android-logo-promo-470.png"
|
||||
}]
|
||||
};
|
||||
this.scriptId = "application-listing";
|
||||
}
|
||||
|
||||
headers = [
|
||||
@ -126,10 +125,6 @@ class ApplicationListing extends Component {
|
||||
|
||||
componentWillMount() {
|
||||
|
||||
/**
|
||||
*Loading the theme files based on the the user-preference.
|
||||
*/
|
||||
Theme.insertThemingScripts(this.scriptId);
|
||||
// let getApps = ApplicationMgtApi.getApplications();
|
||||
// getApps.then(response => {
|
||||
// let apps = this.setData(response.data.applications);
|
||||
@ -199,7 +194,6 @@ class ApplicationListing extends Component {
|
||||
}
|
||||
|
||||
onRowClick() {
|
||||
console.log("sfsdfsdf");
|
||||
let style = {
|
||||
width: '500px',
|
||||
marginLeft: '500px'
|
||||
@ -226,8 +220,6 @@ class ApplicationListing extends Component {
|
||||
return image.id !== imageId
|
||||
|
||||
});
|
||||
console.log(rem);
|
||||
|
||||
this.setState({image: rem});
|
||||
}
|
||||
|
||||
|
||||
@ -37,13 +37,13 @@ class ApplicationCreate extends Component {
|
||||
this.scriptId = "application-create";
|
||||
this.setStepData = this.setStepData.bind(this);
|
||||
this.removeStepData = this.removeStepData.bind(this);
|
||||
this.handleSubmit = this.handleSubmit.bind(this);
|
||||
this.onSubmit = this.onSubmit.bind(this);
|
||||
this.handleCancel = this.handleCancel.bind(this);
|
||||
this.handleYes = this.handleYes.bind(this);
|
||||
this.handleNo = this.handleNo.bind(this);
|
||||
this.handlePrev = this.handlePrev.bind(this);
|
||||
this.handleNext = this.handleNext.bind(this);
|
||||
this.close = this.close.bind(this);
|
||||
this.onPrevClick = this.onPrevClick.bind(this);
|
||||
this.onNextClick = this.onNextClick.bind(this);
|
||||
this.onClose = this.onClose.bind(this);
|
||||
this.state = {
|
||||
finished: false,
|
||||
stepIndex: 0,
|
||||
@ -60,20 +60,16 @@ class ApplicationCreate extends Component {
|
||||
this.setState({open: this.props.open});
|
||||
}
|
||||
|
||||
close() {
|
||||
this.props.close();
|
||||
}
|
||||
|
||||
handleBack() {
|
||||
let currentStep = this.state.stepIndex;
|
||||
let nextStep = currentStep === 0 ? currentStep : currentStep - 1;
|
||||
this.setState({stepIndex: nextStep}, console.log(this.state.stepIndex));
|
||||
onClose() {
|
||||
this.setState({stepIndex: 0}, this.props.close());
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Handles next button click event.
|
||||
* */
|
||||
handleNext() {
|
||||
onNextClick() {
|
||||
console.log("Handle Next"); //TODO: Remove this
|
||||
const {stepIndex} = this.state;
|
||||
this.setState({
|
||||
@ -85,7 +81,7 @@ class ApplicationCreate extends Component {
|
||||
/**
|
||||
* Handles form submit.
|
||||
* */
|
||||
handleSubmit() {
|
||||
onSubmit() {
|
||||
let stepData = this.state.stepData;
|
||||
let applicationCreationPromise = ApplicationMgtApi.createApplication(stepData);
|
||||
applicationCreationPromise.then(response => {
|
||||
@ -110,7 +106,7 @@ class ApplicationCreate extends Component {
|
||||
* Handled [ < Prev ] button click.
|
||||
* This clears the data in the current step and returns to the previous step.
|
||||
* */
|
||||
handlePrev() {
|
||||
onPrevClick() {
|
||||
const {stepIndex} = this.state;
|
||||
if (stepIndex > 0) {
|
||||
this.removeStepData();
|
||||
@ -128,7 +124,7 @@ class ApplicationCreate extends Component {
|
||||
let tmpStepData = this.state.stepData;
|
||||
tmpStepData.push({step: step, data: data});
|
||||
|
||||
this.setState({stepData: tmpStepData}, this.handleNext())
|
||||
this.setState({stepData: tmpStepData}, this.onNextClick())
|
||||
};
|
||||
|
||||
/**
|
||||
@ -170,7 +166,7 @@ class ApplicationCreate extends Component {
|
||||
case 0:
|
||||
return (
|
||||
<Step1
|
||||
handleNext={this.handleNext}
|
||||
handleNext={this.onNextClick}
|
||||
setData={this.setStepData}
|
||||
removeData={this.removeStepData}
|
||||
/>
|
||||
@ -178,8 +174,8 @@ class ApplicationCreate extends Component {
|
||||
case 1:
|
||||
return (
|
||||
<Step2
|
||||
handleNext={this.handleNext}
|
||||
handlePrev={this.handlePrev}
|
||||
handleNext={this.onNextClick}
|
||||
handlePrev={this.onPrevClick}
|
||||
setData={this.setStepData}
|
||||
removeData={this.removeStepData}
|
||||
/>
|
||||
@ -187,8 +183,8 @@ class ApplicationCreate extends Component {
|
||||
case 2:
|
||||
return (
|
||||
<Step3
|
||||
handleFinish={this.handleNext}
|
||||
handlePrev={this.handlePrev}
|
||||
handleFinish={this.onNextClick}
|
||||
handlePrev={this.onPrevClick}
|
||||
setData={this.setStepData}
|
||||
removeData={this.removeStepData}
|
||||
/>
|
||||
@ -196,7 +192,7 @@ class ApplicationCreate extends Component {
|
||||
case 3: {
|
||||
return (
|
||||
<Step4
|
||||
handleNext={this.handleNext}
|
||||
handleNext={this.onNextClick}
|
||||
setData={this.setStepData}
|
||||
removeData={this.removeStepData}
|
||||
/>
|
||||
@ -225,17 +221,17 @@ class ApplicationCreate extends Component {
|
||||
</Row>
|
||||
<Row>
|
||||
<Col>
|
||||
{this.getStepContent(this.state.stepIndex)}
|
||||
{this.getStepContent(stepIndex)}
|
||||
</Col>
|
||||
</Row>
|
||||
</ModalBody>
|
||||
<ModalFooter>
|
||||
{this.state.stepIndex === 0 ? <div/> :
|
||||
<Button color="primary" onClick={this.handlePrev}>Back</Button>}
|
||||
<Button color="secondary" onClick={this.close}>Cancel</Button>
|
||||
{this.state.finished ?
|
||||
<Button color="primary" onClick={this.handleSubmit}>Finish</Button> :
|
||||
<Button color="primary" onClick={this.handleNext}>Continue</Button>}
|
||||
{stepIndex === 0 ? <div/> :
|
||||
<Button color="primary" onClick={this.onPrevClick}>Back</Button>}
|
||||
<Button color="secondary" onClick={this.onClose}>Cancel</Button>
|
||||
{finished ?
|
||||
<Button color="primary" onClick={this.onSubmit}>Finish</Button> :
|
||||
<Button color="primary" onClick={this.onNextClick}>Continue</Button>}
|
||||
</ModalFooter>
|
||||
</Modal>
|
||||
</div>);
|
||||
|
||||
@ -33,8 +33,8 @@ import {Badge, FormGroup, Input, Label} from 'reactstrap';
|
||||
*
|
||||
* Parent Component: Create
|
||||
* Props:
|
||||
* * handleNext : {type: function, Invokes handleNext function in Parent.}
|
||||
* * handlePrev : {type: function, Invokes handlePrev function in Parent}
|
||||
* * onNextClick : {type: function, Invokes onNextClick function in Parent.}
|
||||
* * onPrevClick : {type: function, Invokes onPrevClick function in Parent}
|
||||
* * setData : {type: function, Invokes setStepData function in Parent}
|
||||
* * removeData : {type: Invokes removeStepData function in Parent}
|
||||
* */
|
||||
@ -55,7 +55,6 @@ class Step1 extends Component {
|
||||
identifier: "",
|
||||
shortDescription: ""
|
||||
};
|
||||
this.scriptId = "application-create-step2";
|
||||
}
|
||||
|
||||
/**
|
||||
@ -81,27 +80,6 @@ class Step1 extends Component {
|
||||
this.setState({defValue: defaultValue})
|
||||
}
|
||||
|
||||
/**
|
||||
* Invokes the handleNext function in Create component.
|
||||
* */
|
||||
handleNext() {
|
||||
let fields = [{name: "Title", value: this.state.title},
|
||||
{name: "Short Description", value: this.state.shortDescription},
|
||||
{name: "Description", value: this.state.description},
|
||||
{name: "Banner", value: this.state.banner},
|
||||
{name: "Screenshots", value: this.state.screenshots},
|
||||
{name: "Identifier", value: this.state.identifier},
|
||||
{name: "Icon", value: this.state.icon}];
|
||||
this.validate(fields);
|
||||
}
|
||||
|
||||
/**
|
||||
* Invokes the handlePrev function in Create component.
|
||||
* */
|
||||
handlePrev() {
|
||||
this.props.handlePrev();
|
||||
}
|
||||
|
||||
/**
|
||||
* Handles Chip delete function.
|
||||
* Removes the tag from state.tags
|
||||
@ -114,94 +92,12 @@ class Step1 extends Component {
|
||||
this.setState({tags: this.chipData});
|
||||
};
|
||||
|
||||
/**
|
||||
* Validate the form.
|
||||
* */
|
||||
validate(fields) {
|
||||
let errors = {};
|
||||
let errorsPresent = false;
|
||||
fields.forEach(function (field) {
|
||||
switch (field.name) {
|
||||
case 'Title': {
|
||||
if (field.value === "") {
|
||||
errors[field.name] = field.name + " is required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Identifier': {
|
||||
if (field.value === "") {
|
||||
errors[field.name] = field.name + " is required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Short Description': {
|
||||
if (field.value === "") {
|
||||
errors[field.name] = field.name + " is required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Description': {
|
||||
if (field.value === "") {
|
||||
errors[field.name] = field.name + " is required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Banner': {
|
||||
if (field.value.length === 0) {
|
||||
errors[field.name] = field.name + " is required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Icon': {
|
||||
if (field.value.length === 0) {
|
||||
errors[field.name] = field.name + " is required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Screenshots': {
|
||||
if (field.value.length < 3) {
|
||||
errors[field.name] = "3 " + field.name + " are required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (!errorsPresent) {
|
||||
this.setStepData();
|
||||
} else {
|
||||
this.setState({errors: errors}, console.log(errors));
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Creates an object with the current step data and persist in the parent.
|
||||
* */
|
||||
setStepData() {
|
||||
let stepData = {};
|
||||
|
||||
this.props.setData("step2", {step: stepData});
|
||||
this.props.setData("step1", {step: stepData});
|
||||
};
|
||||
|
||||
/**
|
||||
|
||||
@ -31,7 +31,7 @@ import {FormGroup, Input, Label} from 'reactstrap';
|
||||
*
|
||||
* Parent Component: Create
|
||||
* Props:
|
||||
* 1. handleNext: {type: function, Invokes handleNext function of parent component}
|
||||
* 1. onNextClick: {type: function, Invokes onNextClick function of parent component}
|
||||
* 2. setData : {type: function, Sets current form data to the state of the parent component}
|
||||
* 3. removeData: {type: function, Invokes the removeStepData function click of parent}
|
||||
* */
|
||||
@ -40,7 +40,6 @@ class Step2 extends Component {
|
||||
super();
|
||||
this.setPlatforms = this.setPlatforms.bind(this);
|
||||
this.setStepData = this.setStepData.bind(this);
|
||||
this.cancel = this.cancel.bind(this);
|
||||
this.platforms = [];
|
||||
this.state = {
|
||||
finished: false,
|
||||
@ -53,7 +52,6 @@ class Step2 extends Component {
|
||||
title: "",
|
||||
titleError: ""
|
||||
};
|
||||
this.scriptId = "application-create-step1";
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
@ -84,17 +82,11 @@ class Step2 extends Component {
|
||||
* Persist the current form data to the state.
|
||||
* */
|
||||
setStepData() {
|
||||
console.log("Platforms", this.state.platforms);
|
||||
let step = {
|
||||
store: this.state.store,
|
||||
platform: this.state.platforms[this.state.platformSelectedIndex]
|
||||
};
|
||||
console.log(step);
|
||||
this.props.setData("step1", {step: step});
|
||||
}
|
||||
|
||||
cancel() {
|
||||
|
||||
this.props.setData("step2", {step: step});
|
||||
}
|
||||
|
||||
/**
|
||||
@ -106,8 +98,6 @@ class Step2 extends Component {
|
||||
let selectedPlatform = this.state.platforms.filter((platform) => {
|
||||
return platform.identifier === id;
|
||||
});
|
||||
console.log(selectedPlatform);
|
||||
|
||||
this.setState({platform: selectedPlatform});
|
||||
};
|
||||
|
||||
@ -115,7 +105,6 @@ class Step2 extends Component {
|
||||
* Triggers when changing the Store selection.
|
||||
* */
|
||||
onChangeStore(event) {
|
||||
console.log(event.target.value);
|
||||
this.setState({store: event.target.value});
|
||||
};
|
||||
|
||||
@ -128,7 +117,6 @@ class Step2 extends Component {
|
||||
<Input
|
||||
type="select"
|
||||
name="store"
|
||||
id="store"
|
||||
className="input-custom"
|
||||
onChange={this.onChangeStore.bind(this)}
|
||||
>
|
||||
@ -141,7 +129,6 @@ class Step2 extends Component {
|
||||
<Input
|
||||
type="select"
|
||||
name="store"
|
||||
id="store"
|
||||
onChange={this.onChangePlatform.bind(this)}
|
||||
>
|
||||
{this.state.platforms.length > 0 ? this.state.platforms.map(platform => {
|
||||
|
||||
@ -34,8 +34,8 @@ import AppImage from "../../../UIComponents/AppImage/AppImage";
|
||||
*
|
||||
* Parent Component: Create
|
||||
* Props:
|
||||
* * handleNext : {type: function, Invokes handleNext function in Parent.}
|
||||
* * handlePrev : {type: function, Invokes handlePrev function in Parent}
|
||||
* * onNextClick : {type: function, Invokes onNextClick function in Parent.}
|
||||
* * onPrevClick : {type: function, Invokes onPrevClick function in Parent}
|
||||
* * setData : {type: function, Invokes setStepData function in Parent}
|
||||
* * removeData : {type: Invokes removeStepData function in Parent}
|
||||
* */
|
||||
@ -56,52 +56,6 @@ class Step3 extends Component {
|
||||
identifier: "",
|
||||
shortDescription: ""
|
||||
};
|
||||
this.scriptId = "application-create-step2";
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Create a tag on Enter key press and set it to the state.
|
||||
* Clears the tags text field.
|
||||
* Chip gets two parameters: Key and value.
|
||||
* */
|
||||
addTags(event) {
|
||||
let tags = this.state.tags;
|
||||
if (event.charCode === 13) {
|
||||
event.preventDefault();
|
||||
tags.push({key: Math.floor(Math.random() * 1000), value: event.target.value});
|
||||
this.setState({tags, defValue: ""}, console.log(tags));
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the value for tag.
|
||||
* */
|
||||
handleTagChange(event) {
|
||||
let defaultValue = this.state.defValue;
|
||||
defaultValue = event.target.value;
|
||||
this.setState({defValue: defaultValue})
|
||||
}
|
||||
|
||||
/**
|
||||
* Invokes the handleNext function in Create component.
|
||||
* */
|
||||
handleNext() {
|
||||
let fields = [{name: "Title", value: this.state.title},
|
||||
{name: "Short Description", value: this.state.shortDescription},
|
||||
{name: "Description", value: this.state.description},
|
||||
{name: "Banner", value: this.state.banner},
|
||||
{name: "Screenshots", value: this.state.screenshots},
|
||||
{name: "Identifier", value: this.state.identifier},
|
||||
{name: "Icon", value: this.state.icon}];
|
||||
this.validate(fields);
|
||||
}
|
||||
|
||||
/**
|
||||
* Invokes the handlePrev function in Create component.
|
||||
* */
|
||||
handlePrev() {
|
||||
this.props.handlePrev();
|
||||
}
|
||||
|
||||
/**
|
||||
@ -110,170 +64,30 @@ class Step3 extends Component {
|
||||
* */
|
||||
handleRequestDelete(event) {
|
||||
this.chipData = this.state.tags;
|
||||
console.log(event.target);
|
||||
console.log(event.target); //TODO: Remove Console log.
|
||||
const chipToDelete = this.chipData.map((chip) => chip.value).indexOf(event.target.value);
|
||||
this.chipData.splice(chipToDelete, 1);
|
||||
this.setState({tags: this.chipData});
|
||||
};
|
||||
|
||||
/**
|
||||
* Creates Chip array from state.tags.
|
||||
* */
|
||||
renderChip(data) {
|
||||
return (
|
||||
<Chip
|
||||
key={data.key}
|
||||
onRequestDelete={() => this.handleRequestDelete(data.key)}
|
||||
className="applicationCreateChip">
|
||||
{data.value}
|
||||
</Chip>
|
||||
);
|
||||
}
|
||||
|
||||
onVisibilitySelect(event, index, value) {
|
||||
console.log(value);
|
||||
let comp = <SelectField> <MenuItem value={0} primaryText="Public"/>
|
||||
<MenuItem value={1} primaryText="Roles"/>
|
||||
<MenuItem value={2} primaryText="Devices"/> </SelectField>;
|
||||
if (value === 1) {
|
||||
this.setState({visibilityComponent: comp});
|
||||
} else if (value === 2) {
|
||||
|
||||
} else {
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Validate the form.
|
||||
* */
|
||||
validate(fields) {
|
||||
let errors = {};
|
||||
let errorsPresent = false;
|
||||
fields.forEach(function (field) {
|
||||
switch (field.name) {
|
||||
case 'Title': {
|
||||
if (field.value === "") {
|
||||
errors[field.name] = field.name + " is required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Identifier': {
|
||||
if (field.value === "") {
|
||||
errors[field.name] = field.name + " is required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Short Description': {
|
||||
if (field.value === "") {
|
||||
errors[field.name] = field.name + " is required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Description': {
|
||||
if (field.value === "") {
|
||||
errors[field.name] = field.name + " is required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Banner': {
|
||||
if (field.value.length === 0) {
|
||||
errors[field.name] = field.name + " is required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Icon': {
|
||||
if (field.value.length === 0) {
|
||||
errors[field.name] = field.name + " is required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'Screenshots': {
|
||||
if (field.value.length < 3) {
|
||||
errors[field.name] = "3 " + field.name + " are required!";
|
||||
errorsPresent = true;
|
||||
} else {
|
||||
errorsPresent = false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (!errorsPresent) {
|
||||
this.setStepData();
|
||||
} else {
|
||||
this.setState({errors: errors}, console.log(errors));
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Creates an object with the current step data and persist in the parent.
|
||||
* */
|
||||
setStepData() {
|
||||
let stepData = {
|
||||
icon: this.state.icon,
|
||||
name: this.state.name,
|
||||
tags: this.state.tags,
|
||||
banner: this.state.banner,
|
||||
category: this.categories[this.state.category],
|
||||
identifier: this.state.identifier,
|
||||
screenshots: this.state.screenshots,
|
||||
description: this.state.description,
|
||||
shortDescription: this.state.shortDescription
|
||||
screenshots: this.state.screenshots
|
||||
};
|
||||
|
||||
this.props.setData("step2", {step: stepData});
|
||||
};
|
||||
|
||||
/**
|
||||
* Set text field values to state.
|
||||
* */
|
||||
onTextFieldChange(event, value) {
|
||||
let field = event.target.id;
|
||||
switch (field) {
|
||||
case "name": {
|
||||
this.setState({name: value});
|
||||
break;
|
||||
}
|
||||
case "shortDescription": {
|
||||
this.setState({shortDescription: value});
|
||||
break;
|
||||
}
|
||||
case "description": {
|
||||
this.setState({description: value});
|
||||
break;
|
||||
}
|
||||
case "identifier": {
|
||||
this.setState({identifier: value});
|
||||
break;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Removed user uploaded banner.
|
||||
* */
|
||||
removeBanner(event, d) {
|
||||
console.log(event, d);
|
||||
console.log(event, d); //TODO: Remove this
|
||||
this.setState({banner: []});
|
||||
};
|
||||
|
||||
@ -288,11 +102,11 @@ class Step3 extends Component {
|
||||
* Removes selected screenshot.
|
||||
* */
|
||||
removeScreenshot(event) {
|
||||
console.log(event.target)
|
||||
console.log(event.target) //TODO: Remove this.
|
||||
};
|
||||
|
||||
//TODO: Remove inline css.
|
||||
render() {
|
||||
console.log(this.state.visibilityComponent);
|
||||
return (
|
||||
<div className="createStep2Content">
|
||||
<div>
|
||||
@ -312,7 +126,7 @@ class Step3 extends Component {
|
||||
onDrop={(screenshots, rejected) => {
|
||||
let tmpScreenshots = this.state.screenshots;
|
||||
tmpScreenshots.push(screenshots);
|
||||
console.log(screenshots);
|
||||
console.log(screenshots); //TODO: Remove this
|
||||
this.setState({
|
||||
screenshots: tmpScreenshots
|
||||
});
|
||||
|
||||
@ -38,8 +38,8 @@ import Switch from '../../../UIComponents/Switch/Switch'
|
||||
*
|
||||
* Parent Component: Create
|
||||
* Props:
|
||||
* * handleFinish : {type: function, Invokes handleNext function in Parent.}
|
||||
* * handlePrev : {type: function, Invokes handlePrev function in Parent}
|
||||
* * handleFinish : {type: function, Invokes onNextClick function in Parent.}
|
||||
* * onPrevClick : {type: function, Invokes onPrevClick function in Parent}
|
||||
* * setData : {type: function, Invokes setStepData function in Parent}
|
||||
* * removeData : {type: Invokes removeStepData function in Parent}
|
||||
* */
|
||||
@ -60,7 +60,7 @@ class Step4 extends Component {
|
||||
|
||||
/**
|
||||
* Handles finish button click.
|
||||
* This invokes handleNext function in parent component.
|
||||
* This invokes onNextClick function in parent component.
|
||||
* */
|
||||
handleFinish() {
|
||||
this.props.handleFinish();
|
||||
|
||||
@ -36,12 +36,10 @@ class ApplicationEdit extends Component {
|
||||
|
||||
handleTabClick(event) {
|
||||
event.stopPropagation();
|
||||
console.log(typeof event.target.value);
|
||||
const key = event.target.value;
|
||||
|
||||
switch (key) {
|
||||
case "1": {
|
||||
console.log("Step1");
|
||||
this.setState({activeTab: 1, general: "active", release: "", pkgmgt: ""});
|
||||
break;
|
||||
}
|
||||
@ -78,12 +76,13 @@ class ApplicationEdit extends Component {
|
||||
}
|
||||
|
||||
render() {
|
||||
console.log(this.state);
|
||||
return (
|
||||
<div id="application-edit-base">
|
||||
<Row id="application-edit-header">
|
||||
<Col xs="3">
|
||||
<a className="back-to-app" onClick={this.handleOnBackClick.bind(this)}><i className="fw fw-left-arrow"></i></a>
|
||||
<a className="back-to-app" onClick={this.handleOnBackClick.bind(this)}>
|
||||
<i className="fw fw-left-arrow"></i>
|
||||
</a>
|
||||
</Col>
|
||||
<Col>
|
||||
Application Name
|
||||
|
||||
@ -33,6 +33,7 @@ class GeneralInfo extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
//TODO: Remove Console logs.
|
||||
render() {
|
||||
return (
|
||||
<div className="app-edit-general-info">
|
||||
|
||||
@ -26,8 +26,8 @@ class CreateRelease extends Component {
|
||||
super();
|
||||
this.onTestMethodChange = this.onTestMethodChange.bind(this);
|
||||
this.showUploadArtifacts = this.showUploadArtifacts.bind(this);
|
||||
this.handleBack = this.handleBack.bind(this);
|
||||
this.backToRelease = this.backToRelease.bind(this);
|
||||
this.onBackClick = this.onBackClick.bind(this);
|
||||
this.onBackToRelease = this.onBackToRelease.bind(this);
|
||||
this.state = {
|
||||
open: true,
|
||||
hiddenMain: false
|
||||
@ -47,11 +47,11 @@ class CreateRelease extends Component {
|
||||
this.setState({hiddenMain: true})
|
||||
}
|
||||
|
||||
handleBack() {
|
||||
onBackClick() {
|
||||
this.props.handleBack();
|
||||
}
|
||||
|
||||
backToRelease() {
|
||||
onBackToRelease() {
|
||||
this.setState({hiddenMain: false});
|
||||
}
|
||||
|
||||
@ -64,7 +64,7 @@ class CreateRelease extends Component {
|
||||
{this.state.hiddenMain ?
|
||||
<div>
|
||||
<UploadPackage
|
||||
backToRelease={this.backToRelease}
|
||||
backToRelease={this.onBackToRelease}
|
||||
selectedChannel={channel}
|
||||
/>
|
||||
</div> :
|
||||
@ -72,7 +72,7 @@ class CreateRelease extends Component {
|
||||
<div>
|
||||
<Row>
|
||||
<div className="release-header">
|
||||
<a onClick={this.handleBack}>{"<-"}</a>
|
||||
<a onClick={this.onBackClick}>{"<-"}</a>
|
||||
<span id="create-release-header">
|
||||
<strong>{channel} Release</strong>
|
||||
</span>
|
||||
|
||||
@ -28,7 +28,7 @@ class UploadPackage extends Component {
|
||||
}
|
||||
|
||||
handleBack() {
|
||||
this.props.backToRelease();
|
||||
this.props.onBackToRelease();
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
@ -26,20 +26,20 @@ class ReleaseManager extends Component {
|
||||
constructor() {
|
||||
super();
|
||||
this.getNoReleaseContent = this.getNoReleaseContent.bind(this);
|
||||
this.createRelease = this.createRelease.bind(this);
|
||||
this.handleBackPress = this.handleBackPress.bind(this);
|
||||
this.onCreateRelease = this.onCreateRelease.bind(this);
|
||||
this.onBackClick = this.onBackClick.bind(this);
|
||||
this.state = {
|
||||
createRelease: false,
|
||||
onGoing: ""
|
||||
}
|
||||
}
|
||||
|
||||
createRelease(event) {
|
||||
onCreateRelease(event) {
|
||||
event.preventDefault();
|
||||
this.setState({createRelease: true, onGoing: event.target.value})
|
||||
}
|
||||
|
||||
handleBackPress() {
|
||||
onBackClick() {
|
||||
this.setState({createRelease: false});
|
||||
}
|
||||
|
||||
@ -60,7 +60,7 @@ class ReleaseManager extends Component {
|
||||
className="button-add"
|
||||
id={release.toLowerCase()}
|
||||
value={release}
|
||||
onClick={this.createRelease}
|
||||
onClick={this.onCreateRelease}
|
||||
>
|
||||
Create a Release
|
||||
</Button>
|
||||
@ -76,7 +76,7 @@ class ReleaseManager extends Component {
|
||||
{this.state.createRelease ?
|
||||
<CreateRelease
|
||||
channel={this.state.onGoing}
|
||||
handleBack={this.handleBackPress}
|
||||
handleBack={this.onBackClick}
|
||||
/> :
|
||||
<div id="release-mgt-content">
|
||||
<Row>
|
||||
|
||||
@ -16,7 +16,6 @@
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
import Theme from '../../theme';
|
||||
import PropTypes from 'prop-types';
|
||||
import Chip from 'material-ui/Chip';
|
||||
import Dropzone from 'react-dropzone';
|
||||
@ -79,18 +78,6 @@ class PlatformCreate extends Component {
|
||||
{key: 2, value: 'Boolean'},
|
||||
{key: 3, value: 'File'}]
|
||||
};
|
||||
this.scriptId = "platform-create";
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
/**
|
||||
*Loading the theme files based on the the user-preference.
|
||||
*/
|
||||
Theme.insertThemingScripts(this.scriptId);
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
Theme.removeThemingScripts(this.scriptId);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@ -16,7 +16,6 @@
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
import Theme from '../../theme';
|
||||
import React, {Component} from 'react';
|
||||
import {withRouter} from 'react-router-dom';
|
||||
import TextField from 'material-ui/TextField';
|
||||
@ -41,7 +40,6 @@ class PlatformListing extends Component {
|
||||
platforms: [],
|
||||
asc: true
|
||||
};
|
||||
this.scriptId = "platform-listing";
|
||||
}
|
||||
|
||||
headers = [
|
||||
@ -72,17 +70,6 @@ class PlatformListing extends Component {
|
||||
}
|
||||
];
|
||||
|
||||
componentWillMount() {
|
||||
/**
|
||||
*Loading the theme files based on the the user-preference.
|
||||
*/
|
||||
Theme.insertThemingScripts(this.scriptId);
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
Theme.removeThemingScripts(this.scriptId);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
let platformsPromise = PlatformMgtApi.getPlatforms();
|
||||
platformsPromise.then(
|
||||
|
||||
@ -16,10 +16,11 @@
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
import qs from 'qs';
|
||||
import React, {Component} from 'react';
|
||||
import {Redirect, Switch} from 'react-router-dom';
|
||||
import AuthHandler from '../../../api/authHandler';
|
||||
import {Button, Card, CardBlock, CardSubtitle, CardTitle, Col, Form, FormGroup, Input, Label} from 'reactstrap';
|
||||
import {Button, Card, CardBlock, CardTitle, Col, Form, FormGroup, Input, Label} from 'reactstrap';
|
||||
|
||||
/**
|
||||
* The Login Component.
|
||||
@ -42,20 +43,15 @@ class Login extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
console.log("IN Login")
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
console.log("in Login")
|
||||
// let queryString = this.props.location.search;
|
||||
// console.log(queryString);
|
||||
// queryString = queryString.replace(/^\?/, '');
|
||||
// /* With QS version up we can directly use {ignoreQueryPrefix: true} option */
|
||||
// let params = qs.parse(queryString);
|
||||
// if (params.referrer) {
|
||||
// this.setState({referrer: params.referrer});
|
||||
// }
|
||||
let queryString = this.props.location.search;
|
||||
console.log(queryString);
|
||||
queryString = queryString.replace(/^\?/, '');
|
||||
/* With QS version up we can directly use {ignoreQueryPrefix: true} option */
|
||||
let params = qs.parse(queryString);
|
||||
if (params.referrer) {
|
||||
this.setState({referrer: params.referrer});
|
||||
}
|
||||
}
|
||||
|
||||
handleLogin(event) {
|
||||
@ -135,29 +131,31 @@ class Login extends Component {
|
||||
<div id="login-container">
|
||||
{/*TODO: Style the components.*/}
|
||||
<Card id="login-card">
|
||||
<CardBlock>
|
||||
<CardTitle>WSO2 IoT APP Publisher</CardTitle>
|
||||
<Form onSubmit={this.handleLogin.bind(this)}>
|
||||
<FormGroup row>
|
||||
<Label for="userName" sm={2}>User Name:</Label>
|
||||
<Col sm={10}>
|
||||
<Input type="text" name="userName" id="userName" placeholder="User Name" onChange={this.onUserNameChange.bind(this)}/>
|
||||
</Col>
|
||||
<CardBlock>
|
||||
<CardTitle>WSO2 IoT APP Publisher</CardTitle>
|
||||
<Form onSubmit={this.handleLogin.bind(this)}>
|
||||
<FormGroup row>
|
||||
<Label for="userName" sm={2}>User Name:</Label>
|
||||
<Col sm={10}>
|
||||
<Input type="text" name="userName" id="userName" placeholder="User Name"
|
||||
onChange={this.onUserNameChange.bind(this)}/>
|
||||
</Col>
|
||||
|
||||
</FormGroup>
|
||||
<FormGroup row>
|
||||
<Label for="password" sm={2}>Password:</Label>
|
||||
<Col sm={10}>
|
||||
<Input type="password" name="text" id="password" placeholder="Password" onChange={this.onPasswordChange.bind(this)}/>
|
||||
</Col>
|
||||
</FormGroup>
|
||||
<FormGroup check row>
|
||||
<Col sm={{ size: 10, offset: 2 }}>
|
||||
<Button type="submit" id="login-btn">Submit</Button>
|
||||
</Col>
|
||||
</FormGroup>
|
||||
</Form>
|
||||
</CardBlock>
|
||||
</FormGroup>
|
||||
<FormGroup row>
|
||||
<Label for="password" sm={2}>Password:</Label>
|
||||
<Col sm={10}>
|
||||
<Input type="password" name="text" id="password" placeholder="Password"
|
||||
onChange={this.onPasswordChange.bind(this)}/>
|
||||
</Col>
|
||||
</FormGroup>
|
||||
<FormGroup check row>
|
||||
<Col sm={{size: 10, offset: 2}}>
|
||||
<Button type="submit" id="login-btn">Login</Button>
|
||||
</Col>
|
||||
</FormGroup>
|
||||
</Form>
|
||||
</CardBlock>
|
||||
</Card>
|
||||
</div>);
|
||||
} else {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user