From 55549219ff67c725b50ee29d2fc74c6bca362908 Mon Sep 17 00:00:00 2001
From: DCCONSTRUCTIONS <dcconstructions@MacBook-Pro-DCCONSTRUCTIONS-2.local>
Date: Wed, 22 Apr 2026 19:44:27 +0300
Subject: [PATCH] =?UTF-8?q?UI=20-=20=D0=9C=D0=95=D0=96=D0=9F=D0=A0=D0=9E?=
 =?UTF-8?q?=D0=95=D0=9A=D0=A2=D0=9D=D0=90=D0=AF=20=D0=9A=D0=9E=D0=9C=D0=9C?=
 =?UTF-8?q?=D0=A3=D0=9D=D0=98=D0=9A=D0=90=D0=A6=D0=98=D0=AF:=20=D0=BA?=
 =?UTF-8?q?=D0=B0=D0=BD=D0=BE=D0=BD=D0=B8=D0=B7=D0=B0=D1=86=D0=B8=D1=8F=20?=
 =?UTF-8?q?breadcrumb=20=D0=B8=20CTA=20=D0=BD=D0=B0=20=D1=8D=D0=BA=D1=80?=
 =?UTF-8?q?=D0=B0=D0=BD=D0=B5=20=D1=81=D1=82=D1=80=D0=B0=D0=BD=D0=B8=D1=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../[projectId]/pages/(detail)/header.tsx     | 16 ++++------
 .../[projectId]/pages/(list)/header.tsx       | 30 ++++++++-----------
 .../[projectId]/pages/(list)/page.tsx         |  2 +-
 .../i18n/src/locales/en/translations.ts       |  1 +
 .../i18n/src/locales/ru/translations.ts       |  1 +
 5 files changed, 22 insertions(+), 28 deletions(-)

diff --git a/plane-src/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx b/plane-src/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx
index 271d0a1..433f63b 100644
--- a/plane-src/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx
+++ b/plane-src/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx
@@ -7,12 +7,11 @@
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // plane imports
+import { EProjectFeatureKey } from "@plane/constants";
 import { PageIcon } from "@plane/propel/icons";
 import type { ICustomSearchSelectOption } from "@plane/types";
 import { Breadcrumbs, Header, BreadcrumbNavigationSearchDropdown } from "@plane/ui";
 import { getPageName } from "@plane/utils";
-// components
-import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
 import { PageAccessIcon } from "@/components/common/page-access-icon";
 import { SwitcherIcon, SwitcherLabel } from "@/components/common/switcher-label";
 import { PageHeaderActions } from "@/components/pages/header/actions";
@@ -22,6 +21,7 @@ import { useProject } from "@/hooks/store/use-project";
 import { useAppRouter } from "@/hooks/use-app-router";
 // plane web imports
 import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common";
+import { ProjectFeatureBreadcrumb } from "@/plane-web/components/breadcrumbs/project-feature";
 import { PageDetailsHeaderExtraActions } from "@/plane-web/components/pages";
 import { EPageStoreType, usePage, usePageStore } from "@/plane-web/hooks/store";
 
