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;
}