feat: refactored front end

front/MyINPulse-front/src/views/AboutView.vue

@@ -0,0 +1,15 @@
+<template>
+  <div class="about">
+    <h1>This is an about page</h1>
+  </div>
+</template>
+
+<style>
+@media (min-width: 1024px) {
+  .about {
+    min-height: 100vh;
+    display: flex;
+    align-items: center;
+  }
+}
+</style>

front/MyINPulse-front/src/views/Home.vue

@@ -0,0 +1,59 @@
+<script setup lang="ts">
+import {useAuthStore} from "@/stores/authStore";
+
+const store = useAuthStore()
+
+</script>
+
+<template>
+  <h1>Test page</h1>
+  <table class="test"  style="width:100%">
+    <tbody>
+    <tr>
+      <td>Is Currently Authenticated ? </td>
+      <td>{{store.authenticated}}</td>
+      <td><button @click="store.login">Login</button></td>
+      <td><button @click="store.logout">Logout</button></td>
+      <td><button @click="store.signup">Signup</button></td>
+    </tr>
+    <tr>
+      <td>current token</td>
+      <td>{{store.user.token}}</td>
+      <td><button @click="store.refreshUserToken">Refresh</button></td>
+    </tr>
+    <tr>
+      <td>Current refresh token</td>
+      <td>{{store.user.refreshToken}}</td>
+    </tr>
+    <tr>
+      <td>Unauthenticated API call</td>
+      <td><button>call</button></td>
+      <td>res</td>
+      <td></td>
+    </tr>
+    <tr>
+      <td>Authenticated API call</td>
+      <td><button>call</button></td>
+      <td>res</td>
+      <td></td>
+    </tr>
+    </tbody>
+  </table>
+</template>
+
+<style scoped>
+table {
+    width: 100px;
+  table-layout: fixed
+  }
+  tr {
+    width: 100%;
+    height: 100%;
+  }
+  td {
+    border: solid 1px black;
+    width: 20%;
+    height: 100%;
+    overflow: hidden;
+  }
+</style>

front/MyINPulse-front/src/views/errorModal.vue

@@ -0,0 +1,32 @@
+<script lang="ts">
+import {defineComponent} from 'vue'
+
+export default defineComponent({
+  name: "errorModal",
+  props: {
+    error: String
+  },
+  data(){
+    return {
+    }
+  }
+})
+</script>
+
+<template>
+<div class="error">
+  <p>Erreur :(</p>
+  <p>{{error}}</p>
+</div>
+</template>
+
+<style scoped>
+  .error{
+    background-color: darkred;
+    color: white;
+    padding: 1em;
+    border-radius: 0.5em;
+    text-align: center;
+    position: absolute;
+  }
+</style>