@@ -70,14 +70,10 @@ export const PageDetailsHeader = observer(function PageDetailsHeader() {
         <div>
           <Breadcrumbs isLoading={loader === "init-loader"}>
             <CommonProjectBreadcrumbs workspaceSlug={workspaceSlug?.toString()} projectId={projectId?.toString()} />
-            <Breadcrumbs.Item
-              component={
-                <BreadcrumbLink
-                  label="Pages"
-                  href={`/${workspaceSlug}/projects/${projectId}/pages/`}
-                  icon={<PageIcon className="h-4 w-4 text-tertiary" />}
-                />
-              }
+            <ProjectFeatureBreadcrumb
+              workspaceSlug={workspaceSlug?.toString()}
+              projectId={projectId?.toString()}
+              featureKey={EProjectFeatureKey.PAGES}
             />
 
             <Breadcrumbs.Item
diff --git a/plane-src/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx b/plane-src/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx
index e76f55b..1ccfb26 100644
--- a/plane-src/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx
+++ b/plane-src/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx
@@ -8,25 +8,26 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 import { useParams, useRouter, useSearchParams } from "next/navigation";
 // constants
-import { EPageAccess } from "@plane/constants";
+import { EPageAccess, EProjectFeatureKey } from "@plane/constants";
+import { useTranslation } from "@plane/i18n";
 // plane types
-import { Button } from "@plane/propel/button";
-import { PageIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TPage } from "@plane/types";
 // plane ui
 import { Breadcrumbs, Header } from "@plane/ui";
-// helpers
-import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
+// components
+import { AppHeaderPrimaryActionButton } from "@/components/core/app-header/primary-action-button";
 // hooks
 import { useProject } from "@/hooks/store/use-project";
 // plane web imports
 import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common";
+import { ProjectFeatureBreadcrumb } from "@/plane-web/components/breadcrumbs/project-feature";
 import { EPageStoreType, usePageStore } from "@/plane-web/hooks/store";
 
 export const PagesListHeader = observer(function PagesListHeader() {
   // states
   const [isCreatingPage, setIsCreatingPage] = useState(false);
+  const { t } = useTranslation();
   // router
   const router = useRouter();
   const { workspaceSlug, projectId } = useParams();
@@ -63,24 +64,19 @@ export const PagesListHeader = observer(function PagesListHeader() {
       <Header.LeftItem>
         <Breadcrumbs isLoading={loader === "init-loader"}>
           <CommonProjectBreadcrumbs workspaceSlug={workspaceSlug?.toString()} projectId={projectId?.toString()} />
-          <Breadcrumbs.Item
-            component={
-              <BreadcrumbLink
-                label="Pages"
-                href={`/${workspaceSlug}/projects/${currentProjectDetails?.id}/pages/`}
-                icon={<PageIcon className="h-4 w-4 text-tertiary" />}
-                isLast
-              />
-            }
+          <ProjectFeatureBreadcrumb
+            workspaceSlug={workspaceSlug?.toString()}
+            projectId={projectId?.toString()}
+            featureKey={EProjectFeatureKey.PAGES}
             isLast
           />
         </Breadcrumbs>
       </Header.LeftItem>
       {canCurrentUserCreatePage && (
         <Header.RightItem>
-          <Button variant="primary" size="lg" onClick={handleCreatePage} loading={isCreatingPage}>
-            {isCreatingPage ? "Adding" : "Add page"}
-          </Button>
+          <AppHeaderPrimaryActionButton onClick={handleCreatePage} loading={isCreatingPage}>
+            {isCreatingPage ? t("creating") : t("app_header.add_page")}
+          </AppHeaderPrimaryActionButton>
         </Header.RightItem>
       )}
     </Header>
diff --git a/plane-src/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/page.tsx b/plane-src/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/page.tsx
index e5e1de9..4071f4d 100644
--- a/plane-src/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/page.tsx
+++ b/plane-src/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/page.tsx
@@ -49,7 +49,7 @@ function ProjectPagesPage({ params }: Route.ComponentProps) {
   const { allowPermissions } = useUserPermissions();
   // derived values
   const project = getProjectById(projectId);
-  const pageTitle = project?.name ? `${project?.name} - Pages` : undefined;
+  const pageTitle = project?.name ? `${project?.name} - ${t("sidebar.pages")}` : undefined;
   const canPerformEmptyStateActions = allowPermissions([EUserProjectRoles.ADMIN], EUserPermissionsLevel.PROJECT);
   const resolvedPath = resolvedTheme === "light" ? lightPagesAsset : darkPagesAsset;
   const pageType = getPageType(type);
diff --git a/plane-src/packages/i18n/src/locales/en/translations.ts b/plane-src/packages/i18n/src/locales/en/translations.ts
index 61212ae..cda724d 100644
--- a/plane-src/packages/i18n/src/locales/en/translations.ts
+++ b/plane-src/packages/i18n/src/locales/en/translations.ts
@@ -511,6 +511,7 @@ export default {
   add_work_item: "Add work item",
   app_header: {
     add_task: "Add task",
+    add_page: "Add page",
   },
   advanced_description_placeholder: "Press '/' for commands",
   create_work_item: "Create work item",
diff --git a/plane-src/packages/i18n/src/locales/ru/translations.ts b/plane-src/packages/i18n/src/locales/ru/translations.ts
index f1f3183..7984375 100644
--- a/plane-src/packages/i18n/src/locales/ru/translations.ts
+++ b/plane-src/packages/i18n/src/locales/ru/translations.ts
@@ -667,6 +667,7 @@ export default {
   add_work_item: "Добавить рабочий элемент",
   app_header: {
     add_task: "Добавить задачу",
+    add_page: "Добавить страницу",
   },
   advanced_description_placeholder: "Нажмите '/' для команд",
   create_work_item: "Создать рабочий элемент",