Components

DomainTables

constant

declare const DomainTables: ({ filter, setFilter }: DomainTablesProps) => JSX.Element;

Creates a tables for the current GraphQL schema with cross-linked relations. It is meant for small and medium sized domains and most likely will not be good if the domain is too large.

DomainTablesProps

type

type DomainTablesProps = {
  filter: string;
  setFilter: (filter: string) => void;
};

ErrorBoundary

class

class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState>

Renders config().errorView in place of a subtree that threw while rendering.

startup() puts one around the view it renders, so a view that throws takes down its own page and not the browser tab. An application rendering into the root itself – swapping views without a page load – wraps its own render the same way.

A boundary keeps showing the error it caught, which is what makes it a boundary and not a retry. Give it a key that changes with what is rendered below it, e.g. the route, and React discards the failed instance along with its error:

<ErrorBoundary key={ routeOf(location.pathname) }>
    <View/>
</ErrorBoundary>

A class, because getDerivedStateFromError has no hook equivalent – error boundaries are the one part of React that still requires one.

ErrorBoundary.state

state: ErrorBoundaryState;

ErrorBoundary.getDerivedStateFromError

static getDerivedStateFromError(error: unknown): ErrorBoundaryState;

ErrorBoundary.render

render(): ReactNode;

ErrorBoundaryProps

type

type ErrorBoundaryProps = {
  children: ReactNode;
};

ErrorViewProps

type

type ErrorViewProps = {
  /**
   * The error QLive could not carry on from. Typed as unknown because that is what a `catch` binding and a
   * React error boundary both hand on -- everything QLive throws itself is an Error.
   */
  error: unknown;
};

What an error view is handed.

Logout()

function

declare function Logout({ children, variant, className }: LogoutProps): JSX.Element;

Logs the current user out.

A form, not a link: /logout is Spring Security’s default logout endpoint and, like every state-changing request the application does not explicitly exempt, it demands the CSRF token this component carries as a hidden field – the same way the login form on the login page carries it. variant="link" only changes how the submit button is styled, not what it is – a button inside a form, so it keeps working with keyboard activation and without JavaScript.

LogoutProps

type

type LogoutProps = {
  /**
   * Rendered inside the submit button. Defaults to "Logout".
   */
  children?: ReactNode;
  /**
   * "button" renders the submit as a normal button, "link" makes it look like the surrounding text's
   * anchors instead -- for a nav bar or a sentence where a boxed button would stand out for no reason.
   * Ignored once `className` is given explicitly.
   */
  variant?: "button" | "link";
  /**
   * Overrides the class the variant would otherwise pick.
   */
  className?: string;
};

QuickLogin()

function

declare function QuickLogin({ users, url, rememberMeParameter }: QuickLoginProps): JSX.Element;

Shows who a page is being served to and offers to become one of a fixed list of other users in a single click, without going through the login page.

Built for a development home page, not a production one: it round-trips a plaintext password with every click, which is only ever fine for accounts nobody needs to keep secret. Posted with fetch() rather than a native form submit, and on success the page reloads itself instead of following Spring Security’s configured success URL – the point of a one-click switch is staying where you were and seeing it take effect, not being carried off to wherever a real login lands.

QuickLoginProps

type

type QuickLoginProps = {
  /**
   * Accounts offered as one-click switches. The framework has no accounts of its own to suggest -- an
   * application names them, which is also what keeps a real one from shipping this with anything in it.
   */
  users: QuickLoginUser[];
  /**
   * Where the switch posts to. Left at Spring Security's default login-processing URL, "/login", which is
   * what formLogin() answers to whether or not an application customizes loginPage().
   */
  url?: string;
  /**
   * Name of the parameter asking for a remember-me login, `null` for a login that ends with the session.
   * Default "remember-me", Spring Security's default. Remembered, a switch survives a restart of the
   * development server, which forgets every session it held.
   */
  rememberMeParameter?: string | null;
};

PropTypes for the QuickLogin component

QuickLoginUser

type

type QuickLoginUser = {
  /**
   * login
   */
  login: string;
  /**
   * Clear text password
   */
  password: string;
};

A quick login account