Merge branch 'refactor/folder-structure' into 'main'

Refactor/folder structure

See merge request !76

src/components/Buttons/__tests__/Button1.spec.ts → src/components/BaseComponents/Buttons/__tests__/BaseButton.spec.ts

 import { describe, it, expect } from 'vitest'
 import { mount } from '@vue/test-utils'
-import ButtonComponent from '@/components/Buttons/Button1.vue'
+import ButtonComponent from '../BaseButton.vue'
 
 describe('ButtonComponent', () => {
   it('displays the passed buttonText prop', () => {

src/components/BaseComponents/FooterAlternative.vue

-<script setup lang="ts">
-import '@fortawesome/fontawesome-free/css/all.css'
-import { RouterLink } from 'vue-router'
-import {logDOM} from "@testing-library/vue";
-
-
-
-
-const ifNotLoggedInLogin  = () => {
- /* if (useUserInfoStore.isActive) {
-    return '/discover'
-  }
-  return '/login'*/
-  return '/login'
-}
-
-const ifLoggedInDiscover = () => {
-  /*if (store.isActive) {
-    return '/discover'
-  }
-  return '/'*/
-  return '/'
-}
-
-const ifLoggedInReset = () => {
-  /*if (store.isActive) {
-    store.resetAll()
-  }*/
-  return '/login'
-}
-</script>
-
-<template>
-  <div class="footer footer-wrapper fixed-bottom" style="background-color: #3B71CA">
-
-    <div class="links-wrapper">
-      <p class="links-header">Links</p>
-      <div class="links-container">
-        <RouterLink class="router" id="home" :to="ifLoggedInDiscover">Home</RouterLink>
-        <RouterLink class="router" id="discover" :to="ifNotLoggedInLogin()">Discover</RouterLink>
-        <RouterLink class="router" id="login" to="/login" @click="ifLoggedInReset()">Login</RouterLink>
-      </div>
-    </div>
-
-    <div class="support-wrapper">
-      <p class="support-header">Support us</p>
-      <div class="support-container">
-        <a href="https://twitter.com" target="_blank">
-          <i class="fab fa-twitter"></i>
-          Twitter
-        </a>
-        <a href="https://instagram.com" target="_blank">
-          <i class="fab fa-instagram"></i>
-           Instagram
-        </a>
-        <a href="https://facebook.com" target="_blank">
-          <i class="fab fa-facebook"></i>
-           Facebook
-        </a>
-        <a href="https://discord.gg" target="_blank">
-          <i class="fab fa-discord"></i>
-           Discord
-        </a>
-      </div>
-    </div>
-
-    <div class="info-wrapper">
-      <p class="info-header">Company</p>
-      <div class="info-container">
-        <RouterLink class="router" to="/about-us">About us</RouterLink>
-        <RouterLink class="router" to="/privacy-policy">Privacy</RouterLink>
-      </div>
-    </div>
-
-  </div>
-</template>
-
-<style scoped>
-:root {
-  --footer-margin: 2rem
-}
-
-.footer-wrapper {
-  width: 100%;
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
-  background-size: cover;
-  justify-content: center;
-}
-
-.links-header, .support-header, .info-header {
-  font-family: Inter,sans-serif;
-  font-size: 26px;
-  font-weight: 600;
-  color: #FFFFFF;
-  margin: var(--footer-margin);
-  padding-left: 10px;
-}
-
-.links-container, .support-container, .info-container {
-  display: flex;
-  flex-direction: column;
-  margin: var(--footer-margin);
-}
-
-.support-container a i {
-  margin-right: 0.7rem;
-}
-
-.router, .support-container a {
-  width: 100%;
-  height: 39px;
-  font-family: 'Inter', serif;
-  font-weight: 500;
-  font-size: 18px;
-  text-decoration: none;
-  border-radius: 10px;
-  align-content: center;
-  color: #FFFFFF;
-  border: 1px solid #3B71CA;
-  padding-left: 10px;
-}
-
-.router:hover, .support-container a:hover {
-  background-color: #FFFFFF;
-  color: #3B71CA;
-  font-weight: 500;
-  font-size: 18px;
-}
-
-@media (max-width: 588px) {
-  .footer-wrapper {
-    display: flex;
-    flex-direction: column;
-  }
-}
-</style>

src/components/InputFields/__tests__/BaseInput.spec.ts → src/components/BaseComponents/Input/__tests__/BaseInput.spec.ts

 import { describe, it, expect } from 'vitest'
 import { mount } from '@vue/test-utils';
-import InputField from '@/components/InputFields/BaseInput.vue';
+import InputField from '../BaseInput.vue';
 
 describe('InputField.vue', () => {
   it('emits inputChangeEvent when input event is triggered', async () => {

src/components/BaseComponents/__tests__/FooterComponent.spec.ts → src/components/BaseComponents/__tests__/BaseFooter.spec.ts

 import { describe, it, expect } from 'vitest'
 import { mount } from '@vue/test-utils'
-import FooterComponent from '../FooterComponent.vue'
+import FooterComponent from '../BaseFooter.vue'
 
 describe('FooterComponent', () => {
   it('renders properly and includes the correct copyright notice', () => {

src/components/BaseComponents/__tests__/MenuComponent.spec.ts → src/components/BaseComponents/__tests__/NavBar.spec.ts

@@ -3,7 +3,7 @@ import { mount } from '@vue/test-utils';
 import { createRouter, createMemoryHistory } from 'vue-router';
 import { createPinia, setActivePinia } from 'pinia';
 import { useUserInfoStore } from '@/stores/UserStore';
-import MyComponent from '../MenuComponent.vue'; // Adjust path as needed
+import MyComponent from '../NavBar.vue'; // Adjust path as needed
 import router from '@/router/index'; // Adjust path as needed
 import { access } from 'fs';
 import { render, screen } from '@testing-library/vue';

src/components/Configuration/ConfigurationSteps/BankId.vue

-<script setup lang="ts">
-/*
-import Button1 from '@/components/Buttons/Button1.vue'
-import { useRouter } from 'vue-router'
-import { ref } from 'vue'
-
-const formRef = ref()
-const bankIDRef = ref(false)
-const minIdRef = ref(false)
-const vippsRef = ref(false)
-
-
-const router = useRouter();
-const emit = defineEmits(['changeRouterEvent']);
-emit('changeRouterEvent', '/bank-id');
-
-const onClick = () => {
-  const radios = formRef.value.querySelectorAll('input[type="radio"]');
-  const checkedRadios = Array.from(radios).filter(radio => radio.checked);
-
-  if (checkedRadios.length === 0) {
-    alert('Please select an option.');
-    return;
-  }
-
-  let choice = ''
-  if (bankIDRef.value.checked) choice = 'BankId på mobil'
-  else if (minIdRef.value.checked) choice = 'MinId'
-  else if (vippsRef.value.checked) choice = 'Vipps'
-
-  emit('bankIdSelectedEvent', choice)
-  router.push('/commitment')
-}
-*/
-</script>
-
-<template>
-  <!--
-  <div class="container">
-    <div>
-      <h3 class="d-flex align-items-center justify-content-center">
-        In order to provide best advice we need to connect to your bank account
-      </h3>
-    </div>
-
-    <form class="btn-group-vertical" ref="formRef" @submit.prevent="onClick">
-
-      <input ref="bankIDRef" type="radio" class="btn-check" name="bank-id" id="btn-check-outlined" autocomplete="off">
-      <label class="btn btn-outline-primary d-flex align-items-center justify-content-center" for="btn-check-outlined">BankID på mobil</label>
-
-      <input ref="minIdRef" type="radio" class="btn-check" name="bank-id" id="btn-check2-outlined" autocomplete="off">
-      <label class="btn btn-outline-primary d-flex align-items-center justify-content-center" for="btn-check2-outlined">MinID</label>
-
-      <input ref="vippsRef" type="radio" class="btn-check" name="bank-id" id="btn-check3-outlined" autocomplete="off">
-      <label class="btn btn-outline-primary d-flex align-items-center justify-content-center" for="btn-check3-outlined">Vipps</label>
-
-    </form>
-
-    <div class="confirm-button-container">
-      <button1 id="confirmButton"
-               @click="onClick"
-               button-text="Continue">
-      </button1>
-    </div>
-
-  </div>
-  -->
-</template>
-
-<style scoped>
-/*
-#confirmButton {
-  margin-bottom: 2rem;
-  width: 300px;
-}
-
-.confirm-button-container {
-  display: flex;
-  justify-content: center;
-}
- */
-</style>
\ No newline at end of file

src/components/Configuration/ConfigurationSteps/Commitment.vue → src/components/Configuration/ConfigurationSteps/ConfigurationCommitment.vue

 <script setup lang="ts">
-import Button1 from '@/components/Buttons/Button1.vue'
+import BaseButton from '@/components/BaseComponents/Buttons/BaseButton.vue'
 import { useRouter } from 'vue-router'
 import { ref } from 'vue'
 import { useConfigurationStore } from '@/stores/ConfigurationStore'
@@ -59,7 +59,7 @@ const handleSubmit = () => {
     </form>
     <p class="text-danger">{{ errorMsg }}</p>
     <div class="confirm-button-container">
-      <button1 id="confirmButton" @click="handleSubmit" button-text="Fortsett"></button1>
+      <BaseButton id="confirmButton" @click="handleSubmit" button-text="Fortsett"></BaseButton>
     </div>
   </div>
 </template>

src/components/Configuration/ConfigurationSteps/Experience.vue → src/components/Configuration/ConfigurationSteps/ConfigurationExperience.vue

 <script setup lang="ts">
-import Button1 from '@/components/Buttons/Button1.vue'
+import BaseButton from '@/components/BaseComponents/Buttons/BaseButton.vue'
 import { useRouter } from 'vue-router'
 import { ref } from 'vue'
 import { useConfigurationStore } from '@/stores/ConfigurationStore'
@@ -61,7 +61,7 @@ const handleSubmit = () => {
     </form>
     <p class="text-danger">{{ errorMsg }}</p>
     <div class="confirm-button-container">
-      <button1 id="confirmButton" @click="handleSubmit" button-text="Continue"/>
+      <BaseButton id="confirmButton" @click="handleSubmit" button-text="Continue"/>
     </div>
 </div>
 </template>

src/components/Configuration/ConfigurationSteps/FirstSavingGoal.vue → src/components/Configuration/ConfigurationSteps/ConfigurationSavingGoal.vue

 <script setup lang="ts">
-import BaseInput from '@/components/InputFields/BaseInput.vue'
+import BaseInput from '@/components/BaseComponents/Input/BaseInput.vue'
 import { ref } from 'vue'
-import Button1 from '@/components/Buttons/Button1.vue'
+import BaseButton from '@/components/BaseComponents/Buttons/BaseButton.vue'
 import { useRouter } from 'vue-router'
 import {type CreateGoalDTO, GoalService} from "@/api";
 
@@ -111,7 +111,7 @@ const handleSumInputEvent = (newSum: number) => {
     </form>
 
     <div class="confirm-button-container">
-      <button1 id="confirmButton" @click="handleSubmit" button-text="Continue"></button1>
+      <BaseButton id="confirmButton" @click="handleSubmit" button-text="Continue"></BaseButton>
     </div>
     <div style="color: red">
       {{ errorMessage }}

src/components/Configuration/ConfigurationSteps/SuitableChallenges.vue

 <script setup lang="ts">
 import { useRouter } from 'vue-router'
 import ChallangeCheckBox from '@/components/Configuration/ChallangeCheckBox.vue'
-import Button1 from '@/components/Buttons/Button1.vue'
+import BaseButton from '@/components/BaseComponents/Buttons/BaseButton.vue'
 import { ref } from 'vue'
 import { useConfigurationStore } from '@/stores/ConfigurationStore'
 import { useUserInfoStore } from '@/stores/UserStore'
@@ -117,7 +117,7 @@ const handleSubmit = () => {
     <p class="text-danger">{{ errorMsg }}</p>
 
     <div class="confirm-button-container">
-      <button1 id="confirmButton" @click="handleSubmit" button-text="Continue"/>
+      <BaseButton id="confirmButton" @click="handleSubmit" button-text="Continue"/>
     </div>
   </div>
 </template>

src/components/LeaderboardComponents/__tests__/Leaderboard.spec.ts → src/components/Leaderboard/__tests__/LeaderboardTable.spec.ts

@@ -2,9 +2,9 @@ import { describe, it, expect, beforeEach, vi } from 'vitest';
 import { mount } from '@vue/test-utils';
 import { createRouter, createMemoryHistory } from 'vue-router';
 import { createPinia, setActivePinia } from 'pinia';
-import Leaderboard from '@/components/LeaderboardComponents/Leaderboard.vue';
-import { useUserInfoStore } from '@/stores/UserStore';
-import router from '@/router/index';
+import Leaderboard from '../LeaderboardTable.vue';
+import { useUserInfoStore } from '../../../stores/UserStore';
+import router from '../../../router';
 
 describe('Leaderboard', () => {
 

src/components/Login/LoginForm.vue

 <script setup lang="ts">
-import BaseInput from '@/components/InputFields/BaseInput.vue'
-import Button1 from '@/components/Buttons/Button1.vue'
+import BaseInput from '@/components/BaseComponents/Input/BaseInput.vue'
+import BaseButton from '@/components/BaseComponents/Buttons/BaseButton.vue'
 import { ref } from 'vue'
 import { useUserInfoStore } from '@/stores/UserStore';
 import { AuthenticationService, OpenAPI, type LoginRequest } from '@/api';
@@ -111,7 +111,7 @@ const handleSubmit = async () => {
       </div>
 
       <p class="text-danger" data-cy="error">{{ errorMsg }}</p>
-      <button1 id="confirmButton" type="submit" @click="handleSubmit" :disabled="isSubmitting" button-text="Logg inn"></button1>
+      <BaseButton id="confirmButton" type="submit" @click="handleSubmit" :disabled="isSubmitting" button-text="Logg inn"></BaseButton>
 
       <a class="btn bankid-btn" href="https://preprod.signicat.com/oidc/authorize?response_type=code&scope=openid+profile+signicat.national_id&client_id=demo-preprod&redirect_uri=http%3A%2F%2Flocalhost%3A8080%2Fredirect&acr_values=urn:signicat:oidc:method:nbid&state=nbid:auth_demo_bankid:123456789">
         <img src="/src/assets/bankid.svg" width="26" height="26">