diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppDetailsDrawer/AppDetailsDrawer.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppDetailsDrawer/AppDetailsDrawer.js
index d42a2a8a09..edfe0e73de 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppDetailsDrawer/AppDetailsDrawer.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppDetailsDrawer/AppDetailsDrawer.js
@@ -490,7 +490,7 @@ class AppDetailsDrawer extends React.Component {
                         <div className="releases-details">
 
                             {(app.type === "ENTERPRISE") && (
-                                <Link to={`/publisher/apps/${app.id}/add-release`}><Button htmlType="button"
+                                <Link to={`/publisher/apps/${app.deviceType}/${app.id}/add-release`}><Button htmlType="button"
                                                                                            size="small">Add
                                     new release</Button></Link>)}
                             <List
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/AddNewAppForm.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/AddNewAppForm.js
index 4e1c89b6f2..6e731679e1 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/AddNewAppForm.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/AddNewAppForm.js
@@ -52,11 +52,19 @@ class AddNewAppFormComponent extends React.Component {
             binaryFiles: [],
             application: null,
             release: null,
-            isError: false
+            isError: false,
+            deviceType: null,
+            supportedOsVersions: []
         };
     }
 
     onSuccessApplicationData = (application) => {
+        const {formConfig} = this.props;
+        if (application.hasOwnProperty("deviceType") &&
+            formConfig.installationType !== "WEB_CLIP" &&
+            formConfig.installationType !== "CUSTOM") {
+            this.getSupportedOsVersions(application.deviceType);
+        }
         this.setState({
             application,
             current: 1
@@ -84,7 +92,7 @@ class AddNewAppFormComponent extends React.Component {
         });
         data.append(formConfig.jsonPayloadName, blob);
 
-        const url = window.location.origin+ 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(
             url,
@@ -119,10 +127,30 @@ class AddNewAppFormComponent extends React.Component {
         this.setState({current});
     };
 
+    getSupportedOsVersions = (deviceType) => {
+        const config = this.props.context;
+        axios.get(
+            window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt +
+            `/admin/device-types/${deviceType}/versions`
+        ).then(res => {
+            if (res.status === 200) {
+                let supportedOsVersions = JSON.parse(res.data.data);
+                this.setState({
+                    supportedOsVersions,
+                    loading: false,
+                });
+            }
+        }).catch((error) => {
+            handleApiError(error, "Error occurred while trying to load supported OS versions.");
+            this.setState({
+                loading: false
+            });
+        });
+    };
+
     render() {
-        const { loading, current, isError} = this.state;
+        const {loading, current, isError, supportedOsVersions} = this.state;
         const {formConfig} = this.props;
-
         return (
             <div>
                 <Spin tip="Uploading..." spinning={loading}>
@@ -142,6 +170,7 @@ class AddNewAppFormComponent extends React.Component {
                                 <div style={{display: (current === 1 ? 'unset' : 'none')}}>
                                     <NewAppUploadForm
                                         formConfig={formConfig}
+                                        supportedOsVersions={supportedOsVersions}
                                         onSuccessReleaseData={this.onSuccessReleaseData}
                                         onClickBackButton={this.onClickBackButton}/>
                                 </div>
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/subForms/NewAppDetailsForm.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/subForms/NewAppDetailsForm.js
index 1acac2779e..1667f2bb4c 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/subForms/NewAppDetailsForm.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/subForms/NewAppDetailsForm.js
@@ -160,8 +160,6 @@ class NewAppDetailsForm extends React.Component {
                     loading: false,
                 });
             }
-
-
         }).catch((error) => {
             handleApiError(error, "Error occurred while trying to load device types.");
             this.setState({
@@ -175,7 +173,6 @@ class NewAppDetailsForm extends React.Component {
         const {categories, tags, deviceTypes} = this.state;
         const {getFieldDecorator} = this.props.form;
 
-
         return (
             <div>
                 <Row>
@@ -186,8 +183,7 @@ class NewAppDetailsForm extends React.Component {
                         <Form
                             labelAlign="right"
                             layout="horizontal"
-                            onSubmit={this.handleSubmit}
-                        >
+                            onSubmit={this.handleSubmit}>
                             {formConfig.installationType !== "WEB_CLIP" && (
                                 <Form.Item {...formItemLayout} label="Device Type">
                                     {getFieldDecorator('deviceType', {
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/subForms/NewAppUploadForm.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/subForms/NewAppUploadForm.js
index 59425a9df1..3dcf2f169e 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/subForms/NewAppUploadForm.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/subForms/NewAppUploadForm.js
@@ -19,15 +19,17 @@
 import React from "react";
 import {Button, Col, Form, Icon, Input, Row, Select, Switch, Upload, InputNumber, Modal} from "antd";
 import "@babel/polyfill";
+import axios from "axios";
+import {handleApiError} from "../../../js/Utils";
 
 const formItemLayout = {
     labelCol: {
         xs: {span: 24},
-        sm: {span: 5},
+        sm: {span: 8},
     },
     wrapperCol: {
         xs: {span: 24},
-        sm: {span: 19},
+        sm: {span: 16},
     },
 };
 const {Option} = Select;
@@ -60,7 +62,9 @@ class NewAppUploadForm extends React.Component {
             iconHelperText: '',
             screenshotHelperText: '',
             metaData: []
-        }
+        };
+        this.lowerOsVersion = null;
+        this.upperOsVersion = null;
     }
 
     normFile = e => {
@@ -95,7 +99,7 @@ class NewAppUploadForm extends React.Component {
                 };
 
                 if (formConfig.installationType !== "WEB_CLIP" && formConfig.installationType !== "CUSTOM") {
-                    release.supportedOsVersions = "4-30";
+                    release.supportedOsVersions = `${this.lowerOsVersion}-${this.upperOsVersion}`;
                 }
 
                 if (specificElements.hasOwnProperty("version")) {
@@ -190,8 +194,16 @@ class NewAppUploadForm extends React.Component {
         })
     };
 
+    handleLowerOsVersionChange = (lowerOsVersion) => {
+        this.lowerOsVersion = lowerOsVersion;
+    };
+
+    handleUpperOsVersionChange = (upperOsVersion) => {
+        this.upperOsVersion = upperOsVersion;
+    };
+
     render() {
-        const {formConfig} = this.props;
+        const {formConfig, supportedOsVersions} = this.props;
         const {getFieldDecorator} = this.props.form;
         const {
             icons,
@@ -354,6 +366,46 @@ class NewAppUploadForm extends React.Component {
                                 )}
                             </Form.Item>
 
+                            {(formConfig.installationType !== "WEB_CLIP" && formConfig.installationType !== "CUSTOM") && (
+                                <Form.Item {...formItemLayout} label="Supported OS Versions">
+                                    {getFieldDecorator('supportedOS')(
+                                        <div>
+                                            <InputGroup>
+                                                <Row gutter={8}>
+                                                    <Col span={11}>
+                                                        <Select
+                                                            placeholder="Lower version"
+                                                            style={{width: "100%"}}
+                                                            onChange={this.handleLowerOsVersionChange}>
+                                                            {supportedOsVersions.map(version => (
+                                                                <Option key={version.versionName}
+                                                                        value={version.versionName}>
+                                                                    {version.versionName}
+                                                                </Option>
+                                                            ))}
+                                                        </Select>
+                                                    </Col>
+                                                    <Col span={2}>
+                                                        <p> - </p>
+                                                    </Col>
+                                                    <Col span={11}>
+                                                        <Select style={{width: "100%"}}
+                                                                placeholder="Upper version"
+                                                                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="Price Type">
                                 {getFieldDecorator('select', {
                                     rules: [{required: true, message: 'Please select price Type'}],
@@ -419,22 +471,22 @@ class NewAppUploadForm extends React.Component {
                                                                         placeholder="key"
                                                                         value={data.key}
                                                                         onChange={(e) => {
-                                                                        metaData[index]['key'] = e.currentTarget.value;
-                                                                        this.setState({
-                                                                            metaData
-                                                                        })
-                                                                    }}/>
+                                                                            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
-                                                                        });
-                                                                    }}/>
+                                                                            metaData[index].value = e.currentTarget.value;
+                                                                            this.setState({
+                                                                                metaData
+                                                                            });
+                                                                        }}/>
                                                                 </Col>
                                                                 <Col span={3}>
                                                                     <Button type="dashed"
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-release/AddReleaseForm.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-release/AddReleaseForm.js
index 9d9b354157..c3c7abbb1f 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-release/AddReleaseForm.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-release/AddReleaseForm.js
@@ -63,10 +63,38 @@ class AddNewReleaseFormComponent extends React.Component {
             screenshots: [],
             loading: false,
             binaryFiles: [],
-            isFree: true
+            isFree: true,
+            supportedOsVersions: []
         };
+        this.lowerOsVersion = null;
+        this.upperOsVersion = null;
     }
 
+    componentDidMount() {
+        this.getSupportedOsVersions(this.props.deviceType);
+    }
+
+    getSupportedOsVersions = (deviceType) => {
+        const config = this.props.context;
+        axios.get(
+            window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt +
+            `/admin/device-types/${deviceType}/versions`
+        ).then(res => {
+            if (res.status === 200) {
+                let supportedOsVersions = JSON.parse(res.data.data);
+                this.setState({
+                    supportedOsVersions,
+                    loading: false,
+                });
+            }
+        }).catch((error) => {
+            handleApiError(error, "Error occurred while trying to load supported OS versions.");
+            this.setState({
+                loading: false
+            });
+        });
+    };
+
     handleSubmit = e => {
         const config = this.props.context;
         e.preventDefault();
@@ -89,9 +117,8 @@ class AddNewReleaseFormComponent extends React.Component {
                     isSharedWithAllTenants,
                     metaData: "string",
                     releaseType: releaseType,
-                    supportedOsVersions: "4-30"
+                    supportedOsVersions: `${this.lowerOsVersion}-${this.upperOsVersion}`
                 };
-
                 data.append('binaryFile', binaryFile[0].originFileObj);
                 data.append('icon', icon[0].originFileObj);
                 data.append('screenshot1', screenshots[0].originFileObj);
@@ -105,7 +132,7 @@ class AddNewReleaseFormComponent extends React.Component {
 
                 data.append("applicationRelease", blob);
 
-                const url = window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/"+deviceType+"/ent-app/" + appId;
+                const url = window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + deviceType + "/ent-app/" + appId;
 
                 axios.post(
                     url,
@@ -124,7 +151,7 @@ class AddNewReleaseFormComponent extends React.Component {
 
                         const uuid = res.data.data.uuid;
 
-                        this.props.history.push('/publisher/apps/releases/'+uuid);
+                        this.props.history.push('/publisher/apps/releases/' + uuid);
                     }
 
                 }).catch((error) => {
@@ -155,8 +182,16 @@ class AddNewReleaseFormComponent extends React.Component {
         });
     };
 
+    handleLowerOsVersionChange = (lowerOsVersion) => {
+        this.lowerOsVersion = lowerOsVersion;
+    };
+
+    handleUpperOsVersionChange = (upperOsVersion) => {
+        this.upperOsVersion = upperOsVersion;
+    };
+
     render() {
-        const {isFree, icons, screenshots, loading, binaryFiles} = this.state;
+        const {isFree, icons, screenshots, loading, binaryFiles, supportedOsVersions} = this.state;
         const {getFieldDecorator} = this.props.form;
         return (
             <div>
@@ -264,6 +299,45 @@ class AddNewReleaseFormComponent extends React.Component {
                                                 )}
                                             </Form.Item>
 
+                                            <Form.Item {...formItemLayout} label="Supported OS Versions">
+                                                {getFieldDecorator('supportedOS')(
+                                                    <div>
+                                                        <InputGroup>
+                                                            <Row gutter={8}>
+                                                                <Col span={11}>
+                                                                    <Select
+                                                                        placeholder="Lower version"
+                                                                        style={{width: "100%"}}
+                                                                        onChange={this.handleLowerOsVersionChange}>
+                                                                        {supportedOsVersions.map(version => (
+                                                                            <Option key={version.versionName}
+                                                                                    value={version.versionName}>
+                                                                                {version.versionName}
+                                                                            </Option>
+                                                                        ))}
+                                                                    </Select>
+                                                                </Col>
+                                                                <Col span={2}>
+                                                                    <p> - </p>
+                                                                </Col>
+                                                                <Col span={11}>
+                                                                    <Select style={{width: "100%"}}
+                                                                            placeholder="Upper version"
+                                                                            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="Price Type">
                                                 {getFieldDecorator('select', {
                                                     rules: [{required: true, message: 'Please select price Type'}],