chore: wrote comments in store classes

src/stores/challengeStore.ts

-// store/challengeStore.js
 import { defineStore } from 'pinia'
 import { ref } from 'vue'
 import authInterceptor from '@/services/authInterceptor'
 import type { Challenge } from '@/types/challenge'
 
 export const useChallengeStore = defineStore('challenge', () => {
+    // Reactive state to hold the list of challenges
     const challenges = ref<Challenge[]>([])
 
+    // Function to fetch challenges for the current user
     const getUserChallenges = async () => {
         try {
             const response = await authInterceptor('/challenges')
@@ -22,7 +23,7 @@ export const useChallengeStore = defineStore('challenge', () => {
         }
     }
 
-    // Assuming 'challenges' is a reactive state in your store that holds the list of challenges
+    // Function to edit a user challenge
     const editUserChallenge = async (challenge: Challenge) => {
         try {
             const response = await authInterceptor.put(`/challenges/${challenge.id}`, challenge)
@@ -43,6 +44,8 @@ export const useChallengeStore = defineStore('challenge', () => {
             return null
         }
     }
+
+    // Function to mark a user challenge as completed
     const completeUserChallenge = async (challenge: Challenge) => {
         try {
             const response = await authInterceptor.put(
@@ -68,6 +71,7 @@ export const useChallengeStore = defineStore('challenge', () => {
         }
     }
 
+    // Return reactive state and functions to be used by components
     return {
         challenges,
         getUserChallenges,

src/stores/goalStore.ts

@@ -4,13 +4,20 @@ import { ref } from 'vue'
 import authInterceptor from '@/services/authInterceptor'
 
 export const useGoalStore = defineStore('goal', () => {
+    // Reactive state to hold the list of goals
     const goals = ref<Goal[]>([])
+
+    // Reactive state to hold the priority goal
     const priorityGoal = ref<Goal | null>(null)
+
+    // Function to fetch goals for the current user
     const getUserGoals = async () => {
         try {
             const response = await authInterceptor('/goals')
             if (response.data && response.data.content) {
-                goals.value = response.data.content
+                goals.value = response.data.content // Update goals state with fetched data
+
+                // Iterate through goals to find the priority goal
                 for (const goal of goals.value) {
                     if (goal.priority === 1) {
                         priorityGoal.value = goal
@@ -30,7 +37,7 @@ export const useGoalStore = defineStore('goal', () => {
         }
     }
 
-    // Assuming 'challenges' is a reactive state in your store that holds the list of challenges
+    // Function to edit a user goal
     const editUserGoal = async (goal: Goal) => {
         if (!goal || goal.id === null) {
             console.error('Invalid goal or goal ID.')
@@ -51,6 +58,8 @@ export const useGoalStore = defineStore('goal', () => {
             console.error('Error updating goal:', error)
         }
     }
+
+    // Return reactive states and functions to be used by components
     return {
         goals,
         priorityGoal,

src/stores/userConfigStore.ts

@@ -6,18 +6,22 @@ import type { ChallengeConfig } from '@/types/challengeConfig'
 import router from '@/router'
 
 export const useUserConfigStore = defineStore('userConfig', () => {
+
+    // Reactive state to hold the challenge configuration
     const challengeConfig = ref<ChallengeConfig>({
         experience: '',
         motivation: '',
         challengeTypeConfigs: []
     })
 
+    // Reactive state to hold the saving account information
     const savingAccount = ref({
         accountType: 'SAVING',
         accNumber: 0,
         balance: 0
     })
 
+    // Reactive state to hold the spending account information
     const spendingAccount = ref({
         accountType: 'SPENDING',
         accNumber: 0,
@@ -26,14 +30,17 @@ export const useUserConfigStore = defineStore('userConfig', () => {
 
     const errorMessage = ref<string>('')
 
+    // Function to set experience in the challenge configuration
     const setExperience = (value: string) => {
         challengeConfig.value.experience = value
     }
 
+    // Function to set motivation in the challenge configuration
     const setMotivation = (value: string) => {
         challengeConfig.value.motivation = value
     }
 
+    // Function to add challenge type configuration
     const addChallengeTypeConfig = (
         type: string,
         specificAmount: number,
@@ -46,6 +53,7 @@ export const useUserConfigStore = defineStore('userConfig', () => {
         })
     }
 
+    // Function to set account information
     const setAccount = (type: 'SAVING' | 'SPENDING', accNumber: number) => {
         if (type === 'SAVING') {
             savingAccount.value.accNumber = accNumber
@@ -54,11 +62,16 @@ export const useUserConfigStore = defineStore('userConfig', () => {
         }
     }
 
+    // Function to create user configuration
     const createConfig = () => {
         authInterceptor
+            // Create saving account
             .post('/accounts', savingAccount.value)
+            // Create spending account
             .then(() => authInterceptor.post('/accounts', spendingAccount.value))
+            // Create challenge configuration
             .then(() => authInterceptor.post('/config/challenge', challengeConfig.value))
+            // Navigate to home page after configuration creation
             .then(() => {
                 resetConfig()
                 return router.push({ name: 'home', query: { firstLogin: 'true' } })
@@ -70,6 +83,7 @@ export const useUserConfigStore = defineStore('userConfig', () => {
             })
     }
 
+    // Function to reset configuration states
     const resetConfig = () => {
         challengeConfig.value = {
             experience: '',
@@ -88,6 +102,7 @@ export const useUserConfigStore = defineStore('userConfig', () => {
         }
     }
 
+    // Return reactive states and functions to be used by components
     return {
         challengeConfig,
         errorMessage,

src/stores/userStore.ts

@@ -11,6 +11,8 @@ import { base64urlToUint8array, initialCheckStatus, uint8arrayToBase64url } from
 import type { CredentialCreationOptions } from '@/types/CredentialCreationOptions'
 
 export const useUserStore = defineStore('user', () => {
+
+    // Reactive state to hold the user information
     const user = ref<User>({
         firstName: '',
         lastName: '',
@@ -21,6 +23,7 @@ export const useUserStore = defineStore('user', () => {
     const streak = ref<Streak>()
     const profilePicture = ref<string>('')
 
+    // Function to register a new user
     const register = async (
         firstName: string,
         lastName: string,
@@ -37,8 +40,11 @@ export const useUserStore = defineStore('user', () => {
                 password: password
             })
             .then((response) => {
+
+                // Save access token in session storage
                 sessionStorage.setItem('accessToken', response.data.accessToken)
 
+                // Update user information
                 user.value.firstName = firstName
                 user.value.lastName = lastName
                 user.value.username = username
@@ -51,6 +57,7 @@ export const useUserStore = defineStore('user', () => {
             })
     }
 
+    // Function to log in a user
     const login = (username: string, password: string) => {
         axios
             .post(`http://localhost:8080/auth/login`, {
@@ -67,11 +74,13 @@ export const useUserStore = defineStore('user', () => {
                 return authInterceptor('/profile')
             })
             .then((profileResponse) => {
+                // Check if the user has a passkey and store spare username if needed
                 if (profileResponse.data.hasPasskey === true) {
                     localStorage.setItem('spareStiUsername', username)
                 } else {
                     localStorage.removeItem('spareStiUsername')
                 }
+                // Check if the user is configured and redirect accordingly
                 return checkIfUserConfigured()
             })
             .then(() => {
@@ -85,10 +94,13 @@ export const useUserStore = defineStore('user', () => {
             })
     }
 
+    // Method to log out a user
     const logout = () => {
+        // Remove access token and spare username from storage
         sessionStorage.removeItem('accessToken')
         localStorage.removeItem('spareStiUsername')
 
+        // Clear user information
         user.value.firstName = ''
         user.value.lastName = ''
         user.value.username = ''
@@ -97,6 +109,7 @@ export const useUserStore = defineStore('user', () => {
         router.push({ name: 'login' })
     }
 
+    // Method to retrieve user's streak
     const getUserStreak = () => {
         authInterceptor('/profile/streak')
             .then((response) => {
@@ -108,14 +121,18 @@ export const useUserStore = defineStore('user', () => {
             })
     }
 
+    // Method to register biometric data
     const bioRegister = async () => {
+        // Send biometric registration request to the server
         authInterceptor
             .post('/auth/bioRegistration')
             .then((response) => {
                 initialCheckStatus(response)
 
+                // Process credential creation options
                 const credentialCreateJson: CredentialCreationOptions = response.data
 
+                // Transform credential creation options
                 const credentialCreateOptions: CredentialCreationOptions = {
                     publicKey: {
                         ...credentialCreateJson.publicKey,
@@ -138,11 +155,13 @@ export const useUserStore = defineStore('user', () => {
                     }
                 }
 
+                // Create credential using browser's credentials API
                 return navigator.credentials.create(
                     credentialCreateOptions
                 ) as Promise<PublicKeyCredential>
             })
             .then((publicKeyCredential) => {
+                // Process the created credential
                 const publicKeyResponse =
                     publicKeyCredential.response as AuthenticatorAttestationResponse
                 const encodedResult = {
@@ -158,6 +177,7 @@ export const useUserStore = defineStore('user', () => {
                     clientExtensionResults: publicKeyCredential.getClientExtensionResults()
                 }
 
+                // Send encoded result to complete biometric registration
                 return authInterceptor.post('/auth/finishBioRegistration', {
                     credential: JSON.stringify(encodedResult)
                 })
@@ -170,6 +190,7 @@ export const useUserStore = defineStore('user', () => {
             })
     }
 
+    // Method to login using biometric data
     const bioLogin = (username: string) => {
         axios
             .post(`http://localhost:8080/auth/bioLogin/${username}`)
@@ -236,6 +257,7 @@ export const useUserStore = defineStore('user', () => {
             })
     }
 
+    // Method to check if the user is configured
     const checkIfUserConfigured = async () => {
         await authInterceptor('/config')
             .then((response) => {
@@ -245,7 +267,8 @@ export const useUserStore = defineStore('user', () => {
                 user.value.isConfigured = false
             })
     }
-    // Inside your store or component methods
+
+    // Method to upload user's profile picture
     const uploadProfilePicture = async (formData: FormData) => {
         try {
             const response = await authInterceptor.post('/profile/picture', formData, {
@@ -257,6 +280,7 @@ export const useUserStore = defineStore('user', () => {
         }
     }
 
+    // Method to retrieve user's profile picture
     const getProfilePicture = async () => {
         try {
             const imageResponse = await authInterceptor.get('/profile/picture', {
@@ -268,6 +292,7 @@ export const useUserStore = defineStore('user', () => {
         }
     }
 
+    // Return the variables and methods to be used by components
     return {
         user,
         checkIfUserConfigured,