sitero 0.2.0 → 0.3.0

package/dist/src/cms/client/interfaces/pages/dashboard/website/inquiry/_id_/page.js

@@ -1,25 +1,26 @@
 "use client";
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
-import { Inbox } from 'lucide-react';
+import { Inbox, Trash2 } from 'lucide-react';
 import { useRouter, useParams } from 'next/navigation';
-import { CMS_PATHS } from '../../../../../../../../constants/paths/cms-paths.js';
-import '../../../../../../../../constants/paths/redirect.js';
-import { DATE_FORMAT_OPTIONS } from '../../../../../../../../constants/date.js';
-import '../../../../../../../../constants/cms-locale.js';
+import 'zod';
+import 'sonner';
 import 'react';
 import 'ua-parser-js';
 import '../../../../../../../../shared/client/react-query/client.js';
 import '@tanstack/react-query';
 import { useCommand } from '../../../../../../../../shared/client/react-query/use-command.js';
-import { useQuery } from '../../../../../../../../shared/client/react-query/use-query.js';
-import { PageHeader } from '../../../../../components/ui/blocks/page-header/page-header.js';
+import { useCmsQuery } from '../../../../../../infrastructure/operation-result/use-cms-query.js';
+import { CMS_PATHS } from '../../../../../../../../constants/paths/cms-paths.js';
+import '../../../../../../../../constants/paths/redirect.js';
+import { DATE_FORMAT_OPTIONS } from '../../../../../../../../constants/date.js';
+import '../../../../../../../../constants/cms-locale.js';
+import { PageHeaderLayout } from '../../../../../components/ui/blocks/page-header/page-header-layout.js';
 import '@radix-ui/react-avatar';
 import 'mime-types';
 import 'sitero-domain';
 import 'clsx';
 import 'tailwind-merge';
-import 'zod';
 import '../../../../../components/shadcn/badge.js';
 import '../../../../../components/shadcn/button.js';
 import '@radix-ui/react-collapsible';
@@ -32,17 +33,22 @@ import '@radix-ui/react-select';
 import '@radix-ui/react-separator';
 import '../../../../../components/shadcn/sidebar/sidebar.js';
 import 'next-themes';
-import 'sonner';
 import '@radix-ui/react-tabs';
 import '@radix-ui/react-tooltip';
+import { ActionButton } from '../../../../../components/ui/buttons/action-button.js';
+import 'next/link';
+import { ReturnButton } from '../../../../../components/ui/buttons/return-button.js';
 import { Field } from '../../../../../components/ui/form/field.js';
 import { FieldBody } from '../../../../../components/ui/form/field-body.js';
 import { FieldsContainer } from '../../../../../components/ui/form/containers/fields-container.js';
 import { MainFields } from '../../../../../components/ui/form/containers/main-fields.js';
 import { SideFields } from '../../../../../components/ui/form/containers/side-fields.js';
+import '../../../../../components/ui/inputs/input.js';
+import '../../../../../components/ui/inputs/textarea.js';
+import '../../../../../components/ui/inputs/switch-input.js';
+import '../../../../../components/ui/inputs/password-input.js';
 import '../../../../../../infrastructure/admin-session/admin-context.js';
 import 'intor/next';
