feat: implement validateRedirect utility for open redirect protection

app/composables/useAuth.ts

@@ -15,6 +15,7 @@ export interface LoggedInUser extends RecordModel {
 const user = ref<LoggedInUser | null>(null);
 const loading = ref<boolean>(false);
 const error = ref<Error | null>(null);
+let isInitialized = false;
 
 export const useAuth = () => {
   const pb = usePocketbase();
@@ -22,13 +23,18 @@ export const useAuth = () => {
 
   const userCollection = 'users';
 
-  const isAuthenticated = computed<boolean>(() => pb.authStore.isValid && !!user.value);
-
   const initAuth = async () => {
     user.value = pb.authStore.record as LoggedInUser;
     pb.authStore.onChange((_token, model) => (user.value = model as LoggedInUser));
   };
 
+  if (!isInitialized) {
+    initAuth();
+    isInitialized = true;
+  }
+
+  const isAuthenticated = computed<boolean>(() => pb.authStore.isValid && !!user.value);
+
   const authProviders = async (): Promise<AuthProviderInfo[]> => {
     const authMethods = await pb.collection(userCollection).listAuthMethods();
     return authMethods.oauth2.enabled ? authMethods.oauth2.providers : [];
@@ -44,7 +50,9 @@ export const useAuth = () => {
         throw new Error(`${provider} OAuth is not configured`);
       }
       const response = await pb.collection(userCollection).authWithOAuth2({ provider });
+      console.log('Auth response:', response)
       user.value = response.record as LoggedInUser;
+      console.log('User value', user.value)
     } catch (pbError) {
       error.value = pbError as Error;
     } finally {
@@ -64,9 +72,9 @@ export const useAuth = () => {
   };
 
   const logout = () => {
-    pb.authStore.clear();
     user.value = null;
     error.value = null;
+    pb.authStore.clear();
   };
 
   return {
@@ -76,7 +84,6 @@ export const useAuth = () => {
     isAuthenticated,
     login,
     logout,
-    initAuth,
     refreshAuth,
     handleOAuthCallback,
     authProviders,

app/pages/login.vue

@@ -24,14 +24,14 @@ definePageMeta({
 });
 
 const route = useRoute();
-const redirectPath = (route.query.redirect as string) || '/dashboard';
+const redirectPath = validateRedirect(route.query.redirect, '/dashboard');
 const { authProviders, error, isAuthenticated } = useAuth();
-
 const providers = await authProviders();
-
-watch(isAuthenticated, (authenticated) => {
+const redirect = (authenticated: boolean) => {
   if (authenticated) {
     navigateTo(redirectPath);
   }
-});
+};
+redirect(isAuthenticated.value);
+watch(isAuthenticated, redirect);
 </script>

app/utils/validateRedirect.ts

@@ -0,0 +1,9 @@
+export const validateRedirect = (redirect: string | unknown, fallback = '/dashboard'): string => {
+  if (typeof redirect !== 'string') {
+    return fallback;
+  }
+  if (redirect.startsWith('/') && !redirect.startsWith('//')) {
+    return redirect;
+  }
+  return fallback;
+}