diff --git a/openmetadata-ui-core-components/src/main/resources/ui/package.json b/openmetadata-ui-core-components/src/main/resources/ui/package.json
index b398ddfb1d96..669ab219c816 100644
--- a/openmetadata-ui-core-components/src/main/resources/ui/package.json
+++ b/openmetadata-ui-core-components/src/main/resources/ui/package.json
@@ -75,7 +75,9 @@
   "author": "OpenMetadata",
   "license": "Apache-2.0",
   "dependencies": {
-    "@material/material-color-utilities": "^0.3.0"
+    "@material/material-color-utilities": "^0.3.0",
+    "@untitledui/file-icons": "^0.0.9",
+    "motion": "^12.38.0"
   },
   "peerDependencies": {
     "@emotion/react": ">=11.0.0",
diff --git a/openmetadata-ui-core-components/src/main/resources/ui/src/components/application/file-upload/file-upload.tsx b/openmetadata-ui-core-components/src/main/resources/ui/src/components/application/file-upload/file-upload.tsx
index 09462d8a8b5c..c66230c0c1f9 100644
--- a/openmetadata-ui-core-components/src/main/resources/ui/src/components/application/file-upload/file-upload.tsx
+++ b/openmetadata-ui-core-components/src/main/resources/ui/src/components/application/file-upload/file-upload.tsx
@@ -15,12 +15,19 @@
  *  Source: https://github.com/untitleduico/react/blob/main/components/application/file-upload/file-upload-base.tsx
  */
 
-import { UploadCloud02 } from '@untitledui/icons';
-import type { DragEvent, ChangeEvent } from 'react';
-import { useId, useRef, useState } from 'react';
 import { Button } from '@/components/base/buttons/button';
+import { ButtonUtility } from '@/components/base/buttons/button-utility';
+import { ProgressBar } from '@/components/base/progress-indicators/progress-indicators';
 import { FeaturedIcon } from '@/components/foundations/featured-icon/featured-icon';
 import { cx } from '@/utils/cx';
+import {
+  CheckCircle,
+  Trash01,
+  UploadCloud02,
+  XCircle,
+} from '@untitledui/icons';
+import type { ChangeEvent, ComponentPropsWithRef, DragEvent } from 'react';
+import { useId, useRef, useState } from 'react';
 
 export const getReadableFileSize = (bytes: number): string => {
   if (bytes === 0) {
@@ -240,3 +247,236 @@ export const FileUploadDropZone = ({
 };
 
 FileUploadDropZone.displayName = 'FileUploadDropZone';
+
+export interface FileListItemProps {
+  name: string;
+  size: number;
+  progress: number;
+  failed?: boolean;
+  className?: string;
+  completeLabel?: string;
+  uploadingLabel?: string;
+  failedLabel?: string;
+  tryAgainLabel?: string;
+  deleteLabel?: string;
+  onDelete?: () => void;
+  onRetry?: () => void;
+}
+
+export const FileListItemProgressBar = ({
+  className,
+  completeLabel = 'Complete',
+  deleteLabel = 'Delete',
+  failed,
+  failedLabel = 'Failed',
+  name,
+  onDelete,
+  onRetry,
+  progress,
+  size,
+  tryAgainLabel = 'Try again',
+  uploadingLabel = 'Uploading...',
+}: FileListItemProps) => {
+  const isComplete = progress === 100;
+
+  return (
+    <li
+      className={cx(
+        'tw:relative tw:flex tw:gap-3 tw:rounded-xl tw:bg-primary tw:p-4 tw:ring-1 tw:ring-secondary tw:transition-shadow tw:duration-100 tw:ease-linear tw:ring-inset',
+        failed && 'tw:ring-2 tw:ring-error',
+        className
+      )}>
+      <div className="tw:flex tw:size-10 tw:shrink-0 tw:items-center tw:justify-center tw:rounded-lg tw:bg-secondary">
+        <UploadCloud02
+          className="tw:size-5 tw:text-tertiary"
+          strokeWidth={1.5}
+        />
+      </div>
+
+      <div className="tw:flex tw:min-w-0 tw:flex-1 tw:flex-col tw:items-start">
+        <div className="tw:flex tw:w-full tw:min-w-0 tw:max-w-full tw:flex-1">
+          <div className="tw:min-w-0 tw:flex-1">
+            <p className="tw:truncate tw:text-sm tw:font-medium tw:text-secondary">
+              {name}
+            </p>
+            <div className="tw:mt-0.5 tw:flex tw:items-center tw:gap-2">
+              <p className="tw:truncate tw:whitespace-nowrap tw:text-sm tw:text-tertiary">
+                {getReadableFileSize(size)}
+              </p>
+              <hr className="tw:h-3 tw:w-px tw:rounded-full tw:border-none tw:bg-border-primary" />
+              <div className="tw:flex tw:items-center tw:gap-1">
+                {isComplete && !failed && (
+                  <>
+                    <CheckCircle className="tw:size-4 tw:stroke-[2.5px] tw:text-fg-success-primary" />
+                    <p className="tw:text-sm tw:font-medium tw:text-success-primary">
+                      {completeLabel}
+                    </p>
+                  </>
+                )}
+                {!isComplete && !failed && (
+                  <>
+                    <UploadCloud02 className="tw:size-4 tw:stroke-[2.5px] tw:text-fg-quaternary" />
+                    <p className="tw:text-sm tw:font-medium tw:text-quaternary">
+                      {uploadingLabel}
+                    </p>
+                  </>
+                )}
+                {failed && (
+                  <>
+                    <XCircle className="tw:size-4 tw:text-fg-error-primary" />
+                    <p className="tw:text-sm tw:font-medium tw:text-error-primary">
+                      {failedLabel}
+                    </p>
+                  </>
+                )}
+              </div>
+            </div>
+          </div>
+          <ButtonUtility
+            className="tw:-mr-2 tw:-mt-2 tw:self-start"
+            color="tertiary"
+            icon={Trash01}
+            size="xs"
+            tooltip={deleteLabel}
+            onClick={onDelete}
+          />
+        </div>
+
+        {!failed && (
+          <div className="tw:mt-1 tw:w-full">
+            <ProgressBar
+              labelPosition="right"
+              max={100}
+              min={0}
+              value={progress}
+            />
+          </div>
+        )}
+
+        {failed && (
+          <Button
+            className="tw:mt-1.5"
+            color="link-destructive"
+            size="sm"
+            onClick={onRetry}>
+            {tryAgainLabel}
+          </Button>
+        )}
+      </div>
+    </li>
+  );
+};
+
+export const FileListItemProgressFill = ({
+  className,
+  deleteLabel = 'Delete',
+  failed,
+  failedLabel = 'Upload failed, please try again',
+  name,
+  onDelete,
+  onRetry,
+  progress,
+  size,
+  tryAgainLabel = 'Try again',
+}: FileListItemProps) => {
+  const isComplete = progress === 100;
+
+  return (
+    <li
+      className={cx(
+        'tw:relative tw:flex tw:gap-3 tw:overflow-hidden tw:rounded-xl tw:bg-primary tw:p-4',
+        className
+      )}>
+      <div
+        aria-valuemax={100}
+        aria-valuemin={0}
+        aria-valuenow={progress}
+        className={cx(
+          'tw:absolute tw:inset-0 tw:size-full tw:bg-secondary tw:transition tw:duration-75 tw:ease-linear',
+          isComplete && 'tw:opacity-0'
+        )}
+        role="progressbar"
+        style={{ transform: `translateX(-${100 - progress}%)` }}
+      />
+      <div
+        className={cx(
+          'tw:absolute tw:inset-0 tw:size-full tw:rounded-[inherit] tw:ring-1 tw:ring-secondary tw:transition tw:duration-100 tw:ease-linear tw:ring-inset',
+          failed && 'tw:ring-2 tw:ring-error'
+        )}
+      />
+      <div className="tw:relative tw:flex tw:size-10 tw:shrink-0 tw:items-center tw:justify-center tw:rounded-lg tw:bg-secondary">
+        <UploadCloud02
+          className="tw:size-5 tw:text-tertiary"
+          strokeWidth={1.5}
+        />
+      </div>
+
+      <div className="tw:relative tw:flex tw:min-w-0 tw:flex-1">
+        <div className="tw:relative tw:flex tw:min-w-0 tw:flex-1 tw:flex-col tw:items-start">
+          <div className="tw:w-full tw:min-w-0 tw:flex-1">
+            <p className="tw:truncate tw:text-sm tw:font-medium tw:text-secondary">
+              {name}
+            </p>
+            <div className="tw:mt-0.5 tw:flex tw:items-center tw:gap-2">
+              <p className="tw:text-sm tw:text-tertiary">
+                {failed ? failedLabel : getReadableFileSize(size)}
+              </p>
+              {!failed && (
+                <>
+                  <hr className="tw:h-3 tw:w-px tw:rounded-full tw:border-none tw:bg-border-primary" />
+                  <div className="tw:flex tw:items-center tw:gap-1">
+                    {isComplete ? (
+                      <CheckCircle className="tw:size-4 tw:stroke-[2.5px] tw:text-fg-success-primary" />
+                    ) : (
+                      <UploadCloud02 className="tw:size-4 tw:stroke-[2.5px] tw:text-fg-quaternary" />
+                    )}
+                    <p className="tw:text-sm tw:text-tertiary">{progress}%</p>
+                  </div>
+                </>
+              )}
+            </div>
+          </div>
+          {failed && (
+            <Button
+              className="tw:mt-1.5"
+              color="link-destructive"
+              size="sm"
+              onClick={onRetry}>
+              {tryAgainLabel}
+            </Button>
+          )}
+        </div>
+        <ButtonUtility
+          className="tw:-mr-2 tw:-mt-2 tw:self-start"
+          color="tertiary"
+          icon={Trash01}
+          size="xs"
+          tooltip={deleteLabel}
+          onClick={onDelete}
+        />
+      </div>
+    </li>
+  );
+};
+
+const FileUploadRoot = (props: ComponentPropsWithRef<'div'>) => (
+  <div
+    {...props}
+    className={cx('tw:flex tw:flex-col tw:gap-4', props.className)}
+  />
+);
+
+const FileUploadList = (props: ComponentPropsWithRef<'ul'>) => (
+  <ul
+    {...props}
+    className={cx('tw:flex tw:flex-col tw:gap-3', props.className)}
+  />
+);
+
+export const FileUpload = {
+  DropZone: FileUploadDropZone,
+  List: FileUploadList,
+  ListItemProgressBar: FileListItemProgressBar,
+  ListItemProgressFill: FileListItemProgressFill,
+  Root: FileUploadRoot,
+};
diff --git a/openmetadata-ui-core-components/src/main/resources/ui/src/components/foundations/dot-icon.tsx b/openmetadata-ui-core-components/src/main/resources/ui/src/components/foundations/dot-icon.tsx
index 11b1b91aeac7..04bf658e5301 100644
--- a/openmetadata-ui-core-components/src/main/resources/ui/src/components/foundations/dot-icon.tsx
+++ b/openmetadata-ui-core-components/src/main/resources/ui/src/components/foundations/dot-icon.tsx
@@ -1,6 +1,11 @@
 import type { HTMLAttributes } from 'react';
 
 const sizes = {
+  xs: {
+    wh: 6,
+    c: 3,
+    r: 2,
+  },
   sm: {
     wh: 8,
     c: 4,
@@ -16,7 +21,7 @@ const sizes = {
 export const Dot = ({
   size = 'md',
   ...props
-}: HTMLAttributes<HTMLOrSVGElement> & { size?: 'sm' | 'md' }) => {
+}: HTMLAttributes<HTMLOrSVGElement> & { size?: 'sm' | 'md' | 'xs' }) => {
   return (
     <svg
       fill="none"
diff --git a/openmetadata-ui-core-components/src/main/resources/ui/yarn.lock b/openmetadata-ui-core-components/src/main/resources/ui/yarn.lock
index 1c4346139b4e..0d882663e364 100644
--- a/openmetadata-ui-core-components/src/main/resources/ui/yarn.lock
+++ b/openmetadata-ui-core-components/src/main/resources/ui/yarn.lock
@@ -2968,6 +2968,11 @@
     "@typescript-eslint/types" "8.57.1"
     eslint-visitor-keys "^5.0.0"
 
+"@untitledui/file-icons@^0.0.9":
+  version "0.0.9"
+  resolved "https://registry.yarnpkg.com/@untitledui/file-icons/-/file-icons-0.0.9.tgz#5f2d25bde9bcdecb4efff00a775009caf14a4ce5"
+  integrity sha512-wz3btNnSSv2hTujgyxEFL21oyjPtGTj3osU8ZEMe8nwdlmLQEILLe96NMg9b1ciiOC5UOWNDeYIt7IfxEM6qtg==
+
 "@untitledui/icons@^0.0.21":
   version "0.0.21"
   resolved "https://registry.npmjs.org/@untitledui/icons/-/icons-0.0.21.tgz"
@@ -4121,6 +4126,15 @@ foreground-child@^3.1.0:
     cross-spawn "^7.0.6"
     signal-exit "^4.0.1"
 
+framer-motion@^12.38.0:
+  version "12.38.0"
+  resolved "https://registry.yarnpkg.com/framer-motion/-/framer-motion-12.38.0.tgz#cf28e072a95942881ca4e33fd33be41192fd146b"
+  integrity sha512-rFYkY/pigbcswl1XQSb7q424kSTQ8q6eAC+YUsSKooHQYuLdzdHjrt6uxUC+PRAO++q5IS7+TamgIw1AphxR+g==
+  dependencies:
+    motion-dom "^12.38.0"
+    motion-utils "^12.36.0"
+    tslib "^2.4.0"
+
 fs-extra@~11.3.0:
   version "11.3.4"
   resolved "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.4.tgz"
@@ -4913,6 +4927,26 @@ mlly@^1.7.4:
     pkg-types "^1.3.1"
     ufo "^1.6.3"
 
+motion-dom@^12.38.0:
+  version "12.38.0"
+  resolved "https://registry.yarnpkg.com/motion-dom/-/motion-dom-12.38.0.tgz#9ef3253ea0fb28b6757588327073848d940e9aab"
+  integrity sha512-pdkHLD8QYRp8VfiNLb8xIBJis1byQ9gPT3Jnh2jqfFtAsWUA3dEepDlsWe/xMpO8McV+VdpKVcp+E+TGJEtOoA==
+  dependencies:
+    motion-utils "^12.36.0"
+
+motion-utils@^12.36.0:
+  version "12.36.0"
+  resolved "https://registry.yarnpkg.com/motion-utils/-/motion-utils-12.36.0.tgz#cff2df2a28c3fe53a3de7e0103ba7f73ff7d77a7"
+  integrity sha512-eHWisygbiwVvf6PZ1vhaHCLamvkSbPIeAYxWUuL3a2PD/TROgE7FvfHWTIH4vMl798QLfMw15nRqIaRDXTlYRg==
+
+motion@^12.38.0:
+  version "12.38.0"
+  resolved "https://registry.yarnpkg.com/motion/-/motion-12.38.0.tgz#851fb591f98ed98815e223c09a0de13614ea4155"
+  integrity sha512-uYfXzeHlgThchzwz5Te47dlv5JOUC7OB4rjJ/7XTUgtBZD8CchMN8qEJ4ZVsUmTyYA44zjV0fBwsiktRuFnn+w==
+  dependencies:
+    framer-motion "^12.38.0"
+    tslib "^2.4.0"
+
 ms@^2.1.3:
   version "2.1.3"
   resolved "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz"
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/constant/sidebar.ts b/openmetadata-ui/src/main/resources/ui/playwright/constant/sidebar.ts
index d7a7ae884644..7dd6d17a8e7e 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/constant/sidebar.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/constant/sidebar.ts
@@ -31,7 +31,8 @@ export enum SidebarItem {
   LINEAGE = 'lineage',
   COLUMN_BULK_OPERATIONS = 'column-bulk-operations',
   DATA_MARKETPLACE = 'data-marketplace',
-  KNOWLEDGE_CENTER = 'knowledge-center',
+  CONTEXT_CENTER = 'context-center',
+  ARTICLE = 'articles',
 }
 
 export const SIDEBAR_LIST_ITEMS = {
@@ -70,6 +71,7 @@ export const SIDEBAR_LIST_ITEMS = {
     SidebarItem.GOVERNANCE,
     SidebarItem.COLUMN_BULK_OPERATIONS,
   ],
+  [SidebarItem.ARTICLE]: [SidebarItem.CONTEXT_CENTER, SidebarItem.ARTICLE],
 
   // Profile Dropdown
   'user-name': ['dropdown-profile', 'user-name'],
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/ContextCenter.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/ContextCenter.spec.ts
new file mode 100644
index 000000000000..d0b7e1c49ee3
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/ContextCenter.spec.ts
@@ -0,0 +1,904 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { expect, Page, test } from '@playwright/test';
+import { KnowledgeCenterClass } from '../../support/entity/KnowledgeCenterClass';
+import { createNewPage, redirectToHomePage, uuid } from '../../utils/common';
+import { waitForAllLoadersToDisappear } from '../../utils/entity';
+import { addTitle } from '../../utils/KnowledgeCenter';
+
+// ─── Constants ────────────────────────────────────────────────────────────────
+
+const DASHBOARD_URL = '/context-center/dashboard';
+const ARTICLES_URL = '/context-center/articles';
+const DOCUMENTS_URL = '/context-center/documents';
+
+let ARTICLE_TITLE: string;
+const ARTICLE_DESCRIPTION =
+  'Playwright article description for card detail check';
+let QUICK_LINK_TITLE: string;
+const QUICK_LINK_URL = 'https://docs.open-metadata.org';
+const QUICK_LINK_DESCRIPTION =
+  'Playwright quick link description for card detail check';
+let QUICK_LINK_NAME: string;
+
+// ─── Helpers ─────────────────────────────────────────────────────────────────
+
+const navigateToDashboard = async (page: Page) => {
+  await page.goto(DASHBOARD_URL);
+  await page
+    .getByTestId('context-center-dashboard-page')
+    .waitFor({ state: 'visible' });
+  await waitForAllLoadersToDisappear(page);
+  // Wait for article section to finish loading (either cards or empty state)
+  const section = page.getByTestId('article-list-section');
+  await section.waitFor({ state: 'visible' });
+};
+
+const navigateToArticles = async (page: Page) => {
+  await page.goto(ARTICLES_URL);
+  await page
+    .getByTestId('context-center-articles-page')
+    .waitFor({ state: 'visible' });
+  await waitForAllLoadersToDisappear(page);
+};
+
+const navigateToDocuments = async (page: Page) => {
+  await page.goto(DOCUMENTS_URL);
+  await page
+    .getByTestId('context-center-documents-page')
+    .waitFor({ state: 'visible' });
+  await waitForAllLoadersToDisappear(page);
+};
+
+// ─── Auth ─────────────────────────────────────────────────────────────────────
+
+test.use({ storageState: 'playwright/.auth/admin.json' });
+
+// ─── Fixtures ─────────────────────────────────────────────────────────────────
+
+let articleEntity: KnowledgeCenterClass = new KnowledgeCenterClass();
+let quickLinkId = '';
+let uploadedDocumentId = '';
+
+test.describe('Context Center', () => {
+  test.slow(true);
+
+  test.beforeAll(async ({ browser }) => {
+    const { apiContext, afterAction } = await createNewPage(browser);
+
+    ARTICLE_TITLE = `CC Article ${uuid()}`;
+    QUICK_LINK_TITLE = `CC QuickLink ${uuid()}`;
+    QUICK_LINK_NAME = `cc_quicklink_${uuid()}`;
+    articleEntity = new KnowledgeCenterClass({
+      displayName: ARTICLE_TITLE,
+      name: `cc_article_${uuid()}`,
+    });
+
+    await articleEntity.create(apiContext);
+
+    // Patch article to set proper displayName and description
+    await articleEntity.patch(apiContext, [
+      { op: 'replace', path: '/displayName', value: ARTICLE_TITLE },
+      { op: 'replace', path: '/description', value: ARTICLE_DESCRIPTION },
+    ]);
+
+    // Create a quick link via API for dashboard card detail tests
+    const qlRes = await apiContext.post('/api/v1/knowledgeCenter', {
+      data: {
+        name: QUICK_LINK_NAME,
+        displayName: QUICK_LINK_TITLE,
+        description: QUICK_LINK_DESCRIPTION,
+        pageType: 'QuickLink',
+        page: {
+          url: QUICK_LINK_URL,
+          publicationDate: Date.now(),
+          relatedArticles: [],
+        },
+      },
+    });
+    const qlData = await qlRes.json();
+    quickLinkId = qlData.id;
+
+    // Upload a document via API so document-related tests have data
+    const fileContent = Buffer.from('Playwright seed document');
+    const formData = new FormData();
+    formData.append(
+      'file',
+      new Blob([fileContent], { type: 'text/plain' }),
+      'seed-document.txt'
+    );
+    formData.append('entityLink', '<#E::page::contextCenter.documents>');
+    formData.append('assetType', 'External');
+
+    const uploadRes = await apiContext.post('/api/v1/attachments/upload', {
+      multipart: {
+        file: {
+          name: 'seed-document.txt',
+          mimeType: 'text/plain',
+          buffer: fileContent,
+        },
+        entityLink: '<#E::page::contextCenter.documents>',
+        assetType: 'External',
+      },
+    });
+    const uploadData = await uploadRes.json();
+    uploadedDocumentId = uploadData.id;
+
+    await afterAction();
+  });
+
+  test.afterAll(async ({ browser }) => {
+    const { apiContext, afterAction } = await createNewPage(browser);
+    await articleEntity.delete(apiContext);
+    if (quickLinkId) {
+      await apiContext.delete(
+        `/api/v1/knowledgeCenter/${quickLinkId}?hardDelete=true&recursive=true`
+      );
+    }
+    await afterAction();
+  });
+
+  test.beforeEach(async ({ page }) => {
+    await redirectToHomePage(page);
+  });
+
+  // ─── Dashboard Page ──────────────────────────────────────────────────────────
+
+  test.describe('Dashboard Page', () => {
+    test('shows header with correct title, breadcrumb and action buttons', async ({
+      page,
+    }) => {
+      await navigateToDashboard(page);
+
+      await test.step('breadcrumb renders', async () => {
+        const header = page.getByTestId('context-center-header');
+        await expect(header).toBeVisible();
+        await expect(header.getByTestId('breadcrumb')).toBeVisible();
+      });
+
+      await test.step('title is visible', async () => {
+        await expect(
+          page.getByTestId('context-center-header').getByRole('heading')
+        ).toContainText('Dashboard');
+      });
+
+      await test.step('Create Article button is visible', async () => {
+        await expect(
+          page.getByRole('button', { name: /create.*article/i })
+        ).toBeVisible();
+      });
+
+      await test.step('Upload File button is visible', async () => {
+        await expect(
+          page.getByRole('button', { name: /upload file/i })
+        ).toBeVisible();
+      });
+    });
+
+    test('article list section renders pre-created article', async ({
+      page,
+    }) => {
+      await navigateToDashboard(page);
+
+      const section = page.getByTestId('article-list-section');
+      await expect(section).toBeVisible();
+
+      const card = section.getByTestId('article-card').filter({
+        hasText: ARTICLE_TITLE,
+      });
+      await expect(card.first()).toBeVisible();
+    });
+
+    test('uploaded documents section renders', async ({ page }) => {
+      await navigateToDashboard(page);
+
+      await expect(
+        page.getByTestId('uploaded-documents-section')
+      ).toBeVisible();
+    });
+
+    test('Create Article button creates article and redirects to detail page', async ({
+      page,
+    }) => {
+      await navigateToDashboard(page);
+
+      const createRes = page.waitForResponse('/api/v1/knowledgeCenter');
+      await page.getByRole('button', { name: /create.*article/i }).click();
+      await createRes;
+
+      await expect(
+        page.getByTestId('entity-header-display-name')
+      ).toBeVisible();
+      await expect(page).toHaveURL(/\/context-center\/articles\//);
+
+      // Clean up the newly created untitled article
+      const browser1 = page.context().browser();
+      if (browser1) {
+        const { apiContext, afterAction } = await createNewPage(browser1);
+        const fqn = page
+          .url()
+          .split('/context-center/articles/')
+          .pop()
+          ?.split('/')[0];
+        if (fqn) {
+          const res = await apiContext.get(
+            `/api/v1/knowledgeCenter/name/${fqn}?fields=id`
+          );
+          const data = await res.json();
+          await apiContext.delete(
+            `/api/v1/knowledgeCenter/${data.id}?hardDelete=true&recursive=true`
+          );
+        }
+        await afterAction();
+      }
+    });
+
+    test('Upload File button opens upload modal', async ({ page }) => {
+      await navigateToDashboard(page);
+
+      await page.getByRole('button', { name: /upload file/i }).click();
+
+      await expect(
+        page.getByRole('dialog', { name: /upload documents/i })
+      ).toBeVisible();
+    });
+
+    test('View All Articles navigates to articles page', async ({ page }) => {
+      await navigateToDashboard(page);
+
+      await page
+        .getByTestId('article-list-section')
+        .getByRole('button', { name: /view all/i })
+        .click();
+
+      await expect(page).toHaveURL(/\/context-center\/articles/);
+    });
+
+    test('View All Documents navigates to documents page', async ({ page }) => {
+      await navigateToDashboard(page);
+
+      await page
+        .getByTestId('uploaded-documents-section')
+        .getByRole('button', { name: /view all/i })
+        .click();
+
+      await expect(page).toHaveURL(/\/context-center\/documents/);
+    });
+
+    test('article card click navigates to article detail', async ({ page }) => {
+      await navigateToDashboard(page);
+
+      const card = page
+        .getByTestId('article-list-section')
+        .getByTestId('article-card')
+        .filter({ hasText: ARTICLE_TITLE });
+
+      await card.first().click();
+      await expect(page).toHaveURL(/\/context-center\/articles\//);
+    });
+
+    test('article card shows title, description and last-edited time', async ({
+      page,
+    }) => {
+      await navigateToDashboard(page);
+
+      const card = page
+        .getByTestId('article-list-section')
+        .getByTestId('article-card')
+        .filter({ hasText: ARTICLE_TITLE });
+
+      await card.first().scrollIntoViewIfNeeded();
+      await expect(card.first()).toBeVisible();
+
+      // Title
+      await expect(card.first().getByText(ARTICLE_TITLE)).toBeVisible();
+
+      // Description preview text
+      await expect(card.first().getByText(ARTICLE_DESCRIPTION)).toBeVisible();
+
+      // Last-edited timestamp label
+      await expect(card.first().getByText(/last updated/i)).toBeVisible();
+    });
+
+    test('quick link card shows title, description and opens external url', async ({
+      page,
+    }) => {
+      await navigateToDashboard(page);
+
+      const section = page.getByTestId('article-list-section');
+      const card = section
+        .getByTestId('article-card')
+        .filter({ hasText: QUICK_LINK_TITLE });
+
+      await card.first().scrollIntoViewIfNeeded();
+      await expect(card.first()).toBeVisible();
+
+      // Title
+      await expect(card.first().getByText(QUICK_LINK_TITLE)).toBeVisible();
+
+      // Description
+      await expect(
+        card.first().getByText(QUICK_LINK_DESCRIPTION)
+      ).toBeVisible();
+
+      // Clicking a quick link opens a new tab
+      const [newTab] = await Promise.all([
+        page.context().waitForEvent('page'),
+        card.first().click(),
+      ]);
+      await expect(newTab).toHaveURL(new RegExp(QUICK_LINK_URL));
+      await newTab.close();
+    });
+
+    test('uploaded document card shows filename and size label', async ({
+      page,
+    }) => {
+      await navigateToDashboard(page);
+
+      const section = page.getByTestId('uploaded-documents-section');
+      const firstCard = section.getByTestId('uploaded-document-card').first();
+
+      // Only assert if at least one document exists; otherwise skip gracefully
+      const count = await section.getByTestId('uploaded-document-card').count();
+      if (count === 0) {
+        return;
+      }
+
+      await firstCard.scrollIntoViewIfNeeded();
+      await expect(firstCard).toBeVisible();
+
+      // File type icon area
+      await expect(firstCard.locator('div').first()).toBeVisible();
+
+      // Filename (non-empty text)
+      const nameEl = firstCard.locator('span').first();
+      await expect(nameEl).toBeVisible();
+      const nameText = await nameEl.textContent();
+      expect(nameText?.trim().length).toBeGreaterThan(0);
+
+      // Size label (e.g. "0.0 MB" or "27 B")
+      const sizeEl = firstCard.locator('span').nth(1);
+      await expect(sizeEl).toBeVisible();
+      await expect(sizeEl).toHaveText(/\d/);
+    });
+  });
+
+  // ─── Articles Page ───────────────────────────────────────────────────────────
+
+  test.describe('Articles Page', () => {
+    test('lists articles page with header and breadcrumb', async ({ page }) => {
+      await navigateToArticles(page);
+
+      const header = page.getByTestId('context-center-header');
+      await expect(header).toBeVisible();
+      await expect(header.getByTestId('breadcrumb')).toBeVisible();
+      await expect(header.getByRole('heading')).toContainText('Articles');
+    });
+
+    test('Create button shows Article and Quick Link options', async ({
+      page,
+    }) => {
+      await navigateToArticles(page);
+
+      await page.getByTestId('create-knowledge-page-btn').click();
+
+      await expect(page.getByTestId('create-article-btn')).toBeVisible();
+      await expect(page.getByTestId('create-quick-link-btn')).toBeVisible();
+    });
+
+    test('creating an article navigates to article detail page', async ({
+      page,
+    }) => {
+      await navigateToArticles(page);
+
+      await page.getByTestId('create-knowledge-page-btn').click();
+
+      const articleItem = page.getByTestId('create-article-btn');
+      await expect(articleItem).toBeVisible();
+
+      const createRes = page.waitForResponse('/api/v1/knowledgeCenter');
+      await articleItem.click();
+      await createRes;
+
+      await expect(page).toHaveURL(/\/context-center\/articles\//);
+      await expect(
+        page.getByTestId('entity-header-display-name')
+      ).toBeVisible();
+
+      // Clean up
+      const browser2 = page.context().browser();
+      if (browser2) {
+        const { apiContext, afterAction } = await createNewPage(browser2);
+        const fqn = page
+          .url()
+          .split('/context-center/articles/')
+          .pop()
+          ?.split('/')[0];
+        if (fqn) {
+          const res = await apiContext.get(
+            `/api/v1/knowledgeCenter/name/${fqn}?fields=id`
+          );
+          const data = await res.json();
+          await apiContext.delete(
+            `/api/v1/knowledgeCenter/${data.id}?hardDelete=true&recursive=true`
+          );
+        }
+        await afterAction();
+      }
+    });
+
+    test('Quick Link modal opens and creates a quick link visible in list', async ({
+      page,
+    }) => {
+      const testQuickLinkTitle = `CC QL Test ${uuid()}`;
+
+      await navigateToArticles(page);
+
+      await page.getByTestId('create-knowledge-page-btn').click();
+      await page.getByTestId('create-quick-link-btn').click();
+
+      const modal = page.getByRole('dialog', { name: /quick link/i });
+      await expect(modal).toBeVisible();
+
+      await modal.getByTestId('displayName').fill(testQuickLinkTitle);
+      await modal.getByTestId('url').fill(QUICK_LINK_URL);
+
+      const createRes = page.waitForResponse('/api/v1/knowledgeCenter');
+      await modal.getByRole('button', { name: /save/i }).click();
+      const created = await createRes;
+      const createdData = await created.json();
+
+      const card = page.locator(`[data-testid="${testQuickLinkTitle}"]`);
+      await expect(card).toBeVisible();
+
+      // Clean up the test quick link
+      const browser3 = page.context().browser();
+      if (browser3 && createdData?.id) {
+        const { apiContext, afterAction } = await createNewPage(browser3);
+        await apiContext.delete(
+          `/api/v1/knowledgeCenter/${createdData.id}?hardDelete=true&recursive=true`
+        );
+        await afterAction();
+      }
+    });
+
+    test('quick link card has correct url and opens in new tab', async ({
+      page,
+    }) => {
+      await navigateToArticles(page);
+
+      const card = page.locator(`[data-testid="${QUICK_LINK_TITLE}"]`).first();
+      await card.scrollIntoViewIfNeeded();
+      await expect(card).toBeVisible();
+
+      const link = card.getByTestId('knowledge-link');
+      await expect(link).toHaveAttribute('href', QUICK_LINK_URL);
+      await expect(link).toHaveAttribute('target', '_blank');
+    });
+
+    test('left sidebar hierarchy shows pre-created article', async ({
+      page,
+    }) => {
+      await navigateToArticles(page);
+
+      const hierarchy = page.getByTestId('knowledge-pages-hierarchy');
+      await expect(hierarchy).toBeVisible();
+
+      const node = hierarchy.getByTestId(`page-node-${ARTICLE_TITLE}`);
+      await expect(node).toBeVisible();
+    });
+
+    test('article detail page - header has breadcrumb, title, version and action buttons', async ({
+      page,
+    }) => {
+      await page.goto(
+        `/context-center/articles/${articleEntity.responseData.fullyQualifiedName}`
+      );
+      await waitForAllLoadersToDisappear(page);
+
+      const header = page.getByTestId('article-detail-header');
+      await expect(header).toBeVisible();
+
+      // breadcrumb
+      await expect(header.getByTestId('breadcrumb')).toBeVisible();
+
+      // title
+      const title = page.getByTestId('entity-header-display-name');
+      await expect(title).toBeVisible();
+      await expect(title).toHaveValue(ARTICLE_TITLE);
+
+      // version button
+      await expect(header.getByTestId('version-btn')).toBeVisible();
+
+      // manage button (three-dot menu)
+      await expect(
+        header.getByRole('button', { name: 'Manage Article' })
+      ).toBeVisible();
+    });
+
+    test('article detail page - tabs are visible', async ({ page }) => {
+      await page.goto(
+        `/context-center/articles/${articleEntity.responseData.fullyQualifiedName}`
+      );
+      await waitForAllLoadersToDisappear(page);
+
+      const header = page.getByTestId('article-detail-header');
+      await expect(header.getByRole('tab', { name: /content/i })).toBeVisible();
+      await expect(
+        header.getByRole('tab', { name: /activity/i })
+      ).toBeVisible();
+    });
+
+    test('article detail page - right panel toggle works', async ({ page }) => {
+      await page.goto(
+        `/context-center/articles/${articleEntity.responseData.fullyQualifiedName}`
+      );
+      await waitForAllLoadersToDisappear(page);
+
+      const header = page.getByTestId('article-detail-header');
+      const toggleBtn = header.locator(
+        'button[aria-label*="sidebar"], button:has(svg)'
+      );
+
+      // Right panel is visible initially
+      const rightPanel = page.locator(
+        '[data-testid="knowledge-page-right-panel"]'
+      );
+      await expect(rightPanel).toBeVisible();
+
+      // Toggle off
+      await toggleBtn.last().click();
+      await expect(rightPanel).not.toBeVisible();
+
+      // Toggle back on
+      await toggleBtn.last().click();
+      await expect(rightPanel).toBeVisible();
+    });
+
+    test('article detail page - activity feed tab shows feed panel', async ({
+      page,
+    }) => {
+      await page.goto(
+        `/context-center/articles/${articleEntity.responseData.fullyQualifiedName}`
+      );
+      await waitForAllLoadersToDisappear(page);
+
+      const header = page.getByTestId('article-detail-header');
+      const activityTab = header.getByRole('tab', { name: /activity/i });
+      await activityTab.click();
+
+      await expect(page).toHaveURL(/activity_feed/);
+    });
+
+    test('version page shows article version header with breadcrumb and title', async ({
+      page,
+    }) => {
+      const fqn = articleEntity.responseData.fullyQualifiedName;
+
+      // First update the title to create a new version
+      await page.goto(`/context-center/articles/${fqn}`);
+      await waitForAllLoadersToDisappear(page);
+      const newTitle = `${ARTICLE_TITLE} v2`;
+      await addTitle(page, newTitle);
+
+      // Navigate to version page via version button
+      const versionBtn = page
+        .getByTestId('article-detail-header')
+        .getByTestId('version-btn');
+      await versionBtn.click();
+
+      await expect(page).toHaveURL(/\/versions\//);
+      await expect(page.getByTestId('article-version-header')).toBeVisible();
+      await expect(page.getByTestId('breadcrumb')).toBeVisible();
+
+      // Version timeline drawer is visible and contains at least one version entry
+      const versionTimeline = page.locator('.versions-list-container');
+      await expect(versionTimeline).toBeVisible();
+      await expect(
+        versionTimeline.locator('[data-testid^="version-entry-"]').first()
+      ).toBeVisible();
+    });
+
+    test('deleting quick link removes it from the list', async ({ page }) => {
+      await navigateToArticles(page);
+
+      const card = page.locator(`[data-testid="${QUICK_LINK_TITLE}"]`).first();
+      await card.scrollIntoViewIfNeeded();
+      await expect(card).toBeVisible();
+
+      await card.getByTestId('delete-quick-link-btn').click();
+
+      const deleteDialog = page.locator('[role="dialog"].ant-modal');
+      await expect(deleteDialog).toBeVisible();
+      await page.click('[data-testid="hard-delete-option"]');
+      await page.check('[data-testid="hard-delete"]');
+      await page.fill('[data-testid="confirmation-text-input"]', 'DELETE');
+
+      const deleteRes = page.waitForResponse(
+        '/api/v1/knowledgeCenter/*?hardDelete=true&recursive=false'
+      );
+      await page.getByTestId('confirm-button').click();
+      const res = await deleteRes;
+      expect(res.status()).toBe(200);
+
+      await expect(
+        page.locator(`[data-testid="${QUICK_LINK_TITLE}"]`).first()
+      ).not.toBeVisible();
+    });
+
+    test('deleting article removes it from sidebar and article list', async ({
+      page,
+    }) => {
+      // Create a disposable article to delete
+      const browser = page.context().browser();
+      if (!browser) {
+        return;
+      }
+      const { apiContext, afterAction } = await createNewPage(browser);
+      const deleteRes = await apiContext.post('/api/v1/knowledgeCenter', {
+        data: {
+          name: `cc_delete_test_${uuid()}`,
+          displayName: `CC Delete Test ${uuid()}`,
+          description: 'Article to be deleted in Playwright test',
+          pageType: 'Article',
+          page: { publicationDate: Date.now(), relatedArticles: [] },
+        },
+      });
+      const deleteArticle = await deleteRes.json();
+      await afterAction();
+
+      // Navigate to the article detail page
+      await page.goto(
+        `/context-center/articles/${deleteArticle.fullyQualifiedName}`
+      );
+      await waitForAllLoadersToDisappear(page);
+
+      // Click manage button to open dropdown
+      const manageBtn = page.getByRole('button', { name: 'Manage Article' });
+      await expect(manageBtn).toBeVisible();
+      await manageBtn.click();
+
+      // Click Delete from the manage dropdown
+      const deleteOption = page
+        .getByTestId('manage-dropdown-list-container')
+        .getByText(/delete/i)
+        .first();
+      await expect(deleteOption).toBeVisible();
+      await deleteOption.click();
+
+      // DeleteWidgetModal: only hard-delete option available for knowledge pages
+      const deleteModal = page.getByRole('dialog');
+      await expect(deleteModal).toBeVisible();
+
+      await page.getByTestId('confirmation-text-input').fill('DELETE');
+
+      const apiDeleteRes = page.waitForResponse(
+        /\/api\/v1\/knowledgeCenter\/.+\?hardDelete=true/
+      );
+      await page.getByTestId('confirm-button').click();
+      await apiDeleteRes;
+
+      // Redirected back to articles list
+      await expect(page).toHaveURL(/\/context-center\/articles$/);
+
+      // Article no longer appears in the left sidebar hierarchy
+      const hierarchy = page.getByTestId('knowledge-pages-hierarchy');
+      await expect(
+        hierarchy.getByTestId(`page-node-${deleteArticle.displayName}`)
+      ).not.toBeVisible();
+    });
+  });
+
+  // ─── Documents Page ───────────────────────────────────────────────────────────
+
+  test.describe('Documents Page', () => {
+    test('shows header with Upload File button', async ({ page }) => {
+      await navigateToDocuments(page);
+
+      const header = page.getByTestId('context-center-header');
+      await expect(header).toBeVisible();
+      await expect(header.getByTestId('breadcrumb')).toBeVisible();
+      await expect(header.getByRole('heading')).toContainText('Documents');
+
+      await expect(
+        page.getByRole('button', { name: /upload file/i })
+      ).toBeVisible();
+    });
+
+    test('documents view container is rendered', async ({ page }) => {
+      await navigateToDocuments(page);
+      await expect(page.getByTestId('documents-view')).toBeVisible();
+    });
+
+    test('Upload File button opens upload modal with correct title and hint', async ({
+      page,
+    }) => {
+      await navigateToDocuments(page);
+
+      await page.getByRole('button', { name: /upload file/i }).click();
+
+      const modal = page.getByRole('dialog', { name: /upload documents/i });
+      await expect(modal).toBeVisible();
+
+      // Drop zone with hint text
+      const hint = modal.locator('[class*="hint"], p').filter({
+        hasText: /svg|png|jpg|gif|5mb/i,
+      });
+      await expect(hint.first()).toBeVisible();
+
+      // Attach Files button is disabled when no file selected
+      const attachBtn = modal.getByRole('button', { name: /attach/i });
+      await expect(attachBtn).toBeVisible();
+      await expect(attachBtn).toBeDisabled();
+
+      // Cancel closes modal
+      await modal.getByRole('button', { name: /cancel/i }).click();
+      await expect(modal).not.toBeVisible();
+    });
+
+    test('file upload shows progress and success status, then appears in list', async ({
+      page,
+    }) => {
+      await navigateToDocuments(page);
+
+      await page.getByRole('button', { name: /upload file/i }).click();
+      const modal = page.getByRole('dialog', { name: /upload documents/i });
+      await expect(modal).toBeVisible();
+
+      // Create a tiny in-memory file via file chooser API
+      const [fileChooser] = await Promise.all([
+        page.waitForEvent('filechooser'),
+        page.locator('input[type="file"]').first().dispatchEvent('click'),
+      ]);
+      await fileChooser.setFiles({
+        name: 'test-upload.txt',
+        mimeType: 'text/plain',
+        buffer: Buffer.from('playwright test file content'),
+      });
+
+      // File appears in staged list
+      await expect(modal.getByText('test-upload.txt').first()).toBeVisible();
+
+      // Attach the file
+      const uploadRes = page.waitForResponse('/api/v1/attachments/upload');
+      await modal.getByRole('button', { name: /attach/i }).click();
+
+      // Progress bar / uploading state
+      const progressList = modal.getByRole('list');
+      await expect(progressList).toBeVisible();
+
+      await uploadRes;
+
+      // Wait for done state
+      await expect(modal.getByText(/complete/i)).toBeVisible();
+
+      await expect(modal.getByText('100%')).toBeVisible();
+
+      // Close modal
+      await modal.getByRole('button', { name: /cancel/i }).click();
+
+      // File appears in document list
+      const docRow = page.getByText('test-upload.txt');
+      await expect(docRow.first()).toBeVisible();
+    });
+
+    test('uploaded file shows name, size and download button in list', async ({
+      page,
+    }) => {
+      await navigateToDocuments(page);
+
+      const view = page.getByTestId('documents-view');
+      const firstRow = view.locator('[data-testid^="document-row-"]').first();
+
+      // Relies on at least one document existing from prior upload test
+      await expect(firstRow).toBeVisible();
+
+      // Name is present
+      await expect(
+        firstRow.locator('[class*="text-sm"], p').first()
+      ).toBeVisible();
+
+      // Download button is present (first ButtonUtility in the row actions)
+      const downloadBtn = firstRow.locator('button').nth(0);
+      await expect(downloadBtn).toBeVisible();
+    });
+
+    test('download button triggers file download', async ({ page }) => {
+      await navigateToDocuments(page);
+
+      const view = page.getByTestId('documents-view');
+      const firstRow = view.locator('[data-testid^="document-row-"]').first();
+
+      await expect(firstRow).toBeVisible();
+
+      // Listen for the download API call — download triggers /api/v1/assets/:id/download
+      const downloadRes = page.waitForResponse(
+        /\/api\/v1\/attachments\/[^/]+\/download(?:\?.*)?$/
+      );
+      await firstRow.locator('button').nth(0).click();
+      const res = await downloadRes;
+      expect(res.status()).toBe(200);
+    });
+
+    test('delete document removes it from the list', async ({ page }) => {
+      await navigateToDocuments(page);
+
+      const view = page.getByTestId('documents-view');
+      const firstRow = view.locator('[data-testid^="document-row-"]').first();
+
+      // Relies on at least one document existing from prior upload test
+      await expect(firstRow).toBeVisible();
+      await firstRow.scrollIntoViewIfNeeded();
+
+      const rowId = await firstRow.getAttribute('data-testid');
+
+      // Open the three-dot actions dropdown (second button in the row, after download)
+      await firstRow.locator('button[aria-label="Open menu"]').click();
+
+      // Click Delete from the dropdown menu
+      const deleteItem = page.getByTestId('delete-btn');
+      await expect(deleteItem).toBeVisible();
+      await deleteItem.click();
+
+      // Confirm via DeleteModal from core-components
+      const deleteModal = page.getByTestId('modal-header');
+      await expect(deleteModal).toBeVisible();
+
+      const deleteRes = page.waitForResponse(
+        /\/api\/v1\/attachments\/[^?]+\?hardDelete=true/
+      );
+      await page.getByTestId('confirm-button').click();
+      const res = await deleteRes;
+      expect(res.status()).toBe(200);
+
+      // Row is removed from the list
+      if (rowId) {
+        await expect(page.getByTestId(rowId)).not.toBeVisible();
+      }
+    });
+
+    test('oversized file shows error toast and does NOT appear in upload list', async ({
+      page,
+    }) => {
+      await navigateToDocuments(page);
+
+      await page.getByRole('button', { name: /upload file/i }).click();
+      const modal = page.getByRole('dialog', { name: /upload documents/i });
+      await expect(modal).toBeVisible();
+
+      // Create a >5 MB in-memory buffer
+      const bigBuffer = Buffer.alloc(6 * 1024 * 1024, 'x');
+      const [fileChooser] = await Promise.all([
+        page.waitForEvent('filechooser'),
+        page.locator('input[type="file"]').first().dispatchEvent('click'),
+      ]);
+      await fileChooser.setFiles({
+        name: 'too-large.bin',
+        mimeType: 'application/octet-stream',
+        buffer: bigBuffer,
+      });
+
+      // Inline error message is shown inside the modal
+      await expect(modal.getByTestId('size-error-message')).toBeVisible({
+        timeout: 5000,
+      });
+
+      // The file does NOT appear in the staged list
+      await expect(modal.getByText('too-large.bin')).not.toBeVisible();
+
+      // Upload progress list is also absent (nothing was queued)
+      await expect(modal.getByRole('list')).not.toBeVisible();
+    });
+  });
+});
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/KnowledgeCenter.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/KnowledgeCenter.spec.ts
index bf3812202af3..609d652776a2 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/KnowledgeCenter.spec.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/KnowledgeCenter.spec.ts
@@ -115,12 +115,9 @@ test.describe('Knowledge Center', () => {
       );
 
       // visit knowledge center
-      await sidebarClick(page, SidebarItem.KNOWLEDGE_CENTER);
-      await page
-        .locator('[data-testid="left-panel"]')
-        .getByTestId('add-knowledge-page-btn')
-        .click();
-      await page.getByRole('menuitem', { name: 'Article' }).click();
+      await sidebarClick(page, SidebarItem.ARTICLE);
+      await page.getByTestId('create-knowledge-page-btn').click();
+      await page.getByTestId('create-article-btn').click();
       await createKnowledgePage;
 
       // add title
@@ -212,7 +209,7 @@ test.describe('Knowledge Center', () => {
     });
 
     await test.step('Quick Links: Create, Read, Update and Delete', async () => {
-      await sidebarClick(page, SidebarItem.KNOWLEDGE_CENTER);
+      await sidebarClick(page, SidebarItem.ARTICLE);
 
       // Create Quick Link
       await createQuickLink(page, knowledgePageQuickLink, dataAsset);
@@ -226,7 +223,7 @@ test.describe('Knowledge Center', () => {
       // verify the tag category
       await expect(
         page.locator(
-          `[data-testid="tag-category-${knowledgePageQuickLink.tagFqn}-${knowledgePageQuickLink.updatedDisplayName}"]`
+          `[data-testid="${knowledgePageQuickLink.updatedDisplayName}"]`
         )
       ).toBeVisible();
 
@@ -291,7 +288,7 @@ test.describe('Knowledge Center', () => {
 
       await page
         .getByTestId('breadcrumb')
-        .getByRole('link', { name: 'Knowledge Center' })
+        .getByRole('link', { name: 'Articles' })
         .click();
     });
     // TODO: Commented out due to performance issue with infinite scroll
@@ -502,8 +499,7 @@ test.describe('Knowledge Center', () => {
     try {
       const { apiContext } = await createNewPage(browser);
       await knowledgeCenter2.create(apiContext, 10);
-
-      await sidebarClick(page, SidebarItem.KNOWLEDGE_CENTER);
+      await sidebarClick(page, SidebarItem.ARTICLE);
 
       // Get the first element content before scrolling
       const firstElementBeforeScroll = page
@@ -553,12 +549,9 @@ test.describe('Knowledge Center', () => {
   }) => {
     const createKnowledgePage = page.waitForResponse('/api/v1/knowledgeCenter');
 
-    await sidebarClick(page, SidebarItem.KNOWLEDGE_CENTER);
-    await page
-      .locator('[data-testid="left-panel"]')
-      .getByTestId('add-knowledge-page-btn')
-      .click();
-    await page.getByRole('menuitem', { name: 'Article' }).click();
+    await sidebarClick(page, SidebarItem.ARTICLE);
+    await page.getByTestId('create-knowledge-page-btn').click();
+    await page.getByTestId('create-article-btn').click();
     await createKnowledgePage;
 
     await addTitle(page, knowledgePageArticle.title);
@@ -651,13 +644,9 @@ test.describe('Knowledge Center', () => {
     page,
   }) => {
     const createKnowledgePage = page.waitForResponse('/api/v1/knowledgeCenter');
-
-    await sidebarClick(page, SidebarItem.KNOWLEDGE_CENTER);
-    await page
-      .locator('[data-testid="left-panel"]')
-      .getByTestId('add-knowledge-page-btn')
-      .click();
-    await page.getByRole('menuitem', { name: 'Article' }).click();
+    await sidebarClick(page, SidebarItem.ARTICLE);
+    await page.getByTestId('create-knowledge-page-btn').click();
+    await page.getByTestId('create-article-btn').click();
     await createKnowledgePage;
 
     await addTitle(page, knowledgePageArticle.title);
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/KnowledgeCenterList.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/KnowledgeCenterList.spec.ts
index 00da20b30e0c..efae8110d56c 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/KnowledgeCenterList.spec.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/KnowledgeCenterList.spec.ts
@@ -48,7 +48,7 @@ test.describe('Knowledge Center List', () => {
   test.beforeEach(async ({ page }) => {
     await redirectToHomePage(page);
     const listResponse = page.waitForResponse('/api/v1/knowledgeCenter*');
-    await sidebarClick(page, SidebarItem.KNOWLEDGE_CENTER);
+    await sidebarClick(page, SidebarItem.ARTICLE);
     await listResponse;
     await page
       .getByTestId('knowledge-page-listing')
@@ -190,7 +190,7 @@ test.describe('Knowledge Center List', () => {
     const knowledgePageLink = card.getByTestId('knowledge-page-link');
 
     const navigationPromise = page.waitForURL((url) =>
-      url.pathname.includes('/knowledge-center/')
+      url.pathname.includes('/context-center/articles/')
     );
 
     await knowledgePageLink.click();
@@ -206,7 +206,7 @@ test.describe('Knowledge Center List', () => {
     await waitForAllLoadersToDisappear(page);
 
     const listResponse = page.waitForResponse('/api/v1/knowledgeCenter*');
-    await sidebarClick(page, SidebarItem.KNOWLEDGE_CENTER);
+    await sidebarClick(page, SidebarItem.ARTICLE);
     await listResponse;
     await page
       .getByTestId('knowledge-page-listing')
@@ -227,7 +227,7 @@ test.describe('Knowledge Center List', () => {
     await expect(recentlyViewedItem).toBeVisible();
 
     const recentViewNavigationPromise = page.waitForURL((url) =>
-      url.pathname.includes('/knowledge-center/')
+      url.pathname.includes('/context-center/articles/')
     );
     await recentlyViewedItem.click();
     await recentViewNavigationPromise;
@@ -286,26 +286,6 @@ test.describe('Knowledge Center List', () => {
     );
   });
 
-  test('Knowledge Center List - Test add article button', async ({ page }) => {
-    const addButton = page.getByTestId('add-knowledge-page-btn');
-    await expect(addButton).toBeVisible();
-
-    await addButton.click();
-    await page.waitForSelector('.ant-dropdown', { state: 'visible' });
-
-    const articleOption = page.getByRole('menuitem', { name: 'Article' });
-    await expect(articleOption).toBeVisible();
-
-    const quickLinkOption = page.getByRole('menuitem', { name: 'Quick Link' });
-    await expect(quickLinkOption).toBeVisible();
-
-    const createResponse = page.waitForResponse('/api/v1/knowledgeCenter');
-    await articleOption.click();
-    await createResponse;
-
-    await expect(page.getByTestId('entity-header-display-name')).toBeVisible();
-  });
-
   test('Knowledge Center List - Test metadata section details', async ({
     page,
   }) => {
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/KnowledgeCenterRoleBasedAccess.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/KnowledgeCenterRoleBasedAccess.spec.ts
index df610a81d2c9..1fad1e57f072 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/KnowledgeCenterRoleBasedAccess.spec.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/KnowledgeCenterRoleBasedAccess.spec.ts
@@ -159,7 +159,7 @@ testWithRolesPages(
 
     await articleResponse;
 
-    await dataConsumerPage.waitForURL(/\/knowledge-center\/.*/);
+    await dataConsumerPage.waitForURL(/\/context-center\/.*/);
 
     await dataConsumerPage.waitForSelector('.ant-skeleton-active', {
       state: 'detached',
@@ -229,7 +229,7 @@ testWithRolesPages(
 
     await articleResponse;
 
-    await dataStewardPage.waitForURL(/\/knowledge-center\/.*/);
+    await dataStewardPage.waitForURL(/\/context-center\/.*/);
 
     await dataStewardPage.waitForSelector('.ant-skeleton-active', {
       state: 'detached',
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/KnowledgeCenter.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/KnowledgeCenter.ts
index c9fcbd0ac9aa..1d08784bbecb 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/utils/KnowledgeCenter.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/KnowledgeCenter.ts
@@ -25,7 +25,7 @@ import {
 import { waitForAllLoadersToDisappear } from './entity';
 import { sidebarClick } from './sidebar';
 
-const KNOWLEDGE_PAGE_ROUTE = '/knowledge-center/:fqn';
+const ARTICLE_PAGE_ROUTE = '/context-center/articles/:fqn';
 const FQN_PLACEHOLDER = ':fqn';
 
 export const deletePage = async (
@@ -34,7 +34,7 @@ export const deletePage = async (
   entityFqn?: string
 ) => {
   if (!isQuickLink) {
-    await page.getByTestId('manage-button').click();
+    await page.getByTestId('manage-button').first().click();
     await page.getByTestId('delete-button').click();
   }
 
@@ -198,7 +198,7 @@ export const readArticleData = async (
     tagFqn: string;
   }
 ) => {
-  await sidebarClick(page, SidebarItem.KNOWLEDGE_CENTER);
+  await sidebarClick(page, SidebarItem.ARTICLE);
   await readArticleInHierarchy(page, data.title);
 };
 
@@ -211,13 +211,8 @@ export const createQuickLink = async (
   },
   dataAsset: TopicClass
 ) => {
-  await page.locator('[data-testid="add-knowledge-page-btn"]').click();
-
-  await expect(
-    page.getByRole('menuitem', { name: 'Quick Link' })
-  ).toBeVisible();
-
-  await page.getByRole('menuitem', { name: 'Quick Link' }).click();
+  await page.getByTestId('create-knowledge-page-btn').click();
+  await page.getByTestId('create-quick-link-btn').click();
 
   await expect(page.locator('.ant-modal-title')).toHaveText('Add Quick Link');
 
@@ -489,18 +484,10 @@ export const toggleKnowledgePageBookmark = async (
       url.includes('/api/v1/knowledgeCenter') && url.includes('/followers')
     );
   });
-  const widgetRefreshResponse = page.waitForResponse((response) => {
-    return (
-      response.url().includes('/api/v1/users') &&
-      response.url().includes('fields=follows')
-    );
-  });
 
   await bookmarkBtn.click();
   const bookmarkRes = await bookmarkResponse;
-  const widgetRes = await widgetRefreshResponse;
   expect(bookmarkRes.status()).toBe(200);
-  expect(widgetRes.status()).toBe(200);
   await waitForAllLoadersToDisappear(page);
 
   const rightPanel = page.getByTestId('knowledge-center-right-panel');
@@ -521,7 +508,7 @@ export const createNewKnowledgePageArticle = async (
 ) => {
   const createKnowledgePage = page.waitForResponse('/api/v1/knowledgeCenter');
 
-  await sidebarClick(page, SidebarItem.KNOWLEDGE_CENTER);
+  await sidebarClick(page, SidebarItem.ARTICLE);
   await page
     .locator('[data-testid="left-panel"]')
     .getByTestId('add-knowledge-page-btn')
@@ -895,7 +882,7 @@ export const navigateToArticle = async (page: Page, articleFqn: string) => {
       response.status() === 200
   );
 
-  const articlePath = KNOWLEDGE_PAGE_ROUTE.replace(FQN_PLACEHOLDER, articleFqn);
+  const articlePath = ARTICLE_PAGE_ROUTE.replace(FQN_PLACEHOLDER, articleFqn);
   await page.goto(articlePath);
   await getArticleResponse;
   await waitForAllLoadersToDisappear(page);
@@ -911,6 +898,6 @@ export const navigateToKnowledgeCenter = async (page: Page) => {
       response.url().includes('/knowledge-center')
   );
 
-  await sidebarClick(page, SidebarItem.KNOWLEDGE_CENTER);
+  await sidebarClick(page, SidebarItem.ARTICLE);
   await knowledgeCenterResponse;
 };
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/customizeNavigation.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/customizeNavigation.ts
index 3660fdfa6a5a..814e01f6bb11 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/utils/customizeNavigation.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/customizeNavigation.ts
@@ -53,7 +53,8 @@ export const validateLeftSidebarWithHiddenItems = async (
     if (
       item === SidebarItem.OBSERVABILITY ||
       item === SidebarItem.GOVERNANCE ||
-      item === SidebarItem.DATA_MARKETPLACE_SECTION
+      item === SidebarItem.DATA_MARKETPLACE_SECTION ||
+      item === SidebarItem.CONTEXT_CENTER
     ) {
       await expect(page.getByTestId(item)).toBeVisible();
     } else {
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-context-center.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-context-center.svg
new file mode 100644
index 000000000000..b1f091e225ce
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-context-center.svg
@@ -0,0 +1,7 @@
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2z" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M12 8v4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+  <circle cx="12" cy="15.5" r="0.75" fill="currentColor"/>
+  <path d="M8 10.5c0-2.21 1.79-4 4-4s4 1.79 4 4" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/>
+  <path d="M7 17c1.38.63 2.9 1 4.5 1 1.7 0 3.3-.4 4.72-1.1" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/>
+</svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-doc.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-doc.svg
new file mode 100644
index 000000000000..4e878c479a2c
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-doc.svg
@@ -0,0 +1,6 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11 0.75H27C27.1212 0.75 27.2375 0.798088 27.3232 0.883789L38.1162 11.6768C38.2019 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4C7.75 2.20507 9.20508 0.75 11 0.75Z" stroke="#D5D7DA" stroke-width="1.5"/>
+<path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D5D7DA" stroke-width="1.5"/>
+<rect x="1" y="18" width="29" height="16" rx="2" fill="#155EEF"/>
+<path d="M7.40163 30H4.82351V22.7273H7.42294C8.15447 22.7273 8.78421 22.8729 9.31214 23.1641C9.84008 23.4529 10.2461 23.8684 10.5302 24.4105C10.8166 24.9527 10.9599 25.6013 10.9599 26.3565C10.9599 27.1141 10.8166 27.7652 10.5302 28.3097C10.2461 28.8542 9.83771 29.272 9.30504 29.5632C8.77474 29.8544 8.14027 30 7.40163 30ZM6.36115 28.6825H7.33771C7.79226 28.6825 8.1746 28.602 8.48473 28.4411C8.79723 28.2777 9.03161 28.0256 9.18786 27.6847C9.34647 27.3414 9.42578 26.8987 9.42578 26.3565C9.42578 25.8191 9.34647 25.38 9.18786 25.0391C9.03161 24.6982 8.79841 24.4472 8.48828 24.2862C8.17815 24.1252 7.79581 24.0447 7.34126 24.0447H6.36115V28.6825ZM18.7821 26.3636C18.7821 27.1567 18.6318 27.8314 18.3311 28.3878C18.0328 28.9441 17.6257 29.3691 17.1096 29.6626C16.5958 29.9538 16.0182 30.0994 15.3766 30.0994C14.7303 30.0994 14.1503 29.9527 13.6365 29.6591C13.1228 29.3655 12.7168 28.9406 12.4185 28.3842C12.1202 27.8279 11.9711 27.1544 11.9711 26.3636C11.9711 25.5705 12.1202 24.8958 12.4185 24.3395C12.7168 23.7831 13.1228 23.3594 13.6365 23.0682C14.1503 22.7746 14.7303 22.6278 15.3766 22.6278C16.0182 22.6278 16.5958 22.7746 17.1096 23.0682C17.6257 23.3594 18.0328 23.7831 18.3311 24.3395C18.6318 24.8958 18.7821 25.5705 18.7821 26.3636ZM17.2232 26.3636C17.2232 25.8499 17.1462 25.4167 16.9924 25.0639C16.8408 24.7112 16.6266 24.4437 16.3496 24.2614C16.0726 24.0791 15.7483 23.9879 15.3766 23.9879C15.0049 23.9879 14.6806 24.0791 14.4036 24.2614C14.1266 24.4437 13.9112 24.7112 13.7573 25.0639C13.6058 25.4167 13.53 25.8499 13.53 26.3636C13.53 26.8774 13.6058 27.3106 13.7573 27.6634C13.9112 28.0161 14.1266 28.2836 14.4036 28.4659C14.6806 28.6482 15.0049 28.7393 15.3766 28.7393C15.7483 28.7393 16.0726 28.6482 16.3496 28.4659C16.6266 28.2836 16.8408 28.0161 16.9924 27.6634C17.1462 27.3106 17.2232 26.8774 17.2232 26.3636ZM26.3381 25.2734H24.7827C24.7543 25.0722 24.6963 24.8935 24.6087 24.7372C24.5211 24.5786 24.4086 24.4437 24.2713 24.3324C24.134 24.2211 23.9754 24.1359 23.7955 24.0767C23.6179 24.0175 23.425 23.9879 23.2166 23.9879C22.8402 23.9879 22.5123 24.0814 22.233 24.2685C21.9536 24.4531 21.737 24.723 21.5831 25.0781C21.4292 25.4309 21.3523 25.8594 21.3523 26.3636C21.3523 26.8821 21.4292 27.3177 21.5831 27.6705C21.7393 28.0232 21.9571 28.2895 22.2365 28.4695C22.5159 28.6494 22.839 28.7393 23.206 28.7393C23.4119 28.7393 23.6025 28.7121 23.7777 28.6577C23.9553 28.6032 24.1127 28.5239 24.25 28.4197C24.3873 28.3132 24.5009 28.1842 24.5909 28.0327C24.6832 27.8812 24.7472 27.7083 24.7827 27.5142L26.3381 27.5213C26.2978 27.8551 26.1972 28.1771 26.0362 28.4872C25.8776 28.795 25.6634 29.0708 25.3935 29.3146C25.1259 29.5561 24.8063 29.7479 24.4347 29.8899C24.0653 30.0296 23.6475 30.0994 23.1811 30.0994C22.5324 30.0994 21.9524 29.9527 21.4411 29.6591C20.9321 29.3655 20.5296 28.9406 20.2337 28.3842C19.9401 27.8279 19.7933 27.1544 19.7933 26.3636C19.7933 25.5705 19.9425 24.8958 20.2408 24.3395C20.5391 23.7831 20.9439 23.3594 21.4553 23.0682C21.9666 22.7746 22.5419 22.6278 23.1811 22.6278C23.6025 22.6278 23.9931 22.687 24.353 22.8054C24.7152 22.9238 25.036 23.0966 25.3153 23.3239C25.5947 23.5488 25.822 23.8246 25.9972 24.1513C26.1747 24.478 26.2884 24.852 26.3381 25.2734Z" fill="white"/>
+</svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-editor.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-editor.svg
new file mode 100644
index 000000000000..7fd22417dfaa
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-editor.svg
@@ -0,0 +1,12 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_6441_9644)">
+<path d="M17.0191 9.75553C17.077 9.7504 17.1349 9.74759 17.1932 9.74709C18.0289 9.7434 18.3907 10.2303 18.9296 10.7618C19.4584 11.2843 20.0048 11.7218 20.0002 12.5396C19.9958 13.2935 19.5686 13.6885 19.0817 14.1728L18.1394 15.0978L14.4099 18.8232C14.1737 19.0622 13.4589 19.8261 13.1932 19.9403C13.0579 19.9985 12.9209 19.9955 12.7767 19.9963C11.9996 19.9855 11.2064 20.0117 10.4293 19.986C10.3091 19.982 10.1725 19.9174 10.0746 19.8492C9.91943 19.7428 9.8143 19.5777 9.7833 19.3919C9.7578 19.235 9.76499 18.9772 9.76486 18.8088L9.76468 17.8981L9.76499 17.17C9.76493 17.0229 9.75899 16.8598 9.77574 16.7153C9.81036 16.4173 10.0384 16.2297 10.2386 16.0323C10.3762 15.8965 10.517 15.7617 10.6538 15.6241L12.3495 13.9235L14.0637 12.206C14.5436 11.7172 14.9889 11.228 15.4976 10.7613C16.0694 10.2367 16.1646 9.88953 17.0191 9.75553ZM11.2419 17.1283C11.2096 17.5827 11.2458 18.0617 11.2243 18.5171C11.5306 18.522 11.837 18.524 12.1432 18.523C12.2628 18.5228 12.5066 18.5279 12.6196 18.5123C12.7254 18.4343 13.1011 18.0438 13.2111 17.934L14.3987 16.7522L16.008 15.1541C16.2089 14.9519 16.4498 14.7313 16.6336 14.5221C16.6201 14.4535 15.3335 13.1379 15.2396 13.0917L12.4339 15.913L11.6345 16.7075C11.5324 16.8099 11.3182 17.0162 11.2419 17.1283ZM17.7075 13.4517C17.8431 13.386 18.2729 12.8645 18.4301 12.7455C18.4872 12.7023 18.5682 12.5403 18.517 12.4725C18.4803 12.4238 18.4439 12.3473 18.394 12.3043C18.0685 11.9654 17.7422 11.6237 17.3999 11.3022C17.3303 11.2368 17.2489 11.2254 17.1579 11.227C17.1161 11.2444 17.0762 11.2631 17.0401 11.291C16.907 11.3936 16.3685 11.9142 16.3141 12.0374C16.308 12.0515 16.3129 12.0623 16.3201 12.076C16.3809 12.1895 17.5544 13.3272 17.7075 13.4517Z" fill="currentColor"/>
+<path d="M7.3925 0.00429265C9.68012 -0.0989644 11.6176 1.6732 11.7184 3.96094C11.8192 6.24869 10.0449 8.18431 7.75706 8.28256C5.47273 8.38069 3.54073 6.60975 3.44012 4.32554C3.33952 2.0413 5.10836 0.107373 7.3925 0.00429265ZM7.78462 6.81175C9.25806 6.69881 10.3612 5.41311 10.2489 3.93963C10.1365 2.46614 8.85131 1.3625 7.37775 1.4742C5.90333 1.58598 4.79889 2.87214 4.91128 4.34651C5.02367 5.82088 6.31031 6.92475 7.78462 6.81175Z" fill="currentColor"/>
+<path d="M5.52537 9.74371C5.52679 9.74365 5.5282 9.74365 5.52962 9.74358C6.44819 9.73146 7.36806 9.74065 8.28681 9.74077C8.87838 9.7409 9.48506 9.7119 10.0741 9.76127C10.5061 9.7974 11.6236 9.9469 11.9241 10.245C12.071 10.3906 12.1584 10.5654 12.1569 10.7736C12.1556 10.9786 12.0724 11.1521 11.9264 11.2941C11.5116 11.6971 10.9962 11.3821 10.5229 11.289C10.2661 11.2385 9.97262 11.2259 9.70963 11.2215C8.73531 11.2054 7.75844 11.22 6.78388 11.22L5.80088 11.2183C5.36143 11.2163 4.87313 11.2031 4.44216 11.3058C3.76277 11.4621 3.13986 11.8032 2.64234 12.2915C1.89479 13.0096 1.47012 13.9999 1.46526 15.0366C1.44944 16.946 2.06326 17.6024 3.98269 17.5498C4.08071 17.5471 4.19404 17.5498 4.29383 17.5496L6.578 17.5491C6.82413 17.5491 7.50369 17.5341 7.71731 17.572C7.84588 17.5943 7.96519 17.6535 8.06075 17.7423C8.439 18.0878 8.36044 18.6463 7.94088 18.9126C7.80594 18.9982 7.6615 19.0244 7.50387 19.0253C6.762 19.0301 6.01957 19.027 5.2777 19.0271L4.18114 19.0279C3.07053 19.0283 1.8425 18.9456 1.0147 18.1257C-0.709643 16.4181 -0.0278056 12.9135 1.50586 11.3087C2.58983 10.1745 4.03402 9.78346 5.52537 9.74371Z" fill="currentColor"/>
+</g>
+<defs>
+<clipPath id="clip0_6441_9644">
+<rect fill="white" width="20" height="20"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-folder-new.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-folder-new.svg
new file mode 100644
index 000000000000..ee02cc48642c
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-folder-new.svg
@@ -0,0 +1,3 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.00002 11.6667L6.25002 9.25008C6.38591 8.9802 6.59262 8.75233 6.84803 8.59087C7.10344 8.4294 7.39794 8.34041 7.70002 8.33341H16.6667M16.6667 8.33341C16.9213 8.33297 17.1726 8.39086 17.4014 8.50265C17.6301 8.61444 17.8302 8.77715 17.9863 8.9783C18.1424 9.17945 18.2504 9.41369 18.3018 9.66304C18.3533 9.91239 18.347 10.1702 18.2834 10.4167L17 15.4167C16.9072 15.7764 16.6969 16.0947 16.4025 16.3212C16.108 16.5476 15.7464 16.6693 15.375 16.6667H3.33335C2.89133 16.6667 2.4674 16.4912 2.15484 16.1786C1.84228 15.866 1.66669 15.4421 1.66669 15.0001V4.16675C1.66669 3.72472 1.84228 3.3008 2.15484 2.98824C2.4674 2.67567 2.89133 2.50008 3.33335 2.50008H6.58335C6.86209 2.49735 7.13706 2.56457 7.3831 2.6956C7.62914 2.82662 7.83839 3.01727 7.99169 3.25008L8.66669 4.25008C8.81844 4.48052 9.02504 4.66968 9.26794 4.80058C9.51083 4.93148 9.78243 5.00003 10.0584 5.00008H15C15.442 5.00008 15.866 5.17567 16.1785 5.48824C16.4911 5.8008 16.6667 6.22472 16.6667 6.66675V8.33341Z" stroke="currentColor" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-grid-new.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-grid-new.svg
new file mode 100644
index 000000000000..3187ed56465b
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-grid-new.svg
@@ -0,0 +1,6 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.5 2.5H3.33333C2.8731 2.5 2.5 2.8731 2.5 3.33333V9.16667C2.5 9.6269 2.8731 10 3.33333 10H7.5C7.96024 10 8.33333 9.6269 8.33333 9.16667V3.33333C8.33333 2.8731 7.96024 2.5 7.5 2.5Z" stroke="currentColor" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16.6667 2.5H12.5C12.0398 2.5 11.6667 2.8731 11.6667 3.33333V5.83333C11.6667 6.29357 12.0398 6.66667 12.5 6.66667H16.6667C17.1269 6.66667 17.5 6.29357 17.5 5.83333V3.33333C17.5 2.8731 17.1269 2.5 16.6667 2.5Z" stroke="currentColor" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16.6667 10H12.5C12.0398 10 11.6667 10.3731 11.6667 10.8333V16.6667C11.6667 17.1269 12.0398 17.5 12.5 17.5H16.6667C17.1269 17.5 17.5 17.1269 17.5 16.6667V10.8333C17.5 10.3731 17.1269 10 16.6667 10Z" stroke="currentColor" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M7.5 13.333H3.33333C2.8731 13.333 2.5 13.7061 2.5 14.1663V16.6663C2.5 17.1266 2.8731 17.4997 3.33333 17.4997H7.5C7.96024 17.4997 8.33333 17.1266 8.33333 16.6663V14.1663C8.33333 13.7061 7.96024 13.333 7.5 13.333Z" stroke="currentColor" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-image.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-image.svg
new file mode 100644
index 000000000000..c9c3b1886536
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-image.svg
@@ -0,0 +1,21 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_4315_6416" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="4" y="0" width="32" height="40">
+<path d="M4 4C4 1.79086 5.79086 0 8 0H24L36 12V36C36 38.2091 34.2091 40 32 40H8C5.79086 40 4 38.2091 4 36V4Z" fill="url(#paint0_linear_4315_6416)"/>
+</mask>
+<g mask="url(#mask0_4315_6416)">
+<path d="M4 4C4 1.79086 5.79086 0 8 0H24L36 12V36C36 38.2091 34.2091 40 32 40H8C5.79086 40 4 38.2091 4 36V4Z" fill="#F5F5F5"/>
+</g>
+<path d="M24 0L36 12H28C25.7909 12 24 10.2091 24 8V0Z" fill="#E9EAEB"/>
+<g clip-path="url(#clip0_4315_6416)">
+<path d="M24.6667 30H25.3403C25.9877 30 26.3114 30 26.4899 29.865C26.6453 29.7474 26.7415 29.5677 26.7531 29.3731C26.7665 29.1497 26.5869 28.8804 26.2278 28.3417L24.2209 25.3313C23.9241 24.8862 23.7757 24.6636 23.5887 24.586C23.4252 24.5182 23.2415 24.5182 23.078 24.586C22.8909 24.6636 22.7426 24.8862 22.4458 25.3313L21.9497 26.0755M24.6667 30L19.5437 22.6001C19.2491 22.1745 19.1017 21.9618 18.9177 21.887C18.7568 21.8215 18.5766 21.8215 18.4156 21.887C18.2316 21.9618 18.0843 22.1745 17.7897 22.6001L13.8255 28.3262C13.4501 28.8684 13.2625 29.1394 13.2731 29.3649C13.2824 29.5612 13.3779 29.7435 13.5341 29.8629C13.7133 30 14.0431 30 14.7025 30H24.6667ZM26 20C26 21.1046 25.1046 22 24 22C22.8954 22 22 21.1046 22 20C22 18.8954 22.8954 18 24 18C25.1046 18 26 18.8954 26 20Z" stroke="#414651" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_4315_6416" x1="20" y1="0" x2="20" y2="40" gradientUnits="userSpaceOnUse">
+<stop stop-opacity="0.4"/>
+<stop offset="1"/>
+</linearGradient>
+<clipPath id="clip0_4315_6416">
+<rect width="16" height="16" fill="white" transform="translate(12 16)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-integration.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-integration.svg
new file mode 100644
index 000000000000..32525dfe93da
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-integration.svg
@@ -0,0 +1,5 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.50002 14.1663H5.83335C4.72828 14.1663 3.66848 13.7274 2.88708 12.946C2.10567 12.1646 1.66669 11.1047 1.66669 9.99967C1.66669 8.89461 2.10567 7.8348 2.88708 7.0534C3.66848 6.27199 4.72828 5.83301 5.83335 5.83301H7.50002" stroke="currentColor" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M12.5 5.83301H14.1667C15.2717 5.83301 16.3315 6.27199 17.1129 7.0534C17.8943 7.8348 18.3333 8.89461 18.3333 9.99967C18.3333 11.1047 17.8943 12.1646 17.1129 12.946C16.3315 13.7274 15.2717 14.1663 14.1667 14.1663H12.5" stroke="currentColor" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M6.66669 10H13.3334" stroke="currentColor" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-pdf.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-pdf.svg
new file mode 100644
index 000000000000..8db99ed2eba3
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-pdf.svg
@@ -0,0 +1,6 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11 0.75H27C27.1212 0.75 27.2375 0.798088 27.3232 0.883789L38.1162 11.6768C38.2019 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4C7.75 2.20507 9.20508 0.75 11 0.75Z" stroke="#D5D7DA" stroke-width="1.5"/>
+<path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D5D7DA" stroke-width="1.5"/>
+<rect x="1" y="18" width="26" height="16" rx="2" fill="#D92D20"/>
+<path d="M4.8323 30V22.7273H7.70162C8.25323 22.7273 8.72316 22.8326 9.11142 23.0433C9.49967 23.2517 9.7956 23.5417 9.9992 23.9134C10.2052 24.2827 10.3082 24.7088 10.3082 25.1918C10.3082 25.6747 10.204 26.1009 9.99565 26.4702C9.78732 26.8395 9.48547 27.1271 9.09011 27.3331C8.69712 27.5391 8.22127 27.642 7.66255 27.642H5.83372V26.4098H7.41397C7.7099 26.4098 7.95375 26.3589 8.14551 26.2571C8.33964 26.1529 8.48405 26.0097 8.57875 25.8274C8.67581 25.6428 8.72434 25.4309 8.72434 25.1918C8.72434 24.9503 8.67581 24.7396 8.57875 24.5597C8.48405 24.3774 8.33964 24.2365 8.14551 24.1371C7.95138 24.0353 7.70517 23.9844 7.40687 23.9844H6.36994V30H4.8323ZM13.885 30H11.3069V22.7273H13.9063C14.6379 22.7273 15.2676 22.8729 15.7955 23.1641C16.3235 23.4529 16.7295 23.8684 17.0136 24.4105C17.3 24.9527 17.4433 25.6013 17.4433 26.3565C17.4433 27.1141 17.3 27.7652 17.0136 28.3097C16.7295 28.8542 16.3211 29.272 15.7884 29.5632C15.2581 29.8544 14.6237 30 13.885 30ZM12.8445 28.6825H13.8211C14.2757 28.6825 14.658 28.602 14.9681 28.4411C15.2806 28.2777 15.515 28.0256 15.6713 27.6847C15.8299 27.3414 15.9092 26.8987 15.9092 26.3565C15.9092 25.8191 15.8299 25.38 15.6713 25.0391C15.515 24.6982 15.2818 24.4472 14.9717 24.2862C14.6615 24.1252 14.2792 24.0447 13.8247 24.0447H12.8445V28.6825ZM18.5823 30V22.7273H23.3976V23.995H20.1199V25.728H23.078V26.9957H20.1199V30H18.5823Z" fill="white"/>
+</svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-sidebar-collapsible.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-sidebar-collapsible.svg
new file mode 100644
index 000000000000..7768303c6cdb
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-sidebar-collapsible.svg
@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 7.2093V12.7907C0 17.8419 2.15814 20 7.2093 20H12.7907C17.8419 20 20 17.8419 20 12.7907V7.2093C20 2.15814 17.8419 0 12.7907 0H7.2093C2.15814 0 0 2.14884 0 7.2093ZM18.6047 12.7907C18.6047 17.0791 17.0791 18.6047 12.7907 18.6047H7.2093C2.92093 18.6047 1.39535 17.0791 1.39535 12.7907V7.2093C1.39535 2.92093 2.92093 1.39535 7.2093 1.39535H12.7907C17.0791 1.39535 18.6047 2.92093 18.6047 7.2093V12.7907Z" fill="#717680"/>
+<path d="M12.7907 0C12.4093 0 12.093 0.316278 12.093 0.697674V19.3023C12.093 19.6837 12.4093 20 12.7907 20C13.1721 20 13.4884 19.6837 13.4884 19.3023V0.697674C13.4884 0.316278 13.1814 0 12.7907 0Z" fill="#717680"/>
+<path d="M6.2786 6.92132C6.10186 6.92132 5.92511 6.98643 5.78558 7.12597C5.51581 7.39573 5.51581 7.84225 5.78558 8.11201L7.67395 10.0004L5.78558 11.8888C5.51581 12.1585 5.51581 12.6051 5.78558 12.8748C6.05534 13.1446 6.50186 13.1446 6.77162 12.8748L9.15306 10.4934C9.42282 10.2236 9.42282 9.77713 9.15306 9.50736L6.77162 7.12597C6.64139 6.98643 6.46465 6.92132 6.2786 6.92132Z" fill="#717680"/>
+</svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-xls.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-xls.svg
new file mode 100644
index 000000000000..ab49e1afc313
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-xls.svg
@@ -0,0 +1,6 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11 0.75H27C27.1212 0.75 27.2375 0.798088 27.3232 0.883789L38.1162 11.6768C38.2019 11.7625 38.25 11.8788 38.25 12V36C38.25 37.7949 36.7949 39.25 35 39.25H11C9.20507 39.25 7.75 37.7949 7.75 36V4C7.75 2.20507 9.20508 0.75 11 0.75Z" stroke="#D5D7DA" stroke-width="1.5"/>
+<path d="M27 0.5V8C27 10.2091 28.7909 12 31 12H38.5" stroke="#D5D7DA" stroke-width="1.5"/>
+<rect x="1" y="18" width="26" height="16" rx="2" fill="#079455"/>
+<path d="M6.38636 22.7273L7.85298 25.206H7.9098L9.38352 22.7273H11.12L8.90057 26.3636L11.1697 30H9.40128L7.9098 27.5178H7.85298L6.36151 30H4.60014L6.87642 26.3636L4.64276 22.7273H6.38636ZM12.093 30V22.7273H13.6307V28.7322H16.7486V30H12.093ZM21.7122 24.8189C21.6838 24.5324 21.5618 24.3099 21.3464 24.1513C21.131 23.9927 20.8386 23.9134 20.4693 23.9134C20.2183 23.9134 20.0065 23.9489 19.8336 24.0199C19.6608 24.0885 19.5282 24.1844 19.4359 24.3075C19.3459 24.4306 19.301 24.5703 19.301 24.7266C19.2962 24.8568 19.3234 24.9704 19.3826 25.0675C19.4442 25.1645 19.5282 25.2486 19.6348 25.3196C19.7413 25.3883 19.8644 25.4486 20.0041 25.5007C20.1438 25.5504 20.2929 25.593 20.4515 25.6286L21.1049 25.7848C21.4222 25.8558 21.7134 25.9505 21.9785 26.0689C22.2437 26.1873 22.4733 26.3329 22.6674 26.5057C22.8616 26.6785 23.0119 26.8821 23.1184 27.1165C23.2273 27.3509 23.283 27.6196 23.2853 27.9226C23.283 28.3677 23.1693 28.7536 22.9444 29.0803C22.7219 29.4046 22.3999 29.6567 21.9785 29.8366C21.5595 30.0142 21.054 30.103 20.4622 30.103C19.8751 30.103 19.3637 30.013 18.9281 29.8331C18.4949 29.6532 18.1563 29.3868 17.9125 29.0341C17.671 28.679 17.5443 28.2398 17.5325 27.7166H19.0204C19.037 27.9605 19.1068 28.1641 19.2299 28.3274C19.3554 28.4884 19.5223 28.6103 19.7306 28.6932C19.9413 28.7737 20.1793 28.8139 20.4444 28.8139C20.7048 28.8139 20.9309 28.776 21.1227 28.7003C21.3168 28.6245 21.4672 28.5192 21.5737 28.3842C21.6802 28.2493 21.7335 28.0942 21.7335 27.919C21.7335 27.7557 21.685 27.6184 21.5879 27.5071C21.4932 27.3958 21.3535 27.3011 21.1689 27.223C20.9866 27.1449 20.7628 27.0739 20.4977 27.0099L19.7058 26.8111C19.0926 26.6619 18.6085 26.4287 18.2534 26.1115C17.8983 25.7943 17.7219 25.367 17.7243 24.8295C17.7219 24.3892 17.8391 24.0045 18.0758 23.6754C18.3149 23.3464 18.6428 23.0895 19.0595 22.9048C19.4761 22.7202 19.9496 22.6278 20.4799 22.6278C21.0197 22.6278 21.4908 22.7202 21.8933 22.9048C22.2981 23.0895 22.613 23.3464 22.8379 23.6754C23.0628 24.0045 23.1788 24.3857 23.1859 24.8189H21.7122Z" fill="white"/>
+</svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/spreadsheet-icon.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/spreadsheet-icon.svg
new file mode 100644
index 000000000000..aae0f99967a1
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/spreadsheet-icon.svg
@@ -0,0 +1,12 @@
+<svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4 4C4 1.79086 5.79086 0 8 0H24L36 12V36C36 38.2091 34.2091 40 32 40H8C5.79086 40 4 38.2091 4 36V4Z" fill="#079455"/>
+<path opacity="0.3" d="M24 0L36 12H28C25.7909 12 24 10.2091 24 8V0Z" fill="white"/>
+<g clip-path="url(#clip0_381_8488)">
+<path d="M12.7998 24.8H27.1998M12.7998 24.8V21.6C12.7998 20.7163 13.5161 20 14.3998 20H17.5998M12.7998 24.8V28C12.7998 28.8837 13.5161 29.6 14.3998 29.6H17.5998M27.1998 24.8V28C27.1998 28.8837 26.4835 29.6 25.5998 29.6H17.5998M27.1998 24.8V21.6C27.1998 20.7163 26.4835 20 25.5998 20H17.5998M17.5998 20V29.6" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_381_8488">
+<rect width="16" height="16" fill="white" transform="translate(12 16)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/AppRouter/AuthenticatedAppRouter.tsx b/openmetadata-ui/src/main/resources/ui/src/components/AppRouter/AuthenticatedAppRouter.tsx
index a04894127331..e60bca505fa9 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/AppRouter/AuthenticatedAppRouter.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/AppRouter/AuthenticatedAppRouter.tsx
@@ -309,6 +309,10 @@ const AddObservabilityPage = withSuspenseFallback(
   )
 );
 
+const ContextCenterRouter = withSuspenseFallback(
+  React.lazy(() => import('./ContextCenterRouter/ContextCenterRouter'))
+);
+
 const KnowledgeCenterPage = withSuspenseFallback(
   React.lazy(
     () => import('../../pages/KnowledgeCenterPage/KnowledgeCenterPage')
@@ -873,6 +877,10 @@ const AuthenticatedAppRouter: FunctionComponent = () => {
         element={<KnowledgeCenterFilterPage />}
         path={ROUTES.KNOWLEDGE_CENTER_FILTER}
       />
+      <Route
+        element={<ContextCenterRouter />}
+        path={`${ROUTES.CONTEXT_CENTER}/*`}
+      />
       <Route element={<Navigate to={ROUTES.NOT_FOUND} />} path="*" />
     </Routes>
   );
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/AppRouter/ContextCenterRouter/ContextCenterRouter.tsx b/openmetadata-ui/src/main/resources/ui/src/components/AppRouter/ContextCenterRouter/ContextCenterRouter.tsx
new file mode 100644
index 000000000000..020159e37588
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/AppRouter/ContextCenterRouter/ContextCenterRouter.tsx
@@ -0,0 +1,117 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import React from 'react';
+import { Navigate, Route, Routes } from 'react-router-dom';
+import { ROUTES } from '../../../constants/constants';
+import withSuspenseFallback from '../withSuspenseFallback';
+
+const ContextCenterDashboardPage = withSuspenseFallback(
+  React.lazy(
+    () =>
+      import(
+        '../../../pages/ContextCenterPage/ContextCenterDashboardPage/ContextCenterDashboardPage'
+      )
+  )
+);
+
+const ContextCenterArticlesPage = withSuspenseFallback(
+  React.lazy(
+    () =>
+      import(
+        '../../../pages/ContextCenterPage/ContextCenterArticlesPage/ContextCenterArticlesPage'
+      )
+  )
+);
+
+const ContextCenterDocumentsPage = withSuspenseFallback(
+  React.lazy(
+    () =>
+      import(
+        '../../../pages/ContextCenterPage/ContextCenterDocumentsPage/ContextCenterDocumentsPage'
+      )
+  )
+);
+{
+  /* TODO: In progress */
+}
+
+// const ContextCenterIntegrationsPage = withSuspenseFallback(
+//   React.lazy(
+//     () =>
+//       import(
+//         '../../../pages/ContextCenterPage/ContextCenterIntegrationsPage/ContextCenterIntegrationsPage'
+//       )
+//   )
+// );
+
+// const ContextCenterArchivePage = withSuspenseFallback(
+//   React.lazy(
+//     () =>
+//       import(
+//         '../../../pages/ContextCenterPage/ContextCenterArchivePage/ContextCenterArchivePage'
+//       )
+//   )
+// );
+
+const ContextCenterRouter = () => {
+  return (
+    <Routes>
+      <Route
+        element={<Navigate replace to={ROUTES.CONTEXT_CENTER_DASHBOARD} />}
+        path="/"
+      />
+      <Route
+        element={<ContextCenterDashboardPage />}
+        path={ROUTES.CONTEXT_CENTER_DASHBOARD.replace(
+          ROUTES.CONTEXT_CENTER,
+          ''
+        )}
+      />
+      {[
+        ROUTES.CONTEXT_CENTER_ARTICLES,
+        ROUTES.CONTEXT_CENTER_ARTICLE_DETAIL,
+        ROUTES.CONTEXT_CENTER_ARTICLE_DETAIL_WITH_TAB,
+        ROUTES.CONTEXT_CENTER_ARTICLE_DETAIL_WITH_SUB_TAB,
+        ROUTES.CONTEXT_CENTER_ARTICLE_VERSION,
+      ].map((route) => (
+        <Route
+          element={<ContextCenterArticlesPage />}
+          key={route}
+          path={route.replace(ROUTES.CONTEXT_CENTER, '')}
+        />
+      ))}
+      <Route
+        element={<ContextCenterDocumentsPage />}
+        path={ROUTES.CONTEXT_CENTER_DOCUMENTS.replace(
+          ROUTES.CONTEXT_CENTER,
+          ''
+        )}
+      />
+      {/* TODO: In progress */}
+      {/* <Route
+        element={<ContextCenterIntegrationsPage />}
+        path={ROUTES.CONTEXT_CENTER_INTEGRATIONS.replace(
+          ROUTES.CONTEXT_CENTER,
+          ''
+        )}
+      />
+      <Route
+        element={<ContextCenterArchivePage />}
+        path={ROUTES.CONTEXT_CENTER_ARCHIVE.replace(ROUTES.CONTEXT_CENTER, '')}
+      /> */}
+    </Routes>
+  );
+};
+
+export default ContextCenterRouter;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleCard/ArticleCard.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleCard/ArticleCard.component.tsx
new file mode 100644
index 000000000000..e167aa6a3b79
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleCard/ArticleCard.component.tsx
@@ -0,0 +1,86 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { Badge, Card, Typography } from '@openmetadata/ui-core-components';
+import RichTextEditorPreviewerV1 from 'components/common/RichTextEditor/RichTextEditorPreviewerV1';
+import { FC } from 'react';
+import { useTranslation } from 'react-i18next';
+import { getFrontEndFormat } from 'utils/FeedUtils';
+import { getShortRelativeTime } from '../../../utils/date-time/DateTimeUtils';
+import { ArticleCardItem, ArticleCardProps } from './ArticleCard.interface';
+
+const badgeColorMap: Record<
+  NonNullable<ArticleCardItem['badge']>,
+  'error' | 'brand'
+> = {
+  sensitive: 'error',
+  new: 'brand',
+};
+
+const ArticleCard: FC<ArticleCardProps> = ({ article, onClick }) => {
+  const { t } = useTranslation();
+  const { title, description, badge, lastEditedAt, tags = [] } = article;
+
+  return (
+    <Card
+      isClickable
+      className="tw:p-4 tw:flex tw:flex-col tw:bg-gray-50 tw:border-none tw:max-w-86"
+      data-testid="article-card"
+      onClick={() => onClick?.(article)}>
+      <div className="tw:flex tw:items-center tw:justify-between tw:w-full tw:mb-3">
+        {badge && (
+          <Badge
+            className="tw:ring-0"
+            color={badgeColorMap[badge]}
+            size="md"
+            type="color">
+            {badge}
+          </Badge>
+        )}
+        {!badge && <span />}
+        {lastEditedAt !== undefined && (
+          <Typography className="tw:text-gray-400" size="text-xs">
+            {t('label.last-updated')} {getShortRelativeTime(lastEditedAt)}
+          </Typography>
+        )}
+      </div>
+
+      <Typography ellipsis weight="bold">
+        {title}
+      </Typography>
+
+      <RichTextEditorPreviewerV1
+        showReadMoreBtn
+        className="max-two-lines tw:text-gray-500 tw:text-xs"
+        markdown={getFrontEndFormat(description)}
+      />
+
+      {tags.length > 0 && (
+        <div className="tw:flex tw:flex-wrap tw:gap-1 tw:mt-3">
+          {tags.map((tag) => (
+            <Badge
+              className="tw:bg-gray-200 tw:ring-0"
+              color="gray"
+              key={tag.label}
+              size="md"
+              type="color">
+              {tag.label}
+            </Badge>
+          ))}
+        </div>
+      )}
+    </Card>
+  );
+};
+
+export default ArticleCard;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleCard/ArticleCard.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleCard/ArticleCard.interface.ts
new file mode 100644
index 000000000000..7d6a71aed4d1
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleCard/ArticleCard.interface.ts
@@ -0,0 +1,33 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+export type ArticleCardBadge = 'new' | 'sensitive';
+
+export interface ArticleCardTag {
+  label: string;
+}
+
+export interface ArticleCardItem {
+  id: string;
+  title: string;
+  description: string;
+  badge?: ArticleCardBadge;
+  lastEditedAt?: number;
+  tags?: ArticleCardTag[];
+  href?: string;
+}
+
+export interface ArticleCardProps {
+  article: ArticleCardItem;
+  onClick?: (article: ArticleCardItem) => void;
+}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleDetailHeader/ArticleDetailHeader.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleDetailHeader/ArticleDetailHeader.component.tsx
new file mode 100644
index 000000000000..022e6eb9b009
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleDetailHeader/ArticleDetailHeader.component.tsx
@@ -0,0 +1,609 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import {
+  Badge,
+  Button,
+  ButtonUtility,
+  Card,
+  Dot,
+  Skeleton,
+  Tabs,
+  Tooltip,
+  TooltipTrigger,
+  Typography,
+} from '@openmetadata/ui-core-components';
+import {
+  DotsVertical,
+  File06,
+  Globe01,
+  Home02,
+  MessageChatSquare,
+  Share07,
+  ThumbsDown,
+  ThumbsUp,
+  UploadCloud01,
+  User03,
+} from '@untitledui/icons';
+import Loader from 'components/common/Loader/Loader';
+import { EntityStatusBadge } from 'components/Entity/EntityStatusBadge/EntityStatusBadge.component';
+import { EntityStatus } from 'generated/governance/workflows/elements/nodes/automatedTask/setGlossaryTermStatusTask';
+import { isEmpty, isUndefined, toString, uniqBy } from 'lodash';
+import { FC, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useNavigate } from 'react-router-dom';
+import { ReactComponent as EditorIcon } from '../../../assets/svg/ic-editor.svg';
+import { ReactComponent as SidebarCollapsible } from '../../../assets/svg/ic-sidebar-collapsible.svg';
+import { ReactComponent as StarFilledIcon } from '../../../assets/svg/ic-star-filled.svg';
+import { ReactComponent as StarIcon } from '../../../assets/svg/ic-star.svg';
+import { ReactComponent as VersionIcon } from '../../../assets/svg/ic-version.svg';
+import { DeleteType } from '../../../components/common/DeleteWidget/DeleteWidget.interface';
+import ManageButton from '../../../components/common/EntityPageInfos/ManageButton/ManageButton';
+import UserPopOverCard from '../../../components/common/PopOverCard/UserPopOverCard';
+import TabsLabel from '../../../components/common/TabsLabel/TabsLabel.component';
+import TitleBreadcrumb from '../../../components/common/TitleBreadcrumb/TitleBreadcrumb.component';
+import { QueryVoteType } from '../../../components/Database/TableQueries/TableQueries.interface';
+import { ROUTES } from '../../../constants/constants';
+import { EntityField } from '../../../constants/Feeds.constants';
+import { EntityTabs, EntityType } from '../../../enums/entity.enum';
+import { useCurrentUserPreferences } from '../../../hooks/currentUserStore/useCurrentUserStore';
+import { useApplicationStore } from '../../../hooks/useApplicationStore';
+import { useClipboard } from '../../../hooks/useClipBoard';
+import { useFqn } from '../../../hooks/useFqn';
+import {
+  ContentChangeState,
+  RecentlyViewedQuickLinks,
+} from '../../../interface/knowledge-center.interface';
+import deleteWidgetClassBase from '../../../utils/DeleteWidget/DeleteWidgetClassBase';
+import EntityLink from '../../../utils/EntityLink';
+import { getEntityName } from '../../../utils/EntityUtils';
+import {
+  getContextCenterArticleVersionsPath,
+  updateKnowledgeCenterRecentViewed,
+} from '../../../utils/KnowledgePageUtils';
+import { ArticleDetailHeaderProps } from './ArticleDetailHeader.interface';
+
+const ArticleDetailHeader: FC<ArticleDetailHeaderProps> = ({
+  knowledgePage,
+  contentChangeState,
+  permissions,
+  tabs,
+  activeTab,
+  isRightPanelOpen,
+  feedCount,
+  onTabChange,
+  onToggleRightPanel,
+  onVoteChange,
+  onFollowChange,
+  onToggleDelete,
+  onSave,
+  onSetThreadLink,
+  fetchKnowledgePageHierarchy,
+}) => {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+  const { fqn } = useFqn();
+  const { currentUser } = useApplicationStore();
+  const USERId = currentUser?.id ?? '';
+  const [copyTooltip, setCopyTooltip] = useState<string>('');
+  const [isFollowLoading, setIsFollowLoading] = useState(false);
+  const [voteLoading, setVoteLoading] = useState<QueryVoteType | null>(null);
+  const { onCopyToClipBoard } = useClipboard(window.location.href);
+  const {
+    preferences: { recentlyViewedQuickLinks },
+  } = useCurrentUserPreferences();
+  const recentlyViewed =
+    recentlyViewedQuickLinks as unknown as RecentlyViewedQuickLinks['data'];
+
+  const breadcrumbs = useMemo(
+    () => [
+      {
+        name: '',
+        icon: <Home02 size={14} />,
+        url: '/',
+        activeTitle: true,
+      },
+      { name: t('label.context-center'), url: ROUTES.CONTEXT_CENTER },
+      {
+        name: t('label.article-plural'),
+        url: ROUTES.CONTEXT_CENTER_ARTICLES,
+      },
+      {
+        activeTitle: true,
+        name: getEntityName(knowledgePage) || t('label.untitled'),
+        url: '',
+      },
+    ],
+    [knowledgePage?.displayName, t]
+  );
+
+  const voteStatus = useMemo(() => {
+    if (isUndefined(knowledgePage?.votes)) {
+      return QueryVoteType.unVoted;
+    }
+    const upVoters = knowledgePage?.votes.upVoters ?? [];
+    const downVoters = knowledgePage?.votes.downVoters ?? [];
+    if (upVoters.some((u) => u.id === USERId)) {
+      return QueryVoteType.votedUp;
+    }
+    if (downVoters.some((u) => u.id === USERId)) {
+      return QueryVoteType.votedDown;
+    }
+
+    return QueryVoteType.unVoted;
+  }, [knowledgePage, USERId]);
+
+  const version = toString(knowledgePage?.version ?? '0.1');
+
+  const isFollowing = useMemo(
+    () => Boolean(knowledgePage?.followers?.some(({ id }) => id === USERId)),
+    [knowledgePage?.followers, USERId]
+  );
+
+  const editors = useMemo(() => {
+    const list = uniqBy(
+      [...(knowledgePage?.editors ?? []), { name: knowledgePage?.updatedBy }],
+      'name'
+    );
+
+    return list.slice(0, 5);
+  }, [knowledgePage]);
+
+  const domains = knowledgePage?.domains ?? [];
+  const owners = knowledgePage?.owners ?? [];
+  const firstDomain = domains[0];
+  const extraDomains = domains.slice(1);
+
+  const entityName = getEntityName(knowledgePage);
+  const entityType = t('label.article');
+
+  const deleteOptions = [
+    {
+      description: deleteWidgetClassBase.getDeleteMessage(
+        entityName,
+        entityType
+      ),
+      isAllowed: true,
+      title: `${t('label.permanently-delete')} ${entityType} "${entityName}"`,
+      type: DeleteType.HARD_DELETE,
+    },
+  ];
+
+  const afterDeleteAction = async (isSoftDelete?: boolean) => {
+    updateKnowledgeCenterRecentViewed(
+      recentlyViewed.filter((page) => page.id !== knowledgePage?.id)
+    );
+    await fetchKnowledgePageHierarchy?.(true);
+    if (isSoftDelete) {
+      onToggleDelete();
+    } else {
+      navigate(ROUTES.CONTEXT_CENTER_ARTICLES);
+    }
+  };
+
+  const handleVersionClick = () => {
+    navigate(getContextCenterArticleVersionsPath(fqn, version));
+  };
+
+  const handleShare = async () => {
+    await onCopyToClipBoard();
+    setCopyTooltip(t('message.copy-to-clipboard'));
+    setTimeout(() => setCopyTooltip(''), 2000);
+  };
+
+  const handleFollowClick = async () => {
+    setIsFollowLoading(true);
+    await onFollowChange();
+    setIsFollowLoading(false);
+  };
+
+  const handleVoteChange = async (type: QueryVoteType) => {
+    const updatedVoteType = voteStatus === type ? QueryVoteType.unVoted : type;
+    setVoteLoading(type);
+    await onVoteChange({ updatedVoteType });
+    setVoteLoading(null);
+  };
+
+  const handleOpenConversation = () => {
+    onSetThreadLink(
+      EntityLink.getEntityLink(
+        EntityType.KNOWLEDGE_PAGE,
+        knowledgePage?.fullyQualifiedName ?? '',
+        EntityField.DESCRIPTION
+      )
+    );
+  };
+
+  const entityStatusBadge = useMemo(() => {
+    const shouldShowStatus = true;
+    const entityStatus = knowledgePage?.entityStatus;
+
+    if (
+      !shouldShowStatus ||
+      !entityStatus ||
+      entityStatus === EntityStatus.Unprocessed
+    ) {
+      return null;
+    }
+
+    return <EntityStatusBadge showDivider={false} status={entityStatus} />;
+  }, [knowledgePage?.entityStatus]);
+
+  const contentChangeIcon = useMemo(() => {
+    if (contentChangeState === ContentChangeState.SAVED) {
+      return (
+        <div data-testid="content-change-state">
+          <Badge
+            className="tw:flex tw:items-center tw:gap-2 tw:ring-0"
+            color="success"
+            size="lg"
+            type="color">
+            <UploadCloud01 size={16} />{' '}
+            <Typography weight="medium">{t('label.saved')}</Typography>
+          </Badge>
+        </div>
+      );
+    } else if (contentChangeState === ContentChangeState.SAVING) {
+      return <Loader size="x-small" />;
+    } else if (contentChangeState === ContentChangeState.UN_SAVED) {
+      return (
+        <div data-testid="content-change-state">
+          <Badge
+            className="tw:flex tw:items-center tw:gap-2 tw:ring-0"
+            color="gray"
+            size="lg"
+            type="color">
+            <UploadCloud01 size={16} />{' '}
+            <Typography weight="medium">{t('label.unsaved')}</Typography>
+          </Badge>
+        </div>
+      );
+    } else {
+      return null;
+    }
+  }, [contentChangeState]);
+
+  const showSaveButton =
+    Boolean(onSave) &&
+    contentChangeState === ContentChangeState.UN_SAVED &&
+    (permissions.EditAll ||
+      permissions.EditDescription ||
+      permissions.EditDisplayName);
+
+  if (!knowledgePage && !tabs) {
+    return (
+      <div
+        className="tw:flex tw:flex-col tw:gap-3 tw:px-6 tw:py-4"
+        data-testid="article-detail-header-skeleton">
+        <Skeleton height={20} variant="rounded" width={300} />
+        <Card className="tw:mb-0">
+          <div className="tw:flex tw:items-center tw:justify-between tw:mb-3">
+            <Skeleton height={28} variant="rounded" width={250} />
+            <div className="tw:flex tw:items-center tw:gap-2">
+              <Skeleton height={32} variant="rounded" width={80} />
+              <Skeleton height={32} variant="rounded" width={32} />
+              <Skeleton height={32} variant="rounded" width={32} />
+            </div>
+          </div>
+          <Skeleton height={16} variant="rounded" width={180} />
+        </Card>
+      </div>
+    );
+  }
+
+  return (
+    <div
+      className="tw:flex tw:flex-col tw:gap-3 tw:mb-5"
+      data-testid="article-detail-header">
+      <TitleBreadcrumb useCustomArrow titleLinks={breadcrumbs} />
+
+      <Card className="tw:mb-0 tw:p-6 tw:pb-0">
+        {/* Row 1: title + meta + actions */}
+        <div className="tw:flex tw:items-start tw:justify-between tw:mb-6">
+          <div className="tw:flex tw:gap-4 tw:items-stretch tw:p-2">
+            <div className="h:full tw:w-auto tw:shrink-0 tw:bg-gray-100 tw:rounded-xl tw:flex tw:items-center tw:p-2">
+              <File06
+                className="tw:text-gray-500"
+                height={40}
+                style={{ verticalAlign: 'middle', flexShrink: 0 }}
+                width={40}
+              />
+            </div>
+
+            <div className="tw:flex tw:flex-col tw:gap-2 tw:min-w-0">
+              {/* Article name with icon */}
+              <div className="tw:flex tw:items-center tw:gap-2 tw:flex-wrap">
+                <Typography as="h3" className="tw:truncate">
+                  {getEntityName(knowledgePage) || t('label.untitled')}
+                </Typography>
+                {entityStatusBadge}
+              </div>
+
+              {/* Domain · Owner row */}
+              <div className="tw:flex tw:items-center tw:gap-2 tw:flex-wrap tw:text-sm">
+                {/* Domain */}
+                <div className="tw:flex tw:items-center tw:gap-1.5">
+                  <Globe01
+                    className="tw:h-4 tw:w-4 tw:shrink-0 tw:text-fg-disabled"
+                    size={16}
+                  />
+                  <Typography
+                    className={
+                      firstDomain ? 'tw:text-primary-900' : 'tw:text-gray-400'
+                    }
+                    size="text-sm"
+                    weight="regular">
+                    {firstDomain
+                      ? firstDomain.displayName ?? firstDomain.name
+                      : t('label.add-entity', { entity: t('label.domain') })}
+                  </Typography>
+                  {extraDomains.length > 0 && (
+                    <span className="tw:inline-flex tw:items-center tw:rounded-full tw:bg-gray-100 tw:px-1.5 tw:py-0.5 tw:text-xs tw:font-medium tw:text-gray-600">
+                      +{extraDomains.length}
+                    </span>
+                  )}
+                </div>
+
+                {/* Dot separator */}
+                <Dot className="tw:text-gray-400" size="xs" />
+
+                {/* Owners */}
+                <div className="tw:flex tw:items-center tw:gap-1.5">
+                  <User03
+                    className="tw:h-4 tw:w-4 tw:shrink-0 tw:text-fg-disabled"
+                    size={16}
+                  />
+                  {owners.length > 0 ? (
+                    <div className="tw:flex tw:items-center tw:gap-1">
+                      {owners.slice(0, 2).map((owner) => (
+                        <UserPopOverCard
+                          className="tw:m-0"
+                          key={owner.id}
+                          profileWidth={20}
+                          userName={owner.name ?? ''}
+                        />
+                      ))}
+                      {owners.length > 2 && (
+                        <Typography
+                          className="tw:inline-flex tw:items-center tw:rounded-full tw:bg-gray-100 tw:px-1.5 tw:py-0.5 tw:text-gray-600"
+                          size="text-xs"
+                          weight="medium">
+                          +{owners.length - 2}
+                        </Typography>
+                      )}
+                    </div>
+                  ) : (
+                    <Typography
+                      className="tw:text-gray-400"
+                      size="text-sm"
+                      weight="regular">
+                      {t('label.add-entity', { entity: t('label.owner') })}
+                    </Typography>
+                  )}
+                </div>
+
+                {/* Editors */}
+                {editors.length > 0 && (
+                  <>
+                    <Dot className="tw:text-gray-400" size="xs" />
+                    <div className="tw:flex tw:items-center tw:gap-1.5">
+                      <EditorIcon
+                        className="tw:h-4 tw:w-4 tw:shrink-0 tw:text-fg-disabled"
+                        height={16}
+                        width={16}
+                      />
+                      <div className="tw:flex tw:items-center tw:gap-0.5">
+                        {editors.map((user) => (
+                          <UserPopOverCard
+                            key={user.name}
+                            profileWidth={20}
+                            userName={user.name ?? ''}
+                          />
+                        ))}
+                      </div>
+                    </div>
+                  </>
+                )}
+              </div>
+            </div>
+          </div>
+
+          {/* Action buttons */}
+          <div className="tw:flex tw:items-center tw:gap-3 tw:shrink-0">
+            {contentChangeIcon}
+
+            {showSaveButton && (
+              <Button color="primary" size="sm" onClick={onSave}>
+                {t('label.save')}
+              </Button>
+            )}
+
+            <Tooltip title={t('label.version-plural')}>
+              <TooltipTrigger>
+                <Button
+                  className="tw:p-1.5"
+                  color="secondary"
+                  data-testid="version-btn"
+                  iconLeading={<VersionIcon height={16} width={16} />}
+                  size="sm"
+                  onClick={handleVersionClick}>
+                  {version}
+                </Button>
+              </TooltipTrigger>
+            </Tooltip>
+
+            {/* Up vote */}
+            <Tooltip title={t('label.up-vote')}>
+              <TooltipTrigger>
+                <ButtonUtility
+                  className={
+                    voteStatus === QueryVoteType.votedUp
+                      ? 'tw:text-brand-600'
+                      : undefined
+                  }
+                  color="secondary"
+                  disabled={knowledgePage?.deleted || voteLoading !== null}
+                  icon={
+                    <ThumbsUp
+                      className={
+                        voteStatus === QueryVoteType.votedUp
+                          ? 'tw:fill-blue-500 tw:stroke-white'
+                          : 'tw:fill-none'
+                      }
+                      height={18}
+                      width={18}
+                    />
+                  }
+                  onClick={() => handleVoteChange(QueryVoteType.votedUp)}
+                />
+              </TooltipTrigger>
+            </Tooltip>
+
+            {/* Down vote */}
+            <Tooltip title={t('label.down-vote')}>
+              <TooltipTrigger>
+                <ButtonUtility
+                  className={
+                    voteStatus === QueryVoteType.votedDown
+                      ? 'tw:text-brand-600'
+                      : undefined
+                  }
+                  color="secondary"
+                  disabled={knowledgePage?.deleted || voteLoading !== null}
+                  icon={
+                    <ThumbsDown
+                      className={
+                        voteStatus === QueryVoteType.votedDown
+                          ? 'tw:fill-blue-500 tw:stroke-white'
+                          : 'tw:fill-none'
+                      }
+                      height={18}
+                      width={18}
+                    />
+                  }
+                  onClick={() => handleVoteChange(QueryVoteType.votedDown)}
+                />
+              </TooltipTrigger>
+            </Tooltip>
+
+            <Tooltip title={t('label.conversation')}>
+              <TooltipTrigger>
+                <ButtonUtility
+                  color="secondary"
+                  data-testid="conversation"
+                  icon={<MessageChatSquare height={20} width={20} />}
+                  onClick={handleOpenConversation}
+                />
+              </TooltipTrigger>
+            </Tooltip>
+
+            <Tooltip
+              title={isFollowing ? t('label.un-follow') : t('label.follow')}>
+              <TooltipTrigger>
+                <ButtonUtility
+                  className={isFollowing ? 'tw:text-brand-600' : undefined}
+                  color="secondary"
+                  disabled={isFollowLoading || knowledgePage?.deleted}
+                  icon={isFollowing ? StarFilledIcon : StarIcon}
+                  onClick={handleFollowClick}
+                />
+              </TooltipTrigger>
+            </Tooltip>
+
+            <Tooltip
+              isOpen={isEmpty(copyTooltip) ? undefined : true}
+              title={isEmpty(copyTooltip) ? t('label.share') : copyTooltip}>
+              <TooltipTrigger>
+                <ButtonUtility
+                  color="secondary"
+                  icon={<Share07 height={20} width={20} />}
+                  onClick={handleShare}
+                />
+              </TooltipTrigger>
+            </Tooltip>
+
+            <ManageButton
+              isRecursiveDelete
+              afterDeleteAction={afterDeleteAction}
+              allowSoftDelete={false}
+              canDelete={permissions.Delete}
+              deleteButtonDescription={t(
+                'message.delete-entity-type-action-description',
+                { entityType }
+              )}
+              deleteOptions={deleteOptions}
+              deleted={knowledgePage?.deleted}
+              entityFQN={knowledgePage?.fullyQualifiedName}
+              entityId={knowledgePage?.id}
+              entityName={knowledgePage?.displayName ?? t('label.untitled')}
+              entityType={EntityType.KNOWLEDGE_CENTER}
+              prepareType={false}
+              successMessage={t('server.entity-deleted-successfully', {
+                entity: entityType,
+              })}
+              trigger={(onClick) => (
+                <ButtonUtility
+                  data-testid="manage-button"
+                  icon={DotsVertical}
+                  size="sm"
+                  tooltip={t('label.manage-entity', {
+                    entity: t('label.article'),
+                  })}
+                  onClick={onClick}
+                />
+              )}
+            />
+          </div>
+        </div>
+
+        {/* Row 2: tab strip + right-panel toggle */}
+        <div className="tw:flex tw:items-center tw:justify-between">
+          <Tabs
+            className="tw:w-auto"
+            selectedKey={activeTab}
+            onSelectionChange={(key) => onTabChange?.(String(key))}>
+            <Tabs.List type="underline">
+              {tabs?.map((tab) => (
+                <Tabs.Item id={String(tab.key)} key={String(tab.key)}>
+                  <TabsLabel
+                    count={tab.key === 'activity_feed' ? feedCount : undefined}
+                    id={String(tab.key)}
+                    isActive={activeTab === String(tab.key)}
+                    name={tab.name}
+                  />
+                </Tabs.Item>
+              ))}
+            </Tabs.List>
+          </Tabs>
+
+          {activeTab !== EntityTabs.ACTIVITY_FEED && (
+            <ButtonUtility
+              className="tw:relative tw:bottom-2.5"
+              color="tertiary"
+              icon={
+                <SidebarCollapsible
+                  className={isRightPanelOpen ? undefined : 'tw:rotate-180'}
+                  height={18}
+                  width={18}
+                />
+              }
+              onClick={onToggleRightPanel}
+            />
+          )}
+        </div>
+      </Card>
+    </div>
+  );
+};
+
+export default ArticleDetailHeader;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleDetailHeader/ArticleDetailHeader.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleDetailHeader/ArticleDetailHeader.interface.ts
new file mode 100644
index 000000000000..b7425a639bde
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleDetailHeader/ArticleDetailHeader.interface.ts
@@ -0,0 +1,40 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { VotingDataProps } from 'components/Entity/Voting/voting.interface';
+import { OperationPermission } from 'context/PermissionProvider/PermissionProvider.interface';
+import {
+  ArticleTab,
+  ContentChangeState,
+  KnowledgePage,
+} from 'interface/knowledge-center.interface';
+
+export type { ArticleTab };
+
+export interface ArticleDetailHeaderProps {
+  knowledgePage?: KnowledgePage;
+  contentChangeState: ContentChangeState;
+  permissions: OperationPermission;
+  tabs?: ArticleTab[];
+  activeTab?: string;
+  isRightPanelOpen: boolean;
+  feedCount?: number;
+  onTabChange?: (key: string) => void;
+  onToggleRightPanel: () => void;
+  onVoteChange: (type: VotingDataProps) => Promise<void>;
+  onFollowChange: () => Promise<void>;
+  onToggleDelete: () => void;
+  onSave?: () => void;
+  onSetThreadLink: (link: string) => void;
+  fetchKnowledgePageHierarchy?: (forceRefresh?: boolean) => Promise<void>;
+}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleListSection/ArticleListSection.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleListSection/ArticleListSection.component.tsx
new file mode 100644
index 000000000000..fc6943e58424
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleListSection/ArticleListSection.component.tsx
@@ -0,0 +1,144 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import {
+  Button,
+  Card,
+  Skeleton,
+  Typography,
+} from '@openmetadata/ui-core-components';
+import { ArrowUpRight, File06 } from '@untitledui/icons';
+import ErrorPlaceHolder from 'components/common/ErrorWithPlaceholder/ErrorPlaceHolder';
+import { ERROR_PLACEHOLDER_TYPE } from 'enums/common.enum';
+import { FC, useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useNavigate } from 'react-router-dom';
+import { getKnowledgePagePath } from 'utils/KnowledgePageUtils';
+import ArticleCard from '../ArticleCard/ArticleCard.component';
+import { ArticleCardItem } from '../ArticleCard/ArticleCard.interface';
+import { ArticleListSectionProps } from './ArticleListSection.interface';
+
+const ArticleCardSkeleton: FC = () => (
+  <Card className="tw:flex tw:flex-col tw:gap-3 tw:p-4">
+    <div className="tw:flex tw:justify-between tw:gap-4">
+      <Skeleton height="20px" variant="rounded" width="64px" />
+      <Skeleton height="16px" variant="rounded" width="96px" />
+    </div>
+    <Skeleton height="16px" variant="rounded" width="75%" />
+    <Skeleton height="12px" variant="rounded" width="100%" />
+    <Skeleton height="12px" variant="rounded" width="83%" />
+    <div className="tw:flex tw:gap-1">
+      <Skeleton height="20px" variant="rounded" width="56px" />
+      <Skeleton height="20px" variant="rounded" width="40px" />
+    </div>
+  </Card>
+);
+
+const ArticleListSection: FC<ArticleListSectionProps> = ({
+  title,
+  subtitle,
+  articles,
+  viewAllHref,
+  getPagePath,
+  onViewAll,
+  onArticleClick,
+  isLoading = false,
+}) => {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+
+  const handleArticleClick = useCallback(
+    (article: ArticleCardItem) => {
+      if (onArticleClick) {
+        onArticleClick(article);
+
+        return;
+      }
+
+      if (article.href) {
+        if (article.href.startsWith('http')) {
+          window.open(article.href, '_blank', 'noopener,noreferrer');
+
+          return;
+        }
+
+        navigate(article.href);
+
+        return;
+      }
+
+      const path = getPagePath
+        ? getPagePath(article.id)
+        : getKnowledgePagePath(article.id);
+
+      navigate(path);
+    },
+    [onArticleClick, getPagePath, navigate]
+  );
+
+  return (
+    <Card
+      className="tw:p-6 tw:overflow-y-scroll tw:h-[calc(50vh-138px)]"
+      data-testid="article-list-section">
+      <div className="tw:flex tw:items-center tw:justify-between tw:pb-5">
+        <div className="tw:flex tw:items-center tw:gap-3">
+          <div className="tw:p-3 tw:rounded-lg tw:bg-gray-blue-50">
+            <File06 className="tw:text-grey-600" height={20} width={20} />
+          </div>
+          <div className="tw:flex tw:flex-col">
+            <Typography size="text-md" weight="bold">
+              {title}
+            </Typography>
+            {subtitle && (
+              <Typography className="tw:text-grey-500" size="text-xs">
+                {subtitle}
+              </Typography>
+            )}
+          </div>
+        </div>
+
+        {(viewAllHref || onViewAll) && (
+          <Button
+            color="link-color"
+            iconTrailing={<ArrowUpRight className="tw:w-4 tw:h-4" />}
+            onClick={onViewAll}>
+            {t('label.view-all')} {t('label.article-plural')}
+          </Button>
+        )}
+      </div>
+
+      {articles.length > 0 || isLoading ? (
+        <div className="tw:grid tw:grid-cols-[repeat(auto-fill,320px)]  tw:gap-4">
+          {isLoading
+            ? Array.from({ length: 6 }).map((_, idx) => (
+                <ArticleCardSkeleton key={idx} />
+              ))
+            : articles.map((article: ArticleCardItem) => (
+                <ArticleCard
+                  article={article}
+                  key={article.id}
+                  onClick={handleArticleClick}
+                />
+              ))}
+        </div>
+      ) : (
+        <ErrorPlaceHolder
+          className="tw:border-0 tw:h-auto"
+          type={ERROR_PLACEHOLDER_TYPE.NO_DATA}
+        />
+      )}
+    </Card>
+  );
+};
+
+export default ArticleListSection;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleListSection/ArticleListSection.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleListSection/ArticleListSection.interface.ts
new file mode 100644
index 000000000000..31ba02bedba8
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleListSection/ArticleListSection.interface.ts
@@ -0,0 +1,25 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { ArticleCardItem } from '../ArticleCard/ArticleCard.interface';
+
+export interface ArticleListSectionProps {
+  title: string;
+  subtitle?: string;
+  articles: ArticleCardItem[];
+  viewAllHref?: string;
+  getPagePath?: (fqn: string) => string;
+  onViewAll?: () => void;
+  onArticleClick?: (article: ArticleCardItem) => void;
+  isLoading?: boolean;
+}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleVersionHeader/ArticleVersionHeader.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleVersionHeader/ArticleVersionHeader.component.tsx
new file mode 100644
index 000000000000..380b928cd680
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ArticleVersionHeader/ArticleVersionHeader.component.tsx
@@ -0,0 +1,90 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { Card, Skeleton, Typography } from '@openmetadata/ui-core-components';
+import { File06, Home02 } from '@untitledui/icons';
+import { FC } from 'react';
+import { useTranslation } from 'react-i18next';
+import TitleBreadcrumb from '../../../components/common/TitleBreadcrumb/TitleBreadcrumb.component';
+import { ROUTES } from '../../../constants/constants';
+import { KnowledgePage } from '../../../interface/knowledge-center.interface';
+import { getEntityName } from '../../../utils/EntityUtils';
+
+interface ArticleVersionHeaderProps {
+  knowledgePage?: KnowledgePage;
+}
+
+const ArticleVersionHeader: FC<ArticleVersionHeaderProps> = ({
+  knowledgePage,
+}) => {
+  const { t } = useTranslation();
+
+  const breadcrumbs = [
+    {
+      name: '',
+      icon: <Home02 size={14} />,
+      url: '/',
+      activeTitle: true,
+    },
+    { name: t('label.context-center'), url: ROUTES.CONTEXT_CENTER },
+    {
+      name: t('label.article-plural'),
+      url: ROUTES.CONTEXT_CENTER_ARTICLES,
+    },
+    {
+      activeTitle: true,
+      name: getEntityName(knowledgePage) || t('label.untitled'),
+      url: '',
+    },
+  ];
+
+  if (!knowledgePage) {
+    return (
+      <div
+        className="tw:flex tw:flex-col tw:gap-3 tw:px-6 tw:py-4"
+        data-testid="article-version-header-skeleton">
+        <Skeleton height={20} variant="rounded" width={300} />
+        <Card className="tw:mb-0">
+          <Skeleton height={28} variant="rounded" width={250} />
+        </Card>
+      </div>
+    );
+  }
+
+  return (
+    <div
+      className="tw:flex tw:flex-col tw:gap-3 tw:mb-5"
+      data-testid="article-version-header">
+      <TitleBreadcrumb useCustomArrow titleLinks={breadcrumbs} />
+
+      <Card className="tw:mb-0 tw:p-6">
+        <div className="tw:flex tw:gap-4 tw:items-center">
+          <div className="tw:w-auto tw:shrink-0 tw:bg-gray-100 tw:rounded-xl tw:flex tw:items-center tw:p-2">
+            <File06
+              className="tw:text-gray-500"
+              height={40}
+              style={{ verticalAlign: 'middle', flexShrink: 0 }}
+              width={40}
+            />
+          </div>
+
+          <Typography as="h3">
+            {getEntityName(knowledgePage) || t('label.untitled')}
+          </Typography>
+        </div>
+      </Card>
+    </div>
+  );
+};
+
+export default ArticleVersionHeader;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterHeader/ContextCenterHeader.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterHeader/ContextCenterHeader.component.tsx
new file mode 100644
index 000000000000..1a2654ce9ea0
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterHeader/ContextCenterHeader.component.tsx
@@ -0,0 +1,77 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { Button, Card, Typography } from '@openmetadata/ui-core-components';
+import { Plus, UploadCloud02 } from '@untitledui/icons';
+import { FC } from 'react';
+import { useTranslation } from 'react-i18next';
+import TitleBreadcrumb from '../../common/TitleBreadcrumb/TitleBreadcrumb.component';
+import { ContextCenterHeaderProps } from './ContextCenterHeader.interface';
+
+const ContextCenterHeader: FC<ContextCenterHeaderProps> = ({
+  breadcrumbs,
+  title,
+  subtitle,
+  onCreateArticle,
+  onUploadFile,
+  actionsSlot,
+}) => {
+  const { t } = useTranslation();
+
+  const defaultActions = (
+    <div className="tw:flex tw:items-center tw:gap-3 tw:shrink-0">
+      {onCreateArticle && (
+        <Button
+          color="secondary"
+          iconLeading={Plus}
+          size="sm"
+          onClick={onCreateArticle}>
+          {t('label.create-entity', { entity: t('label.article') })}
+        </Button>
+      )}
+      {onUploadFile && (
+        <Button
+          color="primary"
+          iconLeading={UploadCloud02}
+          size="sm"
+          onClick={onUploadFile}>
+          {t('label.upload-file', { defaultValue: 'Upload File' })}
+        </Button>
+      )}
+    </div>
+  );
+
+  return (
+    <div
+      className="tw:flex tw:flex-col tw:gap-3"
+      data-testid="context-center-header">
+      <TitleBreadcrumb useCustomArrow titleLinks={breadcrumbs} />
+
+      <Card className="tw:mb-5 tw:p-5">
+        <div className="tw:flex tw:items-center tw:justify-between">
+          <div>
+            <div className="tw:mb-0.5 tw:flex tw:items-center tw:gap-2">
+              <Typography as="h3">{title}</Typography>
+            </div>
+            {subtitle && (
+              <Typography className="tw:text-gray-700">{subtitle}</Typography>
+            )}
+          </div>
+          {actionsSlot ?? defaultActions}
+        </div>
+      </Card>
+    </div>
+  );
+};
+
+export default ContextCenterHeader;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterHeader/ContextCenterHeader.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterHeader/ContextCenterHeader.interface.ts
new file mode 100644
index 000000000000..197d33907633
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterHeader/ContextCenterHeader.interface.ts
@@ -0,0 +1,25 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import React from 'react';
+import { TitleLink } from '../../common/TitleBreadcrumb/TitleBreadcrumb.interface';
+
+export interface ContextCenterHeaderProps {
+  breadcrumbs: TitleLink[];
+  title: string;
+  subtitle?: string;
+  onCreateArticle?: () => void;
+  onUploadFile?: () => void;
+  /** Replaces the default action buttons with a custom slot */
+  actionsSlot?: React.ReactNode;
+}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterSidebar/ContextCenterSidebar.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterSidebar/ContextCenterSidebar.component.tsx
new file mode 100644
index 000000000000..3f243c33d58c
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterSidebar/ContextCenterSidebar.component.tsx
@@ -0,0 +1,144 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { Menu01 } from '@untitledui/icons';
+import { FC } from 'react';
+import {
+  ContextCenterNavItem,
+  ContextCenterNavSection,
+  ContextCenterSidebarProps,
+} from './ContextCenterSidebar.interface';
+
+// ─── Nav Item ─────────────────────────────────────────────────────────────────
+
+interface NavItemProps {
+  item: ContextCenterNavItem;
+  isActive: boolean;
+  onItemClick?: (key: string) => void;
+}
+
+const NavItem: FC<NavItemProps> = ({ item, isActive, onItemClick }) => {
+  const { key, label, icon: Icon, count } = item;
+
+  return (
+    <button
+      className={[
+        'tw:w-full tw:flex tw:items-center tw:justify-between tw:gap-3 tw:px-3 tw:py-2.5 tw:rounded-lg tw:text-left tw:transition-colors tw:duration-100 tw:cursor-pointer tw:border-0',
+        isActive
+          ? 'tw:bg-[var(--color-bg-brand-secondary)] tw:text-[var(--color-text-brand)]'
+          : 'tw:bg-transparent tw:text-[var(--color-text-secondary)] tw:hover:bg-[var(--color-bg-secondary)] tw:hover:text-[var(--color-text-primary)]',
+      ].join(' ')}
+      data-testid={`context-center-nav-${key}`}
+      type="button"
+      onClick={() => {
+        item.onClick?.();
+        onItemClick?.(key);
+      }}>
+      <span className="tw:flex tw:items-center tw:gap-3 tw:min-w-0">
+        <Icon
+          className={[
+            'tw:w-5 tw:h-5 tw:flex-shrink-0',
+            isActive
+              ? 'tw:text-[var(--color-text-brand)]'
+              : 'tw:text-[var(--color-text-tertiary)]',
+          ].join(' ')}
+          strokeWidth={1.5}
+        />
+        <span className="tw:text-sm tw:font-medium tw:truncate">{label}</span>
+      </span>
+
+      {count !== undefined && (
+        <span
+          className={[
+            'tw:flex-shrink-0 tw:min-w-[24px] tw:h-6 tw:px-1.5 tw:rounded-full tw:text-xs tw:font-medium tw:flex tw:items-center tw:justify-center tw:border',
+            isActive
+              ? 'tw:bg-[var(--color-bg-brand-secondary)] tw:text-[var(--color-text-brand)] tw:border-[var(--color-border-brand)]'
+              : 'tw:bg-transparent tw:text-[var(--color-text-tertiary)] tw:border-[var(--color-border-primary)]',
+          ].join(' ')}>
+          {count}
+        </span>
+      )}
+    </button>
+  );
+};
+
+// ─── Nav Section ──────────────────────────────────────────────────────────────
+
+interface NavSectionProps {
+  section: ContextCenterNavSection;
+  activeKey?: string;
+  onItemClick?: (key: string) => void;
+}
+
+const NavSection: FC<NavSectionProps> = ({
+  section,
+  activeKey,
+  onItemClick,
+}) => (
+  <div
+    className="tw:flex tw:flex-col tw:gap-0.5"
+    data-testid={`context-center-section-${section.sectionKey}`}>
+    {section.sectionLabel && (
+      <p className="tw:text-xs tw:font-medium tw:text-[var(--color-text-tertiary)] tw:uppercase tw:tracking-wider tw:px-3 tw:py-1 tw:m-0">
+        {section.sectionLabel}
+      </p>
+    )}
+    {section.items.map((item) => (
+      <NavItem
+        isActive={activeKey === item.key}
+        item={item}
+        key={item.key}
+        onItemClick={onItemClick}
+      />
+    ))}
+  </div>
+);
+
+// ─── Sidebar ──────────────────────────────────────────────────────────────────
+
+const ContextCenterSidebar: FC<ContextCenterSidebarProps> = ({
+  title,
+  activeKey,
+  sections,
+  onItemClick,
+}) => (
+  <aside
+    className="tw:w-64 tw:flex-shrink-0 tw:flex tw:flex-col tw:gap-4 tw:p-4 tw:bg-[var(--color-bg-primary)] tw:border-r tw:border-[var(--color-border-primary)] tw:h-full tw:overflow-y-auto"
+    data-testid="context-center-sidebar">
+    <div className="tw:flex tw:items-center tw:justify-between tw:px-1">
+      <h2 className="tw:text-lg tw:font-bold tw:text-[var(--color-text-primary)] tw:m-0">
+        {title}
+      </h2>
+      <button
+        className="tw:p-1 tw:rounded-md tw:hover:text-[var(--color-text-primary)] tw:hover:bg-[var(--color-bg-secondary)] tw:border-0 tw:bg-transparent tw:cursor-pointer"
+        data-testid="context-center-sidebar-menu"
+        type="button">
+        <Menu01 className="tw:w-5 tw:h-5" />
+      </button>
+    </div>
+
+    <div className="tw:flex tw:flex-col tw:gap-5">
+      {sections.map((section) => (
+        <div key={section.sectionKey}>
+          <NavSection
+            activeKey={activeKey}
+            section={section}
+            onItemClick={onItemClick}
+          />
+        </div>
+      ))}
+    </div>
+  </aside>
+);
+
+export default ContextCenterSidebar;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterSidebar/ContextCenterSidebar.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterSidebar/ContextCenterSidebar.interface.ts
new file mode 100644
index 000000000000..0723ecba8849
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterSidebar/ContextCenterSidebar.interface.ts
@@ -0,0 +1,39 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import type { ComponentType, SVGAttributes } from 'react';
+
+export type IconComponent = ComponentType<
+  SVGAttributes<SVGElement> & { size?: number; strokeWidth?: number }
+>;
+
+export interface ContextCenterNavItem {
+  key: string;
+  label: string;
+  icon: IconComponent;
+  count?: number;
+  onClick?: () => void;
+}
+
+export interface ContextCenterNavSection {
+  sectionKey: string;
+  sectionLabel?: string;
+  items: ContextCenterNavItem[];
+}
+
+export interface ContextCenterSidebarProps {
+  title: string;
+  activeKey?: string;
+  sections: ContextCenterNavSection[];
+  onItemClick?: (key: string) => void;
+}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/DocumentsView/DocumentsView.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/DocumentsView/DocumentsView.component.tsx
new file mode 100644
index 000000000000..3ae23ca5f0e1
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/DocumentsView/DocumentsView.component.tsx
@@ -0,0 +1,238 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import {
+  ButtonUtility,
+  Card,
+  Dropdown,
+  Skeleton,
+  Typography,
+} from '@openmetadata/ui-core-components';
+import { Download01, Share07, Trash01 } from '@untitledui/icons';
+import { FC } from 'react';
+import { useTranslation } from 'react-i18next';
+import ErrorPlaceHolder from '../../../components/common/ErrorWithPlaceholder/ErrorPlaceHolder';
+import { ERROR_PLACEHOLDER_TYPE } from '../../../enums/common.enum';
+import {
+  DocFile,
+  DocFileType,
+  DocumentsViewProps,
+} from './DocumentsView.interface';
+
+// ─── File type badge ──────────────────────────────────────────────────────────
+
+const FILE_TYPE_STYLES: Record<
+  DocFileType,
+  { label: string; bg: string; text: string }
+> = {
+  csv: { bg: 'tw:bg-green-100', label: 'CSV', text: 'tw:text-green-700' },
+  doc: { bg: 'tw:bg-blue-100', label: 'DOC', text: 'tw:text-blue-700' },
+  image: { bg: 'tw:bg-gray-100', label: 'IMG', text: 'tw:text-gray-600' },
+  other: { bg: 'tw:bg-gray-100', label: 'FILE', text: 'tw:text-gray-600' },
+  pdf: { bg: 'tw:bg-red-100', label: 'PDF', text: 'tw:text-red-700' },
+  xls: { bg: 'tw:bg-green-100', label: 'XLSX', text: 'tw:text-green-700' },
+};
+
+const FileTypeBadge: FC<{ fileType: DocFileType }> = ({ fileType }) => {
+  const { bg, label, text } = FILE_TYPE_STYLES[fileType || 'other'];
+
+  return (
+    <span
+      className={`tw:inline-flex tw:items-center tw:justify-center tw:w-10 tw:h-10 tw:rounded-lg tw:text-xs tw:font-bold tw:shrink-0 ${bg} ${text}`}>
+      {label}
+    </span>
+  );
+};
+
+// ─── Actions dropdown ─────────────────────────────────────────────────────────
+
+interface FileActionsProps {
+  file: DocFile;
+  onShareFile?: (file: DocFile) => void;
+  onDeleteFile?: (file: DocFile) => void;
+}
+
+const FileActions: FC<FileActionsProps> = ({
+  file,
+  onDeleteFile,
+  onShareFile,
+}) => {
+  const { t } = useTranslation();
+
+  return (
+    <Dropdown.Root>
+      <Dropdown.DotsButton className="tw:flex tw:p-1 tw:rotate-z-90" />
+      <Dropdown.Popover>
+        <Dropdown.Menu
+          onAction={(key) => {
+            if (key === 'share') {
+              onShareFile?.(file);
+            } else if (key === 'delete') {
+              onDeleteFile?.(file);
+            }
+          }}>
+          <Dropdown.Item
+            data-testid="share-btn"
+            icon={Share07}
+            id="share"
+            label={t('label.share-file', { defaultValue: 'Share File' })}
+          />
+          <Dropdown.Item
+            data-testid="delete-btn"
+            icon={Trash01}
+            id="delete"
+            label={t('label.delete')}
+          />
+        </Dropdown.Menu>
+      </Dropdown.Popover>
+    </Dropdown.Root>
+  );
+};
+
+const FileRowSkeleton: FC = () => (
+  <div className="tw:flex tw:items-center tw:gap-4 tw:px-4 tw:py-3 tw:border-b tw:border-secondary">
+    {/* File type badge */}
+    <Skeleton
+      className="tw:shrink-0"
+      height="40px"
+      variant="rounded"
+      width="40px"
+    />
+
+    {/* File details */}
+    <div className="tw:flex tw:min-w-0 tw:flex-1 tw:flex-col tw:gap-2">
+      <Skeleton height="14px" variant="rounded" width="45%" />
+
+      <div className="tw:flex tw:items-center tw:gap-2">
+        <Skeleton height="12px" variant="rounded" width="56px" />
+        <Skeleton height="12px" variant="rounded" width="72px" />
+        <Skeleton height="12px" variant="rounded" width="96px" />
+      </div>
+    </div>
+
+    {/* Actions */}
+    <div className="tw:flex tw:items-center tw:gap-2 tw:shrink-0">
+      <Skeleton height="32px" variant="rounded" width="32px" />
+      <Skeleton height="32px" variant="rounded" width="32px" />
+    </div>
+  </div>
+);
+
+// ─── File row ─────────────────────────────────────────────────────────────────
+
+interface FileRowProps {
+  file: DocFile;
+  onDownload?: (file: DocFile) => void;
+  onShareFile?: (file: DocFile) => void;
+  onDeleteFile?: (file: DocFile) => void;
+}
+
+const FileRow: FC<FileRowProps> = ({
+  file,
+  onDeleteFile,
+  onDownload,
+  onShareFile,
+}) => (
+  <div
+    className="tw:flex tw:items-center tw:gap-4 tw:px-4 tw:py-3 tw:border-b tw:border-secondary"
+    data-testid={`document-row-${file.id}`}>
+    <FileTypeBadge fileType={file.fileType} />
+
+    <div className="tw:flex tw:min-w-0 tw:flex-1 tw:flex-col">
+      <Typography className="tw:truncate" size="text-sm" weight="medium">
+        {file.name}
+      </Typography>
+      <div className="tw:flex tw:items-center tw:gap-1">
+        <Typography className="tw:text-gray-500" size="text-xs">
+          {file.sizeLabel}
+        </Typography>
+        {file.uploadedBy && (
+          <>
+            <span className="tw:text-gray-500 tw:leading-none tw:select-none">
+              &middot;
+            </span>
+            <Typography className="tw:text-gray-500" size="text-xs">
+              {file.uploadedBy}
+            </Typography>
+          </>
+        )}
+        {file.uploadedAt && (
+          <>
+            <span className="tw:text-gray-500 tw:leading-none tw:select-none">
+              &middot;
+            </span>
+            <Typography className="tw:text-gray-500" size="text-xs">
+              {file.uploadedAt}
+            </Typography>
+          </>
+        )}
+      </div>
+    </div>
+
+    <div className="tw:flex tw:items-center tw:gap-2 tw:shrink-0">
+      <ButtonUtility
+        color="secondary"
+        icon={
+          <Download01 className="tw:text-gray-500" height={16} width={16} />
+        }
+        onClick={() => onDownload?.(file)}
+      />
+      <FileActions
+        file={file}
+        onDeleteFile={onDeleteFile}
+        onShareFile={onShareFile}
+      />
+    </div>
+  </div>
+);
+
+// ─── Main component ───────────────────────────────────────────────────────────
+
+const DocumentsView: FC<DocumentsViewProps> = ({
+  data,
+  isLoading,
+  onDeleteFile,
+  onDownload,
+  onShareFile,
+}) => {
+  return (
+    <Card
+      className="tw:flex tw:h-auto tw:overflow-hidden tw:max-h-full"
+      data-testid="documents-view">
+      {/* Right: file list */}
+      {data.length > 0 || isLoading ? (
+        <div className="tw:flex tw:flex-1 tw:flex-col tw:overflow-y-auto">
+          {isLoading
+            ? Array.from({ length: 8 }).map((_, idx) => (
+                <FileRowSkeleton key={idx} />
+              ))
+            : data.map((file) => (
+                <FileRow
+                  file={file}
+                  key={file.id}
+                  onDeleteFile={onDeleteFile}
+                  onDownload={onDownload}
+                  onShareFile={onShareFile}
+                />
+              ))}
+        </div>
+      ) : (
+        <div className="tw:flex tw:flex-1 tw:items-center tw:justify-center tw:p-12">
+          <ErrorPlaceHolder type={ERROR_PLACEHOLDER_TYPE.NO_DATA} />
+        </div>
+      )}
+    </Card>
+  );
+};
+
+export default DocumentsView;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/DocumentsView/DocumentsView.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/DocumentsView/DocumentsView.interface.ts
new file mode 100644
index 000000000000..63086f6b0352
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/DocumentsView/DocumentsView.interface.ts
@@ -0,0 +1,38 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+export type DocFileType = 'pdf' | 'xls' | 'csv' | 'doc' | 'image' | 'other';
+
+export interface DocFile {
+  id: string;
+  name: string;
+  fileType: DocFileType;
+  sizeLabel: string;
+  uploadedBy?: string;
+  uploadedAt?: string;
+  folderId?: string;
+}
+
+export interface DocFolder {
+  id: string;
+  name: string;
+  files: DocFile[];
+}
+
+export interface DocumentsViewProps {
+  data: DocFile[];
+  isLoading: boolean;
+  onDownload?: (file: DocFile) => void;
+  onShareFile?: (file: DocFile) => void;
+  onDeleteFile?: (file: DocFile) => void;
+}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadDocumentModal/UploadDocumentModal.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadDocumentModal/UploadDocumentModal.component.tsx
new file mode 100644
index 000000000000..261395933500
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadDocumentModal/UploadDocumentModal.component.tsx
@@ -0,0 +1,298 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import {
+  Button,
+  ButtonUtility,
+  Dialog,
+  FileUpload,
+  FileUploadDropZone,
+  getReadableFileSize,
+  Modal,
+  ModalOverlay,
+} from '@openmetadata/ui-core-components';
+import { AlertCircle, Trash01, UploadCloud02 } from '@untitledui/icons';
+import { Asset } from 'generated/attachments/asset';
+import { FC, useRef, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { uploadAsset } from 'rest/assetAPI';
+import { UploadDocumentModalProps } from './UploadDocumentModal.interface';
+
+type UploadStatus = 'uploading' | 'done' | 'error';
+
+interface StagedFile {
+  id: string;
+  file: File;
+}
+
+interface QueuedFile {
+  id: string;
+  file: File;
+  progress: number;
+  status: UploadStatus;
+}
+
+const UploadDocumentModal: FC<UploadDocumentModalProps> = ({
+  isOpen,
+  entityLink,
+  onClose,
+  onUploaded,
+}) => {
+  const { t } = useTranslation();
+  const [stagedFiles, setStagedFiles] = useState<StagedFile[]>([]);
+  const [queuedFiles, setQueuedFiles] = useState<QueuedFile[]>([]);
+  const [isUploading, setIsUploading] = useState(false);
+  const [sizeError, setSizeError] = useState('');
+  const uploadedAssetsRef = useRef<Asset[]>([]);
+
+  const hasStartedUploading = queuedFiles.length > 0;
+
+  const handleClose = () => {
+    uploadedAssetsRef.current = [];
+    setStagedFiles([]);
+    setQueuedFiles([]);
+    setIsUploading(false);
+    setSizeError('');
+    onClose();
+  };
+
+  const uploadSingleFile = async (entry: QueuedFile): Promise<Asset | null> => {
+    setQueuedFiles((prev) =>
+      prev.map((f) =>
+        f.id === entry.id ? { ...f, progress: 0, status: 'uploading' } : f
+      )
+    );
+
+    try {
+      const asset = await uploadAsset(entry.file, entityLink);
+      setQueuedFiles((prev) =>
+        prev.map((f) =>
+          f.id === entry.id ? { ...f, progress: 100, status: 'done' } : f
+        )
+      );
+
+      return asset;
+    } catch {
+      setQueuedFiles((prev) =>
+        prev.map((f) =>
+          f.id === entry.id ? { ...f, progress: 0, status: 'error' } : f
+        )
+      );
+
+      return null;
+    }
+  };
+
+  const handleDropFiles = (files: FileList) => {
+    const newEntries: StagedFile[] = Array.from(files).map((file) => ({
+      file,
+      id: `${file.name}-${file.size}-${Date.now()}`,
+    }));
+
+    setStagedFiles((prev) => [...prev, ...newEntries]);
+  };
+
+  const handleSizeLimitExceed = () => {
+    setSizeError(
+      t('message.file-size-limit-exceeded', {
+        defaultValue:
+          'Some files exceed the 5 MB size limit and were not uploaded.',
+      })
+    );
+  };
+
+  const handleRemoveStaged = (id: string) => {
+    setStagedFiles((prev) => prev.filter((f) => f.id !== id));
+  };
+
+  const handleRemoveQueued = (id: string) => {
+    setQueuedFiles((prev) => prev.filter((f) => f.id !== id));
+  };
+
+  const handleRetry = async (id: string) => {
+    const entry = queuedFiles.find((f) => f.id === id);
+
+    if (!entry) {
+      return;
+    }
+
+    setIsUploading(true);
+    const asset = await uploadSingleFile(entry);
+    setIsUploading(false);
+
+    if (asset) {
+      uploadedAssetsRef.current = [...uploadedAssetsRef.current, asset];
+      onUploaded?.([asset]);
+    }
+  };
+
+  const handleAttach = async () => {
+    if (stagedFiles.length === 0) {
+      return;
+    }
+
+    const newQueued: QueuedFile[] = stagedFiles.map(({ id, file }) => ({
+      file,
+      id,
+      progress: 0,
+      status: 'uploading' as UploadStatus,
+    }));
+
+    setStagedFiles([]);
+    setQueuedFiles((prev) => [...prev, ...newQueued]);
+    setIsUploading(true);
+
+    const batchAssets: Asset[] = [];
+    for (const entry of newQueued) {
+      const asset = await uploadSingleFile(entry);
+      if (asset) {
+        batchAssets.push(asset);
+      }
+    }
+
+    setIsUploading(false);
+
+    if (batchAssets.length > 0) {
+      onUploaded?.(batchAssets);
+    }
+  };
+
+  return (
+    <ModalOverlay
+      isDismissable
+      isOpen={isOpen}
+      onOpenChange={(open) => !open && handleClose()}>
+      <Modal>
+        <Dialog
+          showCloseButton
+          title={t('label.upload-document-plural')}
+          width={500}
+          onClose={handleClose}>
+          <Dialog.Content className="tw:pb-6">
+            <FileUpload.Root>
+              <FileUploadDropZone
+                allowsMultiple
+                clickToUploadLabel={t('label.click-to-upload', {
+                  defaultValue: 'Click to upload',
+                })}
+                hint={t('message.upload-document-hint')}
+                maxSize={5 * 1024 * 1024}
+                orDragAndDropLabel={t('message.or-drag-and-drop', {
+                  defaultValue: 'or drag and drop',
+                })}
+                onDropFiles={handleDropFiles}
+                onSizeLimitExceed={handleSizeLimitExceed}
+              />
+
+              {stagedFiles.length > 0 && (
+                <ul className="tw:flex tw:max-h-60 tw:flex-col tw:gap-3 tw:overflow-y-auto">
+                  {stagedFiles.map(({ id, file }) => (
+                    <li
+                      className="tw:flex tw:items-center tw:gap-3 tw:rounded-xl tw:bg-primary tw:p-4 tw:ring-1 tw:ring-secondary tw:ring-inset"
+                      key={id}>
+                      <div className="tw:flex tw:size-10 tw:shrink-0 tw:items-center tw:justify-center tw:rounded-lg tw:bg-secondary">
+                        <UploadCloud02
+                          className="tw:size-5 tw:text-tertiary"
+                          strokeWidth={1.5}
+                        />
+                      </div>
+
+                      <div className="tw:min-w-0 tw:flex-1">
+                        <p className="tw:truncate tw:text-sm tw:font-medium tw:text-secondary">
+                          {file.name}
+                        </p>
+
+                        <p className="tw:text-sm tw:text-tertiary">
+                          {getReadableFileSize(file.size)}
+                        </p>
+                      </div>
+
+                      <ButtonUtility
+                        className="tw:shrink-0"
+                        color="tertiary"
+                        icon={Trash01}
+                        size="xs"
+                        tooltip={t('label.delete')}
+                        onClick={() => handleRemoveStaged(id)}
+                      />
+                    </li>
+                  ))}
+                </ul>
+              )}
+
+              {hasStartedUploading && (
+                <FileUpload.List className="tw:max-h-60 tw:overflow-y-auto">
+                  {queuedFiles.map(({ id, file, progress, status }) => (
+                    <FileUpload.ListItemProgressBar
+                      completeLabel={t('label.complete')}
+                      deleteLabel={t('label.delete')}
+                      failed={status === 'error'}
+                      failedLabel={t('message.upload-failed')}
+                      key={id}
+                      name={file.name}
+                      progress={status === 'done' ? 100 : progress}
+                      size={file.size}
+                      tryAgainLabel={t('label.try-again')}
+                      uploadingLabel={t('label.uploading')}
+                      onDelete={
+                        status !== 'uploading'
+                          ? () => handleRemoveQueued(id)
+                          : undefined
+                      }
+                      onRetry={
+                        status === 'error' ? () => handleRetry(id) : undefined
+                      }
+                    />
+                  ))}
+                </FileUpload.List>
+              )}
+            </FileUpload.Root>
+
+            {sizeError && (
+              <div
+                className="tw:flex tw:items-center tw:gap-2 tw:rounded-lg tw:bg-error-secondary tw:px-3 tw:py-2 tw:text-sm tw:text-error-primary"
+                data-testid="size-error-message">
+                <AlertCircle
+                  className="tw:size-4 tw:shrink-0"
+                  strokeWidth={2}
+                />
+                <span>{sizeError}</span>
+              </div>
+            )}
+
+            <div className="tw:flex tw:justify-end tw:gap-3">
+              <Button
+                color="secondary"
+                isDisabled={isUploading}
+                size="sm"
+                onClick={handleClose}>
+                {t('label.cancel')}
+              </Button>
+
+              <Button
+                color="primary"
+                isDisabled={stagedFiles.length === 0 || isUploading}
+                isLoading={isUploading}
+                size="sm"
+                onClick={handleAttach}>
+                {t('label.attach-file-plural')}
+              </Button>
+            </div>
+          </Dialog.Content>
+        </Dialog>
+      </Modal>
+    </ModalOverlay>
+  );
+};
+
+export default UploadDocumentModal;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadDocumentModal/UploadDocumentModal.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadDocumentModal/UploadDocumentModal.interface.ts
new file mode 100644
index 000000000000..338057ef6d41
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadDocumentModal/UploadDocumentModal.interface.ts
@@ -0,0 +1,21 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { Asset } from '../../../generated/attachments/asset';
+
+export interface UploadDocumentModalProps {
+  isOpen: boolean;
+  entityLink: string;
+  onClose: () => void;
+  onUploaded?: (assets: Asset[]) => void;
+}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadedDocumentCard/UploadedDocumentCard.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadedDocumentCard/UploadedDocumentCard.component.tsx
new file mode 100644
index 000000000000..52948dde9c78
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadedDocumentCard/UploadedDocumentCard.component.tsx
@@ -0,0 +1,55 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { Card, Typography } from '@openmetadata/ui-core-components';
+import { FC, useMemo } from 'react';
+import { getFileTypeIcon } from 'utils/ContextCenterUtils';
+import { UploadedDocumentCardProps } from './UploadedDocumentCard.interface';
+
+const UploadedDocumentCard: FC<UploadedDocumentCardProps> = ({
+  document,
+  onClick,
+}) => {
+  const { name, fileType, sizeLabel } = document;
+
+  const fileTypeIcon = useMemo(() => {
+    return getFileTypeIcon(fileType);
+  }, [fileType]);
+
+  return (
+    <Card
+      className="tw:flex tw:flex-col tw:gap-3 tw:max-w-42"
+      data-testid="uploaded-document-card"
+      onClick={() => onClick?.(document)}>
+      <div className="tw:flex tw:items-center tw:justify-center tw:h-15 tw:bg-gray-50">
+        {fileTypeIcon}
+      </div>
+
+      <div className="tw:flex tw:flex-col tw:p-3">
+        <Typography
+          ellipsis
+          className="tw:m-0"
+          size="text-xs"
+          title={name}
+          weight="medium">
+          {name}
+        </Typography>
+        <Typography className="tw:text-gray-400" size="text-xs">
+          {sizeLabel}
+        </Typography>
+      </div>
+    </Card>
+  );
+};
+
+export default UploadedDocumentCard;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadedDocumentCard/UploadedDocumentCard.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadedDocumentCard/UploadedDocumentCard.interface.ts
new file mode 100644
index 000000000000..b016506a13ee
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadedDocumentCard/UploadedDocumentCard.interface.ts
@@ -0,0 +1,29 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+export type DocumentFileType = 'doc' | 'pdf' | 'xls' | 'image' | 'other';
+
+export type DocumentProcessingStatus = 'processed' | 'analyzing' | 'failed';
+
+export interface UploadedDocumentItem {
+  id: string;
+  name: string;
+  fileType: DocumentFileType;
+  sizeLabel: string;
+  status: DocumentProcessingStatus;
+}
+
+export interface UploadedDocumentCardProps {
+  document: UploadedDocumentItem;
+  onClick?: (document: UploadedDocumentItem) => void;
+}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadedDocumentsSection/UploadedDocumentsSection.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadedDocumentsSection/UploadedDocumentsSection.component.tsx
new file mode 100644
index 000000000000..1f6831e0568c
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadedDocumentsSection/UploadedDocumentsSection.component.tsx
@@ -0,0 +1,106 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import {
+  Button,
+  Card,
+  Skeleton,
+  Typography,
+} from '@openmetadata/ui-core-components';
+import { ArrowUpRight, Upload01 } from '@untitledui/icons';
+import ErrorPlaceHolder from 'components/common/ErrorWithPlaceholder/ErrorPlaceHolder';
+import { ERROR_PLACEHOLDER_TYPE } from 'enums/common.enum';
+import { FC } from 'react';
+import { useTranslation } from 'react-i18next';
+import UploadedDocumentCard from '../UploadedDocumentCard/UploadedDocumentCard.component';
+import { UploadedDocumentItem } from '../UploadedDocumentCard/UploadedDocumentCard.interface';
+import { UploadedDocumentsSectionProps } from './UploadedDocumentsSection.interface';
+
+const DocumentCardSkeleton: FC = () => (
+  <Card className="tw:flex tw:flex-col tw:gap-3 tw:p-3">
+    <Skeleton height="120px" variant="rectangular" width="100%" />
+    <div className="tw:flex tw:flex-col tw:gap-1">
+      <Skeleton height="12px" variant="rounded" width="75%" />
+      <div className="tw:flex tw:justify-between">
+        <Skeleton height="12px" variant="rounded" width="40px" />
+        <Skeleton height="12px" variant="rounded" width="64px" />
+      </div>
+    </div>
+  </Card>
+);
+
+const UploadedDocumentsSection: FC<UploadedDocumentsSectionProps> = ({
+  documents,
+  viewAllHref,
+  onViewAll,
+  onDocumentClick,
+  isLoading = false,
+}) => {
+  const { t } = useTranslation();
+
+  return (
+    <Card
+      className="tw:p-6 tw:h-[calc(50vh-138px)] tw:overflow-y-scroll"
+      data-testid="uploaded-documents-section">
+      <div className="tw:flex tw:items-center tw:justify-between tw:pb-5">
+        <div className="tw:flex tw:items-center tw:gap-3">
+          <div className="tw:p-3 tw:rounded-lg tw:bg-gray-blue-50">
+            <Upload01 className="tw:text-grey-600" height={20} width={20} />
+          </div>
+          <div className="tw:flex tw:flex-col">
+            <Typography size="text-md" weight="bold">
+              {t('label.uploaded-document-plural')}
+            </Typography>
+            <Typography className="tw:text-grey-500" size="text-xs">
+              {t('message.manual-upload-agent-context', {
+                defaultValue: 'Manual uploads for specific agent context',
+              })}
+            </Typography>
+          </div>
+        </div>
+
+        {(viewAllHref || onViewAll) && (
+          <Button
+            color="link-color"
+            iconTrailing={<ArrowUpRight className="tw:w-4 tw:h-4" />}
+            onClick={onViewAll}>
+            {t('label.view-all')}
+          </Button>
+        )}
+      </div>
+
+      {documents.length > 0 || isLoading ? (
+        <div className="tw:grid tw:grid-cols-[repeat(auto-fill,168px)] tw:gap-4">
+          {isLoading
+            ? Array.from({ length: 8 }).map((_, idx) => (
+                <DocumentCardSkeleton key={idx} />
+              ))
+            : documents.map((doc: UploadedDocumentItem) => (
+                <UploadedDocumentCard
+                  document={doc}
+                  key={doc.id}
+                  onClick={onDocumentClick}
+                />
+              ))}
+        </div>
+      ) : (
+        <ErrorPlaceHolder
+          className="tw:border-0 tw:h-auto"
+          type={ERROR_PLACEHOLDER_TYPE.NO_DATA}
+        />
+      )}
+    </Card>
+  );
+};
+
+export default UploadedDocumentsSection;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadedDocumentsSection/UploadedDocumentsSection.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadedDocumentsSection/UploadedDocumentsSection.interface.ts
new file mode 100644
index 000000000000..06e65ff349ce
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/UploadedDocumentsSection/UploadedDocumentsSection.interface.ts
@@ -0,0 +1,22 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { UploadedDocumentItem } from '../UploadedDocumentCard/UploadedDocumentCard.interface';
+
+export interface UploadedDocumentsSectionProps {
+  documents: UploadedDocumentItem[];
+  viewAllHref?: string;
+  onViewAll?: () => void;
+  onDocumentClick?: (document: UploadedDocumentItem) => void;
+  isLoading?: boolean;
+}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgeCenterLayout/KnowledgeCenterLayout.tsx b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgeCenterLayout/KnowledgeCenterLayout.tsx
index 39de7c069252..489f04ef0435 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgeCenterLayout/KnowledgeCenterLayout.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgeCenterLayout/KnowledgeCenterLayout.tsx
@@ -27,8 +27,9 @@ interface KnowledgeCenterLayoutProps {
   className?: string;
   leftSidebarTitle?: React.ReactNode;
   rightSidebarTitle?: string;
-  leftSidebarExtra?: React.ReactNode; // Pass Antd Card extra to the left sidebar card
-  rightSidebarExtra?: React.ReactNode; // Pass Antd Card extra to the right sidebar card
+  leftSidebarExtra?: React.ReactNode;
+  rightSidebarExtra?: React.ReactNode;
+  centerNoPadding?: boolean;
 }
 
 const KnowledgeCenterLayout: FC<KnowledgeCenterLayoutProps> = ({
@@ -41,9 +42,10 @@ const KnowledgeCenterLayout: FC<KnowledgeCenterLayoutProps> = ({
   rightSidebarTitle,
   leftSidebarExtra,
   rightSidebarExtra,
+  centerNoPadding = false,
 }) => {
   const { i18n } = useTranslation();
-  const isLeftPanelCollapsed = false;
+  const isLeftPanelCollapsed = !leftSidebar;
   const isRightPanelCollapsed = !rightSidebar;
 
   return (
@@ -93,9 +95,13 @@ const KnowledgeCenterLayout: FC<KnowledgeCenterLayoutProps> = ({
             'has-sidebar': !isLeftPanelCollapsed,
           })}
           data-testid="center-panel"
-          flex={isRightPanelCollapsed ? 0.8 : 0.6}
+          flex={isRightPanelCollapsed ? 1 : 0.6}
           minSize={700}>
-          <Card className="reflex-card center-reflex-card">{children}</Card>
+          <Card
+            bodyStyle={centerNoPadding ? { padding: 0 } : undefined}
+            className="reflex-card center-reflex-card">
+            {children}
+          </Card>
         </ReflexElement>
 
         <ReflexSplitter
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgeCenterLayout/knowledge-center-layout.less b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgeCenterLayout/knowledge-center-layout.less
index 0415798b4c0f..7bb2eef15fa3 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgeCenterLayout/knowledge-center-layout.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgeCenterLayout/knowledge-center-layout.less
@@ -16,10 +16,16 @@
 @border-color: #0000001a;
 
 .knowledge-center-layout {
-  height: @page-height;
+  height: calc(100vh - 246px);
 
   &.knowledge-details-page {
-    height: @knowledge-center-content-height;
+    height: calc(100vh - 295px);
+    padding-bottom: 20px;
+  }
+
+  &.knowledge-version-page {
+    height: calc(100vh - 246px);
+    padding-bottom: 20px;
   }
 }
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePageDetailComponent/KnowledgePageDetailComponent.tsx b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePageDetailComponent/KnowledgePageDetailComponent.tsx
index e4befd8c86de..f744d6415797 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePageDetailComponent/KnowledgePageDetailComponent.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePageDetailComponent/KnowledgePageDetailComponent.tsx
@@ -10,7 +10,6 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
-import { Tabs } from 'antd';
 import { AxiosError } from 'axios';
 import { compare } from 'fast-json-patch';
 import { cloneDeep, debounce, isEqual, isNil, isUndefined } from 'lodash';
@@ -99,11 +98,17 @@ import KnowledgePageDetailSkeleton from './KnowledgePageDetailSkeleton';
 interface KnowledgePageDetailComponentProps {
   onPageChange: (page: Partial<KnowledgeCenterPageProps>) => void;
   fetchKnowledgePageHierarchy?: (forceRefresh?: boolean) => Promise<void>;
+  isRightPanelOpen?: boolean;
+  onToggleRightPanel?: () => void;
+  getArticlePath?: (fqn: string, tab?: string) => string;
 }
 
 const KnowledgePageDetailComponent: FC<KnowledgePageDetailComponentProps> = ({
   onPageChange,
   fetchKnowledgePageHierarchy,
+  isRightPanelOpen = true,
+  onToggleRightPanel,
+  getArticlePath,
 }) => {
   const { t } = i18n;
   const { hash } = useCustomLocation();
@@ -526,7 +531,11 @@ const KnowledgePageDetailComponent: FC<KnowledgePageDetailComponentProps> = ({
 
   const handleTabChange = (activeKey: string) => {
     if (activeKey !== activeTab) {
-      navigate(getKnowledgePagePath(fqn, activeKey));
+      navigate(
+        getArticlePath
+          ? getArticlePath(fqn, activeKey)
+          : getKnowledgePagePath(fqn, activeKey)
+      );
       setActiveTab(activeKey);
     }
   };
@@ -546,6 +555,7 @@ const KnowledgePageDetailComponent: FC<KnowledgePageDetailComponentProps> = ({
   const tabs = useMemo(() => {
     const items = [
       {
+        name: String(t('label.content')),
         label: <div data-testid="overview">{String(t('label.content'))}</div>,
         key: EntityTabs.OVERVIEW,
         children: (
@@ -574,6 +584,7 @@ const KnowledgePageDetailComponent: FC<KnowledgePageDetailComponentProps> = ({
         ),
       },
       {
+        name: String(t('label.activity-feed-and-task-plural')),
         label: (
           <TabsLabel
             count={feedCount.totalCount}
@@ -685,9 +696,18 @@ const KnowledgePageDetailComponent: FC<KnowledgePageDetailComponentProps> = ({
     };
   }, [isContentUnsaved, location.pathname]);
 
+  const activeTabContent = useMemo(
+    () => tabs?.find((t) => t?.key === activeTab)?.children ?? null,
+    [tabs, activeTab]
+  );
+
   const pageConfig = useMemo(() => {
     let rightPanel = null;
-    if (activeTab !== EntityTabs.ACTIVITY_FEED && knowledgePage) {
+    if (
+      isRightPanelOpen &&
+      activeTab !== EntityTabs.ACTIVITY_FEED &&
+      knowledgePage
+    ) {
       rightPanel = (
         <GenericProvider
           data={knowledgePage}
@@ -696,7 +716,6 @@ const KnowledgePageDetailComponent: FC<KnowledgePageDetailComponentProps> = ({
           onUpdate={updatePage}>
           <KnowledgePageDetailRightPanel
             handleRelatedEntitiesUpdate={handleRelatedEntitiesUpdate}
-            isLoading={isLoading}
             knowledgePage={knowledgePage}
             permissions={permissions}
             tags={tags}
@@ -707,19 +726,33 @@ const KnowledgePageDetailComponent: FC<KnowledgePageDetailComponentProps> = ({
     }
 
     return {
+      activeTab,
       data: knowledgePage,
+      handlers: {
+        contentChangeState,
+        onFollowChange: handleFollowChange,
+        onSave: handleSave,
+        onSetThreadLink: setThreadLink,
+        onToggleDelete: handleToggleDelete,
+        onVoteChange: handleVoteChange,
+      },
       header: <div className="m-b-box rounded-12">{getHeaderElement()}</div>,
+      isRightPanelOpen,
+      onTabChange: handleTabChange,
+      onToggleRightPanel,
       rightPanel,
+      tabs,
       title: (knowledgePage?.displayName ?? '') || t('label.untitled'),
-      activeTab,
     };
   }, [
     knowledgePage,
-    isLoading,
+    isRightPanelOpen,
+    onToggleRightPanel,
     permissions,
     contentChangeState,
     activeTab,
     tags,
+    tabs,
     getHeaderElement,
   ]);
 
@@ -749,12 +782,7 @@ const KnowledgePageDetailComponent: FC<KnowledgePageDetailComponentProps> = ({
 
   return (
     <>
-      <Tabs
-        activeKey={activeTab}
-        className="entity-details-page-tabs"
-        items={tabs}
-        onChange={handleTabChange}
-      />
+      {activeTabContent}
       {threadLink ? (
         <ActivityThreadPanel
           createThread={createThread}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePageDetailRightPanel/KnowledgePageDetailRightPanel.tsx b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePageDetailRightPanel/KnowledgePageDetailRightPanel.tsx
index 83c4fe7a1217..4ef4ff95e134 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePageDetailRightPanel/KnowledgePageDetailRightPanel.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePageDetailRightPanel/KnowledgePageDetailRightPanel.tsx
@@ -30,9 +30,7 @@ import { EntityTags } from '../../../Models';
 import { showErrorToast } from '../../../utils/ToastUtils';
 import RelatedDataAssets from '../RelatedDataAssets/RelatedDataAssets';
 import './knowledge-page.less';
-import KnowledgePageDetailRightPanelSkeleton from './KnowledgePageDetailRightPanelSkeleton';
 interface KnowledgePageDetailRightPanelProps {
-  isLoading: boolean;
   permissions: OperationPermission;
   tags: Array<EntityTags>;
   knowledgePage?: KnowledgePage;
@@ -43,7 +41,6 @@ interface KnowledgePageDetailRightPanelProps {
 }
 
 const KnowledgePageDetailRightPanel: FC<KnowledgePageDetailRightPanelProps> = ({
-  isLoading,
   knowledgePage,
   permissions,
   tags,
@@ -97,12 +94,10 @@ const KnowledgePageDetailRightPanel: FC<KnowledgePageDetailRightPanelProps> = ({
     return genericPermissions?.EditAll && !data?.deleted;
   }, [genericPermissions?.EditAll, data?.deleted]);
 
-  if (isLoading) {
-    return <KnowledgePageDetailRightPanelSkeleton />;
-  }
-
   return (
-    <div className="knowledge-page-right-panel">
+    <div
+      className="knowledge-page-right-panel"
+      data-testid="knowledge-page-right-panel">
       <Row gutter={[0, 24]}>
         <Col span={24}>
           <DomainLabelV2
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePageListComponent/KnowledgePageListComponent.tsx b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePageListComponent/KnowledgePageListComponent.tsx
index cf37d43ad331..6c9b484d8243 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePageListComponent/KnowledgePageListComponent.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePageListComponent/KnowledgePageListComponent.tsx
@@ -24,7 +24,7 @@ import {
 import { AxiosError } from 'axios';
 import cryptoRandomString from 'crypto-random-string-with-promisify-polyfill';
 import { isEmpty, map, uniqBy, uniqueId } from 'lodash';
-import {
+import React, {
   forwardRef,
   RefObject,
   useCallback,
@@ -80,451 +80,476 @@ import './knowledge-page-list.less';
 interface KnowledgePageListComponentProps {
   onPageChange: (page: Partial<KnowledgeCenterPageProps>) => void;
   permissions: OperationPermission;
+  hideAddButton?: boolean;
+  rightPanelSlot?: React.ReactNode;
+  getPagePath?: (fqn: string) => string;
 }
 
 const KnowledgePageListComponent = forwardRef<
   KnowledgeCenterPageRef,
   KnowledgePageListComponentProps
->(({ onPageChange, permissions }, ref) => {
-  const { currentUser, theme } = useApplicationStore();
-  const { t } = useTranslation();
-  const navigate = useNavigate();
-  const USERId = currentUser?.id ?? '';
-  const [elementRef, isInView] = useElementInView({});
-  const [isLoading, setIsLoading] = useState<boolean>(true);
-  const [isLoadingMore, setIsLoadingMore] = useState<boolean>(false);
-  const [knowledgePages, setKnowledgePages] = useState<KnowledgePage[]>([]);
-  const [paging, setPaging] = useState<Paging>({ total: 0 });
-  const [isCreatingNewPage, setIsCreatingNewPage] = useState<boolean>(false);
-  const [showAddLinkModal, setShowAddLinkModal] = useState<boolean>(false);
-  const { getResourceLimit } = useLimitStore();
-
-  const [refreshBookMarkWidget, setRefreshBookMarkWidget] =
-    useState<boolean>(false);
-  const [refreshTagsCategory, setRefreshTagsCategory] =
-    useState<boolean>(false);
-
-  const handleRefreshBookMarkWidget = (value: boolean) =>
-    setRefreshBookMarkWidget(value);
-
-  const handleRefreshTagsCategory = (value: boolean) =>
-    setRefreshTagsCategory(value);
-
-  const fetchKnowledgePages = async (after?: string) => {
-    if (after) {
-      setIsLoadingMore(true);
-    } else {
-      setIsLoading(true);
-    }
-    try {
-      const { data, paging: pagingObj } = await getListKnowledgePages({
-        fields: getKnowledgePageFields(),
-        after,
-        limit: PAGE_SIZE_MEDIUM,
-      });
-      setKnowledgePages((prev) =>
-        uniqBy(after ? [...prev, ...data] : data, 'id')
-      );
-      setPaging(pagingObj);
-    } catch (error) {
-      showErrorToast(error as AxiosError);
-    } finally {
-      setIsLoading(false);
-      setIsLoadingMore(false);
-    }
-  };
-
-  const addArticleKnowledgePage = async () => {
-    try {
-      setIsCreatingNewPage(true);
-      const instanceName = `${PageType.ARTICLE}_${cryptoRandomString({
-        length: 8,
-        type: 'alphanumeric',
-      })}`;
-
-      const data: CreateKnowledgePage = {
-        name: instanceName,
-        displayName: '',
-        description: '',
-        pageType: PageType.ARTICLE,
-        page: {
-          publicationDate: new Date(),
-          relatedArticles: [],
-        },
-        owners: [
-          {
-            type: 'user',
-            id: USERId,
-          },
-        ],
-      };
-      const response = await postKnowledgePage(data);
-      getResourceLimit('knowledgeCenter', true, true);
-      navigate({
-        pathname: getKnowledgePagePath(response.fullyQualifiedName),
-        hash: CREATE_PAGE_HASH,
-      });
-    } catch (error) {
-      showErrorToast(error as AxiosError);
-    } finally {
-      setIsCreatingNewPage(false);
-    }
-  };
-  const addQuickLinkKnowledgePage = async (
-    formData: QuickLinkFormModalFormData
+>(
+  (
+    {
+      onPageChange,
+      permissions,
+      hideAddButton = false,
+      rightPanelSlot,
+      getPagePath,
+    },
+    ref
   ) => {
-    try {
-      const tags = [
-        ...(formData.tags ?? []),
-        ...(formData.glossaryTerms ?? []),
-      ];
-
-      const data: CreateKnowledgePage = {
-        name: `${PageType.QUICK_LINK}_${cryptoRandomString({
+    const { currentUser, theme } = useApplicationStore();
+    const { t } = useTranslation();
+    const navigate = useNavigate();
+    const USERId = currentUser?.id ?? '';
+    const [elementRef, isInView] = useElementInView({});
+    const [isLoading, setIsLoading] = useState<boolean>(true);
+    const [isLoadingMore, setIsLoadingMore] = useState<boolean>(false);
+    const [knowledgePages, setKnowledgePages] = useState<KnowledgePage[]>([]);
+    const [paging, setPaging] = useState<Paging>({ total: 0 });
+    const [isCreatingNewPage, setIsCreatingNewPage] = useState<boolean>(false);
+    const [showAddLinkModal, setShowAddLinkModal] = useState<boolean>(false);
+    const { getResourceLimit } = useLimitStore();
+
+    const [refreshBookMarkWidget, setRefreshBookMarkWidget] =
+      useState<boolean>(false);
+    const [refreshTagsCategory, setRefreshTagsCategory] =
+      useState<boolean>(false);
+
+    const handleRefreshBookMarkWidget = (value: boolean) =>
+      setRefreshBookMarkWidget(value);
+
+    const handleRefreshTagsCategory = (value: boolean) =>
+      setRefreshTagsCategory(value);
+
+    const fetchKnowledgePages = async (after?: string) => {
+      if (after) {
+        setIsLoadingMore(true);
+      } else {
+        setIsLoading(true);
+      }
+      try {
+        const { data, paging: pagingObj } = await getListKnowledgePages({
+          fields: getKnowledgePageFields(),
+          after,
+          limit: PAGE_SIZE_MEDIUM,
+        });
+        setKnowledgePages((prev) =>
+          uniqBy(after ? [...prev, ...data] : data, 'id')
+        );
+        setPaging(pagingObj);
+      } catch (error) {
+        showErrorToast(error as AxiosError);
+      } finally {
+        setIsLoading(false);
+        setIsLoadingMore(false);
+      }
+    };
+
+    const addArticleKnowledgePage = async () => {
+      try {
+        setIsCreatingNewPage(true);
+        const instanceName = `${PageType.ARTICLE}_${cryptoRandomString({
           length: 8,
           type: 'alphanumeric',
-        })}`,
-        displayName: formData.displayName ?? '',
-        description: formData.description,
-        pageType: PageType.QUICK_LINK,
-        page: {
-          url: formData.url,
-        },
-        owners: [
-          {
-            type: 'user',
-            id: USERId,
+        })}`;
+
+        const data: CreateKnowledgePage = {
+          name: instanceName,
+          displayName: '',
+          description: '',
+          pageType: PageType.ARTICLE,
+          page: {
+            publicationDate: new Date(),
+            relatedArticles: [],
           },
-        ],
-        tags,
-        relatedEntities: formData?.relatedEntities,
-      };
-      const response = await postKnowledgePage(data);
-      setKnowledgePages((prevPages) => [response, ...prevPages]);
-      setRefreshTagsCategory(true);
-    } catch (error) {
-      showErrorToast(error as AxiosError);
-    }
-  };
-
-  const updateVoteHandler = async (data: VotingDataProps, id: string) => {
-    try {
-      const { entity } = await updateKnowledgePageVote(id, data);
-
+          owners: [
+            {
+              type: 'user',
+              id: USERId,
+            },
+          ],
+        };
+        const response = await postKnowledgePage(data);
+        getResourceLimit('knowledgeCenter', true, true);
+        navigate({
+          pathname: (getPagePath ?? getKnowledgePagePath)(
+            response.fullyQualifiedName
+          ),
+          hash: CREATE_PAGE_HASH,
+        });
+      } catch (error) {
+        showErrorToast(error as AxiosError);
+      } finally {
+        setIsCreatingNewPage(false);
+      }
+    };
+    const addQuickLinkKnowledgePage = async (
+      formData: QuickLinkFormModalFormData
+    ) => {
+      try {
+        const tags = [
+          ...(formData.tags ?? []),
+          ...(formData.glossaryTerms ?? []),
+        ];
+
+        const data: CreateKnowledgePage = {
+          name: `${PageType.QUICK_LINK}_${cryptoRandomString({
+            length: 8,
+            type: 'alphanumeric',
+          })}`,
+          displayName: formData.displayName ?? '',
+          description: formData.description,
+          pageType: PageType.QUICK_LINK,
+          page: {
+            url: formData.url,
+          },
+          owners: [
+            {
+              type: 'user',
+              id: USERId,
+            },
+          ],
+          tags,
+          relatedEntities: formData?.relatedEntities,
+        };
+        const response = await postKnowledgePage(data);
+        setKnowledgePages((prevPages) => [response, ...prevPages]);
+        setRefreshTagsCategory(true);
+      } catch (error) {
+        showErrorToast(error as AxiosError);
+      }
+    };
+
+    const updateVoteHandler = async (data: VotingDataProps, id: string) => {
+      try {
+        const { entity } = await updateKnowledgePageVote(id, data);
+
+        setKnowledgePages((prevPages) =>
+          map(prevPages, (page) => {
+            if (page.id === entity.id) {
+              return { ...page, votes: entity.votes };
+            }
+
+            return page;
+          })
+        );
+      } catch (error) {
+        showErrorToast(error as AxiosError);
+      }
+    };
+
+    const followKnowledgePageHandler = async (knowledgePageId: string) => {
+      try {
+        const res = await followKnowledgePage(knowledgePageId, USERId);
+        const { newValue } = res.changeDescription.fieldsAdded[0];
+        setKnowledgePages((prevPages) =>
+          map(prevPages, (page) => {
+            if (page.id === knowledgePageId) {
+              return {
+                ...page,
+                followers: [...(page?.followers ?? []), ...newValue],
+              };
+            }
+
+            return page;
+          })
+        );
+        setRefreshBookMarkWidget(true);
+      } catch (error) {
+        showErrorToast(error as AxiosError);
+      }
+    };
+
+    const unFollowKnowledgePageHandler = async (knowledgePageId: string) => {
+      try {
+        const res = await unFollowKnowledgePage(knowledgePageId, USERId);
+        const { oldValue } = res.changeDescription.fieldsDeleted[0];
+
+        setKnowledgePages((prevPages) =>
+          map(prevPages, (page) => {
+            if (page.id === knowledgePageId) {
+              return {
+                ...page,
+                followers: (page?.followers ?? []).filter(
+                  (follower) => follower.id !== oldValue[0].id
+                ),
+              };
+            }
+
+            return page;
+          })
+        );
+        setRefreshBookMarkWidget(true);
+      } catch (error) {
+        showErrorToast(error as AxiosError);
+      }
+    };
+
+    const handleDelete = (id: string | string[]) => {
       setKnowledgePages((prevPages) =>
-        map(prevPages, (page) => {
-          if (page.id === entity.id) {
-            return { ...page, votes: entity.votes };
+        prevPages.filter((page) => {
+          if (Array.isArray(id)) {
+            return !id.includes(page.id);
           }
 
-          return page;
+          return page.id !== id;
         })
       );
-    } catch (error) {
-      showErrorToast(error as AxiosError);
-    }
-  };
-
-  const followKnowledgePageHandler = async (knowledgePageId: string) => {
-    try {
-      const res = await followKnowledgePage(knowledgePageId, USERId);
-      const { newValue } = res.changeDescription.fieldsAdded[0];
-      setKnowledgePages((prevPages) =>
-        map(prevPages, (page) => {
-          if (page.id === knowledgePageId) {
-            return {
-              ...page,
-              followers: [...(page?.followers ?? []), ...newValue],
-            };
-          }
+    };
 
-          return page;
-        })
-      );
-      setRefreshBookMarkWidget(true);
-    } catch (error) {
-      showErrorToast(error as AxiosError);
-    }
-  };
+    const hasViewPermission = useMemo(
+      () => permissions.ViewAll || permissions.ViewBasic,
+      [permissions]
+    );
 
-  const unFollowKnowledgePageHandler = async (knowledgePageId: string) => {
-    try {
-      const res = await unFollowKnowledgePage(knowledgePageId, USERId);
-      const { oldValue } = res.changeDescription.fieldsDeleted[0];
+    useEffect(() => {
+      if (hasViewPermission) {
+        fetchKnowledgePages();
+      } else {
+        setIsLoading(false);
+      }
+    }, [hasViewPermission]);
+
+    /**
+     * Handle infinite scrolling
+     */
+    useEffect(() => {
+      const after = paging.after;
+      if (isInView && after && !isLoadingMore && hasViewPermission) {
+        fetchKnowledgePages(after);
+      }
+    }, [isInView, paging, isLoadingMore, hasViewPermission]);
+
+    const items: MenuProps['items'] = [
+      {
+        label: t('label.article'),
+        key: PageType.ARTICLE,
+        onClick: addArticleKnowledgePage,
+      },
+      {
+        label: t('label.quick-link'),
+        key: PageType.QUICK_LINK,
+        onClick: () => setShowAddLinkModal(true),
+      },
+    ];
+
+    const getRightPanelElement = useCallback(
+      () =>
+        rightPanelSlot !== undefined ? (
+          rightPanelSlot
+        ) : (
+          <KnowledgePageListRightPanel
+            permissions={permissions}
+            refreshBookMarkWidget={refreshBookMarkWidget}
+            refreshTagsCategory={refreshTagsCategory}
+            onAdd={() => setShowAddLinkModal(true)}
+            onRefreshBookMarkWidget={handleRefreshBookMarkWidget}
+            onRefreshTagsCategory={handleRefreshTagsCategory}
+          />
+        ),
+      [permissions, refreshBookMarkWidget, refreshTagsCategory, rightPanelSlot]
+    );
 
-      setKnowledgePages((prevPages) =>
-        map(prevPages, (page) => {
-          if (page.id === knowledgePageId) {
-            return {
-              ...page,
-              followers: (page?.followers ?? []).filter(
-                (follower) => follower.id !== oldValue[0].id
-              ),
-            };
-          }
+    const addQuickLinkModalElement = useMemo(
+      () =>
+        showAddLinkModal && (
+          <QuickLinkFormModal
+            isOpen={showAddLinkModal}
+            // this is for add quick link as we are not passing any data
+            permissions={
+              {
+                EditAll: true,
+                EditDisplayName: true,
+                EditDescription: true,
+                EditTags: true,
+              } as OperationPermission
+            }
+            onCancel={() => setShowAddLinkModal(false)}
+            onSave={(data) => {
+              addQuickLinkKnowledgePage(data);
+              setShowAddLinkModal(false);
+            }}
+          />
+        ),
+      [showAddLinkModal]
+    );
 
-          return page;
-        })
+    useEffect(() => {
+      onPageChange({
+        title: t('label.knowledge-center'),
+        rightPanel: getRightPanelElement(),
+        data: undefined,
+        header: null,
+      });
+    }, [permissions, refreshBookMarkWidget, refreshTagsCategory]);
+
+    useImperativeHandle(ref, () => ({
+      onPageDelete: handleDelete,
+      addKnowledgePage: (knowledgePage: KnowledgePage) =>
+        setKnowledgePages((prevPages) => [knowledgePage, ...prevPages]),
+    }));
+
+    if (isLoading || isCreatingNewPage) {
+      return (
+        <Row data-testid="knowledge-page-listing" gutter={[0, 56]}>
+          {Array.from({ length: 4 }).map(() => (
+            <Col className="knowledge-card-col" key={uniqueId()} span={24}>
+              <Row gutter={[16, 16]}>
+                <Col span={24}>
+                  <Space>
+                    <Skeleton avatar paragraph={{ rows: 1 }} title={false} />
+                    <Skeleton
+                      paragraph={{ rows: 1, width: 150 }}
+                      title={false}
+                    />
+                  </Space>
+                </Col>
+                <Col span={24}>
+                  <Skeleton
+                    active
+                    className="m-b-sm"
+                    paragraph={{ rows: 1 }}
+                    title={false}
+                  />
+                  <Skeleton active paragraph={{ rows: 2 }} title={false} />
+                </Col>
+                <Col span={24}>
+                  <Space>
+                    <Skeleton
+                      active
+                      paragraph={{ rows: 1, width: 100 }}
+                      title={false}
+                    />
+                    <Skeleton
+                      active
+                      paragraph={{ rows: 1, width: 100 }}
+                      title={false}
+                    />
+                    <Skeleton
+                      active
+                      paragraph={{ rows: 1, width: 100 }}
+                      title={false}
+                    />
+                  </Space>
+                </Col>
+              </Row>
+            </Col>
+          ))}
+        </Row>
       );
-      setRefreshBookMarkWidget(true);
-    } catch (error) {
-      showErrorToast(error as AxiosError);
     }
-  };
-
-  const handleDelete = (id: string | string[]) => {
-    setKnowledgePages((prevPages) =>
-      prevPages.filter((page) => {
-        if (Array.isArray(id)) {
-          return !id.includes(page.id);
-        }
 
-        return page.id !== id;
-      })
-    );
-  };
-
-  const hasViewPermission = useMemo(
-    () => permissions.ViewAll || permissions.ViewBasic,
-    [permissions]
-  );
-
-  useEffect(() => {
-    if (hasViewPermission) {
-      fetchKnowledgePages();
-    } else {
-      setIsLoading(false);
-    }
-  }, [hasViewPermission]);
-
-  /**
-   * Handle infinite scrolling
-   */
-  useEffect(() => {
-    const after = paging.after;
-    if (isInView && after && !isLoadingMore && hasViewPermission) {
-      fetchKnowledgePages(after);
+    if (!hasViewPermission) {
+      return (
+        <ErrorPlaceHolder
+          className="border-none"
+          permissionValue={t('label.view-entity', {
+            entity: t('label.knowledge-article-plural'),
+          })}
+          type={ERROR_PLACEHOLDER_TYPE.PERMISSION}
+        />
+      );
     }
-  }, [isInView, paging, isLoadingMore, hasViewPermission]);
 
-  const items: MenuProps['items'] = [
-    {
-      label: t('label.article'),
-      key: PageType.ARTICLE,
-      onClick: addArticleKnowledgePage,
-    },
-    {
-      label: t('label.quick-link'),
-      key: PageType.QUICK_LINK,
-      onClick: () => setShowAddLinkModal(true),
-    },
-  ];
-
-  const getRightPanelElement = useCallback(
-    () => (
-      <KnowledgePageListRightPanel
-        permissions={permissions}
-        refreshBookMarkWidget={refreshBookMarkWidget}
-        refreshTagsCategory={refreshTagsCategory}
-        onAdd={() => setShowAddLinkModal(true)}
-        onRefreshBookMarkWidget={handleRefreshBookMarkWidget}
-        onRefreshTagsCategory={handleRefreshTagsCategory}
-      />
-    ),
-    [permissions, refreshBookMarkWidget, refreshTagsCategory]
-  );
-
-  const addQuickLinkModalElement = useMemo(
-    () =>
-      showAddLinkModal && (
-        <QuickLinkFormModal
-          isOpen={showAddLinkModal}
-          // this is for add quick link as we are not passing any data
-          permissions={
-            {
-              EditAll: true,
-              EditDisplayName: true,
-              EditDescription: true,
-              EditTags: true,
-            } as OperationPermission
+    if (!isLoading && isEmpty(knowledgePages)) {
+      return (
+        <ErrorPlaceHolder
+          className="border-none"
+          icon={
+            <AddPlaceHolderIcon
+              data-testid="no-data-image"
+              height={SIZE.LARGE}
+              width={SIZE.LARGE}
+            />
           }
-          onCancel={() => setShowAddLinkModal(false)}
-          onSave={(data) => {
-            addQuickLinkKnowledgePage(data);
-            setShowAddLinkModal(false);
-          }}
-        />
-      ),
-    [showAddLinkModal]
-  );
-
-  useEffect(() => {
-    onPageChange({
-      title: t('label.knowledge-center'),
-      rightPanel: getRightPanelElement(),
-      data: undefined,
-      header: null,
-    });
-  }, [permissions, refreshBookMarkWidget, refreshTagsCategory]);
-
-  useImperativeHandle(ref, () => ({
-    onPageDelete: handleDelete,
-    addKnowledgePage: (knowledgePage: KnowledgePage) =>
-      setKnowledgePages((prevPages) => [knowledgePage, ...prevPages]),
-  }));
-
-  if (isLoading || isCreatingNewPage) {
-    return (
-      <Row data-testid="knowledge-page-listing" gutter={[0, 56]}>
-        {Array.from({ length: 4 }).map(() => (
-          <Col className="knowledge-card-col" key={uniqueId()} span={24}>
-            <Row gutter={[16, 16]}>
-              <Col span={24}>
-                <Space>
-                  <Skeleton avatar paragraph={{ rows: 1 }} title={false} />
-                  <Skeleton paragraph={{ rows: 1, width: 150 }} title={false} />
-                </Space>
-              </Col>
-              <Col span={24}>
-                <Skeleton
-                  active
-                  className="m-b-sm"
-                  paragraph={{ rows: 1 }}
-                  title={false}
-                />
-                <Skeleton active paragraph={{ rows: 2 }} title={false} />
-              </Col>
-              <Col span={24}>
-                <Space>
-                  <Skeleton
-                    active
-                    paragraph={{ rows: 1, width: 100 }}
-                    title={false}
-                  />
-                  <Skeleton
-                    active
-                    paragraph={{ rows: 1, width: 100 }}
-                    title={false}
-                  />
-                  <Skeleton
-                    active
-                    paragraph={{ rows: 1, width: 100 }}
-                    title={false}
+          type={ERROR_PLACEHOLDER_TYPE.CUSTOM}>
+          <div
+            className="bg-white h-full flex-center"
+            data-testid="create-error-placeholder-create">
+            <Space
+              align="center"
+              className="w-full"
+              direction="vertical"
+              size={10}>
+              <div className="text-center text-sm font-normal">
+                <Typography.Paragraph>
+                  {t('message.adding-new-entity-is-easy-just-give-it-a-spin', {
+                    entity: t('label.knowledge-page'),
+                  })}
+                </Typography.Paragraph>
+
+                <Typography.Paragraph>
+                  <Transi18next
+                    i18nKey="message.refer-to-our-doc"
+                    renderElement={
+                      <a
+                        href={KNOWLEDGE_CENTER_DOC_LINK}
+                        rel="noreferrer"
+                        style={{ color: theme.primaryColor }}
+                        target="_blank"
+                      />
+                    }
+                    values={{
+                      doc: t('label.doc-plural-lowercase'),
+                    }}
                   />
-                </Space>
-              </Col>
-            </Row>
-          </Col>
-        ))}
-      </Row>
-    );
-  }
-
-  if (!hasViewPermission) {
-    return (
-      <ErrorPlaceHolder
-        className="border-none"
-        permissionValue={t('label.view-entity', {
-          entity: t('label.knowledge-article-plural'),
-        })}
-        type={ERROR_PLACEHOLDER_TYPE.PERMISSION}
-      />
-    );
-  }
+                </Typography.Paragraph>
+
+                {permissions.Create && !hideAddButton && (
+                  <LimitWrapper resource="knowledgeCenter">
+                    <Dropdown menu={{ items }} trigger={['click']}>
+                      <Button
+                        ghost
+                        className="p-x-lg"
+                        data-testid="add-knowledge-page-btn"
+                        type="primary">
+                        <PlusOutlined />
+                        {t('label.add')}
+                      </Button>
+                    </Dropdown>
+                  </LimitWrapper>
+                )}
+              </div>
+            </Space>
+          </div>
+          {addQuickLinkModalElement}
+        </ErrorPlaceHolder>
+      );
+    }
 
-  if (!isLoading && isEmpty(knowledgePages)) {
     return (
-      <ErrorPlaceHolder
-        className="border-none"
-        icon={
-          <AddPlaceHolderIcon
-            data-testid="no-data-image"
-            height={SIZE.LARGE}
-            width={SIZE.LARGE}
-          />
-        }
-        type={ERROR_PLACEHOLDER_TYPE.CUSTOM}>
+      <>
+        <Row data-testid="knowledge-page-listing" gutter={[0, 16]}>
+          {map(knowledgePages, (knowledgePage) => (
+            <Col
+              className="knowledge-card-col"
+              key={knowledgePage.id}
+              span={24}>
+              <KnowledgeCard
+                knowledgeItem={knowledgePage}
+                onDelete={handleDelete}
+                onFollow={followKnowledgePageHandler}
+                onRefreshTagsCategory={handleRefreshTagsCategory}
+                onUnFollow={unFollowKnowledgePageHandler}
+                onUpdateVote={updateVoteHandler}
+              />
+            </Col>
+          ))}
+        </Row>
+        {isLoadingMore ? <Loader /> : null}
         <div
-          className="bg-white h-full flex-center"
-          data-testid="create-error-placeholder-create">
-          <Space
-            align="center"
-            className="w-full"
-            direction="vertical"
-            size={10}>
-            <div className="text-center text-sm font-normal">
-              <Typography.Paragraph>
-                {t('message.adding-new-entity-is-easy-just-give-it-a-spin', {
-                  entity: t('label.knowledge-page'),
-                })}
-              </Typography.Paragraph>
-
-              <Typography.Paragraph>
-                <Transi18next
-                  i18nKey="message.refer-to-our-doc"
-                  renderElement={
-                    <a
-                      href={KNOWLEDGE_CENTER_DOC_LINK}
-                      rel="noreferrer"
-                      style={{ color: theme.primaryColor }}
-                      target="_blank"
-                    />
-                  }
-                  values={{
-                    doc: t('label.doc-plural-lowercase'),
-                  }}
-                />
-              </Typography.Paragraph>
-
-              {permissions.Create && (
-                <LimitWrapper resource="knowledgeCenter">
-                  <Dropdown menu={{ items }} trigger={['click']}>
-                    <Button
-                      ghost
-                      className="p-x-lg"
-                      data-testid="add-knowledge-page-btn"
-                      type="primary">
-                      <PlusOutlined />
-                      {t('label.add')}
-                    </Button>
-                  </Dropdown>
-                </LimitWrapper>
-              )}
-            </div>
-          </Space>
-        </div>
+          className="w-full"
+          data-testid="observer-element"
+          id="observer-element"
+          ref={elementRef as RefObject<HTMLDivElement>}
+          style={{ height: '2px' }}
+        />
         {addQuickLinkModalElement}
-      </ErrorPlaceHolder>
+      </>
     );
   }
-
-  return (
-    <>
-      <Row data-testid="knowledge-page-listing" gutter={[0, 16]}>
-        {map(knowledgePages, (knowledgePage) => (
-          <Col className="knowledge-card-col" key={knowledgePage.id} span={24}>
-            <KnowledgeCard
-              knowledgeItem={knowledgePage}
-              onDelete={handleDelete}
-              onFollow={followKnowledgePageHandler}
-              onRefreshTagsCategory={handleRefreshTagsCategory}
-              onUnFollow={unFollowKnowledgePageHandler}
-              onUpdateVote={updateVoteHandler}
-            />
-          </Col>
-        ))}
-      </Row>
-      {isLoadingMore ? <Loader /> : null}
-      <div
-        className="w-full"
-        data-testid="observer-element"
-        id="observer-element"
-        ref={elementRef as RefObject<HTMLDivElement>}
-        style={{ height: '2px' }}
-      />
-      {addQuickLinkModalElement}
-    </>
-  );
-});
+);
 
 export default KnowledgePageListComponent;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePagesHierarchy/KnowledgePagesHierarchy.tsx b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePagesHierarchy/KnowledgePagesHierarchy.tsx
index fcacd0db52e8..18dc824060d7 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePagesHierarchy/KnowledgePagesHierarchy.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgePagesHierarchy/KnowledgePagesHierarchy.tsx
@@ -103,6 +103,9 @@ interface KnowledgePagesHierarchyProps {
   isPageHeaderAvailable: boolean;
   activeKey?: DirectoryTreeProps['activeKey'];
   activePage?: KnowledgePage;
+  hideAddPageButton?: boolean;
+  getPagePath?: (fqn: string) => string;
+  homeRoute?: string;
   onPageDelete?: (id: string | string[]) => void;
   onLoading?: (isLoading: boolean) => void;
 }
@@ -115,6 +118,9 @@ const KnowledgePagesHierarchy = forwardRef<
     {
       activeKey,
       activePage,
+      hideAddPageButton,
+      getPagePath,
+      homeRoute,
       onPageDelete,
       onLoading,
       permissions,
@@ -227,7 +233,7 @@ const KnowledgePagesHierarchy = forwardRef<
           });
         }
 
-        if (isCreateHash) {
+        if (isCreateHash || forceRefresh) {
           setKnowledgePageHierarchy(data);
         } else {
           // Check if we have an activeFqn that represents a nested child node
@@ -351,12 +357,12 @@ const KnowledgePagesHierarchy = forwardRef<
             )
           );
 
-        // if the deleted page is the active page or parent of active page, navigate to knowledge center
+        // if the deleted page is the active page or parent of active page, navigate home
         if (
           activeKey === deletedPageData.fullyQualifiedName ||
           isActivePageParent
         ) {
-          navigate(ROUTES.KNOWLEDGE_CENTER);
+          navigate(homeRoute ?? ROUTES.KNOWLEDGE_CENTER);
         }
       },
       [knowledgePageHierarchy, onPageDelete, activeKey, activePage]
@@ -432,7 +438,9 @@ const KnowledgePagesHierarchy = forwardRef<
 
           // push to the newly created page
           navigate({
-            pathname: getKnowledgePagePath(response.fullyQualifiedName),
+            pathname: getPagePath
+              ? getPagePath(response.fullyQualifiedName)
+              : getKnowledgePagePath(response.fullyQualifiedName),
           });
         } catch (error) {
           showErrorToast(error as AxiosError);
@@ -453,7 +461,11 @@ const KnowledgePagesHierarchy = forwardRef<
             data-testid={`page-node-${node.title}`}>
             <Link
               className="anchor-no-underline"
-              to={getKnowledgePagePath(nodeKey)}>
+              to={
+                getPagePath
+                  ? getPagePath(nodeKey)
+                  : getKnowledgePagePath(nodeKey)
+              }>
               <div
                 className={classNames(
                   'knowledge-hierarchy-page-title-wrapper',
@@ -487,15 +499,17 @@ const KnowledgePagesHierarchy = forwardRef<
                   width={12}
                 />
               </Button>
-              <Button
-                className="knowledge-hierarchy-action-btn-item"
-                data-testid={`${node.title}-add-page-btn`}
-                disabled={!permissions.Create}
-                title="Quickly add a page inside"
-                type="text"
-                onClick={() => handleAddPage(node)}>
-                <PlusOutlined className="text-grey-muted" />
-              </Button>
+              {!hideAddPageButton && (
+                <Button
+                  className="knowledge-hierarchy-action-btn-item"
+                  data-testid={`${node.title}-add-page-btn`}
+                  disabled={!permissions.Create}
+                  title="Quickly add a page inside"
+                  type="text"
+                  onClick={() => handleAddPage(node)}>
+                  <PlusOutlined className="text-grey-muted" />
+                </Button>
+              )}
             </div>
           </div>
         );
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/QuickLinkFormModal/QuickLinkFormModal.tsx b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/QuickLinkFormModal/QuickLinkFormModal.tsx
index 4f0785b951e7..5d27711ee90a 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/QuickLinkFormModal/QuickLinkFormModal.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/QuickLinkFormModal/QuickLinkFormModal.tsx
@@ -334,6 +334,10 @@ export const QuickLinkFormModal: FC<QuickLinkFormModalProps> = ({
     },
   ];
 
+  if (!isOpen) {
+    return null;
+  }
+
   return (
     <Modal
       centered
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/EntityPageInfos/ManageButton/ManageButton.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/common/EntityPageInfos/ManageButton/ManageButton.interface.ts
index 72e9e7af139a..67072c96f93f 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/EntityPageInfos/ManageButton/ManageButton.interface.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/EntityPageInfos/ManageButton/ManageButton.interface.ts
@@ -11,11 +11,13 @@
  *  limitations under the License.
  */
 import { ItemType } from 'antd/lib/menu/hooks/useItems';
+import { ReactNode } from 'react';
 import { EntityType } from '../../../../enums/entity.enum';
 import { EntityName } from '../../../Modals/EntityNameModal/EntityNameModal.interface';
 import { DeleteOption } from '../../DeleteWidget/DeleteWidget.interface';
 
 export interface ManageButtonProps {
+  trigger?: (onClick: () => void) => ReactNode;
   allowSoftDelete?: boolean;
   afterDeleteAction?: (isSoftDelete?: boolean, version?: number) => void;
   buttonClassName?: string;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/EntityPageInfos/ManageButton/ManageButton.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/EntityPageInfos/ManageButton/ManageButton.tsx
index 3f1603ae10b0..6d169e2aff7c 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/EntityPageInfos/ManageButton/ManageButton.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/EntityPageInfos/ManageButton/ManageButton.tsx
@@ -63,18 +63,19 @@ const ManageButton: FC<ManageButtonProps> = ({
   deleteButtonDescription,
   deleteOptions,
   onProfilerSettingUpdate,
+  trigger,
 }) => {
   const { t } = useTranslation();
   const [isDelete, setIsDelete] = useState<boolean>(false);
+  const [isDropdownOpen, setIsDropdownOpen] = useState(false);
   const [isEntityRestoring, setIsEntityRestoring] = useState<boolean>(false);
   const [showReactiveModal, setShowReactiveModal] = useState(false);
   const [isDisplayNameEditing, setIsDisplayNameEditing] = useState(false);
 
   const isProfilerSupported = useMemo(
     () =>
-      [EntityType.DATABASE, EntityType.DATABASE_SCHEMA].includes(
-        entityType as EntityType
-      ) && !deleted,
+      [EntityType.DATABASE, EntityType.DATABASE_SCHEMA].includes(entityType) &&
+      !deleted,
     [entityType, deleted]
   );
 
@@ -105,7 +106,7 @@ const ManageButton: FC<ManageButtonProps> = ({
   const showAnnouncementOption = useMemo(
     () =>
       onAnnouncementClick &&
-      ANNOUNCEMENT_ENTITIES.includes(entityType as EntityType) &&
+      ANNOUNCEMENT_ENTITIES.includes(entityType) &&
       !deleted,
     [onAnnouncementClick, entityType, deleted]
   );
@@ -138,6 +139,7 @@ const ManageButton: FC<ManageButtonProps> = ({
             onClick: (e) => {
               if (canDelete) {
                 e.domEvent.stopPropagation();
+                setIsDropdownOpen(false);
                 setShowReactiveModal(true);
               }
             },
@@ -159,6 +161,7 @@ const ManageButton: FC<ManageButtonProps> = ({
             ),
             onClick: (e) => {
               e.domEvent.stopPropagation();
+              setIsDropdownOpen(false);
               !isUndefined(onAnnouncementClick) && onAnnouncementClick();
             },
             key: 'announcement-button',
@@ -181,6 +184,7 @@ const ManageButton: FC<ManageButtonProps> = ({
             ),
             onClick: (e) => {
               e.domEvent.stopPropagation();
+              setIsDropdownOpen(false);
               setIsDisplayNameEditing(true);
             },
             key: 'rename-button',
@@ -204,6 +208,7 @@ const ManageButton: FC<ManageButtonProps> = ({
             ),
             onClick: (e) => {
               e.domEvent.stopPropagation();
+              setIsDropdownOpen(false);
               onProfilerSettingUpdate?.();
             },
             key: 'profiler-setting-button',
@@ -229,6 +234,7 @@ const ManageButton: FC<ManageButtonProps> = ({
             onClick: (e) => {
               if (canDelete) {
                 e.domEvent.stopPropagation();
+                setIsDropdownOpen(false);
                 setIsDelete(true);
               }
             },
@@ -243,39 +249,61 @@ const ManageButton: FC<ManageButtonProps> = ({
     [entityType]
   );
 
-  return (
-    <>
-      {items.length ? (
-        // Used Button to stop click propagation event in the
-        // TeamDetailsV1 and User.component collapsible panel.
-        <Button
-          className="remove-button-default-styling p-0"
-          onClick={(e) => e.stopPropagation()}>
+  const renderDropdownTrigger = () => {
+    if (trigger) {
+      return (
+        <>
+          {trigger(() => setIsDropdownOpen((prev) => !prev))}
           <Dropdown
-            align={{ targetOffset: [-12, 0] }}
+            align={{ targetOffset: [0, -16] }}
             dropdownRender={renderDropdownContainer}
             menu={{ items }}
+            open={isDropdownOpen}
             overlayClassName="manage-dropdown-list-container"
             overlayStyle={{ width: '350px' }}
             placement="bottomRight"
-            trigger={['click']}>
-            <Tooltip
-              placement="topRight"
-              title={t('label.manage-entity', {
-                entity: formattedEntityType,
-              })}>
-              <Button
-                className={classNames('flex-center px-1.5', buttonClassName)}
-                data-testid="manage-button"
-                type="default">
-                <IconDropdown className="anticon self-center manage-dropdown-icon" />
-              </Button>
-            </Tooltip>
+            trigger={['click']}
+            onOpenChange={setIsDropdownOpen}>
+            <span data-testid="manage-button" />
           </Dropdown>
-        </Button>
-      ) : (
-        <></>
-      )}
+        </>
+      );
+    }
+
+    // Used Button to stop click propagation event in the
+    // TeamDetailsV1 and User.component collapsible panel.
+    return (
+      <Button
+        className="remove-button-default-styling p-0"
+        onClick={(e) => e.stopPropagation()}>
+        <Dropdown
+          align={{ targetOffset: [-12, 0] }}
+          dropdownRender={renderDropdownContainer}
+          menu={{ items }}
+          overlayClassName="manage-dropdown-list-container"
+          overlayStyle={{ width: '350px' }}
+          placement="bottomRight"
+          trigger={['click']}>
+          <Tooltip
+            placement="topRight"
+            title={t('label.manage-entity', {
+              entity: formattedEntityType,
+            })}>
+            <Button
+              className={classNames('flex-center px-1.5', buttonClassName)}
+              data-testid="manage-button"
+              type="default">
+              <IconDropdown className="anticon self-center manage-dropdown-icon" />
+            </Button>
+          </Tooltip>
+        </Dropdown>
+      </Button>
+    );
+  };
+
+  return (
+    <>
+      {items.length ? renderDropdownTrigger() : null}
       {isDelete && (
         <DeleteWidgetModal
           afterDeleteAction={afterDeleteAction}
diff --git a/openmetadata-ui/src/main/resources/ui/src/constants/LeftSidebar.constants.ts b/openmetadata-ui/src/main/resources/ui/src/constants/LeftSidebar.constants.ts
index 6053a9d04aa3..4a7bda1c4d72 100644
--- a/openmetadata-ui/src/main/resources/ui/src/constants/LeftSidebar.constants.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/constants/LeftSidebar.constants.ts
@@ -11,7 +11,7 @@
  *  limitations under the License.
  */
 
-import { Cube01 } from '@untitledui/icons';
+import { Cube01, File06 } from '@untitledui/icons';
 import { ReactComponent as GovernIcon } from '../assets/svg/bank.svg';
 import { ReactComponent as ClassificationIcon } from '../assets/svg/classification.svg';
 import { ReactComponent as DataQualityRulesIcon } from '../assets/svg/data-observability/data-quality-rules.svg';
@@ -22,6 +22,8 @@ import { ReactComponent as ColumnBulkIcon } from '../assets/svg/ic-column.svg';
 import { ReactComponent as DataQualityIcon } from '../assets/svg/ic-data-contract.svg';
 import { ReactComponent as MarketplaceIcon } from '../assets/svg/ic-data-marketplace.svg';
 import { ReactComponent as DomainsIcon } from '../assets/svg/ic-domain.svg';
+import { ReactComponent as FolderIcon } from '../assets/svg/ic-folder-new.svg';
+import { ReactComponent as GridIcon } from '../assets/svg/ic-grid-new.svg';
 import { ReactComponent as HomeIcon } from '../assets/svg/ic-home.svg';
 import { ReactComponent as IncidentMangerIcon } from '../assets/svg/ic-incident-manager.svg';
 import { ReactComponent as KnowledgeCenterIcon } from '../assets/svg/ic-knowledge-center.svg';
@@ -40,18 +42,32 @@ import { DataInsightTabs } from '../interface/data-insight.interface';
 import { createIconWithStroke } from '../utils/IconUtils';
 import { PLACEHOLDER_ROUTE_TAB, ROUTES } from './constants';
 
-const DataProductIcon = createIconWithStroke(
-  Cube01 as React.ComponentType<{
-    size?: number;
-    strokeWidth?: number;
-    style?: React.CSSProperties;
-  }>,
-  1.2
+type UntitledIconType = React.ComponentType<{
+  size?: number;
+  strokeWidth?: number;
+  style?: React.CSSProperties;
+}>;
+
+const DataProductIcon = createIconWithStroke(Cube01 as UntitledIconType, 1.2);
+
+const ContextCenterArticlesIcon = createIconWithStroke(
+  File06 as UntitledIconType,
+  1.5
 );
 
+// const ContextCenterArchiveIcon = createIconWithStroke(
+//   Archive as UntitledIconType,
+//   1.5
+// );
+
 export const SIDEBAR_NESTED_KEYS = {
   [ROUTES.OBSERVABILITY_ALERTS]: ROUTES.OBSERVABILITY_ALERTS,
   [ROUTES.ONTOLOGY_EXPLORER]: ROUTES.ONTOLOGY_EXPLORER,
+  [ROUTES.CONTEXT_CENTER_DASHBOARD]: ROUTES.CONTEXT_CENTER,
+  [ROUTES.CONTEXT_CENTER_ARTICLES]: ROUTES.CONTEXT_CENTER,
+  [ROUTES.CONTEXT_CENTER_DOCUMENTS]: ROUTES.CONTEXT_CENTER,
+  [ROUTES.CONTEXT_CENTER_INTEGRATIONS]: ROUTES.CONTEXT_CENTER,
+  [ROUTES.CONTEXT_CENTER_ARCHIVE]: ROUTES.CONTEXT_CENTER,
 };
 
 export const SIDEBAR_LIST: Array<LeftSidebarItem> = [
@@ -203,11 +219,48 @@ export const SIDEBAR_LIST: Array<LeftSidebarItem> = [
     ],
   },
   {
-    key: ROUTES.KNOWLEDGE_CENTER,
-    title: 'label.knowledge-center',
-    redirect_url: ROUTES.KNOWLEDGE_CENTER,
+    key: ROUTES.CONTEXT_CENTER,
+    title: 'label.context-center',
     icon: KnowledgeCenterIcon,
-    dataTestId: `app-bar-item-${SidebarItem.KNOWLEDGE_CENTER}`,
+    dataTestId: SidebarItem.CONTEXT_CENTER,
+    children: [
+      {
+        key: ROUTES.CONTEXT_CENTER_DASHBOARD,
+        title: 'label.dashboard',
+        redirect_url: ROUTES.CONTEXT_CENTER_DASHBOARD,
+        icon: GridIcon,
+        dataTestId: `app-bar-item-${SidebarItem.DASHBOARD}`,
+      },
+      {
+        key: ROUTES.CONTEXT_CENTER_ARTICLES,
+        title: 'label.article-plural',
+        redirect_url: ROUTES.CONTEXT_CENTER_ARTICLES,
+        icon: ContextCenterArticlesIcon,
+        dataTestId: `app-bar-item-${SidebarItem.ARTICLES}`,
+      },
+      {
+        key: ROUTES.CONTEXT_CENTER_DOCUMENTS,
+        title: 'label.document-plural',
+        redirect_url: ROUTES.CONTEXT_CENTER_DOCUMENTS,
+        icon: FolderIcon,
+        dataTestId: `app-bar-item-${SidebarItem.DOCUMENTS}`,
+      },
+      // TODO: In progress
+      // {
+      //   key: ROUTES.CONTEXT_CENTER_INTEGRATIONS,
+      //   title: 'label.integration-plural',
+      //   redirect_url: ROUTES.CONTEXT_CENTER_INTEGRATIONS,
+      //   icon: IntegrationIcon,
+      //   dataTestId: `app-bar-item-context-center-integrations`,
+      // },
+      // {
+      //   key: ROUTES.CONTEXT_CENTER_ARCHIVE,
+      //   title: 'label.archive',
+      //   redirect_url: ROUTES.CONTEXT_CENTER_ARCHIVE,
+      //   icon: ContextCenterArchiveIcon,
+      //   dataTestId: `app-bar-item-context-center-archive`,
+      // },
+    ],
   },
 ];
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/constants/constants.ts b/openmetadata-ui/src/main/resources/ui/src/constants/constants.ts
index 2b759dee46cf..63cf4f9ea8f9 100644
--- a/openmetadata-ui/src/main/resources/ui/src/constants/constants.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/constants/constants.ts
@@ -160,6 +160,17 @@ export const ROUTES = {
   KNOWLEDGE_PAGE_WITH_SUB_TAB: `/knowledge-center/${PLACEHOLDER_ROUTE_FQN}/${PLACEHOLDER_ROUTE_TAB}/${PLACEHOLDER_ROUTE_SUB_TAB}`,
   KNOWLEDGE_PAGE_VERSION: `/knowledge-center/${PLACEHOLDER_ROUTE_FQN}/versions/${PLACEHOLDER_ROUTE_VERSION}`,
   KNOWLEDGE_CENTER_FILTER: '/knowledge-center-filter',
+  CONTEXT_CENTER: '/context-center',
+  CONTEXT_CENTER_WITH_TAB: `/context-center/${PLACEHOLDER_ROUTE_TAB}`,
+  CONTEXT_CENTER_DASHBOARD: '/context-center/dashboard',
+  CONTEXT_CENTER_ARTICLES: '/context-center/articles',
+  CONTEXT_CENTER_ARTICLE_DETAIL: `/context-center/articles/${PLACEHOLDER_ROUTE_FQN}`,
+  CONTEXT_CENTER_ARTICLE_DETAIL_WITH_TAB: `/context-center/articles/${PLACEHOLDER_ROUTE_FQN}/${PLACEHOLDER_ROUTE_TAB}`,
+  CONTEXT_CENTER_ARTICLE_DETAIL_WITH_SUB_TAB: `/context-center/articles/${PLACEHOLDER_ROUTE_FQN}/${PLACEHOLDER_ROUTE_TAB}/${PLACEHOLDER_ROUTE_SUB_TAB}`,
+  CONTEXT_CENTER_ARTICLE_VERSION: `/context-center/articles/${PLACEHOLDER_ROUTE_FQN}/versions/${PLACEHOLDER_ROUTE_VERSION}`,
+  CONTEXT_CENTER_DOCUMENTS: '/context-center/documents',
+  CONTEXT_CENTER_INTEGRATIONS: '/context-center/integrations',
+  CONTEXT_CENTER_ARCHIVE: '/context-center/archive',
   SETTINGS_WITH_CATEGORY: `/settings/${PLACEHOLDER_SETTING_CATEGORY}`,
   SETTINGS_WITH_CATEGORY_FQN: `/settings/${PLACEHOLDER_SETTING_CATEGORY}/${PLACEHOLDER_ROUTE_FQN}`,
   SETTINGS_WITH_TAB: `/settings/${PLACEHOLDER_SETTING_CATEGORY}/${PLACEHOLDER_ROUTE_TAB}`,
diff --git a/openmetadata-ui/src/main/resources/ui/src/enums/sidebar.enum.ts b/openmetadata-ui/src/main/resources/ui/src/enums/sidebar.enum.ts
index fd2d508a85fc..561f81dc3070 100644
--- a/openmetadata-ui/src/main/resources/ui/src/enums/sidebar.enum.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/enums/sidebar.enum.ts
@@ -35,5 +35,9 @@ export enum SidebarItem {
   LINEAGE = 'lineage',
   COLUMN_BULK_OPERATIONS = 'column-bulk-operations',
   KNOWLEDGE_CENTER = 'knowledge-center',
+  CONTEXT_CENTER = 'context-center',
   WORKFLOWS = 'workflows',
+  ARTICLES = 'articles',
+  DOCUMENTS = 'documents',
+  DASHBOARD = 'dashboard',
 }
diff --git a/openmetadata-ui/src/main/resources/ui/src/interface/knowledge-center.interface.ts b/openmetadata-ui/src/main/resources/ui/src/interface/knowledge-center.interface.ts
index 0baccd1fd910..1b183d396d92 100644
--- a/openmetadata-ui/src/main/resources/ui/src/interface/knowledge-center.interface.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/interface/knowledge-center.interface.ts
@@ -10,6 +10,8 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
+import { VotingDataProps } from 'components/Entity/Voting/voting.interface';
+import React, { ReactNode } from 'react';
 import { EntityStatus } from '../generated/entity/data/glossaryTerm';
 import { ChangeDescription, EntityReference } from '../generated/entity/type';
 import { TagLabel } from '../generated/type/tagLabel';
@@ -108,12 +110,33 @@ export interface MovedEntity {
   sourceNodeParent?: PageHierarchy;
 }
 
+export interface KnowledgeCenterPageHandlers {
+  onFollowChange: () => Promise<void>;
+  onVoteChange: (data: VotingDataProps) => Promise<void>;
+  onSetThreadLink: (link: string) => void;
+  onToggleDelete: () => void;
+  onSave?: () => void;
+  contentChangeState: ContentChangeState;
+}
+
+export interface ArticleTab {
+  key: string | number;
+  name: string;
+  label: ReactNode;
+  children?: ReactNode;
+}
+
 export interface KnowledgeCenterPageProps {
   title: string;
   rightPanel: React.ReactNode;
   header: React.ReactNode;
   data?: KnowledgePage;
   activeTab?: string;
+  tabs?: ArticleTab[];
+  onTabChange?: (key: string) => void;
+  isRightPanelOpen?: boolean;
+  onToggleRightPanel?: () => void;
+  handlers?: KnowledgeCenterPageHandlers;
 }
 
 export interface KnowledgeCenterPageRef {
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json
index 023edbfca569..230853fd4559 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json
@@ -156,6 +156,7 @@
     "approved-entity": "تمت الموافقة على {{entity}}",
     "approver-plural": "Approvers",
     "april": "أبريل",
+    "archive": "أرشيف",
     "archived": "مؤرشف",
     "argument-plural": "وسائط",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "Role Arn لدور الافتراض",
     "assume-role-session-name": "اسم جلسة الدور لدور الافتراض",
     "assume-role-source-identity": "هوية المصدر لدور الافتراض",
+    "attach-file-plural": "إرفاق ملفات",
     "attention": "انتباه",
     "audience": "الجمهور",
     "audio": "صوت",
@@ -409,6 +411,7 @@
     "content": "المحتوى",
     "content-name": "Content Name",
     "context": "Context",
+    "context-center": "مركز السياق",
     "contract": "عقد",
     "contract-detail-plural": "تفاصيل العقد",
     "contract-execution-history": "سجل تنفيذ العقد",
@@ -1170,6 +1173,7 @@
     "last-7-days": "آخر 7 أيام",
     "last-activity": "آخر نشاط",
     "last-activity-n-minutes-ago": "آخر نشاط قبل {{count}} دقيقة",
+    "last-edited-by": "آخر تعديل بواسطة",
     "last-error": "آخر خطأ",
     "last-failed-at": "آخر فشل في",
     "last-hour": "الساعة الأخيرة",
@@ -1951,6 +1955,7 @@
     "setting-plural": "الإعدادات",
     "setup-guide": "دليل الإعداد",
     "severity": "الخطورة",
+    "share": "مشاركة",
     "shift": "تحول",
     "should-match": "يجب أن يتطابق",
     "show": "إظهار",
@@ -2267,6 +2272,7 @@
     "unlimited": "غير محدود",
     "unpause": "إلغاء الإيقاف المؤقت",
     "unprocessed": "غير معالج",
+    "unsaved": "غير محفوظ",
     "untitled": "بدون عنوان",
     "up-vote": "تصويت إيجابي",
     "update": "تحديث",
@@ -2283,8 +2289,10 @@
     "upload": "رفع",
     "upload-cover-image": "رفع صورة الغلاف",
     "upload-csv-uppercase-file": "رفع ملف CSV",
+    "upload-document-plural": "تحميل مستندات",
     "upload-image": "رفع صورة",
     "upload-lowercase": "رفع",
+    "uploaded-document-plural": "المستندات المحملة",
     "uploading": "جاري الرفع",
     "uploading-file": "جاري رفع الملف",
     "upstream": "المنبع",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "تحديث إعدادات المُحلل (profiler).",
     "update-tag-message": "طلب تحديث العلامات لـ",
     "updating-existing-not-possible-can-add-new-values": "تحديث القيم الحالية غير ممكن، يُسمح فقط بإضافة قيم جديدة.",
+    "upload-document-hint": "SVG, PNG, JPG أو GIF, PNG, JPG (الحد الأقصى 5MB)",
+    "upload-failed": "فشل التحميل، يرجى المحاولة مرة أخرى",
     "upload-file": "تحميل ملف",
     "upload-file-description": "Upload contract files to this asset.",
     "upload-file-to-validate": "Upload a file to validate",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/de-de.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/de-de.json
index 6bb79f169d66..811dc13e37e7 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/de-de.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/de-de.json
@@ -156,6 +156,7 @@
     "approved-entity": "Genehmigte {{entity}}",
     "approver-plural": "Genehmiger",
     "april": "April",
+    "archive": "Archiv",
     "archived": "Archiviert",
     "argument-plural": "Argumente",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "ARN der anzunehmenden Rolle",
     "assume-role-session-name": "Sitzungsname der anzunehmenden Rolle",
     "assume-role-source-identity": "Identitätsquelle zum Annehmen der Rolle",
+    "attach-file-plural": "Dateien anhängen",
     "attention": "Achtung",
     "audience": "Zielgruppe",
     "audio": "Audio",
@@ -409,6 +411,7 @@
     "content": "Inhalt",
     "content-name": "Inhaltsname",
     "context": "Kontext",
+    "context-center": "Kontext-Center",
     "contract": "Vertrag",
     "contract-detail-plural": "Vertragsdetails",
     "contract-execution-history": "Vertragsausführungsverlauf",
@@ -1170,6 +1173,7 @@
     "last-7-days": "Letzte 7 Tage",
     "last-activity": "Letzte Aktivität",
     "last-activity-n-minutes-ago": "Letzte Aktivität vor {{count}} Minuten",
+    "last-edited-by": "Zuletzt bearbeitet von",
     "last-error": "Letzter Fehler",
     "last-failed-at": "Zuletzt gescheitert am",
     "last-hour": "Letzte Stunde",
@@ -1951,6 +1955,7 @@
     "setting-plural": "Einstellungen",
     "setup-guide": "Installationsanleitung",
     "severity": "Schwere",
+    "share": "Teilen",
     "shift": "Schicht",
     "should-match": "Sollte übereinstimmen",
     "show": "Anzeigen",
@@ -2267,6 +2272,7 @@
     "unlimited": "Unbegrenzt",
     "unpause": "Fortsetzen",
     "unprocessed": "Unverarbeitet",
+    "unsaved": "Nicht gespeichert",
     "untitled": "Ohne Titel",
     "up-vote": "Upvote",
     "update": "Aktualisieren",
@@ -2283,8 +2289,10 @@
     "upload": "Hochladen",
     "upload-cover-image": "Titelbild hochladen",
     "upload-csv-uppercase-file": "CSV-Datei hochladen",
+    "upload-document-plural": "Dokumente hochladen",
     "upload-image": "Bild hochladen",
     "upload-lowercase": "hochladen",
+    "uploaded-document-plural": "Hochgeladene Dokumente",
     "uploading": "Hochladen",
     "uploading-file": "Datei wird hochgeladen",
     "upstream": "Stromaufwärts",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "Profiler Einstellungen updaten.",
     "update-tag-message": "Anfrage zur Aktualisierung der Tags für",
     "updating-existing-not-possible-can-add-new-values": "Die Aktualisierung bestehender Werte ist nicht möglich, nur das Hinzufügen neuer Werte ist erlaubt.",
+    "upload-document-hint": "SVG, PNG, JPG oder GIF, PNG, JPG (max. 5MB)",
+    "upload-failed": "Upload fehlgeschlagen, bitte erneut versuchen",
     "upload-file": "Datei hochladen",
     "upload-file-description": "Laden Sie Vertragsdateien zu diesem Asset hoch.",
     "upload-file-to-validate": "Laden Sie eine Datei zur Validierung hoch",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json
index 638f850de99a..ac11b512b2f3 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json
@@ -156,6 +156,7 @@
     "approved-entity": "Approved {{entity}}",
     "approver-plural": "Approvers",
     "april": "April",
+    "archive": "Archive",
     "archived": "Archived",
     "argument-plural": "Arguments",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "Role Arn for Assume Role",
     "assume-role-session-name": "Role Session Name for Assume Role",
     "assume-role-source-identity": "Source Identity for Assume Role",
+    "attach-file-plural": "Attach Files",
     "attention": "Attention",
     "audience": "Audience",
     "audio": "Audio",
@@ -409,6 +411,7 @@
     "content": "Content",
     "content-name": "Content Name",
     "context": "Context",
+    "context-center": "Context Center",
     "contract": "Contract",
     "contract-detail-plural": "Contract Details",
     "contract-execution-history": "Contract Execution History",
@@ -1170,6 +1173,7 @@
     "last-7-days": "Last 7 days",
     "last-activity": "Last Activity",
     "last-activity-n-minutes-ago": "Last activity {{count}} minutes ago",
+    "last-edited-by": "Last Edited By",
     "last-error": "Last error",
     "last-failed-at": "Last Failed At",
     "last-hour": "Last hour",
@@ -1951,6 +1955,7 @@
     "setting-plural": "Settings",
     "setup-guide": "Setup Guide",
     "severity": "Severity",
+    "share": "Share",
     "shift": "Shift",
     "should-match": "Should Match",
     "show": "Show",
@@ -2267,6 +2272,7 @@
     "unlimited": "Unlimited",
     "unpause": "UnPause",
     "unprocessed": "Unprocessed",
+    "unsaved": "Unsaved",
     "untitled": "Untitled",
     "up-vote": "Up Vote",
     "update": "Update",
@@ -2283,8 +2289,10 @@
     "upload": "Upload",
     "upload-cover-image": "Upload cover image",
     "upload-csv-uppercase-file": "Upload CSV file",
+    "upload-document-plural": "Upload Documents",
     "upload-image": "Upload Image",
     "upload-lowercase": "upload",
+    "uploaded-document-plural": "Uploaded Documents",
     "uploading": "uploading",
     "uploading-file": "Uploading file",
     "upstream": "Upstream",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "Update profiler setting.",
     "update-tag-message": "Request to update tags for",
     "updating-existing-not-possible-can-add-new-values": "Updating existing values is not possible, only the addition of new values is allowed.",
+    "upload-document-hint": "SVG, PNG, JPG or GIF, PNG, JPG (max. 5MB)",
+    "upload-failed": "Upload failed, please try again",
     "upload-file": "Upload File",
     "upload-file-description": "Upload contract files to this asset.",
     "upload-file-to-validate": "Upload a file to validate",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/es-es.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/es-es.json
index a9f3fa9c27c7..7d7bceb4592b 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/es-es.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/es-es.json
@@ -156,6 +156,7 @@
     "approved-entity": "Entidad aprobada {{entity}}",
     "approver-plural": "Aprobadores",
     "april": "Abril",
+    "archive": "Archivo",
     "archived": "Archivado",
     "argument-plural": "Argumentos",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "ARN del Rol para Asumir Rol",
     "assume-role-session-name": "Nombre de la Sesión de Rol para Asumir Rol",
     "assume-role-source-identity": "Identidad de Origen para Asumir Rol",
+    "attach-file-plural": "Adjuntar archivos",
     "attention": "Atención",
     "audience": "Público",
     "audio": "Audio",
@@ -409,6 +411,7 @@
     "content": "Contenido",
     "content-name": "Nombre del contenido",
     "context": "Contexto",
+    "context-center": "Centro de contexto",
     "contract": "Contrato",
     "contract-detail-plural": "Detalles Contrato",
     "contract-execution-history": "Historial de ejecución del contrato",
@@ -1170,6 +1173,7 @@
     "last-7-days": "Últimos 7 días",
     "last-activity": "Última actividad",
     "last-activity-n-minutes-ago": "Última actividad hace {{count}} minutos",
+    "last-edited-by": "Última edición por",
     "last-error": "Último error",
     "last-failed-at": "Último fallo en",
     "last-hour": "Última hora",
@@ -1951,6 +1955,7 @@
     "setting-plural": "Configuraciones",
     "setup-guide": "Guia de preparación",
     "severity": "Severidad",
+    "share": "Compartir",
     "shift": "Turno",
     "should-match": "Debería coincidir",
     "show": "Mostrar",
@@ -2267,6 +2272,7 @@
     "unlimited": "Sin límite",
     "unpause": "Reanudar",
     "unprocessed": "No Procesado",
+    "unsaved": "Sin guardar",
     "untitled": "Intitulada",
     "up-vote": "Voto Positivo",
     "update": "Actualizar",
@@ -2283,8 +2289,10 @@
     "upload": "Cargar",
     "upload-cover-image": "Cargar imagen de portada",
     "upload-csv-uppercase-file": "Cargar archivo CSV",
+    "upload-document-plural": "Subir documentos",
     "upload-image": "Cargar Imagen",
     "upload-lowercase": "subir",
+    "uploaded-document-plural": "Documentos subidos",
     "uploading": "Cargando",
     "uploading-file": "Subiendo archivo",
     "upstream": "Ascendente",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "Actualizar la configuración del perfilador.",
     "update-tag-message": "Solicitud para actualizar etiquetas de",
     "updating-existing-not-possible-can-add-new-values": "No es posible actualizar valores existentes, solo se permite añadir nuevos valores.",
+    "upload-document-hint": "SVG, PNG, JPG o GIF, PNG, JPG (máx. 5MB)",
+    "upload-failed": "Error al subir, inténtalo de nuevo",
     "upload-file": "Subir archivo",
     "upload-file-description": "Cargue archivos de contrato a este activo.",
     "upload-file-to-validate": "Sube un archivo para validar",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/fr-fr.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/fr-fr.json
index 2f16aa7de17e..075eb6aa9cd3 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/fr-fr.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/fr-fr.json
@@ -156,6 +156,7 @@
     "approved-entity": "Entité approuvée {{entity}}",
     "approver-plural": "Approbateurs",
     "april": "Avril",
+    "archive": "Archive",
     "archived": "Archivé",
     "argument-plural": "Arguments",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "ARN du Rôle à Assumer",
     "assume-role-session-name": "Nom de Session du Rôle à Assumer",
     "assume-role-source-identity": "Source d'Identité pour Assumer le Rôle",
+    "attach-file-plural": "Joindre des fichiers",
     "attention": "Attention",
     "audience": "Public",
     "audio": "Audio",
@@ -409,6 +411,7 @@
     "content": "Contenu",
     "content-name": "Nom du contenu",
     "context": "Contexte",
+    "context-center": "Centre de contexte",
     "contract": "Contrat",
     "contract-detail-plural": "Détails du Contrat",
     "contract-execution-history": "Historique d'exécution du contrat",
@@ -1170,6 +1173,7 @@
     "last-7-days": "7 derniers jours",
     "last-activity": "Dernière activité",
     "last-activity-n-minutes-ago": "Dernière activité il y a {{count}} minutes",
+    "last-edited-by": "Dernière modification par",
     "last-error": "Dernière erreur",
     "last-failed-at": "Dernier Échec à",
     "last-hour": "Dernière heure",
@@ -1951,6 +1955,7 @@
     "setting-plural": "Paramètres",
     "setup-guide": "Guide de Configuration",
     "severity": "Sévérité",
+    "share": "Partager",
     "shift": "Changement",
     "should-match": "Devrait correspondre",
     "show": "Afficher",
@@ -2267,6 +2272,7 @@
     "unlimited": "Illimité",
     "unpause": "Réactiver",
     "unprocessed": "Non Traité",
+    "unsaved": "Non enregistré",
     "untitled": "Sans titre",
     "up-vote": "Voter",
     "update": "Mise à Jour",
@@ -2283,8 +2289,10 @@
     "upload": "Télécharger",
     "upload-cover-image": "Télécharger l'image de couverture",
     "upload-csv-uppercase-file": "Télécharger le Fichier CSV",
+    "upload-document-plural": "Téléverser des documents",
     "upload-image": "Télécharger Image",
     "upload-lowercase": "télécharger",
+    "uploaded-document-plural": "Documents téléversés",
     "uploading": "Téléchargement",
     "uploading-file": "Téléchargement du fichier",
     "upstream": "Amont",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "Mettre à jour les réglages du profiler.",
     "update-tag-message": "Demander la mise à jour des tags pour",
     "updating-existing-not-possible-can-add-new-values": "Mettre à jour les valeurs actuelles n'est pas possible, seul l'ajout de nouvelles valeurs et permis.",
+    "upload-document-hint": "SVG, PNG, JPG ou GIF, PNG, JPG (max. 5Mo)",
+    "upload-failed": "Échec du téléversement, veuillez réessayer",
     "upload-file": "Télécharger Fichier",
     "upload-file-description": "Téléchargez des fichiers de contrat vers cet actif.",
     "upload-file-to-validate": "Téléchargez un fichier pour valider",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/gl-es.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/gl-es.json
index df6e55cb1d1b..9560964774c1 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/gl-es.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/gl-es.json
@@ -156,6 +156,7 @@
     "approved-entity": "Entidade aprobada {{entity}}",
     "approver-plural": "Aprobadores",
     "april": "Abril",
+    "archive": "Arquivo",
     "archived": "Arquivado",
     "argument-plural": "Argumentos",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "ARN de asunción de rol",
     "assume-role-session-name": "Nome da sesión para asumir o rol",
     "assume-role-source-identity": "Identidade da fonte para asumir o rol",
+    "attach-file-plural": "Adxuntar ficheiros",
     "attention": "Atención",
     "audience": "Audiencia",
     "audio": "Audio",
@@ -409,6 +411,7 @@
     "content": "Contido",
     "content-name": "Content Name",
     "context": "Contexto",
+    "context-center": "Centro de contexto",
     "contract": "Contrato",
     "contract-detail-plural": "Detalles do Contrato",
     "contract-execution-history": "Historial de ejecución do contrato",
@@ -1170,6 +1173,7 @@
     "last-7-days": "Últimos 7 días",
     "last-activity": "Última actividade",
     "last-activity-n-minutes-ago": "Last activity {{count}} minutes ago",
+    "last-edited-by": "Última edición por",
     "last-error": "Último erro",
     "last-failed-at": "Último fallo en",
     "last-hour": "Last hour",
@@ -1951,6 +1955,7 @@
     "setting-plural": "Axustes",
     "setup-guide": "Guía de configuración",
     "severity": "Gravidade",
+    "share": "Compartir",
     "shift": "Cambio",
     "should-match": "Debería coincidir",
     "show": "Mostrar",
@@ -2267,6 +2272,7 @@
     "unlimited": "Sen límite",
     "unpause": "Reanudar",
     "unprocessed": "Sen procesar",
+    "unsaved": "Sen gardar",
     "untitled": "Untitled",
     "up-vote": "Voto positivo",
     "update": "Actualizar",
@@ -2283,8 +2289,10 @@
     "upload": "Cargar",
     "upload-cover-image": "Cargar imaxe de portada",
     "upload-csv-uppercase-file": "Cargar ficheiro CSV",
+    "upload-document-plural": "Subir documentos",
     "upload-image": "Cargar imaxe",
     "upload-lowercase": "subir",
+    "uploaded-document-plural": "Documentos subidos",
     "uploading": "Cargando",
     "uploading-file": "Cargando ficheiro",
     "upstream": "Ascendente",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "Actualizar a configuración do perfilador.",
     "update-tag-message": "Solicitude de actualización de etiquetas para",
     "updating-existing-not-possible-can-add-new-values": "Updating existing values is not possible,only the addition of new values is allowed.",
+    "upload-document-hint": "SVG, PNG, JPG ou GIF, PNG, JPG (máx. 5MB)",
+    "upload-failed": "Erro ao subir, téntao de novo",
     "upload-file": "Cargar ficheiro",
     "upload-file-description": "Cargar ficheiros de contrato a este activo.",
     "upload-file-to-validate": "Cargar un ficheiro para validar",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/he-he.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/he-he.json
index fbef0a154de5..729f6be44de4 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/he-he.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/he-he.json
@@ -156,6 +156,7 @@
     "approved-entity": "{{entity}} מאושר",
     "approver-plural": "מאשרים",
     "april": "אפריל",
+    "archive": "ארכיון",
     "archived": "בארכיון",
     "argument-plural": "ארגומנטים",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "תפקיד Arn להניח",
     "assume-role-session-name": "שם הסשן להניח תפקיד",
     "assume-role-source-identity": "זהות המקור להניח תפקיד",
+    "attach-file-plural": "צרף קבצים",
     "attention": "תשומת לב",
     "audience": "קהל יעד",
     "audio": "אודיו",
@@ -409,6 +411,7 @@
     "content": "תוכן",
     "content-name": "שם תוכן",
     "context": "הקשר",
+    "context-center": "מרכז הקשר",
     "contract": "חוזה",
     "contract-detail-plural": "פרטי חוזה",
     "contract-execution-history": "סטטוס ביצוע חוזה",
@@ -1170,6 +1173,7 @@
     "last-7-days": "7 ימים אחרונים",
     "last-activity": "פעילות אחרונה",
     "last-activity-n-minutes-ago": "פעילות אחרונה לפני {{count}} דקות",
+    "last-edited-by": "נערך לאחרונה על ידי",
     "last-error": "שגיאה אחרונה",
     "last-failed-at": "נכשל לאחרונה ב",
     "last-hour": "שעה אחרונה",
@@ -1951,6 +1955,7 @@
     "setting-plural": "הגדרות",
     "setup-guide": "מדריך הגדרה",
     "severity": "חומרה",
+    "share": "שתף",
     "shift": "משמרת",
     "should-match": "צריך להתאים",
     "show": "הצג",
@@ -2267,6 +2272,7 @@
     "unlimited": "ללא מגבלה",
     "unpause": "בטל השהייה",
     "unprocessed": "לא מעובד",
+    "unsaved": "לא שמור",
     "untitled": "ללא כותרת",
     "up-vote": "הצבעה גבוהה",
     "update": "עדכן",
@@ -2283,8 +2289,10 @@
     "upload": "העלאה",
     "upload-cover-image": "העלה תמונת שער",
     "upload-csv-uppercase-file": "העלאת קובץ CSV",
+    "upload-document-plural": "העלה מסמכים",
     "upload-image": "העלאת תמונה",
     "upload-lowercase": "העלה",
+    "uploaded-document-plural": "מסמכים שהועלו",
     "uploading": "העלאה",
     "uploading-file": "העלאת קובץ",
     "upstream": "זרם עליון",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "עדכן הגדרות הפרופיילר.",
     "update-tag-message": "בקשה לעדכון תגיות עבור",
     "updating-existing-not-possible-can-add-new-values": "Updating existing values is not possible,only the addition of new values is allowed.",
+    "upload-document-hint": "SVG, PNG, JPG או GIF, PNG, JPG (מקס. 5MB)",
+    "upload-failed": "ההעלאה נכשלה, אנא נסה שנית",
     "upload-file": "העלה קובץ",
     "upload-file-description": "העלה קבצי חוזה לנכס זה.",
     "upload-file-to-validate": "העלה קובץ לאימות",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/ja-jp.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/ja-jp.json
index 70d70bc608a4..0d1390de9004 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/ja-jp.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/ja-jp.json
@@ -156,6 +156,7 @@
     "approved-entity": "承認された {{entity}}",
     "approver-plural": "承認者",
     "april": "4月",
+    "archive": "アーカイブ",
     "archived": "アーカイブ済み",
     "argument-plural": "引数",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "ARNロールを引き受ける",
     "assume-role-session-name": "セッション名ロールを引き受ける",
     "assume-role-source-identity": "ソースIDロールを引き受ける",
+    "attach-file-plural": "ファイルを添付",
     "attention": "注意",
     "audience": "オーディエンス",
     "audio": "音声",
@@ -409,6 +411,7 @@
     "content": "コンテンツ",
     "content-name": "コンテンツ名",
     "context": "コンテキスト",
+    "context-center": "コンテキストセンター",
     "contract": "契約",
     "contract-detail-plural": "契約詳細",
     "contract-execution-history": "契約実行履歴",
@@ -1170,6 +1173,7 @@
     "last-7-days": "過去7日間",
     "last-activity": "最終アクティビティ",
     "last-activity-n-minutes-ago": "最終アクティビティは{{count}}分前",
+    "last-edited-by": "最終編集者",
     "last-error": "最新のエラー",
     "last-failed-at": "最後の失敗日時",
     "last-hour": "直近1時間",
@@ -1951,6 +1955,7 @@
     "setting-plural": "設定",
     "setup-guide": "セットアップガイド",
     "severity": "重大度",
+    "share": "共有",
     "shift": "シフト",
     "should-match": "一致する必要があります",
     "show": "表示",
@@ -2267,6 +2272,7 @@
     "unlimited": "無制限",
     "unpause": "再開",
     "unprocessed": "未処理",
+    "unsaved": "未保存",
     "untitled": "無題",
     "up-vote": "賛成票",
     "update": "更新",
@@ -2283,8 +2289,10 @@
     "upload": "アップロード",
     "upload-cover-image": "カバー画像をアップロード",
     "upload-csv-uppercase-file": "CSV ファイルをアップロード",
+    "upload-document-plural": "ドキュメントをアップロード",
     "upload-image": "画像をアップロード",
     "upload-lowercase": "アップロード",
+    "uploaded-document-plural": "アップロード済みドキュメント",
     "uploading": "アップロード中",
     "uploading-file": "ファイルをアップロード中",
     "upstream": "上流",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "プロファイラー設定を更新",
     "update-tag-message": "タグの更新をリクエスト中:",
     "updating-existing-not-possible-can-add-new-values": "既存の値の更新はできません。新しい値の追加のみ可能です。",
+    "upload-document-hint": "SVG、PNG、JPG または GIF、PNG、JPG（最大 5MB）",
+    "upload-failed": "アップロードに失敗しました。もう一度お試しください",
     "upload-file": "ファイルをアップロード",
     "upload-file-description": "このアセットに契約ファイルをアップロードします。",
     "upload-file-to-validate": "検証するファイルをアップロードする",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/ko-kr.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/ko-kr.json
index b2b484c8aeb7..95395b3c72d0 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/ko-kr.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/ko-kr.json
@@ -156,6 +156,7 @@
     "approved-entity": "승인된 {{entity}}",
     "approver-plural": "Approvers",
     "april": "4월",
+    "archive": "아카이브",
     "archived": "보관됨",
     "argument-plural": "인자들",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "Assume Role용 역할 ARN",
     "assume-role-session-name": "Assume Role용 세션 이름",
     "assume-role-source-identity": "Assume Role 소스 식별자",
+    "attach-file-plural": "파일 첨부",
     "attention": "주의",
     "audience": "대상",
     "audio": "오디오",
@@ -409,6 +411,7 @@
     "content": "콘텐츠",
     "content-name": "콘텐츠 이름",
     "context": "컨텍스트",
+    "context-center": "컨텍스트 센터",
     "contract": "계약",
     "contract-detail-plural": "계약 세부사항",
     "contract-execution-history": "계약 실행 기록",
@@ -1170,6 +1173,7 @@
     "last-7-days": "최근 7일",
     "last-activity": "마지막 활동",
     "last-activity-n-minutes-ago": "{{count}}분 전 마지막 활동",
+    "last-edited-by": "마지막 편집자",
     "last-error": "마지막 오류",
     "last-failed-at": "마지막 실패 시간",
     "last-hour": "지난 시간",
@@ -1951,6 +1955,7 @@
     "setting-plural": "설정들",
     "setup-guide": "설정 가이드",
     "severity": "심각도",
+    "share": "공유",
     "shift": "이동",
     "should-match": "일치해야 함",
     "show": "표시",
@@ -2267,6 +2272,7 @@
     "unlimited": "무제한",
     "unpause": "일시 중지 해제",
     "unprocessed": "처리되지 않음",
+    "unsaved": "저장되지 않음",
     "untitled": "제목 없음",
     "up-vote": "추천",
     "update": "업데이트",
@@ -2283,8 +2289,10 @@
     "upload": "업로드",
     "upload-cover-image": "커버 이미지 업로드",
     "upload-csv-uppercase-file": "CSV 파일 업로드",
+    "upload-document-plural": "문서 업로드",
     "upload-image": "이미지 업로드",
     "upload-lowercase": "업로드",
+    "uploaded-document-plural": "업로드된 문서",
     "uploading": "업로드 중",
     "uploading-file": "파일 업로드 중",
     "upstream": "업스트림",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "프로파일러 설정을 업데이트합니다.",
     "update-tag-message": "다음에 대한 태그 업데이트 요청:",
     "updating-existing-not-possible-can-add-new-values": "기존 값을 업데이트할 수 없으며, 새 값만 추가할 수 있습니다.",
+    "upload-document-hint": "SVG, PNG, JPG 또는 GIF, PNG, JPG (최대 5MB)",
+    "upload-failed": "업로드 실패, 다시 시도해 주세요",
     "upload-file": "파일 업로드",
     "upload-file-description": "이 자산에 계약 파일을 업로드하세요.",
     "upload-file-to-validate": "Upload a file to validate",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/mr-in.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/mr-in.json
index 3c77302955fe..d733dff3c385 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/mr-in.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/mr-in.json
@@ -156,6 +156,7 @@
     "approved-entity": "अधिकृत {{entity}}",
     "approver-plural": "Approvers",
     "april": "एप्रिल",
+    "archive": "संग्रहण",
     "archived": "संग्रहित",
     "argument-plural": "आर्ग्युमेंट्स",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "भूमिका गृहीत धरण्यासाठी ARN",
     "assume-role-session-name": "भूमिकेसाठी भूमिका सत्राचे नाव",
     "assume-role-source-identity": "भूमिकेसाठी स्त्रोत ओळख",
+    "attach-file-plural": "फाइल्स जोडा",
     "attention": "लक्ष द्या",
     "audience": "प्रेक्षक",
     "audio": "ऑडिओ",
@@ -409,6 +411,7 @@
     "content": "सामग्री",
     "content-name": "Content Name",
     "context": "संदर्भ",
+    "context-center": "संदर्भ केंद्र",
     "contract": "Contract",
     "contract-detail-plural": "Contract Details",
     "contract-execution-history": "करार चालवणी इतिहास",
@@ -1170,6 +1173,7 @@
     "last-7-days": "शेवटचे 7 दिवस",
     "last-activity": "शेवटची क्रिया",
     "last-activity-n-minutes-ago": "Last activity {{count}} minutes ago",
+    "last-edited-by": "शेवटचे संपादन केले",
     "last-error": "शेवटची त्रुटी",
     "last-failed-at": "शेवटचे अयशस्वी",
     "last-hour": "Last hour",
@@ -1951,6 +1955,7 @@
     "setting-plural": "सेटिंग्ज",
     "setup-guide": "सेटअप मार्गदर्शक",
     "severity": "तीव्रता",
+    "share": "सामायिक करा",
     "shift": "शिफ्ट",
     "should-match": "जुळायला हवे",
     "show": "दाखवा",
@@ -2267,6 +2272,7 @@
     "unlimited": "अनिर्धारित",
     "unpause": "पुन्हा सुरू करा",
     "unprocessed": "प्रक्रिया न केलेले",
+    "unsaved": "जतन न केलेले",
     "untitled": "शीर्षक नाही",
     "up-vote": "वर मत द्या",
     "update": "अद्यतनित करा",
@@ -2283,8 +2289,10 @@
     "upload": "अपलोड करा",
     "upload-cover-image": "कव्हर प्रतिमा अपलोड करा",
     "upload-csv-uppercase-file": "CSV फाइल अपलोड करा",
+    "upload-document-plural": "कागदपत्रे अपलोड करा",
     "upload-image": "प्रतिमा अपलोड करा",
     "upload-lowercase": "अपलोड करा",
+    "uploaded-document-plural": "अपलोड केलेली कागदपत्रे",
     "uploading": "अपलोड करत आहे",
     "uploading-file": "फाइल अपलोड करत आहे",
     "upstream": "अपस्ट्रीम",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "प्रोफाइलर सेटिंग अद्यतनित करा.",
     "update-tag-message": "साठी टॅग अद्यतनित करण्याची विनंती",
     "updating-existing-not-possible-can-add-new-values": "विद्यमान मूल्ये अद्यतनित करणे शक्य नाही, फक्त नवीन मूल्ये जोडणे अनुमत आहे.",
+    "upload-document-hint": "SVG, PNG, JPG किंवा GIF, PNG, JPG (कमाल 5MB)",
+    "upload-failed": "अपलोड अयशस्वी झाले, कृपया पुन्हा प्रयत्न करा",
     "upload-file": "फाइल अपलोड करा",
     "upload-file-description": "या मालमत्तेत करार फाइल्स अपलोड करा.",
     "upload-file-to-validate": "Upload a file to validate",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/nl-nl.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/nl-nl.json
index 353e6a5d1ced..bc954faf66ee 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/nl-nl.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/nl-nl.json
@@ -156,6 +156,7 @@
     "approved-entity": "Approved {{entity}}",
     "approver-plural": "Goedkeurders",
     "april": "April",
+    "archive": "Archief",
     "archived": "Gearchiveerd",
     "argument-plural": "Arguments",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "Role Arn for Assume Role",
     "assume-role-session-name": "Rolsessienaam voor Rol Aannemen",
     "assume-role-source-identity": "Bronidentiteit voor Rol Aannemen",
+    "attach-file-plural": "Bestanden bijvoegen",
     "attention": "Aandacht",
     "audience": "Doelgroep",
     "audio": "Audio",
@@ -409,6 +411,7 @@
     "content": "Inhoud",
     "content-name": "Content Name",
     "context": "Context",
+    "context-center": "Contextcentrum",
     "contract": "Contract",
     "contract-detail-plural": "Contract details",
     "contract-execution-history": "Contractuitvoeringsgeschiedenis",
@@ -1170,6 +1173,7 @@
     "last-7-days": "Laatste 7 dagen",
     "last-activity": "Laatste activiteit",
     "last-activity-n-minutes-ago": "Laatste activiteit {{count}} minuten geleden",
+    "last-edited-by": "Laatst bewerkt door",
     "last-error": "Laatste fout",
     "last-failed-at": "Laatst gefaald op",
     "last-hour": "Last hour",
@@ -1951,6 +1955,7 @@
     "setting-plural": "Instellingen",
     "setup-guide": "Installatiehandleiding",
     "severity": "Impact",
+    "share": "Delen",
     "shift": "Verschuiving",
     "should-match": "Zou moeten overeenkomen",
     "show": "Tonen",
@@ -2267,6 +2272,7 @@
     "unlimited": "Onbeperkt",
     "unpause": "Hervatten",
     "unprocessed": "Onverwerkt",
+    "unsaved": "Niet opgeslagen",
     "untitled": "Zonder titel",
     "up-vote": "Stem omhoog",
     "update": "Updaten",
@@ -2283,8 +2289,10 @@
     "upload": "Uploaden",
     "upload-cover-image": "Omslagafbeelding uploaden",
     "upload-csv-uppercase-file": "CSV-bestand uploaden",
+    "upload-document-plural": "Documenten uploaden",
     "upload-image": "Afbeelding uploaden",
     "upload-lowercase": "uploaden",
+    "uploaded-document-plural": "Geüploade documenten",
     "uploading": "Uploaden",
     "uploading-file": "Bestand uploaden",
     "upstream": "Stroomopwaarts",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "Profielinstellingen updaten.",
     "update-tag-message": "Verzoek om de tags aan te passen voor",
     "updating-existing-not-possible-can-add-new-values": "Updating existing values is not possible,only the addition of new values is allowed.",
+    "upload-document-hint": "SVG, PNG, JPG of GIF, PNG, JPG (max. 5MB)",
+    "upload-failed": "Upload mislukt, probeer het opnieuw",
     "upload-file": "Bestand uploaden",
     "upload-file-description": "Upload contractbestanden naar deze asset.",
     "upload-file-to-validate": "Upload een bestand om te valideren",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/pr-pr.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/pr-pr.json
index ef7267361420..267a2356e6a2 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/pr-pr.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/pr-pr.json
@@ -156,6 +156,7 @@
     "approved-entity": "{{entity}} تایید شده",
     "approver-plural": "تأییدکنندگان",
     "april": "آوریل",
+    "archive": "Arquive",
     "archived": "بایگانی شده",
     "argument-plural": "آرگومان‌ها",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "Arn برای فرض نقش",
     "assume-role-session-name": "نام جلسه برای فرض نقش",
     "assume-role-source-identity": "هویت منبع برای فرض نقش",
+    "attach-file-plural": "Junte Os Ficheiros",
     "attention": "توجه",
     "audience": "مخاطب",
     "audio": "صوت",
@@ -409,6 +411,7 @@
     "content": "محتوا",
     "content-name": "Content Name",
     "context": "زمینه",
+    "context-center": "Centro De Contexto",
     "contract": "Contract",
     "contract-detail-plural": "Contract Details",
     "contract-execution-history": "تاریخچه اجرای قرارداد",
@@ -1170,6 +1173,7 @@
     "last-7-days": "ਆਖਰੀ 7 ਦਿਨ",
     "last-activity": "ਆਖਰੀ ਗਤੀਵਿਧੀ",
     "last-activity-n-minutes-ago": "Last activity {{count}} minutes ago",
+    "last-edited-by": "Última Edição Por",
     "last-error": "آخرین خطا",
     "last-failed-at": "آخرین شکست در",
     "last-hour": "Last hour",
@@ -1951,6 +1955,7 @@
     "setting-plural": "تنظیمات",
     "setup-guide": "راهنمای راه‌اندازی",
     "severity": "شدت",
+    "share": "Compartilhe",
     "shift": "شیفت",
     "should-match": "باید مطابقت داشته باشد",
     "show": "نمایش",
@@ -2267,6 +2272,7 @@
     "unlimited": "بدون محدودیت",
     "unpause": "ادامه",
     "unprocessed": "Unprocessed",
+    "unsaved": "Não Guardado",
     "untitled": "بدون عنوان",
     "up-vote": "رای مثبت",
     "update": "به‌روزرسانی",
@@ -2283,8 +2289,10 @@
     "upload": "بارگذاری",
     "upload-cover-image": "Upload cover image",
     "upload-csv-uppercase-file": "بارگذاری فایل CSV",
+    "upload-document-plural": "Carregue Os Documentos",
     "upload-image": "بارگذاری تصویر",
     "upload-lowercase": "بارگذاری",
+    "uploaded-document-plural": "Documentos Carregados",
     "uploading": "بارگذاری",
     "uploading-file": "بارگذاری فایل",
     "upstream": "Upstream",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "به‌روزرسانی تنظیمات پروفایلر.",
     "update-tag-message": "درخواست برای به‌روزرسانی برچسب‌ها برای",
     "updating-existing-not-possible-can-add-new-values": "به‌روزرسانی مقادیر موجود امکان‌پذیر نیست، فقط افزودن مقادیر جدید مجاز است.",
+    "upload-document-hint": "SVG, PNG, JPG ou GIF, PNG, JPG (máx. 5MB)",
+    "upload-failed": "Carregamento falhou, tente de novo",
     "upload-file": "بارگذاری فایل",
     "upload-file-description": "Carregue ficheiros de contrato para este ativo.",
     "upload-file-to-validate": "Upload a file to validate",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-br.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-br.json
index 7ee080452401..b1da12f99904 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-br.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-br.json
@@ -156,6 +156,7 @@
     "approved-entity": "Entidade aprovada {{entity}}",
     "approver-plural": "Aprovadores",
     "april": "Abril",
+    "archive": "Arquivo",
     "archived": "Arquivado",
     "argument-plural": "Argumentos",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "ARN do Papel para Assumir Papel",
     "assume-role-session-name": "Nome da Sessão para Assumir Papel",
     "assume-role-source-identity": "Identidade Fonte para Assumir Papel",
+    "attach-file-plural": "Anexar arquivos",
     "attention": "Atenção",
     "audience": "Audiência",
     "audio": "Áudio",
@@ -409,6 +411,7 @@
     "content": "Conteúdo",
     "content-name": "Nome do conteúdo",
     "context": "Contexto",
+    "context-center": "Central de contexto",
     "contract": "Contrato",
     "contract-detail-plural": "Detalhes do Contrato",
     "contract-execution-history": "Histórico de execução do contrato",
@@ -1170,6 +1173,7 @@
     "last-7-days": "Últimos 7 dias",
     "last-activity": "Última atividade",
     "last-activity-n-minutes-ago": "Última atividade há {{count}} minutos",
+    "last-edited-by": "Última edição por",
     "last-error": "Último erro",
     "last-failed-at": "Última Falha em",
     "last-hour": "Última hora",
@@ -1951,6 +1955,7 @@
     "setting-plural": "Configurações",
     "setup-guide": "Guia de Configuração",
     "severity": "Severidade",
+    "share": "Compartilhar",
     "shift": "Turno",
     "should-match": "Deveria corresponder",
     "show": "Mostrar",
@@ -2267,6 +2272,7 @@
     "unlimited": "Ilimitado",
     "unpause": "Continuar",
     "unprocessed": "Não processado",
+    "unsaved": "Não salvo",
     "untitled": "Sem título",
     "up-vote": "Voto positivo",
     "update": "Atualizar",
@@ -2283,8 +2289,10 @@
     "upload": "Carregar",
     "upload-cover-image": "Carregar imagem de capa",
     "upload-csv-uppercase-file": "Carregar arquivo CSV",
+    "upload-document-plural": "Enviar documentos",
     "upload-image": "Carregar Imagem",
     "upload-lowercase": "fazer upload",
+    "uploaded-document-plural": "Documentos enviados",
     "uploading": "Carregando",
     "uploading-file": "Carregando arquivo",
     "upstream": "A montante",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "Atualizar configurações do examinador.",
     "update-tag-message": "Solicitar atualização de tags para",
     "updating-existing-not-possible-can-add-new-values": "Updating existing values is not possible,only the addition of new values is allowed.",
+    "upload-document-hint": "SVG, PNG, JPG ou GIF, PNG, JPG (máx. 5MB)",
+    "upload-failed": "Falha no envio, tente novamente",
     "upload-file": "Carregar arquivo",
     "upload-file-description": "Carregue arquivos de contrato para este ativo.",
     "upload-file-to-validate": "Carregue um arquivo para validar",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-pt.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-pt.json
index 6f1de7430a95..ef60119c9748 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-pt.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-pt.json
@@ -156,6 +156,7 @@
     "approved-entity": "Entidade aprovada {{entity}}",
     "approver-plural": "Aprovadores",
     "april": "Abril",
+    "archive": "Arquivo",
     "archived": "Arquivado",
     "argument-plural": "Argumentos",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "ARN do Papel para Assumir Papel",
     "assume-role-session-name": "Nome da Sessão para Assumir Papel",
     "assume-role-source-identity": "Identidade Fonte para Assumir Papel",
+    "attach-file-plural": "Anexar ficheiros",
     "attention": "Atenção",
     "audience": "Audiência",
     "audio": "Áudio",
@@ -409,6 +411,7 @@
     "content": "Conteúdo",
     "content-name": "Content Name",
     "context": "Contexto",
+    "context-center": "Centro de contexto",
     "contract": "Contrato",
     "contract-detail-plural": "Detalhes do Contrato",
     "contract-execution-history": "Histórico de execução do contrato",
@@ -1170,6 +1173,7 @@
     "last-7-days": "Últimos 7 dias",
     "last-activity": "Última actividade",
     "last-activity-n-minutes-ago": "Última atividade há {{count}} minutos",
+    "last-edited-by": "Última edição por",
     "last-error": "Último erro",
     "last-failed-at": "Última Falha em",
     "last-hour": "Última hora",
@@ -1951,6 +1955,7 @@
     "setting-plural": "Configurações",
     "setup-guide": "Guia de Configuração",
     "severity": "Gravidade",
+    "share": "Partilhar",
     "shift": "Turno",
     "should-match": "Deveria corresponder",
     "show": "Mostrar",
@@ -2267,6 +2272,7 @@
     "unlimited": "Ilimitado",
     "unpause": "Continuar",
     "unprocessed": "Não Processado",
+    "unsaved": "Não guardado",
     "untitled": "Sem título",
     "up-vote": "Voto Positivo",
     "update": "Atualizar",
@@ -2283,8 +2289,10 @@
     "upload": "Carregar",
     "upload-cover-image": "Carregar imagem de capa",
     "upload-csv-uppercase-file": "Carregar arquivo CSV",
+    "upload-document-plural": "Carregar documentos",
     "upload-image": "Carregar Imagem",
     "upload-lowercase": "carregar",
+    "uploaded-document-plural": "Documentos carregados",
     "uploading": "Carregando",
     "uploading-file": "Carregando arquivo",
     "upstream": "Upstream",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "Atualizar configurações do examinador.",
     "update-tag-message": "Solicitar atualização de tags para",
     "updating-existing-not-possible-can-add-new-values": "Não é possível atualizar valores existentes, apenas a adição de novos valores é permitida.",
+    "upload-document-hint": "SVG, PNG, JPG ou GIF, PNG, JPG (máx. 5MB)",
+    "upload-failed": "Falha no carregamento, tente novamente",
     "upload-file": "Carregar Ficheiro",
     "upload-file-description": "Carregar ficheiros de contrato para este ativo.",
     "upload-file-to-validate": "Carregar um ficheiro para validar",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/ru-ru.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/ru-ru.json
index d8106b9a0630..781c7d94511f 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/ru-ru.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/ru-ru.json
@@ -156,6 +156,7 @@
     "approved-entity": "Одобренная {{entity}}",
     "approver-plural": "Утверждающие",
     "april": "Апрель",
+    "archive": "Архив",
     "archived": "В архиве",
     "argument-plural": "Аргументы",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "Принять роль",
     "assume-role-session-name": "Имя сеанса роли для принятой роли",
     "assume-role-source-identity": "Идентификатор источника для принятой роли",
+    "attach-file-plural": "Прикрепить файлы",
     "attention": "Внимание",
     "audience": "Аудитория",
     "audio": "Аудио",
@@ -409,6 +411,7 @@
     "content": "Содержимое",
     "content-name": "Имя контента",
     "context": "Контекст",
+    "context-center": "Центр контекста",
     "contract": "Контракт",
     "contract-detail-plural": "Детали контракта",
     "contract-execution-history": "История выполнения контракта",
@@ -1170,6 +1173,7 @@
     "last-7-days": "Последние 7 дней",
     "last-activity": "Последняя активность",
     "last-activity-n-minutes-ago": "Последняя активность {{count}} минут назад",
+    "last-edited-by": "Последнее редактирование",
     "last-error": "Последняя ошибка",
     "last-failed-at": "Последний сбой в",
     "last-hour": "Последний час",
@@ -1951,6 +1955,7 @@
     "setting-plural": "Настройки",
     "setup-guide": "Руководство по установке",
     "severity": "Критичность инцидента",
+    "share": "Поделиться",
     "shift": "Сдвиг",
     "should-match": "Должно совпадать",
     "show": "Показать",
@@ -2267,6 +2272,7 @@
     "unlimited": "Без ограничений",
     "unpause": "Снять паузу",
     "unprocessed": "Необработанный",
+    "unsaved": "Не сохранено",
     "untitled": "Без названия",
     "up-vote": "Нравится",
     "update": "Обновить",
@@ -2283,8 +2289,10 @@
     "upload": "Загрузить",
     "upload-cover-image": "Загрузить изображение обложки",
     "upload-csv-uppercase-file": "Загрузить CSV-файл",
+    "upload-document-plural": "Загрузить документы",
     "upload-image": "Загрузить изображение",
     "upload-lowercase": "загрузить",
+    "uploaded-document-plural": "Загруженные документы",
     "uploading": "Загрузка",
     "uploading-file": "Загрузка файла",
     "upstream": "Восходящий",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "Обновить настройки профилировщика.",
     "update-tag-message": "Запрос на обновление тегов для",
     "updating-existing-not-possible-can-add-new-values": "Обновлять существующие значения нельзя, но можно добавить новые.",
+    "upload-document-hint": "SVG, PNG, JPG или GIF, PNG, JPG (макс. 5МБ)",
+    "upload-failed": "Ошибка загрузки, попробуйте ещё раз",
     "upload-file": "Загрузить файл",
     "upload-file-description": "Загрузите файлы контракта для этого ресурса.",
     "upload-file-to-validate": "Загрузите файл для проверки",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/th-th.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/th-th.json
index ef0d28db8296..1c817efddb95 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/th-th.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/th-th.json
@@ -156,6 +156,7 @@
     "approved-entity": "{{entity}} ที่ได้รับการอนุมัติ",
     "approver-plural": "ผู้อนุมัติ",
     "april": "เมษายน",
+    "archive": "เก็บถาวร",
     "archived": "เก็บถาวร",
     "argument-plural": "อาร์กิวเมนต์",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "ARN บทบาทสำหรับการถือบทบาท",
     "assume-role-session-name": "ชื่อเซสชันบทบาทสำหรับการถือบทบาท",
     "assume-role-source-identity": "เอกลักษณ์ต้นทางสำหรับการถือบทบาท",
+    "attach-file-plural": "แนบไฟล์",
     "attention": "ความสนใจ",
     "audience": "ผู้ฟัง",
     "audio": "เสียง",
@@ -409,6 +411,7 @@
     "content": "เนื้อหา",
     "content-name": "Content Name",
     "context": "บริบท",
+    "context-center": "ศูนย์บริบท",
     "contract": "Contract",
     "contract-detail-plural": "Contract Details",
     "contract-execution-history": "ประวัติการดำเนินการสัญญา",
@@ -1170,6 +1173,7 @@
     "last-7-days": "7 วันที่แล้ว",
     "last-activity": "กิจกรรมล่าสุด",
     "last-activity-n-minutes-ago": "กิจกรรมล่าสุดเมื่อ {{count}} นาทีที่แล้ว",
+    "last-edited-by": "แก้ไขล่าสุดโดย",
     "last-error": "ข้อผิดพลาดล่าสุด",
     "last-failed-at": "ล้มเหลวล่าสุดที่",
     "last-hour": "Last hour",
@@ -1951,6 +1955,7 @@
     "setting-plural": "การตั้งค่าหลายรายการ",
     "setup-guide": "คู่มือการติดตั้ง",
     "severity": "ความรุนแรง",
+    "share": "แชร์",
     "shift": "เปลี่ยน",
     "should-match": "ควรตรงกัน",
     "show": "แสดง",
@@ -2267,6 +2272,7 @@
     "unlimited": "ไม่จำกัด",
     "unpause": "เลิกหยุดชั่วคราว",
     "unprocessed": "Unprocessed",
+    "unsaved": "ยังไม่ได้บันทึก",
     "untitled": "ไม่มีชื่อ",
     "up-vote": "โหวตขึ้น",
     "update": "อัปเดต",
@@ -2283,8 +2289,10 @@
     "upload": "อัปโหลด",
     "upload-cover-image": "อัปโหลดภาพปก",
     "upload-csv-uppercase-file": "อัปโหลดไฟล์ CSV",
+    "upload-document-plural": "อัปโหลดเอกสาร",
     "upload-image": "อัปโหลดภาพ",
     "upload-lowercase": "อัปโหลด",
+    "uploaded-document-plural": "เอกสารที่อัปโหลดแล้ว",
     "uploading": "กำลังอัปโหลด",
     "uploading-file": "อัปโหลดไฟล์",
     "upstream": "อัปสตรีม",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "อัปเดตการตั้งค่าโปรไฟล์เลอร์",
     "update-tag-message": "คำขอเพื่ออัปเดตแท็กสำหรับ",
     "updating-existing-not-possible-can-add-new-values": "ไม่สามารถปรับปรุงค่าที่มีอยู่ได้เท่านั้นสามารถเพิ่มค่าใหม่ได้",
+    "upload-document-hint": "SVG, PNG, JPG หรือ GIF, PNG, JPG (สูงสุด 5MB)",
+    "upload-failed": "อัปโหลดล้มเหลว กรุณาลองอีกครั้ง",
     "upload-file": "อัปโหลดไฟล์",
     "upload-file-description": "อัปโหลดไฟล์สัญญาไปยังสินทรัพย์นี้",
     "upload-file-to-validate": "Upload a file to validate",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/tr-tr.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/tr-tr.json
index 9fbd5177b82c..9b59fd44a3ad 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/tr-tr.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/tr-tr.json
@@ -156,6 +156,7 @@
     "approved-entity": "Onaylanan {{entity}}",
     "approver-plural": "Approvers",
     "april": "Nisan",
+    "archive": "Arşiv",
     "archived": "Arşivlendi",
     "argument-plural": "Argümanlar",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "Rol Üstlenmek için Rol Arn'si",
     "assume-role-session-name": "Rol Üstlenmek için Rol Oturum Adı",
     "assume-role-source-identity": "Rol Üstlenmek için Kaynak Kimliği",
+    "attach-file-plural": "Dosya Ekle",
     "attention": "Dikkat",
     "audience": "Kitle",
     "audio": "Ses",
@@ -409,6 +411,7 @@
     "content": "İçerik",
     "content-name": "Content Name",
     "context": "Bağlam",
+    "context-center": "Bağlam Merkezi",
     "contract": "Contract",
     "contract-detail-plural": "Contract Details",
     "contract-execution-history": "Sözleşme Yürütme Geçmişi",
@@ -1170,6 +1173,7 @@
     "last-7-days": "Son 7 gün",
     "last-activity": "Son aktivite",
     "last-activity-n-minutes-ago": "{{count}} dakika önce son aktivite",
+    "last-edited-by": "Son Düzenleyen",
     "last-error": "Son hata",
     "last-failed-at": "Son Başarısız Olma Zamanı",
     "last-hour": "Last hour",
@@ -1951,6 +1955,7 @@
     "setting-plural": "Ayarlar",
     "setup-guide": "Kurulum Kılavuzu",
     "severity": "Önem Derecesi",
+    "share": "Paylaş",
     "shift": "Shift",
     "should-match": "Eşleşmeli",
     "show": "Göster",
@@ -2267,6 +2272,7 @@
     "unlimited": "Sınırsız",
     "unpause": "Devam Ettir",
     "unprocessed": "İşlenmemiş",
+    "unsaved": "Kaydedilmedi",
     "untitled": "Başlıksız",
     "up-vote": "Yukarı Oy",
     "update": "Güncelle",
@@ -2283,8 +2289,10 @@
     "upload": "Yükle",
     "upload-cover-image": "Kapak görseli yükle",
     "upload-csv-uppercase-file": "CSV dosyası yükle",
+    "upload-document-plural": "Belgeler Yükle",
     "upload-image": "Resim Yükle",
     "upload-lowercase": "yükle",
+    "uploaded-document-plural": "Yüklenen Belgeler",
     "uploading": "yükleniyor",
     "uploading-file": "Dosya yükleniyor",
     "upstream": "Yukarı akış",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "Profilleyici ayarını güncelle.",
     "update-tag-message": "için etiketleri güncelleme isteği",
     "updating-existing-not-possible-can-add-new-values": "Mevcut değerleri güncellemek mümkün değil, yalnızca yeni değerlerin eklenmesine izin verilir.",
+    "upload-document-hint": "SVG, PNG, JPG veya GIF, PNG, JPG (maks. 5MB)",
+    "upload-failed": "Yükleme başarısız, lütfen tekrar deneyin",
     "upload-file": "Dosya Yükle",
     "upload-file-description": "Bu varlık için sözleşme dosyalarını yükleyin.",
     "upload-file-to-validate": "Upload a file to validate",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/zh-cn.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/zh-cn.json
index 05dace2ad386..2fd905f996e3 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/zh-cn.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/zh-cn.json
@@ -156,6 +156,7 @@
     "approved-entity": "已批准的 {{entity}}",
     "approver-plural": "审批人",
     "april": "四月",
+    "archive": "归档",
     "archived": "已归档",
     "argument-plural": "参数",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "承担角色的角色ARN",
     "assume-role-session-name": "承担角色的会话名称",
     "assume-role-source-identity": "承担角色的源身份",
+    "attach-file-plural": "附加文件",
     "attention": "注意",
     "audience": "受众",
     "audio": "音频",
@@ -409,6 +411,7 @@
     "content": "内容",
     "content-name": "内容名称",
     "context": "上下文",
+    "context-center": "上下文中心",
     "contract": "合同",
     "contract-detail-plural": "合同详情",
     "contract-execution-history": "合同执行历史",
@@ -1170,6 +1173,7 @@
     "last-7-days": "最近7天",
     "last-activity": "最后活动",
     "last-activity-n-minutes-ago": "{{count}}分钟前的最后活动",
+    "last-edited-by": "最后编辑者",
     "last-error": "最近错误",
     "last-failed-at": "最近失败时间",
     "last-hour": "最后一小时",
@@ -1951,6 +1955,7 @@
     "setting-plural": "设置",
     "setup-guide": "安装引导",
     "severity": "严重性",
+    "share": "分享",
     "shift": "转移",
     "should-match": "应该匹配",
     "show": "显示",
@@ -2267,6 +2272,7 @@
     "unlimited": "无限制",
     "unpause": "取消暂停",
     "unprocessed": "未加工的",
+    "unsaved": "未保存",
     "untitled": "无标题",
     "up-vote": "赞成票",
     "update": "更新",
@@ -2283,8 +2289,10 @@
     "upload": "上传",
     "upload-cover-image": "上传封面图片",
     "upload-csv-uppercase-file": "上传 CSV 文件",
+    "upload-document-plural": "上传文档",
     "upload-image": "上传图片",
     "upload-lowercase": "上传",
+    "uploaded-document-plural": "已上传文档",
     "uploading": "上传中",
     "uploading-file": "上传文件",
     "upstream": "上游",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "更新分析器设置",
     "update-tag-message": "请求更新标签",
     "updating-existing-not-possible-can-add-new-values": "无法更新现有值, 只能添加新值",
+    "upload-document-hint": "SVG、PNG、JPG 或 GIF、PNG、JPG（最大 5MB）",
+    "upload-failed": "上传失败，请重试",
     "upload-file": "上传文件",
     "upload-file-description": "将合约文件上传到此资产。",
     "upload-file-to-validate": "上传文件以验证",
diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/zh-tw.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/zh-tw.json
index 47735bd81858..646d77da66ef 100644
--- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/zh-tw.json
+++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/zh-tw.json
@@ -156,6 +156,7 @@
     "approved-entity": "已批准的 {{entity}}",
     "approver-plural": "审批人",
     "april": "四月",
+    "archive": "歸檔",
     "archived": "已封存",
     "argument-plural": "引數",
     "arrow-symbol": "→",
@@ -180,6 +181,7 @@
     "assume-role-arn": "用於 Assume Role 的角色 ARN",
     "assume-role-session-name": "用於 Assume Role 的角色工作階段名稱",
     "assume-role-source-identity": "用於 Assume Role 的來源身分",
+    "attach-file-plural": "附加檔案",
     "attention": "注意",
     "audience": "對象",
     "audio": "音訊",
@@ -409,6 +411,7 @@
     "content": "內容",
     "content-name": "Content Name",
     "context": "上下文",
+    "context-center": "上下文中心",
     "contract": "合約",
     "contract-detail-plural": "合約詳情",
     "contract-execution-history": "合約執行歷史",
@@ -1170,6 +1173,7 @@
     "last-7-days": "過去 7 天",
     "last-activity": "最後活動",
     "last-activity-n-minutes-ago": "最後活動於 {{count}} 分鐘前",
+    "last-edited-by": "最後編輯者",
     "last-error": "最後錯誤",
     "last-failed-at": "上次失敗於",
     "last-hour": "過去一小時",
@@ -1951,6 +1955,7 @@
     "setting-plural": "設定",
     "setup-guide": "設定指南",
     "severity": "嚴重性",
+    "share": "分享",
     "shift": "Shift",
     "should-match": "應該比對",
     "show": "顯示",
@@ -2267,6 +2272,7 @@
     "unlimited": "無限制",
     "unpause": "取消暫停",
     "unprocessed": "未處理",
+    "unsaved": "未儲存",
     "untitled": "無標題",
     "up-vote": "贊成",
     "update": "更新",
@@ -2283,8 +2289,10 @@
     "upload": "上傳",
     "upload-cover-image": "上傳封面圖片",
     "upload-csv-uppercase-file": "上傳 CSV 檔案",
+    "upload-document-plural": "上傳文件",
     "upload-image": "上傳圖片",
     "upload-lowercase": "上傳",
+    "uploaded-document-plural": "已上傳文件",
     "uploading": "上傳中",
     "uploading-file": "正在上傳檔案",
     "upstream": "上游",
@@ -3336,6 +3344,8 @@
     "update-profiler-settings": "更新分析器設定。",
     "update-tag-message": "請求更新標籤",
     "updating-existing-not-possible-can-add-new-values": "無法更新現有值，只允許新增新值。",
+    "upload-document-hint": "SVG、PNG、JPG 或 GIF、PNG、JPG（最大 5MB）",
+    "upload-failed": "上傳失敗，請重試",
     "upload-file": "上傳檔案",
     "upload-file-description": "將合約檔案上傳到此資產。",
     "upload-file-to-validate": "Upload a file to validate",
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterArchivePage/ContextCenterArchivePage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterArchivePage/ContextCenterArchivePage.tsx
new file mode 100644
index 000000000000..4304c205684f
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterArchivePage/ContextCenterArchivePage.tsx
@@ -0,0 +1,55 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { Home02 } from '@untitledui/icons';
+import { FC } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useNavigate } from 'react-router-dom';
+import ContextCenterHeader from '../../../components/ContextCenter/ContextCenterHeader/ContextCenterHeader.component';
+import { ROUTES } from '../../../constants/constants';
+
+const ContextCenterArchivePage: FC = () => {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+
+  return (
+    <div
+      className="tw:flex tw:flex-col tw:w-full tw:bg-secondary tw:px-5"
+      data-testid="context-center-archive-page">
+      <ContextCenterHeader
+        breadcrumbs={[
+          {
+            name: '',
+            icon: <Home02 size={14} />,
+            url: '/',
+            activeTitle: true,
+          },
+          { name: t('label.context-center'), url: ROUTES.CONTEXT_CENTER },
+          {
+            activeTitle: true,
+            name: t('label.archive'),
+            url: '',
+          },
+        ]}
+        subtitle={t('message.context-center-archive-subtitle', {
+          defaultValue: 'View archived articles and documents',
+        })}
+        title={t('label.archive')}
+        onCreateArticle={() => navigate(ROUTES.CONTEXT_CENTER_ARTICLES)}
+        onUploadFile={() => undefined}
+      />
+    </div>
+  );
+};
+
+export default ContextCenterArchivePage;
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterArticlesPage/ContextCenterArticlesPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterArticlesPage/ContextCenterArticlesPage.tsx
new file mode 100644
index 000000000000..2b99b62230b8
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterArticlesPage/ContextCenterArticlesPage.tsx
@@ -0,0 +1,321 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { Button, Dropdown } from '@openmetadata/ui-core-components';
+import { ChevronDown, Home02 } from '@untitledui/icons';
+import { AxiosError } from 'axios';
+import cryptoRandomString from 'crypto-random-string-with-promisify-polyfill';
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useNavigate } from 'react-router-dom';
+import { withActivityFeed } from '../../../components/AppRouter/withActivityFeed';
+import ArticleDetailHeader from '../../../components/ContextCenter/ArticleDetailHeader/ArticleDetailHeader.component';
+import ArticleVersionHeader from '../../../components/ContextCenter/ArticleVersionHeader/ArticleVersionHeader.component';
+import ContextCenterHeader from '../../../components/ContextCenter/ContextCenterHeader/ContextCenterHeader.component';
+import KnowledgeCenterLayout from '../../../components/KnowledgeCenter/KnowledgeCenterLayout/KnowledgeCenterLayout';
+import KnowledgePageDetailComponent from '../../../components/KnowledgeCenter/KnowledgePageDetailComponent/KnowledgePageDetailComponent';
+import KnowledgePageListComponent from '../../../components/KnowledgeCenter/KnowledgePageListComponent/KnowledgePageListComponent';
+import KnowledgePagesHierarchy from '../../../components/KnowledgeCenter/KnowledgePagesHierarchy/KnowledgePagesHierarchy';
+import {
+  QuickLinkFormModal,
+  QuickLinkFormModalFormData,
+} from '../../../components/KnowledgeCenter/QuickLinkFormModal/QuickLinkFormModal';
+import { ROUTES } from '../../../constants/constants';
+import { useLimitStore } from '../../../context/LimitsProvider/useLimitsStore';
+import { usePermissionProvider } from '../../../context/PermissionProvider/PermissionProvider';
+import {
+  OperationPermission,
+  ResourceEntity,
+} from '../../../context/PermissionProvider/PermissionProvider.interface';
+import { EntityTabs } from '../../../enums/entity.enum';
+import LimitWrapper from '../../../hoc/LimitWrapper';
+import { useApplicationStore } from '../../../hooks/useApplicationStore';
+import { useFqn } from '../../../hooks/useFqn';
+import {
+  ContentChangeState,
+  CreateKnowledgePage,
+  KnowledgeCenterPageProps,
+  KnowledgeCenterPageRef,
+  KnowledgePagesHierarchyRef,
+  PageType,
+} from '../../../interface/knowledge-center.interface';
+import { postKnowledgePage } from '../../../rest/knowledgeCenterAPI';
+import { createArticleKnowledgePage } from '../../../utils/ContextCenterUtils';
+import { getContextCenterArticlePath } from '../../../utils/KnowledgePageUtils';
+import { DEFAULT_ENTITY_PERMISSION } from '../../../utils/PermissionsUtils';
+import { showErrorToast } from '../../../utils/ToastUtils';
+import { useRequiredParams } from '../../../utils/useRequiredParams';
+import KnowledgePageVersionPage from '../../KnowledgePageVersionPage/KnowledgePageVersionPage';
+
+const ContextCenterArticlesPage = () => {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+  const { fqn } = useFqn();
+  const { version } = useRequiredParams<{ version?: string }>();
+  const { currentUser } = useApplicationStore();
+  const USERId = currentUser?.id ?? '';
+  const { getResourcePermission } = usePermissionProvider();
+  const { getResourceLimit } = useLimitStore();
+  const knowledgeCenterPageRef = useRef<KnowledgeCenterPageRef>(null);
+  const knowledgePagesHierarchyRef = useRef<KnowledgePagesHierarchyRef>(null);
+
+  const [permissions, setPermissions] = useState<OperationPermission>(
+    DEFAULT_ENTITY_PERMISSION
+  );
+  const [page, setPage] = useState<KnowledgeCenterPageProps>({
+    data: undefined,
+    header: null,
+    rightPanel: null,
+    title: '',
+  });
+  const [isRightPanelOpen, setIsRightPanelOpen] = useState(true);
+  const [showAddLinkModal, setShowAddLinkModal] = useState(false);
+
+  const handleFetchKnowledgePageHierarchy = useCallback(
+    (forceRefresh?: boolean) =>
+      knowledgePagesHierarchyRef.current?.fetchKnowledgePageHierarchy(
+        forceRefresh
+      ) ?? Promise.resolve(),
+    []
+  );
+
+  const handlePageChange = useCallback(
+    (incoming: Partial<KnowledgeCenterPageProps>) => {
+      setPage((prev) => ({ ...prev, ...incoming }));
+    },
+    []
+  );
+
+  const handleToggleRightPanel = useCallback(
+    () => setIsRightPanelOpen((prev) => !prev),
+    []
+  );
+
+  const fetchPermission = async () => {
+    try {
+      const response = await getResourcePermission(
+        ResourceEntity.KNOWLEDGE_PAGE as unknown as ResourceEntity
+      );
+      setPermissions(response);
+    } catch (error) {
+      showErrorToast(error as AxiosError);
+    }
+  };
+
+  const addArticleKnowledgePage = async () => {
+    await createArticleKnowledgePage(USERId, navigate, () =>
+      getResourceLimit('knowledgeCenter', true, true)
+    );
+  };
+
+  const addQuickLinkKnowledgePage = async (
+    formData: QuickLinkFormModalFormData
+  ) => {
+    try {
+      const tags = [
+        ...(formData.tags ?? []),
+        ...(formData.glossaryTerms ?? []),
+      ];
+      const data: CreateKnowledgePage = {
+        description: formData.description,
+        displayName: formData.displayName ?? '',
+        name: `${PageType.QUICK_LINK}_${cryptoRandomString({
+          length: 8,
+          type: 'alphanumeric',
+        })}`,
+        owners: [{ id: USERId, type: 'user' }],
+        page: { url: formData.url },
+        pageType: PageType.QUICK_LINK,
+        relatedEntities: formData?.relatedEntities,
+        tags,
+      };
+      const response = await postKnowledgePage(data);
+      knowledgeCenterPageRef.current?.addKnowledgePage(response);
+    } catch (error) {
+      showErrorToast(error as AxiosError);
+    }
+  };
+
+  useEffect(() => {
+    fetchPermission();
+  }, []);
+
+  const renderHeader = () => {
+    if (version) {
+      return <ArticleVersionHeader knowledgePage={page.data} />;
+    }
+
+    if (fqn) {
+      return (
+        <ArticleDetailHeader
+          activeTab={page.activeTab}
+          contentChangeState={
+            page.handlers?.contentChangeState ?? ContentChangeState.SAVED
+          }
+          fetchKnowledgePageHierarchy={handleFetchKnowledgePageHierarchy}
+          isRightPanelOpen={isRightPanelOpen}
+          knowledgePage={page.data}
+          permissions={permissions}
+          tabs={page.tabs}
+          onFollowChange={
+            page.handlers?.onFollowChange ?? (async () => undefined)
+          }
+          onSave={page.handlers?.onSave}
+          onSetThreadLink={page.handlers?.onSetThreadLink ?? (() => undefined)}
+          onTabChange={page.onTabChange}
+          onToggleDelete={page.handlers?.onToggleDelete ?? (() => undefined)}
+          onToggleRightPanel={handleToggleRightPanel}
+          onVoteChange={page.handlers?.onVoteChange ?? (async () => undefined)}
+        />
+      );
+    }
+
+    return (
+      <ContextCenterHeader
+        actionsSlot={
+          permissions.Create && (
+            <LimitWrapper resource="knowledgeCenter">
+              <Dropdown.Root>
+                <Button
+                  color="primary"
+                  data-testid="create-knowledge-page-btn"
+                  iconTrailing={ChevronDown}>
+                  {t('label.create')}
+                </Button>
+
+                <Dropdown.Popover placement="bottom start">
+                  <Dropdown.Menu aria-label="create knowledge page">
+                    <Dropdown.Item
+                      data-testid="create-article-btn"
+                      key={PageType.ARTICLE}
+                      onAction={addArticleKnowledgePage}>
+                      {t('label.article')}
+                    </Dropdown.Item>
+
+                    <Dropdown.Item
+                      data-testid="create-quick-link-btn"
+                      key={PageType.QUICK_LINK}
+                      onAction={() => setShowAddLinkModal(true)}>
+                      {t('label.quick-link')}
+                    </Dropdown.Item>
+                  </Dropdown.Menu>
+                </Dropdown.Popover>
+              </Dropdown.Root>
+            </LimitWrapper>
+          )
+        }
+        breadcrumbs={[
+          {
+            name: '',
+            icon: <Home02 size={14} />,
+            url: '/',
+            activeTitle: true,
+          },
+          { name: t('label.context-center'), url: ROUTES.CONTEXT_CENTER },
+          { activeTitle: true, name: t('label.article-plural'), url: '' },
+        ]}
+        subtitle={t('message.internal-knowledge-base-agent-training', {
+          defaultValue: 'Internal knowledge base for agent training',
+        })}
+        title={t('label.article-plural')}
+      />
+    );
+  };
+
+  const isActivityFeedTab =
+    Boolean(fqn) && page.activeTab === EntityTabs.ACTIVITY_FEED;
+
+  const layoutClassName = version
+    ? 'knowledge-version-page'
+    : fqn
+    ? 'knowledge-details-page'
+    : undefined;
+
+  const leftSidebar = isActivityFeedTab ? null : (
+    <KnowledgePagesHierarchy
+      hideAddPageButton
+      activeKey={fqn}
+      activePage={page.data}
+      getPagePath={getContextCenterArticlePath}
+      homeRoute={ROUTES.CONTEXT_CENTER_ARTICLES}
+      isPageHeaderAvailable={Boolean(fqn)}
+      permissions={permissions}
+      ref={knowledgePagesHierarchyRef}
+      onPageDelete={knowledgeCenterPageRef.current?.onPageDelete}
+    />
+  );
+
+  const rightSidebar = isActivityFeedTab
+    ? null
+    : version
+    ? page.rightPanel
+    : isRightPanelOpen
+    ? page.rightPanel
+    : null;
+
+  const centerContent = version ? (
+    <KnowledgePageVersionPage onPageChange={handlePageChange} />
+  ) : fqn ? (
+    <KnowledgePageDetailComponent
+      fetchKnowledgePageHierarchy={handleFetchKnowledgePageHierarchy}
+      getArticlePath={getContextCenterArticlePath}
+      isRightPanelOpen={isRightPanelOpen}
+      onPageChange={handlePageChange}
+      onToggleRightPanel={handleToggleRightPanel}
+    />
+  ) : (
+    <KnowledgePageListComponent
+      hideAddButton
+      getPagePath={getContextCenterArticlePath}
+      permissions={permissions}
+      ref={knowledgeCenterPageRef}
+      onPageChange={handlePageChange}
+    />
+  );
+
+  return (
+    <div
+      className="tw:flex tw:flex-col tw:w-full tw:h-full tw:p-5 tw:pt-0"
+      data-testid="context-center-articles-page">
+      {renderHeader()}
+
+      <KnowledgeCenterLayout
+        centerNoPadding={isActivityFeedTab}
+        className={layoutClassName}
+        leftSidebar={leftSidebar}
+        pageTitle={page.title || t('label.article-plural')}
+        rightSidebar={rightSidebar}>
+        {centerContent}
+      </KnowledgeCenterLayout>
+
+      <QuickLinkFormModal
+        isOpen={showAddLinkModal}
+        permissions={
+          {
+            EditAll: true,
+            EditDescription: true,
+            EditDisplayName: true,
+            EditTags: true,
+          } as OperationPermission
+        }
+        onCancel={() => setShowAddLinkModal(false)}
+        onSave={(data) => {
+          addQuickLinkKnowledgePage(data);
+          setShowAddLinkModal(false);
+        }}
+      />
+    </div>
+  );
+};
+
+export default withActivityFeed(ContextCenterArticlesPage);
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDashboardPage/ContextCenterDashboardPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDashboardPage/ContextCenterDashboardPage.tsx
new file mode 100644
index 000000000000..8de3cea33436
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDashboardPage/ContextCenterDashboardPage.tsx
@@ -0,0 +1,151 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { Home02 } from '@untitledui/icons';
+import { AxiosError } from 'axios';
+import { ArticleCardItem } from 'components/ContextCenter/ArticleCard/ArticleCard.interface';
+import ArticleListSection from 'components/ContextCenter/ArticleListSection/ArticleListSection.component';
+import ContextCenterHeader from 'components/ContextCenter/ContextCenterHeader/ContextCenterHeader.component';
+import UploadDocumentModal from 'components/ContextCenter/UploadDocumentModal/UploadDocumentModal.component';
+import { UploadedDocumentItem } from 'components/ContextCenter/UploadedDocumentCard/UploadedDocumentCard.interface';
+import UploadedDocumentsSection from 'components/ContextCenter/UploadedDocumentsSection/UploadedDocumentsSection.component';
+import { ROUTES } from 'constants/constants';
+import { Asset } from 'generated/attachments/asset';
+import { useApplicationStore } from 'hooks/useApplicationStore';
+import { KnowledgePage } from 'interface/knowledge-center.interface';
+import { FC, useCallback, useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useNavigate } from 'react-router-dom';
+import { getListKnowledgePages } from 'rest/knowledgeCenterAPI';
+import {
+  assetToDocumentItem,
+  CONTEXT_CENTER_DOCUMENTS_ENTITY_LINK,
+  createArticleKnowledgePage,
+  fetchContextCenterDocuments,
+  knowledgePageToArticleItem,
+} from 'utils/ContextCenterUtils';
+import { showErrorToast } from 'utils/ToastUtils';
+
+const RECENT_ARTICLES_LIMIT = 25;
+
+const ContextCenterDashboardPage: FC = () => {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+  const { currentUser } = useApplicationStore();
+
+  const [isUploadModalOpen, setIsUploadModalOpen] = useState(false);
+  const [articles, setArticles] = useState<ArticleCardItem[]>([]);
+  const [documents, setDocuments] = useState<UploadedDocumentItem[]>([]);
+  const [isArticlesLoading, setIsArticlesLoading] = useState(true);
+  const [isDocumentsLoading, setIsDocumentsLoading] = useState(true);
+
+  const handleCreateArticle = useCallback(async () => {
+    await createArticleKnowledgePage(currentUser?.id ?? '', navigate);
+  }, [currentUser, navigate]);
+
+  const fetchRecentArticles = useCallback(async () => {
+    setIsArticlesLoading(true);
+    try {
+      const response = await getListKnowledgePages({
+        fields: 'tags,page',
+        limit: RECENT_ARTICLES_LIMIT,
+      });
+      setArticles(
+        response.data.map((page: KnowledgePage) =>
+          knowledgePageToArticleItem(page, t('label.untitled'))
+        )
+      );
+    } catch (err) {
+      showErrorToast(err as AxiosError);
+    } finally {
+      setIsArticlesLoading(false);
+    }
+  }, [t]);
+
+  const fetchDocuments = useCallback(async () => {
+    setIsDocumentsLoading(true);
+    try {
+      const assets = await fetchContextCenterDocuments();
+      setDocuments(assets.map(assetToDocumentItem));
+    } catch (err) {
+      showErrorToast(err as AxiosError);
+    } finally {
+      setIsDocumentsLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    fetchRecentArticles();
+    fetchDocuments();
+  }, [fetchRecentArticles, fetchDocuments]);
+
+  const handleUploaded = useCallback((newAssets: Asset[]) => {
+    setDocuments((prev) => [...prev, ...newAssets.map(assetToDocumentItem)]);
+  }, []);
+
+  return (
+    <div
+      className="tw:flex tw:flex-col tw:w-full tw:bg-secondary tw:p-5 tw:pt-0"
+      data-testid="context-center-dashboard-page">
+      <ContextCenterHeader
+        breadcrumbs={[
+          {
+            name: '',
+            icon: <Home02 size={14} />,
+            url: '/',
+            activeTitle: true,
+          },
+          { name: t('label.context-center'), url: ROUTES.CONTEXT_CENTER },
+          {
+            activeTitle: true,
+            name: t('label.dashboard'),
+            url: '',
+          },
+        ]}
+        subtitle={t('message.context-center-dashboard-subtitle', {
+          defaultValue: 'Overview of your knowledge base and document library',
+        })}
+        title={t('label.dashboard')}
+        onCreateArticle={handleCreateArticle}
+        onUploadFile={() => setIsUploadModalOpen(true)}
+      />
+
+      <div className="tw:flex tw:flex-col tw:gap-6">
+        <ArticleListSection
+          articles={articles}
+          isLoading={isArticlesLoading}
+          subtitle={t('message.internal-knowledge-base-agent-training', {
+            defaultValue: 'Internal knowledge base for agent training',
+          })}
+          title={t('label.article-amp-quick-link-plural')}
+          onViewAll={() => navigate(ROUTES.CONTEXT_CENTER_ARTICLES)}
+        />
+
+        <UploadedDocumentsSection
+          documents={documents}
+          isLoading={isDocumentsLoading}
+          onViewAll={() => navigate(ROUTES.CONTEXT_CENTER_DOCUMENTS)}
+        />
+      </div>
+
+      <UploadDocumentModal
+        entityLink={CONTEXT_CENTER_DOCUMENTS_ENTITY_LINK}
+        isOpen={isUploadModalOpen}
+        onClose={() => setIsUploadModalOpen(false)}
+        onUploaded={handleUploaded}
+      />
+    </div>
+  );
+};
+
+export default ContextCenterDashboardPage;
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDocumentsPage/ContextCenterDocumentsPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDocumentsPage/ContextCenterDocumentsPage.tsx
new file mode 100644
index 000000000000..f55a70933060
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterDocumentsPage/ContextCenterDocumentsPage.tsx
@@ -0,0 +1,173 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { Button } from '@openmetadata/ui-core-components';
+import { Home02, UploadCloud02 } from '@untitledui/icons';
+import { AxiosError } from 'axios';
+import DeleteModal from 'components/common/DeleteModal/DeleteModal';
+import { DocFile } from 'components/ContextCenter/DocumentsView/DocumentsView.interface';
+import { FC, useCallback, useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { deleteAsset, downloadAsset } from 'rest/assetAPI';
+import { showErrorToast, showSuccessToast } from 'utils/ToastUtils';
+import ContextCenterHeader from '../../../components/ContextCenter/ContextCenterHeader/ContextCenterHeader.component';
+import DocumentsView from '../../../components/ContextCenter/DocumentsView/DocumentsView.component';
+import UploadDocumentModal from '../../../components/ContextCenter/UploadDocumentModal/UploadDocumentModal.component';
+import { ROUTES } from '../../../constants/constants';
+import {
+  assetToDocumentItem,
+  CONTEXT_CENTER_DOCUMENTS_ENTITY_LINK,
+  fetchContextCenterDocuments,
+} from '../../../utils/ContextCenterUtils';
+
+const ContextCenterDocumentsPage: FC = () => {
+  const { t } = useTranslation();
+  const [documents, setDocuments] = useState<DocFile[]>([]);
+  const [isDocumentsLoading, setIsDocumentsLoading] = useState(true);
+  const [isDeletingFile, setIsDeletingFile] = useState(false);
+  const [fileToDelete, setFileToDelete] = useState<DocFile>();
+  const [isUploadModalOpen, setIsUploadModalOpen] = useState(false);
+
+  const fetchDocuments = useCallback(async () => {
+    setIsDocumentsLoading(true);
+    try {
+      const assets = await fetchContextCenterDocuments();
+      setDocuments(assets.map(assetToDocumentItem));
+    } catch (err) {
+      showErrorToast(err as AxiosError);
+    } finally {
+      setIsDocumentsLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    fetchDocuments();
+  }, []);
+
+  const handleDownload = useCallback(async (file: DocFile) => {
+    try {
+      const blob = await downloadAsset(file.id);
+      const url = URL.createObjectURL(blob);
+      const element = document.createElement('a');
+      element.href = url;
+      element.download = file.name;
+      document.body.appendChild(element);
+      element.click();
+      element.remove();
+      URL.revokeObjectURL(url);
+    } catch (err) {
+      showErrorToast(err as AxiosError);
+    }
+  }, []);
+
+  const handleDeleteFile = useCallback((file: DocFile) => {
+    setFileToDelete(file);
+  }, []);
+
+  const handleCancelDelete = useCallback(() => {
+    setFileToDelete(undefined);
+  }, []);
+
+  const handleConfirmDelete = useCallback(async () => {
+    if (!fileToDelete) {
+      return;
+    }
+
+    try {
+      setIsDeletingFile(true);
+      await deleteAsset(fileToDelete.id, true);
+      setDocuments((prev) =>
+        prev.filter((document) => document.id !== fileToDelete.id)
+      );
+      showSuccessToast(
+        t('server.entity-deleted-successfully', {
+          entity: t('label.document'),
+        })
+      );
+      setFileToDelete(undefined);
+    } catch (err) {
+      showErrorToast(err as AxiosError);
+    } finally {
+      setIsDeletingFile(false);
+    }
+  }, [fileToDelete, t]);
+
+  return (
+    <div
+      className="tw:flex tw:flex-col tw:w-full tw:h-full tw:bg-secondary tw:p-5 tw:pt-0"
+      data-testid="context-center-documents-page">
+      <ContextCenterHeader
+        actionsSlot={
+          <div className="tw:flex tw:items-center tw:gap-3 tw:shrink-0">
+            <Button
+              color="primary"
+              iconLeading={UploadCloud02}
+              size="sm"
+              onClick={() => setIsUploadModalOpen(true)}>
+              {t('label.upload-file', { defaultValue: 'Upload File' })}
+            </Button>
+          </div>
+        }
+        breadcrumbs={[
+          {
+            name: '',
+            icon: <Home02 size={14} />,
+            url: '/',
+            activeTitle: true,
+          },
+          { name: t('label.context-center'), url: ROUTES.CONTEXT_CENTER },
+          {
+            activeTitle: true,
+            name: t('label.document-plural'),
+            url: '',
+          },
+        ]}
+        subtitle={t('message.context-center-documents-subtitle', {
+          defaultValue: 'Manage and organize your uploaded documents',
+        })}
+        title={t('label.document-plural')}
+      />
+
+      <div className="tw:flex-1 tw:overflow-hidden">
+        <DocumentsView
+          data={documents}
+          isLoading={isDocumentsLoading}
+          onDeleteFile={handleDeleteFile}
+          onDownload={handleDownload}
+        />
+      </div>
+
+      <UploadDocumentModal
+        entityLink={CONTEXT_CENTER_DOCUMENTS_ENTITY_LINK}
+        isOpen={isUploadModalOpen}
+        onClose={() => setIsUploadModalOpen(false)}
+        onUploaded={() => fetchDocuments()}
+      />
+
+      {fileToDelete && (
+        <DeleteModal
+          entityTitle={fileToDelete.name}
+          isDeleting={isDeletingFile}
+          message={t('message.delete-entity-message', {
+            entity: fileToDelete.name,
+          })}
+          open={Boolean(fileToDelete)}
+          onCancel={handleCancelDelete}
+          onDelete={handleConfirmDelete}
+        />
+      )}
+    </div>
+  );
+};
+
+export default ContextCenterDocumentsPage;
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterIntegrationsPage/ContextCenterIntegrationsPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterIntegrationsPage/ContextCenterIntegrationsPage.tsx
new file mode 100644
index 000000000000..40c3935dbb11
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterIntegrationsPage/ContextCenterIntegrationsPage.tsx
@@ -0,0 +1,55 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { Home02 } from '@untitledui/icons';
+import { FC } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useNavigate } from 'react-router-dom';
+import ContextCenterHeader from '../../../components/ContextCenter/ContextCenterHeader/ContextCenterHeader.component';
+import { ROUTES } from '../../../constants/constants';
+
+const ContextCenterIntegrationsPage: FC = () => {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+
+  return (
+    <div
+      className="tw:flex tw:flex-col tw:w-full tw:bg-secondary tw:px-5"
+      data-testid="context-center-integrations-page">
+      <ContextCenterHeader
+        breadcrumbs={[
+          {
+            name: '',
+            icon: <Home02 size={14} />,
+            url: '/',
+            activeTitle: true,
+          },
+          { name: t('label.context-center'), url: ROUTES.CONTEXT_CENTER },
+          {
+            activeTitle: true,
+            name: t('label.integration-plural'),
+            url: '',
+          },
+        ]}
+        subtitle={t('message.context-center-integrations-subtitle', {
+          defaultValue: 'Connect and manage external integrations',
+        })}
+        title={t('label.integration-plural')}
+        onCreateArticle={() => navigate(ROUTES.CONTEXT_CENTER_ARTICLES)}
+        onUploadFile={() => undefined}
+      />
+    </div>
+  );
+};
+
+export default ContextCenterIntegrationsPage;
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterPage.mock.ts b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterPage.mock.ts
new file mode 100644
index 000000000000..6f0d635f159f
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterPage.mock.ts
@@ -0,0 +1,215 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { ArticleCardItem } from '../../components/ContextCenter/ArticleCard/ArticleCard.interface';
+import { DocFolder } from '../../components/ContextCenter/DocumentsView/DocumentsView.interface';
+import { UploadedDocumentItem } from '../../components/ContextCenter/UploadedDocumentCard/UploadedDocumentCard.interface';
+
+export const MOCK_ARTICLES: ArticleCardItem[] = [
+  {
+    badge: 'sensitive',
+    description:
+      'Detailed guidelines for regulatory compliance across EMEA and...',
+    id: '1',
+    lastEditedAt: Date.now() - 7200000,
+    tags: [{ label: 'Compliance' }, { label: 'Legal' }],
+    title: 'Q3 Compliance Protocols v4',
+  },
+  {
+    badge: 'new',
+    description:
+      'Developer quick-start guide for integrating the Context API into...',
+    id: '2',
+    lastEditedAt: Date.now() - 18000000,
+    tags: [{ label: 'DevDocs' }, { label: 'Tech' }],
+    title: 'Internal API Documentation',
+  },
+  {
+    badge: 'new',
+    description:
+      'Developer quick-start guide for integrating Context API into...',
+    id: '3',
+    lastEditedAt: Date.now() - 18000000,
+    tags: [{ label: 'DevDocs' }, { label: 'Tech' }],
+    title: 'Internal API Documentation',
+  },
+  {
+    badge: 'sensitive',
+    description:
+      'Detailed guidelines for regulatory compliance across EMEA and...',
+    id: '4',
+    lastEditedAt: Date.now() - 7200000,
+    tags: [{ label: 'Compliance' }, { label: 'Legal' }],
+    title: 'Q3 Compliance Protocols v4',
+  },
+  {
+    badge: 'sensitive',
+    description:
+      'Detailed guidelines for regulatory compliance across EMEA and...',
+    id: '5',
+    lastEditedAt: Date.now() - 7200000,
+    tags: [{ label: 'Compliance' }, { label: 'Legal' }],
+    title: 'Q3 Compliance Protocols v4',
+  },
+  {
+    badge: 'sensitive',
+    description:
+      'Detailed guidelines for regulatory compliance across EMEA and...',
+    id: '6',
+    lastEditedAt: Date.now() - 7200000,
+    tags: [{ label: 'Compliance' }, { label: 'Legal' }],
+    title: 'Q3 Compliance Protocols v4',
+  },
+];
+
+export const MOCK_FOLDERS: DocFolder[] = [
+  {
+    files: [
+      {
+        fileType: 'pdf',
+        id: 'f1-1',
+        name: 'Q4_Revenue_Report.pdf',
+        sizeLabel: '2.4 MB',
+        uploadedAt: '4 hours ago',
+        uploadedBy: 'Phoenix Baker',
+      },
+      {
+        fileType: 'xlsx',
+        id: 'f1-2',
+        name: 'Annual_Budget_2025.xlsx',
+        sizeLabel: '1.8 MB',
+        uploadedAt: '1 day ago',
+        uploadedBy: 'Olivia Rhye',
+      },
+    ],
+    id: 'f1',
+    name: 'Financial Reports',
+  },
+  {
+    files: [
+      {
+        fileType: 'xlsx',
+        id: 'f2-1',
+        name: 'Customer_Data_Export.xlsx',
+        sizeLabel: '5.2 MB',
+        uploadedAt: '2 days ago',
+        uploadedBy: 'Lana Steiner',
+      },
+      {
+        fileType: 'csv',
+        id: 'f2-2',
+        name: 'Sales_Schema_v2.csv',
+        sizeLabel: '340 KB',
+        uploadedAt: '8 hours ago',
+        uploadedBy: 'Demi Wilkinson',
+      },
+    ],
+    id: 'f2',
+    name: 'Data Exports',
+  },
+  {
+    files: [
+      {
+        fileType: 'pdf',
+        id: 'f3-1',
+        name: 'GDPR_Compliance_Audit.pdf',
+        sizeLabel: '3.1 MB',
+        uploadedAt: '3 days ago',
+        uploadedBy: 'Candice Wu',
+      },
+      {
+        fileType: 'pdf',
+        id: 'f3-2',
+        name: 'SOC2_Report_2024.pdf',
+        sizeLabel: '8.7 MB',
+        uploadedAt: '1 day ago',
+        uploadedBy: 'Olivia Rhye',
+      },
+    ],
+    id: 'f3',
+    name: 'Compliance',
+  },
+  {
+    files: [
+      {
+        fileType: 'xlsx',
+        id: 'f4-1',
+        name: 'Employee_Records.xlsx',
+        sizeLabel: '12 MB',
+        uploadedAt: 'Just now',
+        uploadedBy: 'Phoenix Baker',
+      },
+    ],
+    id: 'f4',
+    name: 'Training Materials',
+  },
+];
+
+export const MOCK_DOCUMENTS: UploadedDocumentItem[] = [
+  {
+    fileType: 'doc',
+    id: 'd1',
+    name: 'Annual_Report_2023...',
+    sizeLabel: '4.2 MB',
+    status: 'processed',
+  },
+  {
+    fileType: 'pdf',
+    id: 'd2',
+    name: 'Product_Pricing_Final...',
+    sizeLabel: '128 KB',
+    status: 'processed',
+  },
+  {
+    fileType: 'image',
+    id: 'd3',
+    name: 'Office_Layout_Mocku...',
+    sizeLabel: '2.1 MB',
+    status: 'processed',
+  },
+  {
+    fileType: 'xls',
+    id: 'd4',
+    name: 'Marketing_Overview_...',
+    sizeLabel: '18.5 MB',
+    status: 'analyzing',
+  },
+  {
+    fileType: 'doc',
+    id: 'd5',
+    name: 'Annual_Report_2023...',
+    sizeLabel: '4.2 MB',
+    status: 'processed',
+  },
+  {
+    fileType: 'pdf',
+    id: 'd6',
+    name: 'Product_Pricing_Final...',
+    sizeLabel: '128 KB',
+    status: 'processed',
+  },
+  {
+    fileType: 'image',
+    id: 'd7',
+    name: 'Office_Layout_Mocku...',
+    sizeLabel: '2.1 MB',
+    status: 'processed',
+  },
+  {
+    fileType: 'xls',
+    id: 'd8',
+    name: 'Marketing_Overview_...',
+    sizeLabel: '18.5 MB',
+    status: 'analyzing',
+  },
+];
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/KnowledgeCenterPage/KnowledgeCenterPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/KnowledgeCenterPage/KnowledgeCenterPage.tsx
index 4a82d383197b..e4366f4c5d5a 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/KnowledgeCenterPage/KnowledgeCenterPage.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/KnowledgeCenterPage/KnowledgeCenterPage.tsx
@@ -11,7 +11,7 @@
  *  limitations under the License.
  */
 import { DownOutlined } from '@ant-design/icons';
-import { Button, Dropdown, MenuProps, Space } from 'antd';
+import { Button, Dropdown, MenuProps, Space, Tabs, TabsProps } from 'antd';
 import { AxiosError } from 'axios';
 import classNames from 'classnames';
 import cryptoRandomString from 'crypto-random-string-with-promisify-polyfill';
@@ -258,6 +258,32 @@ const KnowledgeCenterPage = () => {
     fetchPermission();
   }, []);
 
+  const centerContent = useMemo(() => {
+    if (version) {
+      return renderVersionPage();
+    }
+    if (page.tabs && fqn) {
+      return (
+        <Tabs
+          activeKey={page.activeTab}
+          className="entity-details-page-tabs"
+          items={page.tabs as unknown as TabsProps['items']}
+          onChange={page.onTabChange}
+        />
+      );
+    }
+
+    return renderDetailOrListPage();
+  }, [
+    version,
+    page.tabs,
+    page.activeTab,
+    page.onTabChange,
+    fqn,
+    renderVersionPage,
+    renderDetailOrListPage,
+  ]);
+
   return (
     <PageLayoutV1 pageTitle={t('label.knowledge-center')}>
       {page.header}
@@ -277,7 +303,7 @@ const KnowledgeCenterPage = () => {
         leftSidebarTitle={leftSidebarTitle}
         pageTitle={page.title}
         rightSidebar={page.rightPanel}>
-        {version ? renderVersionPage() : renderDetailOrListPage()}
+        {centerContent}
       </KnowledgeCenterLayout>
       {addQuickLinkModalElement}
     </PageLayoutV1>
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/KnowledgePageVersionPage/KnowledgePageVersionPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/KnowledgePageVersionPage/KnowledgePageVersionPage.tsx
index d8bf65e55fc3..d07093a0fb65 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/KnowledgePageVersionPage/KnowledgePageVersionPage.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/KnowledgePageVersionPage/KnowledgePageVersionPage.tsx
@@ -182,7 +182,7 @@ const KnowledgePageVersionPage: FC<KnowledgePageVersionPageProps> = ({
     onPageChange({
       rightPanel: getVersionTimeLineElement(),
       title: selectedData?.displayName || t('label.untitled'),
-      data: undefined,
+      data: knowledgePage,
       header: getHeaderElement(),
     });
   }, [selectedData, loading, versionList, version, knowledgePage]);
diff --git a/openmetadata-ui/src/main/resources/ui/src/rest/assetAPI.ts b/openmetadata-ui/src/main/resources/ui/src/rest/assetAPI.ts
new file mode 100644
index 000000000000..d8f9633c9c0a
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/rest/assetAPI.ts
@@ -0,0 +1,63 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+import { AxiosResponse } from 'axios';
+import { Asset, AssetType } from '../generated/attachments/asset';
+import APIClient from './index';
+
+export const uploadAsset = async (
+  file: File,
+  entityLink: string,
+  assetType: AssetType = AssetType.External
+): Promise<Asset> => {
+  const formData = new FormData();
+  formData.append('file', file);
+  formData.append('entityLink', entityLink);
+  formData.append('assetType', assetType);
+
+  const response = await APIClient.post<FormData, AxiosResponse<Asset>>(
+    '/attachments/upload',
+    formData,
+    { headers: { 'Content-Type': 'multipart/form-data' } }
+  );
+
+  return response.data;
+};
+
+export const listAssetsByFqn = async (
+  fqn: string,
+  assetType: AssetType = AssetType.External
+): Promise<Asset[]> => {
+  const response = await APIClient.get<Asset[]>(
+    `/attachments/fqn/${encodeURIComponent(fqn)}/${assetType}`
+  );
+
+  return response.data;
+};
+
+export const deleteAsset = async (
+  id: string,
+  hardDelete = false
+): Promise<void> => {
+  await APIClient.delete(`/attachments/${id}`, {
+    params: { hardDelete },
+  });
+};
+
+export const downloadAsset = async (id: string): Promise<Blob> => {
+  const response = await APIClient.get<Blob>(`/attachments/${id}/download`, {
+    params: { direct: false },
+    responseType: 'blob',
+  });
+
+  return response.data;
+};
diff --git a/openmetadata-ui/src/main/resources/ui/src/rest/knowledgeCenterAPI.ts b/openmetadata-ui/src/main/resources/ui/src/rest/knowledgeCenterAPI.ts
index 70044fb423d3..f1a30ea8c8c4 100644
--- a/openmetadata-ui/src/main/resources/ui/src/rest/knowledgeCenterAPI.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/rest/knowledgeCenterAPI.ts
@@ -34,7 +34,16 @@ export interface KnowledgePageHierarchyParams {
   limit: number;
 }
 
-export const getListKnowledgePages = async (params?: ListParams) => {
+export type KnowledgePageListParams = ListParams & {
+  pageType?: PageType;
+  entityType?: string;
+  entityId?: string;
+  tagFQN?: string;
+};
+
+export const getListKnowledgePages = async (
+  params?: KnowledgePageListParams
+) => {
   const response = await APIClient.get<PagingResponse<KnowledgePage[]>>(
     '/knowledgeCenter',
     { params }
diff --git a/openmetadata-ui/src/main/resources/ui/src/utils/ContextCenterUtils.tsx b/openmetadata-ui/src/main/resources/ui/src/utils/ContextCenterUtils.tsx
new file mode 100644
index 000000000000..11c8bac4c2f5
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/utils/ContextCenterUtils.tsx
@@ -0,0 +1,165 @@
+/*
+ *  Copyright 2026 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+
+import { File06 } from '@untitledui/icons';
+import { AxiosError } from 'axios';
+import cryptoRandomString from 'crypto-random-string-with-promisify-polyfill';
+import { ReactComponent as DOCIcon } from '../assets/svg/ic-doc.svg';
+import { ReactComponent as ImageIcon } from '../assets/svg/ic-image.svg';
+import { ReactComponent as PDFIcon } from '../assets/svg/ic-pdf.svg';
+import { ReactComponent as XLSIcon } from '../assets/svg/ic-xls.svg';
+import { ArticleCardItem } from '../components/ContextCenter/ArticleCard/ArticleCard.interface';
+import { UploadedDocumentItem } from '../components/ContextCenter/UploadedDocumentCard/UploadedDocumentCard.interface';
+import { CREATE_PAGE_HASH, ROUTES } from '../constants/constants';
+import { EntityType } from '../enums/entity.enum';
+import { Asset, AssetType } from '../generated/attachments/asset';
+import {
+  CreateKnowledgePage,
+  PageType,
+  QuickLink,
+} from '../interface/knowledge-center.interface';
+import { listAssetsByFqn } from '../rest/assetAPI';
+import { postKnowledgePage } from '../rest/knowledgeCenterAPI';
+import EntityLink from './EntityLink';
+import { getEntityName } from './EntityUtils';
+import { getContextCenterArticlePath } from './KnowledgePageUtils';
+import { showErrorToast } from './ToastUtils';
+
+export const CONTEXT_CENTER_DOCUMENTS_FQN = 'contextCenter.documents';
+
+export const CONTEXT_CENTER_DOCUMENTS_ENTITY_LINK = EntityLink.getEntityLink(
+  EntityType.KNOWLEDGE_PAGE,
+  CONTEXT_CENTER_DOCUMENTS_FQN
+);
+
+export const extensionToFileType = (
+  fileName: string
+): UploadedDocumentItem['fileType'] => {
+  const ext = fileName.split('.').pop()?.toLowerCase() ?? '';
+
+  if (['doc', 'docx'].includes(ext)) {
+    return 'doc';
+  }
+  if (ext === 'pdf') {
+    return 'pdf';
+  }
+  if (['xls', 'xlsx', 'csv'].includes(ext)) {
+    return 'xls';
+  }
+  if (['jpg', 'jpeg', 'png', 'gif', 'svg', 'webp'].includes(ext)) {
+    return 'image';
+  }
+
+  return 'other';
+};
+
+export const getFileTypeIcon = (fileType: string) => {
+  const commonProps = {
+    width: 32,
+    height: 32,
+  };
+  switch (fileType) {
+    case 'doc':
+      return <DOCIcon {...commonProps} />;
+    case 'pdf':
+      return <PDFIcon {...commonProps} />;
+    case 'xls':
+      return <XLSIcon {...commonProps} />;
+    case 'image':
+      return <ImageIcon {...commonProps} />;
+    default:
+      return <File06 {...commonProps} className="tw:text-gray-500" />;
+  }
+};
+
+export const formatBytes = (bytes?: number): string => {
+  if (!bytes) {
+    return '';
+  }
+  if (bytes < 1024) {
+    return `${bytes} B`;
+  }
+  if (bytes < 1024 * 1024) {
+    return `${(bytes / 1024).toFixed(1)} KB`;
+  }
+
+  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+};
+
+export const assetToDocumentItem = (asset: Asset): UploadedDocumentItem => ({
+  fileType: extensionToFileType(asset.fileName),
+  id: asset.id,
+  name: asset.fileName,
+  sizeLabel: formatBytes(asset.size),
+  status: 'processed',
+});
+
+export const knowledgePageToArticleItem = (
+  data: {
+    id: string;
+    displayName?: string;
+    description?: string;
+    updatedAt: number;
+    tags?: { tagFQN: string }[];
+    fullyQualifiedName?: string;
+    pageType?: PageType;
+    page?: QuickLink | unknown;
+  },
+  untitledLabel: string
+): ArticleCardItem => ({
+  description: data.description ?? '',
+  href:
+    data.pageType === PageType.QUICK_LINK
+      ? (data.page as QuickLink)?.url
+      : data.fullyQualifiedName
+      ? `${ROUTES.CONTEXT_CENTER_ARTICLES}/${data.fullyQualifiedName}`
+      : undefined,
+  id: data.id,
+  lastEditedAt: data.updatedAt,
+  tags: (data.tags ?? []).map((tag) => ({
+    label: tag.tagFQN.split('.').pop() ?? tag.tagFQN,
+  })),
+  title: getEntityName(data) || untitledLabel,
+});
+
+export const fetchContextCenterDocuments = async (): Promise<Asset[]> => {
+  return listAssetsByFqn(CONTEXT_CENTER_DOCUMENTS_FQN, AssetType.External);
+};
+
+export const createArticleKnowledgePage = async (
+  userId: string,
+  navigate: (to: { hash: string; pathname: string }) => void,
+  onResourceLimit?: () => void
+): Promise<void> => {
+  try {
+    const data: CreateKnowledgePage = {
+      description: '',
+      displayName: '',
+      name: `${PageType.ARTICLE}_${cryptoRandomString({
+        length: 8,
+        type: 'alphanumeric',
+      })}`,
+      owners: [{ id: userId, type: 'user' }],
+      page: { publicationDate: new Date(), relatedArticles: [] },
+      pageType: PageType.ARTICLE,
+    };
+    const response = await postKnowledgePage(data);
+    onResourceLimit?.();
+    navigate({
+      hash: CREATE_PAGE_HASH,
+      pathname: getContextCenterArticlePath(response.fullyQualifiedName),
+    });
+  } catch (error) {
+    showErrorToast(error as AxiosError);
+  }
+};
diff --git a/openmetadata-ui/src/main/resources/ui/src/utils/KnowledgePageUtils.tsx b/openmetadata-ui/src/main/resources/ui/src/utils/KnowledgePageUtils.tsx
index 87e7f3f748d2..0b3325f30d38 100644
--- a/openmetadata-ui/src/main/resources/ui/src/utils/KnowledgePageUtils.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/utils/KnowledgePageUtils.tsx
@@ -44,6 +44,7 @@ import { usePersistentStorage } from '../hooks/currentUserStore/useCurrentUserSt
 import { useApplicationStore } from '../hooks/useApplicationStore';
 import { RecentlyViewedData } from '../Models';
 import { arraySorterByKey } from './CommonUtils';
+import { getEntityName } from './EntityUtils';
 import Fqn from './Fqn';
 import i18n, { t } from './i18next/LocalUtil';
 
@@ -121,10 +122,12 @@ export const getKnowledgePagePath = (
   tab?: string,
   subTab = 'all'
 ) => {
-  let path = tab ? ROUTES.KNOWLEDGE_PAGE_WITH_TAB : ROUTES.KNOWLEDGE_PAGE;
+  let path = tab
+    ? ROUTES.CONTEXT_CENTER_ARTICLE_DETAIL_WITH_TAB
+    : ROUTES.CONTEXT_CENTER_ARTICLE_DETAIL;
 
   if (tab === EntityTabs.ACTIVITY_FEED) {
-    path = ROUTES.KNOWLEDGE_PAGE_WITH_SUB_TAB;
+    path = ROUTES.CONTEXT_CENTER_ARTICLE_DETAIL_WITH_SUB_TAB;
     path = path.replace(PLACEHOLDER_ROUTE_SUB_TAB, subTab);
   }
 
@@ -137,6 +140,20 @@ export const getKnowledgePagePath = (
   return path;
 };
 
+export const getContextCenterArticlePath = getKnowledgePagePath;
+
+export const getContextCenterArticleVersionsPath = (
+  knowledgePageName: string,
+  version: string
+) => {
+  let path = ROUTES.CONTEXT_CENTER_ARTICLE_VERSION;
+  path = path
+    .replace(PLACEHOLDER_ROUTE_FQN, knowledgePageName)
+    .replace(PLACEHOLDER_ROUTE_VERSION, version);
+
+  return path;
+};
+
 export const getKnowledgeVersionsPath = (
   knowledgePageName: string,
   version: string
@@ -155,20 +172,21 @@ export const convertToTreeData = (
 ) => {
   const treeData: DataNode[] = pages.map((page) => {
     const isActive = activePage?.fullyQualifiedName === page.fullyQualifiedName;
-    const displayName = isActive ? activePage?.displayName : page.displayName;
+    const resolvedPage = isActive ? activePage : page;
+    const title =
+      getEntityName(resolvedPage as KnowledgePage) || i18n.t('label.untitled');
 
     const hasChildren = !isEmpty(page?.children);
     if (!hasChildren) {
       return {
         key: page.fullyQualifiedName,
-        title: displayName || i18n.t('label.untitled'),
-        // mark the node as leaf if it has no children
+        title,
         isLeaf: page.childrenCount === 0,
       } as DataNode;
     } else {
       return {
         key: page.fullyQualifiedName,
-        title: displayName || i18n.t('label.untitled'),
+        title,
         children: convertToTreeData(activePage, page.children),
       } as DataNode;
     }
diff --git a/openmetadata-ui/src/main/resources/ui/yarn.lock b/openmetadata-ui/src/main/resources/ui/yarn.lock
index 480e680fe3a4..5ff7d9b532f5 100644
--- a/openmetadata-ui/src/main/resources/ui/yarn.lock
+++ b/openmetadata-ui/src/main/resources/ui/yarn.lock
@@ -2375,9 +2375,8 @@
     compare-versions "^4.1.2"
 
 "@openmetadata/ui-core-components@link:../../../../../openmetadata-ui-core-components/src/main/resources/ui":
-  version "1.0.0"
-  dependencies:
-    "@material/material-color-utilities" "^0.3.0"
+  version "0.0.0"
+  uid ""
 
 "@peculiar/asn1-schema@^2.3.13", "@peculiar/asn1-schema@^2.3.8":
   version "2.6.0"
@@ -4548,6 +4547,11 @@
     "@typescript-eslint/types" "8.59.0"
     eslint-visitor-keys "^5.0.0"
 
+"@untitledui/file-icons@^0.0.9":
+  version "0.0.9"
+  resolved "https://registry.yarnpkg.com/@untitledui/file-icons/-/file-icons-0.0.9.tgz#5f2d25bde9bcdecb4efff00a775009caf14a4ce5"
+  integrity sha512-wz3btNnSSv2hTujgyxEFL21oyjPtGTj3osU8ZEMe8nwdlmLQEILLe96NMg9b1ciiOC5UOWNDeYIt7IfxEM6qtg==
+
 "@untitledui/icons@^0.0.21":
   version "0.0.21"
   resolved "https://registry.yarnpkg.com/@untitledui/icons/-/icons-0.0.21.tgz#ad4e4c001e4f9506649f1a003d0d6fa96765d88b"
@@ -7221,6 +7225,15 @@ fraction.js@^5.3.4:
   resolved "https://registry.yarnpkg.com/fraction.js/-/fraction.js-5.3.4.tgz#8c0fcc6a9908262df4ed197427bdeef563e0699a"
   integrity sha512-1X1NTtiJphryn/uLQz3whtY6jK3fTqoE3ohKs0tT+Ujr1W59oopxmoEh7Lu5p6vBaPbgoM0bzveAW4Qi5RyWDQ==
 
+framer-motion@^12.38.0:
+  version "12.38.0"
+  resolved "https://registry.yarnpkg.com/framer-motion/-/framer-motion-12.38.0.tgz#cf28e072a95942881ca4e33fd33be41192fd146b"
+  integrity sha512-rFYkY/pigbcswl1XQSb7q424kSTQ8q6eAC+YUsSKooHQYuLdzdHjrt6uxUC+PRAO++q5IS7+TamgIw1AphxR+g==
+  dependencies:
+    motion-dom "^12.38.0"
+    motion-utils "^12.36.0"
+    tslib "^2.4.0"
+
 fs-constants@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/fs-constants/-/fs-constants-1.0.0.tgz#6be0de9be998ce16af8afc24497b9ee9b7ccd9ad"
@@ -9286,6 +9299,26 @@ moment@^2.24.0, moment@^2.29.2, moment@^2.30.1:
   resolved "https://registry.yarnpkg.com/moment/-/moment-2.30.1.tgz#f8c91c07b7a786e30c59926df530b4eac96974ae"
   integrity sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==
 
+motion-dom@^12.38.0:
+  version "12.38.0"
+  resolved "https://registry.yarnpkg.com/motion-dom/-/motion-dom-12.38.0.tgz#9ef3253ea0fb28b6757588327073848d940e9aab"
+  integrity sha512-pdkHLD8QYRp8VfiNLb8xIBJis1byQ9gPT3Jnh2jqfFtAsWUA3dEepDlsWe/xMpO8McV+VdpKVcp+E+TGJEtOoA==
+  dependencies:
+    motion-utils "^12.36.0"
+
+motion-utils@^12.36.0:
+  version "12.36.0"
+  resolved "https://registry.yarnpkg.com/motion-utils/-/motion-utils-12.36.0.tgz#cff2df2a28c3fe53a3de7e0103ba7f73ff7d77a7"
+  integrity sha512-eHWisygbiwVvf6PZ1vhaHCLamvkSbPIeAYxWUuL3a2PD/TROgE7FvfHWTIH4vMl798QLfMw15nRqIaRDXTlYRg==
+
+motion@^12.38.0:
+  version "12.38.0"
+  resolved "https://registry.yarnpkg.com/motion/-/motion-12.38.0.tgz#851fb591f98ed98815e223c09a0de13614ea4155"
+  integrity sha512-uYfXzeHlgThchzwz5Te47dlv5JOUC7OB4rjJ/7XTUgtBZD8CchMN8qEJ4ZVsUmTyYA44zjV0fBwsiktRuFnn+w==
+  dependencies:
+    framer-motion "^12.38.0"
+    tslib "^2.4.0"
+
 ms@^2.1.3:
   version "2.1.3"
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2"