-import 'next/link';
 import { ContentContainer } from '../../../../../components/ui/layouts/content-container.js';
 
 function createInquiryShowPage({
@@ -58,31 +64,40 @@ function createInquiryShowPage({
       data: inquiry,
       isFetching,
       isNotFound
-    } = useQuery(() => inquiryFindAction({ id }), ["inquiryFindAction", id], {
-      select: (data) => data?.inquiry
-    });
+    } = useCmsQuery(
+      () => inquiryFindAction({ id }),
+      ["inquiryFindAction", id],
+      {
+        select: (data) => data?.inquiry
+      }
+    );
     const { execute, isRedirecting } = useCommand(
       () => inquiryDeleteAction({ id }),
       { onSuccess: () => router.replace(CMS_PATHS.website.inquiry.pathname) }
     );
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
-        PageHeader,
+        PageHeaderLayout,
         {
-          variant: "show",
+          navigation: /* @__PURE__ */ jsx(ReturnButton, { pushToParent: true }),
           titleProps: {
             icon: Inbox,
             title: t("resources.inquiry.text")
           },
-          destroyButtonProps: {
-            onClick: () => {
-              if (!confirm(t("ui.dialog.confirm.text"))) return;
-              void execute();
-            },
-            isLoading: isRedirecting
-          },
-          isDisabled: isFetching,
-          isNotFound
+          actions: /* @__PURE__ */ jsx(
+            ActionButton,
+            {
+              variant: "destructive",
+              icon: Trash2,
+              onClick: () => {
+                if (!confirm(t("ui.dialog.confirm.text"))) return;
+                void execute();
+              },
+              isLoading: isRedirecting,
+              isDisabled: isFetching,
+              children: t("ui.destroy.text")
+            }
+          )
         }
       ),
       /* @__PURE__ */ jsx(ContentContainer, { isNotFound, children: /* @__PURE__ */ jsxs(FieldsContainer, { children: [

package/dist/src/cms/client/interfaces/pages/dashboard/website/inquiry/page.js

@@ -2,17 +2,19 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
 import { Inbox } from 'lucide-react';
-import { PageHeader } from '../../../../components/ui/blocks/page-header/page-header.js';
+import { CMS_PATHS } from '../../../../../../../constants/paths/cms-paths.js';
+import '../../../../../../../constants/paths/redirect.js';
+import '../../../../../../../constants/cms-locale.js';
+import { PageHeaderLayout } from '../../../../components/ui/blocks/page-header/page-header-layout.js';
 import 'react';
-import '@radix-ui/react-avatar';
-import 'mime-types';
-import 'sitero-domain';
 import 'ua-parser-js';
 import '../../../../../../../shared/client/react-query/client.js';
 import '@tanstack/react-query';
+import '@radix-ui/react-avatar';
+import 'mime-types';
+import 'sitero-domain';
 import 'clsx';
 import 'tailwind-merge';
-import 'zod';
 import '../../../../components/shadcn/badge.js';
 import '../../../../components/shadcn/button.js';
 import '@radix-ui/react-collapsible';
@@ -28,41 +30,43 @@ import 'next-themes';
 import 'sonner';
 import '@radix-ui/react-tabs';
 import '@radix-ui/react-tooltip';
-import 'next/navigation';
-import '../../../../../../../constants/paths/redirect.js';
-import '../../../../../../../constants/cms-locale.js';
+import 'next/link';
+import { ReturnButton } from '../../../../components/ui/buttons/return-button.js';
+import '../../../../components/ui/inputs/input.js';
+import '../../../../components/ui/inputs/textarea.js';
+import '../../../../components/ui/inputs/switch-input.js';
+import '../../../../components/ui/inputs/password-input.js';
 import '../../../../../infrastructure/admin-session/admin-context.js';
 import 'intor/next';
-import 'next/link';
+import 'zod';
+import 'next/navigation';
 import { ContentContainer } from '../../../../components/ui/layouts/content-container.js';
 
 function createInquiryIndexPage({
   inquiry: staticInquiry,
-  headField,
-  bodyFields,
+  primaryField,
+  detailFields,
   InquiryList
 }) {
   return function InquiryIndexPage() {
     const { t, locale } = useTranslator();
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
-        PageHeader,
+        PageHeaderLayout,
         {
-          variant: "index",
+          navigation: /* @__PURE__ */ jsx(ReturnButton, { href: CMS_PATHS.dashboard.pathname }),
           titleProps: {
             icon: Inbox,
             title: t("resources.inquiry.text")
-          },
-          returnButtonProps: { className: "hidden" }
+          }
         }
       ),
       /* @__PURE__ */ jsx(ContentContainer, { isFixHeight: true, children: /* @__PURE__ */ jsx(
         InquiryList,
         {
-          headFields: headField ? [headField] : [],
-          headComponent: (inquiry, key) => /* @__PURE__ */ jsx(TextList, { inquiry, fieldKey: key, locale }),
-          bodyFields: bodyFields ?? [],
-          bodyComponent: (inquiry, key) => /* @__PURE__ */ jsx(TextList, { inquiry, fieldKey: key, locale })
+          primaryField,
+          detailFields: detailFields ?? [],
+          renderField: (inquiry, key) => /* @__PURE__ */ jsx(TextList, { inquiry, fieldKey: key, locale })
         }
       ) })
     ] });
@@ -79,7 +83,7 @@ function createInquiryIndexPage({
         title,
         ": "
       ] }) }),
-      /* @__PURE__ */ jsx("p", { className: "truncate", children: inquiry?.[key] ?? "-" })
+      /* @__PURE__ */ jsx("p", { className: "truncate", children: inquiry[key] ?? "-" })
     ] });
   }
 }

