add entity 'user' to pills badge-entity

src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss

@@ -1,5 +1,5 @@
 /*
-*  BADGES PERSON AND THIRDPARTY
+*  BADGES USER, PERSON AND THIRDPARTY
 */
 
 span.badge-user,
@@ -167,7 +167,7 @@ div[class*='activity-'] {
 }
 
 /*
-* Specific badge rounded-pill
+* Pill badge by entity
 */
 .badge {
     &.bg-person {
@@ -175,5 +175,10 @@ div[class*='activity-'] {
         background-color: $chill-ll-gray;
         color: $chill-green;
     }
+    &.bg-user {
+        //@extend .$chill-ll-gray;
+        background-color: $chill-ll-gray;
+        color: $chill-blue;
+    }
 }
 

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons/TypeUser.vue

@@ -7,26 +7,22 @@
       </div>
     </div>
     <div class="right_actions">
-      <span class="badge rounded-pill bg-secondary">
-        {{ $t('user')}}
-      </span>
+       <badge-entity
+          :entity="item.result"
+          :options="{ displayLong: true }">
+       </badge-entity>
     </div>
 </template>
 
 <script>
-
-const i18n = {
-  messages: {
-    fr: {
-      user: 'Utilisateur' // TODO how to define other translations?
-    }
-  }
-};
+import BadgeEntity from 'ChillMainAssets/vuejs/_components/BadgeEntity.vue';
 
 export default {
    name: 'SuggestionUser',
+   components: {
+      BadgeEntity
+   },
    props: ['item'],
-   i18n,
    computed: {
      hasParent() {
        return this.$props.item.result.parent !== null;