From e9cb3eae91d222d9905a433260338aac5e5985f8 Mon Sep 17 00:00:00 2001
From: Jayasanka <jayasanka.sack@gmail.com>
Date: Sat, 5 Oct 2019 22:05:19 +0530
Subject: [PATCH] Use common function to handle ajax call errors in APPM UI

---
 .../react-app/public/conf/config.json         |   2 +-
 .../apps/detailed-rating/DetailedRating.js    |  12 +-
 .../AppDetailsDrawer/AppDetailsDrawer.js      |  23 +---
 .../src/components/apps/list-apps/Filters.js  |  34 +----
 .../src/components/apps/list-apps/ListApps.js |  62 ----------
 .../apps/list-apps/appsTable/AppsTable.js     |  14 +--
 .../apps/release/lifeCycle/LifeCycle.js       |  11 +-
 .../apps/release/nodes/CustomNode.css         |  39 ------
 .../apps/release/nodes/CustomNode.jsx         |  54 --------
 .../components/apps/release/review/Reviews.js |  12 +-
 .../apps/release/temp/LifeCycleGraph.js       | 116 ------------------
 .../ManagedConfigurationsIframe.js            |  26 +---
 .../manage/categories/ManageCategories.js     |  44 +------
 .../manage/categories/ManageTags.js           |  48 +-------
 .../src/components/new-app/AddNewAppForm.js   |  12 +-
 .../src/components/new-app/IconImg.js         |  84 -------------
 .../components/new-app/UploadScreenshots.js   |  67 ----------
 .../new-app/subForms/NewAppDetailsForm.js     |  39 +-----
 .../components/new-release/AddReleaseForm.js  |  12 +-
 .../react-app/src/js/Utils.js                 |   3 +-
 .../react-app/src/pages/Login.js              |  14 +--
 .../add-new-app/components/AddTagModal.js     |  67 ----------
 .../src/pages/dashboard/apps/Apps.js          |   2 -
 .../pages/dashboard/apps/release/Release.js   |  25 +---
 .../src/pages/dashboard/logout/Logout.js      |   1 -
 .../manage/android-enterprise/page/Page.js    |  14 +--
 26 files changed, 46 insertions(+), 791 deletions(-)
 delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/nodes/CustomNode.css
 delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/nodes/CustomNode.jsx
 delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/temp/LifeCycleGraph.js
 delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/IconImg.js
 delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/UploadScreenshots.js
 delete mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/add-new-app/components/AddTagModal.js

diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/public/conf/config.json b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/public/conf/config.json
index 88d68e9e8d..65013996e0 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/public/conf/config.json
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/public/conf/config.json
@@ -1,7 +1,7 @@
 {
   "theme": {
     "logo": "https://entgra.io/assets/images/svg/logo.svg",
-    "primaryColor": "#badc58"
+    "primaryColor": "rgb(24, 144, 255)"
   },
   "serverConfig": {
     "invoker": {
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js
index 876c3b3232..2ef88827be 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/detailed-rating/DetailedRating.js
@@ -22,6 +22,7 @@ import StarRatings from "react-star-ratings";
 import "./DetailedRating.css";
 import axios from "axios";
 import {withConfigContext} from "../../../context/ConfigContext";
+import {handleApiError} from "../../../js/Utils";
 
 const { Text } = Typography;
 
@@ -60,16 +61,7 @@ class DetailedRating extends React.Component{
             }
 
         }).catch(function (error) {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin+'/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load rating for the release.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load rating for the release.");
         });
     };
 
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 12cf8cb591..d42a2a8a09 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
@@ -42,6 +42,7 @@ import pSBC from "shade-blend-color";
 import {withConfigContext} from "../../../../context/ConfigContext";
 import ManagedConfigurationsIframe
     from "../../../manage/android-enterprise/ManagedConfigurationsIframe/ManagedConfigurationsIframe";
+import {handleApiError} from "../../../../js/Utils";
 
 const {Meta} = Card;
 const {Text, Title} = Typography;
@@ -135,16 +136,7 @@ class AppDetailsDrawer extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin + '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load app details.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load app details.");
             this.setState({
                 loading: false
             });
@@ -175,16 +167,7 @@ class AppDetailsDrawer extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin + '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load tags.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load tags.");
             this.setState({
                 loading: false
             });
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/Filters.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/Filters.js
index d5f8e770c2..de8bbf8357 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/Filters.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/Filters.js
@@ -34,6 +34,7 @@ import {
 } from "antd";
 import axios from "axios";
 import {withConfigContext} from "../../../context/ConfigContext";
