diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/EntityRightCollapsablePanel.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/EntityRightCollapsablePanel.spec.ts new file mode 100644 index 00000000000..ceb8718d865 --- /dev/null +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/EntityRightCollapsablePanel.spec.ts @@ -0,0 +1,85 @@ +/* + * Copyright 2025 Collate. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * http://www.apache.org/licenses/LICENSE-2.0 + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import test, { expect } from '@playwright/test'; +import { TableClass } from '../../support/entity/TableClass'; +import { createNewPage, redirectToHomePage } from '../../utils/common'; + +// use the admin user to login +test.use({ storageState: 'playwright/.auth/admin.json' }); + +const table = new TableClass(); + +test.beforeAll('Setup pre-requests', async ({ browser }) => { + const { apiContext, afterAction } = await createNewPage(browser); + await table.create(apiContext); + await afterAction(); +}); + +test.afterAll('Cleanup', async ({ browser }) => { + const { apiContext, afterAction } = await createNewPage(browser); + await table.delete(apiContext); + await afterAction(); +}); + +test.beforeEach(async ({ page }) => { + await redirectToHomePage(page); + await table.visitEntityPage(page); +}); + +test('Show and Hide Right Collapsable Panel', async ({ page }) => { + // Click on the tab expand button to hide the right collapsable panel + await page.click('[data-testid="tab-expand-button"]'); + + await expect( + page.locator('[data-testid="KnowledgePanel.DataProducts"]') + ).not.toBeVisible(); + + await expect( + page.locator('[data-testid="KnowledgePanel.Tags"]') + ).not.toBeVisible(); + + await expect( + page.locator('[data-testid="KnowledgePanel.GlossaryTerms"]') + ).not.toBeVisible(); + + await expect( + page.locator('[data-testid="KnowledgePanel.CustomProperties"]') + ).not.toBeVisible(); + + await expect( + page.locator('[data-testid="KnowledgePanel.TableConstraints"]') + ).not.toBeVisible(); + + // Click on the tab expand button to show the right collapsable panel + await page.click('[data-testid="tab-expand-button"]'); + + await expect( + page.locator('[data-testid="KnowledgePanel.DataProducts"]') + ).toBeVisible(); + + await expect( + page.locator('[data-testid="KnowledgePanel.Tags"]') + ).toBeVisible(); + + await expect( + page.locator('[data-testid="KnowledgePanel.GlossaryTerms"]') + ).toBeVisible(); + + await expect( + page.locator('[data-testid="KnowledgePanel.CustomProperties"]') + ).toBeVisible(); + + await expect( + page.locator('[data-testid="KnowledgePanel.TableConstraints"]') + ).toBeVisible(); +}); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Customization/GenericProvider/GenericProvider.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Customization/GenericProvider/GenericProvider.tsx index af10dfcbdfb..b1e8d5900f1 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Customization/GenericProvider/GenericProvider.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Customization/GenericProvider/GenericProvider.tsx @@ -179,7 +179,12 @@ export const GenericProvider = >({ ? prev : expandedLayout.current || prev; - // Update the layout with new width + if (isTabExpanded) { + // When expanded, only return the left panel widget with updated width + return leftPanelWidget ? [{ ...leftPanelWidget, w: targetWidth }] : []; + } + + // When not expanded, return all widgets with original width return sourceLayout.map((widget) => ({ ...widget, w: widget.i.startsWith(DetailPageWidgetKeys.LEFT_PANEL) diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/IconButtons/EditIconButton.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/IconButtons/EditIconButton.tsx index 76692a62a8f..c4f9bd292a9 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/IconButtons/EditIconButton.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/IconButtons/EditIconButton.tsx @@ -117,6 +117,7 @@ export const AlignRightIconButton = ({