diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/scenes/Home/scenes/Apps/scenes/Release/components/ReleaseView/components/DeleteRelease/index.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/scenes/Home/scenes/Apps/scenes/Release/components/ReleaseView/components/DeleteRelease/index.js
new file mode 100644
index 0000000000..7076728097
--- /dev/null
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/scenes/Home/scenes/Apps/scenes/Release/components/ReleaseView/components/DeleteRelease/index.js
@@ -0,0 +1,87 @@
+/*
+ * Copyright (c) 2020, Entgra (pvt) Ltd. (http://entgra.io) All Rights Reserved.
+ *
+ * Entgra (pvt) Ltd. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import React from 'react';
+import { Modal, Button, Icon, notification } from 'antd';
+import axios from 'axios';
+import { handleApiError } from '../../../../../../../../../../services/utils/errorHandler';
+import { withConfigContext } from '../../../../../../../../../../components/ConfigContext';
+import { withRouter } from 'react-router-dom';
+const { confirm } = Modal;
+
+class DeleteRelease extends React.Component {
+  showModal = () => {
+    confirm({
+      title: 'Are you sure you want to delete the application release?',
+      content:
+        'If you have multiple application releases, only the selected app release will be ' +
+        'deleted. Otherwise, the whole application will be deleted. Further note, this will ' +
+        'delete application artifacts permanently.\n' +
+        'Be careful, this process cannot be undone.',
+      okText: 'Yes',
+      okType: 'danger',
+      cancelText: 'No',
+      onOk: this.deleteRelease,
+    });
+  };
+
+  deleteRelease = () => {
+    const config = this.props.context;
+    const apiUrl =
+      window.location.origin +
+      config.serverConfig.invoker.uri +
+      config.serverConfig.invoker.publisher +
+      '/admin/applications/release/' +
+      this.props.uuid;
+    axios
+      .delete(apiUrl)
+      .then(res => {
+        if (res.status === 200) {
+          notification.success({
+            message: 'Successfully deleted the release',
+          });
+          this.props.history.push('/publisher');
+        }
+      })
+      .catch(error => {
+        handleApiError(
+          'Something Went wrong when trying to delete the release, Please contact  the administrator',
+        );
+        this.setState({
+          loading: false,
+        });
+      });
+  };
+
+  render() {
+    return (
+      <>
+        <Button
+          disabled={!this.props.isDeletableState}
+          size="small"
+          type="danger"
+          onClick={this.showModal}
+        >
+          <Icon type="delete" /> Delete
+        </Button>
+      </>
+    );
+  }
+}
+
+export default withConfigContext(withRouter(DeleteRelease));
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/scenes/Home/scenes/Apps/scenes/Release/components/ReleaseView/components/EditRelease/index.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/scenes/Home/scenes/Apps/scenes/Release/components/ReleaseView/components/EditRelease/index.js
index a4f7788223..790513658f 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/scenes/Home/scenes/Apps/scenes/Release/components/ReleaseView/components/EditRelease/index.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/scenes/Home/scenes/Apps/scenes/Release/components/ReleaseView/components/EditRelease/index.js
@@ -403,7 +403,7 @@ class EditReleaseModal extends React.Component {
     );
 
     return (
-      <div>
+      <>
         <Tooltip
           title={
             isAppUpdatable
@@ -726,7 +726,7 @@ class EditReleaseModal extends React.Component {
             />
           </Modal>
         </Modal>
-      </div>
+      </>
     );
   }
 }
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/scenes/Home/scenes/Apps/scenes/Release/components/ReleaseView/index.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/scenes/Home/scenes/Apps/scenes/Release/components/ReleaseView/index.js
index b661a561d0..e416d0d8a4 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/scenes/Home/scenes/Apps/scenes/Release/components/ReleaseView/index.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/scenes/Home/scenes/Apps/scenes/Release/components/ReleaseView/index.js
@@ -34,6 +34,7 @@ import DetailedRating from '../../../../components/DetailedRating';
 import EditRelease from './components/EditRelease';
 import { withConfigContext } from '../../../../../../../../components/ConfigContext';
 import Authorized from '../../../../../../../../components/Authorized/Authorized';
+import DeleteRelease from './components/DeleteRelease';
 
 const { Title, Text, Paragraph } = Typography;
 
@@ -51,10 +52,12 @@ class ReleaseView extends React.Component {
       return null;
     }
     let isAppUpdatable,
-      isAppInstallable = false;
+      isAppInstallable,
+      isDeletableState = false;
     if (lifecycle != null) {
       isAppUpdatable = lifecycle[currentLifecycleStatus].isAppUpdatable;
       isAppInstallable = lifecycle[currentLifecycleStatus].isAppInstallable;
+      isDeletableState = lifecycle[currentLifecycleStatus].isDeletableState;
     }
 
     const platform = app.deviceType;
@@ -103,14 +106,21 @@ class ReleaseView extends React.Component {
               <Authorized
                 permission="/permission/admin/app-mgt/publisher/application/update"
                 yes={
-                  <EditRelease
-                    isAppUpdatable={isAppUpdatable}
-                    type={app.type}
-                    deviceType={app.deviceType}
-                    release={release}
-                    updateRelease={this.props.updateRelease}
-                    supportedOsVersions={[...this.props.supportedOsVersions]}
-                  />
+                  <>
+                    <EditRelease
+                      isAppUpdatable={isAppUpdatable}
+                      type={app.type}
+                      deviceType={app.deviceType}
+                      release={release}
+                      updateRelease={this.props.updateRelease}
+                      supportedOsVersions={[...this.props.supportedOsVersions]}
+                    />
+                    <Divider type="vertical" />
+                    <DeleteRelease
+                      uuid={release.uuid}
+                      isDeletableState={isDeletableState}
+                    />
+                  </>
                 }
               />
             </Col>