Users can now be removed from chats

src/components/ChatSettingsComponent.vue

@@ -16,7 +16,7 @@
                 <ProfileCardComponent :user="user" :selected="false"></ProfileCardComponent>
               </td>
               <td v-if="user.id != userStore.user!.id">
-                <q-btn round flat icon="person_remove" style="color: darkred;" title="Nutzer entfernen"></q-btn>
+                <q-btn round flat icon="person_remove" style="color: darkred;" title="Nutzer entfernen" @click="removeUser(user.id)"></q-btn>
                 <q-btn round flat icon="key" title="Nutzer zum Admin machen"></q-btn>
               </td>
             </tr>
@@ -67,8 +67,10 @@
   import { computed, ref } from 'vue';
   import ProfileCardComponent from './ProfileCardComponent.vue';
 import { useUserStore } from 'src/stores/user-store';
-import { profilePicture } from 'src/models';
+import { profilePicture, responseModel } from 'src/models';
 import { useChatStore } from 'src/stores/chat-store';
+import { useQuasar } from 'quasar';
+import { sendNotification } from 'src/utils';
 
   const showDialog = ref(true);
   const userStore = useUserStore();
@@ -92,6 +94,19 @@ import { useChatStore } from 'src/stores/chat-store';
   const selectProfilePicture = (image: profilePicture) => {
     props.chat!.profilepicture = image.url;
   }
+
+  const $q = useQuasar();
+
+  const removeUser = (keycloakID : string) => {
+    chatStore.removeUserFromChat(keycloakID, props.chat!.id).then((response : responseModel) => {
+      reloadChats();
+      sendNotification(response.message, response.success);
+    });
+  }
+
+  const reloadChats = async() => {
+    await chatStore.loadChatsByUser();
+  };
 </script>
 
 <style scoped>