Skip to main content
The user settings store (internally named “grades”) manages user-specific settings including grade level and PWC schedule visibility preferences.

State Properties

grade
string
default:"'None'"
The user’s current grade level. Defaults to ‘None’ if not set.
showPWCSchedule
boolean
default:"true"
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:
value
string
required
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:
value
boolean
required
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)
}

Build docs developers (and LLMs) love