+import {handleApiError} from "../../../js/Utils";
 
 const {Option} = Select;
 const {Title} = Typography;
@@ -92,16 +93,7 @@ class FiltersForm extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load categories.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load categories.");
             this.setState({
                 loading: false
             });
@@ -123,16 +115,7 @@ class FiltersForm extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load tags.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load tags.");
             this.setState({
                 loading: false
             });
@@ -154,16 +137,7 @@ class FiltersForm extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load device types.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load device types.");
             this.setState({
                 loading: false
             });
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/ListApps.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/ListApps.js
index d5639cea70..ec5b7a25d9 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/ListApps.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/ListApps.js
@@ -52,68 +52,6 @@ class ListApps extends React.Component {
         });
     };
 
-    getCategories = () => {
-        const config = this.props.context;
-        axios.get(
-            window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories"
-        ).then(res => {
-            if (res.status === 200) {
-                let categories = JSON.parse(res.data.data);
-                this.getTags();
-                this.setState({
-                    categories: categories,
-                    loading: false
-                });
-            }
-
-        }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load categories.",
-                });
-            }
-            this.setState({
-                loading: false
-            });
-        });
-    };
-
-    getTags = () => {
-        const config = this.props.context;
-        axios.get(
-            window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags"
-        ).then(res => {
-            if (res.status === 200) {
-                let tags = JSON.parse(res.data.data);
-                this.getDeviceTypes();
-                this.setState({
-                    tags: tags,
-                    loading: false,
-                });
-            }
-
-        }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load tags.",
-                });
-            }
-            this.setState({
-                loading: false
-            });
-        });
-    };
-
     render() {
         const {isDrawerVisible, filters} = this.state;
         return (
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/appsTable/AppsTable.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/appsTable/AppsTable.js
index 8fe5b00cce..aae593fb2a 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/appsTable/AppsTable.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/appsTable/AppsTable.js
@@ -23,6 +23,7 @@ import pSBC from 'shade-blend-color';
 import "./AppsTable.css";
 import {withConfigContext} from "../../../../context/ConfigContext";
 import AppDetailsDrawer from "../AppDetailsDrawer/AppDetailsDrawer";
+import {handleApiError} from "../../../../js/Utils";
 
 let config = null;
 
@@ -214,18 +215,7 @@ class AppsTable extends React.Component {
                 });
             }
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                message.error('You are not logged in');
-                window.location.href = window.location.origin + '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load the apps.",
-                });
-            }
-
+            handleApiError(error, "Error occurred while trying to load apps.");
             this.setState({loading: false});
         });
     };
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/LifeCycle.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/LifeCycle.js
index eac2b0ff98..3230939c72 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/LifeCycle.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/lifeCycle/LifeCycle.js
@@ -24,6 +24,7 @@ import 'react-quill/dist/quill.snow.css';
 import './LifeCycle.css';
 import LifeCycleDetailsModal from "./lifeCycleDetailsModal/lifeCycleDetailsModal";
 import {withConfigContext} from "../../../../context/ConfigContext";
+import {handleApiError} from "../../../../js/Utils";
 
 const {Text, Title, Paragraph} = Typography;
 const {Option} = Select;
