Api integration stage 2: Create and retrieve apps and platforms.

feature/appm-store/pbac
Menaka Jayawardena 7 years ago
parent a4e342ed08
commit 2b6f9a9e2c

@ -19,15 +19,19 @@
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.wso2.carbon.devicemgt</groupId>
<artifactId>application-mgt</artifactId>
<version>3.0.46-SNAPSHOT</version>
</parent>
<modelVersion>4.0.0</modelVersion>
<artifactId>org.wso2.carbon.device.application.mgt.publisher.ui</artifactId>
<version>3.0.46-SNAPSHOT</version>
<packaging>war</packaging>
<name>WSO2 Carbon - Application Management Publisher UI</name>
<description>WSO2 Carbon - Application Management Publisher UI React Application</description>
<url>http://wso2.org</url>
<build>
<plugins>

@ -56,16 +56,17 @@ class Base extends Component {
super();
this.state = {
user: null
}
}
componentWillMount() {
let user = AuthHandler.getUser();
if (user) {
if (!AuthHandler.isTokenExpired()) {
this.setState({user: user});
} else {
console.log("expired!");
this.setState({user: null});
}
}
}
@ -79,7 +80,7 @@ class Base extends Component {
console.log("Have User.");
return (
<div className="container">
<BaseLayout>
<BaseLayout user={this.state.user}>
<Switch>
<Redirect exact path={"/"} to={"/assets/apps"}/>
<Route exact path={"/assets/apps"} component={ApplicationListing}/>

@ -36,8 +36,9 @@ class AuthHandler {
* */
static login(userName, password) {
const headers = {"Content-type": "application/json"};
let login_promise = Axios.post("https://localhost:9443/auth/application-mgt/v1.0/auth/login?userName=admin&password=admin",
null, {headers: headers});
let login_promise =
Axios.post(Constants.userConstants.LOGIN_URL+"?userName=" + userName+ "&password=" + password,
null, {headers: headers});
login_promise.then(response => {
console.log(response);
@ -51,6 +52,8 @@ class AuthHandler {
const user = new User(userName, clientId, clientSecret, validityPeriod);
console.log(user);
user.setAuthToken(WSO2_IOT_TOKEN, validityPeriod);
let expiresIn = Date.now() + (validityPeriod * 1000);
localStorage.setItem("expiresIn", expiresIn);
AuthHandler.setUser(user);
}
);
@ -67,10 +70,24 @@ class AuthHandler {
if (!user instanceof User) {
throw "Invalid user object";
}
user.created = Date.now();
localStorage.setItem(Constants.userConstants.WSO2_USER, JSON.stringify(user.toJson()));
/* TODO: IMHO it's better to get this key (`wso2_user`) from configs */
}
static unauthorizedErrorHandler(error_response) {
if (error_response.status !== 401) { /* Skip unrelated response code to handle in unauthorizedErrorHandler*/
throw error_response;
/* re throwing the error since we don't handle it here and propagate to downstream error handlers in catch chain*/
}
let message = "The session has expired" + ".<br/> You will be redirect to the login page ...";
if (true) {
alert(message);
} else {
throw error_response;
}
}
/**
* Get the logged in user.
* @return User: The logged in user object.
@ -89,8 +106,27 @@ class AuthHandler {
}
logout() {
static logout() {
const user = AuthHandler.getUser();
const clientId = user.getClientId();
const clientSecret = user.getClientSecret();
const token = user.getAuthToken();
const headers = {"Content-type": "application/json"};
let login_promise = Axios.post(Constants.userConstants.LOGOUT_URL+"?token=" + token + "&clientId=" + clientId
+ "&clientSecret=" + clientSecret,
null, {headers: headers});
login_promise.then(
(response) => {
Utils.delete_cookie(Constants.userConstants.PARTIAL_TOKEN);
localStorage.removeItem(Constants.userConstants.WSO2_USER);
window.location = "/";
}
).catch(
(err) => {
AuthHandler.unauthorizedErrorHandler(err);
}
)
}
/**
@ -98,9 +134,17 @@ class AuthHandler {
* @return boolean: True if expired. False otherwise.
* */
static isTokenExpired() {
const userData = AuthHandler.getUser().getAuthToken();
return (Date.now() - userData._createdTime) > userData._expires;
const expiresIn = localStorage.getItem("expiresIn");
return (expiresIn < Date.now());
}
static createAuthenticationHeaders(contentType) {
return {
"Authorization": "Bearer " + AuthHandler.getUser().getAuthToken(),
"Content-Type": contentType,
};
};
}
export default AuthHandler;

@ -33,7 +33,6 @@ export default class User {
this._clientId = clientId;
this._clientSecret = clientSecret;
this._expires = validityPeriod;
this._createdTime = Date.now();
User._instance = this;
}
@ -61,6 +60,14 @@ export default class User {
return Utils.getCookie(Constants.userConstants.PARTIAL_TOKEN);
}
getClientId() {
return this._clientId;
}
getClientSecret() {
return this._clientSecret;
}
/**
* Store the JavaScript accessible access token segment in cookie storage
* @param {String} newToken : Part of the access token which needs when accessing REST API
@ -72,11 +79,11 @@ export default class User {
}
/**
*
* @param type
*/
checkPermission(type) {
throw ("Not implemented!");
* Get the user name of logged in user.
* @return String: User name
* */
getUserName() {
return this._userName;
}
/**
@ -98,7 +105,6 @@ export default class User {
* @returns {User} : An instance of User(this) class.
*/
static fromJson(userJson) {
const _user = new User(userJson.name);
_user._clientId = userJson.clientId;
_user._clientSecret = userJson.clientSecret;

@ -87,8 +87,6 @@ class PublisherUtils {
static isEmptyObject(object) {
return Object.keys(object).length === 0 && object.constructor === Object
}
}
export default PublisherUtils;

@ -27,7 +27,7 @@ import Helper from './helpers/appMgtApiHelpers';
export default class Endpoint {
/* =================================================================
* Application related apis
* Application related apis
* */
/**
@ -38,37 +38,33 @@ export default class Endpoint {
* From applicationData, the proper application object will be created and send it to the api.
* */
static createApplication(applicationData) {
let app = Helper.buildApplication(applicationData).application;
let user = AuthHandler.getUser();
console.log(user.idToken);
const headers = {
"Authorization": 'Bearer ' + user.getAuthToken(),
"Content-Type": "application/json",
};
Axios.post(Constants.appManagerEndpoints.CREATE_APP, app, {headers: headers}).then(
function (response) {
console.log(response);
}
).catch(function (err) {
console.log(err);
});
const headers = AuthHandler.createAuthenticationHeaders("application/json");
return Axios.post(Constants.appManagerEndpoints.CREATE_APP, app, {headers: headers});
}
/**
* Upload the image artifacts (banner, icon, screenshots) related to the application.
* @param appId: The application uuid of the application which the images should be uploaded to.
* */
static uploadImageArtifacts(appId) {
let user = AuthHandler.getUser();
const headers = AuthHandler.createAuthenticationHeaders("multipart/form-data");
return Axios.post(Constants.appManagerEndpoints.UPLOAD_IMAGES + appId, appId, {headers: headers});
}
/**
* Method to handle application release process.
* */
static releaseApplication() {
static releaseApplication(appId) {
}
/**
* Promote the current state of the application.
* Promote the current life cycle state of the application.
* @param appId: The uuid of the application which the state should be updated.
* */
static updateState(appId) {
static updateLifeCycleState(appId) {
}
@ -76,7 +72,7 @@ export default class Endpoint {
* Get the next possible state, which the application can be promoted to.
* @param appId: The application uuid.
*/
static getNextState(appId) {
static getNextLifeCycleState(appId) {
}
@ -85,7 +81,14 @@ export default class Endpoint {
* @param applicationData: The modified application data.
* */
static editApplication(applicationData) {
let app = Helper.buildApplication(applicationData).application;
const headers = AuthHandler.createAuthenticationHeaders("application/json");
return Axios.put(Constants.appManagerEndpoints.CREATE_APP, app, {headers: headers});
}
static editApplicationArtofacts(appId) {
const headers = AuthHandler.createAuthenticationHeaders("application/json");
return Axios.put(Constants.appManagerEndpoints.CREATE_APP, appId, {headers: headers});
}
/**
@ -95,12 +98,7 @@ export default class Endpoint {
static getApplications() {
let user = AuthHandler.getUser();
console.log("Get all applications", user.getAuthToken());
const headers = {
"Authorization": 'Bearer ' + user.getAuthToken(),
'Accept': 'application/json',
"Content-Type": "application/json",
};
const headers = AuthHandler.createAuthenticationHeaders("application/json");
return Axios.get(Constants.appManagerEndpoints.GET_ALL_APPS, {headers: headers});
}
@ -109,7 +107,10 @@ export default class Endpoint {
* @param appId: The application Id.
* */
static getApplication(appId) {
let user = AuthHandler.getUser();
console.log("Get Application",appId, user.getAuthToken());
const headers = AuthHandler.createAuthenticationHeaders("application/json");
return Axios.get(Constants.appManagerEndpoints.GET_ALL_APPS + appId, {headers: headers});
}
/**
@ -123,11 +124,8 @@ export default class Endpoint {
/*
* End of Application management apis.
* =================================================================
* */
/*
* =================================================================
* Platform related apis
* Platform related apis
* */
/**
@ -135,13 +133,7 @@ export default class Endpoint {
* @param platformData: The platform data object.
* */
static createPlatform(platformData) {
const headers = {
"Authorization": 'Bearer ' + AuthHandler.getUser().getAuthToken(),
'Accept': 'application/json',
"Content-Type": "application/json",
};
const headers = AuthHandler.createAuthenticationHeaders("application/json");
Axios.post(Constants.platformManagerEndpoints.CREATE_PLATFORM, platformData, {headers: headers}).then(
function (response) {
console.log(response);
@ -149,14 +141,14 @@ export default class Endpoint {
).catch(function (err) {
console.log(err);
});
}
/**
* Get available platforms
* */
static getPlatforms() {
const headers = AuthHandler.createAuthenticationHeaders("application/json");
return Axios.get(Constants.platformManagerEndpoints.GET_ENABLED_PLATFORMS, {headers: headers});
}
/**
@ -164,7 +156,8 @@ export default class Endpoint {
* @param platformId: The identifier of the platform
* */
static getPlatform(platformId) {
const headers = AuthHandler.createAuthenticationHeaders("application/json");
return Axios.get(Constants.platformManagerEndpoints.GET_PLATFORM + platformId, {headers: headers});
}
/**
@ -172,12 +165,12 @@ export default class Endpoint {
* @param platformId: The id of the platform which is to be deleted.
* */
static deletePlatform(platformId) {
const headers = AuthHandler.createAuthenticationHeaders("application/json");
return Axios.delete(Constants.platformManagerEndpoints.GET_PLATFORM + platformId, {headers: headers});
}
/*
* End of Platform management apis.
* End of Platform management apis.
* =================================================================
* */
}

@ -39,13 +39,7 @@ export default class Helper {
if (prop === 'banner' || prop === 'screenshots' || prop === 'icon') {
images[prop] = tmpData[prop];
} else if(prop === 'tags') {
let tags = [];
let tagsFromStep = tmpData[prop];
for (let tag in tagsFromStep) {
console.log(tag);
tags.push(tagsFromStep[tag].value);
}
application[prop] = tags;
application[prop] = Helper.stringifyTags(tmpData[prop]);
} else {
application[prop] = tmpData[prop];
}
@ -53,4 +47,15 @@ export default class Helper {
}
return {application, images};
}
static stringifyTags(tags) {
let tmpTags = [];
for (let tag in tags) {
console.log(tag);
tmpTags.push(tags[tag].value);
}
return tmpTags;
}
}

@ -16,30 +16,29 @@
* under the License.
*/
'use strict';
export default class Constants {
static scopes = 'perm:application:get perm:application:create perm:application:update perm:application-mgt:login' +
' perm:application:delete perm:platform:add perm:platform:remove perm:roles:view perm:devices:view';
static TOKEN_ENDPOINT = '/token';
static DYNAMIC_CLIENT_REGISTER_ENDPOINT = '/api-application-registration/register';
static appManagerEndpoints = {
GET_ALL_APPS: 'https://localhost:8243/api/application-mgt/v1.0/applications/1.0.0/',
CREATE_APP: 'https://localhost:8243/api/application-mgt/v1.0/applications/1.0.0/',
UPLOAD_IMAGES: '/api/application-mgt/v1.0/applications/1.0.0/upload-image-artifacts/', //+appId
UPLOAD_IMAGES: '/api/application-mgt/v1.0/applications/1.0.0/upload-artifacts/', //+appId
};
static platformManagerEndpoints = {
CREATE_PLATFORM: 'https://localhost:8243/api/application-mgt/v1.0/platforms/1.0.0/'
}
CREATE_PLATFORM: 'https://localhost:8243/api/application-mgt/v1.0/platforms/1.0.0',
GET_ENABLED_PLATFORMS: 'https://localhost:8243/api/application-mgt/v1.0/platforms/1.0.0?status=ENABLED',
GET_PLATFORM: 'https://localhost:8243/api/application-mgt/v1.0/platforms/1.0.0/'
};
static userConstants = {
LOGIN_URL:"https://localhost:9443/auth/application-mgt/v1.0/auth/login",
LOGOUT_URL: "https://localhost:9443/auth/application-mgt/v1.0/auth/logout",
REFRESH_TOKEN_URL: "",
WSO2_USER: 'wso2_user',
PARTIAL_TOKEN: 'WSO2_IOT_TOKEN'
}
}

@ -39,12 +39,14 @@ class ApplicationCreate extends Component {
constructor() {
super();
this.scriptId = "application-create";
this.setStepData.bind(this);
this.removeStepData.bind(this);
this.handleSubmit.bind(this);
this.handleCancel.bind(this);
this.handleYes.bind(this);
this.handleNo.bind(this);
this.setStepData = this.setStepData.bind(this);
this.removeStepData = this.removeStepData.bind(this);
this.handleSubmit = this.handleSubmit.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.state = {
finished: false,
stepIndex: 0,
@ -80,8 +82,18 @@ class ApplicationCreate extends Component {
* Handles form submit.
* */
handleSubmit() {
console.log(this.state.stepData);
Endpoint.createApplication(this.state.stepData);
let stepData = this.state.stepData;
let applicationCreationPromise = Endpoint.createApplication(stepData);
applicationCreationPromise.then(response => {
console.log(response);
let uploadArtifactsPromise = Endpoint.uploadImageArtifacts(response.data.uuid);
this.handleYes();
}
).catch(
function (err) {
console.log(err);
}
);
};
@ -107,6 +119,8 @@ class ApplicationCreate extends Component {
/**
* Saves form data in each step in to the state.
* @param step: The step number of the step data.
* @param data: The form data of the step.
* */
setStepData(step, data) {
console.log(step, data, this.state.stepData);
@ -153,25 +167,31 @@ class ApplicationCreate extends Component {
getStepContent(stepIndex) {
switch (stepIndex) {
case 0:
return <Step1
handleNext={this.handleNext}
setData={this.setStepData}
removeData={this.removeStepData}
/>;
return (
<Step1
handleNext={this.handleNext}
setData={this.setStepData}
removeData={this.removeStepData}
/>
);
case 1:
return <Step2
handleNext={this.handleNext}
handlePrev={this.handlePrev}
setData={this.setStepData}
removeData={this.removeStepData}
/>;
return (
<Step2
handleNext={this.handleNext}
handlePrev={this.handlePrev}
setData={this.setStepData}
removeData={this.removeStepData}
/>
);
case 2:
return <Step3
handleFinish={this.handleNext}
handlePrev={this.handlePrev}
setData={this.setStepData}
removeData={this.removeStepData}
/>;
return (
<Step3
handleFinish={this.handleNext}
handlePrev={this.handlePrev}
setData={this.setStepData}
removeData={this.removeStepData}
/>
);
default:
return <div/>;
}

@ -23,6 +23,7 @@ import TextField from 'material-ui/TextField';
import DataTable from '../UIComponents/DataTable';
import {Card, CardActions, CardTitle} from 'material-ui/Card';
import Theme from '../../theme';
import AuthHandler from "../../api/authHandler";
/**
* The App Create Component.
@ -35,51 +36,21 @@ import Theme from '../../theme';
class ApplicationListing extends Component {
constructor() {
super();
this.searchApplications = this.searchApplications.bind(this);
this.onRowClick = this.onRowClick.bind(this);
this.setData = this.setData.bind(this);
this.sortData = this.sortData.bind(this);
this.compare = this.compare.bind(this);
this.state = {
data: [],
searchedApplications: [],
applications: [],
asc: true
};
this.scriptId = "application-listing";
}
data = [
{
id: Math.random(),
applicationName: "Cne",
platform: 'Android',
category: "Public",
status: "Created"
},
{
id: Math.random(),
applicationName: "Gone",
platform: 'IOS',
category: "Public",
status: "Created"
},
{
id: Math.random(),
applicationName: "Ane",
platform: 'Android',
category: "Public",
status: "Created"
},
{
id: Math.random(),
applicationName: "one",
platform: 'Android',
category: "Public",
status: "Created"
},
{
id: Math.random(),
applicationName: "one",
platform: 'Android',
category: "Public",
status: "Created"
},
];
data = [];
//
headers = [
{
data_id: "image",
@ -92,7 +63,7 @@ class ApplicationListing extends Component {
data_type: "string",
sortable: true,
label: "Application Name",
sort: this.sortData.bind(this)
sort: this.sortData
},
{
data_id: "platform",
@ -126,30 +97,99 @@ class ApplicationListing extends Component {
componentWillUnmount() {
Theme.removeThemingScripts(this.scriptId);
// this.setState({data: this.data});
}
componentDidMount() {
let getApps = EndPoint.getApplications();
getApps.then(response => {
console.log(response);
})
let apps = this.setData(response.data.applications);
console.log(apps);
this.setState({searchedApplications: apps});
// console.log(this.setState({data: response.data}), console.log(this.state));
}).catch(err => {
AuthHandler.unauthorizedErrorHandler(err);
});
}
setData(applications) {
// {
// id: Math.random(),
// applicationName: "one",
// platform: 'Android',
// category: "Public",
// status: "Created"
// }
//
// "uuid":"f59ca462-7fa0-4cef-8536-96c17905e587",
// "name":"sdkfsdkf",
// "shortDescription":"shdkfhsd[f sfs;df dsf","description":"khsdkhfkjdss hfdsff\nsdf\ndsf",
// "tags":["dsfds","f","dsfs"],
// "platform":{
// "name":"jdslkjfljs",
// "description":"ljlksdjlfjdsljf",
// "identifier":"sdjflsjdfjlkj",
// "fileBased":false,
// "shared":false,
// "enabled":false,
// "defaultTenantMapping":false
// },
//
// "category":{
// "id":1
// },
//
// "createdAt":"Tue, 12 Sep 2017 18:53:54 IST",
// "modifiedAt":"Tue, 12 Sep 2017 18:53:54 IST",
// "currentLifecycle":{
// "lifecycleState":{
// "id":1,
// "name":"CREATED",
// "identifier":"CREATED",
// "description":"Application creation initial state"
// },
//
// "lifecycleStateModifiedAt":"Tue, 12 Sep 2017 18:53:54 IST",
// "getLifecycleStateModifiedBy":"admin"},
// "screenShotCount":0,
// "user":{
// "userName":"admin",
// "tenantId":-1234
// }
// }
let apps = [];
for (let app in applications) {
let application = {};
application.id = applications[app].uuid;
application.applicationName = applications[app].name;
application.platform = applications[app].platform.name;
application.category = applications[app].category.id;
application.status = applications[app].currentLifecycle.lifecycleState.name;
apps.push(application);
}
this.setState({searchedApplications: apps});
}
/**
* Handles the search action.
* When typing in the search bar, this method will be invoked.
* @param event: The event triggered from typing in the search box.
* @param searchText: The text that typed in the search box.
* */
searchApplications(event, word) {
searchApplications(event, searchText) {
let searchedData;
if (word) {
searchedData = this.data.filter((dataItem) => {
return dataItem.applicationName.includes(word);
if (searchText) {
searchedData = this.state.applications.filter((dataItem) => {
return dataItem.applicationName.includes(searchText);
});
} else {
searchedData = this.data;
searchedData = this.state.applications;
}
this.setState({data: searchedData}, console.log("Searched data ", this.state.data));
this.setState({searchedApplications: searchedData}, console.log("Searched data ", this.state.searchedApplications));
}
/**
@ -157,9 +197,10 @@ class ApplicationListing extends Component {
* asc: true : sort in ascending order.
* */
sortData() {
console.log(this.state);
let isAsc = this.state.asc;
let datas = isAsc ? this.data.sort(this.compare) : this.data.reverse();
this.setState({data: datas, asc: !isAsc});
let sortedData = isAsc ? this.state.searchedApplications.sort(this.compare) : this.data.reverse();
this.setState({searchedApplications: sortedData, asc: !isAsc});
}
compare(a, b) {
@ -171,20 +212,27 @@ class ApplicationListing extends Component {
}
onRowClick(id) {
this.props.history.push("apps/" + id);
EndPoint.getApplication(id).then(response => {
console.log(response);
}).catch(err => {
console.log(err)
});
// this.props.history.push("apps/" + id);
}
render() {
return (
<div className="middle applicationListingMiddle">
<Card className="applicationListingCard">
<TextField hintText="Search" className="applicationListingSearch"
onChange={this.searchApplications.bind(this)}/>
<TextField
hintText="Search"
className="applicationListingSearch"
onChange={this.searchApplications}/>
<CardTitle title="Applications" className="applicationListTitle"/>
<DataTable
headers={this.headers}
data={this.state.data}
handleRowClick={this.onRowClick.bind(this)}
data={this.state.searchedApplications}
handleRowClick={this.onRowClick}
noDataMessage={{type: 'button', text: 'Create Application'}}
/>
</Card>

@ -22,6 +22,8 @@ import MenuItem from 'material-ui/MenuItem';
import SelectField from 'material-ui/SelectField';
import RaisedButton from 'material-ui/RaisedButton';
import Theme from '../../../theme';
import Endpoint from "../../../api/endpoints";
import AuthHandler from "../../../api/authHandler";
/**
* The first step of the application creation wizard.
@ -39,13 +41,15 @@ import Theme from '../../../theme';
class Step1 extends Component {
constructor() {
super();
this.platforms = [{identifier: 1}, {identifier: 2}, {identifier: 3}];
this.stores = [{identifier: 5}, {identifier: 2}, {identifier: 3}];
this.setPlatforms = this.setPlatforms.bind(this);
this.platforms = [];
this.state = {
finished: false,
stepIndex: 0,
store: 1,
platform: 0,
platformSelectedIndex: 0,
platform: "",
platforms: [],
stepData: [],
title: "",
titleError: ""
@ -63,22 +67,40 @@ class Step1 extends Component {
componentWillUnmount() {
Theme.removeThemingScripts(this.scriptId);
}
componentDidMount() {
//Get the list of available platforms and set to the state.
Endpoint.getPlatforms().then(response => {
console.log(response);
this.setPlatforms(response.data);
}).catch(err => {
AuthHandler.unauthorizedErrorHandler(err);
})
}
/**
* Invokes the handleNext function in Create component.
* Extract the platforms from the response data and populate the state.
* @param platforms: The array returned as the response.
* */
handleNext() {
this.props.handleNext();
};
setPlatforms(platforms) {
let tmpPlatforms = [];
for (let index in platforms) {
let platform = {};
platform = platforms[index];
tmpPlatforms.push(platform);
}
this.setState({platforms: tmpPlatforms, platformSelectedIndex: 0, platform: tmpPlatforms[0].identifier})
}
/**
* Persist the current form data to the state.
* */
setStepData() {
console.log(this.state.platforms);
let step = {
store: this.state.store,
platform: this.platforms[this.state.platform]
platform: this.state.platforms[this.state.platformSelectedIndex]
};
console.log(step);
this.props.setData("step1", {step: step});
}
@ -96,8 +118,8 @@ class Step1 extends Component {
* Triggers when changing the Platform selection.
* */
onChangePlatform(event, index, value) {
console.log(value);
this.setState({platform: value});
console.log(this.state.platforms[index]);
this.setState({platform: this.state.platforms[index].identifier, platformSelectedIndex: index});
};
/**
@ -129,9 +151,17 @@ class Step1 extends Component {
floatingLabelFixed={true}
onChange={this.onChangePlatform.bind(this)}
>
<MenuItem value={0} primaryText="Android"/>
<MenuItem value={1} primaryText="iOS"/>
<MenuItem value={2} primaryText="Web"/>
{this.state.platforms.length > 0 ? this.state.platforms.map(platform => {
return (
<MenuItem
key={Math.random()}
value={platform.identifier}
primaryText={platform.name}
/>
)
}) : <div/>}
</SelectField>
</div>
<br/>

@ -51,6 +51,10 @@ import Theme from '../../../theme';
class Step3 extends Component {
constructor() {
super();
this.handleToggle = this.handleToggle.bind(this);
this.handlePrev = this.handlePrev.bind(this);
this.handleToggle = this.handleToggle.bind(this);
this.handleFinish = this.handleFinish.bind(this);
this.state = {
showForm: false,
releaseChannel: 1,
@ -100,7 +104,7 @@ class Step3 extends Component {
<Toggle
label="Release the Application"
labelPosition="right"
onToggle={this.handleToggle.bind(this)}
onToggle={this.handleToggle}
defaultToggled={this.state.showForm}
/>
{/*If toggle is true, the release form will be shown.*/}
@ -127,13 +131,13 @@ class Step3 extends Component {
<FlatButton
label="< Back"
disabled={false}
onClick={this.handlePrev.bind(this)}
className="applicationCreateFinish"/>
onClick={this.handlePrev}
className="applicationCreateFinish"
/>
<RaisedButton
label="Finish"
primary={true}
onClick={this.handleFinish.bind(this)}
onClick={this.handleFinish}
/>
</div>

@ -21,7 +21,11 @@ import Badge from 'material-ui/Badge';
import React, {Component} from 'react';
import AppBar from 'material-ui/AppBar';
import Drawer from 'material-ui/Drawer';
import IconMenu from 'material-ui/IconMenu';
import MenuItem from 'material-ui/MenuItem';
import {withRouter} from 'react-router-dom';
import AuthHandler from "../../api/authHandler";
import FlatButton from 'material-ui/FlatButton';
import IconButton from 'material-ui/IconButton';
import {List, ListItem} from 'material-ui/List';
import Apps from 'material-ui/svg-icons/navigation/apps';
@ -48,6 +52,7 @@ class BaseLayout extends Component {
user: 'Admin'
};
this.scriptId = "basic-layout";
this.logout = this.logout.bind(this);
}
componentWillMount() {
@ -93,6 +98,10 @@ class BaseLayout extends Component {
this.props.history.push(to);
}
logout(event, index, value) {
AuthHandler.logout();
}
render() {
return (
@ -110,11 +119,22 @@ class BaseLayout extends Component {
<NotificationsIcon/>
</IconButton>
</Badge>
<IconButton onClick={() => {
console.log("Clicked")
}}>
<ActionAccountCircle/>
</IconButton>
<IconMenu
iconButtonElement={<FlatButton
icon={<ActionAccountCircle/>}
label="sdfdsf"
/>}
anchorOrigin={{horizontal: 'left', vertical: 'top'}}
targetOrigin={{horizontal: 'left', vertical: 'top'}}
onChange={this.logout}
>
<MenuItem value={0} primaryText="Logout" />
</IconMenu>
{/*<FlatButton*/}
{/*icon={<ActionAccountCircle/>}*/}
{/*onClick={() => {console.log("Clicked")}}*/}
{/*label={this.props.user.getUserName()}*/}
{/*/>*/}
</div>
}
/>

@ -232,6 +232,7 @@ class PlatformCreate extends Component {
platform.icon = this.state.icon;
platform.enabled = this.state.enabled;
platform.allTenants = this.state.allTenants;
platform.defaultTenantMapping = true;
Endpoint.createPlatform(platform);

@ -53,6 +53,7 @@ class DataTable extends Component {
constructor() {
super();
this.handleRowClick = this.handleRowClick.bind(this);
this.state = {
data: [],
headers: [],
@ -120,7 +121,7 @@ class DataTable extends Component {
<DataTableRow
key={dataItem.id}
dataItem={dataItem}
handleClick={this.handleRowClick.bind(this)}
handleClick={this.handleRowClick}
/>
)
})}

@ -30,6 +30,7 @@ class DataTableHeader extends Component {
constructor() {
super();
this.tableHeaderClick = this.tableHeaderClick.bind(this);
this.scriptId = "data-table";
}
@ -42,6 +43,7 @@ class DataTableHeader extends Component {
componentWillUnmount() {
Theme.removeThemingScripts(this.scriptId);
}
/**
@ -63,9 +65,9 @@ class DataTableHeader extends Component {
headerCell =
<FlatButton
label={this.props.header.label}
onClick={this.tableHeaderClick.bind(this)}
onClick={this.tableHeaderClick}
className="sortableHeaderCell"
/>;
/>
} else {
headerCell = <span className="notsortableHeaderCell">{this.props.header.label}</span>;
}

Loading…
Cancel
Save