From 330f274cf273de65f37b295f372dc8bba249b845 Mon Sep 17 00:00:00 2001 From: Harshit Shah Date: Fri, 9 Oct 2026 02:24:24 +0530 Subject: [PATCH 01/17] Fixes #34976: Align dark-theme surfaces and controls across shared UI --- .../featured-icon/featured-icon.tsx | 16 +- .../src/assets/svg/ic-format-block-quote.svg | 2 +- .../src/assets/svg/ic-format-bullet-list.svg | 6 +- .../src/assets/svg/ic-format-code-block.svg | 2 +- .../assets/svg/ic-format-horizontal-line.svg | 2 +- .../src/assets/svg/ic-format-image-inline.svg | 4 +- .../assets/svg/ic-format-numbered-list.svg | 2 +- .../ActivityFeedPanel/feed-panel-body-v1.less | 17 +- .../ActivityFeedTab/activity-feed-tab.less | 21 +- .../ActivityFeed/FeedEditor/feed-editor.less | 14 +- .../TaskFeedCard/task-feed-card.less | 5 +- .../components/BlockEditor/block-editor.less | 23 ++- .../ContextCenterLayout.tsx | 2 +- .../ContextKnowledgePillarCard.component.tsx | 2 +- .../DashboardFoldersCard.component.tsx | 4 +- .../MemoriesView/MemoriesView.component.tsx | 5 +- .../DataProductsDetailsPage.component.tsx | 2 +- .../DataObservabilityTab.tsx | 2 +- .../data-observability-tab.less | 6 +- .../ProfilerSettingsModal.tsx | 66 +++--- .../TableProfiler/table-profiler.less | 7 +- .../Database/SchemaEditor/CodeEditor.tsx | 35 ++-- .../DomainDetails/DomainDetails.component.tsx | 6 +- .../ui/src/components/Domain/domain.less | 7 +- .../DomainListing/DomainListPage.tsx | 3 +- .../entity-summary-panel.less | 13 +- .../StyleModal/StyleModal.component.tsx | 138 +++++++------ .../CustomPropertyCard/CustomPropertyCard.tsx | 2 +- .../EntityCardView.component.tsx | 1 + .../common/EntityDescription/Description.tsx | 4 +- .../selection-card-group.less | 16 +- .../components/common/Table/TableV2Utils.ts | 2 +- .../common/ViewToggle/ViewToggle.tsx | 3 +- .../Alerts/AlertAiFormFields.constants.ts | 6 +- .../IncidentGroups/IncidentGroupsView.tsx | 2 +- .../platform/ai-shell/Sidebar/sidebar.less | 11 + .../ContextCenterAIContextDetailPage.tsx | 2 +- .../ContextCenterAIContextPage.tsx | 2 +- .../ContextCenterArchivePage.tsx | 2 +- .../ContextCenterDashboardPage.tsx | 6 +- .../ContextCenterDocumentsPage.tsx | 2 +- .../ContextCenterMemoriesPage.tsx | 2 +- .../RequestDescriptionPage.tsx | 19 +- .../src/pages/TasksPage/shared/Assignees.tsx | 190 +++++++++--------- .../TasksPage/shared/DescriptionTabs.tsx | 4 +- .../ui/src/styles/components/code-mirror.less | 2 +- .../resources/ui/src/utils/TestCaseUtils.tsx | 2 +- 47 files changed, 367 insertions(+), 325 deletions(-) diff --git a/openmetadata-ui-core-components/src/main/resources/ui/src/components/foundations/featured-icon/featured-icon.tsx b/openmetadata-ui-core-components/src/main/resources/ui/src/components/foundations/featured-icon/featured-icon.tsx index 3e6b65d19fa0..9afb799652c7 100644 --- a/openmetadata-ui-core-components/src/main/resources/ui/src/components/foundations/featured-icon/featured-icon.tsx +++ b/openmetadata-ui-core-components/src/main/resources/ui/src/components/foundations/featured-icon/featured-icon.tsx @@ -30,7 +30,7 @@ const outlineBorders: Record = { const styles = sortCx({ light: { - base: 'tw:rounded-full tw:dark:text-fg-white', + base: 'tw:rounded-full', sizes: { sm: 'tw:size-8', md: 'tw:size-10', @@ -38,15 +38,15 @@ const styles = sortCx({ xl: 'tw:size-14', }, colors: { - brand: - 'tw:bg-brand-secondary tw:text-featured-icon-light-fg-brand tw:dark:bg-brand-solid', - error: - 'tw:bg-error-secondary tw:text-featured-icon-light-fg-error tw:dark:bg-error-solid', - gray: 'tw:bg-tertiary tw:text-featured-icon-light-fg-gray tw:dark:bg-secondary-solid', + // Utility tints preserve the light palette and keep this subtle variant + // from becoming a solid CTA tile when the theme changes. + brand: 'tw:bg-utility-brand-100 tw:text-featured-icon-light-fg-brand', + error: 'tw:bg-utility-error-100 tw:text-featured-icon-light-fg-error', + gray: 'tw:bg-tertiary tw:text-featured-icon-light-fg-gray', success: - 'tw:bg-success-secondary tw:text-featured-icon-light-fg-success tw:dark:bg-success-solid', + 'tw:bg-utility-success-100 tw:text-featured-icon-light-fg-success', warning: - 'tw:bg-warning-secondary tw:text-featured-icon-light-fg-warning tw:dark:bg-warning-solid', + 'tw:bg-utility-warning-100 tw:text-featured-icon-light-fg-warning', }, }, diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-block-quote.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-block-quote.svg index a626260650fd..c7c176aa8a10 100644 --- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-block-quote.svg +++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-block-quote.svg @@ -1,3 +1,3 @@ - + \ No newline at end of file diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-bullet-list.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-bullet-list.svg index 293ccd4f7837..01e928ce546d 100644 --- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-bullet-list.svg +++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-bullet-list.svg @@ -1,5 +1,5 @@ - - - + + + diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-code-block.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-code-block.svg index 8daf6d5680a1..fb530149e7fa 100644 --- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-code-block.svg +++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-code-block.svg @@ -1,3 +1,3 @@ - + diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-horizontal-line.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-horizontal-line.svg index aeb9db3e5ad4..4e8045850efc 100644 --- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-horizontal-line.svg +++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-horizontal-line.svg @@ -1,3 +1,3 @@ - + \ No newline at end of file diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-image-inline.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-image-inline.svg index c67825ead370..cbaa84ac190c 100644 --- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-image-inline.svg +++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-image-inline.svg @@ -1,4 +1,4 @@ - - + + \ No newline at end of file diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-numbered-list.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-numbered-list.svg index 09f774488a48..e8d236691e45 100644 --- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-numbered-list.svg +++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-format-numbered-list.svg @@ -1,3 +1,3 @@ - + diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedPanel/feed-panel-body-v1.less b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedPanel/feed-panel-body-v1.less index 197438a46e6b..d32942fa1ff0 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedPanel/feed-panel-body-v1.less +++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedPanel/feed-panel-body-v1.less @@ -15,17 +15,18 @@ .activity-feed-card-new { border-radius: var(--om-radius-xl); - background: @grey-9; + background: var(--om-color-bg-surface); display: flex; flex-direction: column; flex-wrap: wrap; width: inherit; &.ant-card { - background: @grey-9; + background: var(--om-color-bg-surface); border-radius: var(--om-radius-xl); margin-bottom: var(--om-space-20); - border: 0.5px solid @grey-15; + border: 1px solid var(--om-color-border-subtle); + box-shadow: var(--om-shadow-card); } .ant-card-body { @@ -66,7 +67,7 @@ .task-feed-card-v1-new { .header-link { word-wrap: break-word; - color: @primary-heading-color; + color: var(--om-color-link); font-weight: var(--om-font-weight-semibold); display: inline; } @@ -84,8 +85,8 @@ border-radius: var(--om-radius-xl); padding: var(--om-space-16); margin: var(--om-space-20) 0 0 0; - background: @grey-9; - border: 0.5px solid @grey-15; + background: var(--om-color-bg-surface); + border: 1px solid var(--om-color-border-subtle); input.ant-input, textarea.ant-input { border-radius: var(--om-radius-20); @@ -102,8 +103,8 @@ .activity-feed-reply-button { border-radius: var(--om-radius-3xl); - border: 1px solid var(--om-legacy-color-d4d4d8); - color: var(--om-legacy-color-52525b); + border: 1px solid var(--om-color-border-secondary); + color: var(--om-color-text-secondary); font-size: var(--om-font-size-xs); } .comments-input-field { diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/activity-feed-tab.less b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/activity-feed-tab.less index 9cb86a68150a..aa1b1aeb14a2 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/activity-feed-tab.less +++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/activity-feed-tab.less @@ -244,33 +244,36 @@ } .activity-feed-editor-container-new { - background-color: @grey-9; - border: 0.5px solid @grey-15; + background-color: var(--om-color-bg-surface); + border: 1px solid var(--om-color-border-subtle); border-radius: var(--om-radius-10); width: 100%; .ql-container { - background-color: @grey-9; - border: 1px solid @grey-15; + background-color: var(--om-color-bg-surface); + border: none; width: 100%; &:focus-within { - border: 0.5px solid @grey-15; + outline: 1px solid var(--om-color-border-brand); + outline-offset: -1px; } } .ql-toolbar { - background-color: @grey-9; - border: 1px solid @grey-15; + background-color: var(--om-color-bg-surface); + border: none; + border-bottom: 1px solid var(--om-color-border-subtle); flex-wrap: wrap; &:focus-within { - border: 0.5px solid @grey-15; + outline: 1px solid var(--om-color-border-brand); + outline-offset: -1px; } } .ql-toolbar button { - color: var(--om-color-gray-true-800); + color: var(--om-color-text-secondary); } } diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/FeedEditor/feed-editor.less b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/FeedEditor/feed-editor.less index e9f0410f24de..2e4632309a98 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/FeedEditor/feed-editor.less +++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/FeedEditor/feed-editor.less @@ -506,19 +506,19 @@ @media (pointer: coarse) { .ql-snow.ql-toolbar button:hover:not(.ql-active), .ql-snow .ql-toolbar button:hover:not(.ql-active) { - color: var(--om-legacy-color-444444); + color: var(--om-color-text-secondary); } .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill, .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill, .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill, .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill { - fill: var(--om-legacy-color-444444); + fill: var(--om-color-text-secondary); } .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke, .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke, .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter, .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter { - stroke: var(--om-legacy-color-444444); + stroke: var(--om-color-text-secondary); } } .ql-snow { @@ -556,20 +556,20 @@ } .ql-snow .ql-stroke { fill: none; - stroke: var(--om-legacy-color-444444); + stroke: var(--om-color-text-secondary); stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; } .ql-snow .ql-stroke-miter { fill: none; - stroke: var(--om-legacy-color-444444); + stroke: var(--om-color-text-secondary); stroke-miterlimit: 10; stroke-width: 2; } .ql-snow .ql-fill, .ql-snow .ql-stroke.ql-fill { - fill: var(--om-legacy-color-444444); + fill: var(--om-color-text-secondary); } .ql-snow .ql-empty { fill: none; @@ -643,7 +643,7 @@ max-width: 100%; } .ql-snow .ql-picker { - color: var(--om-legacy-color-444444); + color: var(--om-color-text-secondary); display: inline-block; font-size: var(--om-font-size-sm); font-weight: var(--om-font-weight-medium); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/TaskFeedCard/task-feed-card.less b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/TaskFeedCard/task-feed-card.less index 86ea89949229..4de8bb900de6 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/TaskFeedCard/task-feed-card.less +++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/TaskFeedCard/task-feed-card.less @@ -38,10 +38,11 @@ } .task-feed-card-v1-new { padding: var(--om-space-20); - background: @grey-9; + background: var(--om-color-bg-surface); + box-shadow: var(--om-shadow-card); border-radius: var(--om-radius-xl); margin-bottom: var(--om-space-20); - border: 0.5px solid @grey-15; + border: 1px solid var(--om-color-border-subtle); &.active { border-left: 4px solid @primary-color; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/block-editor.less b/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/block-editor.less index 4598d16e979c..5b5ef715bc97 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/block-editor.less +++ b/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/block-editor.less @@ -13,16 +13,16 @@ @import (reference) '../../styles/variables.less'; @border-radius: var(--om-radius-md); -@border-color: var(--om-legacy-color-e8e8ed); +@border-color: var(--om-color-border-subtle); // Semantic surface so inline code, table headers and callouts follow dark mode // (the legacy #f8f8fa alias has no dark value). @markdown-bg-color: var(--om-color-bg-secondary); -@hover-bg: var(--om-legacy-color-0-0-0-0-02); +@hover-bg: var(--om-color-interactive-hover); @callout-bg: var(--om-color-bg-secondary); -@callout-warning-bg: var(--om-legacy-color-fff3dc); -@callout-info-bg: @primary-1; -@callout-danger-bg: var(--om-legacy-color-255-76-59-0-2); -@callout-border: var(--om-legacy-color-afafc1); +@callout-warning-bg: var(--om-color-bg-warning); +@callout-info-bg: var(--om-color-bg-brand); +@callout-danger-bg: var(--om-color-bg-error); +@callout-border: var(--om-color-border-subtle); .block-editor-wrapper { .om-block-editor > p:last-child { @@ -94,7 +94,7 @@ } a { - color: @primary-color; + color: var(--om-color-link); text-decoration: none; line-height: 24px; @@ -245,7 +245,8 @@ } &.block-editor-wrapper--bar-menu { - border: 1px solid var(--tw-color-border-primary); + background: var(--om-color-bg-surface); + border: 1px solid var(--om-color-border-subtle); border-radius: var(--om-radius-sm); &:focus-within { @@ -286,7 +287,7 @@ } .menu-wrapper { - background-color: var(--tw-color-bg-primary); + background-color: var(--om-color-bg-surface); display: flex; gap: var(--om-space-8); align-items: center; @@ -304,7 +305,7 @@ .slash-menu-wrapper { max-height: 300px; padding: var(--om-space-12) 0; - background-color: var(--tw-color-bg-primary); + background-color: var(--om-color-bg-overlay-surface); border: @global-border; border-radius: @border-rad-base; overflow-y: auto; @@ -329,7 +330,7 @@ max-height: 300px; max-width: 300px; padding: var(--om-space-12) 0; - background-color: var(--tw-color-bg-primary); + background-color: var(--om-color-bg-overlay-surface); border: @global-border; border-radius: @border-rad-base; overflow-y: auto; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterLayout/ContextCenterLayout.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterLayout/ContextCenterLayout.tsx index 33c4d587ad0b..de8c5c5f9855 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterLayout/ContextCenterLayout.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextCenterLayout/ContextCenterLayout.tsx @@ -109,7 +109,7 @@ const ContextCenterLayout: React.FC = ({ children }) => { ); return ( -
+
{/* Reloads the embedded page on a contextMemory/page change for the active CC route (registry → markRouteDirty); the layout, its modals and intents stay mounted. */} {children} diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextKnowledgePillarCard/ContextKnowledgePillarCard.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextKnowledgePillarCard/ContextKnowledgePillarCard.component.tsx index ab48d4ee6a93..45f9f53034f2 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextKnowledgePillarCard/ContextKnowledgePillarCard.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/ContextCenter/ContextKnowledgePillarCard/ContextKnowledgePillarCard.component.tsx @@ -51,7 +51,7 @@ function RecentItem({ return ( = ({ justify="between"> = ({ = ({ return ( onViewMemory?.(memory)}> diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataProducts/DataProductsDetailsPage/DataProductsDetailsPage.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataProducts/DataProductsDetailsPage/DataProductsDetailsPage.component.tsx index 956128ff76c9..19f99dfb65ad 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/DataProducts/DataProductsDetailsPage/DataProductsDetailsPage.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/DataProducts/DataProductsDetailsPage/DataProductsDetailsPage.component.tsx @@ -17,6 +17,7 @@ import { Tabs, Typography, } from '@openmetadata/ui-core-components'; +import { Announcement02 as IconAnnouncementsBlack } from '@openmetadata/ui-core-components/icons'; import { Button, Tooltip } from 'antd'; import ButtonGroup from 'antd/lib/button/button-group'; import { AxiosError } from 'axios'; @@ -25,7 +26,6 @@ import { toLower, toString } from 'lodash'; import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { useLocation, useNavigate } from 'react-router-dom'; -import { ReactComponent as IconAnnouncementsBlack } from '../../../assets/svg/announcements-black.svg'; import { ReactComponent as EditIcon } from '../../../assets/svg/edit-new.svg'; import { ReactComponent as DeleteIcon } from '../../../assets/svg/ic-delete.svg'; import { ReactComponent as ExportIcon } from '../../../assets/svg/ic-export.svg'; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/DataObservabilityTab.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/DataObservabilityTab.tsx index 7223459f2bf1..f5013c0a9ee0 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/DataObservabilityTab.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/DataObservabilityTab.tsx @@ -165,7 +165,7 @@ const DataObservabilityTab = (props: TableProfilerProps) => { return (
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/data-observability-tab.less b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/data-observability-tab.less index 3d37dbde1db5..99e0f5aaeef0 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/data-observability-tab.less +++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataObservability/data-observability-tab.less @@ -16,9 +16,9 @@ height: 100%; flex-grow: 1; overflow-y: scroll; - border-radius: @border-rad-sm; - border: 1px solid @grey-15; - padding: @padding-lg; + // The entity tab already supplies the outer frame; only its child panels + // need card surfaces, otherwise the profiler becomes a card inside a card. + padding: 0; .data-observability-content-panel { margin-top: var(--om-space-30); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx index 138d82c9e3d1..9398025f0ac0 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx @@ -13,16 +13,13 @@ import { PlusOutlined } from '@ant-design/icons'; import Icon from '@ant-design/icons/lib/components/Icon'; -import { Toggle, Typography } from '@openmetadata/ui-core-components'; import { - Button, - Drawer, - Input, - InputNumber, - Select, - Space, - TreeSelect, -} from 'antd'; + Button as CoreButton, + SlideoutMenu, + Toggle, + Typography, +} from '@openmetadata/ui-core-components'; +import { Button, Input, InputNumber, Select, Space, TreeSelect } from 'antd'; import Form from 'antd/lib/form'; import { FormProps, List } from 'antd/lib/form/Form'; import { Col, Row } from 'antd/lib/grid'; @@ -39,7 +36,6 @@ import { useState, } from 'react'; import { useTranslation } from 'react-i18next'; -import { ReactComponent as CloseIcon } from '../../../../../assets/svg/close.svg'; import { ReactComponent as IconDelete } from '../../../../../assets/svg/ic-delete.svg'; import { DEFAULT_INCLUDE_PROFILE, @@ -476,16 +472,15 @@ const ProfilerSettingsModal: React.FC = ({ const drawerFooter = (
- - +
); @@ -979,28 +974,25 @@ const ProfilerSettingsModal: React.FC = ({ ); return ( - } - type="link" - onClick={handleCancel} - /> - } - footer={drawerFooter} - maskClosable={false} - open={visible} - placement="right" - title={t('label.setting-plural')} + dialogClassName="tw:gap-0" + isDismissable={false} + isOpen={visible} width="40%" - onClose={handleCancel}> - {renderContent} - + onOpenChange={(isOpen) => !isOpen && handleCancel()}> + + + {t('label.setting-plural')} + + + + {renderContent} + + {drawerFooter} + ); }; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/table-profiler.less b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/table-profiler.less index 9016ddd62459..e86a2d3bffca 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/table-profiler.less +++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/table-profiler.less @@ -70,9 +70,8 @@ .profiler-settings-drawer-content { flex: 1; overflow-y: auto; - padding-top: @padding-lg; - padding-right: @padding-sm; - padding-bottom: @padding-lg; + // The slideout content owns the gutters; nested padding narrows the form. + padding: 0; .delete-btn { &.ant-btn-icon-only { @@ -83,7 +82,7 @@ } .profiler-settings-form { - padding-right: @padding-sm; + padding-right: 0; } } diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/SchemaEditor/CodeEditor.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Database/SchemaEditor/CodeEditor.tsx index 019626243fa1..84d29ad750b4 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Database/SchemaEditor/CodeEditor.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/SchemaEditor/CodeEditor.tsx @@ -11,12 +11,11 @@ * limitations under the License. */ -import { Card } from '@openmetadata/ui-core-components'; +import { ButtonUtility, Card } from '@openmetadata/ui-core-components'; +import { Copy01 } from '@openmetadata/ui-core-components/icons'; import CodeMirror from '@uiw/react-codemirror'; -import { Button, Tooltip } from 'antd'; import classNames from 'classnames'; import { useTranslation } from 'react-i18next'; -import { ReactComponent as CopyIcon } from '../../../assets/svg/copy-left.svg'; import { JSON_TAB_SIZE } from '../../../constants/constants'; import { CSMode } from '../../../enums/codemirror.enum'; import { useClipboard } from '../../../hooks/useClipBoard'; @@ -75,10 +74,9 @@ const CodeEditor = ({ const { onCopyToClipBoard, hasCopied } = useClipboard(internalValue); return ( - // Light values reproduce the antd Card this replaced.
{title} @@ -98,19 +95,17 @@ const CodeEditor = ({
- -
)}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Domain/DomainDetails/DomainDetails.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Domain/DomainDetails/DomainDetails.component.tsx index eef1c45d76b4..32d3431dd919 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Domain/DomainDetails/DomainDetails.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Domain/DomainDetails/DomainDetails.component.tsx @@ -19,7 +19,10 @@ import { Tabs, Typography, } from '@openmetadata/ui-core-components'; -import { ChevronDown } from '@openmetadata/ui-core-components/icons'; +import { + Announcement02 as IconAnnouncementsBlack, + ChevronDown, +} from '@openmetadata/ui-core-components/icons'; import { Button, Tooltip } from 'antd'; import ButtonGroup from 'antd/lib/button/button-group'; import { AxiosError } from 'axios'; @@ -29,7 +32,6 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { useForm } from 'react-hook-form'; import { useTranslation } from 'react-i18next'; import { useLocation, useNavigate, useParams } from 'react-router-dom'; -import { ReactComponent as IconAnnouncementsBlack } from '../../../assets/svg/announcements-black.svg'; import { ReactComponent as EditIcon } from '../../../assets/svg/edit-new.svg'; import { ReactComponent as DeleteIcon } from '../../../assets/svg/ic-delete.svg'; import { ReactComponent as VersionIcon } from '../../../assets/svg/ic-version.svg'; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Domain/domain.less b/openmetadata-ui/src/main/resources/ui/src/components/Domain/domain.less index e8db73d6de4f..a39a53eb33f3 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Domain/domain.less +++ b/openmetadata-ui/src/main/resources/ui/src/components/Domain/domain.less @@ -13,14 +13,13 @@ @import (reference) '../../styles/variables.less'; .domain-page-container { - background-color: var(--tw-color-bg-primary); - border: 1px solid var(--tw-color-gray-blue-100); + background-color: var(--om-color-bg-canvas); border-radius: var(--om-radius-md); margin-bottom: var(--om-space-20); .grid-container { background: none; - padding-right: var(--om-space-1); + padding-right: 0; } .resizable-panels-layout { @@ -28,7 +27,7 @@ } .assets-tab-container { - border: 1px solid var(--tw-color-gray-blue-100); + border: none; } .grid-container > #KnowledgePanel\.LeftPanel { diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DomainListing/DomainListPage.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DomainListing/DomainListPage.tsx index fe0526ca236b..0014fd62ab1e 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/DomainListing/DomainListPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/DomainListing/DomainListPage.tsx @@ -330,11 +330,12 @@ const DomainListPage = ({ renderPageHeader }: DomainListPageProps) => { + variant={isAiMode ? 'ghost' : 'elevated'}> { }; return ( - - - form={form} - id="style-modal" - initialValues={{ - ...style, - colorInput: style?.color, - }} - layout="vertical" - onFinish={handleSubmit} - onValuesChange={(value) => { - if (!isUndefined(value.color)) { - form.setFieldValue('colorInput', value.color); - } - if (!isUndefined(value.colorInput)) { - form.setFieldValue('color', value.colorInput); - } - }}> - - } - name="iconURL"> - - - - - - - + !isOpen && !saving && onCancel()}> + + !saving && onCancel()}> + + + form={form} + id="style-modal" + initialValues={{ + ...style, + colorInput: style?.color, + }} + layout="vertical" + onFinish={handleSubmit} + onValuesChange={(value) => { + if (!isUndefined(value.color)) { + form.setFieldValue('colorInput', value.color); + } + if (!isUndefined(value.colorInput)) { + form.setFieldValue('color', value.colorInput); + } + }}> + + } + name="iconURL"> + + + + + + + + + + + + + + ); }; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/CustomPropertyTable/CustomPropertyCard/CustomPropertyCard.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/CustomPropertyTable/CustomPropertyCard/CustomPropertyCard.tsx index b8564aff2fc6..fc2c7938a469 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/CustomPropertyTable/CustomPropertyCard/CustomPropertyCard.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/CustomPropertyTable/CustomPropertyCard/CustomPropertyCard.tsx @@ -137,7 +137,7 @@ export const CustomPropertyCard = ({ return ( ({ data-testid="card-view-container"> {entities.map((entity) => ( @@ -325,7 +325,7 @@ const Description = ({ ['fixed'] ): string { return fixed === 'left' || fixed === 'right' - ? 'tw:bg-surface tw:dark:group-hover:bg-secondary tw:dark:group-data-[selected]:bg-secondary' + ? 'tw:bg-surface tw:group-hover:bg-secondary tw:group-data-[selected]:bg-secondary' : ''; } diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/ViewToggle/ViewToggle.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/ViewToggle/ViewToggle.tsx index 345226ea300f..ec005b82ae12 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/ViewToggle/ViewToggle.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/ViewToggle/ViewToggle.tsx @@ -50,6 +50,7 @@ const ViewToggle: FC = ({ return ( { @@ -64,7 +65,7 @@ const ViewToggle: FC = ({ return ( { direction="col"> {detailKey === undefined ? ( <> - + {/* Kept when empty, so the dimension picker stays on the right. */} {hasStats && ( diff --git a/openmetadata-ui/src/main/resources/ui/src/components/platform/ai-shell/Sidebar/sidebar.less b/openmetadata-ui/src/main/resources/ui/src/components/platform/ai-shell/Sidebar/sidebar.less index 836f1e3e1085..0a06101c4e97 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/platform/ai-shell/Sidebar/sidebar.less +++ b/openmetadata-ui/src/main/resources/ui/src/components/platform/ai-shell/Sidebar/sidebar.less @@ -1446,9 +1446,20 @@ background: @ask-bg-active; color: @ask-brand-active; + // Visited links must keep the selected icon's foreground instead of + // inheriting the browser/legacy link accent through currentColor. + &:link, + &:visited, + &:focus, &:hover { color: @ask-brand-active; } + + // Match expanded navigation: the icon owns its foreground so link-state + // colors cannot change a currentColor glyph when the pointer leaves. + svg { + color: @ask-brand-active; + } } svg { diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterAIContextPage/ContextCenterAIContextDetailPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterAIContextPage/ContextCenterAIContextDetailPage.tsx index 1bd73c306674..9e6ce0fbf114 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterAIContextPage/ContextCenterAIContextDetailPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterAIContextPage/ContextCenterAIContextDetailPage.tsx @@ -63,7 +63,7 @@ const ContextCenterAIContextDetailPage = () => { return (
{ return (
{ return (
{ return (
{ {recentlyViewedItems.map((item) => ( { {mostCitedItems.map((item) => ( { return ( diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterMemoriesPage/ContextCenterMemoriesPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterMemoriesPage/ContextCenterMemoriesPage.tsx index e702e658debd..8395e4e28b02 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterMemoriesPage/ContextCenterMemoriesPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContextCenterPage/ContextCenterMemoriesPage/ContextCenterMemoriesPage.tsx @@ -781,7 +781,7 @@ const ContextCenterMemoriesPage: FC = () => { return ( diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/RequestDescriptionPage/RequestDescriptionPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/RequestDescriptionPage/RequestDescriptionPage.tsx index eef037f6fab9..71546fa9d948 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/RequestDescriptionPage/RequestDescriptionPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/TasksPage/RequestDescriptionPage/RequestDescriptionPage.tsx @@ -11,8 +11,8 @@ * limitations under the License. */ -import { Typography } from '@openmetadata/ui-core-components'; -import { Button, Form, FormProps, Input, Space } from 'antd'; +import { Button, Input, Typography } from '@openmetadata/ui-core-components'; +import { Form, FormProps, Space } from 'antd'; import { useForm } from 'antd/lib/form/Form'; import { AxiosError } from 'axios'; import { isEmpty } from 'lodash'; @@ -243,7 +243,10 @@ const RequestDescription = () => { })}:`} name="title"> { className="w-full justify-end" data-testid="cta-buttons" size={16}> - @@ -326,11 +326,12 @@ export const SelectableList = ({
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/UserTeamSelectableList/UserTeamSelectableList.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/UserTeamSelectableList/UserTeamSelectableList.component.tsx index 8ff7392193b4..54704e83a903 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/UserTeamSelectableList/UserTeamSelectableList.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/UserTeamSelectableList/UserTeamSelectableList.component.tsx @@ -10,7 +10,16 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { Popover, Tabs } from '@openmetadata/ui-core-components'; +import { + Avatar, + ButtonUtility, + Popover, + Tabs, + Tag, + TagGroup, + TagList, +} from '@openmetadata/ui-core-components'; +import { Edit02, Users01 } from '@openmetadata/ui-core-components/icons'; import classNames from 'classnames'; import { isArray, isEmpty, noop, toString } from 'lodash'; import React, { @@ -21,11 +30,8 @@ import React, { useState, } from 'react'; import { useTranslation } from 'react-i18next'; -import { ReactComponent as EditIcon } from '../../../assets/svg/edit-new.svg'; -import { ReactComponent as IconTeamsGrey } from '../../../assets/svg/teams-grey.svg'; import { ADD_USER_CONTAINER_HEIGHT, - DE_ACTIVE_COLOR, PAGE_SIZE_MEDIUM, } from '../../../constants/constants'; import { EntityType } from '../../../enums/entity.enum'; @@ -39,16 +45,13 @@ import { import { getEntityName } from '../../../utils/EntityNameUtils'; import { getEntityReferenceListFromEntities } from '../../../utils/EntityReferenceUtils'; import { getTermQuery } from '../../../utils/SearchPureUtils'; -import { EditIconButton } from '../IconButtons/EditIconButton'; import { SelectableList } from '../SelectableList/SelectableList.component'; -import { UserTag } from '../UserTag/UserTag.component'; -import { UserTagSize } from '../UserTag/UserTag.interface'; import { UserSelectDropdownProps } from './UserTeamSelectableList.interface'; export const TeamListItemRenderer = (props: EntityReference) => { return ( - + {getEntityName(props)} ); @@ -378,12 +381,12 @@ export const UserTeamSelectableList = ({ const defaultTrigger = hasPermission ? ( - } - size="small" - title={getEditTriggerTitle()} + icon={Edit02} + size="xs" + tooltip={getEditTriggerTitle()} onClick={handleTriggerClick} /> @@ -424,23 +427,26 @@ export const UserTeamSelectableList = ({ entity: label ?? t('label.owner-plural'), })} -
- {selectedUsers.map((user) => { - return ( - onRemove(user.id)} - /> - ); - })} -
+ + + {selectedUsers.map((user) => ( + onRemove(user.id)}> + + {getEntityName(user)} + + ))} + +
) : null; @@ -513,6 +519,7 @@ export const UserTeamSelectableList = ({ <> {triggerElement} true, multiple: canAddMultipleUserOwners, + popoverClassName: 'tw:bg-raised', onFocus, onSearchChange, options, @@ -147,6 +148,7 @@ export const getDomainField = ({ 'data-testid': 'domain-select', filterOption: () => true, multiple: canAddMultipleDomains, + popoverClassName: 'tw:bg-raised', onFocus, onSearchChange, options, From 80f590b5fbd4888a98294fbdd7b9e5eed9212f67 Mon Sep 17 00:00:00 2001 From: Harshit Shah Date: Fri, 9 Oct 2026 10:19:20 +0530 Subject: [PATCH 06/17] Format shared task and approval browser helpers --- .../src/main/resources/ui/playwright/utils/glossary.ts | 8 ++++++-- .../src/main/resources/ui/playwright/utils/task.ts | 8 ++++++-- .../main/resources/ui/playwright/utils/taskWorkflow.ts | 4 +++- 3 files changed, 15 insertions(+), 5 deletions(-) diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/glossary.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/glossary.ts index 7189b3ff1e5c..437c442060b1 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/utils/glossary.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/glossary.ts @@ -1295,7 +1295,9 @@ export const createDescriptionTaskForGlossary = async ( page.getByTestId('select-assignee').getByRole('combobox') ).toBeDisabled(); } else { - const assigneeField = page.getByTestId('select-assignee').getByRole('combobox'); + const assigneeField = page + .getByTestId('select-assignee') + .getByRole('combobox'); await assigneeField.click(); const userSearchResponse = page.waitForResponse( @@ -1346,7 +1348,9 @@ export const createTagTaskForGlossary = async ( ).toBeDisabled(); } else { // select assignee - const assigneeField = page.getByTestId('select-assignee').getByRole('combobox'); + const assigneeField = page + .getByTestId('select-assignee') + .getByRole('combobox'); await assigneeField.click(); const userSearchResponse = page.waitForResponse( `/api/v1/search/query?q=*${value.assignee}**&index=user%2Cteam*` diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/task.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/task.ts index 9ff31d78ea9e..82e65e92871a 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/utils/task.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/task.ts @@ -125,7 +125,9 @@ export const createDescriptionTask = async ( page.getByTestId('select-assignee').getByRole('combobox') ).toBeDisabled(); } else { - const assigneeField = page.getByTestId('select-assignee').getByRole('combobox'); + const assigneeField = page + .getByTestId('select-assignee') + .getByRole('combobox'); await assigneeField.click(); await assigneeField.fill(value.assignee); @@ -167,7 +169,9 @@ export const createTagTask = async ( ).toBeDisabled(); } else { // select assignee - const assigneeField = page.getByTestId('select-assignee').getByRole('combobox'); + const assigneeField = page + .getByTestId('select-assignee') + .getByRole('combobox'); await assigneeField.click(); await assigneeField.fill(value.assignee); diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/taskWorkflow.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/taskWorkflow.ts index f526b74bcb49..147b10a56285 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/utils/taskWorkflow.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/taskWorkflow.ts @@ -214,7 +214,9 @@ export const openTaskForm = async (page: Page, route: string) => { }; export const selectAssignee = async (page: Page, assigneeName: string) => { - const assigneeInput = page.getByTestId('select-assignee').getByRole('combobox'); + const assigneeInput = page + .getByTestId('select-assignee') + .getByRole('combobox'); const assigneeOption = page.getByTestId(assigneeName); const assigneeSearchResponse = page .waitForResponse( From a3030780afcc9346ae0cc111632dbbb45defbd2e Mon Sep 17 00:00:00 2001 From: Harshit Shah Date: Fri, 9 Oct 2026 10:22:51 +0530 Subject: [PATCH 07/17] Organize profiler and domain imports --- .../ProfilerSettingsModal/ProfilerSettingsModal.tsx | 2 +- .../components/Domain/DomainDetails/DomainDetails.component.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx index 4ea81dc603d3..381e6547d9d6 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx @@ -42,8 +42,8 @@ import { INTERVAL_TYPE_OPTIONS, INTERVAL_UNIT_OPTIONS, MIN_PROFILE_SAMPLE, - PROFILER_MODAL_LABEL_STYLE, PROFILE_SAMPLE_OPTIONS, + PROFILER_MODAL_LABEL_STYLE, SUPPORTED_COLUMN_DATA_TYPE_FOR_INTERVAL, TIME_BASED_PARTITION, } from '../../../../../constants/profiler.constant'; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Domain/DomainDetails/DomainDetails.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Domain/DomainDetails/DomainDetails.component.tsx index 32d3431dd919..f7a3f3578b29 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Domain/DomainDetails/DomainDetails.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Domain/DomainDetails/DomainDetails.component.tsx @@ -20,8 +20,8 @@ import { Typography, } from '@openmetadata/ui-core-components'; import { - Announcement02 as IconAnnouncementsBlack, ChevronDown, + Announcement02 as IconAnnouncementsBlack, } from '@openmetadata/ui-core-components/icons'; import { Button, Tooltip } from 'antd'; import ButtonGroup from 'antd/lib/button/button-group'; From f828272429b2564a400b72672fe86745fdb18a14 Mon Sep 17 00:00:00 2001 From: Harshit Shah Date: Fri, 9 Oct 2026 10:27:21 +0530 Subject: [PATCH 08/17] Use semantic surfaces and colors in Classic sidebar submenus --- .../MyData/LeftSidebar/left-sidebar.less | 19 ++++++++++++------- 1 file changed, 12 insertions(+), 7 deletions(-) diff --git a/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/left-sidebar.less b/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/left-sidebar.less index 42f884f9fb0c..bffb71cb5d5f 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/left-sidebar.less +++ b/openmetadata-ui/src/main/resources/ui/src/components/MyData/LeftSidebar/left-sidebar.less @@ -11,9 +11,9 @@ * limitations under the License. */ @import (reference) '../../../styles/variables.less'; -@selected-color: @primary-color; -@hover-color: @primary-1; -@active-color: @primary-7; +@selected-color: var(--tw-color-bg-brand-solid); +@hover-color: var(--tw-color-bg-brand-primary); +@active-color: var(--tw-color-fg-brand-primary); @left-sidebar-icon-size: 28px; .logo-container { @@ -36,6 +36,11 @@ } .left-sidebar-menu { + &.ant-menu-sub, + .ant-menu-sub { + background: var(--tw-color-bg-primary); + } + &:not(.ant-menu-submenu-hidden) { display: flex; flex-direction: column; @@ -43,7 +48,7 @@ .ant-menu-item, .ant-menu-submenu { - color: @grey-600; + color: var(--tw-color-text-secondary); } &.ant-menu.ant-menu-vertical[dir='rtl'] { @@ -203,13 +208,13 @@ .ant-menu-submenu.ant-menu-submenu-open { border-width: 0px 1px 1px 1px; border-style: solid; - border-color: @primary-4; + border-color: var(--tw-color-border-brand); color: var(--tw-color-text-white); border-radius: var(--om-radius-xl); overflow: hidden; .ant-menu-submenu-title { - background-color: @active-color; + background-color: @selected-color; font-weight: var(--om-font-weight-semibold); line-height: 20px; font-size: var(--om-font-size-sm); @@ -274,7 +279,7 @@ color: @active-color; .ant-menu-submenu-title { - background: @active-color; + background: @selected-color; color: var(--tw-color-text-white); border-radius: var(--om-radius-xl); From 5472f5a5a114daa7104706eae95d126c2e0b4959 Mon Sep 17 00:00:00 2001 From: Harshit Shah Date: Fri, 9 Oct 2026 10:38:44 +0530 Subject: [PATCH 09/17] Keep profiler dropdowns inside the settings drawer --- .../ProfilerSettingsAfterReindex.spec.ts | 17 +++++++++++++++++ .../ProfilerSettingsModal.tsx | 18 ++++++++++++++++-- 2 files changed, 33 insertions(+), 2 deletions(-) diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/DataQuality/ProfilerSettingsAfterReindex.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/DataQuality/ProfilerSettingsAfterReindex.spec.ts index 70929d222a3f..4fa94050ca42 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/DataQuality/ProfilerSettingsAfterReindex.spec.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/DataQuality/ProfilerSettingsAfterReindex.spec.ts @@ -48,6 +48,23 @@ test('Profiler settings survive a table reindex', async ({ browser }) => { await page.getByTestId('profiler-setting-btn').click(); await page.getByTestId('profiler-settings-modal').waitFor(); + // Body-portaled options are hidden by the modal's accessibility boundary. + // Check accessible options and keyboard selection inside the drawer. + const settings = page.getByRole('dialog', { name: 'Settings' }); + const sampleType = settings.getByRole('combobox', { + name: 'Profile Sample type', + }); + await settings.getByTestId('profile-sample').click(); + await expect( + settings.getByRole('option', { name: 'Row Count', exact: true }) + ).toBeAttached(); + await sampleType.press('ArrowDown'); + await sampleType.press('Enter'); + await expect(settings.getByTestId('metric-number-input')).toBeVisible(); + await settings.getByTestId('profile-sample').click(); + await sampleType.press('ArrowUp'); + await sampleType.press('Enter'); + await page.getByTestId('slider-input').clear(); await page.getByTestId('slider-input').fill(PROFILE_SAMPLE); await page.getByTestId('sample-data-count-input').clear(); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx index 381e6547d9d6..f8dc9b95b67c 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TableProfiler/ProfilerSettingsModal/ProfilerSettingsModal.tsx @@ -19,7 +19,15 @@ import { Toggle, Typography, } from '@openmetadata/ui-core-components'; -import { Button, Input, InputNumber, Select, Space, TreeSelect } from 'antd'; +import { + Button, + ConfigProvider, + Input, + InputNumber, + Select, + Space, + TreeSelect, +} from 'antd'; import Form from 'antd/lib/form'; import { FormProps, List } from 'antd/lib/form/Form'; import { Col, Row } from 'antd/lib/grid'; @@ -990,7 +998,13 @@ const ProfilerSettingsModal: React.FC = ({ - {renderContent} + {/* Legacy dropdowns must stay inside the modal's focus and accessibility boundary. */} + + triggerNode?.parentElement ?? document.body + }> + {renderContent} + {drawerFooter} From 8e2e75ec9d44217a2011e20dc2aa5ebf991bce07 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Fri, 9 Oct 2026 05:13:09 +0000 Subject: [PATCH 10/17] chore(playwright): auto-refresh impact-map.generated.json --- .github/playwright/impact-map.generated.json | 24 +++++++++++++------- 1 file changed, 16 insertions(+), 8 deletions(-) diff --git a/.github/playwright/impact-map.generated.json b/.github/playwright/impact-map.generated.json index be842c93ce43..67ccfa60833f 100644 --- a/.github/playwright/impact-map.generated.json +++ b/.github/playwright/impact-map.generated.json @@ -7612,14 +7612,6 @@ "playwright/e2e/Pages/AppStopRunModal.spec.ts" ] }, - { - "sources": [ - "openmetadata-ui/src/main/resources/ui/src/components/Modals/StyleModal/StyleModal.component.tsx" - ], - "specs": [ - "playwright/e2e/Pages/DomainUIInteractions.spec.ts" - ] - }, { "sources": [ "openmetadata-ui/src/main/resources/ui/src/components/Modals/TourEndModal/TourEndModal.tsx" @@ -12457,6 +12449,22 @@ "playwright/e2e/Pages/IntakeForm.spec.ts" ] }, + { + "sources": [ + "openmetadata-ui/src/main/resources/ui/src/pages/KPIPage/AddKPIPage.tsx" + ], + "specs": [ + "playwright/e2e/Features/DataQuality/ProfilerSettingsAfterReindex.spec.ts" + ] + }, + { + "sources": [ + "openmetadata-ui/src/main/resources/ui/src/pages/KPIPage/EditKPIPage.tsx" + ], + "specs": [ + "playwright/e2e/Features/DataQuality/ProfilerSettingsAfterReindex.spec.ts" + ] + }, { "sources": [ "openmetadata-ui/src/main/resources/ui/src/pages/KnowledgeCenterFilterPage/KnowledgeCenterFilterPage.tsx" From 6d11f7d1dafccff73773974b8847470d1ce37c08 Mon Sep 17 00:00:00 2001 From: Harshit Shah Date: Fri, 9 Oct 2026 11:55:25 +0530 Subject: [PATCH 11/17] Fix dark-theme UI checkstyle and coverage failures --- .../DataAssetSummaryPanelV1.test.tsx | 1 + .../ProfilerSettingsModal.tsx | 31 +++++++++---------- .../DomainDetails/DomainDetails.component.tsx | 2 +- .../components/UploadFile/UploadFile.test.tsx | 12 ++++--- .../common/Table/TableV2Utils.test.ts | 8 +++-- 5 files changed, 29 insertions(+), 25 deletions(-) diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataAssetSummaryPanelV1/DataAssetSummaryPanelV1.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataAssetSummaryPanelV1/DataAssetSummaryPanelV1.test.tsx index 92b1b216058b..7950a87fd824 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/DataAssetSummaryPanelV1/DataAssetSummaryPanelV1.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/DataAssetSummaryPanelV1/DataAssetSummaryPanelV1.test.tsx @@ -274,6 +274,7 @@ jest.mock('@openmetadata/ui-core-components', () => { }); return { + ...jest.requireActual('@openmetadata/ui-core-components'), Owner: () =>
Owners Section
, Button: ({ children, onPress, onClick, ...rest }: any) => (