package/dist/src/cms/client/interfaces/pages/dashboard/website/website-config/_slug_/edit/page.js

@@ -2,20 +2,21 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
 import { useParams } from 'next/navigation';
+import 'zod';
+import 'sonner';
 import 'react';
 import 'ua-parser-js';
 import '../../../../../../../../../shared/client/react-query/client.js';
 import '@tanstack/react-query';
-import { useQuery } from '../../../../../../../../../shared/client/react-query/use-query.js';
+import { useCmsQuery } from '../../../../../../../infrastructure/operation-result/use-cms-query.js';
 import { ConfigEditContent } from '../../../../../../components/resources/config/config-edit-content.js';
-import { PageHeader } from '../../../../../../components/ui/blocks/page-header/page-header.js';
+import { PageHeaderLayout } from '../../../../../../components/ui/blocks/page-header/page-header-layout.js';
 import 'lucide-react';
 import '@radix-ui/react-avatar';
 import 'mime-types';
 import 'sitero-domain';
 import 'clsx';
 import 'tailwind-merge';
-import 'zod';
 import '../../../../../../components/shadcn/badge.js';
 import '../../../../../../components/shadcn/button.js';
 import '@radix-ui/react-collapsible';
@@ -28,11 +29,16 @@ import '@radix-ui/react-select';
 import '@radix-ui/react-separator';
 import '../../../../../../components/shadcn/sidebar/sidebar.js';
 import 'next-themes';
-import 'sonner';
 import '@radix-ui/react-tabs';
 import '@radix-ui/react-tooltip';
+import 'next/link';
+import { ReturnButton } from '../../../../../../components/ui/buttons/return-button.js';
 import '../../../../../../../../../constants/paths/redirect.js';
 import '../../../../../../../../../constants/cms-locale.js';
