page

Use page to show a page the merchant wrote in the dashboard.

import { page } from '@salla.sa/twilight-theme-engine/api/page';

loader: async ({ params }) => {
  const data = await page.findOrThrow(params.id);
  return { title: data.name, content: data.content };
},

import { useSuspenseQuery } from '@tanstack/react-query';
import { page } from '@salla.sa/twilight-theme-engine/api/page';

export function AboutText() {
  const { data } = useSuspenseQuery(page.queries.detail('about-us'));

  return <div dangerouslySetInnerHTML={{ __html: data.content ?? '' }} />;
}

MethodsCopy Anchor Link

The result has id, name, url, content, metadata and created_at.

QueriesCopy Anchor Link

The key includes neither the locale nor the active scope. Page text is language-specific, so add the locale to your own key if the language can change without a reload.

GotchasCopy Anchor Link

• find does not default a missing data: you get undefined at runtime.
• findOrThrow turns a 404 or 410 into a not-found page and rethrows other errors.
• queries.detail calls find, so a failing fetch rejects with the raw HTTPError.

See alsoCopy Anchor Link

• Custom page route
• Errors, timeouts and retries