Messages are now properly displayed and formatted

src/components/ChatSettingsComponent.vue

@@ -11,7 +11,7 @@
         <q-card-section>
           <div class="text-h5">Mitglieder</div>
           <table>
-            <tr v-for="user in props.chat!.members">
+            <tr v-for="user in members">
               <td>
                 <ProfileCardComponent :user="user" :selected="false"></ProfileCardComponent>
               </td>
@@ -67,7 +67,7 @@
   import { computed, ref } from 'vue';
   import ProfileCardComponent from './ProfileCardComponent.vue';
 import { useUserStore } from 'src/stores/user-store';
-import { profilePicture, responseModel } from 'src/models';
+import { profilePicture, ptpUser, responseModel } from 'src/models';
 import { useChatStore } from 'src/stores/chat-store';
 import { useQuasar } from 'quasar';
 import { sendNotification } from 'src/utils';
@@ -96,11 +96,23 @@ import { sendNotification } from 'src/utils';
   }
 
   const $q = useQuasar();
+  const members = ref([] as ptpUser[]);
+
+  members.value = props.chat!.members;
 
   const removeUser = (keycloakID : string) => {
     chatStore.removeUserFromChat(keycloakID, props.chat!.id).then((response : responseModel) => {
       reloadChats();
       sendNotification(response.message, response.success);
+      if(response.success) {
+        members.value = members.value.filter((user) => user.id != keycloakID);
+      }
+
+      if(members.value.length == 1) {
+        sendNotification("Es ist ein kritischer Fehler aufgetreten", false);
+      } else if(members.value.length == 2) {
+        closeDialog();
+      }
     });
   }