diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Glossary/GlossaryDetails/GlossaryDetails.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Glossary/GlossaryDetails/GlossaryDetails.component.tsx index b3ecb213595..fd2e290be3d 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Glossary/GlossaryDetails/GlossaryDetails.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Glossary/GlossaryDetails/GlossaryDetails.component.tsx @@ -271,7 +271,7 @@ const GlossaryDetails = ({ className="glossary-details" data-testid="glossary-details" gutter={[0, 16]}> - + { ); } - return ( - - } - pageTitle={t('label.glossary')} - rightPanel={ - previewAsset && ( - setPreviewAsset(undefined)} - highlights={{ 'tag.name': [glossaryFqn] }} - /> - ) - } - rightPanelWidth={400}> + const glossaryElement = ( +
{isRightPanelLoading ? ( ) : ( @@ -397,8 +382,55 @@ const GlossaryPage = () => { onGlossaryTermUpdate={handleGlossaryTermUpdate} /> )} - +
); + + const resizableLayout = isGlossaryActive ? ( + , + }} + hideFirstPanel={isImportAction} + pageTitle={t('label.glossary')} + secondPanel={{ + children: glossaryElement, + className: 'content-resizable-panel-container', + minWidth: 800, + flex: 0.87, + }} + /> + ) : ( + setPreviewAsset(undefined)} + highlights={{ 'tag.name': [glossaryFqn] }} + /> + ), + className: + 'content-resizable-panel-container entity-summary-resizable-right-panel-container', + minWidth: 400, + flex: 0.3, + }} + /> + ); + + return <>{resizableLayout}; }; export default GlossaryPage; diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/Glossary/GlossaryPage/GlossaryPage.test.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/Glossary/GlossaryPage/GlossaryPage.test.tsx index bbc4cd0ce08..8c1b0f7e52f 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/Glossary/GlossaryPage/GlossaryPage.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/Glossary/GlossaryPage/GlossaryPage.test.tsx @@ -98,12 +98,22 @@ jest.mock('../../../rest/glossaryAPI', () => ({ .mockImplementation(() => Promise.resolve({ data: MOCK_GLOSSARY })), })); -jest.mock('../../../components/PageLayoutV1/PageLayoutV1', () => - jest.fn().mockImplementation(({ children, leftPanel, rightPanel }) => ( +jest.mock( + '../../../components/common/ResizablePanels/ResizableLeftPanels', + () => + jest.fn().mockImplementation(({ firstPanel, secondPanel }) => ( +
+ {firstPanel.children} + {secondPanel.children} +
+ )) +); + +jest.mock('../../../components/common/ResizablePanels/ResizablePanels', () => + jest.fn().mockImplementation(({ firstPanel, secondPanel }) => (
- {leftPanel} - {children} - {rightPanel} + {firstPanel.children} + {secondPanel.children}
)) ); diff --git a/openmetadata-ui/src/main/resources/ui/src/styles/spacing.less b/openmetadata-ui/src/main/resources/ui/src/styles/spacing.less index 19c465952ce..44684a13096 100644 --- a/openmetadata-ui/src/main/resources/ui/src/styles/spacing.less +++ b/openmetadata-ui/src/main/resources/ui/src/styles/spacing.less @@ -496,6 +496,9 @@ .p-l-lg { padding-left: @padding-lg; } +.p-l-xl { + padding-left: @padding-xl; +} .p-t-xl { padding-top: @padding-xl; }