- Outsorced the settings popup into its own component

- Chats with more than 2 users are now displayed correctly
- The user can now select chats as well
- Added header which displays the Name and ProfilePicture
of the selected user (and displayName and groupProfilePicture for group chats)

src/stores/user-store.ts

@@ -40,6 +40,14 @@ export const useUserStore = defineStore('userStore', {
       await this.loadPtpUsersById(id).then((response : responseModel) => {
         this.user = response.response;
         this.userLoaded = true;
+
+        if(this.user!.profilePictureUrl == null) {
+          this.user!.profilePictureUrl = "https://th.bing.com/th/id/R.487fe8708797950ab745a3800c31b7a4?rik=qW3zkDdZfweqmQ&pid=ImgRaw&r=0";
+        }
+
+        if(this.user!.status == null) {
+          this.user!.status = "Hey there, I am using ptpChat!";
+        }
       });
     },
     async loadPtpUsersById(id : string) : Promise<responseModel>  {