+import '../../../../../../components/ui/inputs/input.js';
+import '../../../../../../components/ui/inputs/textarea.js';
+import '../../../../../../components/ui/inputs/switch-input.js';
+import '../../../../../../components/ui/inputs/password-input.js';
 
 function createWebsiteConfigEditPage({
   configs: staticConfigs,
@@ -42,8 +48,7 @@ function createWebsiteConfigEditPage({
   FileList,
   FileCard,
   Uploader,
-  I18nTextarea,
-  I18nArrayInput
+  webLocales
 }) {
   return function WebsiteConfigEditPage() {
     const { locale } = useTranslator();
@@ -53,18 +58,16 @@ function createWebsiteConfigEditPage({
       data: config,
       isFetching,
       isNotFound
-    } = useQuery(
+    } = useCmsQuery(
       () => configFindDetailAction({ slug }),
       ["configFindDetailAction", slug],
-      {
-        select: (data) => data?.config
-      }
+      { select: (data) => data?.config }
     );
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
-        PageHeader,
+        PageHeaderLayout,
         {
-          variant: "edit",
+          navigation: /* @__PURE__ */ jsx(ReturnButton, { useConfirm: true, replaceParent: true }),
           titleProps: {
             icon: staticConfigs[slug]?.icon,
             title: staticConfigs[slug]?.title[locale]
@@ -80,11 +83,10 @@ function createWebsiteConfigEditPage({
           isNotFound,
           useConfigUpdateFormData,
           configUpdateAction,
-          I18nTextarea,
-          I18nArrayInput,
           FileCard,
           FileList,
-          Uploader
+          Uploader,
+          webLocales
         }
       )
     ] });

package/dist/src/cms/client/interfaces/pages/dashboard/website/website-config/_slug_/page.js

@@ -1,21 +1,22 @@
 "use client";
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
-import { useParams } from 'next/navigation';
+import { Pen } from 'lucide-react';
+import { useParams, usePathname } from 'next/navigation';
+import 'zod';
+import 'sonner';
 import 'react';
 import 'ua-parser-js';
 import '../../../../../../../../shared/client/react-query/client.js';
 import '@tanstack/react-query';
-import { useQuery } from '../../../../../../../../shared/client/react-query/use-query.js';
+import { useCmsQuery } from '../../../../../../infrastructure/operation-result/use-cms-query.js';
 import { ConfigShowContent } from '../../../../../components/resources/config/config-show-content.js';
-import { PageHeader } from '../../../../../components/ui/blocks/page-header/page-header.js';
-import 'lucide-react';
+import { PageHeaderLayout } from '../../../../../components/ui/blocks/page-header/page-header-layout.js';
 import '@radix-ui/react-avatar';
 import 'mime-types';
 import 'sitero-domain';
 import 'clsx';
 import 'tailwind-merge';
-import 'zod';
 import '../../../../../components/shadcn/badge.js';
 import '../../../../../components/shadcn/button.js';
 import '@radix-ui/react-collapsible';
@@ -28,46 +29,57 @@ import '@radix-ui/react-select';
 import '@radix-ui/react-separator';
 import '../../../../../components/shadcn/sidebar/sidebar.js';
 import 'next-themes';
-import 'sonner';
 import '@radix-ui/react-tabs';
 import '@radix-ui/react-tooltip';
+import { LinkButton } from '../../../../../components/ui/buttons/link-button.js';
+import { ReturnButton } from '../../../../../components/ui/buttons/return-button.js';
+import 'next/link';
 import '../../../../../../../../constants/paths/redirect.js';
 import '../../../../../../../../constants/cms-locale.js';
+import '../../../../../components/ui/inputs/input.js';
+import '../../../../../components/ui/inputs/textarea.js';
+import '../../../../../components/ui/inputs/switch-input.js';
+import '../../../../../components/ui/inputs/password-input.js';
 
 function createWebsiteConfigShowPage({
   configs: staticConfigs,
   configFindDetailAction,
   FileCard,
-  I18nDisplay,
-  I18nArrayDisplay
+  webLocales
 }) {
   return function WebsiteConfigShowPage() {
-    const { locale } = useTranslator();
+    const { t, locale } = useTranslator();
     const { slug } = useParams();
+    const pathname = usePathname();
     const fields = staticConfigs[slug]?.fields;
     const {
       data: config,
       isFetching,
       isNotFound
-    } = useQuery(
+    } = useCmsQuery(
       () => configFindDetailAction({ slug }),
       ["configFindDetailAction", slug],
-      {
-        select: (data) => data?.config
-      }
+      { select: (data) => data?.config }
     );
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
-        PageHeader,
+        PageHeaderLayout,
         {
-          variant: "show",
+          navigation: /* @__PURE__ */ jsx(ReturnButton, { pushToParent: true }),
           titleProps: {
             icon: staticConfigs[slug]?.icon,
             title: staticConfigs[slug]?.title[locale]
           },
-          editButtonProps: {},
-          isDisabled: isFetching,
-          isNotFound
+          actions: /* @__PURE__ */ jsx(
+            LinkButton,
+            {
+              variant: "warning",
+              icon: Pen,
+              href: `${pathname}/edit`,
+              isDisabled: isFetching,
+              children: t("ui.edit.text")
+            }
+          )
         }
       ),
       /* @__PURE__ */ jsx(
@@ -77,9 +89,8 @@ function createWebsiteConfigShowPage({
           fields,
           isFetching,
           isNotFound,
-          I18nDisplay,
-          I18nArrayDisplay,
-          FileCard
+          FileCard,
+          webLocales
         }
       )
     ] });

package/dist/src/cms/client/interfaces/pages/dashboard/website/website-config/page.js

@@ -5,20 +5,19 @@ import { SlidersHorizontal } from 'lucide-react';
 import { CMS_PATHS } from '../../../../../../../constants/paths/cms-paths.js';
 import '../../../../../../../constants/paths/redirect.js';
 import '../../../../../../../constants/cms-locale.js';
+import 'mime-types';
+import 'sitero-domain';
 import 'react';
 import 'ua-parser-js';
 import '../../../../../../../shared/client/react-query/client.js';
 import '@tanstack/react-query';
 import { useQuery } from '../../../../../../../shared/client/react-query/use-query.js';
-import 'mime-types';
-import 'sitero-domain';
 import 'clsx';
 import 'tailwind-merge';
 import { ensureArray } from '../../../../../../../shared/utils/ensure-array.js';
 import { joinUrl } from '../../../../../../../shared/utils/join-url.js';
 import { normalizeUnorderedCacheKey } from '../../../../../../../shared/utils/normalize-unordered-cache-key.js';
-import 'zod';
-import { PageHeader } from '../../../../components/ui/blocks/page-header/page-header.js';
+import { PageHeaderLayout } from '../../../../components/ui/blocks/page-header/page-header-layout.js';
 import '@radix-ui/react-avatar';
 import '../../../../components/shadcn/badge.js';
 import '../../../../components/shadcn/button.js';
@@ -35,11 +34,17 @@ import 'next-themes';
 import 'sonner';
 import '@radix-ui/react-tabs';
 import '@radix-ui/react-tooltip';
-import 'next/navigation';
 import 'next/link';
+import { ReturnButton } from '../../../../components/ui/buttons/return-button.js';
+import '../../../../components/ui/inputs/input.js';
+import '../../../../components/ui/inputs/textarea.js';
+import '../../../../components/ui/inputs/switch-input.js';
+import '../../../../components/ui/inputs/password-input.js';
 import { FeatureCard } from '../../../../components/ui/cards/feature-card.js';
 import '../../../../../infrastructure/admin-session/admin-context.js';
 import 'intor/next';
+import 'zod';
+import 'next/navigation';
 import { ContentContainer } from '../../../../components/ui/layouts/content-container.js';
 
 function createWebsiteConfigPage({
@@ -56,8 +61,9 @@ function createWebsiteConfigPage({
     );
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
-        PageHeader,
+        PageHeaderLayout,
         {
+          navigation: /* @__PURE__ */ jsx(ReturnButton, { href: CMS_PATHS.dashboard.pathname }),
           titleProps: {
             icon: SlidersHorizontal,
             title: t("main.website-config.text")

package/dist/src/cms/client/interfaces/pages/dashboard/website/website-page/_slug_/edit/page.js

@@ -3,18 +3,19 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
 import { useParams } from 'next/navigation';
 import { POST_TYPES } from 'sitero-domain';
+import 'zod';
+import 'sonner';
 import 'react';
 import 'ua-parser-js';
 import '../../../../../../../../../shared/client/react-query/client.js';
 import '@tanstack/react-query';
-import { useQuery } from '../../../../../../../../../shared/client/react-query/use-query.js';
-import { PageHeader } from '../../../../../../components/ui/blocks/page-header/page-header.js';
+import { useCmsQuery } from '../../../../../../../infrastructure/operation-result/use-cms-query.js';
+import { PageHeaderLayout } from '../../../../../../components/ui/blocks/page-header/page-header-layout.js';
 import 'lucide-react';
 import '@radix-ui/react-avatar';
 import 'mime-types';
 import 'clsx';
 import 'tailwind-merge';
-import 'zod';
 import '../../../../../../components/shadcn/badge.js';
 import '../../../../../../components/shadcn/button.js';
 import '@radix-ui/react-collapsible';
@@ -27,11 +28,16 @@ import '@radix-ui/react-select';
 import '@radix-ui/react-separator';
 import '../../../../../../components/shadcn/sidebar/sidebar.js';
 import 'next-themes';
-import 'sonner';
 import '@radix-ui/react-tabs';
 import '@radix-ui/react-tooltip';
+import 'next/link';
+import { ReturnButton } from '../../../../../../components/ui/buttons/return-button.js';
 import '../../../../../../../../../constants/paths/redirect.js';
 import '../../../../../../../../../constants/cms-locale.js';
+import '../../../../../../components/ui/inputs/input.js';
+import '../../../../../../components/ui/inputs/textarea.js';
+import '../../../../../../components/ui/inputs/switch-input.js';
+import '../../../../../../components/ui/inputs/password-input.js';
 
 function createWebsitePageEditPage({
   pages: staticPages,
@@ -45,16 +51,16 @@ function createWebsitePageEditPage({
       data: page,
       isFetching,
       isNotFound
-    } = useQuery(
+    } = useCmsQuery(
       () => postFindDetailAction({ type: POST_TYPES.PAGE, slug }),
       ["postFindDetailAction", POST_TYPES.PAGE, slug],
       { select: (data) => data?.post }
     );
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
-        PageHeader,
+        PageHeaderLayout,
         {
-          variant: "edit",
+          navigation: /* @__PURE__ */ jsx(ReturnButton, { useConfirm: true, replaceParent: true }),
           titleProps: {
             icon: staticPages[slug]?.icon,
             title: staticPages[slug]?.title[locale]

package/dist/src/cms/client/interfaces/pages/dashboard/website/website-page/_slug_/page.js

@@ -1,20 +1,21 @@
 "use client";
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useTranslator } from 'intor/react';
-import { useParams } from 'next/navigation';
+import { SquareArrowOutUpRight, Pen } from 'lucide-react';
+import { useParams, usePathname } from 'next/navigation';
 import { POST_TYPES } from 'sitero-domain';
+import 'zod';
+import 'sonner';
 import 'react';
 import 'ua-parser-js';
 import '../../../../../../../../shared/client/react-query/client.js';
 import '@tanstack/react-query';
-import { useQuery } from '../../../../../../../../shared/client/react-query/use-query.js';
-import { PageHeader } from '../../../../../components/ui/blocks/page-header/page-header.js';
-import 'lucide-react';
+import { useCmsQuery } from '../../../../../../infrastructure/operation-result/use-cms-query.js';
+import { PageHeaderLayout } from '../../../../../components/ui/blocks/page-header/page-header-layout.js';
 import '@radix-ui/react-avatar';
 import 'mime-types';
 import 'clsx';
 import 'tailwind-merge';
-import 'zod';
 import '../../../../../components/shadcn/badge.js';
 import '../../../../../components/shadcn/button.js';
 import '@radix-ui/react-collapsible';
@@ -27,14 +28,18 @@ import '@radix-ui/react-select';
 import '@radix-ui/react-separator';
 import '../../../../../components/shadcn/sidebar/sidebar.js';
 import 'next-themes';
-import 'sonner';
 import '@radix-ui/react-tabs';
 import '@radix-ui/react-tooltip';
+import { LinkButton } from '../../../../../components/ui/buttons/link-button.js';
+import { ExternalLinkButton } from '../../../../../components/ui/buttons/external-link-button.js';
+import { ReturnButton } from '../../../../../components/ui/buttons/return-button.js';
+import 'next/link';
 import '../../../../../../../../constants/paths/redirect.js';
 import '../../../../../../../../constants/cms-locale.js';
-import 'next/link';
-import { ExternalLink } from '../../../../../components/ui/features/external-link.js';
-import 'next/image';
+import '../../../../../components/ui/inputs/input.js';
+import '../../../../../components/ui/inputs/textarea.js';
+import '../../../../../components/ui/inputs/switch-input.js';
+import '../../../../../components/ui/inputs/password-input.js';
 
 function createWebsitePageShowPage({
   pages: staticPages,
@@ -43,28 +48,39 @@ function createWebsitePageShowPage({
   renderPostShowContent
 }) {
   return function WebsitePageShowPage() {
-    const { locale } = useTranslator();
+    const { t, locale } = useTranslator();
     const { slug } = useParams();
+    const pathname = usePathname();
     const {
       data: page,
       isFetching,
       isNotFound
-    } = useQuery(
+    } = useCmsQuery(
       () => postFindDetailAction({ type: POST_TYPES.PAGE, slug }),
       ["postFindDetailAction", POST_TYPES.PAGE, slug],
       { select: (data) => data?.post }
     );
+    const websiteHref = `/${slug === "home" ? "" : slug}`;
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
-        PageHeader,
+        PageHeaderLayout,
         {
-          variant: "show",
+          navigation: /* @__PURE__ */ jsx(ReturnButton, { pushToParent: true }),
           titleProps: {
             icon: staticPages[slug]?.icon,
             title: staticPages[slug]?.title[locale]
           },
-          editButtonProps: {},
-          rightChildren: /* @__PURE__ */ jsxs("div", { className: "flex-center gap-2", children: [
+          actions: /* @__PURE__ */ jsx(
+            LinkButton,
+            {
+              variant: "warning",
+              icon: Pen,
+              href: `${pathname}/edit`,
+              isDisabled: isFetching,
+              children: t("ui.edit.text")
+            }
+          ),
+          utilities: /* @__PURE__ */ jsxs("div", { className: "flex-center gap-2", children: [
             /* @__PURE__ */ jsx(
               SeoMetadataDialog,
               {
@@ -73,10 +89,17 @@ function createWebsitePageShowPage({
                 isDisabled: isNotFound
               }
             ),
-            /* @__PURE__ */ jsx(ExternalLink, { href: `/${slug === "home" ? "" : slug}` })
-          ] }),
-          isDisabled: isFetching,
-          isNotFound
+            websiteHref && /* @__PURE__ */ jsx(
+              ExternalLinkButton,
+              {
+                href: websiteHref,
+                variant: "outline",
+                size: "icon",
+                icon: SquareArrowOutUpRight,
+                "aria-label": t("ui.view-website-page.text")
+              }
+            )
+          ] })
         }
       ),
       renderPostShowContent({ page, isFetching, isNotFound })