Worked on several new features:

- ProfilePictures for users are now pulled from the backend
- added a component for chat settings (WIP)
- added a loading screen when the backend is not available
- reworked the "add chat" feature
- started to implement the general send-message functionality

src/stores/chat-store.ts

@@ -8,6 +8,8 @@ export const useChatStore = defineStore('chatStore',{
     chats: [] as chat[],
     chatsLoaded: false,
     chatExistsReponse: false,
+    profilePictures : [] as string[],
+    profilePicturesLoaded: false
   }),
   actions: {
     async getChatsByUser(): Promise<chat[]> {
@@ -21,6 +23,10 @@ export const useChatStore = defineStore('chatStore',{
       this.chatsLoaded = true;
       return this.chats;
     },
+    async loadProfilePictures(){
+      this.profilePictures = (await api.get("/users/profilePictures")).data;
+      this.profilePicturesLoaded = true;
+    },
     async createChat(chatName: string, members: string[]){
       const userStore = useUserStore();
       if(userStore.id) {
@@ -34,13 +40,6 @@ export const useChatStore = defineStore('chatStore',{
       }
       console.log(members);
       return (await api.post("/chats/create/" + chatName, members)).data;
-    },
-    async loadDoesChatExist(keycloakID : string, otherKeycloakID : string) : Promise<responseModel> {
-      return (await api.get("/chats/"+keycloakID+"/"+otherKeycloakID)).data;
-    },
-    doesChatExist(keycloakID : string, otherKeycloakID : string)   {
-      this.loadDoesChatExist(keycloakID, otherKeycloakID)
-        .then(m => this.chatExistsReponse = m.success);
     }
   }
 });

src/stores/message-store.ts

@@ -0,0 +1,28 @@
+import { defineStore } from 'pinia';
+import { api } from 'src/boot/axios';
+import { message, ptpUser, responseModel } from 'src/models';
+import Keycloak, { KeycloakInitOptions, KeycloakLoginOptions } from 'keycloak-js';
+
+
+export const useMessageStore = defineStore('messageStore', {
+  state: () => ({
+    messages: [[]] as [message[]],
+  }),
+  actions: {
+    async sendMessage(chatId : number, senderId : string, content : string)  {
+      await api.post("/messages/"+chatId+"/"+senderId+"/"+content).then((result) => {
+        this.loadMessagesByChatID(chatId);
+      });
+    },
+
+    loadMessagesByChatID(chatID : number) {
+      this.getAllMessagesByChatID(chatID).then((messages) => {
+        this.messages[chatID] = messages;
+      });
+    },
+
+    async getAllMessagesByChatID(chatID : number) {
+      return (await api.get("/messages/chat/"+chatID)).data;
+    },
+  },
+});

src/stores/user-store.ts

@@ -1,6 +1,6 @@
 import { defineStore } from 'pinia';
 import { api } from 'src/boot/axios';
-import { ptpUser, responseModel } from 'src/models';
+import { profilePicture, ptpUser, responseModel } from 'src/models';
 import Keycloak, { KeycloakInitOptions, KeycloakLoginOptions } from 'keycloak-js';
 
 /**
@@ -34,6 +34,9 @@ export const useUserStore = defineStore('userStore', {
     usersLoaded: false,
     keycloak: null as Keycloak | null,
     id: "",
+    reconnectTries: 0,
+    profilePictures: [] as profilePicture[],
+    profilePicturesLoaded: false
   }),
   actions: {
     async getPtpUserById(id : string) {
@@ -48,11 +51,20 @@ export const useUserStore = defineStore('userStore', {
         if(this.user!.status == null) {
           this.user!.status = "Hey there, I am using ptpChat!";
         }
+      }).catch(error => {
+        console.error("Ein Netzwerkfehler ist aufgetreten");
       });
     },
     async loadPtpUsersById(id : string) : Promise<responseModel>  {
       return (await api.get("/users/login/"+id)).data;
     },
+    async loadProfilePictures() {
+      (await api.get("/users/profilePictures")).data.forEach((element: string) => {
+        this.profilePictures.push({ shortName: element.split(" ")[0].replace(":", ""), url: element.split(" ")[1]});
+        console.log("Hallo ich mache hier was");
+      });
+      this.profilePicturesLoaded = true;
+    },
 
     getAllPtpUsers() {
       this.loadAllPtpUsers().then((response : ptpUser[]) => {
@@ -67,9 +79,9 @@ export const useUserStore = defineStore('userStore', {
             user.status = "Hey there, I am using ptpChat!";
           }
         })
-
-        this.usersLoaded = true;
       })
+
+      this.usersLoaded = true;
     },
 
     async loadAllPtpUsers() {