@@ -120,15 +121,7 @@ class LifeCycle extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin + '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "Error",
-                    description:
-                        "Error occurred while trying to add lifecycle",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to add lifecycle");
             this.setState({
                 isConfirmButtonLoading: false
             });
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/nodes/CustomNode.css b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/nodes/CustomNode.css
deleted file mode 100644
index f248b81287..0000000000
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/nodes/CustomNode.css
+++ /dev/null
@@ -1,39 +0,0 @@
-/*
- * Copyright (c) 2019, 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.
- */
-
-
-/* --- Shape for the nodes --- */
-
-.node {
-    width: 75px;
-    height: 30px;
-    border-radius: 20% 20% 20% 20%;
-    overflow: hidden;
-    box-sizing: border-box;
-    display: flex;
-}
-
-
-.node .name {
-    padding: 5%;
-    font-size: 0.5rem;
-    font-weight: bold;
-    text-align: center;
-    text-transform: uppercase;
-    color: white;
-}
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/nodes/CustomNode.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/nodes/CustomNode.jsx
deleted file mode 100644
index 761d227a96..0000000000
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/nodes/CustomNode.jsx
+++ /dev/null
@@ -1,54 +0,0 @@
-/*
- * Copyright (c) 2019, 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 "./CustomNode.css";
-
-
-/**
- * Component that renders a person's name and gender, along with icons
- * representing if they have a driver license for bike and / or car.
- * @param {Object} props component props to render.
- */
-function CustomNode({ node }) {
-
-    return (
-        <div className="node" style={{backgroundColor: node.color}}>
-            <div className="name">{node.id}</div>
-
-            {/*<div className="flex-container fill-space flex-container-row">*/}
-                {/*<div className="fill-space">*/}
-                    {/*<div*/}
-                        {/*className="icon"*/}
-                        {/*style={{ backgroundImage: `url('${isMale ? ICON_TYPES.MAN : ICON_TYPES.WOMAN}')` }}*/}
-                    {/*/>*/}
-                {/*</div>*/}
-
-                {/*<div className="icon-bar">*/}
-                    {/*{person.hasBike && (*/}
-                        {/*<div className="icon" style={{ backgroundImage: `url('${ICON_TYPES.BIKE}')` }} />*/}
-                    {/*)}*/}
-                    {/*{person.hasCar && <div className="icon" style={{ backgroundImage: `url('${ICON_TYPES.CAR}')` }} />}*/}
-                {/*</div>*/}
-            {/*</div>*/}
-        </div>
-    );
-}
-
-export default CustomNode;
\ No newline at end of file
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/review/Reviews.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/review/Reviews.js
index 51041c277a..0e75a3d663 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/review/Reviews.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/review/Reviews.js
@@ -24,6 +24,7 @@ import InfiniteScroll from 'react-infinite-scroller';
 import SingleReview from "./SingleReview";
 import axios from "axios";
 import {withConfigContext} from "../../../../context/ConfigContext";
+import {handleApiError} from "../../../../js/Utils";
 
 const limit = 5;
 
