From eca90c4555c9977b1ec74cfd2fc1d312a80a0f78 Mon Sep 17 00:00:00 2001
From: asuresh-code <69875854+asuresh-code@users.noreply.github.com>
Date: Wed, 4 Sep 2024 13:10:53 +0100
Subject: [PATCH] Add tooltips to all Icon buttons #633 (#875)

* Added tooltip to Home breadcrumbs. Unit tests failing due to snapshot differences, need to inspect further

* update snapshots for unit tests #633

* Add tooltip to Systems add icon. Update all corresponding tests #633

* add tooltips to catalogue card (select, and actions).

* Add tooltips to catalogue category (add category) #633

* adjust tooltip offsets #633

* add missing tooltip icons to catalogue related dialogs #633

* updated snaphots #633

* remove offsets from tooltips #633

* added span to address Test warnings

* update corresponding snapshots

* update test to address CI warning on wrapping state updates in act

* undo previous commit. Addresses lint errors (no-unnecessary-act)

* add console.log to debug CI test statements to see what is not wrapped with act

* add act() to modifyValues after console messages

* try moving act to waitFor

* copy format from succeeding test PR

* forgot to add these changes

* remove unused import

* Revert "remove unused import"

This reverts commit b6c9c2964430c5e97013ce6333b641e58c3f7bfa.

* Revert "forgot to add these changes"

This reverts commit 261fe748e95a0eba78cc8084fb3333889b70da13.

* Revert "copy format from succeeding test PR"

This reverts commit 8fd0e18b98e85aaf62072d2153b5f217fc1d7292.

* Revert "try moving act to waitFor"

This reverts commit e722b7cf42b7e67a0619e3c64bfe56a6005a2864.

* Revert "add act() to modifyValues after console messages"

This reverts commit 3b99cdd15469943b7d6c5993f6269be444a20ea9.

* Revert "add console.log to debug CI test statements to see what is not wrapped with act"

This reverts commit 02407a08b519eec5183a7b973b6959849a770d7e.

* remove Home breadcrumbs to see if it's the only tooltip causing warnings

* Revert "remove Home breadcrumbs to see if it's the only tooltip causing warnings"

This reverts commit 89e45f0ee9a57fbc5a07ab96c488abad18876dcd.

* add specific Home Labels #633

* changed implementation from a map to a function

* refactor label implementation #633

* update unit snapshots and test files's aria label, and mislabeled hoem in itemDialog #633

* update e2e manufacturer test's aria label

* reformat homeLocation expression
---
 cypress/e2e/with_api/systems/functions.ts     |   2 +-
 .../e2e/with_mock_data/manufacturers.cy.ts    |   4 +-
 cypress/e2e/with_mock_data/systems.cy.ts      |  14 +-
 src/admin/admin.component.tsx                 |   2 +-
 src/catalogue/catalogue.component.tsx         |  23 +-
 ...oguePropertiesForm.component.test.tsx.snap | 562 ++++++++++--------
 ...aloguePropertyForm.component.test.tsx.snap | 126 ++--
 .../category/catalogueCard.component.tsx      |  51 +-
 ...logueCategoryDirectoryDialog.component.tsx |   2 +-
 .../cataloguePropertiesForm.component.tsx     |  19 +-
 .../cataloguePropertyForm.component.tsx       |  17 +-
 ...talogueItemsDialog.component.test.tsx.snap |  46 +-
 ...atalogueItemsTable.component.test.tsx.snap |   8 +-
 ...catalogueItemDirectoryDialog.component.tsx |   2 +-
 .../items/catalogueItemsDialog.component.tsx  |  18 +-
 .../catalogueItemsLandingPage.component.tsx   |   2 +-
 ...leteCatalogueItemDialog.component.test.tsx |   4 +-
 .../obsoleteCatalogueItemDialog.component.tsx |   2 +-
 src/items/itemDialog.component.tsx            |   2 +-
 src/items/items.component.tsx                 |   2 +-
 src/items/itemsLandingPage.component.tsx      |   2 +-
 .../manufacturer.component.test.tsx.snap      |  62 +-
 .../manufacturer.component.test.tsx           |   2 +-
 src/manufacturer/manufacturer.component.tsx   |   2 +-
 ...manufacturerLandingPage.component.test.tsx |   4 +-
 .../manufacturerLandingPage.component.tsx     |   2 +-
 .../systemItemsTable.component.test.tsx.snap  |   8 +-
 .../systemDirectoryDialog.component.tsx       |   2 +-
 src/systems/systemItemsDialog.component.tsx   |   2 +-
 src/systems/systems.component.test.tsx        |   4 +-
 src/systems/systems.component.tsx             |  20 +-
 .../breadcrumbs.component.test.tsx.snap       | 126 ++--
 src/view/breadcrumbs.component.test.tsx       |   2 +-
 src/view/breadcrumbs.component.tsx            |  24 +-
 34 files changed, 648 insertions(+), 522 deletions(-)

diff --git a/cypress/e2e/with_api/systems/functions.ts b/cypress/e2e/with_api/systems/functions.ts
index fa1b95e87..24186bc3b 100644
--- a/cypress/e2e/with_api/systems/functions.ts
+++ b/cypress/e2e/with_api/systems/functions.ts
@@ -13,7 +13,7 @@ export const modifySystem = (
     cy.findAllByLabelText('Row Actions').eq(values.index).click();
     cy.findByText('Edit').click();
   } else {
-    cy.findByRole('button', { name: 'add system' }).click();
+    cy.findByRole('button', { name: 'Add System' }).click();
   }
   cy.findByLabelText('Name *').clear();
   cy.findByLabelText('Name *').type(values.name);
