From cba4eaaeddeff86e426a85cb7d39f17ed3e76a7e Mon Sep 17 00:00:00 2001
From: Menaka Jayawardena <menaka@wso2.com>
Date: Thu, 5 Oct 2017 03:41:00 +0530
Subject: [PATCH] Added chips.

---
 .../Application/Create/CreateSteps/Step1.jsx       | 14 ++++++--------
 1 file changed, 6 insertions(+), 8 deletions(-)

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 dbbcd4018d..8c1a5dce1d 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
@@ -19,8 +19,9 @@
 import PropTypes from 'prop-types';
 import React, {Component} from 'react';
 import {FormattedMessage} from 'react-intl';
-import {Badge, Button, Form, FormFeedback, FormGroup, Input, Label, ModalFooter} from 'reactstrap';
+import {Button, Form, FormFeedback, FormGroup, Input, Label, ModalFooter} from 'reactstrap';
 import * as validator from '../../../../common/validator';
+import Chip from "../../../UIComponents/Chip/Chip";
 
 /**
  * The Second step of application create wizard.
@@ -328,14 +329,11 @@ class Step1 extends Component {
                             <div id="batch-content">
                                 {this.state.tags.map(tag => {
                                         return (
-                                            <Badge
-                                                id="application-tag"
-                                                value={tag.key}
+                                            <Chip
                                                 key={tag.key}
-                                                onClick={() => this.handleRequestDelete(tag.key)}
-                                            >
-                                                {tag.value}
-                                            </Badge>
+                                                content={tag}
+                                                onDelete={this.handleRequestDelete}
+                                            />
                                         )
                                     }
                                 )}