diff --git a/ui/src/components/pageInfo/PageInfo.tsx b/ui/src/components/pageInfo/PageInfo.tsx
index 3dc77a1be4ddab35442503f2aebe5ed6f2f47795..a8522cb118e5a51a01c2f1774d17c44330224f7b 100644
--- a/ui/src/components/pageInfo/PageInfo.tsx
+++ b/ui/src/components/pageInfo/PageInfo.tsx
@@ -25,6 +25,7 @@ import { useGetContentListQuery } from '@/services/contentList';
 import { useCreateContentMutation } from '@/services/contentCreate';
 import { useNavigationUtils } from '@/hooks/useNavigationUtils';
 import { useErrorBoundary } from 'react-error-boundary';
+import type { ContentStub } from '@/types/Content';
 
 interface PageType {
   [key: string]: ReactElement;
@@ -73,6 +74,11 @@ const PageInfo = () => {
     });
   }
 
+  // @todo https://www.drupal.org/i/3498525 should generalize this to all eligible content entity types.
+  function handleOnSelect(item: ContentStub) {
+    setEditorEntity('xb_page', String(item.id));
+  }
+
   useEffect(() => {
     if (isCreateContentSuccess) {
       setEditorEntity(
@@ -118,7 +124,7 @@ const PageInfo = () => {
               items={pageItems || []}
               onNewPage={handleNewPage}
               onSearch={handleNonWorkingBtn}
-              onSelect={handleNonWorkingBtn}
+              onSelect={handleOnSelect}
               onRename={handleNonWorkingBtn}
               onDuplicate={handleNonWorkingBtn}
               onSetHomepage={handleNonWorkingBtn}
diff --git a/ui/src/hooks/useNavigationUtils.ts b/ui/src/hooks/useNavigationUtils.ts
index d42cebd1062a1f8f9982c74cca363b7bb898e2bb..f74ae666fbb4a5ffc576a9036ea8ba845068e746 100644
--- a/ui/src/hooks/useNavigationUtils.ts
+++ b/ui/src/hooks/useNavigationUtils.ts
@@ -1,3 +1,5 @@
+import { useAppSelector } from '@/app/hooks';
+import { selectBaseUrl } from '@/features/configuration/configurationSlice';
 import { useNavigate, useParams } from 'react-router-dom';
 import { DEFAULT_REGION } from '@/features/ui/uiSlice';
 import { useCallback } from 'react';
@@ -5,6 +7,7 @@ import { useCallback } from 'react';
 export function useNavigationUtils() {
   const { regionId } = useParams();
   const navigate = useNavigate();
+  const baseUrl = useAppSelector(selectBaseUrl);
 
   const setSelectedComponent = useCallback(
     (componentUuid: string) => {
@@ -49,9 +52,9 @@ export function useNavigationUtils() {
   // @todo revisit approach (like using routing) in https://www.drupal.org/i/3502887
   const setEditorEntity = useCallback(
     (entityType: string, entityId: string) => {
-      window.location.href = `/xb/${entityType}/${entityId}`;
+      window.location.href = `${baseUrl}/xb/${entityType}/${entityId}`;
     },
-    [],
+    [baseUrl],
   );
 
   return {
diff --git a/ui/tests/e2e/navigation.cy.js b/ui/tests/e2e/navigation.cy.js
index 9b43092f27a8a41d36ad1e0f60a4e3b55443f75c..5e7e4da428fbb84e58651562136bdec96230155c 100644
--- a/ui/tests/e2e/navigation.cy.js
+++ b/ui/tests/e2e/navigation.cy.js
@@ -53,6 +53,17 @@ describe('Navigation functionality', () => {
     cy.url().should('contain', '/xb/xb_page/3');
   });
 
+  it('Clicking page title navigates to edit page', () => {
+    cy.loadURLandWaitForXBLoaded({ url: 'xb/xb_page/1' });
+
+    cy.findByTestId(navigationButtonTestId).click();
+    cy.contains('div', '/test-page').click();
+    cy.url().should('contain', '/xb/xb_page/2');
+    cy.findByTestId(navigationButtonTestId).click();
+    cy.contains('div', '/homepage').click();
+    cy.url().should('contain', '/xb/xb_page/1');
+  });
+
   it('Clicking the back button navigates to last visited page', () => {
     const BASE_URL = `${Cypress.config().baseUrl}/`;
     const CONFIG_PAGE_URL = `${BASE_URL}admin/config`;