feat: add popop with awfuls colors and backend api call

front/MyINPulse-front/src/services/api.ts

@@ -1,5 +1,6 @@
 import axios from "axios";
 import {store} from "@/main.ts";
+import {addNewMessage, color} from "@/services/popupDisplayer.ts";
 
 const axiosInstance = axios.create({
     baseURL: import.meta.env.VITE_BACKEND_URL,
@@ -34,11 +35,11 @@ axiosInstance.interceptors.response.use(
 
 // TODO: spawn a error modal
 function defaultApiErrorHandler(err: String){
-    console.log(err)
+    addNewMessage(err, color.Red);
 }
 
 function defaultApiSuccessHandler(response: () => void){
-    console.log(response)
+    addNewMessage(response.data, color.green)
 }
 function callApi(endpoint: string, onSuccessHandler?: any, onErrorHandler?: any): void {
     axiosInstance.get(endpoint).then(

front/MyINPulse-front/src/services/popupDisplayer.ts

@@ -1,17 +1,20 @@
 import {ref} from "vue";
-enum errorType {Error, Warning}
 
-function addNewError(errorMessage: string, timeout?: number, type?: errorType){
+enum color {Red, Yellow, Blue, green}
+
+function addNewMessage(errorMessage: string, type?: color, timeout?: number){
     if (timeout == null){
         timeout = 5000;
     }
     if (type == null){
-        type = Error;
+        type = color.Red;
     }
-    errorList.value.push({errorMessage: errorMessage, timeout: timeout, type: type})
-    setTimeout(() => errorList.value.pop(errorMessage), 5000)
+
+    const data = {errorMessage: errorMessage, timeout: timeout, type: type, uid: Math.random()*100000};
+    errorList.value.push(data)
+    setTimeout(() => errorList.value.slice(0, 1), timeout)
 }
 
 const errorList = ref([])
 
-export {addNewError, errorList}
+export {addNewMessage, errorList, color}