Task 12 — account-auth (PR 13)
Gate: All other PRs merged.
State: user, pending, loginInflight, loginError, redirectUrlAfterLogin, offline
Actions: login, checkIfAuthenticated, setUser, setOffline, setRedirectUrl (plus internal setters)
Consumers: ~25 files (user identity and auth state)
Note: logout stays in the Vuex account module until Task 15 — it needs dispatch('$resetState') to reset remaining Vuex state that hasn't moved to Pinia yet. It moves to Pinia in teardown.
12.1 — Create account-auth.js
Create the store with its state shape and actions. Port the auth-specific logic out of Vuex:
login — sets user, clears loginInflightcheckIfAuthenticated — calls userApi.getUser(), sets usersetUser, setOffline, setRedirectUrl — simple setters; consumers call Pinia directly (no Vuex proxy action)
12.2 — Update Vuex checkState to delegate auth parts to Pinia
Remove the auth commits from checkState and replace with Pinia calls:
// Before
commit('login', user)
commit('clearPending')
// After
useAccountAuthStore().login(user)
useAccountAuthStore().clearPending()Remove the auth-related mutations from the Vuex module (login, setUser, clearPending, setPending, setLoginInflight, loginFailed, setOffline, setRedirectUrl, sessionExpired). They are no longer needed.
12.3 — Update Vuex logout to call Pinia
// Vuex logout after Task 12
async logout({ dispatch }) {
return userApi.logout()
.then(() => {
useAccountAuthStore().$reset() // auth state cleared via Pinia
dispatch('$resetState', null, { root: true }) // remaining Vuex state
// existing Pinia $reset() calls for already-migrated stores...
})
}12.4 — Add persistence
persist: {
pick: ['redirectUrlAfterLogin'],
storage: localStorage
}user, pending etc. are not persisted — always re-fetched on load.
12.5 — Update _account_bridge.js
The bridge currently reads user from Vuex. Update it to read from useAccountAuthStore():
// _account_bridge.js after Task 12
import { useAccountAuthStore } from './account-auth.js'
export function useAccountBridge () {
const authStore = useAccountAuthStore()
return {
user: authStore.user,
// team, featuresCheck still from Vuex until Tasks 13–14
team: store.getters['account/team'],
featuresCheck: store.getters['account/featuresCheck']
}
}12.6 — Update ~25 consumers
Migrate components that read auth state directly to Pinia — no proxy Vuex getters. Components that previously used mapState('account', ['user']) or mapGetters('account', ['user']) switch to mapState(useAccountAuthStore, ['user']). Alias the Vuex helpers when both are needed in the same file (checklist item 5):
import { mapState } from 'pinia'
import { mapState as mapVuexState } from 'vuex' // alias Vuex since it's being phased out
import { useAccountAuthStore } from '@/stores/account-auth.js'
computed: {
...mapState(useAccountAuthStore, ['user', 'pending']), // Pinia
...mapVuexState('account', ['team', 'settings']) // Vuex (still there)
}Files that dispatched account/setUser, account/setOffline, or account/setRedirectUrl call useAccountAuthStore() directly — those Vuex actions are removed entirely (no proxy stubs).
grep -rl "mapState.*account.*user\|mapGetters.*account.*user\|mapState.*account.*pending" frontend/src/
12.7 — Export from stores index
export { useAccountAuthStore } from './account-auth.js'12.8 — Write tests
Unit tests for account-auth.js covering login, logout, checkIfAuthenticated, persistence.
Task 12 —
account-auth(PR 13)Gate: All other PRs merged.
State:
user,pending,loginInflight,loginError,redirectUrlAfterLogin,offlineActions:
login,checkIfAuthenticated,setUser,setOffline,setRedirectUrl(plus internal setters)Consumers: ~25 files (user identity and auth state)
12.1 — Create
account-auth.jsCreate the store with its state shape and actions. Port the auth-specific logic out of Vuex:
login— setsuser, clearsloginInflightcheckIfAuthenticated— callsuserApi.getUser(), sets usersetUser,setOffline,setRedirectUrl— simple setters; consumers call Pinia directly (no Vuex proxy action)12.2 — Update Vuex
checkStateto delegate auth parts to PiniaRemove the auth commits from
checkStateand replace with Pinia calls:Remove the auth-related mutations from the Vuex module (
login,setUser,clearPending,setPending,setLoginInflight,loginFailed,setOffline,setRedirectUrl,sessionExpired). They are no longer needed.12.3 — Update Vuex
logoutto call Pinia12.4 — Add persistence
user,pendingetc. are not persisted — always re-fetched on load.12.5 — Update
_account_bridge.jsThe bridge currently reads
userfrom Vuex. Update it to read fromuseAccountAuthStore():12.6 — Update ~25 consumers
Migrate components that read auth state directly to Pinia — no proxy Vuex getters. Components that previously used
mapState('account', ['user'])ormapGetters('account', ['user'])switch tomapState(useAccountAuthStore, ['user']). Alias the Vuex helpers when both are needed in the same file (checklist item 5):Files that dispatched
account/setUser,account/setOffline, oraccount/setRedirectUrlcalluseAccountAuthStore()directly — those Vuex actions are removed entirely (no proxy stubs).grep -rl "mapState.*account.*user\|mapGetters.*account.*user\|mapState.*account.*pending" frontend/src/12.7 — Export from stores index
12.8 — Write tests
Unit tests for
account-auth.jscovering login, logout, checkIfAuthenticated, persistence.