Fix code issues in App Upload form in APPM UI

feature/appm-store/pbac
Jayasanka 5 years ago
parent 13bdeee883
commit b4d76b893d

@ -15,11 +15,15 @@
"acorn": "^6.2.0", "acorn": "^6.2.0",
"antd": "^3.23.6", "antd": "^3.23.6",
"axios": "^0.19.0", "axios": "^0.19.0",
"babel-eslint": "^9.0.0",
"d3": "^5.9.7", "d3": "^5.9.7",
"dagre": "^0.8.4", "dagre": "^0.8.4",
"eslint": "^5.16.0",
"eslint-plugin-import": "^2.18.2",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-react": "^7.16.0",
"fetch": "^1.1.0", "fetch": "^1.1.0",
"gapi": "0.0.3", "imagemin": "^6.1.0",
"gapi-client": "0.0.3",
"keymirror": "^0.1.1", "keymirror": "^0.1.1",
"rc-tween-one": "^2.4.1", "rc-tween-one": "^2.4.1",
"react-d3-graph": "^2.1.0", "react-d3-graph": "^2.1.0",
@ -34,7 +38,8 @@
"react-star-ratings": "^2.3.0", "react-star-ratings": "^2.3.0",
"redux-thunk": "^2.3.0", "redux-thunk": "^2.3.0",
"shade-blend-color": "^1.0.0", "shade-blend-color": "^1.0.0",
"storm-react-diagrams": "^5.2.1" "storm-react-diagrams": "^5.2.1",
"typescript": "^3.6.4"
}, },
"devDependencies": { "devDependencies": {
"@babel/core": "^7.5.0", "@babel/core": "^7.5.0",

@ -34,6 +34,7 @@ import {
Select Select
} from 'antd'; } from 'antd';
import axios from "axios"; import axios from "axios";
import "@babel/polyfill";
import {withConfigContext} from "../../../../context/ConfigContext"; import {withConfigContext} from "../../../../context/ConfigContext";
const {TextArea} = Input; const {TextArea} = Input;

@ -17,37 +17,24 @@
*/ */
import React from "react"; import React from "react";
import { import {Button, Col, Form, Icon, Input, Row, Select, Switch, Upload, InputNumber, Modal} from "antd";
Modal, import "@babel/polyfill";
Button,
Icon,
notification,
Spin,
Tooltip,
Upload,
Input,
Switch,
Form,
Divider,
Row,
Col,
Select
} from 'antd';
import axios from "axios"; import axios from "axios";
import {withConfigContext} from "../../../context/ConfigContext"; import {handleApiError} from "../../../js/Utils";
const {TextArea} = Input;
const InputGroup = Input.Group;
const {Option} = Select;
const formItemLayout = { const formItemLayout = {
labelCol: { labelCol: {
span: 8, xs: {span: 24},
sm: {span: 8},
}, },
wrapperCol: { wrapperCol: {
span: 16, xs: {span: 24},
sm: {span: 16},
}, },
}; };
const {Option} = Select;
const {TextArea} = Input;
const InputGroup = Input.Group;
function getBase64(file) { function getBase64(file) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
@ -58,168 +45,30 @@ function getBase64(file) {
}); });
} }
class EditReleaseModal extends React.Component { class NewAppUploadForm extends React.Component {
// To add subscription type & tenancy sharing, refer https://gitlab.com/entgra/carbon-device-mgt/merge_requests/331
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
visible: false,
current: 0,
categories: [],
tags: [],
icons: [], icons: [],
screenshots: [], screenshots: [],
loading: false, loading: false,
binaryFiles: [], binaryFiles: [],
metaData: [], application: null,
formConfig: { isFree: true,
specificElements: {} previewVisible: false,
} previewImage: '',
binaryFileHelperText: '',
iconHelperText: '',
screenshotHelperText: '',
osVersionsHelperText: '',
osVersionsValidateStatus: 'validating',
metaData: []
}; };
this.lowerOsVersion = null; this.lowerOsVersion = null;
this.upperOsVersion = null; this.upperOsVersion = null;
} }
componentDidMount = () => {
this.generateConfig();
};
generateConfig = () => {
const {type} = this.props;
const formConfig = {
type
};
switch (type) {
case "ENTERPRISE":
formConfig.endpoint = "/ent-app-release";
formConfig.specificElements = {
binaryFile: {
required: true
}
};
break;
case "PUBLIC":
formConfig.endpoint = "/public-app-release";
formConfig.specificElements = {
packageName: {
required: true
},
version: {
required: true
}
};
break;
case "WEB_CLIP":
formConfig.endpoint = "/web-app-release";
formConfig.specificElements = {
version: {
required: true
},
url: {
required: true
}
};
break;
case "CUSTOM":
formConfig.endpoint = "/custom-app-release";
formConfig.specificElements = {
binaryFile: {
required: true
},
packageName: {
required: true
},
version: {
required: true
}
};
break;
}
this.setState({
formConfig
});
};
showModal = () => {
const config = this.props.context;
const {app, release} = this.props;
const {formConfig} = this.state;
const {specificElements} = formConfig;
let metaData = [];
try {
metaData = JSON.parse(release.metaData);
} catch (e) {
}
this.props.form.setFields({
releaseType: {
value: release.releaseType
},
releaseDescription: {
value: release.description
}
});
if ((config.deviceTypes.mobileTypes.includes(this.props.deviceType))) {
const osVersions = release.supportedOsVersions.split("-");
this.lowerOsVersion = osVersions[0];
this.upperOsVersion = osVersions[1];
this.props.form.setFields({
lowerOsVersion: {
value: osVersions[0]
},
upperOsVersion: {
value: osVersions[1]
}
});
}
if (specificElements.hasOwnProperty("version")) {
this.props.form.setFields({
version: {
value: release.version
}
});
}
if (specificElements.hasOwnProperty("url")) {
this.props.form.setFields({
url: {
value: release.url
}
});
}
if (specificElements.hasOwnProperty("packageName")) {
this.props.form.setFields({
packageName: {
value: release.packageName
}
});
}
this.setState({
visible: true,
metaData
});
};
handleOk = e => {
this.setState({
visible: false,
});
};
handleCancel = e => {
this.setState({
visible: false,
});
};
normFile = e => { normFile = e => {
if (Array.isArray(e)) { if (Array.isArray(e)) {
return e; return e;
@ -227,18 +76,9 @@ class EditReleaseModal extends React.Component {
return e && e.fileList; return e && e.fileList;
}; };
handleIconChange = ({fileList}) => this.setState({icons: fileList});
handleBinaryFileChange = ({fileList}) => this.setState({binaryFiles: fileList});
handleScreenshotChange = ({fileList}) => this.setState({screenshots: fileList});
handleSubmit = e => { handleSubmit = e => {
e.preventDefault(); e.preventDefault();
const {uuid} = this.props.release; const {formConfig} = this.props;
const config = this.props.context;
const {formConfig} = this.state;
const {specificElements} = formConfig; const {specificElements} = formConfig;
this.props.form.validateFields((err, values) => { this.props.form.validateFields((err, values) => {
@ -246,11 +86,7 @@ class EditReleaseModal extends React.Component {
this.setState({ this.setState({
loading: true loading: true
}); });
const {releaseDescription, releaseType} = values; const {price, isSharedWithAllTenants, binaryFile, icon, screenshots, releaseDescription, releaseType} = values;
const {icons, screenshots, binaryFiles} = this.state;
const data = new FormData();
//add release data //add release data
const release = { const release = {
@ -258,98 +94,115 @@ class EditReleaseModal extends React.Component {
price: 0, price: 0,
isSharedWithAllTenants: false, isSharedWithAllTenants: false,
metaData: JSON.stringify(this.state.metaData), metaData: JSON.stringify(this.state.metaData),
releaseType: releaseType, releaseType: releaseType
}; };
if ((config.deviceTypes.mobileTypes.includes(this.props.deviceType))) {
release.supportedOsVersions = `${this.lowerOsVersion}-${this.upperOsVersion}`;
}
if (specificElements.hasOwnProperty("binaryFile") && binaryFiles.length === 1) {
data.append('binaryFile', binaryFiles[0].originFileObj);
}
if (specificElements.hasOwnProperty("version")) { if (specificElements.hasOwnProperty("version")) {
release.version = values.version; release.version = values.version;
} }
if (specificElements.hasOwnProperty("url")) { if (specificElements.hasOwnProperty("url")) {
release.url = values.url; release.url = values.url;
} }
if (specificElements.hasOwnProperty("packageName")) {
if (icons.length === 1) { release.packageName = values.packageName;
data.append('icon', icons[0].originFileObj);
}
if (screenshots.length > 0) {
data.append('screenshot1', screenshots[0].originFileObj);
} }
if (screenshots.length > 1) { const data = new FormData();
data.append('screenshot2', screenshots[1].originFileObj); let isFormValid = true; // flag to check if this form is valid
}
if (screenshots.length > 2) {
data.append('screenshot3', screenshots[2].originFileObj);
}
const json = JSON.stringify(release);
const blob = new Blob([json], {
type: 'application/json'
});
data.append("applicationRelease", blob);
const url = window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications" + formConfig.endpoint + "/" + uuid;
axios.put(
url,
data
).then(res => {
if (res.status === 200) {
const updatedRelease = res.data.data;
if (formConfig.installationType !== "WEB_CLIP" && formConfig.installationType !== "CUSTOM") {
if (this.lowerOsVersion == null || this.upperOsVersion == null) {
isFormValid = false;
this.setState({ this.setState({
loading: false, osVersionsHelperText: 'Please select supported OS versions',
visible: false, osVersionsValidateStatus: 'error',
}); });
} else if (this.lowerOsVersion >= this.upperOsVersion) {
notification["success"]({ isFormValid = false;
message: "Done!", this.setState({
description: osVersionsHelperText: 'Please select valid range',
"Saved!", osVersionsValidateStatus: 'error',
}); });
// console.log(updatedRelease);
this.props.updateRelease(updatedRelease);
}
}).catch((error) => {
if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = window.location.origin + '/publisher/login';
} else { } else {
notification["error"]({ release.supportedOsVersions = `${this.lowerOsVersion}-${this.upperOsVersion}`;
message: "Something went wrong!",
description:
"Sorry, we were unable to complete your request.",
});
} }
}
if (specificElements.hasOwnProperty("binaryFile") && this.state.binaryFiles.length !== 1) {
isFormValid = false;
this.setState({ this.setState({
loading: false binaryFileHelperText: 'Please select the application'
}); });
}); }
if (this.state.icons.length !== 1) {
isFormValid = false;
this.setState({
iconHelperText: 'Please select an icon'
});
}
if (this.state.screenshots.length !== 3) {
isFormValid = false;
this.setState({
screenshotHelperText: 'Please select 3 screenshots'
});
}
if (this.state.screenshots.length !== 3) {
isFormValid = false;
this.setState({
screenshotHelperText: 'Please select 3 screenshots'
});
}
if (isFormValid) {
data.append('icon', icon[0].originFileObj);
data.append('screenshot1', screenshots[0].originFileObj);
data.append('screenshot2', screenshots[1].originFileObj);
data.append('screenshot3', screenshots[2].originFileObj);
if (specificElements.hasOwnProperty("binaryFile")) {
data.append('binaryFile', binaryFile[0].originFileObj);
}
this.props.onSuccessReleaseData({data, release});
}
} }
}); });
}; };
addNewMetaData = () => { handleIconChange = ({fileList}) => {
if (fileList.length === 1) {
this.setState({
iconHelperText: ''
});
}
this.setState({ this.setState({
metaData: this.state.metaData.concat({'key': '', 'value': ''}) icons: fileList
}) });
};
handleBinaryFileChange = ({fileList}) => {
if (fileList.length === 1) {
this.setState({
binaryFileHelperText: ''
});
}
this.setState({binaryFiles: fileList});
}; };
handlePreviewCancel = () => this.setState({previewVisible: false}); handleScreenshotChange = ({fileList}) => {
if (fileList.length === 3) {
this.setState({
screenshotHelperText: ''
});
}
this.setState({
screenshots: fileList
});
};
handlePriceTypeChange = (value) => {
this.setState({
isFree: (value === 'free')
});
};
handlePreviewCancel = () => this.setState({previewVisible: false});
handlePreview = async file => { handlePreview = async file => {
if (!file.url && !file.preview) { if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj); file.preview = await getBase64(file.originFileObj);
@ -361,31 +214,45 @@ class EditReleaseModal extends React.Component {
}); });
}; };
addNewMetaData = () => {
this.setState({
metaData: this.state.metaData.concat({'key': '', 'value': ''})
})
};
handleLowerOsVersionChange = (lowerOsVersion) => { handleLowerOsVersionChange = (lowerOsVersion) => {
this.lowerOsVersion = lowerOsVersion; this.lowerOsVersion = parseFloat(lowerOsVersion);
this.setState({
osVersionsValidateStatus: 'validating',
osVersionsHelperText: ''
});
}; };
handleUpperOsVersionChange = (upperOsVersion) => { handleUpperOsVersionChange = (upperOsVersion) => {
this.upperOsVersion = upperOsVersion; this.upperOsVersion = parseFloat(upperOsVersion);
this.setState({
osVersionsValidateStatus: 'validating',
osVersionsHelperText: ''
});
}; };
render() { render() {
const {formConfig, supportedOsVersions} = this.props;
const {getFieldDecorator} = this.props.form;
const { const {
formConfig,
icons, icons,
screenshots, screenshots,
loading,
binaryFiles, binaryFiles,
metaData, isFree,
previewImage, previewImage,
previewVisible, previewVisible,
binaryFileHelperText, binaryFileHelperText,
iconHelperText, iconHelperText,
screenshotHelperText screenshotHelperText,
metaData,
osVersionsHelperText,
osVersionsValidateStatus
} = this.state; } = this.state;
const {getFieldDecorator} = this.props.form;
const {isAppUpdatable, supportedOsVersions, deviceType} = this.props;
const config = this.props.context;
const uploadButton = ( const uploadButton = (
<div> <div>
<Icon type="plus"/> <Icon type="plus"/>
@ -395,274 +262,264 @@ class EditReleaseModal extends React.Component {
return ( return (
<div> <div>
<Tooltip title={isAppUpdatable ? "Edit this release" : "This release isn't in an editable state"}> <Row>
<Button <Col md={5}>
disabled={!isAppUpdatable}
size="small" type="primary" onClick={this.showModal}> </Col>
<Icon type="edit"/> Edit <Col md={14}>
</Button> <Form
</Tooltip> labelAlign="right"
<Modal layout="horizontal"
title="Edit release" onSubmit={this.handleSubmit}>
visible={this.state.visible} {formConfig.specificElements.hasOwnProperty("binaryFile") && (
footer={null} <Form.Item {...formItemLayout}
width={580} label="Application"
onCancel={this.handleCancel}> validateStatus="error"
<div> help={binaryFileHelperText}>
<Spin tip="Uploading..." spinning={loading}> {getFieldDecorator('binaryFile', {
<Form labelAlign="left" layout="horizontal" valuePropName: 'binaryFile',
hideRequiredMark
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"/> Change
</Button>
)}
</Upload>,
)}
</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="Icon">
{getFieldDecorator('icon', {
valuePropName: 'icon',
getValueFromEvent: this.normFile, getValueFromEvent: this.normFile,
required: true, required: true,
message: 'Please select a icon' message: 'Please select application'
})( })(
<Upload <Upload
name="logo" name="binaryFile"
listType="picture-card" onChange={this.handleBinaryFileChange}
onChange={this.handleIconChange} beforeUpload={() => false}>
beforeUpload={() => false} {binaryFiles.length !== 1 && (
onPreview={this.handlePreview}> <Button>
{icons.length === 1 ? null : uploadButton} <Icon type="upload"/> Click to upload
</Button>
)}
</Upload>, </Upload>,
)} )}
</Form.Item> </Form.Item>
)}
<Form.Item {...formItemLayout}
label="Icon"
validateStatus="error"
help={iconHelperText}>
{getFieldDecorator('icon', {
valuePropName: 'icon',
getValueFromEvent: this.normFile,
required: true,
message: 'Please select a icon'
})(
<Upload
name="logo"
listType="picture-card"
onChange={this.handleIconChange}
beforeUpload={() => false}
onPreview={this.handlePreview}>
{icons.length === 1 ? null : uploadButton}
</Upload>,
)}
</Form.Item>
<Form.Item {...formItemLayout}
label="Screenshots"
validateStatus="error"
help={screenshotHelperText}>
{getFieldDecorator('screenshots', {
valuePropName: 'icon',
getValueFromEvent: this.normFile,
required: true,
message: 'Please select a icon'
})(
<Upload
name="screenshots"
listType="picture-card"
onChange={this.handleScreenshotChange}
beforeUpload={() => false}
onPreview={this.handlePreview}>
{screenshots.length >= 3 ? null : uploadButton}
</Upload>,
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Screenshots"> {formConfig.specificElements.hasOwnProperty("packageName") && (
{getFieldDecorator('screenshots', { <Form.Item {...formItemLayout} label="Package Name">
valuePropName: 'icon', {getFieldDecorator('packageName', {
getValueFromEvent: this.normFile, rules: [{
required: true, required: true,
message: 'Please select a icon' message: 'Please input the package name'
}],
})( })(
<Upload <Input placeholder="Package Name"/>
name="screenshots"
listType="picture-card"
onChange={this.handleScreenshotChange}
beforeUpload={() => false}
onPreview={this.handlePreview}>
{screenshots.length >= 3 ? null : uploadButton}
</Upload>,
)} )}
</Form.Item> </Form.Item>
)}
<Form.Item {...formItemLayout} label="Release Type"> {formConfig.specificElements.hasOwnProperty("url") && (
{getFieldDecorator('releaseType', { <Form.Item {...formItemLayout} label="URL">
{getFieldDecorator('url', {
rules: [{ rules: [{
required: true, required: true,
message: 'Please input the Release Type' message: 'Please input the url'
}], }],
})( })(
<Input placeholder="Release Type"/> <Input placeholder="url"/>
)} )}
</Form.Item> </Form.Item>
)}
<Form.Item {...formItemLayout} label="Description"> {formConfig.specificElements.hasOwnProperty("version") && (
{getFieldDecorator('releaseDescription', { <Form.Item {...formItemLayout} label="Version">
{getFieldDecorator('version', {
rules: [{ rules: [{
required: true, required: true,
message: 'Please enter a description for release' message: 'Please input the version'
}], }],
})( })(
<TextArea placeholder="Enter a description for release" <Input placeholder="Version"/>
rows={5}/>
)} )}
</Form.Item> </Form.Item>
{(config.deviceTypes.mobileTypes.includes(deviceType)) && ( )}
<Form.Item {...formItemLayout} label="Supported OS Versions">
{getFieldDecorator('supportedOS')( <Form.Item {...formItemLayout} label="Release Type">
<div> {getFieldDecorator('releaseType', {
<InputGroup> rules: [{
<Row gutter={8}> required: true,
<Col span={11}> message: 'Please input the Release Type'
<Form.Item> }],
{getFieldDecorator('lowerOsVersion', { })(
rules: [{ <Input placeholder="Release Type"/>
required: true, )}
message: 'Please select Value' </Form.Item>
}],
})( <Form.Item {...formItemLayout} label="Description">
<Select {getFieldDecorator('releaseDescription', {
placeholder="Lower version" rules: [{
style={{width: "100%"}} required: true,
onChange={this.handleLowerOsVersionChange}> message: 'Please enter a description for release'
{supportedOsVersions.map(version => ( }],
<Option key={version.versionName} })(
value={version.versionName}> <TextArea placeholder="Enter a description for release" rows={5}/>
{version.versionName}
</Option>
))}
</Select>
)}
</Form.Item>
</Col>
<Col span={2}>
<p> - </p>
</Col>
<Col span={11}>
<Form.Item>
{getFieldDecorator('upperOsVersion', {
rules: [{
required: true,
message: 'Please select Value'
}],
})(
<Select style={{width: "100%"}}
placeholder="Upper version"
onChange={this.handleUpperOsVersionChange}>
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
)}
</Form.Item>
</Col>
</Row>
</InputGroup>
</div>
)}
</Form.Item>
)} )}
<Form.Item {...formItemLayout} label="Meta Data"> </Form.Item>
{getFieldDecorator('meta', {
{(formConfig.installationType !== "WEB_CLIP" && formConfig.installationType !== "CUSTOM") && (
<Form.Item
{...formItemLayout}
label="Supported OS Versions"
validateStatus={osVersionsValidateStatus}
help={osVersionsHelperText}>
{getFieldDecorator('supportedOS', {
rules: [{ rules: [{
required: true, required: true
message: 'Please fill empty fields'
}], }],
initialValue: false initialValue: false
})( })(
<div> <div>
{ <InputGroup>
metaData.map((data, index) => { <Row gutter={8}>
return ( <Col span={11}>
<InputGroup key={index}> <Select
<Row gutter={8}> placeholder="Lower version"
<Col span={10}> style={{width: "100%"}}
<Input onChange={this.handleLowerOsVersionChange}>
placeholder="key" {supportedOsVersions.map(version => (
value={data.key} <Option key={version.versionName}
onChange={(e) => { value={version.versionName}>
metaData[index]['key'] = e.currentTarget.value; {version.versionName}
this.setState({ </Option>
metaData ))}
}) </Select>
}}/> </Col>
</Col> <Col span={2}>
<Col span={10}> <p> - </p>
<Input </Col>
placeholder="value" <Col span={11}>
value={data.value} <Select style={{width: "100%"}}
onChange={(e) => { placeholder="Upper version"
metaData[index].value = e.currentTarget.value; onChange={this.handleUpperOsVersionChange}>
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
</Col>
</Row>
</InputGroup>
</div>
)}
</Form.Item>
)}
<Form.Item {...formItemLayout} label="Meta Data">
{getFieldDecorator('meta', {})(
<div>
{
metaData.map((data, index) => {
return (
<InputGroup key={index}>
<Row gutter={8}>
<Col span={5}>
<Input
placeholder="key"
value={data.key}
onChange={(e) => {
metaData[index]['key'] = e.currentTarget.value;
this.setState({
metaData
})
}}/>
</Col>
<Col span={8}>
<Input
placeholder="value"
value={data.value}
onChange={(e) => {
metaData[index].value = e.currentTarget.value;
this.setState({
metaData
});
}}/>
</Col>
<Col span={3}>
<Button type="dashed"
shape="circle"
icon="minus"
onClick={() => {
metaData.splice(index, 1);
this.setState({ this.setState({
metaData metaData
}); });
}}/> }}/>
</Col> </Col>
<Col span={3}> </Row>
<Button type="dashed" </InputGroup>
shape="circle" )
icon="minus" }
onClick={() => { )
metaData.splice(index, 1); }
this.setState({ <Button type="dashed" icon="plus" onClick={this.addNewMetaData}>
metaData Add
}); </Button>
}}/> </div>
</Col> )}
</Row> </Form.Item>
</InputGroup> <Form.Item style={{float: "right", marginLeft: 8}}>
) <Button type="primary" htmlType="submit">
} Submit
) </Button>
} </Form.Item>
<Button type="dashed" icon="plus" onClick={this.addNewMetaData}> <Form.Item style={{float: "right"}}>
Add <Button htmlType="button" onClick={this.props.onClickBackButton}>
</Button> Back
</div> </Button>
)} </Form.Item>
</Form>
</Form.Item> </Col>
<Divider/> </Row>
<Form.Item style={{float: "right", marginLeft: 8}}> <Modal visible={previewVisible} footer={null} onCancel={this.handlePreviewCancel}>
<Button type="primary" htmlType="submit"> <img alt="Preview Image" style={{width: '100%'}} src={previewImage}/>
Update
</Button>
</Form.Item>
<Form.Item style={{float: "right"}}>
<Button htmlType="button" onClick={this.handleCancel}>
Back
</Button>
</Form.Item>
<br/>
</Form>
</Spin>
</div>
<Modal visible={previewVisible} footer={null} onCancel={this.handlePreviewCancel}>
<img alt="Preview Image" style={{width: '100%'}} src={previewImage}/>
</Modal>
</Modal> </Modal>
</div> </div>
); );
} }
} }
const EditRelease = withConfigContext(Form.create({name: 'add-new-release'})(EditReleaseModal)); export default (Form.create({name: 'app-upload-form'})(NewAppUploadForm));
export default EditRelease;
Loading…
Cancel
Save