Merge branch 'main' of https://gitlab.stud.idi.ntnu.no/idatt2106-2024-07/frontend

.gitlab-ci.yml

+image: node:alpine # Much smaller than other variants, faster and more resource effective
+
 stages:
-  - install
-  - build
+  - install_dependencies
+  - lint
+  - build_project
 
 cache:
+  key: "${CI_COMMIT_REF_SLUG}" # Branch-specific cache keys to have separate caches across branches.
   paths:
     - node_modules/
-  key: "$CI_BUILD_REF_NAME" # Separate cache for each branch
 
 install_dependencies:
-  stage: install
-  image: node:latest
+  stage: install_dependencies
   script:
     - npm install
 
+lint:
+  stage: lint
+  script:
+    - npm run lint
+  allow_failure: true  
+
 build_project:
-  stage: build
-  image: node:latest
+  stage: build_project
   script:
-    - npm run build
+    - npm run build
\ No newline at end of file
+

src/api/core/OpenAPI.ts

@@ -21,7 +21,7 @@ export type OpenAPIConfig = {
 
 export const OpenAPI: OpenAPIConfig = {
     BASE: 'http://localhost:8080',
-    VERSION: '0',
+    VERSION: '3.0',
     WITH_CREDENTIALS: false,
     CREDENTIALS: 'include',
     TOKEN: undefined,

src/api/index.ts

@@ -6,3 +6,10 @@ export { ApiError } from './core/ApiError';
 export { CancelablePromise, CancelError } from './core/CancelablePromise';
 export { OpenAPI } from './core/OpenAPI';
 export type { OpenAPIConfig } from './core/OpenAPI';
+
+export type { AuthenticationResponse } from './models/AuthenticationResponse';
+export type { ExceptionResponse } from './models/ExceptionResponse';
+export type { LoginRequest } from './models/LoginRequest';
+export type { SignUpRequest } from './models/SignUpRequest';
+
+export { AuthenticationService } from './services/AuthenticationService';

src/api/models/AuthenticationResponse.ts

+/* generated using openapi-typescript-codegen -- do not edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+export type AuthenticationResponse = {
+    firstName?: string;
+    lastName?: string;
+    role?: string;
+    token?: string;
+};
+

src/api/models/ExceptionResponse.ts

+/* generated using openapi-typescript-codegen -- do not edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+export type ExceptionResponse = {
+    status?: number;
+    message?: string;
+};
+

src/api/models/LoginRequest.ts

+/* generated using openapi-typescript-codegen -- do not edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+export type LoginRequest = {
+    email?: string;
+    password?: string;
+};
+

src/api/models/SignUpRequest.ts

+/* generated using openapi-typescript-codegen -- do not edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+export type SignUpRequest = {
+    firstName?: string;
+    lastName?: string;
+    email?: string;
+    password?: string;
+    changeWilling?: string;
+    experience?: string;
+    challenges?: Array<string>;
+};
+

src/api/services/AuthenticationService.ts

+/* generated using openapi-typescript-codegen -- do not edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+import type { AuthenticationResponse } from '../models/AuthenticationResponse';
+import type { LoginRequest } from '../models/LoginRequest';
+import type { SignUpRequest } from '../models/SignUpRequest';
+import type { CancelablePromise } from '../core/CancelablePromise';
+import { OpenAPI } from '../core/OpenAPI';
+import { request as __request } from '../core/request';
+export class AuthenticationService {
+    /**
+     * User Signup
+     * Sign up a new user
+     * @returns AuthenticationResponse Successfully signed up
+     * @throws ApiError
+     */
+    public static signup({
+        requestBody,
+    }: {
+        requestBody: SignUpRequest,
+    }): CancelablePromise<AuthenticationResponse> {
+        return __request(OpenAPI, {
+            method: 'POST',
+            url: '/api/auth/signup',
+            body: requestBody,
+            mediaType: 'application/json',
+            errors: {
+                409: `Email already exists`,
+            },
+        });
+    }
+    /**
+     * User Login
+     * Log in with an existing user
+     * @returns AuthenticationResponse Successfully logged in
+     * @throws ApiError
+     */
+    public static login({
+        requestBody,
+    }: {
+        requestBody: LoginRequest,
+    }): CancelablePromise<AuthenticationResponse> {
+        return __request(OpenAPI, {
+            method: 'POST',
+            url: '/api/auth/login',
+            body: requestBody,
+            mediaType: 'application/json',
+            errors: {
+                401: `Invalid credentials`,
+                404: `User not found`,
+            },
+        });
+    }
+}

src/components/BaseComponents/Menu.vue

@@ -45,7 +45,6 @@
                         </ul>
                     </li>
                 </ul>
-
             </div>
         </div>
     </nav>
@@ -83,8 +82,9 @@ function toFeedback() {
     router.push('/feedback')
 }
 
-function toUserProfile() {
-    router.push('/news')
+
+function toUserProfile(){
+  router.push('/profile')
 }
 
 

src/components/UserProfile/UserProfileLayout.vue

+<script setup lang="ts">
+
+import Menu from "@/components/BaseComponents/Menu.vue";
+import Footer from "@/components/BaseComponents/Footer.vue";
+
+let points = 0;
+let streak = 0;
+</script>
+
+<template>
+  <Menu></Menu>
+    <div class="container text-center">
+    <div class="row">
+      <div class="col">
+        <img src="/src/assets/userprofile.png" class="img-fluid">
+        <p class="h2">Username</p>
+        <p><a class="link-dark" href="#">Edit profile</a></p>
+      </div>
+    </div>
+      <div class="row">
+        <div class="col">
+          <img src="/src/assets/icons/fire.png" class="img-fluid" style="width: 30px; height: 30px" alt="dollar">
+          <p>Streak: 10</p>
+        </div>
+      </div>
+      <div class="row">
+      <div class="col-12">
+        <img src="/src/assets/icons/dollar.png" class="img-fluid" style="width: 30px; height: 30px" alt="dollar">
+        <p class="">Points: 2000 </p>
+      </div>
+      </div>
+
+    <div class="row">
+      <div class="col">
+        total points earned
+      </div>
+      <div class="col">
+        total badges earned
+      </div>
+    </div>
+    <div class="row">
+      <div class="col">
+        History
+      </div>
+    </div>
+    <div class="row">
+      <div class="col">
+        Your Badges
+      </div>
+    </div>
+  </div>
+  <Footer></Footer>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file

src/router/index.ts

@@ -2,8 +2,10 @@
 import { createRouter, createWebHistory } from 'vue-router';
 import LoginView from '../views/Authentication/LoginView.vue';
 import { useUserInfoStore } from '@/stores/UserStore';
+import UserProfileView from "@/views/User/UserProfileView.vue";
 import SignUp from '@/components/SignUp/SignUp.vue'
 
+
 const routes = [
   {
     path: '/',
@@ -69,6 +71,11 @@ const routes = [
     name: 'login',
     component: LoginView,
   },
+  {
+    path: '/profile',
+    name: 'profile',
+    component: UserProfileView
+  },
   {
     path: '/sign-up',
     name: 'sign up',

src/views/User/UserProfileView.vue

+<script setup lang="ts">
+
+import UserProfileLayout from "@/components/UserProfile/UserProfileLayout.vue";
+</script>
+
+<template>
+<UserProfileLayout></UserProfileLayout>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file