diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/App.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/App.jsx
index e7b314daeef..3128bc9d233 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/App.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/App.jsx
@@ -16,22 +16,19 @@
  * under the License.
  */
 
-import Theme from './theme';
 import React, {Component} from 'react';
 import AuthHandler from './api/authHandler';
 import createHistory from 'history/createBrowserHistory';
 import {BrowserRouter as Router, Redirect, Route, Switch} from 'react-router-dom'
-import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
-import getMuiTheme from 'material-ui/styles/getMuiTheme';
 import {
     ApplicationCreate,
+    ApplicationEdit,
     ApplicationListing,
     BaseLayout,
     Login,
     NotFound,
     PlatformCreate,
-    PlatformListing,
-    ApplicationEdit
+    PlatformListing
 } from './components';
 
 
@@ -64,19 +61,13 @@ class Base extends Component {
             if (!AuthHandler.isTokenExpired()) {
                 this.setState({user: user});
             } else {
-                console.log("expired!");
                 this.setState({user: null});
             }
         }
     }
 
-    componentDidMount() {
-
-    }
-
     render() {
         if (this.state.user !== null) {
-            console.log("Have User.");
             return (
                 <div>
                     <BaseLayout user={this.state.user}>
@@ -98,7 +89,6 @@ class Base extends Component {
                 </div>
             )
         } else {
-            console.log("No user");
             return (<Redirect to={"/login"}/>)
         }
 
@@ -119,61 +109,18 @@ class Publisher extends Component {
             selectedType: null,
             selectedTheme: null
         };
-        this.setTheme = this.setTheme.bind(this);
-    }
-
-    componentDidMount() {
-        /**
-         *Loading the theme files based on the the user-preference.
-         */
-        let themeConfig = Theme.loadThemeConfigs();
-        themeConfig.then(this.setTheme).catch(function (error) {
-            console.log(error);
-
-        });
-    }
-
-    /**
-     * To set the theme based on the configuration file.
-     * @param response Configuration file data.
-     */
-    setTheme(response) {
-        this.setState({
-            selectedType: response.data.theme.type,
-            selectedTheme: response.data.theme.value
-        });
-
-        Theme.currentThemeType = this.state.selectedType;
-        Theme.currentTheme = this.state.selectedTheme;
-        Theme.selectedTheme =
-            (Theme.currentThemeType === Theme.defaultThemeType) ? Theme.defaultThemeType : Theme.currentTheme;
-
-        if (this.state.selectedType === "default") {
-            let defaultTheme = require("material-ui/styles/baseThemes/" + this.state.selectedTheme);
-            this.setState({
-                muiTheme: getMuiTheme(defaultTheme.default)
-            });
-        } else {
-            let customTheme = require("./themes/" + this.state.selectedTheme);
-            this.setState({
-                muiTheme: getMuiTheme(customTheme.default)
-            });
-        }
-
     }
 
     render() {
         return (
             <div className="App">
-                <MuiThemeProvider>
-                    <Router basename="publisher" history={history}>
-                        <Switch>
-                            <Route path="/login" component={Login}/>
-                            <Route path="/logout" component={Login}/>
-                            <Route component={Base}/>
-                        </Switch>
-                    </Router>
-                </MuiThemeProvider>
+                <Router basename="publisher" history={history}>
+                    <Switch>
+                        <Route path="/login" component={Login}/>
+                        <Route path="/logout" component={Login}/>
+                        <Route component={Base}/>
+                    </Switch>
+                </Router>
             </div>
         );
     }
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/AppPublisherBase/BaseLayout.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/AppPublisherBase/BaseLayout.jsx
index 665208d16e0..6b845f796c2 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/AppPublisherBase/BaseLayout.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/AppPublisherBase/BaseLayout.jsx
@@ -88,7 +88,7 @@ class BaseLayout extends Component {
                                 id="search"
                                 name="search"
                                 placeholder={'Search for Applications'}
-                                onChange={(event) => console.log(event.target.value)}
+                                onChange={(event) => console.log(event.target.value)} //TODO: Remove this
                             />
                         </div>
                     </div>
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/ApplicationListing.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/ApplicationListing.jsx
index 96d39fbe3f1..89aa4ed87bb 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/ApplicationListing.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/ApplicationListing.jsx
@@ -16,7 +16,6 @@
  * under the License.
  */
 
-import Theme from '../../theme';
 import React, {Component} from 'react';
 import {withRouter} from 'react-router-dom';
 import {Button, Col, Row, Table} from 'reactstrap';
@@ -48,13 +47,13 @@ class ApplicationListing extends Component {
             application: {},
             drawer: {},
             appListStyle: {},
+            //TODO: Remove this declaration.
             image: [{id: "1", src: "https://www.greenfoot.org/images/logos/macos.png"},
                 {
                     id: "2",
                     src: "http://dl1.cbsistatic.com/i/r/2016/08/08/0e67e43a-5a45-41ab-b81d-acfba8708044/resize/736x552/0c0ee669677b5060a0fa1bfb0c7873b4/android-logo-promo-470.png"
                 }]
         };
-        this.scriptId = "application-listing";
     }
 
     headers = [
@@ -126,10 +125,6 @@ class ApplicationListing extends Component {
 
     componentWillMount() {
 
-        /**
-         *Loading the theme files based on the the user-preference.
-         */
-        Theme.insertThemingScripts(this.scriptId);
         // let getApps = ApplicationMgtApi.getApplications();
         // getApps.then(response => {
         //     let apps = this.setData(response.data.applications);
@@ -199,7 +194,6 @@ class ApplicationListing extends Component {
     }
 
     onRowClick() {
-        console.log("sfsdfsdf");
         let style = {
             width: '500px',
             marginLeft: '500px'
@@ -226,8 +220,6 @@ class ApplicationListing extends Component {
             return image.id !== imageId
 
         });
-        console.log(rem);
-
         this.setState({image: rem});
     }
 
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/ApplicationCreate.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/ApplicationCreate.jsx
index 2a2a151538f..340990da5d8 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/ApplicationCreate.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/ApplicationCreate.jsx
@@ -37,13 +37,13 @@ class ApplicationCreate extends Component {
         this.scriptId = "application-create";
         this.setStepData = this.setStepData.bind(this);
         this.removeStepData = this.removeStepData.bind(this);
-        this.handleSubmit = this.handleSubmit.bind(this);
+        this.onSubmit = this.onSubmit.bind(this);
         this.handleCancel = this.handleCancel.bind(this);
         this.handleYes = this.handleYes.bind(this);
         this.handleNo = this.handleNo.bind(this);
-        this.handlePrev = this.handlePrev.bind(this);
-        this.handleNext = this.handleNext.bind(this);
-        this.close = this.close.bind(this);
+        this.onPrevClick = this.onPrevClick.bind(this);
+        this.onNextClick = this.onNextClick.bind(this);
+        this.onClose = this.onClose.bind(this);
         this.state = {
             finished: false,
             stepIndex: 0,
@@ -60,20 +60,16 @@ class ApplicationCreate extends Component {
         this.setState({open: this.props.open});
     }
 
-    close() {
-        this.props.close();
-    }
 
-    handleBack() {
-        let currentStep = this.state.stepIndex;
-        let nextStep = currentStep === 0 ? currentStep : currentStep - 1;
-        this.setState({stepIndex: nextStep}, console.log(this.state.stepIndex));
+    onClose() {
+        this.setState({stepIndex: 0}, this.props.close());
+
     }
 
     /**
      * Handles next button click event.
      * */
-    handleNext() {
+    onNextClick() {
         console.log("Handle Next"); //TODO: Remove this
         const {stepIndex} = this.state;
         this.setState({
@@ -85,7 +81,7 @@ class ApplicationCreate extends Component {
     /**
      * Handles form submit.
      * */
-    handleSubmit() {
+    onSubmit() {
         let stepData = this.state.stepData;
         let applicationCreationPromise = ApplicationMgtApi.createApplication(stepData);
         applicationCreationPromise.then(response => {
@@ -110,7 +106,7 @@ class ApplicationCreate extends Component {
      * Handled [ < Prev ] button click.
      * This clears the data in the current step and returns to the previous step.
      * */
-    handlePrev() {
+    onPrevClick() {
         const {stepIndex} = this.state;
         if (stepIndex > 0) {
             this.removeStepData();
@@ -128,7 +124,7 @@ class ApplicationCreate extends Component {
         let tmpStepData = this.state.stepData;
         tmpStepData.push({step: step, data: data});
 
-        this.setState({stepData: tmpStepData}, this.handleNext())
+        this.setState({stepData: tmpStepData}, this.onNextClick())
     };
 
     /**
@@ -170,7 +166,7 @@ class ApplicationCreate extends Component {
             case 0:
                 return (
                     <Step1
-                        handleNext={this.handleNext}
+                        handleNext={this.onNextClick}
                         setData={this.setStepData}
                         removeData={this.removeStepData}
                     />
@@ -178,8 +174,8 @@ class ApplicationCreate extends Component {
             case 1:
                 return (
                     <Step2
-                        handleNext={this.handleNext}
-                        handlePrev={this.handlePrev}
+                        handleNext={this.onNextClick}
+                        handlePrev={this.onPrevClick}
                         setData={this.setStepData}
                         removeData={this.removeStepData}
                     />
@@ -187,8 +183,8 @@ class ApplicationCreate extends Component {
             case 2:
                 return (
                     <Step3
-                        handleFinish={this.handleNext}
-                        handlePrev={this.handlePrev}
+                        handleFinish={this.onNextClick}
+                        handlePrev={this.onPrevClick}
                         setData={this.setStepData}
                         removeData={this.removeStepData}
                     />
@@ -196,7 +192,7 @@ class ApplicationCreate extends Component {
             case 3: {
                 return (
                     <Step4
-                        handleNext={this.handleNext}
+                        handleNext={this.onNextClick}
                         setData={this.setStepData}
                         removeData={this.removeStepData}
                     />
@@ -225,17 +221,17 @@ class ApplicationCreate extends Component {
                         </Row>
                         <Row>
                             <Col>
-                                {this.getStepContent(this.state.stepIndex)}
+                                {this.getStepContent(stepIndex)}
                             </Col>
                         </Row>
                     </ModalBody>
                     <ModalFooter>
-                        {this.state.stepIndex === 0 ? <div/> :
-                            <Button color="primary" onClick={this.handlePrev}>Back</Button>}
-                        <Button color="secondary" onClick={this.close}>Cancel</Button>
-                        {this.state.finished ?
-                            <Button color="primary" onClick={this.handleSubmit}>Finish</Button> :
-                            <Button color="primary" onClick={this.handleNext}>Continue</Button>}
+                        {stepIndex === 0 ? <div/> :
+                            <Button color="primary" onClick={this.onPrevClick}>Back</Button>}
+                        <Button color="secondary" onClick={this.onClose}>Cancel</Button>
+                        {finished ?
+                            <Button color="primary" onClick={this.onSubmit}>Finish</Button> :
+                            <Button color="primary" onClick={this.onNextClick}>Continue</Button>}
                     </ModalFooter>
                 </Modal>
             </div>);
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step1.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step1.jsx
index 7f8ef66e10b..ba5744d2fa2 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step1.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step1.jsx
@@ -33,8 +33,8 @@ import {Badge, FormGroup, Input, Label} from 'reactstrap';
  *
  * Parent Component: Create
  * Props:
- *      * handleNext : {type: function, Invokes handleNext function in Parent.}
- *      * handlePrev : {type: function, Invokes handlePrev function in Parent}
+ *      * onNextClick : {type: function, Invokes onNextClick function in Parent.}
+ *      * onPrevClick : {type: function, Invokes onPrevClick function in Parent}
  *      * setData : {type: function, Invokes setStepData function in Parent}
  *      * removeData : {type: Invokes removeStepData function in Parent}
  * */
@@ -55,7 +55,6 @@ class Step1 extends Component {
             identifier: "",
             shortDescription: ""
         };
-        this.scriptId = "application-create-step2";
     }
 
     /**
@@ -81,27 +80,6 @@ class Step1 extends Component {
         this.setState({defValue: defaultValue})
     }
 
-    /**
-     * Invokes the handleNext function in Create component.
-     * */
-    handleNext() {
-        let fields = [{name: "Title", value: this.state.title},
-            {name: "Short Description", value: this.state.shortDescription},
-            {name: "Description", value: this.state.description},
-            {name: "Banner", value: this.state.banner},
-            {name: "Screenshots", value: this.state.screenshots},
-            {name: "Identifier", value: this.state.identifier},
-            {name: "Icon", value: this.state.icon}];
-        this.validate(fields);
-    }
-
-    /**
-     * Invokes the handlePrev function in Create component.
-     * */
-    handlePrev() {
-        this.props.handlePrev();
-    }
-
     /**
      * Handles Chip delete function.
      * Removes the tag from state.tags
@@ -114,94 +92,12 @@ class Step1 extends Component {
         this.setState({tags: this.chipData});
     };
 
-    /**
-     * Validate the form.
-     * */
-    validate(fields) {
-        let errors = {};
-        let errorsPresent = false;
-        fields.forEach(function (field) {
-            switch (field.name) {
-                case 'Title': {
-                    if (field.value === "") {
-                        errors[field.name] = field.name + " is required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-                case 'Identifier': {
-                    if (field.value === "") {
-                        errors[field.name] = field.name + " is required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-                case 'Short Description': {
-                    if (field.value === "") {
-                        errors[field.name] = field.name + " is required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-                case 'Description': {
-                    if (field.value === "") {
-                        errors[field.name] = field.name + " is required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-                case 'Banner': {
-                    if (field.value.length === 0) {
-                        errors[field.name] = field.name + " is required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-                case 'Icon': {
-                    if (field.value.length === 0) {
-                        errors[field.name] = field.name + " is required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-                case 'Screenshots': {
-                    if (field.value.length < 3) {
-                        errors[field.name] = "3 " + field.name + " are required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-            }
-        });
-
-        if (!errorsPresent) {
-            this.setStepData();
-        } else {
-            this.setState({errors: errors}, console.log(errors));
-        }
-    }
-
     /**
      * Creates an object with the current step data and persist in the parent.
      * */
     setStepData() {
         let stepData = {};
-
-        this.props.setData("step2", {step: stepData});
+        this.props.setData("step1", {step: stepData});
     };
 
     /**
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step2.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step2.jsx
index 31e26693fad..57bbcf6d2da 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step2.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step2.jsx
@@ -31,7 +31,7 @@ import {FormGroup, Input, Label} from 'reactstrap';
  *
  * Parent Component: Create
  * Props:
- *      1. handleNext: {type: function, Invokes handleNext function of parent component}
+ *      1. onNextClick: {type: function, Invokes onNextClick function of parent component}
  *      2. setData : {type: function, Sets current form data to the state of the parent component}
  *      3. removeData: {type: function, Invokes the removeStepData function click of parent}
  * */
@@ -40,7 +40,6 @@ class Step2 extends Component {
         super();
         this.setPlatforms = this.setPlatforms.bind(this);
         this.setStepData = this.setStepData.bind(this);
-        this.cancel = this.cancel.bind(this);
         this.platforms = [];
         this.state = {
             finished: false,
@@ -53,7 +52,6 @@ class Step2 extends Component {
             title: "",
             titleError: ""
         };
-        this.scriptId = "application-create-step1";
     }
 
     componentDidMount() {
@@ -84,17 +82,11 @@ class Step2 extends Component {
      * Persist the current form data to the state.
      * */
     setStepData() {
-        console.log("Platforms", this.state.platforms);
         let step = {
             store: this.state.store,
             platform: this.state.platforms[this.state.platformSelectedIndex]
         };
-        console.log(step);
-        this.props.setData("step1", {step: step});
-    }
-
-    cancel() {
-
+        this.props.setData("step2", {step: step});
     }
 
     /**
@@ -106,8 +98,6 @@ class Step2 extends Component {
         let selectedPlatform = this.state.platforms.filter((platform) => {
             return platform.identifier === id;
         });
-        console.log(selectedPlatform);
-
         this.setState({platform: selectedPlatform});
     };
 
@@ -115,7 +105,6 @@ class Step2 extends Component {
      * Triggers when changing the Store selection.
      * */
     onChangeStore(event) {
-        console.log(event.target.value);
         this.setState({store: event.target.value});
     };
 
@@ -128,7 +117,6 @@ class Step2 extends Component {
                     <Input
                         type="select"
                         name="store"
-                        id="store"
                         className="input-custom"
                         onChange={this.onChangeStore.bind(this)}
                     >
@@ -141,7 +129,6 @@ class Step2 extends Component {
                     <Input
                         type="select"
                         name="store"
-                        id="store"
                         onChange={this.onChangePlatform.bind(this)}
                     >
                         {this.state.platforms.length > 0 ? this.state.platforms.map(platform => {
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step3.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step3.jsx
index 4fab3bbd783..c214847cb03 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step3.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step3.jsx
@@ -34,8 +34,8 @@ import AppImage from "../../../UIComponents/AppImage/AppImage";
  *
  * Parent Component: Create
  * Props:
- *      * handleNext : {type: function, Invokes handleNext function in Parent.}
- *      * handlePrev : {type: function, Invokes handlePrev function in Parent}
+ *      * onNextClick : {type: function, Invokes onNextClick function in Parent.}
+ *      * onPrevClick : {type: function, Invokes onPrevClick function in Parent}
  *      * setData : {type: function, Invokes setStepData function in Parent}
  *      * removeData : {type: Invokes removeStepData function in Parent}
  * */
@@ -56,52 +56,6 @@ class Step3 extends Component {
             identifier: "",
             shortDescription: ""
         };
-        this.scriptId = "application-create-step2";
-    }
-
-
-    /**
-     * Create a tag on Enter key press and set it to the state.
-     * Clears the tags text field.
-     * Chip gets two parameters: Key and value.
-     * */
-    addTags(event) {
-        let tags = this.state.tags;
-        if (event.charCode === 13) {
-            event.preventDefault();
-            tags.push({key: Math.floor(Math.random() * 1000), value: event.target.value});
-            this.setState({tags, defValue: ""}, console.log(tags));
-        }
-    }
-
-    /**
-     * Set the value for tag.
-     * */
-    handleTagChange(event) {
-        let defaultValue = this.state.defValue;
-        defaultValue = event.target.value;
-        this.setState({defValue: defaultValue})
-    }
-
-    /**
-     * Invokes the handleNext function in Create component.
-     * */
-    handleNext() {
-        let fields = [{name: "Title", value: this.state.title},
-            {name: "Short Description", value: this.state.shortDescription},
-            {name: "Description", value: this.state.description},
-            {name: "Banner", value: this.state.banner},
-            {name: "Screenshots", value: this.state.screenshots},
-            {name: "Identifier", value: this.state.identifier},
-            {name: "Icon", value: this.state.icon}];
-        this.validate(fields);
-    }
-
-    /**
-     * Invokes the handlePrev function in Create component.
-     * */
-    handlePrev() {
-        this.props.handlePrev();
     }
 
     /**
@@ -110,170 +64,30 @@ class Step3 extends Component {
      * */
     handleRequestDelete(event) {
         this.chipData = this.state.tags;
-        console.log(event.target);
+        console.log(event.target); //TODO: Remove Console log.
         const chipToDelete = this.chipData.map((chip) => chip.value).indexOf(event.target.value);
         this.chipData.splice(chipToDelete, 1);
         this.setState({tags: this.chipData});
     };
 
-    /**
-     * Creates Chip array from state.tags.
-     * */
-    renderChip(data) {
-        return (
-            <Chip
-                key={data.key}
-                onRequestDelete={() => this.handleRequestDelete(data.key)}
-                className="applicationCreateChip">
-                {data.value}
-            </Chip>
-        );
-    }
-
-    onVisibilitySelect(event, index, value) {
-        console.log(value);
-        let comp = <SelectField> <MenuItem value={0} primaryText="Public"/>
-            <MenuItem value={1} primaryText="Roles"/>
-            <MenuItem value={2} primaryText="Devices"/> </SelectField>;
-        if (value === 1) {
-            this.setState({visibilityComponent: comp});
-        } else if (value === 2) {
-
-        } else {
-
-        }
-    };
-
-    /**
-     * Validate the form.
-     * */
-    validate(fields) {
-        let errors = {};
-        let errorsPresent = false;
-        fields.forEach(function (field) {
-            switch (field.name) {
-                case 'Title': {
-                    if (field.value === "") {
-                        errors[field.name] = field.name + " is required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-                case 'Identifier': {
-                    if (field.value === "") {
-                        errors[field.name] = field.name + " is required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-                case 'Short Description': {
-                    if (field.value === "") {
-                        errors[field.name] = field.name + " is required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-                case 'Description': {
-                    if (field.value === "") {
-                        errors[field.name] = field.name + " is required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-                case 'Banner': {
-                    if (field.value.length === 0) {
-                        errors[field.name] = field.name + " is required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-                case 'Icon': {
-                    if (field.value.length === 0) {
-                        errors[field.name] = field.name + " is required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-                case 'Screenshots': {
-                    if (field.value.length < 3) {
-                        errors[field.name] = "3 " + field.name + " are required!";
-                        errorsPresent = true;
-                    } else {
-                        errorsPresent = false;
-                    }
-                    break;
-                }
-            }
-        });
-
-        if (!errorsPresent) {
-            this.setStepData();
-        } else {
-            this.setState({errors: errors}, console.log(errors));
-        }
-    }
-
     /**
      * Creates an object with the current step data and persist in the parent.
      * */
     setStepData() {
         let stepData = {
             icon: this.state.icon,
-            name: this.state.name,
-            tags: this.state.tags,
             banner: this.state.banner,
-            category: this.categories[this.state.category],
-            identifier: this.state.identifier,
-            screenshots: this.state.screenshots,
-            description: this.state.description,
-            shortDescription: this.state.shortDescription
+            screenshots: this.state.screenshots
         };
 
         this.props.setData("step2", {step: stepData});
     };
 
-    /**
-     * Set text field values to state.
-     * */
-    onTextFieldChange(event, value) {
-        let field = event.target.id;
-        switch (field) {
-            case "name": {
-                this.setState({name: value});
-                break;
-            }
-            case "shortDescription": {
-                this.setState({shortDescription: value});
-                break;
-            }
-            case "description": {
-                this.setState({description: value});
-                break;
-            }
-            case "identifier": {
-                this.setState({identifier: value});
-                break;
-            }
-        }
-    };
-
     /**
      * Removed user uploaded banner.
      * */
     removeBanner(event, d) {
-        console.log(event, d);
+        console.log(event, d); //TODO: Remove this
         this.setState({banner: []});
     };
 
@@ -288,11 +102,11 @@ class Step3 extends Component {
      * Removes selected screenshot.
      * */
     removeScreenshot(event) {
-        console.log(event.target)
+        console.log(event.target) //TODO: Remove this.
     };
 
+    //TODO: Remove inline css.
     render() {
-        console.log(this.state.visibilityComponent);
         return (
             <div className="createStep2Content">
                 <div>
@@ -312,7 +126,7 @@ class Step3 extends Component {
                                     onDrop={(screenshots, rejected) => {
                                         let tmpScreenshots = this.state.screenshots;
                                         tmpScreenshots.push(screenshots);
-                                        console.log(screenshots);
+                                        console.log(screenshots); //TODO: Remove this
                                         this.setState({
                                             screenshots: tmpScreenshots
                                         });
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step4.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step4.jsx
index 05982af2d68..5674e822fa9 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step4.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step4.jsx
@@ -38,8 +38,8 @@ import Switch from '../../../UIComponents/Switch/Switch'
  *
  * Parent Component: Create
  * Props:
- *      * handleFinish : {type: function, Invokes handleNext function in Parent.}
- *      * handlePrev : {type: function, Invokes handlePrev function in Parent}
+ *      * handleFinish : {type: function, Invokes onNextClick function in Parent.}
+ *      * onPrevClick : {type: function, Invokes onPrevClick function in Parent}
  *      * setData : {type: function, Invokes setStepData function in Parent}
  *      * removeData : {type: Invokes removeStepData function in Parent}
  * */
@@ -60,7 +60,7 @@ class Step4 extends Component {
 
     /**
      * Handles finish button click.
-     * This invokes handleNext function in parent component.
+     * This invokes onNextClick function in parent component.
      * */
     handleFinish() {
         this.props.handleFinish();
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/Base/ApplicationEditBaseLayout.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/Base/ApplicationEditBaseLayout.jsx
index 0e099e61265..1febf7c28e8 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/Base/ApplicationEditBaseLayout.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/Base/ApplicationEditBaseLayout.jsx
@@ -36,12 +36,10 @@ class ApplicationEdit extends Component {
 
     handleTabClick(event) {
         event.stopPropagation();
-        console.log(typeof event.target.value);
         const key = event.target.value;
 
         switch (key) {
             case "1": {
-                console.log("Step1");
                 this.setState({activeTab: 1, general: "active", release: "", pkgmgt: ""});
                 break;
             }
@@ -78,12 +76,13 @@ class ApplicationEdit extends Component {
     }
 
     render() {
-        console.log(this.state);
         return (
             <div id="application-edit-base">
                 <Row id="application-edit-header">
                     <Col xs="3">
-                        <a className="back-to-app" onClick={this.handleOnBackClick.bind(this)}><i className="fw fw-left-arrow"></i></a>
+                        <a className="back-to-app" onClick={this.handleOnBackClick.bind(this)}>
+                            <i className="fw fw-left-arrow"></i>
+                        </a>
                     </Col>
                     <Col>
                         Application Name
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/GenenralInfo/GeneralInfo.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/GenenralInfo/GeneralInfo.jsx
index bef2e708b5d..71372c0cec9 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/GenenralInfo/GeneralInfo.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/GenenralInfo/GeneralInfo.jsx
@@ -33,6 +33,7 @@ class GeneralInfo extends Component {
         }
     }
 
+    //TODO: Remove Console logs.
     render() {
         return (
             <div className="app-edit-general-info">
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Release/Create/CreateRelease.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Release/Create/CreateRelease.jsx
index 295b2818d91..85c78a10002 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Release/Create/CreateRelease.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Release/Create/CreateRelease.jsx
@@ -26,8 +26,8 @@ class CreateRelease extends Component {
         super();
         this.onTestMethodChange = this.onTestMethodChange.bind(this);
         this.showUploadArtifacts = this.showUploadArtifacts.bind(this);
-        this.handleBack = this.handleBack.bind(this);
-        this.backToRelease = this.backToRelease.bind(this);
+        this.onBackClick = this.onBackClick.bind(this);
+        this.onBackToRelease = this.onBackToRelease.bind(this);
         this.state = {
             open: true,
             hiddenMain: false
@@ -47,11 +47,11 @@ class CreateRelease extends Component {
         this.setState({hiddenMain: true})
     }
 
-    handleBack() {
+    onBackClick() {
         this.props.handleBack();
     }
 
-    backToRelease() {
+    onBackToRelease() {
         this.setState({hiddenMain: false});
     }
 
@@ -64,7 +64,7 @@ class CreateRelease extends Component {
                 {this.state.hiddenMain ?
                     <div>
                         <UploadPackage
-                            backToRelease={this.backToRelease}
+                            backToRelease={this.onBackToRelease}
                             selectedChannel={channel}
                         />
                     </div> :
@@ -72,7 +72,7 @@ class CreateRelease extends Component {
                     <div>
                         <Row>
                             <div className="release-header">
-                                <a onClick={this.handleBack}>{"<-"}</a>
+                                <a onClick={this.onBackClick}>{"<-"}</a>
                                 <span id="create-release-header">
                             <strong>{channel} Release</strong>
                         </span>
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Release/Create/UploadPackage.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Release/Create/UploadPackage.jsx
index b3d97d26a35..6c51efdb8ab 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Release/Create/UploadPackage.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Release/Create/UploadPackage.jsx
@@ -28,7 +28,7 @@ class UploadPackage extends Component {
     }
 
     handleBack() {
-        this.props.backToRelease();
+        this.props.onBackToRelease();
     }
 
     render() {
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Release/ReleaseMgtBase/ReleaseManager.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Release/ReleaseMgtBase/ReleaseManager.jsx
index 9136ad5e38b..e12dfab4c12 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Release/ReleaseMgtBase/ReleaseManager.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Release/ReleaseMgtBase/ReleaseManager.jsx
@@ -26,20 +26,20 @@ class ReleaseManager extends Component {
     constructor() {
         super();
         this.getNoReleaseContent = this.getNoReleaseContent.bind(this);
-        this.createRelease = this.createRelease.bind(this);
-        this.handleBackPress = this.handleBackPress.bind(this);
+        this.onCreateRelease = this.onCreateRelease.bind(this);
+        this.onBackClick = this.onBackClick.bind(this);
         this.state = {
             createRelease: false,
             onGoing: ""
         }
     }
 
-    createRelease(event) {
+    onCreateRelease(event) {
         event.preventDefault();
         this.setState({createRelease: true, onGoing: event.target.value})
     }
 
-    handleBackPress() {
+    onBackClick() {
         this.setState({createRelease: false});
     }
 
@@ -60,7 +60,7 @@ class ReleaseManager extends Component {
                             className="button-add"
                             id={release.toLowerCase()}
                             value={release}
-                            onClick={this.createRelease}
+                            onClick={this.onCreateRelease}
                         >
                             Create a Release
                         </Button>
@@ -76,7 +76,7 @@ class ReleaseManager extends Component {
                 {this.state.createRelease ?
                     <CreateRelease
                         channel={this.state.onGoing}
-                        handleBack={this.handleBackPress}
+                        handleBack={this.onBackClick}
                     /> :
                     <div id="release-mgt-content">
                         <Row>
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Platform/PlatformCreate.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Platform/PlatformCreate.jsx
index e1fd2f8f3a9..6d30a2007a4 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Platform/PlatformCreate.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Platform/PlatformCreate.jsx
@@ -16,7 +16,6 @@
  * under the License.
  */
 
-import Theme from '../../theme';
 import PropTypes from 'prop-types';
 import Chip from 'material-ui/Chip';
 import Dropzone from 'react-dropzone';
@@ -79,18 +78,6 @@ class PlatformCreate extends Component {
                 {key: 2, value: 'Boolean'},
                 {key: 3, value: 'File'}]
         };
-        this.scriptId = "platform-create";
-    }
-
-    componentWillMount() {
-        /**
-         *Loading the theme files based on the the user-preference.
-         */
-        Theme.insertThemingScripts(this.scriptId);
-    }
-
-    componentWillUnmount() {
-        Theme.removeThemingScripts(this.scriptId);
     }
 
     /**
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Platform/PlatformListing.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Platform/PlatformListing.jsx
index 34bf03bec7f..3ba0b50fd98 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Platform/PlatformListing.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Platform/PlatformListing.jsx
@@ -16,7 +16,6 @@
  * under the License.
  */
 
-import Theme from '../../theme';
 import React, {Component} from 'react';
 import {withRouter} from 'react-router-dom';
 import TextField from 'material-ui/TextField';
@@ -41,7 +40,6 @@ class PlatformListing extends Component {
             platforms: [],
             asc: true
         };
-        this.scriptId = "platform-listing";
     }
 
     headers = [
@@ -72,17 +70,6 @@ class PlatformListing extends Component {
         }
     ];
 
-    componentWillMount() {
-        /**
-         *Loading the theme files based on the the user-preference.
-         */
-        Theme.insertThemingScripts(this.scriptId);
-    }
-
-    componentWillUnmount() {
-        Theme.removeThemingScripts(this.scriptId);
-    }
-
     componentDidMount() {
         let platformsPromise = PlatformMgtApi.getPlatforms();
         platformsPromise.then(
diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/User/Login/Login.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/User/Login/Login.jsx
index c2db0243412..7108253c00e 100644
--- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/User/Login/Login.jsx
+++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/User/Login/Login.jsx
@@ -16,10 +16,11 @@
  * under the License.
  */
 
+import qs from 'qs';
 import React, {Component} from 'react';
 import {Redirect, Switch} from 'react-router-dom';
 import AuthHandler from '../../../api/authHandler';
-import {Button, Card, CardBlock, CardSubtitle, CardTitle, Col, Form, FormGroup, Input, Label} from 'reactstrap';
+import {Button, Card, CardBlock, CardTitle, Col, Form, FormGroup, Input, Label} from 'reactstrap';
 
 /**
  * The Login Component.
@@ -42,20 +43,15 @@ class Login extends Component {
         }
     }
 
-    componentWillMount() {
-        console.log("IN Login")
-    }
-
     componentDidMount() {
-        console.log("in Login")
-        // let queryString = this.props.location.search;
-        // console.log(queryString);
-        // queryString = queryString.replace(/^\?/, '');
-        // /* With QS version up we can directly use {ignoreQueryPrefix: true} option */
-        // let params = qs.parse(queryString);
-        // if (params.referrer) {
-        //     this.setState({referrer: params.referrer});
-        // }
+        let queryString = this.props.location.search;
+        console.log(queryString);
+        queryString = queryString.replace(/^\?/, '');
+        /* With QS version up we can directly use {ignoreQueryPrefix: true} option */
+        let params = qs.parse(queryString);
+        if (params.referrer) {
+            this.setState({referrer: params.referrer});
+        }
     }
 
     handleLogin(event) {
@@ -135,29 +131,31 @@ class Login extends Component {
                 <div id="login-container">
                     {/*TODO: Style the components.*/}
                     <Card id="login-card">
-                    <CardBlock>
-                        <CardTitle>WSO2 IoT APP Publisher</CardTitle>
-                        <Form onSubmit={this.handleLogin.bind(this)}>
-                            <FormGroup row>
-                                <Label for="userName" sm={2}>User Name:</Label>
-                                <Col sm={10}>
-                                    <Input type="text" name="userName" id="userName" placeholder="User Name" onChange={this.onUserNameChange.bind(this)}/>
-                                </Col>
+                        <CardBlock>
+                            <CardTitle>WSO2 IoT APP Publisher</CardTitle>
+                            <Form onSubmit={this.handleLogin.bind(this)}>
+                                <FormGroup row>
+                                    <Label for="userName" sm={2}>User Name:</Label>
+                                    <Col sm={10}>
+                                        <Input type="text" name="userName" id="userName" placeholder="User Name"
+                                               onChange={this.onUserNameChange.bind(this)}/>
+                                    </Col>
 
-                            </FormGroup>
-                            <FormGroup row>
-                                <Label for="password" sm={2}>Password:</Label>
-                                <Col sm={10}>
-                                    <Input type="password" name="text" id="password" placeholder="Password" onChange={this.onPasswordChange.bind(this)}/>
-                                </Col>
-                            </FormGroup>
-                            <FormGroup check row>
-                                <Col sm={{ size: 10, offset: 2 }}>
-                                    <Button type="submit" id="login-btn">Submit</Button>
-                                </Col>
-                            </FormGroup>
-                        </Form>
-                    </CardBlock>
+                                </FormGroup>
+                                <FormGroup row>
+                                    <Label for="password" sm={2}>Password:</Label>
+                                    <Col sm={10}>
+                                        <Input type="password" name="text" id="password" placeholder="Password"
+                                               onChange={this.onPasswordChange.bind(this)}/>
+                                    </Col>
+                                </FormGroup>
+                                <FormGroup check row>
+                                    <Col sm={{size: 10, offset: 2}}>
+                                        <Button type="submit" id="login-btn">Login</Button>
+                                    </Col>
+                                </FormGroup>
+                            </Form>
+                        </CardBlock>
                     </Card>
                 </div>);
         } else {