@@ -58,16 +59,7 @@ class Reviews extends React.Component {
             }
 
         }).catch(function (error) {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load reviews.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load reviews.");
         });
     };
 
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/temp/LifeCycleGraph.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/temp/LifeCycleGraph.js
deleted file mode 100644
index a5b41fb58d..0000000000
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/temp/LifeCycleGraph.js
+++ /dev/null
@@ -1,116 +0,0 @@
-/*
- * Copyright (c) 2019, 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 * as SRD from "storm-react-diagrams";
-import "storm-react-diagrams/dist/style.min.css";
-import "./LifeCycle.css";
-import {distributeElements} from "../../../js/utils/dagre-utils.ts";
-
-const inPortName = "IN";
-const outPortName = "OUT";
-
-class LifeCycleGraph extends React.Component {
-    render() {
-
-        const lifecycle = this.props.lifecycle;
-        const nodes = [];
-        const links = [];
-
-        const engine = new SRD.DiagramEngine();
-        engine.installDefaultFactories();
-
-        const model = new SRD.DiagramModel();
-        const nextStates = lifecycle[this.props.currentStatus].proceedingStates;
-
-
-        Object.keys(lifecycle).forEach((stateName) => {
-            let color = "rgb(83, 92, 104)";
-            if (stateName === this.props.currentStatus) {
-                color = "rgb(192,255,0)";
-            } else if (nextStates.includes(stateName)) {
-                color = "rgb(0,192,255)";
-            }
-            const node = createNode(stateName, color);
-            nodes.push(node);
-            lifecycle[stateName].node = node;
-        });
-
-        Object.keys(lifecycle).forEach((stateName) => {
-            const state = lifecycle[stateName];
-            //todo: remove checking property
-            if (state.hasOwnProperty("proceedingStates")) {
-
-                state.proceedingStates.forEach((proceedingState) => {
-                    links.push(connectNodes(state.node, lifecycle[proceedingState].node));
-                });
-            }
-        });
-
-        nodes.forEach((node) => {
-            model.addNode(node);
-            // node.addListener({
-            //     selectionChanged: (node, isSelected) => {
-            //         console.log(isSelected);
-            //     }
-            // });
-        });
-        links.forEach((link) => {
-            model.addLink(link);
-        });
-
-
-        let distributedModel = getDistributedModel(engine, model);
-        engine.setDiagramModel(distributedModel);
-
-        return (
-            <div style={{height: 500}}>
-                <SRD.DiagramWidget diagramEngine={engine} maxNumberPointsPerLink={10} smartRouting={true}/>
-            </div>
-        );
-    }
-}
-
-function getDistributedModel(engine, model) {
-    const serialized = model.serializeDiagram();
-    const distributedSerializedDiagram = distributeElements(serialized);
-
-    //deserialize the model
-    let deSerializedModel = new SRD.DiagramModel();
-    deSerializedModel.deSerializeDiagram(distributedSerializedDiagram, engine);
-    return deSerializedModel;
-}
-
-function createNode(name, color) {
-    const node = new SRD.DefaultNodeModel(name, color);
-    node.addPort(new SRD.DefaultPortModel(true, inPortName, " "));
-    node.addPort(new SRD.DefaultPortModel(false, outPortName, " "));
-    return node;
-}
-
-let count = 0;
-
-function connectNodes(nodeFrom, nodeTo) {
-    return nodeFrom.getPort(outPortName).link(nodeTo.getPort(inPortName));
-}
-
-function f() {
-    // console.log(1);
-}
-
-export default LifeCycleGraph;
\ No newline at end of file
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/android-enterprise/ManagedConfigurationsIframe/ManagedConfigurationsIframe.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/android-enterprise/ManagedConfigurationsIframe/ManagedConfigurationsIframe.js
index dcc994dad6..67b3804958 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/android-enterprise/ManagedConfigurationsIframe/ManagedConfigurationsIframe.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/android-enterprise/ManagedConfigurationsIframe/ManagedConfigurationsIframe.js
@@ -75,18 +75,7 @@ class ManagedConfigurationsIframe extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                message.error('You are not logged in');
-                window.location.href = window.location.origin + '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load configurations.",
-                });
-            }
-
+            handleApiError(error, "Error occurred while trying to load configurations.");
             this.setState({loading: false, visible: false});
         });
     };
@@ -154,18 +143,7 @@ class ManagedConfigurationsIframe extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                message.error('You are not logged in');
-                window.location.href = window.location.origin + '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to update configurations.",
-                });
-            }
-
+            handleApiError(error, "Error occurred while trying to update configurations.");
             this.setState({loading: false});
         });
     };
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js
index 526d2a7b7a..984cd5d67d 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js
@@ -38,6 +38,7 @@ import axios from "axios";
 import {TweenOneGroup} from 'rc-tween-one';
 import pSBC from "shade-blend-color";
 import {withConfigContext} from "../../../context/ConfigContext";
+import {handleApiError} from "../../../js/Utils";
 
 const {Title} = Typography;
 
@@ -69,12 +70,7 @@ class ManageCategories extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                message.warning('Something went wrong');
-
-            }
+            handleApiError(error, "Error occured while trying to load categories");
             this.setState({
                 loading: false
             });
@@ -116,17 +112,7 @@ class ManageCategories extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                message.error('You are not logged in');
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load categories.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load categories.");
             this.setState({
                 loading: false
             });
@@ -264,17 +250,7 @@ class ManageCategories extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                message.error('You are not logged in');
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to add categories.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to add categories.");
             this.setState({
                 loading: false
             });
@@ -331,17 +307,7 @@ class ManageCategories extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                message.error('You are not logged in');
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to delete the category.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to delete the category.");
             this.setState({
                 loading: false,
                 editingValue: null
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js
index e204e4d99b..69c269bc17 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js
@@ -36,6 +36,7 @@ import {
 import axios from "axios";
 import {TweenOneGroup} from 'rc-tween-one';
 import {withConfigContext} from "../../../context/ConfigContext";
+import {handleApiError} from "../../../js/Utils";
 
 const {Title} = Typography;
 
@@ -67,16 +68,7 @@ class ManageTags extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load tags.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load tags.");
             this.setState({
                 loading: false
             });
@@ -120,17 +112,7 @@ class ManageTags extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                message.error('You are not logged in');
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to delete the tag.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to delete the tag.");
             this.setState({
                 loading: false
             });
@@ -265,17 +247,7 @@ class ManageTags extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                message.error('You are not logged in');
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to delete tag.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to delete tag.");
             this.setState({
                 loading: false
             });
@@ -332,17 +304,7 @@ class ManageTags extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                message.error('You are not logged in');
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to edit tag.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to edit tag.");
             this.setState({
                 loading: false,
                 editingValue: null
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 7529778de5..4e1c89b6f2 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
@@ -33,6 +33,7 @@ import {withRouter} from 'react-router-dom';
 import NewAppDetailsForm from "./subForms/NewAppDetailsForm";
 import NewAppUploadForm from "./subForms/NewAppUploadForm";
 import {withConfigContext} from "../../context/ConfigContext";
+import {handleApiError} from "../../js/Utils";
 
 const {Step} = Steps;
 
@@ -103,16 +104,7 @@ class AddNewAppFormComponent extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin+ '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "Something went wrong!",
-                    description:
-                        "Sorry, we were unable to complete your request.",
-                });
-
-            }
+            handleApiError(error, "Sorry, we were unable to complete your request.")
             this.setState({
                 loading: false,
                 isError: true,
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/IconImg.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/IconImg.js
deleted file mode 100644
index 077ca6a3f9..0000000000
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/IconImg.js
+++ /dev/null
@@ -1,84 +0,0 @@
-/*
- * Copyright (c) 2019, 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 { Upload, Icon, message } from 'antd';
-
-function getBase64(img, callback) {
-    const reader = new FileReader();
-    reader.addEventListener('load', () => callback(reader.result));
-    reader.readAsDataURL(img);
-}
-
-function beforeUpload(file) {
-    const isJPG = file.type === 'image/jpeg';
-    if (!isJPG) {
-        message.error('You can only upload JPG file!');
-    }
-    const isLt2M = file.size / 1024 / 1024 < 2;
-    if (!isLt2M) {
-        message.error('Image must smaller than 2MB!');
-    }
-    return isJPG && isLt2M;
-}
-
-
-class IconImage extends React.Component {
-    state = {
-        loading: false,
-    };
-
-    handleChange = (info) => {
-        if (info.file.status === 'uploading') {
-            this.setState({ loading: true });
-            return;
-        }
-        if (info.file.status === 'done') {
-            // Get this url from response in real world.
-            getBase64(info.file.originFileObj, imageUrl => this.setState({
-                imageUrl,
-                loading: false,
-            }));
-        }
-    };
-
-    render() {
-        const uploadButton = (
-            <div>
-                <Icon type={this.state.loading ? 'loading' : 'plus'} />
-                <div className="ant-upload-text">Upload</div>
-            </div>
-        );
-        const imageUrl = this.state.imageUrl;
-        return (
-            <Upload
-                name="avatar"
-                listType="picture-card"
-                className="avatar-uploader"
-                showUploadList={false}
-                action="//jsonplaceholder.typicode.com/posts/"
-                beforeUpload={beforeUpload}
-                onChange={this.handleChange}
-            >
-                {imageUrl ? <img src={imageUrl} alt="avatar" /> : uploadButton}
-            </Upload>
-        );
-    }
-}
-
-export default IconImage;
\ No newline at end of file
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/UploadScreenshots.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/UploadScreenshots.js
deleted file mode 100644
index b5405e8748..0000000000
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/UploadScreenshots.js
+++ /dev/null
@@ -1,67 +0,0 @@
-/*
- * Copyright (c) 2019, 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 { Upload, Icon, Modal} from 'antd';
-
-
-class UploadScreenshots extends React.Component {
-    state = {
-        previewVisible: false,
-        previewImage: '',
-        fileList: [],
-    };
-
-    handleCancel = () => this.setState({ previewVisible: false });
-
-    handlePreview = (file) => {
-        this.setState({
-            previewImage: file.url || file.thumbUrl,
-            previewVisible: true,
-        });
-    };
-
-    handleChange = ({ fileList }) => this.setState({ fileList });
-
-    render() {
-        const { previewVisible, previewImage, fileList } = this.state;
-        const uploadButton = (
-            <div>
-                <Icon type="plus" />
-                <div className="ant-upload-text">Upload</div>
-            </div>
-        );
-        return (
-            <div className="clearfix">
-                <Upload
-                    action="//jsonplaceholder.typicode.com/posts/"
-                    listType="picture-card"
-                    fileList={fileList}
-                    onPreview={this.handlePreview}
-                    onChange={this.handleChange}
-                >
-                    {fileList.length >= 3 ? null : uploadButton}
-                </Upload>
-                <Modal visible={previewVisible} footer={null} onCancel={this.handleCancel}>
-                    <img alt="example" style={{ width: '100%' }} src={previewImage} />
-                </Modal>
-            </div>
-        );
-    }
-}
-export default UploadScreenshots;
\ No newline at end of file
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 94c37634e6..1acac2779e 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
@@ -20,6 +20,7 @@ import React from "react";
 import {Button, Col, Divider, Form, Icon, Input, notification, Row, Select, Switch, Upload} from "antd";
 import axios from "axios";
 import {withConfigContext} from "../../../context/ConfigContext";
+import {handleApiError} from "../../../js/Utils";
 
 const formItemLayout = {
     labelCol: {
@@ -80,8 +81,6 @@ class NewAppDetailsForm extends React.Component {
 
     componentDidMount() {
         this.getCategories();
-        this.getTags();
-        this.getDeviceTypes();
     }
 
     getCategories = () => {
@@ -96,18 +95,10 @@ class NewAppDetailsForm extends React.Component {
                     loading: false
                 });
             }
+            this.getTags();
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin + '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load categories.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load categories.");
             this.setState({
                 loading: false
             });
@@ -126,18 +117,10 @@ class NewAppDetailsForm extends React.Component {
                     loading: false,
                 });
             }
+            this.getDeviceTypes();
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin + '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load tags.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load tags.");
             this.setState({
                 loading: false
             });
@@ -180,17 +163,7 @@ class NewAppDetailsForm extends React.Component {
 
 
         }).catch((error) => {
-            console.log(error);
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin + '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load device types.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load device types.");
             this.setState({
                 loading: false
             });
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 6bab749642..9d9b354157 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
@@ -36,6 +36,7 @@ import {
 import axios from "axios";
 import {withRouter} from 'react-router-dom'
 import {withConfigContext} from "../../context/ConfigContext";
+import {handleApiError} from "../../js/Utils";
 
 const {Option} = Select;
 const {TextArea} = Input;
@@ -127,16 +128,7 @@ class AddNewReleaseFormComponent extends React.Component {
                     }
 
                 }).catch((error) => {
-                    if (error.hasOwnProperty("response") && error.response.status === 401) {
-                        window.location.href = window.location.origin+ '/publisher/login';
-                    } else {
-                        notification["error"]({
-                            message: "Something went wrong!",
-                            description:
-                                "Sorry, we were unable to complete your request.",
-                        });
-
-                    }
+                    handleApiError(error, "Sorry, we were unable to complete your request.");
                     this.setState({
                         loading: false
                     });
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/Utils.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/Utils.js
index f8e4425e8d..9cbc439bba 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/Utils.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/js/Utils.js
@@ -20,12 +20,11 @@ import {message, notification} from "antd";
 
 export const handleApiError = (error, message) => {
     if (error.hasOwnProperty("response") && error.response.status === 401) {
-        message.error('You are not logged in');
         window.location.href = window.location.origin + '/publisher/login';
     } else {
         notification["error"]({
             message: "There was a problem",
-            duration: 0,
+            duration: 10,
             description: message,
         });
     }
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/Login.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/Login.js
index 82d4c3021e..1973099955 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/Login.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/Login.js
@@ -22,6 +22,7 @@ import './Login.css';
 import axios from 'axios';
 import "./Login.css";
 import {withConfigContext} from "../context/ConfigContext";
+import {handleApiError} from "../js/Utils";
 
 const {Title} = Typography;
 const {Text} = Typography;
@@ -101,18 +102,7 @@ class NormalLoginForm extends React.Component {
                         window.location = window.location.origin+"/publisher";
                     }
                 }).catch(function (error) {
-                    if (error.hasOwnProperty("response") && error.response.status === 400) {
-                        thisForm.setState({
-                            inValid: true
-                        });
-                    } else {
-                        notification["error"]({
-                            message: "There was a problem",
-                            duration: 0,
-                            description:
-                                "Error occurred while trying to login.",
-                        });
-                    }
+                    handleApiError(error, "Error occurred while trying to login.");
                     thisForm.setState({
                         loading: false
                     });
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/add-new-app/components/AddTagModal.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/add-new-app/components/AddTagModal.js
deleted file mode 100644
index 1088ce4d8c..0000000000
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/add-new-app/components/AddTagModal.js
+++ /dev/null
@@ -1,67 +0,0 @@
-/*
- * Copyright (c) 2019, 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 { Upload, Icon, Modal} from 'antd';
-
-
-class AddTagModal extends React.Component {
-    state = {
-        previewVisible: false,
-        previewImage: '',
-        fileList: [],
-    };
-
-    handleCancel = () => this.setState({ previewVisible: false });
-
-    handlePreview = (file) => {
-        this.setState({
-            previewImage: file.url || file.thumbUrl,
-            previewVisible: true,
-        });
-    };
-
-    handleChange = ({ fileList }) => this.setState({ fileList });
-
-    render() {
-        const { previewVisible, previewImage, fileList } = this.state;
-        const uploadButton = (
-            <div>
-                <Icon type="plus" />
-                <div className="ant-upload-text">Upload</div>
-            </div>
-        );
-        return (
-            <div className="clearfix">
-                <Upload
-                    action="//jsonplaceholder.typicode.com/posts/"
-                    listType="picture-card"
-                    fileList={fileList}
-                    onPreview={this.handlePreview}
-                    onChange={this.handleChange}
-                >
-                    {fileList.length >= 3 ? null : uploadButton}
-                </Upload>
-                <Modal visible={previewVisible} footer={null} onCancel={this.handleCancel}>
-                    <img alt="example" style={{ width: '100%' }} src={previewImage} />
-                </Modal>
-            </div>
-        );
-    }
-}
-export default AddTagModal;
\ No newline at end of file
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/Apps.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/Apps.js
index de480c0c5d..248fca92ae 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/Apps.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/Apps.js
@@ -27,8 +27,6 @@ class Apps extends React.Component {
 
     }
 
-
-
     render() {
         return (
             <div>
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/release/Release.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/release/Release.js
index 27439bd6da..06a6d89f6c 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/release/Release.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/apps/release/Release.js
@@ -23,6 +23,7 @@ import axios from 'axios';
 import ReleaseView from "../../../../components/apps/release/ReleaseView";
 import LifeCycle from "../../../../components/apps/release/lifeCycle/LifeCycle";
 import {withConfigContext} from "../../../../context/ConfigContext";
+import {handleApiError} from "../../../../js/Utils";
 
 const {Title} = Typography;
 
@@ -87,18 +88,7 @@ class Release extends React.Component {
             }
 
         }).catch((error) => {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                //todo display a popop with error
-                message.error('You are not logged in');
-                window.location.href = window.location.origin + '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load the release.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load the release.");
             this.setState({loading: false});
         });
 
@@ -118,16 +108,7 @@ class Release extends React.Component {
             }
 
         }).catch(function (error) {
-            if (error.hasOwnProperty("response") && error.response.status === 401) {
-                window.location.href = window.location.origin + '/publisher/login';
-            } else {
-                notification["error"]({
-                    message: "There was a problem",
-                    duration: 0,
-                    description:
-                        "Error occurred while trying to load lifecycle configuration.",
-                });
-            }
+            handleApiError(error, "Error occurred while trying to load lifecycle configuration.");
         });
     };
 
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/logout/Logout.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/logout/Logout.js
index 1c3fbcf50a..26e0e89bb6 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/logout/Logout.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/logout/Logout.js
@@ -52,7 +52,6 @@ class Logout extends React.Component {
                 window.location = window.location.origin + "/publisher/login";
             }
         }).catch(function (error) {
-
             if (error.hasOwnProperty("response") && error.response.status === 400) {
                 thisForm.setState({
                     inValid: true
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/manage/android-enterprise/page/Page.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/manage/android-enterprise/page/Page.js
index 087b58caff..bd4ad771e8 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/manage/android-enterprise/page/Page.js
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/manage/android-enterprise/page/Page.js
@@ -37,6 +37,7 @@ import {withConfigContext} from "../../../../../context/ConfigContext";
 import axios from "axios";
 import Cluster from "../../../../../components/manage/android-enterprise/Pages/Cluster/Cluster";
 import EditLinks from "../../../../../components/manage/android-enterprise/Pages/EditLinks/EditLinks";
+import {handleApiError} from "../../../../../js/Utils";
 
 const {Option} = Select;
 const {Title, Text} = Typography;
@@ -110,18 +111,7 @@ class Page extends React.Component {
 
                 }
             }).catch((error) => {
-                if (error.hasOwnProperty("response") && error.response.status === 401) {
-                    message.error('You are not logged in');
-                    window.location.href = window.location.origin + '/publisher/login';
-                } else {
-                    notification["error"]({
-                        message: "There was a problem",
-                        duration: 0,
-                        description:
-                            "Error occurred while trying to save the page name.",
-                    });
-                }
-
+                handleApiError(error, "Error occurred while trying to save the page name.");
                 this.setState({loading: false});
             });
         }