diff --git a/openmetadata-ui/src/main/resources/ui/cypress/common/advancedSearch.js b/openmetadata-ui/src/main/resources/ui/cypress/common/advancedSearch.js
index 408d4fac76c..2c75732ab2d 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/common/advancedSearch.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/common/advancedSearch.js
@@ -171,7 +171,7 @@ export const goToAdvanceSearch = () => {
     'explorePage'
   );
   // Navigate to explore page
-  cy.get('[data-testid="appbar-item-explore"]')
+  cy.get('[data-testid="app-bar-item-explore"]')
     .should('exist')
     .and('be.visible')
     .click();
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/common/common.js b/openmetadata-ui/src/main/resources/ui/cypress/common/common.js
index d813657dfef..7bb4ad1c7f5 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/common/common.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/common/common.js
@@ -376,7 +376,7 @@ export const deleteCreatedService = (
     'api/v1/teams/name/Organization?fields=*',
     'getSettingsPage'
   );
-  cy.get('[data-testid="appbar-item-settings"]')
+  cy.get('[data-testid="app-bar-item-settings"]')
     .should('be.visible')
     .click({ force: true });
   verifyResponseStatusCode('@getSettingsPage', 200);
@@ -454,7 +454,7 @@ export const goToAddNewServicePage = (service_type) => {
     'getSettingsPage'
   );
   // Click on settings page
-  cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+  cy.get('[data-testid="app-bar-item-settings"]').should('be.visible').click();
   verifyResponseStatusCode('@getSettingsPage', 200);
   // Services page
   interceptURL('GET', '/api/v1/services/*', 'getServiceList');
