Auth config

Backoffice auth config can lazy-load the Relay operations it needs. This keeps the initial bundle smaller and keeps auth screens independent.

import {
  createBackofficeLazyValue,
  type BackofficeAuthConfig,
} from '@plumile/backoffice-react';

export const auth: BackofficeAuthConfig = {
  session: createBackofficeLazyValue(async () => {
    const { CurrentSessionQuery } = await import('../queries/CurrentSessionQuery.js');
    return { authStatusQuery: CurrentSessionQuery };
  }),
  login: createBackofficeLazyValue(async () => {
    const [{ LoginPageQuery }, { LoginMutation }] = await Promise.all([
      import('../queries/LoginPageQuery.js'),
      import('../mutations/LoginMutation.js'),
    ]);

    return {
      loginQuery: LoginPageQuery,
      loginMutation: LoginMutation,
    };
  }),
  logout: createBackofficeLazyValue(async () => {
    const { LogoutMutation } = await import('../mutations/LogoutMutation.js');
    return { logoutMutation: LogoutMutation };
  }),
};

Use the same pattern for optional flows such as MFA, passkeys, password reset, invitation acceptance, or email verification.