Protected routes with guards

Problem. Redirect unauthenticated users away from /account to /login.

Solution. Register a router guard that inspects a session signal and returns a redirect.

import { createRouter } from '@bquery/bquery/router';
import { signal } from '@bquery/bquery/reactive';

export const session = signal<{ user: string } | null>(null);

export const router = createRouter({
  routes: [
    { path: '/', name: 'home' },
    { path: '/login', name: 'login' },
    {
      path: '/account',
      name: 'account',
      beforeEnter(to) {
        if (!session.value) return { name: 'login', query: { next: to.fullPath } };
      },
    },
  ],
});

Why it works. Guards run before navigation commits, so returning a redirect descriptor short-circuits without flicker. Use the 1.14.0 NavigationResult returned by router.pushResult() to know whether the navigation succeeded or was redirected.

Related

• Router guide
• Router — pushResult / replaceResult
• Longer worked example: Examples & Recipes — Protected routes