Merge branch 'master' into loginProto

frontend/package-lock.json

@@ -8,7 +8,8 @@
       "name": "clyde",
       "version": "0.0.0",
       "dependencies": {
-        "vue": "^3.4.15"
+        "vue": "^3.4.15",
+        "vue3-toastify": "^0.2.1"
       },
       "devDependencies": {
         "@vitejs/plugin-vue": "^5.0.3",
@@ -2396,6 +2397,27 @@
       "integrity": "sha512-0vOfAtI67UjeO1G6UiX5Kd76CqaQ67wrRZiOe7UAb9Jm6GzlUr/fC7CV90XfwapJRjpCMaZFhv1V0ajWRmE9Dg==",
       "dev": true
     },
+    "node_modules/vue3-toastify": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/vue3-toastify/-/vue3-toastify-0.2.1.tgz",
+      "integrity": "sha512-u4i5LCu1q5qs4L4Kbjb4u8NipCS8ox1fCHQ6XFS62676xnA6Q/AJRpZEkAurTMp723LeH6eQX6k9+24bKf1T4Q==",
+      "workspaces": [
+        "docs",
+        "playground"
+      ],
+      "engines": {
+        "node": ">=16",
+        "npm": ">=7"
+      },
+      "peerDependencies": {
+        "vue": ">=3.2.0"
+      },
+      "peerDependenciesMeta": {
+        "vue": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/w3c-xmlserializer": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-5.0.0.tgz",

frontend/package.json

@@ -10,7 +10,8 @@
     "test:unit": "vitest"
   },
   "dependencies": {
-    "vue": "^3.4.15"
+    "vue": "^3.4.15",
+    "vue3-toastify": "^0.2.1"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^5.0.3",

frontend/src/App.vue

@@ -1,5 +1,15 @@
 <script setup>
 	import 'https://kit.fontawesome.com/fb3bbd0a95.js'
+	import { toast } from 'vue3-toastify';
+	import { ref } from 'vue'
+
+	const test = ref();
+
+	async function draw(e) {
+		test.value = (await fetch("http://localhost:8080/ping"));
+		test.value = await test.value.json();
+		toast(test.value['txt']);
+	}
 </script>
 
 <template>
@@ -17,7 +27,7 @@
     <ul class="horizontal" style="box-shadow: 0px 3px 3px rgb(0, 0, 0);">
         <li title="Home">
             <a href="#home">
-                <img  src="./assets/Clyde.png" style="width: 40px; height: auto; margin-top:4px">
+                <img @click="draw" src="./assets/Clyde.png" style="width: 40px; height: auto; margin-top:4px">
             </a>
         </li>
         <li title="Home">

frontend/src/main.js

@@ -1,5 +1,7 @@
 import './assets/main.css'
 
+import 'vue3-toastify/dist/index.css';
+
 import { createApp } from 'vue'
 import App from './App.vue'