@@ -1055,7 +1055,7 @@ export const updateDescriptionForIngestedTables = (
   verifyResponseStatusCode('@updateEntity', 200);
 
   // re-run ingestion flow
-  cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+  cy.get('[data-testid="app-bar-item-settings"]').should('be.visible').click();
 
   // Services page
   cy.get('.ant-menu-title-content').contains(type).should('be.visible').click();
@@ -1254,7 +1254,7 @@ export const visitServiceDetailsPage = (
 export const visitDataModelPage = (dataModelFQN, dataModelName) => {
   interceptURL('GET', '/api/v1/teams/name/*', 'getOrganization');
 
-  cy.get('[data-testid="appbar-item-settings"]').click();
+  cy.get('[data-testid="app-bar-item-settings"]').click();
 
   verifyResponseStatusCode('@getOrganization', 200);
 
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/common/serviceUtils.js b/openmetadata-ui/src/main/resources/ui/cypress/common/serviceUtils.js
index b613db924e4..83cd882bf20 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/common/serviceUtils.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/common/serviceUtils.js
@@ -19,7 +19,7 @@ export const visitServiceDetailsPage = (service, verifyHeader = true) => {
     'api/v1/teams/name/Organization?fields=*',
     'getSettingsPage'
   );
-  cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+  cy.get('[data-testid="app-bar-item-settings"]').should('be.visible').click();
 
   verifyResponseStatusCode('@getSettingsPage', 200);
   // Services page
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/constants/redirections.constants.js b/openmetadata-ui/src/main/resources/ui/cypress/constants/redirections.constants.js
index 24e751d1822..2f7ff37702e 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/constants/redirections.constants.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/constants/redirections.constants.js
@@ -62,29 +62,29 @@ export const LEFT_PANEL_DETAILS = {
 
 export const NAVBAR_DETAILS = {
   explore: {
-    testid: '[data-testid="appbar-item-explore"]',
+    testid: '[data-testid="app-bar-item-explore"]',
     url: `${BASE_URL}/explore/tables`,
   },
   quality: {
-    testid: '[data-testid="appbar-item-data-quality"]',
+    testid: '[data-testid="app-bar-item-data-quality"]',
     url: `${BASE_URL}/data-quality`,
   },
   insights: {
-    testid: '[data-testid="appbar-item-data-insight"]',
+    testid: '[data-testid="app-bar-item-data-insight"]',
     url: `${BASE_URL}/data-insights`,
   },
   glossary: {
     testid: `[data-testid="governance"]`,
-    subMenu: `[data-testid="appbar-item-glossary"]`,
+    subMenu: `[data-testid="app-bar-item-glossary"]`,
     url: `${BASE_URL}/glossary`,
   },
   tags: {
     testid: `[data-testid="governance"]`,
-    subMenu: '[data-testid="appbar-item-tags"]',
+    subMenu: '[data-testid="app-bar-item-tags"]',
     url: `${BASE_URL}/tags/`,
   },
   settings: {
-    testid: '[data-testid="appbar-item-settings"]',
+    testid: '[data-testid="app-bar-item-settings"]',
     url: `${BASE_URL}/settings/members/teams/Organization`,
   },
   profile: {
@@ -96,7 +96,7 @@ export const NAVBAR_DETAILS = {
 
 export const SETTINGS_LEFT_PANEL = {
   settings: {
-    testid: '[data-testid="appbar-item-settings"]',
+    testid: '[data-testid="app-bar-item-settings"]',
     url: `${BASE_URL}/settings/members/teams/Organization`,
   },
   teams: {
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/AddNewService/postgres.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/AddNewService/postgres.spec.js
index 5bb1c7f0d27..3f426f8d1e6 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/AddNewService/postgres.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/AddNewService/postgres.spec.js
@@ -102,7 +102,7 @@ describe('Postgres Ingestion', () => {
       '/api/v1/services/ingestionPipelines/deploy/*',
       'deployIngestion'
     );
-    cy.get('[data-testid="appbar-item-settings"]')
+    cy.get('[data-testid="app-bar-item-settings"]')
       .should('be.visible')
       .click({ force: true });
     verifyResponseStatusCode('@getSettingsPage', 200);
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/AddNewService/redshiftWithDBT.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/AddNewService/redshiftWithDBT.spec.js
index 667e49caaad..7130e92c122 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/AddNewService/redshiftWithDBT.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/AddNewService/redshiftWithDBT.spec.js
@@ -101,7 +101,7 @@ describe('RedShift Ingestion', () => {
       '/api/v1/services/ingestionPipelines/*/pipelineStatus?startTs=*&endTs=*',
       'pipelineStatus'
     );
-    cy.get('[data-testid="appbar-item-settings"]')
+    cy.get('[data-testid="app-bar-item-settings"]')
       .should('be.visible')
       .click({ force: true });
     verifyResponseStatusCode('@getSettingsPage', 200);
@@ -219,7 +219,7 @@ describe('RedShift Ingestion', () => {
       .should('be.visible')
       .click();
 
-    cy.get('[data-testid="appbar-item-tags"]')
+    cy.get('[data-testid="app-bar-item-tags"]')
       .should('exist')
       .should('be.visible')
       .click({ waitForAnimations: true });
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Features/RestoreEntity.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Features/RestoreEntity.spec.js
index ffe3aa894fa..30497469379 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Features/RestoreEntity.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Features/RestoreEntity.spec.js
@@ -70,7 +70,7 @@ describe('Restore entity functionality should work properly', () => {
   });
 
   it('Check Soft Deleted entity table', () => {
-    cy.get('[data-testid="appbar-item-explore"]').click();
+    cy.get('[data-testid="app-bar-item-explore"]').click();
 
     verifyResponseStatusCode('@nonDeletedTables', 200);
     cy.get('[data-testid="show-deleted"]').should('exist').click();
@@ -91,7 +91,7 @@ describe('Restore entity functionality should work properly', () => {
   });
 
   it("Check Soft Deleted table in it's Schema", () => {
-    cy.get('[data-testid="appbar-item-explore"]').click();
+    cy.get('[data-testid="app-bar-item-explore"]').click();
     verifyResponseStatusCode('@nonDeletedTables', 200);
     cy.get('[data-testid="show-deleted"]').click();
     verifyResponseStatusCode('@showDeletedTables', 200);
@@ -133,7 +133,7 @@ describe('Restore entity functionality should work properly', () => {
   });
 
   it('Restore Soft Deleted table', () => {
-    cy.get('[data-testid="appbar-item-explore"]').click();
+    cy.get('[data-testid="app-bar-item-explore"]').click();
     verifyResponseStatusCode('@nonDeletedTables', 200);
     cy.get('[data-testid="show-deleted"]').click();
     verifyResponseStatusCode('@showDeletedTables', 200);
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Features/TeamsHierarchy.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Features/TeamsHierarchy.spec.js
index 6b5b91567b9..9b1b0d29049 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Features/TeamsHierarchy.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Features/TeamsHierarchy.spec.js
@@ -38,7 +38,9 @@ describe('Add nested teams and test TeamsSelectable', () => {
   beforeEach(() => {
     cy.login();
 
-    cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+    cy.get('[data-testid="app-bar-item-settings"]')
+      .should('be.visible')
+      .click();
     interceptURL('GET', '/api/v1/teams/name/*', 'getOrganization');
     interceptURL('GET', '/api/v1/permissions/team/name/*', 'getPermissions');
     // Clicking on teams
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AddAndRemoveTierAndOwner.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AddAndRemoveTierAndOwner.spec.js
index f5489a6a7a2..68d00b654e6 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AddAndRemoveTierAndOwner.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AddAndRemoveTierAndOwner.spec.js
@@ -163,7 +163,7 @@ describe('Add and Remove Owner', () => {
       'testSuiteDetails'
     );
     interceptURL('GET', '/api/v1/dataQuality/testCases?*', 'testCases');
-    cy.get('[data-testid="appbar-item-data-quality"]')
+    cy.get('[data-testid="app-bar-item-data-quality"]')
       .should('be.visible')
       .click();
     verifyResponseStatusCode('@testSuites', 200);
@@ -189,7 +189,9 @@ describe('Add and Remove Owner', () => {
       '/api/v1/teams/name/Organization?fields=*',
       'getOrganization'
     );
-    cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+    cy.get('[data-testid="app-bar-item-settings"]')
+      .should('be.visible')
+      .click();
     verifyResponseStatusCode('@entityPermission', 200);
     verifyResponseStatusCode('@getOrganization', 200);
     verifyResponseStatusCode('@teamPermission', 200);
@@ -203,8 +205,9 @@ describe('Add and Remove Owner', () => {
     interceptURL('GET', '/api/v1/permissions/glossary/*', 'glossaryPermission');
     interceptURL('GET', '/api/v1/glossaries?*', 'getGlossaries');
     cy.get('[data-testid="governance"]').should('be.visible').click();
-    cy.get('[data-testid="appbar-item-glossary"]').click({
+    cy.get('[data-testid="app-bar-item-glossary"]').click({
       waitForAnimations: true,
+      force: true,
     });
     verifyResponseStatusCode('@getGlossaries', 200);
     cy.get('[data-testid="add-glossary"]').click();
@@ -238,9 +241,9 @@ describe('Add and Remove Owner', () => {
       'getGlossaryTermDetails'
     );
     cy.get('[data-testid="governance"]').should('be.visible').click();
-    cy.get('[data-testid="appbar-item-glossary"]')
+    cy.get('[data-testid="app-bar-item-glossary"]')
       .should('be.visible')
-      .click({ waitForAnimations: true });
+      .click({ waitForAnimations: true, force: true });
     verifyResponseStatusCode('@getGlossaries', 200);
     verifyResponseStatusCode('@glossaryPermission', 200);
     interceptURL('GET', '/api/v1/glossaryTerms*', 'getGlossaryTerms');
@@ -274,9 +277,9 @@ describe('Add and Remove Owner', () => {
     interceptURL('GET', '/api/v1/glossaries?*', 'getGlossaries');
 
     cy.get('[data-testid="governance"]').should('be.visible').click();
-    cy.get('[data-testid="appbar-item-glossary"]')
+    cy.get('[data-testid="app-bar-item-glossary"]')
       .should('be.visible')
-      .click({ waitForAnimations: true });
+      .click({ waitForAnimations: true, force: true });
     verifyResponseStatusCode('@getGlossaries', 200);
     verifyResponseStatusCode('@glossaryPermission', 200);
     interceptURL('GET', '/api/v1/glossaryTerms*', 'getGlossaryTerms');
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AddRoleAndAssignToUser.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AddRoleAndAssignToUser.spec.js
index d16b70d415a..10987cd14b3 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AddRoleAndAssignToUser.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AddRoleAndAssignToUser.spec.js
@@ -28,7 +28,9 @@ describe('Test Add role and assign it to the user', () => {
     cy.login();
     interceptURL('GET', '*api/v1/roles*', 'getRoles');
     interceptURL('GET', '/api/v1/users?*', 'usersPage');
-    cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+    cy.get('[data-testid="app-bar-item-settings"]')
+      .should('be.visible')
+      .click();
   });
 
   it('Create role', () => {
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AddTeamAsOwner.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AddTeamAsOwner.spec.js
index 21cadfaf523..855babd0ac6 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AddTeamAsOwner.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AddTeamAsOwner.spec.js
@@ -48,7 +48,9 @@ describe('Create a team and add that team as a owner of the entity', () => {
   it('Add a group team type and assign it as a owner of the entity', () => {
     interceptURL('GET', '/api/v1/teams/name/*', 'getTeams');
 
-    cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+    cy.get('[data-testid="app-bar-item-settings"]')
+      .should('be.visible')
+      .click();
 
     // Clicking on teams
     cy.get('[data-testid="settings-left-panel"]')
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AdvancedSearchQuickFilters.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AdvancedSearchQuickFilters.spec.js
index 31d7c2cf652..3fc4595e824 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AdvancedSearchQuickFilters.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/AdvancedSearchQuickFilters.spec.js
@@ -33,7 +33,7 @@ describe(`Advanced search quick filters should work properly for assets`, () =>
 
   it(`should show the quick filters for respective assets`, () => {
     // Navigate to explore page
-    cy.get('[data-testid="appbar-item-explore"]').click();
+    cy.get('[data-testid="app-bar-item-explore"]').click();
     QUICK_FILTERS_BY_ASSETS.map((asset) => {
       cy.get(`[data-testid="${asset.tab}"]`).scrollIntoView().click();
 
@@ -50,7 +50,7 @@ describe(`Advanced search quick filters should work properly for assets`, () =>
     const asset = QUICK_FILTERS_BY_ASSETS[0];
 
     // Navigate to explore page
-    cy.get('[data-testid="appbar-item-explore"]').click();
+    cy.get('[data-testid="app-bar-item-explore"]').click();
     cy.get(`[data-testid="${asset.tab}"]`).scrollIntoView().click();
 
     asset.filters
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/Collect.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/Collect.spec.js
index 30a98706e4f..9999758d965 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/Collect.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/Collect.spec.js
@@ -17,29 +17,29 @@ describe('Collect end point should work properly', () => {
   const PAGES = {
     setting: {
       name: 'Settings',
-      mainMenuId: `[data-testid="appbar-item-settings"]`,
+      mainMenuId: `[data-testid="app-bar-item-settings"]`,
     },
     explore: {
       name: 'Explore',
-      mainMenuId: `[data-testid="appbar-item-explore"]`,
+      mainMenuId: `[data-testid="app-bar-item-explore"]`,
     },
     dataQuality: {
       name: 'Quality',
-      mainMenuId: `[data-testid="appbar-item-data-quality"]`,
+      mainMenuId: `[data-testid="app-bar-item-data-quality"]`,
     },
     insight: {
       name: 'Insights',
-      mainMenuId: `[data-testid="appbar-item-data-insight"]`,
+      mainMenuId: `[data-testid="app-bar-item-data-insight"]`,
     },
     glossary: {
       name: 'Glossary',
       mainMenuId: `[data-testid="governance"]`,
-      subMenu: `[data-testid="appbar-item-glossary"]`,
+      subMenu: `[data-testid="app-bar-item-glossary"]`,
     },
     tag: {
       name: 'Tags',
       mainMenuId: `[data-testid="governance"]`,
-      subMenu: `[data-testid="appbar-item-tags"]`,
+      subMenu: `[data-testid="app-bar-item-tags"]`,
     },
   };
 
@@ -66,7 +66,7 @@ describe('Collect end point should work properly', () => {
       if (page.subMenu) {
         // adding manual wait to open dropdown in UI
         cy.wait(500);
-        cy.get(page.subMenu).should('be.visible').click();
+        cy.get(page.subMenu).should('be.visible').click({ force: true });
       }
       assertCollectEndPoint();
     });
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/LogoutUser.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/LogoutUser.spec.js
index 59dca8a0f12..b83dad4d7d2 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/LogoutUser.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/LogoutUser.spec.js
@@ -21,7 +21,7 @@ describe('Logout User', () => {
 
   it('After login logout the user and invalidate the token', () => {
     interceptURL('POST', '/api/v1/users/logout', 'logoutUser');
-    cy.get('[data-testid="appbar-item-logout"]').click();
+    cy.get('[data-testid="app-bar-item-logout"]').click();
 
     cy.get('[data-testid="confirm-logout"]').click();
 
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/SearchFlow.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/SearchFlow.spec.js
index 12ce16194bf..fce7fccff31 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/SearchFlow.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/SearchFlow.spec.js
@@ -55,7 +55,9 @@ describe.skip('pre-requests for test case', () => {
       'api/v1/teams/name/Organization?fields=*',
       'getSettingsPage'
     );
-    cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+    cy.get('[data-testid="app-bar-item-settings"]')
+      .should('be.visible')
+      .click();
     verifyResponseStatusCode('@getSettingsPage', 200);
     // Services page
     interceptURL('GET', '/api/v1/services/*', 'getServiceList');
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Alerts.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Alerts.spec.js
index 838235f1377..9ce762fd364 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Alerts.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Alerts.spec.js
@@ -61,7 +61,7 @@ describe.skip('Alerts page should work properly', () => {
     interceptURL('POST', '/api/v1/events/subscriptions', 'createAlert');
     interceptURL('GET', `/api/v1/search/query?q=*`, 'getSearchResult');
     cy.login();
-    cy.get('[data-testid="appbar-item-settings"]')
+    cy.get('[data-testid="app-bar-item-settings"]')
       .should('exist')
       .and('be.visible')
       .click();
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Bots.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Bots.spec.js
index 1914ad7c809..9bd910114c6 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Bots.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Bots.spec.js
@@ -76,7 +76,7 @@ const revokeToken = () => {
 describe('Bots Page should work properly', () => {
   beforeEach(() => {
     cy.login();
-    cy.get('[data-testid="appbar-item-settings"]')
+    cy.get('[data-testid="app-bar-item-settings"]')
       .should('exist')
       .should('be.visible')
       .click();
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/CustomLogoConfig.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/CustomLogoConfig.spec.js
index 533fb6a289d..412e1cb01e0 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/CustomLogoConfig.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/CustomLogoConfig.spec.js
@@ -26,7 +26,7 @@ describe('Custom Logo Config', () => {
   beforeEach(() => {
     cy.login();
 
-    cy.get('[data-testid="appbar-item-settings"]').click();
+    cy.get('[data-testid="app-bar-item-settings"]').click();
 
     interceptURL(
       'GET',
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Customproperties.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Customproperties.spec.js
index 25f445fe0e3..9d7a921408e 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Customproperties.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Customproperties.spec.js
@@ -25,7 +25,9 @@ describe('Custom Properties should work properly', () => {
     cy.login();
     interceptURL('GET', '/api/v1/teams/name/*', 'settingsPage');
 
-    cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+    cy.get('[data-testid="app-bar-item-settings"]')
+      .should('be.visible')
+      .click();
     verifyResponseStatusCode('@settingsPage', 200);
     cy.get('[data-testid="settings-left-panel"]').should('be.visible');
   });
@@ -59,7 +61,7 @@ describe('Custom Properties should work properly', () => {
         );
 
         // Navigating back to custom properties page
-        cy.get('[data-testid="appbar-item-settings"]').click();
+        cy.get('[data-testid="app-bar-item-settings"]').click();
         cy.get(`[data-menu-id*="customAttributes.${entity.name}"]`)
           .scrollIntoView()
           .click();
@@ -130,7 +132,7 @@ describe('Custom Properties should work properly', () => {
         );
 
         // Navigating back to custom properties page
-        cy.get('[data-testid="appbar-item-settings"]')
+        cy.get('[data-testid="app-bar-item-settings"]')
           .should('be.visible')
           .click();
         // Selecting the entity
@@ -206,7 +208,7 @@ describe('Custom Properties should work properly', () => {
         );
 
         // Navigating back to custom properties page
-        cy.get('[data-testid="appbar-item-settings"]')
+        cy.get('[data-testid="app-bar-item-settings"]')
           .should('be.visible')
           .click();
         cy.get(`[data-menu-id*="customAttributes.${entity.name}"]`)
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/DataInsightAlert.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/DataInsightAlert.spec.js
index f77f851f936..307c97b9679 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/DataInsightAlert.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/DataInsightAlert.spec.js
@@ -30,7 +30,7 @@ describe('Data Insight Alert', () => {
   beforeEach(() => {
     cy.login();
 
-    cy.get('[data-testid="appbar-item-settings"]')
+    cy.get('[data-testid="app-bar-item-settings"]')
       .should('exist')
       .and('be.visible')
       .click();
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/DataInsightSettings.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/DataInsightSettings.spec.js
index 22378d5b27e..0dd3b131bc0 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/DataInsightSettings.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/DataInsightSettings.spec.js
@@ -21,7 +21,7 @@ describe('Data Insight settings page should work properly', () => {
     cy.login();
     interceptURL('GET', '/api/v1/teams/name/*', 'settingsPage');
 
-    cy.get('[data-testid="appbar-item-settings"]').click();
+    cy.get('[data-testid="app-bar-item-settings"]').click();
     verifyResponseStatusCode('@settingsPage', 200);
     cy.get('[data-testid="settings-left-panel"]').should('be.visible');
 
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/DataQualityAndProfiler.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/DataQualityAndProfiler.spec.js
index 22b7d03c04d..27f3ebdb755 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/DataQualityAndProfiler.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/DataQualityAndProfiler.spec.js
@@ -98,7 +98,9 @@ describe('Data Quality and Profiler should work properly', () => {
 
     cy.clickOnLogo();
 
-    cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+    cy.get('[data-testid="app-bar-item-settings"]')
+      .should('be.visible')
+      .click();
     cy.get('[data-menu-id*="databases"]').should('be.visible').click();
     cy.intercept('/api/v1/services/ingestionPipelines?*').as('ingestionData');
     interceptURL(
@@ -443,7 +445,7 @@ describe('Data Quality and Profiler should work properly', () => {
       '/api/v1/search/query?q=*&index=test_case_search_index*',
       'getTestCase'
     );
-    cy.get('[data-testid="appbar-item-data-quality"]').click();
+    cy.get('[data-testid="app-bar-item-data-quality"]').click();
     cy.get('[data-testid="by-test-suites"]').click();
     verifyResponseStatusCode('@testSuite', 200);
     cy.get('[data-testid="add-test-suite-btn"]').click();
@@ -483,7 +485,7 @@ describe('Data Quality and Profiler should work properly', () => {
       '/api/v1/dataQuality/testCases/logicalTestCases',
       'putTestCase'
     );
-    cy.get('[data-testid="appbar-item-data-quality"]').click();
+    cy.get('[data-testid="app-bar-item-data-quality"]').click();
     cy.get('[data-testid="by-test-suites"]').click();
     verifyResponseStatusCode('@testSuite', 200);
     cy.get('[data-testid="test-suite-container"]')
@@ -520,7 +522,7 @@ describe('Data Quality and Profiler should work properly', () => {
       '/api/v1/dataQuality/testCases/logicalTestCases/*/*',
       'removeTestCase'
     );
-    cy.get('[data-testid="appbar-item-data-quality"]').click();
+    cy.get('[data-testid="app-bar-item-data-quality"]').click();
     cy.get('[data-testid="by-test-suites"]').click();
     verifyResponseStatusCode('@testSuite', 200);
     cy.get('[data-testid="test-suite-container"]')
@@ -544,7 +546,7 @@ describe('Data Quality and Profiler should work properly', () => {
       '/api/v1/dataQuality/testSuites?fields=*&testSuiteType=logical',
       'testSuite'
     );
-    cy.get('[data-testid="appbar-item-data-quality"]').click();
+    cy.get('[data-testid="app-bar-item-data-quality"]').click();
     cy.get('[data-testid="by-test-suites"]').click();
     verifyResponseStatusCode('@testSuite', 200);
     cy.get('[data-testid="test-suite-container"]')
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Glossary.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Glossary.spec.js
index c3c6a21b794..5e0d8a053c6 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Glossary.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Glossary.spec.js
@@ -394,10 +394,10 @@ describe('Glossary page should work properly', () => {
       .and('be.visible')
       .then(($el) => {
         cy.wrap($el)
-          .find('[data-testid="appbar-item-glossary"]')
+          .find('[data-testid="app-bar-item-glossary"]')
           .should('exist')
           .and('be.visible')
-          .click();
+          .click({ force: true });
       });
   });
 
@@ -786,7 +786,7 @@ describe('Glossary page should work properly', () => {
       .should('contain', term3);
 
     cy.get('[data-testid="governance"]').click();
-    cy.get('[data-testid="appbar-item-glossary"]').click();
+    cy.get('[data-testid="app-bar-item-glossary"]').click({ force: true });
 
     cy.get('.ant-menu-item').contains(NEW_GLOSSARY_1.name).click();
 
@@ -859,7 +859,7 @@ describe('Glossary page should work properly', () => {
       .and('not.contain', 'Personal');
 
     cy.get('[data-testid="governance"]').click();
-    cy.get('[data-testid="appbar-item-glossary"]').click();
+    cy.get('[data-testid="app-bar-item-glossary"]').click({ force: true });
 
     selectActiveGlossary(NEW_GLOSSARY_1.name);
 
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Policies.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Policies.spec.js
index 84651508a97..4b2ebe406e0 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Policies.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Policies.spec.js
@@ -100,7 +100,9 @@ describe('Policy page should work properly', () => {
     cy.login();
     cy.intercept('GET', '*api/v1/policies*').as('getPolicies');
 
-    cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+    cy.get('[data-testid="app-bar-item-settings"]')
+      .should('be.visible')
+      .click();
 
     cy.get('[data-testid="settings-left-panel"]')
       .contains('Policies')
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Roles.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Roles.spec.js
index 16ccd10b993..94a998433bc 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Roles.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Roles.spec.js
@@ -61,7 +61,9 @@ describe('Roles page should work properly', () => {
 
     interceptURL('GET', '*api/v1/roles*', 'getRoles');
 
-    cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+    cy.get('[data-testid="app-bar-item-settings"]')
+      .should('be.visible')
+      .click();
 
     cy.get('[data-testid="settings-left-panel"]')
       .contains('Roles')
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Service.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Service.spec.js
index 05bce93458d..25550ef9d72 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Service.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Service.spec.js
@@ -38,7 +38,9 @@ describe('Services page should work properly', () => {
     cy.login();
     // redirecting to services page
 
-    cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+    cy.get('[data-testid="app-bar-item-settings"]')
+      .should('be.visible')
+      .click();
 
     cy.get('[data-testid="settings-left-panel"]')
       .contains('Database')
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Tags.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Tags.spec.js
index c79cc589766..d0e479e1de8 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Tags.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Tags.spec.js
@@ -121,7 +121,7 @@ describe('Tags page should work', () => {
 
     // adding manual wait to open dropdown in UI
     cy.wait(500);
-    cy.get('[data-testid="appbar-item-tags"]').should('be.visible').click();
+    cy.get('[data-testid="app-bar-item-tags"]').should('be.visible').click();
     verifyResponseStatusCode('@getTags', 200);
   });
 
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Teams.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Teams.spec.js
index 5a6c8a6321d..350e554f5e6 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Teams.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Teams.spec.js
@@ -53,7 +53,9 @@ describe('Teams flow should work properly', () => {
     interceptURL('GET', `/api/v1/permissions/team/name/*`, 'permissions');
     cy.login();
 
-    cy.get('[data-testid="appbar-item-settings"]').should('be.visible').click();
+    cy.get('[data-testid="app-bar-item-settings"]')
+      .should('be.visible')
+      .click();
 
     // Clicking on teams
     cy.get('[data-testid="settings-left-panel"]')
diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Users.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Users.spec.js
index 5530a23c8eb..b1b6184c14c 100644
--- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Users.spec.js
+++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Pages/Users.spec.js
@@ -34,7 +34,7 @@ describe('Users flow should work properly', () => {
   beforeEach(() => {
     cy.login();
 
-    cy.get('[data-testid="appbar-item-settings"]')
+    cy.get('[data-testid="app-bar-item-settings"]')
       .should('exist')
       .should('be.visible')
       .click();
@@ -82,7 +82,7 @@ describe('Admin flow should work properly', () => {
   beforeEach(() => {
     cy.login();
 
-    cy.get('[data-testid="appbar-item-settings"]')
+    cy.get('[data-testid="app-bar-item-settings"]')
       .should('exist')
       .should('be.visible')
       .click();
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebar.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebar.component.tsx
index fa1a582eb63..cfd759887e1 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebar.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebar.component.tsx
@@ -10,22 +10,21 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
-import { Button, Col, Menu, MenuProps, Row, Typography } from 'antd';
+import { Button, Col, Menu, MenuProps, Row, Tooltip, Typography } from 'antd';
 import Modal from 'antd/lib/modal/Modal';
 import { ReactComponent as GovernIcon } from 'assets/svg/bank.svg';
-import { ReactComponent as ClassificationIcon } from 'assets/svg/classification.svg';
-import { ReactComponent as ExploreIcon } from 'assets/svg/globalsearch.svg';
-import { ReactComponent as GlossaryIcon } from 'assets/svg/glossary.svg';
-import { ReactComponent as QualityIcon } from 'assets/svg/ic-quality-v1.svg';
-import { ReactComponent as SettingsIcon } from 'assets/svg/ic-settings-v1.svg';
-import { ReactComponent as InsightsIcon } from 'assets/svg/lampcharge.svg';
 import { ReactComponent as LogoutIcon } from 'assets/svg/logout.svg';
 import { useAuthContext } from 'components/authentication/auth-provider/AuthProvider';
-import { ROUTES } from 'constants/constants';
+import {
+  SETTING_ITEM,
+  SIDEBAR_GOVERN_LIST,
+  SIDEBAR_LIST,
+} from 'constants/LeftSidebar.constants';
 import React, { useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { NavLink } from 'react-router-dom';
 import './left-sidebar.less';
+import LeftSidebarItem from './LeftSidebarItem.component';
 
 const LeftSidebar = () => {
   const { t } = useTranslation();
@@ -48,53 +47,45 @@ const LeftSidebar = () => {
         key: 'governance',
         popupClassName: 'govern-menu',
         label: (
-          <div
-            className="d-flex flex-col items-center"
-            data-testid="governance">
-            <GovernIcon className="m-0" width={30} />
-            <Typography.Text className="left-panel-label">
-              {t('label.govern', { lng: 'en-US' })}
-            </Typography.Text>
-          </div>
+          <Tooltip
+            overlayClassName="left-panel-tooltip"
+            placement="right"
+            title={
+              <Typography.Text className="left-panel-label">
+                {t('label.govern')}
+              </Typography.Text>
+            }>
+            <GovernIcon data-testid="governance" width={30} />
+          </Tooltip>
+        ),
+        children: SIDEBAR_GOVERN_LIST.map(
+          ({ key, label, icon, redirect_url, dataTestId }) => {
+            const Icon = icon;
+
+            return {
+              key,
+              label: (
+                <Tooltip
+                  overlayClassName="left-panel-tooltip"
+                  placement="right"
+                  title={
+                    <Typography.Text className="left-panel-label">
+                      {label}
+                    </Typography.Text>
+                  }>
+                  <NavLink
+                    className="no-underline d-flex justify-center"
+                    data-testid={dataTestId}
+                    to={{
+                      pathname: redirect_url,
+                    }}>
+                    <Icon className="left-panel-item p-y-sm" width={30} />
+                  </NavLink>
+                </Tooltip>
+              ),
+            };
+          }
         ),
-        children: [
-          {
-            key: 'glossary',
-            label: (
-              <NavLink
-                className="no-underline"
-                data-testid="appbar-item-glossary"
-                to={{
-                  pathname: ROUTES.GLOSSARY,
-                }}>
-                <span className="left-panel-item p-y-xss">
-                  <GlossaryIcon className="m-0" width={30} />
-                  <Typography.Text className="left-panel-label">
-                    {t('label.glossary', { lng: 'en-US' })}
-                  </Typography.Text>
-                </span>
-              </NavLink>
-            ),
-          },
-          {
-            key: 'tags',
-            label: (
-              <NavLink
-                className="no-underline"
-                data-testid="appbar-item-tags"
-                to={{
-                  pathname: ROUTES.TAGS,
-                }}>
-                <div className="left-panel-item p-y-xss">
-                  <ClassificationIcon className="m-0" width={30} />
-                  <Typography.Text className="left-panel-label">
-                    {t('label.classification', { lng: 'en-US' })}
-                  </Typography.Text>
-                </div>
-              </NavLink>
-            ),
-          },
-        ],
       },
     ];
   }, []);
@@ -103,67 +94,18 @@ const LeftSidebar = () => {
     setShowConfirmLogoutModal(true);
   };
 
-  const hideCofirmationModal = () => {
+  const hideConfirmationModal = () => {
     setShowConfirmLogoutModal(false);
   };
 
   return (
     <div className="d-flex flex-col justify-between h-full">
       <Row className="p-y-sm">
-        <Col span={24}>
-          <NavLink
-            className="no-underline"
-            data-testid="appbar-item-explore"
-            to={{
-              pathname: '/explore/tables',
-            }}>
-            <div
-              className={`left-panel-item  ${
-                location.pathname.startsWith('/explore') ? 'active' : ''
-              }`}>
-              <ExploreIcon className="m-0" width={30} />
-              <Typography.Text className="left-panel-label">
-                {t('label.explore', { lng: 'en-US' })}
-              </Typography.Text>
-            </div>
-          </NavLink>
-        </Col>
-        <Col span={24}>
-          <NavLink
-            className="no-underline"
-            data-testid="appbar-item-data-quality"
-            to={{
-              pathname: ROUTES.DATA_QUALITY,
-            }}>
-            <div
-              className={`left-panel-item  ${
-                location.pathname.includes(ROUTES.DATA_QUALITY) ? 'active' : ''
-              }`}>
-              <QualityIcon className="m-0" width={30} />
-              <Typography.Text className="left-panel-label">
-                {t('label.quality', { lng: 'en-US' })}
-              </Typography.Text>
-            </div>
-          </NavLink>
-        </Col>
-        <Col span={24}>
-          <NavLink
-            className="no-underline"
-            data-testid="appbar-item-data-insight"
-            to={{
-              pathname: ROUTES.DATA_INSIGHT,
-            }}>
-            <div
-              className={`left-panel-item  ${
-                location.pathname.includes(ROUTES.DATA_INSIGHT) ? 'active' : ''
-              }`}>
-              <InsightsIcon className="m-0" width={30} />
-              <Typography.Text className="left-panel-label">
-                {t('label.insight-plural', { lng: 'en-US' })}
-              </Typography.Text>
-            </div>
-          </NavLink>
-        </Col>
+        {SIDEBAR_LIST.map((item) => (
+          <Col key={item.key} span={24}>
+            <LeftSidebarItem data={item} />
+          </Col>
+        ))}
         <Menu
           className="left-panel-item"
           items={items}
@@ -174,33 +116,24 @@ const LeftSidebar = () => {
       </Row>
       <Row className="p-y-sm">
         <Col span={24}>
-          <NavLink
-            className="no-underline"
-            data-testid="appbar-item-settings"
-            to={{
-              pathname: ROUTES.SETTINGS,
-            }}>
-            <div
-              className={`left-panel-item  ${
-                location.pathname.startsWith('/settings') ? 'active' : ''
-              }`}>
-              <SettingsIcon className="m-0" width={30} />
-              <Typography.Text className="left-panel-label">
-                {t('label.setting-plural', { lng: 'en-US' })}
-              </Typography.Text>
-            </div>
-          </NavLink>
+          <LeftSidebarItem data={SETTING_ITEM} />
         </Col>
         <Col span={24}>
-          <div
-            className="left-panel-item cursor-pointer"
-            data-testid="appbar-item-logout"
-            onClick={handleLogoutClick}>
-            <LogoutIcon className="m-0" width={30} />
-            <Typography.Text className="left-panel-label">
-              {t('label.logout', { lng: 'en-US' })}
-            </Typography.Text>
-          </div>
+          <Tooltip
+            overlayClassName="left-panel-tooltip"
+            placement="right"
+            title={
+              <Typography.Text className="left-panel-label">
+                {t('label.logout')}
+              </Typography.Text>
+            }>
+            <div
+              className="left-panel-item"
+              data-testid="app-bar-item-logout"
+              onClick={handleLogoutClick}>
+              <LogoutIcon className="m-0" width={30} />
+            </div>
+          </Tooltip>
         </Col>
       </Row>
       {showConfirmLogoutModal && (
@@ -212,14 +145,14 @@ const LeftSidebar = () => {
           footer={null}
           open={showConfirmLogoutModal}
           width={360}
-          onCancel={hideCofirmationModal}>
+          onCancel={hideConfirmationModal}>
           <Typography.Title level={5}>{t('label.logout')}</Typography.Title>
           <Typography.Text className="text-grey-muted">
             {t('message.logout-confirmation')}
           </Typography.Text>
 
           <div className="d-flex gap-2 w-full m-t-md justify-center">
-            <Button className="confirm-btn" onClick={hideCofirmationModal}>
+            <Button className="confirm-btn" onClick={hideConfirmationModal}>
               {t('label.cancel')}
             </Button>
             <Button
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebar.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebar.test.tsx
index 80135c8e04f..8d46c5e1d84 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebar.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebar.test.tsx
@@ -23,10 +23,10 @@ describe('LeftSidebar', () => {
       </BrowserRouter>
     );
 
-    const exploreLink = screen.getByTestId('appbar-item-explore');
-    const qualityLink = screen.getByTestId('appbar-item-data-quality');
-    const insightLink = screen.getByTestId('appbar-item-data-insight');
-    const settingsLink = screen.getByTestId('appbar-item-settings');
+    const exploreLink = screen.getByTestId('app-bar-item-explore');
+    const qualityLink = screen.getByTestId('app-bar-item-data-quality');
+    const insightLink = screen.getByTestId('app-bar-item-data-insight');
+    const settingsLink = screen.getByTestId('app-bar-item-settings');
 
     expect(exploreLink).toBeInTheDocument();
     expect(qualityLink).toBeInTheDocument();
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebarItem.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebarItem.component.tsx
new file mode 100644
index 00000000000..384c0c8c20c
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebarItem.component.tsx
@@ -0,0 +1,57 @@
+/*
+ *  Copyright 2023 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 { Tooltip, Typography } from 'antd';
+import classNames from 'classnames';
+import React from 'react';
+import { NavLink } from 'react-router-dom';
+
+interface LeftSidebarItemProps {
+  data: {
+    key: string;
+    label: string;
+    dataTestId: string;
+    redirect_url: string;
+    icon: SvgComponent;
+  };
+}
+
+const LeftSidebarItem = ({
+  data: { key, label, icon, redirect_url, dataTestId },
+}: LeftSidebarItemProps) => {
+  const Icon = icon;
+
+  return (
+    <Tooltip
+      overlayClassName="left-panel-tooltip"
+      placement="right"
+      title={
+        <Typography.Text className="left-panel-label">{label}</Typography.Text>
+      }>
+      <NavLink
+        className={classNames(
+          'no-underline d-flex justify-center left-panel-item',
+          {
+            active: location.pathname.startsWith(key),
+          }
+        )}
+        data-testid={dataTestId}
+        to={{
+          pathname: redirect_url,
+        }}>
+        <Icon width={30} />
+      </NavLink>
+    </Tooltip>
+  );
+};
+
+export default LeftSidebarItem;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebarItem.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebarItem.test.tsx
new file mode 100644
index 00000000000..27bf34204bc
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/LeftSidebarItem.test.tsx
@@ -0,0 +1,31 @@
+/*
+ *  Copyright 2023 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 { render, screen } from '@testing-library/react';
+import { SETTING_ITEM } from 'constants/LeftSidebar.constants';
+import React from 'react';
+import { BrowserRouter } from 'react-router-dom';
+import LeftSidebarItem from './LeftSidebarItem.component';
+
+describe('LeftSidebar Items', () => {
+  it('renders sidebar items data', () => {
+    render(
+      <BrowserRouter>
+        <LeftSidebarItem data={SETTING_ITEM} />
+      </BrowserRouter>
+    );
+
+    const item = screen.getByTestId('app-bar-item-settings');
+
+    expect(item).toBeInTheDocument();
+  });
+});
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/left-sidebar.less b/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/left-sidebar.less
index f81767d4a31..c7103bc54d1 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/left-sidebar.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/left-sidebar.less
@@ -54,6 +54,13 @@
 }
 
 .left-panel-item {
+  cursor: pointer;
+  color: @text-grey-muted;
+  .ant-menu-submenu-vertical {
+    .ant-menu-submenu-title {
+      margin: 0;
+    }
+  }
   svg {
     color: @text-grey-muted;
   }
@@ -71,16 +78,12 @@
   svg {
     color: @primary-color;
   }
-  .left-panel-label {
-    color: @text-color;
-  }
 }
 
 .govern-menu {
   width: 100px !important;
   .ant-menu-item {
     height: auto !important;
-    padding: 8px 0 0 !important;
     margin: 0;
   }
   .ant-menu-item:hover,
@@ -95,18 +98,25 @@
     }
   }
   .ant-menu-vertical {
-    min-width: 100px !important;
+    min-width: 58px !important;
+    width: 58px;
+    margin-top: 3px;
+    margin-left: 4px;
     .ant-menu-item {
       margin: 0;
     }
+
+    .ant-menu-item:not(:last-child) {
+      margin: 0;
+    }
   }
 }
 
 .left-panel-label.ant-typography {
   font-size: 12px;
-  color: @text-grey-muted;
+  color: @white;
   font-weight: 500;
-  padding-top: 0.5rem;
+  padding: 0 20px;
   line-height: 26px;
   text-decoration: none;
 }
@@ -114,3 +124,10 @@
 .confirm-btn {
   width: 130px;
 }
+
+.left-panel-tooltip {
+  .ant-tooltip-inner {
+    padding: 0;
+    min-height: auto;
+  }
+}
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
new file mode 100644
index 00000000000..5283b0d65aa
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/constants/LeftSidebar.constants.ts
@@ -0,0 +1,70 @@
+/*
+ *  Copyright 2023 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 { ReactComponent as ClassificationIcon } from 'assets/svg/classification.svg';
+import { ReactComponent as ExploreIcon } from 'assets/svg/globalsearch.svg';
+import { ReactComponent as GlossaryIcon } from 'assets/svg/glossary.svg';
+import { ReactComponent as QualityIcon } from 'assets/svg/ic-quality-v1.svg';
+import { ReactComponent as SettingsIcon } from 'assets/svg/ic-settings-v1.svg';
+import { ReactComponent as InsightsIcon } from 'assets/svg/lampcharge.svg';
+import i18next from 'i18next';
+import { ROUTES } from './constants';
+
+export const SIDEBAR_LIST = [
+  {
+    key: ROUTES.EXPLORE,
+    label: i18next.t('label.explore'),
+    redirect_url: '/explore/tables',
+    icon: ExploreIcon,
+    dataTestId: 'app-bar-item-explore',
+  },
+  {
+    key: ROUTES.DATA_QUALITY,
+    label: i18next.t('label.quality'),
+    redirect_url: ROUTES.DATA_QUALITY,
+    icon: QualityIcon,
+    dataTestId: 'app-bar-item-data-quality',
+  },
+  {
+    key: ROUTES.DATA_INSIGHT,
+    label: i18next.t('label.insight-plural'),
+    redirect_url: ROUTES.DATA_INSIGHT,
+    icon: InsightsIcon,
+    dataTestId: 'app-bar-item-data-insight',
+  },
+];
+
+export const SIDEBAR_GOVERN_LIST = [
+  {
+    key: 'glossary',
+    label: i18next.t('label.glossary'),
+    redirect_url: ROUTES.GLOSSARY,
+    icon: GlossaryIcon,
+    dataTestId: 'app-bar-item-glossary',
+  },
+  {
+    key: 'tags',
+    label: i18next.t('label.classification'),
+    redirect_url: ROUTES.TAGS,
+    icon: ClassificationIcon,
+    dataTestId: 'app-bar-item-tags',
+  },
+];
+
+export const SETTING_ITEM = {
+  key: ROUTES.SETTINGS,
+  label: i18next.t('label.setting-plural'),
+  redirect_url: ROUTES.SETTINGS,
+  icon: SettingsIcon,
+  dataTestId: 'app-bar-item-settings',
+};