Added /user endpoint and made changes to navbar to fetch userdata

client/src/components/NavBar.vue

@@ -1,10 +1,44 @@
-<script setup lang="ts">
+<script lang="ts">
 import { RouterLink } from 'vue-router'
 import { useLoginStore } from '@/stores/login'
 import { storeToRefs } from "pinia";
+import type { User } from '@/interfaces/user';
+export default {
+    name: "NavBar",
+    setup() {
+        const loginStore = useLoginStore();
+        const { loggedIn } = storeToRefs(loginStore);
 
-const loginStore = useLoginStore();
-const { loggedIn } = storeToRefs(loginStore);
+        return { loggedIn, setLoginState: loginStore.setLoginState };
+    },
+    data() {
+        return {
+            user: {
+                first_name: "",
+                last_name: "",
+                email: ""
+            } as User
+        }
+    },
+    async mounted() {
+        await this.getUserInfo();
+    },
+    methods: {
+        async getUserInfo() {
+            const res = await fetch(`${import.meta.env.VITE_BASE_API_URL}/user`, {
+                credentials: import.meta.env.DEV ? "include" : undefined
+            });
+            if (res.status === 401 || res.status === 403) {
+                this.setLoginState(false);
+            }
+            else if (res.status === 200) {
+                this.setLoginState(true);
+                const data = await res.json();
+                this.user = data;
+            }
+        }
+    }
+}
 </script>
 
 <template>
@@ -15,10 +49,12 @@ const { loggedIn } = storeToRefs(loginStore);
             </RouterLink>
             <div class="links">
                 <!-- <RouterLink to="/center">Fitness center</RouterLink>
-                    <RouterLink to="/trainer">Personlig træner</RouterLink> -->
+                        <RouterLink to="/trainer">Personlig træner</RouterLink> -->
             </div>
             <div class="buttons">
                 <RouterLink to="/login" v-if="!loggedIn">Login</RouterLink>
+                <RouterLink to="/user/orders" v-if="loggedIn">Træningstimer</RouterLink>
+                <RouterLink to="/user/profile" v-if="loggedIn">Profil</RouterLink>
             </div>
         </div>
     </div>

client/src/interfaces/user.ts

@@ -0,0 +1,5 @@
+export interface User {
+    first_name: string
+    last_name: string
+    email: string
+}

client/src/router/index.ts

@@ -32,6 +32,14 @@ const router = createRouter({
       // this generates a separate chunk (About.[hash].js) for this route
       // which is lazy-loaded when the route is visited.
       component: () => import('../views/trainer/Schedule.vue')
+    },
+    {
+      path: '/user/orders',
+      name: 'UserOrdersView',
+      // route level code-splitting
+      // this generates a separate chunk (About.[hash].js) for this route
+      // which is lazy-loaded when the route is visited.
+      component: () => import('../views/user/UserOrdersView.vue')
     }
   ]
 })

client/src/views/trainer/Schedule.vue

@@ -42,7 +42,6 @@
     grid-column-gap: 0px;
     grid-row-gap: 0px;
     width: fit-content;
-    margin: auto;
     font-size: 0.9em;
 }
 

client/src/views/user/UserOrdersView.vue

@@ -0,0 +1,23 @@
+<template>
+    <div class="Orders">
+        orders
+    </div>
+</template>
+
+<script lang="ts">
+export default {
+    name: "UserOrdersView",
+    methods: {
+        async fetchOrders() {
+            const res = await fetch(`${import.meta.env.VITE_BASE_API_URL}/orders`, {
+                credentials: import.meta.env.DEV ? "include" : undefined
+            });
+            if (res.status === 401 || res.status === 403) {
+                this.$router.push({ path: "/login", query: { ref: this.$route.path } });
+            }
+        }
+    }
+}
+</script>
+
+<style scoped></style>

server/src/routes/index.ts

@@ -11,6 +11,7 @@ import createOrder from "./createOrder";
 import orderNewTimeProposal from "./orderNewTimeProposal";
 import orderNewTime from "./orderNewTime";
 import order from "./order";
+import user from "./user";
 import stripeWebhook from "./stripeWebhook";
 import { bodyParserErrorHandler } from "../middlewares/bodyParserErrorHandler";
 
@@ -25,5 +26,6 @@ router.use(createOrder);
 router.use(orderNewTimeProposal);
 router.use(orderNewTime);
 router.use(order);
+router.use(user);
 
 export default router;

server/src/routes/user.ts

@@ -0,0 +1,38 @@
+import express, { Router, Request, Response } from "express";
+
+import { client } from "../db";
+import { DatabaseError } from "pg";
+import { UserAuth } from "../middlewares/auth";
+import { AuthedRequest } from "../interfaces/auth";
+
+const router: Router = express.Router();
+
+interface UserObject {
+    first_name: string
+    last_name: string
+    email: string
+    isAdmin: boolean
+    isTrainer: boolean
+}
+
+router.get("/user", UserAuth, async (req: AuthedRequest, res: Response) => {
+    try {
+        const databaseResult = await client.query(`
+            SELECT first_name, last_name, email, is_admin as isAdmin, trainers.user_id IS NOT NULL as isTrainer 
+            FROM users
+            LEFT JOIN trainers ON trainers.user_id = users.id
+            WHERE users.id = $1;
+        `, [
+            req.user?.userId
+        ]);
+
+        const user: UserObject = databaseResult.rows[0];
+
+        return res.status(200).send(user);
+    } catch (error: DatabaseError | Error | any) {
+        console.error(error);
+        return res.sendStatus(500);
+    }
+})
+
+export default router;