show list of users in rooms

front/src/components/User.vue

@@ -0,0 +1,27 @@
+<script setup lang="ts">
+import { defineProps, PropType } from "vue";
+import { Address } from "@/store/models/model";
+import Badge from "./Badge.vue";
+
+const props = defineProps({ address: Object as PropType<Address> });
+const value = props.address?.name ? props.address?.name : props.address?.email;
+</script>
+
+<template>
+    <div class="main">
+        {{ value }}
+    </div>
+</template>
+
+<style scoped>
+.main {
+    align-items: center;
+    background-color: var(--quaternary-background);
+    border-radius: 1.6rem;
+    color: var(--primary-text);
+    display: inline-flex;
+    max-width: 100%;
+    overflow: hidden;
+    padding: 0.1rem 0.4em;
+}
+</style>