The user settings store (internally named “grades”) manages user-specific settings including grade level and PWC schedule visibility preferences.
State Properties
The user’s current grade level. Defaults to ‘None’ if not set.
Whether to show the PWC (Period Without Class) schedule information. Defaults to true.
Actions
initializeGrade
function initializeGrade(): void
Initializes the grade setting from localStorage. Should be called when the app starts.
Usage:
import useGradesStore from '@/stores/user-settings'
const userSettingsStore = useGradesStore()
userSettingsStore.initializeGrade()
initializeShowPWCSchedule
function initializeShowPWCSchedule(): void
Initializes the PWC schedule visibility setting from localStorage. Should be called when the app starts.
Usage:
userSettingsStore.initializeShowPWCSchedule()
setGrade
function setGrade(value: string): void
Sets the user’s grade level. Automatically persists to localStorage.
Parameters:
The grade level to set (e.g., ‘9’, ‘10’, ‘11’, ‘12’, or ‘None’)
Usage:
userSettingsStore.setGrade('11')
setShowPWCSchedule
function setShowPWCSchedule(value: boolean): void
Sets whether to show the PWC schedule. Automatically persists to localStorage.
Parameters:
Whether to show the PWC schedule
Usage:
userSettingsStore.setShowPWCSchedule(false)
Example Usage
Here’s a complete example of using the user settings store in a component:
import { storeToRefs } from 'pinia'
import useGradesStore from '@/stores/user-settings'
const userSettingsStore = useGradesStore()
const { grade, showPWCSchedule } = storeToRefs(userSettingsStore)
// Initialize on mount
onMounted(() => {
userSettingsStore.initializeGrade()
userSettingsStore.initializeShowPWCSchedule()
})
// Update grade
const updateGrade = (newGrade: string) => {
userSettingsStore.setGrade(newGrade)
}
// Toggle PWC schedule visibility
const togglePWC = () => {
userSettingsStore.setShowPWCSchedule(!showPWCSchedule.value)
}