feat: add support for refresh tokens in internal stores

src/composables/apiFetch.ts

@@ -1,8 +1,8 @@
 export const apiFetch = $fetch.create({
 	onRequest({ options }) {
-		const token = useAuthStore().getToken();
-		if (token) {
-			options.headers.set('Authorization', 'Bearer ' + token);
+		const tokens = useAuthStore().getTokens();
+		if (tokens) {
+			options.headers.set('Authorization', 'Bearer ' + tokens.accessToken);
 		}
 	},
 	async onResponseError({ response }) {

src/middleware/1.auth.global.ts

@@ -8,8 +8,8 @@ export default defineNuxtRouteMiddleware(async () => {
 
 	const authStore = useAuthStore();
 	authStore.refresh();
-	const token = authStore.getToken();
-	if (!token) {
+	const tokens = authStore.getTokens();
+	if (!tokens) {
 		meStore.setMe(null);
 		return; // No token
 	}
@@ -17,7 +17,7 @@ export default defineNuxtRouteMiddleware(async () => {
 	try {
 		const res = await $fetch<GetApiAuthMe>('/api/auth/me', {
 			headers: {
-				Authorization: `Bearer ${token}`
+				Authorization: `Bearer ${tokens.accessToken}`
 			}
 		});
 		meStore.setMe({

src/stores/auth.ts

@@ -45,8 +45,15 @@ export function useAuthStore() {
 	const refreshTokenCookie = useCookie<string | null>('refresh_token', oldOpts);
 	const tokenTypeCookie = useCookie<string | null>('token_type', oldOpts);
 
-	function getToken() {
-		return authState.value?.accessToken ?? null;
+	function getTokens() {
+		if (!authState.value) {
+			return null;
+		}
+
+		return {
+			accessToken: authState.value.accessToken,
+			refreshToken: authState.value.refreshToken
+		};
 	}
 
 	function refresh() {
@@ -76,7 +83,7 @@ export function useAuthStore() {
 	}
 
 	return {
-		getToken,
+		getTokens,
 		refresh,
 		set,
 		logout