diff --git a/cypress/e2e/with_mock_data/manufacturers.cy.ts b/cypress/e2e/with_mock_data/manufacturers.cy.ts
index 7250b2fa0..62a7319e0 100644
--- a/cypress/e2e/with_mock_data/manufacturers.cy.ts
+++ b/cypress/e2e/with_mock_data/manufacturers.cy.ts
@@ -348,7 +348,7 @@ describe('Manufacturer', () => {
     cy.findByText('Manufacturer A').click();
     cy.findByText('Telephone number:').should('exist');
 
-    cy.findByRole('button', { name: 'navigate to manufacturer home' }).click();
+    cy.findByRole('button', { name: 'navigate to manufacturers home' }).click();
 
     cy.findByText('Manufacturer A').should('exist');
     cy.findByText('Manufacturer B').should('exist');
@@ -382,7 +382,7 @@ describe('Manufacturer', () => {
       `This manufacturer doesn't exist. Please click the Home button to navigate to the manufacturer table`
     ).should('exist');
 
-    cy.findByRole('button', { name: 'navigate to manufacturer home' }).click();
+    cy.findByRole('button', { name: 'navigate to manufacturers home' }).click();
 
     cy.findByText('Manufacturer A').should('exist');
     cy.findByText('Manufacturer B').should('exist');
diff --git a/cypress/e2e/with_mock_data/systems.cy.ts b/cypress/e2e/with_mock_data/systems.cy.ts
index 99829e7f4..f8b2f27f9 100644
--- a/cypress/e2e/with_mock_data/systems.cy.ts
+++ b/cypress/e2e/with_mock_data/systems.cy.ts
@@ -259,7 +259,7 @@ describe('Systems', () => {
 
   describe('Add', () => {
     it('adds a root system with only required parameters', () => {
-      cy.findByRole('button', { name: 'add system' }).click();
+      cy.findByRole('button', { name: 'Add System' }).click();
       cy.findByLabelText('Name *').type('System name');
 
       cy.startSnoopingBrowserMockedRequest();
@@ -282,7 +282,7 @@ describe('Systems', () => {
     });
 
     it('adds a root system with all parameters', () => {
-      cy.findByRole('button', { name: 'add system' }).click();
+      cy.findByRole('button', { name: 'Add System' }).click();
 
       cy.findByLabelText('Name *').type('System name');
       cy.findByLabelText('Description').type('System description');
@@ -316,7 +316,7 @@ describe('Systems', () => {
     it('adds a subsystem', () => {
       cy.visit('/systems/65328f34a40ff5301575a4e3');
 
-      cy.findByRole('button', { name: 'add subsystem' }).click();
+      cy.findByRole('button', { name: 'Add Subsystem' }).click();
       cy.findByLabelText('Name *').type('System name');
 
       cy.startSnoopingBrowserMockedRequest();
@@ -342,19 +342,19 @@ describe('Systems', () => {
     it('displays error message when name is not given that disappears once closed', () => {
       cy.visit('/systems');
 
-      cy.findByRole('button', { name: 'add system' }).click();
+      cy.findByRole('button', { name: 'Add System' }).click();
       cy.findByRole('button', { name: 'Save' }).click();
       cy.findByText('Please enter a name.').should('be.visible');
       cy.findByRole('button', { name: 'Save' }).should('be.disabled');
       cy.findByRole('button', { name: 'Cancel' }).click();
-      cy.findByRole('button', { name: 'add system' }).click();
+      cy.findByRole('button', { name: 'Add System' }).click();
       cy.findByText('Please enter a name.').should('not.exist');
     });
 
     it('displays error message if the system has a duplicate name that disappears once closed', () => {
       cy.visit('/systems');
 
-      cy.findByRole('button', { name: 'add system' }).click();
+      cy.findByRole('button', { name: 'Add System' }).click();
       cy.findByLabelText('Name *').type('Error 409');
       cy.findByRole('button', { name: 'Save' }).click();
       cy.findByText(
@@ -362,7 +362,7 @@ describe('Systems', () => {
       ).should('be.visible');
       cy.findByRole('button', { name: 'Save' }).should('be.disabled');
       cy.findByRole('button', { name: 'Cancel' }).click();
-      cy.findByRole('button', { name: 'add system' }).click();
+      cy.findByRole('button', { name: 'Add System' }).click();
       cy.findByText(
         'A System with the same name already exists within the same parent System. Please enter a different name.'
       ).should('not.exist');
diff --git a/src/admin/admin.component.tsx b/src/admin/admin.component.tsx
index 959d80e4a..87bae5d64 100644
--- a/src/admin/admin.component.tsx
+++ b/src/admin/admin.component.tsx
@@ -69,7 +69,7 @@ function AdminPage() {
               onChangeNode={navigateToAdminFunction}
               breadcrumbsInfo={adminBreadCrumbs}
               onChangeNavigateHome={() => navigateToAdminFunction(null)}
-              navigateHomeAriaLabel={'navigate to admin page'}
+              homeLocation="Admin"
             />
           </Box>
         </div>
diff --git a/src/catalogue/catalogue.component.tsx b/src/catalogue/catalogue.component.tsx
index 7c29623f4..a53ff01af 100644
--- a/src/catalogue/catalogue.component.tsx
+++ b/src/catalogue/catalogue.component.tsx
@@ -10,6 +10,7 @@ import {
   IconButton,
   LinearProgress,
   Typography,
+  Tooltip,
 } from '@mui/material';
 import React from 'react';
 import { useLocation, useNavigate } from 'react-router-dom';
@@ -75,14 +76,18 @@ const AddCategoryButton = (props: AddCatalogueButtonProps) => {
 
   return (
     <>
-      <IconButton
-        sx={{ mx: 1, my: 2 }}
-        onClick={() => setAddCategoryDialogOpen(true)}
-        disabled={props.disabled}
-        aria-label="add catalogue category"
-      >
-        <AddIcon />
-      </IconButton>
+      <Tooltip title = "Add Category">
+        <span>
+          <IconButton
+            sx={{ mx: 1, my: 2 }}
+            onClick={() => setAddCategoryDialogOpen(true)}
+            disabled={props.disabled}
+            aria-label="add catalogue category"
+          >
+            <AddIcon />
+          </IconButton>
+        </span>
+      </Tooltip>  
       <CatalogueCategoryDialog
         open={addCategoryDialogOpen}
         onClose={() => setAddCategoryDialogOpen(false)}
@@ -306,7 +311,7 @@ function Catalogue() {
               onChangeNode={navigateToCatalogue}
               breadcrumbsInfo={catalogueBreadcrumbs}
               onChangeNavigateHome={() => navigateToCatalogue(null)}
-              navigateHomeAriaLabel={'navigate to catalogue home'}
+              homeLocation="Catalogue"
             />
             <NavigateNext
               fontSize="medium"
diff --git a/src/catalogue/category/__snapshots__/cataloguePropertiesForm.component.test.tsx.snap b/src/catalogue/category/__snapshots__/cataloguePropertiesForm.component.test.tsx.snap
index f653afea8..edd935472 100644
--- a/src/catalogue/category/__snapshots__/cataloguePropertiesForm.component.test.tsx.snap
+++ b/src/catalogue/category/__snapshots__/cataloguePropertiesForm.component.test.tsx.snap
@@ -355,27 +355,33 @@ exports[`Catalogue Properties Form > renders correctly 1`] = `
           <div
             class="MuiBox-root css-zdpt2t"
           >
-            <button
-              aria-label="Delete catalogue Item Field entry"
-              class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
-              tabindex="0"
-              type="button"
+            <span
+              aria-label="Delete Field"
+              class=""
+              data-mui-internal-clone-element="true"
             >
-              <svg
-                aria-hidden="true"
-                class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-                data-testid="DeleteIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
+              <button
+                aria-label="Delete catalogue Item Field entry"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
+                tabindex="0"
+                type="button"
               >
-                <path
-                  d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+                <svg
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                  data-testid="DeleteIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+                  />
+                </svg>
+                <span
+                  class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
                 />
-              </svg>
-              <span
-                class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-              />
-            </button>
+              </button>
+            </span>
           </div>
         </div>
       </div>
@@ -732,27 +738,33 @@ exports[`Catalogue Properties Form > renders correctly 1`] = `
           <div
             class="MuiBox-root css-zdpt2t"
           >
-            <button
-              aria-label="Delete catalogue Item Field entry"
-              class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
-              tabindex="0"
-              type="button"
+            <span
+              aria-label="Delete Field"
+              class=""
+              data-mui-internal-clone-element="true"
             >
-              <svg
-                aria-hidden="true"
-                class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-                data-testid="DeleteIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
+              <button
+                aria-label="Delete catalogue Item Field entry"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
+                tabindex="0"
+                type="button"
               >
-                <path
-                  d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+                <svg
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                  data-testid="DeleteIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+                  />
+                </svg>
+                <span
+                  class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
                 />
-              </svg>
-              <span
-                class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-              />
-            </button>
+              </button>
+            </span>
           </div>
         </div>
       </div>
@@ -1260,27 +1272,33 @@ exports[`Catalogue Properties Form > renders correctly 1`] = `
           <div
             class="MuiBox-root css-zdpt2t"
           >
-            <button
-              aria-label="Delete catalogue Item Field entry"
-              class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
-              tabindex="0"
-              type="button"
+            <span
+              aria-label="Delete Field"
+              class=""
+              data-mui-internal-clone-element="true"
             >
-              <svg
-                aria-hidden="true"
-                class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-                data-testid="DeleteIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
+              <button
+                aria-label="Delete catalogue Item Field entry"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
+                tabindex="0"
+                type="button"
               >
-                <path
-                  d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+                <svg
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                  data-testid="DeleteIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+                  />
+                </svg>
+                <span
+                  class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
                 />
-              </svg>
-              <span
-                class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-              />
-            </button>
+              </button>
+            </span>
           </div>
         </div>
       </div>
@@ -1788,27 +1806,33 @@ exports[`Catalogue Properties Form > renders correctly 1`] = `
           <div
             class="MuiBox-root css-zdpt2t"
           >
-            <button
-              aria-label="Delete catalogue Item Field entry"
-              class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
-              tabindex="0"
-              type="button"
+            <span
+              aria-label="Delete Field"
+              class=""
+              data-mui-internal-clone-element="true"
             >
-              <svg
-                aria-hidden="true"
-                class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-                data-testid="DeleteIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
+              <button
+                aria-label="Delete catalogue Item Field entry"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
+                tabindex="0"
+                type="button"
               >
-                <path
-                  d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+                <svg
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                  data-testid="DeleteIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+                  />
+                </svg>
+                <span
+                  class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
                 />
-              </svg>
-              <span
-                class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-              />
-            </button>
+              </button>
+            </span>
           </div>
         </div>
       </div>
@@ -2190,52 +2214,64 @@ exports[`Catalogue Properties Form > renders correctly 1`] = `
           <div
             class="MuiBox-root css-zdpt2t"
           >
-            <button
-              aria-label="Delete catalogue Item Field entry"
-              class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
-              tabindex="0"
-              type="button"
+            <span
+              aria-label="Delete Field"
+              class=""
+              data-mui-internal-clone-element="true"
             >
-              <svg
-                aria-hidden="true"
-                class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-                data-testid="DeleteIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
+              <button
+                aria-label="Delete catalogue Item Field entry"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
+                tabindex="0"
+                type="button"
               >
-                <path
-                  d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+                <svg
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                  data-testid="DeleteIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+                  />
+                </svg>
+                <span
+                  class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
                 />
-              </svg>
-              <span
-                class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-              />
-            </button>
+              </button>
+            </span>
           </div>
         </div>
       </div>
     </div>
-    <button
-      aria-label="Add catalogue category field entry"
-      class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-1dlhym7-MuiButtonBase-root-MuiIconButton-root"
-      tabindex="0"
-      type="button"
+    <span
+      aria-label="Add Field"
+      class=""
+      data-mui-internal-clone-element="true"
     >
-      <svg
-        aria-hidden="true"
-        class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-        data-testid="AddIcon"
-        focusable="false"
-        viewBox="0 0 24 24"
+      <button
+        aria-label="Add catalogue category field entry"
+        class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-1dlhym7-MuiButtonBase-root-MuiIconButton-root"
+        tabindex="0"
+        type="button"
       >
-        <path
-          d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
+        <svg
+          aria-hidden="true"
+          class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+          data-testid="AddIcon"
+          focusable="false"
+          viewBox="0 0 24 24"
+        >
+          <path
+            d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
+          />
+        </svg>
+        <span
+          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
         />
-      </svg>
-      <span
-        class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-      />
-    </button>
+      </button>
+    </span>
   </div>
 </DocumentFragment>
 `;
@@ -2264,7 +2300,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
               <input
                 checked=""
                 class="PrivateSwitchBase-input css-1m9pwf3"
-                name=":r32:"
+                name=":r38:"
                 type="radio"
                 value="selected"
               />
@@ -2313,8 +2349,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
           <label
             class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
             data-shrink="true"
-            for=":r33:"
-            id=":r33:-label"
+            for=":r39:"
+            id=":r39:-label"
           >
             Property Name
             <span
@@ -2331,7 +2367,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
               aria-invalid="false"
               class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input"
               disabled=""
-              id=":r33:"
+              id=":r39:"
               required=""
               type="text"
               value="Field 1"
@@ -2359,8 +2395,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r34:"
-              id=":r34:-label"
+              for=":r3a:"
+              id=":r3a:-label"
             >
               Select Type
               <span
@@ -2381,7 +2417,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r34:"
+                id=":r3a:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -2436,8 +2472,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r36:"
-              id=":r36:-label"
+              for=":r3c:"
+              id=":r3c:-label"
             >
               Select Allowed values
               <span
@@ -2458,7 +2494,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r36:"
+                id=":r3c:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -2513,8 +2549,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined css-14s5rfu-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="false"
-              for=":r38:"
-              id=":r38:-label"
+              for=":r3e:"
+              id=":r3e:-label"
             >
               Select Unit
             </label>
@@ -2529,7 +2565,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r38:"
+                id=":r3e:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -2583,8 +2619,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r3a:"
-              id=":r3a:-label"
+              for=":r3g:"
+              id=":r3g:-label"
             >
               Select is mandatory?
             </label>
@@ -2599,7 +2635,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r3a:"
+                id=":r3g:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -2674,7 +2710,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
               <input
                 checked=""
                 class="PrivateSwitchBase-input css-1m9pwf3"
-                name=":r3c:"
+                name=":r3i:"
                 type="radio"
                 value="selected"
               />
@@ -2723,8 +2759,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
           <label
             class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
             data-shrink="true"
-            for=":r3d:"
-            id=":r3d:-label"
+            for=":r3j:"
+            id=":r3j:-label"
           >
             Property Name
             <span
@@ -2741,7 +2777,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
               aria-invalid="false"
               class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input"
               disabled=""
-              id=":r3d:"
+              id=":r3j:"
               required=""
               type="text"
               value="Field 2"
@@ -2769,8 +2805,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r3e:"
-              id=":r3e:-label"
+              for=":r3k:"
+              id=":r3k:-label"
             >
               Select Type
               <span
@@ -2791,7 +2827,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r3e:"
+                id=":r3k:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -2846,8 +2882,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r3g:"
-              id=":r3g:-label"
+              for=":r3m:"
+              id=":r3m:-label"
             >
               Select Allowed values
               <span
@@ -2868,7 +2904,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r3g:"
+                id=":r3m:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -2923,8 +2959,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined css-14s5rfu-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="false"
-              for=":r3i:"
-              id=":r3i:-label"
+              for=":r3o:"
+              id=":r3o:-label"
             >
               Select Unit
             </label>
@@ -2939,7 +2975,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r3i:"
+                id=":r3o:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -2993,8 +3029,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r3k:"
-              id=":r3k:-label"
+              for=":r3q:"
+              id=":r3q:-label"
             >
               Select is mandatory?
             </label>
@@ -3009,7 +3045,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r3k:"
+                id=":r3q:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -3084,7 +3120,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
               <input
                 checked=""
                 class="PrivateSwitchBase-input css-1m9pwf3"
-                name=":r3m:"
+                name=":r3s:"
                 type="radio"
                 value="selected"
               />
@@ -3133,8 +3169,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
           <label
             class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
             data-shrink="true"
-            for=":r3n:"
-            id=":r3n:-label"
+            for=":r3t:"
+            id=":r3t:-label"
           >
             Property Name
             <span
@@ -3151,7 +3187,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
               aria-invalid="false"
               class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input"
               disabled=""
-              id=":r3n:"
+              id=":r3t:"
               required=""
               type="text"
               value="Field 3"
@@ -3179,8 +3215,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r3o:"
-              id=":r3o:-label"
+              for=":r3u:"
+              id=":r3u:-label"
             >
               Select Type
               <span
@@ -3201,7 +3237,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r3o:"
+                id=":r3u:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -3256,8 +3292,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r3q:"
-              id=":r3q:-label"
+              for=":r40:"
+              id=":r40:-label"
             >
               Select Allowed values
               <span
@@ -3278,7 +3314,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r3q:"
+                id=":r40:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -3421,8 +3457,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined css-14s5rfu-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="false"
-              for=":r3u:"
-              id=":r3u:-label"
+              for=":r44:"
+              id=":r44:-label"
             >
               Select Unit
             </label>
@@ -3437,7 +3473,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r3u:"
+                id=":r44:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -3491,8 +3527,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r40:"
-              id=":r40:-label"
+              for=":r46:"
+              id=":r46:-label"
             >
               Select is mandatory?
             </label>
@@ -3507,7 +3543,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r40:"
+                id=":r46:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -3582,7 +3618,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
               <input
                 checked=""
                 class="PrivateSwitchBase-input css-1m9pwf3"
-                name=":r42:"
+                name=":r48:"
                 type="radio"
                 value="selected"
               />
@@ -3631,8 +3667,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
           <label
             class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
             data-shrink="true"
-            for=":r43:"
-            id=":r43:-label"
+            for=":r49:"
+            id=":r49:-label"
           >
             Property Name
             <span
@@ -3649,7 +3685,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
               aria-invalid="false"
               class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input"
               disabled=""
-              id=":r43:"
+              id=":r49:"
               required=""
               type="text"
               value="Field 4"
@@ -3677,8 +3713,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r44:"
-              id=":r44:-label"
+              for=":r4a:"
+              id=":r4a:-label"
             >
               Select Type
               <span
@@ -3699,7 +3735,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r44:"
+                id=":r4a:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -3754,8 +3790,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r46:"
-              id=":r46:-label"
+              for=":r4c:"
+              id=":r4c:-label"
             >
               Select Allowed values
               <span
@@ -3776,7 +3812,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r46:"
+                id=":r4c:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -3919,8 +3955,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined css-14s5rfu-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="false"
-              for=":r4a:"
-              id=":r4a:-label"
+              for=":r4g:"
+              id=":r4g:-label"
             >
               Select Unit
             </label>
@@ -3935,7 +3971,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r4a:"
+                id=":r4g:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -3989,8 +4025,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r4c:"
-              id=":r4c:-label"
+              for=":r4i:"
+              id=":r4i:-label"
             >
               Select is mandatory?
             </label>
@@ -4005,7 +4041,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r4c:"
+                id=":r4i:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -4080,7 +4116,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
               <input
                 checked=""
                 class="PrivateSwitchBase-input css-1m9pwf3"
-                name=":r4e:"
+                name=":r4k:"
                 type="radio"
                 value="selected"
               />
@@ -4129,8 +4165,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
           <label
             class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
             data-shrink="true"
-            for=":r4f:"
-            id=":r4f:-label"
+            for=":r4l:"
+            id=":r4l:-label"
           >
             Property Name
             <span
@@ -4147,7 +4183,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
               aria-invalid="false"
               class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input"
               disabled=""
-              id=":r4f:"
+              id=":r4l:"
               required=""
               type="text"
               value="Field 5"
@@ -4175,8 +4211,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r4g:"
-              id=":r4g:-label"
+              for=":r4m:"
+              id=":r4m:-label"
             >
               Select Type
               <span
@@ -4197,7 +4233,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r4g:"
+                id=":r4m:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -4252,8 +4288,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r4i:"
-              id=":r4i:-label"
+              for=":r4o:"
+              id=":r4o:-label"
             >
               Select Allowed values
               <span
@@ -4274,7 +4310,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r4i:"
+                id=":r4o:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -4332,8 +4368,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined css-14s5rfu-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="false"
-              for=":r4k:"
-              id=":r4k:-label"
+              for=":r4q:"
+              id=":r4q:-label"
             >
               Select Unit
             </label>
@@ -4348,7 +4384,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r4k:"
+                id=":r4q:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -4402,8 +4438,8 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r4m:"
-              id=":r4m:-label"
+              for=":r4s:"
+              id=":r4s:-label"
             >
               Select is mandatory?
             </label>
@@ -4418,7 +4454,7 @@ exports[`Catalogue Properties Form > renders correctly for migration dialog 1`]
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r4m:"
+                id=":r4s:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -4491,8 +4527,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
           <label
             class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
             data-shrink="true"
-            for=":r1h:"
-            id=":r1h:-label"
+            for=":r1n:"
+            id=":r1n:-label"
           >
             Property Name
             <span
@@ -4509,7 +4545,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
               aria-invalid="false"
               class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input"
               disabled=""
-              id=":r1h:"
+              id=":r1n:"
               required=""
               type="text"
               value="Field 1"
@@ -4537,8 +4573,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r1i:"
-              id=":r1i:-label"
+              for=":r1o:"
+              id=":r1o:-label"
             >
               Select Type
               <span
@@ -4559,7 +4595,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r1i:"
+                id=":r1o:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -4614,8 +4650,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r1k:"
-              id=":r1k:-label"
+              for=":r1q:"
+              id=":r1q:-label"
             >
               Select Allowed values
               <span
@@ -4636,7 +4672,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r1k:"
+                id=":r1q:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -4691,8 +4727,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined css-14s5rfu-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="false"
-              for=":r1m:"
-              id=":r1m:-label"
+              for=":r1s:"
+              id=":r1s:-label"
             >
               Select Unit
             </label>
@@ -4707,7 +4743,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r1m:"
+                id=":r1s:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -4761,8 +4797,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r1o:"
-              id=":r1o:-label"
+              for=":r1u:"
+              id=":r1u:-label"
             >
               Select is mandatory?
             </label>
@@ -4777,7 +4813,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r1o:"
+                id=":r1u:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -4843,8 +4879,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
           <label
             class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
             data-shrink="true"
-            for=":r1q:"
-            id=":r1q:-label"
+            for=":r20:"
+            id=":r20:-label"
           >
             Property Name
             <span
@@ -4861,7 +4897,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
               aria-invalid="false"
               class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input"
               disabled=""
-              id=":r1q:"
+              id=":r20:"
               required=""
               type="text"
               value="Field 2"
@@ -4889,8 +4925,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r1r:"
-              id=":r1r:-label"
+              for=":r21:"
+              id=":r21:-label"
             >
               Select Type
               <span
@@ -4911,7 +4947,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r1r:"
+                id=":r21:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -4966,8 +5002,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r1t:"
-              id=":r1t:-label"
+              for=":r23:"
+              id=":r23:-label"
             >
               Select Allowed values
               <span
@@ -4988,7 +5024,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r1t:"
+                id=":r23:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -5043,8 +5079,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined css-14s5rfu-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="false"
-              for=":r1v:"
-              id=":r1v:-label"
+              for=":r25:"
+              id=":r25:-label"
             >
               Select Unit
             </label>
@@ -5059,7 +5095,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r1v:"
+                id=":r25:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -5113,8 +5149,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r21:"
-              id=":r21:-label"
+              for=":r27:"
+              id=":r27:-label"
             >
               Select is mandatory?
             </label>
@@ -5129,7 +5165,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r21:"
+                id=":r27:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -5195,8 +5231,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
           <label
             class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
             data-shrink="true"
-            for=":r23:"
-            id=":r23:-label"
+            for=":r29:"
+            id=":r29:-label"
           >
             Property Name
             <span
@@ -5213,7 +5249,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
               aria-invalid="false"
               class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input"
               disabled=""
-              id=":r23:"
+              id=":r29:"
               required=""
               type="text"
               value="Field 3"
@@ -5241,8 +5277,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r24:"
-              id=":r24:-label"
+              for=":r2a:"
+              id=":r2a:-label"
             >
               Select Type
               <span
@@ -5263,7 +5299,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r24:"
+                id=":r2a:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -5318,8 +5354,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r26:"
-              id=":r26:-label"
+              for=":r2c:"
+              id=":r2c:-label"
             >
               Select Allowed values
               <span
@@ -5340,7 +5376,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r26:"
+                id=":r2c:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -5483,8 +5519,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined css-14s5rfu-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="false"
-              for=":r2a:"
-              id=":r2a:-label"
+              for=":r2g:"
+              id=":r2g:-label"
             >
               Select Unit
             </label>
@@ -5499,7 +5535,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r2a:"
+                id=":r2g:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -5553,8 +5589,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r2c:"
-              id=":r2c:-label"
+              for=":r2i:"
+              id=":r2i:-label"
             >
               Select is mandatory?
             </label>
@@ -5569,7 +5605,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r2c:"
+                id=":r2i:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -5635,8 +5671,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
           <label
             class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
             data-shrink="true"
-            for=":r2e:"
-            id=":r2e:-label"
+            for=":r2k:"
+            id=":r2k:-label"
           >
             Property Name
             <span
@@ -5653,7 +5689,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
               aria-invalid="false"
               class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input"
               disabled=""
-              id=":r2e:"
+              id=":r2k:"
               required=""
               type="text"
               value="Field 4"
@@ -5681,8 +5717,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r2f:"
-              id=":r2f:-label"
+              for=":r2l:"
+              id=":r2l:-label"
             >
               Select Type
               <span
@@ -5703,7 +5739,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r2f:"
+                id=":r2l:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -5758,8 +5794,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r2h:"
-              id=":r2h:-label"
+              for=":r2n:"
+              id=":r2n:-label"
             >
               Select Allowed values
               <span
@@ -5780,7 +5816,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r2h:"
+                id=":r2n:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -5923,8 +5959,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined css-14s5rfu-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="false"
-              for=":r2l:"
-              id=":r2l:-label"
+              for=":r2r:"
+              id=":r2r:-label"
             >
               Select Unit
             </label>
@@ -5939,7 +5975,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r2l:"
+                id=":r2r:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -5993,8 +6029,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r2n:"
-              id=":r2n:-label"
+              for=":r2t:"
+              id=":r2t:-label"
             >
               Select is mandatory?
             </label>
@@ -6009,7 +6045,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r2n:"
+                id=":r2t:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -6075,8 +6111,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
           <label
             class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
             data-shrink="true"
-            for=":r2p:"
-            id=":r2p:-label"
+            for=":r2v:"
+            id=":r2v:-label"
           >
             Property Name
             <span
@@ -6093,7 +6129,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
               aria-invalid="false"
               class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input"
               disabled=""
-              id=":r2p:"
+              id=":r2v:"
               required=""
               type="text"
               value="Field 5"
@@ -6121,8 +6157,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r2q:"
-              id=":r2q:-label"
+              for=":r30:"
+              id=":r30:-label"
             >
               Select Type
               <span
@@ -6143,7 +6179,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r2q:"
+                id=":r30:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -6198,8 +6234,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r2s:"
-              id=":r2s:-label"
+              for=":r32:"
+              id=":r32:-label"
             >
               Select Allowed values
               <span
@@ -6220,7 +6256,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r2s:"
+                id=":r32:"
                 required=""
                 role="combobox"
                 spellcheck="false"
@@ -6278,8 +6314,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeMedium MuiInputLabel-outlined css-14s5rfu-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="false"
-              for=":r2u:"
-              id=":r2u:-label"
+              for=":r34:"
+              id=":r34:-label"
             >
               Select Unit
             </label>
@@ -6294,7 +6330,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r2u:"
+                id=":r34:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
@@ -6348,8 +6384,8 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
             <label
               class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-disabled MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeMedium MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
               data-shrink="true"
-              for=":r30:"
-              id=":r30:-label"
+              for=":r36:"
+              id=":r36:-label"
             >
               Select is mandatory?
             </label>
@@ -6364,7 +6400,7 @@ exports[`Catalogue Properties Form > renders correctly when disabled 1`] = `
                 autocomplete="off"
                 class="MuiInputBase-input MuiOutlinedInput-input Mui-disabled MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-nxo287-MuiInputBase-input-MuiOutlinedInput-input"
                 disabled=""
-                id=":r30:"
+                id=":r36:"
                 role="combobox"
                 spellcheck="false"
                 type="text"
diff --git a/src/catalogue/category/__snapshots__/cataloguePropertyForm.component.test.tsx.snap b/src/catalogue/category/__snapshots__/cataloguePropertyForm.component.test.tsx.snap
index f2d6c22b2..21937f950 100644
--- a/src/catalogue/category/__snapshots__/cataloguePropertyForm.component.test.tsx.snap
+++ b/src/catalogue/category/__snapshots__/cataloguePropertyForm.component.test.tsx.snap
@@ -905,27 +905,33 @@ exports[`Catalogue Property Form > renders correctly for add migration 1`] = `
       <div
         class="MuiBox-root css-0"
       >
-        <button
-          aria-label="Delete catalogue Item Field entry"
-          class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
-          tabindex="0"
-          type="button"
+        <span
+          aria-label="Delete Field"
+          class=""
+          data-mui-internal-clone-element="true"
         >
-          <svg
-            aria-hidden="true"
-            class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-            data-testid="DeleteIcon"
-            focusable="false"
-            viewBox="0 0 24 24"
+          <button
+            aria-label="Delete catalogue Item Field entry"
+            class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
+            tabindex="0"
+            type="button"
           >
-            <path
-              d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+            <svg
+              aria-hidden="true"
+              class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+              data-testid="DeleteIcon"
+              focusable="false"
+              viewBox="0 0 24 24"
+            >
+              <path
+                d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+              />
+            </svg>
+            <span
+              class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
             />
-          </svg>
-          <span
-            class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-          />
-        </button>
+          </button>
+        </span>
       </div>
     </div>
   </div>
@@ -1367,27 +1373,33 @@ exports[`Catalogue Property Form > renders correctly for edit migration 1`] = `
       <div
         class="MuiBox-root css-0"
       >
-        <button
-          aria-label="Delete catalogue Item Field entry"
-          class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
-          tabindex="0"
-          type="button"
+        <span
+          aria-label="Delete Field"
+          class=""
+          data-mui-internal-clone-element="true"
         >
-          <svg
-            aria-hidden="true"
-            class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-            data-testid="DeleteIcon"
-            focusable="false"
-            viewBox="0 0 24 24"
+          <button
+            aria-label="Delete catalogue Item Field entry"
+            class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
+            tabindex="0"
+            type="button"
           >
-            <path
-              d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+            <svg
+              aria-hidden="true"
+              class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+              data-testid="DeleteIcon"
+              focusable="false"
+              viewBox="0 0 24 24"
+            >
+              <path
+                d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+              />
+            </svg>
+            <span
+              class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
             />
-          </svg>
-          <span
-            class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-          />
-        </button>
+          </button>
+        </span>
       </div>
     </div>
   </div>
@@ -1855,27 +1867,33 @@ exports[`Catalogue Property Form > renders correctly for list view 1`] = `
       <div
         class="MuiBox-root css-0"
       >
-        <button
-          aria-label="Delete catalogue Item Field entry"
-          class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
-          tabindex="0"
-          type="button"
+        <span
+          aria-label="Delete Field"
+          class=""
+          data-mui-internal-clone-element="true"
         >
-          <svg
-            aria-hidden="true"
-            class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-            data-testid="DeleteIcon"
-            focusable="false"
-            viewBox="0 0 24 24"
+          <button
+            aria-label="Delete catalogue Item Field entry"
+            class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
+            tabindex="0"
+            type="button"
           >
-            <path
-              d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+            <svg
+              aria-hidden="true"
+              class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+              data-testid="DeleteIcon"
+              focusable="false"
+              viewBox="0 0 24 24"
+            >
+              <path
+                d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"
+              />
+            </svg>
+            <span
+              class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
             />
-          </svg>
-          <span
-            class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-          />
-        </button>
+          </button>
+        </span>
       </div>
     </div>
   </div>
diff --git a/src/catalogue/category/catalogueCard.component.tsx b/src/catalogue/category/catalogueCard.component.tsx
index 30092c58b..f664f1b67 100644
--- a/src/catalogue/category/catalogueCard.component.tsx
+++ b/src/catalogue/category/catalogueCard.component.tsx
@@ -13,6 +13,7 @@ import {
   Menu,
   MenuItem,
   Typography,
+  Tooltip,
 } from '@mui/material';
 import React from 'react';
 import { Link } from 'react-router-dom';
@@ -73,17 +74,21 @@ function CatalogueCard(props: CatalogueCardProps) {
         }}
       >
         <CardActions>
-          <Checkbox
-            onClick={(event) => {
-              event.preventDefault();
-              handleCheckboxClick();
-            }}
-            checked={isSelected}
-            inputProps={{
-              'aria-label': 'controlled',
-            }}
-            aria-label={`${catalogueCategory.name} checkbox`}
-          />
+          <Tooltip title = "Toggle Select">
+            <span>
+              <Checkbox
+                onClick={(event) => {
+                  event.preventDefault();
+                  handleCheckboxClick();
+                }}
+                checked={isSelected}
+                inputProps={{
+                  'aria-label': 'controlled',
+                }}
+                aria-label={`${catalogueCategory.name} checkbox`}
+              />
+            </span>
+          </Tooltip>
         </CardActions>
         <CardContent
           sx={{
@@ -97,16 +102,20 @@ function CatalogueCard(props: CatalogueCardProps) {
           <OverflowTip>{catalogueCategory.name}</OverflowTip>
         </CardContent>
         <CardActions>
-          <IconButton
-            onClick={(event) => {
-              event.preventDefault();
-              setAnchorEl(event.currentTarget);
-              setMenuOpen(true);
-            }}
-            aria-label={`actions ${catalogueCategory.name} catalogue category button`}
-          >
-            <MoreHorizIcon />
-          </IconButton>
+          <Tooltip title = "Actions">
+            <span>
+              <IconButton
+                onClick={(event) => {
+                  event.preventDefault();
+                  setAnchorEl(event.currentTarget);
+                  setMenuOpen(true);
+                }}
+                aria-label={`actions ${catalogueCategory.name} catalogue category button`}
+              >
+                <MoreHorizIcon />
+              </IconButton>
+            </span>  
+          </Tooltip>
           <Menu
             anchorEl={anchorEl}
             open={menuOpen}
diff --git a/src/catalogue/category/catalogueCategoryDirectoryDialog.component.tsx b/src/catalogue/category/catalogueCategoryDirectoryDialog.component.tsx
index c946300bd..f49ba2ac2 100644
--- a/src/catalogue/category/catalogueCategoryDirectoryDialog.component.tsx
+++ b/src/catalogue/category/catalogueCategoryDirectoryDialog.component.tsx
@@ -176,7 +176,7 @@ const CatalogueCategoryDirectoryDialog = (
               breadcrumbsInfo={catalogueBreadcrumbs}
               onChangeNode={setParentCategoryId}
               onChangeNavigateHome={() => setParentCategoryId(null)}
-              navigateHomeAriaLabel="navigate to catalogue home"
+              homeLocation="Catalogue"
             />
           </Grid>
         </Grid>
diff --git a/src/catalogue/category/cataloguePropertiesForm.component.tsx b/src/catalogue/category/cataloguePropertiesForm.component.tsx
index 30bdda209..7848fdde2 100644
--- a/src/catalogue/category/cataloguePropertiesForm.component.tsx
+++ b/src/catalogue/category/cataloguePropertiesForm.component.tsx
@@ -6,6 +6,7 @@ import {
   IconButton,
   Radio,
   RadioGroup,
+  Tooltip,
 } from '@mui/material';
 import React from 'react';
 
@@ -518,13 +519,17 @@ function CataloguePropertiesForm(props: CataloguePropertiesFormProps) {
         );
       })}
       {!isDisabled && (
-        <IconButton
-          sx={{ margin: '8px' }}
-          onClick={handleAddField}
-          aria-label={'Add catalogue category field entry'}
-        >
-          <AddIcon />
-        </IconButton>
+        <Tooltip title = "Add Field">
+          <span>
+            <IconButton
+              sx={{ margin: '8px' }}
+              onClick={handleAddField}
+              aria-label={'Add catalogue category field entry'}
+            >
+              <AddIcon />
+            </IconButton>
+          </span>
+        </Tooltip>
       )}
     </div>
   );
diff --git a/src/catalogue/category/cataloguePropertyForm.component.tsx b/src/catalogue/category/cataloguePropertyForm.component.tsx
index b525ca1a6..b84ff8346 100644
--- a/src/catalogue/category/cataloguePropertyForm.component.tsx
+++ b/src/catalogue/category/cataloguePropertyForm.component.tsx
@@ -7,6 +7,7 @@ import {
   IconButton,
   Stack,
   TextField,
+  Tooltip,
 } from '@mui/material';
 import { v4 as uuidv4 } from 'uuid';
 import { Unit } from '../../api/api.types';
@@ -405,12 +406,16 @@ function CataloguePropertyForm(props: CataloguePropertyFormProps) {
           }}
         >
           {type !== 'disabled' && isList && (
-            <IconButton
-              aria-label={'Delete catalogue Item Field entry'}
-              onClick={() => handleDeleteField && handleDeleteField()}
-            >
-              <DeleteIcon />
-            </IconButton>
+            <Tooltip title = "Delete Field">
+              <span>
+                <IconButton
+                  aria-label={'Delete catalogue Item Field entry'}
+                  onClick={() => handleDeleteField && handleDeleteField()}
+                >
+                  <DeleteIcon />
+                </IconButton>
+              </span>
+            </Tooltip>
           )}
         </Box>
       </Box>
diff --git a/src/catalogue/items/__snapshots__/catalogueItemsDialog.component.test.tsx.snap b/src/catalogue/items/__snapshots__/catalogueItemsDialog.component.test.tsx.snap
index 3e0bf73cf..1e432fd56 100644
--- a/src/catalogue/items/__snapshots__/catalogueItemsDialog.component.test.tsx.snap
+++ b/src/catalogue/items/__snapshots__/catalogueItemsDialog.component.test.tsx.snap
@@ -620,27 +620,33 @@ exports[`Catalogue Items Dialog > renders details step correctly 1`] = `
                 <div
                   class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1 css-u78q51-MuiGrid-root"
                 >
-                  <button
-                    aria-label="add manufacturer"
-                    class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-rfqbm8-MuiButtonBase-root-MuiIconButton-root"
-                    tabindex="0"
-                    type="button"
+                  <span
+                    aria-label="Add Manufacturer"
+                    class=""
+                    data-mui-internal-clone-element="true"
                   >
-                    <svg
-                      aria-hidden="true"
-                      class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-                      data-testid="AddIcon"
-                      focusable="false"
-                      viewBox="0 0 24 24"
+                    <button
+                      aria-label="add manufacturer"
+                      class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-rfqbm8-MuiButtonBase-root-MuiIconButton-root"
+                      tabindex="0"
+                      type="button"
                     >
-                      <path
-                        d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
+                      <svg
+                        aria-hidden="true"
+                        class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                        data-testid="AddIcon"
+                        focusable="false"
+                        viewBox="0 0 24 24"
+                      >
+                        <path
+                          d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
+                        />
+                      </svg>
+                      <span
+                        class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
                       />
-                    </svg>
-                    <span
-                      class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-                    />
-                  </button>
+                    </button>
+                  </span>
                 </div>
               </div>
               <div
@@ -763,13 +769,13 @@ exports[`Catalogue Items Dialog > renders properties step correctly 1`] = `
       tabindex="-1"
     >
       <div
-        aria-labelledby=":re:"
+        aria-labelledby=":rf:"
         class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation24 MuiDialog-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthLg MuiDialog-paperFullWidth css-1t8b64z-MuiPaper-root-MuiDialog-paper"
         role="dialog"
       >
         <h2
           class="MuiTypography-root MuiTypography-h6 MuiDialogTitle-root css-bdhsul-MuiTypography-root-MuiDialogTitle-root"
-          id=":re:"
+          id=":rf:"
         >
           Add Catalogue Item
         </h2>
diff --git a/src/catalogue/items/__snapshots__/catalogueItemsTable.component.test.tsx.snap b/src/catalogue/items/__snapshots__/catalogueItemsTable.component.test.tsx.snap
index 7eeaee8da..c43b2e35f 100644
--- a/src/catalogue/items/__snapshots__/catalogueItemsTable.component.test.tsx.snap
+++ b/src/catalogue/items/__snapshots__/catalogueItemsTable.component.test.tsx.snap
@@ -306,7 +306,7 @@ exports[`Catalogue Items Table > renders the dense table correctly 1`] = `
                             aria-label="Filter by Name"
                             autocomplete="new-password"
                             class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                            id=":r2p2:"
+                            id=":r2p9:"
                             placeholder="Filter by Name"
                             title="Filter by Name"
                             type="text"
@@ -456,7 +456,7 @@ exports[`Catalogue Items Table > renders the dense table correctly 1`] = `
                               aria-label="Min"
                               autocomplete="new-password"
                               class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                              id=":r2p7:"
+                              id=":r2pe:"
                               inputmode="text"
                               placeholder="Min"
                               title="Min"
@@ -501,7 +501,7 @@ exports[`Catalogue Items Table > renders the dense table correctly 1`] = `
                               aria-label="Max"
                               autocomplete="new-password"
                               class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                              id=":r2p9:"
+                              id=":r2pg:"
                               inputmode="text"
                               placeholder="Max"
                               title="Max"
@@ -1100,7 +1100,7 @@ exports[`Catalogue Items Table > renders the dense table correctly 1`] = `
                   class="MuiInputBase-root MuiInput-root MuiInputBase-colorPrimary  css-1mmm5cp-MuiInputBase-root-MuiInput-root-MuiSelect-root"
                 >
                   <div
-                    aria-controls=":r2pb:"
+                    aria-controls=":r2pi:"
                     aria-expanded="false"
                     aria-haspopup="listbox"
                     aria-label="Rows per page"
diff --git a/src/catalogue/items/catalogueItemDirectoryDialog.component.tsx b/src/catalogue/items/catalogueItemDirectoryDialog.component.tsx
index 45191d7d2..7fabab193 100644
--- a/src/catalogue/items/catalogueItemDirectoryDialog.component.tsx
+++ b/src/catalogue/items/catalogueItemDirectoryDialog.component.tsx
@@ -189,7 +189,7 @@ const CatalogueItemDirectoryDialog = (
               breadcrumbsInfo={catalogueBreadcrumbs}
               onChangeNode={setParentCategoryId}
               onChangeNavigateHome={() => setParentCategoryId(null)}
-              navigateHomeAriaLabel="navigate to catalogue home"
+              homeLocation="Catalogue"
             />
           </Grid>
         </Grid>
diff --git a/src/catalogue/items/catalogueItemsDialog.component.tsx b/src/catalogue/items/catalogueItemsDialog.component.tsx
index a332e67e0..7ca8a9b3c 100644
--- a/src/catalogue/items/catalogueItemsDialog.component.tsx
+++ b/src/catalogue/items/catalogueItemsDialog.component.tsx
@@ -816,13 +816,17 @@ function CatalogueItemsDialog(props: CatalogueItemsDialogProps) {
                 />
               </Grid>
               <Grid item xs={1}>
-                <IconButton
-                  sx={{ mx: '4px', my: '2px' }}
-                  onClick={() => setAddManufacturerDialogOpen(true)}
-                  aria-label="add manufacturer"
-                >
-                  <AddIcon />
-                </IconButton>
+                <Tooltip title = "Add Manufacturer">
+                  <span>
+                    <IconButton
+                      sx={{ mx: '4px', my: '2px' }}
+                      onClick={() => setAddManufacturerDialogOpen(true)}
+                      aria-label="add manufacturer"
+                    >
+                      <AddIcon />
+                    </IconButton>
+                  </span>
+                </Tooltip>
               </Grid>
             </Grid>
             <ManufacturerDialog
diff --git a/src/catalogue/items/catalogueItemsLandingPage.component.tsx b/src/catalogue/items/catalogueItemsLandingPage.component.tsx
index c9a5062aa..635b28417 100644
--- a/src/catalogue/items/catalogueItemsLandingPage.component.tsx
+++ b/src/catalogue/items/catalogueItemsLandingPage.component.tsx
@@ -101,7 +101,7 @@ function CatalogueItemsLandingPage() {
             onChangeNode={navigateToCatalogue}
             breadcrumbsInfo={catalogueLandingBreadcrumbs}
             onChangeNavigateHome={() => navigateToCatalogue(null)}
-            navigateHomeAriaLabel={'navigate to catalogue home'}
+            homeLocation="Catalogue"
           />
         </Grid>
 
diff --git a/src/catalogue/items/obsoleteCatalogueItemDialog.component.test.tsx b/src/catalogue/items/obsoleteCatalogueItemDialog.component.test.tsx
index 455f5db5d..94fbfdff6 100644
--- a/src/catalogue/items/obsoleteCatalogueItemDialog.component.test.tsx
+++ b/src/catalogue/items/obsoleteCatalogueItemDialog.component.test.tsx
@@ -91,7 +91,7 @@ describe('Obsolete Catalogue Item Dialog', () => {
             // When there is more than one value start from root
             await user.click(
               screen.getByRole('button', {
-                name: 'Navigate back to Catalogue home',
+                name: 'navigate to catalogue home',
               })
             );
 
@@ -550,7 +550,7 @@ describe('Obsolete Catalogue Item Dialog', () => {
     // Navigate to root directory
     await user.click(
       screen.getByRole('button', {
-        name: 'Navigate back to Catalogue home',
+        name: 'navigate to catalogue home',
       })
     );
 
diff --git a/src/catalogue/items/obsoleteCatalogueItemDialog.component.tsx b/src/catalogue/items/obsoleteCatalogueItemDialog.component.tsx
index 49d69b23b..76bb601c5 100644
--- a/src/catalogue/items/obsoleteCatalogueItemDialog.component.tsx
+++ b/src/catalogue/items/obsoleteCatalogueItemDialog.component.tsx
@@ -255,7 +255,7 @@ const ObsoleteCatalogueItemDialog = (
               onChangeNode={onChangeNode}
               breadcrumbsInfo={catalogueBreadcrumbs}
               onChangeNavigateHome={() => setCatalogueCurrDirId(null)}
-              navigateHomeAriaLabel={'Navigate back to Catalogue home'}
+              homeLocation="Catalogue"
             />
             {catalogueCategoryData?.is_leaf ? (
               <CatalogueItemsTable
diff --git a/src/items/itemDialog.component.tsx b/src/items/itemDialog.component.tsx
index 33893ebe6..2660cae2b 100644
--- a/src/items/itemDialog.component.tsx
+++ b/src/items/itemDialog.component.tsx
@@ -1064,7 +1064,7 @@ function ItemDialog(props: ItemDialogProps) {
               onChangeNavigateHome={() => {
                 setParentSystemId(null);
               }}
-              navigateHomeAriaLabel={'navigate to systems home'}
+              homeLocation="Systems"
             />
             <SystemsTableView
               systemsData={systemsData}
diff --git a/src/items/items.component.tsx b/src/items/items.component.tsx
index d29546265..52ecd8685 100644
--- a/src/items/items.component.tsx
+++ b/src/items/items.component.tsx
@@ -62,7 +62,7 @@ export function Items() {
           onChangeNode={navigateToCatalogue}
           breadcrumbsInfo={itemsBreadcrumbs}
           onChangeNavigateHome={() => navigateToCatalogue(null)}
-          navigateHomeAriaLabel={'navigate to catalogue home'}
+          homeLocation="Catalogue"
         />
       </Grid>
 
diff --git a/src/items/itemsLandingPage.component.tsx b/src/items/itemsLandingPage.component.tsx
index 87e8ee144..22f6a9f10 100644
--- a/src/items/itemsLandingPage.component.tsx
+++ b/src/items/itemsLandingPage.component.tsx
@@ -118,7 +118,7 @@ function ItemsLandingPage() {
             onChangeNode={navigateToCatalogue}
             breadcrumbsInfo={itemLandingBreadcrumbs}
             onChangeNavigateHome={() => navigateToCatalogue(null)}
-            navigateHomeAriaLabel={'navigate to catalogue home'}
+            homeLocation="Catalogue"
           />
         </Grid>
         {itemData && (
diff --git a/src/manufacturer/__snapshots__/manufacturer.component.test.tsx.snap b/src/manufacturer/__snapshots__/manufacturer.component.test.tsx.snap
index 7a732be04..b4931f9cf 100644
--- a/src/manufacturer/__snapshots__/manufacturer.component.test.tsx.snap
+++ b/src/manufacturer/__snapshots__/manufacturer.component.test.tsx.snap
@@ -11,27 +11,33 @@ exports[`Manufacturer > renders table data correctly 1`] = `
       <div
         class="MuiBox-root css-70qvj9"
       >
-        <button
-          aria-label="navigate to manufacturer home"
-          class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
-          tabindex="0"
-          type="button"
+        <span
+          aria-label="Manufacturers Home"
+          class=""
+          data-mui-internal-clone-element="true"
         >
-          <svg
-            aria-hidden="true"
-            class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-            data-testid="HomeIcon"
-            focusable="false"
-            viewBox="0 0 24 24"
+          <button
+            aria-label="navigate to manufacturers home"
+            class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
+            tabindex="0"
+            type="button"
           >
-            <path
-              d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"
+            <svg
+              aria-hidden="true"
+              class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+              data-testid="HomeIcon"
+              focusable="false"
+              viewBox="0 0 24 24"
+            >
+              <path
+                d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"
+              />
+            </svg>
+            <span
+              class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
             />
-          </svg>
-          <span
-            class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-          />
-        </button>
+          </button>
+        </span>
         <nav
           aria-label="breadcrumb"
           class="MuiTypography-root MuiTypography-body1 MuiBreadcrumbs-root css-1mc59t7-MuiTypography-root-MuiBreadcrumbs-root"
@@ -148,7 +154,7 @@ exports[`Manufacturer > renders table data correctly 1`] = `
                         aria-invalid="false"
                         autocomplete="new-password"
                         class="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputSizeSmall MuiInputBase-inputAdornedStart MuiInputBase-inputAdornedEnd css-12yjm75-MuiInputBase-input-MuiOutlinedInput-input"
-                        id=":r16:"
+                        id=":r18:"
                         placeholder="Search"
                         type="text"
                         value=""
@@ -422,7 +428,7 @@ exports[`Manufacturer > renders table data correctly 1`] = `
                             aria-label="Filter by Name"
                             autocomplete="new-password"
                             class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                            id=":r1e:"
+                            id=":r1g:"
                             placeholder="Filter by Name"
                             title="Filter by Name"
                             type="text"
@@ -599,7 +605,7 @@ exports[`Manufacturer > renders table data correctly 1`] = `
                               aria-label="Min"
                               autocomplete="new-password"
                               class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                              id=":r1k:"
+                              id=":r1m:"
                               inputmode="text"
                               placeholder="Min"
                               title="Min"
@@ -644,7 +650,7 @@ exports[`Manufacturer > renders table data correctly 1`] = `
                               aria-label="Max"
                               autocomplete="new-password"
                               class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                              id=":r1m:"
+                              id=":r1o:"
                               inputmode="text"
                               placeholder="Max"
                               title="Max"
@@ -819,7 +825,7 @@ exports[`Manufacturer > renders table data correctly 1`] = `
                               aria-label="Min"
                               autocomplete="new-password"
                               class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                              id=":r3j:"
+                              id=":r3l:"
                               inputmode="text"
                               placeholder="Min"
                               title="Min"
@@ -864,7 +870,7 @@ exports[`Manufacturer > renders table data correctly 1`] = `
                               aria-label="Max"
                               autocomplete="new-password"
                               class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                              id=":r3l:"
+                              id=":r3n:"
                               inputmode="text"
                               placeholder="Max"
                               title="Max"
@@ -1036,7 +1042,7 @@ exports[`Manufacturer > renders table data correctly 1`] = `
                             aria-label="Filter by URL"
                             autocomplete="new-password"
                             class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                            id=":r1s:"
+                            id=":r1u:"
                             placeholder="Filter by URL"
                             title="Filter by URL"
                             type="text"
@@ -1210,7 +1216,7 @@ exports[`Manufacturer > renders table data correctly 1`] = `
                             aria-label="Filter by Address"
                             autocomplete="new-password"
                             class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                            id=":r22:"
+                            id=":r24:"
                             placeholder="Filter by Address"
                             title="Filter by Address"
                             type="text"
@@ -1384,7 +1390,7 @@ exports[`Manufacturer > renders table data correctly 1`] = `
                             aria-label="Filter by Telephone number"
                             autocomplete="new-password"
                             class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                            id=":r28:"
+                            id=":r2a:"
                             placeholder="Filter by Telephone number"
                             title="Filter by Telephone number"
                             type="text"
@@ -2103,7 +2109,7 @@ exports[`Manufacturer > renders table data correctly 1`] = `
                   class="MuiInputBase-root MuiInput-root MuiInputBase-colorPrimary  css-1mmm5cp-MuiInputBase-root-MuiInput-root-MuiSelect-root"
                 >
                   <div
-                    aria-controls=":r2a:"
+                    aria-controls=":r2c:"
                     aria-expanded="false"
                     aria-haspopup="listbox"
                     aria-label="Rows per page"
diff --git a/src/manufacturer/manufacturer.component.test.tsx b/src/manufacturer/manufacturer.component.test.tsx
index 6423d4112..6e2f6af65 100644
--- a/src/manufacturer/manufacturer.component.test.tsx
+++ b/src/manufacturer/manufacturer.component.test.tsx
@@ -149,7 +149,7 @@ describe('Manufacturer', () => {
     });
 
     const homeButton = screen.getByRole('button', {
-      name: 'navigate to manufacturer home',
+      name: 'navigate to manufacturers home',
     });
 
     await user.click(homeButton);
diff --git a/src/manufacturer/manufacturer.component.tsx b/src/manufacturer/manufacturer.component.tsx
index db085d05d..b4daffa85 100644
--- a/src/manufacturer/manufacturer.component.tsx
+++ b/src/manufacturer/manufacturer.component.tsx
@@ -324,7 +324,7 @@ function ManufacturerComponent() {
           onChangeNode={onChangeNode}
           onChangeNavigateHome={onChangeNode}
           breadcrumbsInfo={undefined}
-          navigateHomeAriaLabel="navigate to manufacturer home"
+          homeLocation="Manufacturers"
         />
       </Box>
       <MaterialReactTable table={table} />
diff --git a/src/manufacturer/manufacturerLandingPage.component.test.tsx b/src/manufacturer/manufacturerLandingPage.component.test.tsx
index a8a514201..e384500ca 100644
--- a/src/manufacturer/manufacturerLandingPage.component.test.tsx
+++ b/src/manufacturer/manufacturerLandingPage.component.test.tsx
@@ -33,7 +33,7 @@ describe('Manufacturer Landing page', () => {
     await waitFor(() => {
       expect(
         screen.getByRole('button', {
-          name: 'navigate to manufacturer home',
+          name: 'navigate to manufacturers home',
         })
       ).toBeInTheDocument();
     });
@@ -52,7 +52,7 @@ describe('Manufacturer Landing page', () => {
     });
 
     const homeButton = screen.getByRole('button', {
-      name: 'navigate to manufacturer home',
+      name: 'navigate to manufacturers home',
     });
 
     await user.click(homeButton);
diff --git a/src/manufacturer/manufacturerLandingPage.component.tsx b/src/manufacturer/manufacturerLandingPage.component.tsx
index 486ed2b39..fbf282092 100644
--- a/src/manufacturer/manufacturerLandingPage.component.tsx
+++ b/src/manufacturer/manufacturerLandingPage.component.tsx
@@ -67,7 +67,7 @@ function ManufacturerLandingPage() {
             onChangeNode={onChangeNode}
             onChangeNavigateHome={() => onChangeNode(null)}
             breadcrumbsInfo={manufacturerLandingBreadcrumbs}
-            navigateHomeAriaLabel="navigate to manufacturer home"
+            homeLocation="Manufacturers"
           />
         </Grid>
         {manufacturerData && (
diff --git a/src/systems/__snapshots__/systemItemsTable.component.test.tsx.snap b/src/systems/__snapshots__/systemItemsTable.component.test.tsx.snap
index ca22cd8ab..58606d4b6 100644
--- a/src/systems/__snapshots__/systemItemsTable.component.test.tsx.snap
+++ b/src/systems/__snapshots__/systemItemsTable.component.test.tsx.snap
@@ -2637,7 +2637,7 @@ exports[`SystemItemsTable > SystemItemsTable (usageStatus) > renders correctly 1
                       aria-invalid="false"
                       autocomplete="new-password"
                       class="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputSizeSmall MuiInputBase-inputAdornedStart MuiInputBase-inputAdornedEnd css-12yjm75-MuiInputBase-input-MuiOutlinedInput-input"
-                      id=":rj7:"
+                      id=":rj8:"
                       placeholder="Search"
                       type="text"
                       value=""
@@ -2838,7 +2838,7 @@ exports[`SystemItemsTable > SystemItemsTable (usageStatus) > renders correctly 1
                           aria-label="Filter by Catalogue Item"
                           autocomplete="new-password"
                           class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                          id=":rjd:"
+                          id=":rje:"
                           placeholder="Filter by Catalogue Item"
                           title="Filter by Catalogue Item"
                           type="text"
@@ -3039,7 +3039,7 @@ exports[`SystemItemsTable > SystemItemsTable (usageStatus) > renders correctly 1
                           aria-label="Filter by Serial Number"
                           autocomplete="new-password"
                           class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input"
-                          id=":rjj:"
+                          id=":rjk:"
                           placeholder="Filter by Serial Number"
                           title="Filter by Serial Number"
                           type="text"
@@ -3544,7 +3544,7 @@ exports[`SystemItemsTable > SystemItemsTable (usageStatus) > renders correctly 1
                 class="MuiInputBase-root MuiInput-root MuiInputBase-colorPrimary  css-1mmm5cp-MuiInputBase-root-MuiInput-root-MuiSelect-root"
               >
                 <div
-                  aria-controls=":rjo:"
+                  aria-controls=":rjp:"
                   aria-expanded="false"
                   aria-haspopup="listbox"
                   aria-label="Rows per page"
diff --git a/src/systems/systemDirectoryDialog.component.tsx b/src/systems/systemDirectoryDialog.component.tsx
index 1b56200da..bb6b43628 100644
--- a/src/systems/systemDirectoryDialog.component.tsx
+++ b/src/systems/systemDirectoryDialog.component.tsx
@@ -163,7 +163,7 @@ export const SystemDirectoryDialog = (props: SystemDirectoryDialogProps) => {
               breadcrumbsInfo={parentSystemBreadcrumbs}
               onChangeNode={setParentSystemId}
               onChangeNavigateHome={() => setParentSystemId(null)}
-              navigateHomeAriaLabel={'navigate to systems home'}
+              homeLocation="Systems"
             />
           </Grid>
         </Grid>
diff --git a/src/systems/systemItemsDialog.component.tsx b/src/systems/systemItemsDialog.component.tsx
index c8fca0e13..c855656fe 100644
--- a/src/systems/systemItemsDialog.component.tsx
+++ b/src/systems/systemItemsDialog.component.tsx
@@ -229,7 +229,7 @@ const SystemItemsDialog = React.memo((props: SystemItemsDialogProps) => {
                 onChangeNavigateHome={() => {
                   changeParentSystemId(null);
                 }}
-                navigateHomeAriaLabel={'navigate to systems home'}
+                homeLocation="Systems"
               />
             </Grid>
             <Grid item xs={12}>
diff --git a/src/systems/systems.component.test.tsx b/src/systems/systems.component.test.tsx
index 3b931ba35..9748d22de 100644
--- a/src/systems/systems.component.test.tsx
+++ b/src/systems/systems.component.test.tsx
@@ -146,7 +146,7 @@ describe('Systems', () => {
       expect(screen.getByText('Root systems')).toBeInTheDocument();
     });
 
-    await user.click(screen.getByRole('button', { name: 'add system' }));
+    await user.click(screen.getByRole('button', { name: 'Add System' }));
 
     expect(screen.getByRole('dialog')).toBeInTheDocument();
 
@@ -164,7 +164,7 @@ describe('Systems', () => {
       expect(screen.getByText('Subsystems')).toBeInTheDocument();
     });
 
-    await user.click(screen.getByRole('button', { name: 'add subsystem' }));
+    await user.click(screen.getByRole('button', { name: 'Add Subsystem' }));
 
     expect(screen.getByRole('dialog')).toBeInTheDocument();
 
diff --git a/src/systems/systems.component.tsx b/src/systems/systems.component.tsx
index b0249ab70..5650a33a6 100644
--- a/src/systems/systems.component.tsx
+++ b/src/systems/systems.component.tsx
@@ -23,6 +23,7 @@ import {
   TableContainer,
   TableRow,
   Typography,
+  Tooltip,
 } from '@mui/material';
 import {
   // To resolve react/jsx-pascal-case
@@ -84,14 +85,19 @@ const AddSystemButton = (props: { systemId: string | null }) => {
   const [addSystemDialogOpen, setAddSystemDialogOpen] =
     React.useState<boolean>(false);
 
+  let ariaLabelText = props.systemId === null ? 'Add System' : 'Add Subsystem'
   return (
     <>
-      <IconButton
-        aria-label={props.systemId === null ? 'add system' : 'add subsystem'}
-        onClick={() => setAddSystemDialogOpen(true)}
-      >
-        <AddIcon />
-      </IconButton>
+      <Tooltip title = {ariaLabelText}>
+        <span>
+          <IconButton
+            aria-label= {ariaLabelText}
+            onClick={() => setAddSystemDialogOpen(true)}
+          >
+            <AddIcon />
+          </IconButton>
+        </span>
+      </Tooltip>  
       <SystemDialog
         open={addSystemDialogOpen}
         onClose={() => setAddSystemDialogOpen(false)}
@@ -341,7 +347,7 @@ function Systems() {
               breadcrumbsInfo={systemsBreadcrumbs}
               onChangeNode={navigateToSystem}
               onChangeNavigateHome={() => navigateToSystem(null)}
-              navigateHomeAriaLabel={'navigate to systems home'}
+              homeLocation="Systems"
             />
             {systemsBreadcrumbs && (
               <NavigateNext
diff --git a/src/view/__snapshots__/breadcrumbs.component.test.tsx.snap b/src/view/__snapshots__/breadcrumbs.component.test.tsx.snap
index 6e2889ef3..3a7a0c1b6 100644
--- a/src/view/__snapshots__/breadcrumbs.component.test.tsx.snap
+++ b/src/view/__snapshots__/breadcrumbs.component.test.tsx.snap
@@ -5,27 +5,33 @@ exports[`Channel Breadcrumbs > should render correctly for path 1`] = `
   <div
     class="MuiBox-root css-70qvj9"
   >
-    <button
-      aria-label="navigate to catalogue home"
-      class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
-      tabindex="0"
-      type="button"
+    <span
+      aria-label="Catalogue Home"
+      class=""
+      data-mui-internal-clone-element="true"
     >
-      <svg
-        aria-hidden="true"
-        class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-        data-testid="HomeIcon"
-        focusable="false"
-        viewBox="0 0 24 24"
+      <button
+        aria-label="navigate to catalogue home"
+        class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
+        tabindex="0"
+        type="button"
       >
-        <path
-          d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"
+        <svg
+          aria-hidden="true"
+          class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+          data-testid="HomeIcon"
+          focusable="false"
+          viewBox="0 0 24 24"
+        >
+          <path
+            d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"
+          />
+        </svg>
+        <span
+          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
         />
-      </svg>
-      <span
-        class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-      />
-    </button>
+      </button>
+    </span>
     <nav
       aria-label="breadcrumb"
       class="MuiTypography-root MuiTypography-body1 MuiBreadcrumbs-root css-1mc59t7-MuiTypography-root-MuiBreadcrumbs-root"
@@ -113,27 +119,33 @@ exports[`Channel Breadcrumbs > should render correctly for path when the subtree
   <div
     class="MuiBox-root css-70qvj9"
   >
-    <button
-      aria-label="navigate to catalogue home"
-      class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
-      tabindex="0"
-      type="button"
+    <span
+      aria-label="Catalogue Home"
+      class=""
+      data-mui-internal-clone-element="true"
     >
-      <svg
-        aria-hidden="true"
-        class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-        data-testid="HomeIcon"
-        focusable="false"
-        viewBox="0 0 24 24"
+      <button
+        aria-label="navigate to catalogue home"
+        class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
+        tabindex="0"
+        type="button"
       >
-        <path
-          d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"
+        <svg
+          aria-hidden="true"
+          class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+          data-testid="HomeIcon"
+          focusable="false"
+          viewBox="0 0 24 24"
+        >
+          <path
+            d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"
+          />
+        </svg>
+        <span
+          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
         />
-      </svg>
-      <span
-        class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-      />
-    </button>
+      </button>
+    </span>
     <nav
       aria-label="breadcrumb"
       class="MuiTypography-root MuiTypography-body1 MuiBreadcrumbs-root css-1mc59t7-MuiTypography-root-MuiBreadcrumbs-root"
@@ -358,27 +370,33 @@ exports[`Channel Breadcrumbs > should render correctly for root 1`] = `
   <div
     class="MuiBox-root css-70qvj9"
   >
-    <button
-      aria-label="navigate to catalogue home"
-      class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
-      tabindex="0"
-      type="button"
+    <span
+      aria-label="Catalogue Home"
+      class=""
+      data-mui-internal-clone-element="true"
     >
-      <svg
-        aria-hidden="true"
-        class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-        data-testid="HomeIcon"
-        focusable="false"
-        viewBox="0 0 24 24"
+      <button
+        aria-label="navigate to catalogue home"
+        class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeMedium css-78trlr-MuiButtonBase-root-MuiIconButton-root"
+        tabindex="0"
+        type="button"
       >
-        <path
-          d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"
+        <svg
+          aria-hidden="true"
+          class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+          data-testid="HomeIcon"
+          focusable="false"
+          viewBox="0 0 24 24"
+        >
+          <path
+            d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"
+          />
+        </svg>
+        <span
+          class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
         />
-      </svg>
-      <span
-        class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-      />
-    </button>
+      </button>
+    </span>
     <nav
       aria-label="breadcrumb"
       class="MuiTypography-root MuiTypography-body1 MuiBreadcrumbs-root css-1mc59t7-MuiTypography-root-MuiBreadcrumbs-root"
diff --git a/src/view/breadcrumbs.component.test.tsx b/src/view/breadcrumbs.component.test.tsx
index 71019866a..81ffac770 100644
--- a/src/view/breadcrumbs.component.test.tsx
+++ b/src/view/breadcrumbs.component.test.tsx
@@ -16,7 +16,7 @@ describe('Channel Breadcrumbs', () => {
       onChangeNode: onChangeNode,
       onChangeNavigateHome: onChangeNavigateHome,
       breadcrumbsInfo: { trail: [], full_trail: true },
-      navigateHomeAriaLabel: 'navigate to catalogue home',
+      homeLocation: 'Catalogue',
     };
   });
 
diff --git a/src/view/breadcrumbs.component.tsx b/src/view/breadcrumbs.component.tsx
index 4f39fc947..596a4bff0 100644
--- a/src/view/breadcrumbs.component.tsx
+++ b/src/view/breadcrumbs.component.tsx
@@ -7,6 +7,7 @@ import {
   Link,
   Breadcrumbs as MuiBreadcrumbs,
   styled,
+  Tooltip,
 } from '@mui/material';
 import { BreadcrumbsInfo } from '../api/api.types';
 import { OverflowTip } from '../utils';
@@ -15,7 +16,7 @@ export interface BreadcrumbsProps {
   breadcrumbsInfo?: BreadcrumbsInfo;
   onChangeNode: (newId: string) => void;
   onChangeNavigateHome: () => void;
-  navigateHomeAriaLabel: string;
+  homeLocation: 'Systems' | 'Admin' | 'Manufacturers' | 'Catalogue';
 }
 
 const StyledBreadcrumbs = styled(MuiBreadcrumbs)({
@@ -27,9 +28,12 @@ const Breadcrumbs = (props: BreadcrumbsProps) => {
     breadcrumbsInfo,
     onChangeNode,
     onChangeNavigateHome,
-    navigateHomeAriaLabel,
+    homeLocation,
   } = props;
 
+  const homeAriaLabel = `navigate to ${homeLocation.toLowerCase()} home`;
+  const tooltipLabel = `${homeLocation} Home`
+
   const emptyElement = ['', ''];
 
   const trailPrefix =
@@ -42,12 +46,16 @@ const Breadcrumbs = (props: BreadcrumbsProps) => {
   const breadcrumbMaxWidth = `${(100 - 10) / trailPrefix.concat(breadcrumbsInfo?.trail ?? emptyElement).length}vw`;
   return (
     <Box sx={{ display: 'flex', alignItems: 'center' }}>
-      <IconButton
-        onClick={onChangeNavigateHome}
-        aria-label={navigateHomeAriaLabel}
-      >
-        <HomeIcon />
-      </IconButton>
+      <Tooltip title = {tooltipLabel}>
+        <span>
+          <IconButton
+            onClick={onChangeNavigateHome}
+            aria-label={homeAriaLabel}
+          >
+            <HomeIcon />
+          </IconButton>
+        </span>
+      </Tooltip>
       <StyledBreadcrumbs
         separator={<NavigateNext fontSize="small" />}
         aria-label="breadcrumb"