Skip to content

fix(UI): updated home page widget icons - #31624

Merged
Rohit0301 merged 2 commits into
mainfrom
widget-icons
Aug 18, 2026
Merged

fix(UI): updated home page widget icons#31624
Rohit0301 merged 2 commits into
mainfrom
widget-icons

Conversation

@Rohit0301

@Rohit0301 Rohit0301 commented Aug 17, 2026 •
edited by greptile-apps Bot
Loading

Copy link
Copy Markdown
Contributor

Describe your changes:

Screen.Recording.2026-08-17.at.3.20.37.PM.mov

Fixes #

I worked on ... because ...

Type of change:

  • Bug fix
  • Improvement
  • New feature
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • Documentation

High-level design:

N/A — small change.

Tests:

Use cases covered

Unit tests

Backend integration tests

Ingestion integration tests

Playwright (UI) tests

Manual testing performed

UI screen recording / screenshots:

Not applicable.

Checklist:

  • I have read the CONTRIBUTING document.
  • My PR title is Fixes <issue-number>: <short explanation>
  • My PR is linked to a GitHub issue via Fixes #<issue-number> above.
  • I have commented on my code, particularly in hard-to-understand areas.
  • For JSON Schema changes: I updated the migration scripts or explained why it is not needed.
  • For UI changes: I attached a screen recording and/or screenshots above.
  • I have added tests (unit / integration / Playwright as applicable) and listed them above.

Summary by Gitar

  • UI updates:
    • Updated home page widget icons across multiple widgets and added widget filtering support via CustomizeMyDataPageClassBase

This will update automatically on new commits.

Greptile Summary

The PR refreshes home-page widget header icons and introduces an extension point for excluding widgets from the customization modal.

  • Adds dedicated SVG assets for home-page widgets.
  • Replaces existing widget icon imports and standardizes header icons at 24px.
  • Filters customization options through getExcludedWidgetFqns(), whose base implementation excludes nothing.

Confidence Score: 5/5

The PR appears safe to merge.

No blocking failure remains.

Important Files Changed
Filename Overview
openmetadata-ui/src/main/resources/ui/src/components/MyData/CustomizableComponents/CustomiseHomeModal/CustomiseHomeModal.tsx Applies the new widget-exclusion extension point while retaining the existing hardcoded exclusions.
openmetadata-ui/src/main/resources/ui/src/utils/CustomizeMyDataPageClassBase.ts Adds a default exclusion hook that returns an empty list and therefore preserves open-source behavior.
openmetadata-ui/src/main/resources/ui/src/components/MyData/Widgets/DomainsWidget/DomainsWidget.tsx Replaces the widget-specific domain icon with the shared current-color entity icon.
openmetadata-ui/src/main/resources/ui/src/components/MyData/Widgets/KPIWidget/KPIWidget.component.tsx Replaces the KPI header artwork and aligns its dimensions with the 24px header container.
openmetadata-ui/src/main/resources/ui/src/components/KnowledgeCenter/KnowledgeCenterWidget/KnowledgeCenterWidget.tsx Uses the new context-center widget icon without changing widget behavior.

Reviews (2): Last reviewed commit: "lint fix" | Re-trigger Greptile

@Rohit0301 Rohit0301 self-assigned this Aug 17, 2026
@Rohit0301 Rohit0301 added the safe to test Add this label to run secure Github workflows on PRs label Aug 17, 2026
@github-actions

github-actions Bot commented Aug 17, 2026

Copy link
Copy Markdown
Contributor

❌ PR checklist incomplete

This PR cannot be merged until the following are addressed on its linked issue:

  • No GitHub issue is linked. Link an issue in the Development section of the PR (or add Fixes #12345 to the description). For a same-org cross-repo issue, add Fixes open-metadata/<repo>#123 to the description.

The fields live on the linked issue in the Shipping project (open the issue → right sidebar → Projects). After you set them, re-run this check (or push a commit) — issue/project changes do not re-trigger it automatically.

Maintainers can bypass this check by adding the skip-pr-checks label.

@github-actions github-actions Bot added the UI UI specific issues label Aug 17, 2026
@github-actions

github-actions Bot commented Aug 17, 2026 •
edited
Loading

Copy link
Copy Markdown
Contributor

⚠️ UI Checkstyle passed — lint findings in changed files

🔍 ESLint findings in this PR's files — 0 error(s), 50 warning(s)

Errors block the build. Warnings do not yet — they are rules whose backlog is still
being worked down, listed so this PR does not add to it. See docs/ui-code-quality-gate.md.

0 error(s), 50 warning(s) across 13 changed file(s).

Count Rule
32 react-hooks/exhaustive-deps
10 openmetadata-imports/no-lower-layer-page-imports
2 jsx-a11y/click-events-have-key-events
2 sonarjs/no-nested-conditional
1 openmetadata-imports/no-api-calls-in-iteration
1 sonarjs/no-nested-functions
1 jsx-a11y/no-static-element-interactions
1 sonarjs/cyclomatic-complexity
All findings
Location Rule Message
🟡 src/components/KnowledgeCenter/KnowledgeCenterWidget/KnowledgeCenterWidget.tsx:37:1 openmetadata-imports/no-lower-layer-page-imports Pages are route-level composition modules. Move the shared implementation/type to a lower layer instead of importing a page from here.
🟡 src/components/KnowledgeCenter/KnowledgeCenterWidget/KnowledgeCenterWidget.tsx:101:6 react-hooks/exhaustive-deps React Hook useMemo has an unnecessary dependency: 't'. Either exclude it or remove the dependency array. Outer scope values like 't' aren't valid dependencies b
🟡 src/components/KnowledgeCenter/KnowledgeCenterWidget/KnowledgeCenterWidget.tsx:164:6 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 'getGridTemplateColumns'. Either include it or remove the dependency array.
🟡 src/components/KnowledgeCenter/KnowledgeCenterWidget/KnowledgeCenterWidget.tsx:179:6 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 'showWidgetFooterMoreButton'. Either include it or remove the dependency array.
🟡 src/components/KnowledgeCenter/KnowledgeCenterWidget/KnowledgeCenterWidget.tsx:195:6 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 'navigate'. Either include it or remove the dependency array.
🟡 src/components/KnowledgeCenter/KnowledgeCenterWidget/KnowledgeCenterWidget.tsx:206:6 react-hooks/exhaustive-deps React Hook useEffect has a missing dependency: 'fetchUserKnowledgeArticles'. Either include it or remove the dependency array.
🟡 src/components/MyData/CustomizableComponents/CustomiseHomeModal/CustomiseHomeModal.tsx:169:6 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 't'. Either include it or remove the dependency array.
🟡 src/components/MyData/CustomizableComponents/CustomiseHomeModal/CustomiseHomeModal.tsx:218:13 jsx-a11y/click-events-have-key-events Visible, non-interactive elements with click handlers must have at least one keyboard listener.
🟡 src/components/MyData/CustomizableComponents/CustomiseHomeModal/CustomiseHomeModal.tsx:246:6 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 'widgets.length'. Either include it or remove the dependency array.
🟡 src/components/MyData/FeedWidget/FeedWidget.component.tsx:29:1 openmetadata-imports/no-lower-layer-page-imports Pages are route-level composition modules. Move the shared implementation/type to a lower layer instead of importing a page from here.
🟡 src/components/MyData/FeedWidget/FeedWidget.component.tsx:70:6 react-hooks/exhaustive-deps React Hook useCallback has a missing dependency: 'handleRemoveWidget'. Either include it or remove the dependency array. If 'handleRemoveWidget' changes too oft
🟡 src/components/MyData/FeedWidget/FeedWidget.component.tsx:134:6 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 't'. Either include it or remove the dependency array.
🟡 src/components/MyData/FeedWidget/FeedWidget.component.tsx:159:6 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 't'. Either include it or remove the dependency array.
🟡 src/components/MyData/FeedWidget/FeedWidget.component.tsx:194:5 react-hooks/exhaustive-deps React Hook useMemo has missing dependencies: 'navigate' and 'userActivityFeedLink'. Either include them or remove the dependency array.
🟡 src/components/MyData/MyDataWidget/MyDataWidget.component.tsx:38:1 openmetadata-imports/no-lower-layer-page-imports Pages are route-level composition modules. Move the shared implementation/type to a lower layer instead of importing a page from here.
🟡 src/components/MyData/MyDataWidget/MyDataWidget.component.tsx:161:6 react-hooks/exhaustive-deps React Hook useCallback has unnecessary dependencies: 'applySortToData', 'getSortField', and 'getSortOrder'. Either exclude them or remove the dependency array.
🟡 src/components/MyData/MyDataWidget/MyDataWidget.component.tsx:185:5 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 't'. Either include it or remove the dependency array.
🟡 src/components/MyData/MyDataWidget/MyDataWidget.component.tsx:251:6 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 't'. Either include it or remove the dependency array.
🟡 src/components/MyData/MyDataWidget/MyDataWidget.component.tsx:285:5 react-hooks/exhaustive-deps React Hook useMemo has missing dependencies: 'currentUser?.name' and 'navigate'. Either include them or remove the dependency array.
🟡 src/components/MyData/RightSidebar/FollowingWidget.tsx:38:1 openmetadata-imports/no-lower-layer-page-imports Pages are route-level composition modules. Move the shared implementation/type to a lower layer instead of importing a page from here.
🟡 src/components/MyData/RightSidebar/FollowingWidget.tsx:176:5 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 't'. Either include it or remove the dependency array.
🟡 src/components/MyData/RightSidebar/FollowingWidget.tsx:248:6 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 't'. Either include it or remove the dependency array.
🟡 src/components/MyData/RightSidebar/FollowingWidget.tsx:277:5 react-hooks/exhaustive-deps React Hook useMemo has missing dependencies: 'currentUser?.name' and 'navigate'. Either include them or remove the dependency array.
🟡 src/components/MyData/Widgets/CuratedAssetsWidget/CuratedAssetsWidget.tsx:45:1 openmetadata-imports/no-lower-layer-page-imports Pages are route-level composition modules. Move the shared implementation/type to a lower layer instead of importing a page from here.
🟡 src/components/MyData/Widgets/CuratedAssetsWidget/CuratedAssetsWidget.tsx:216:6 react-hooks/exhaustive-deps React Hook useCallback has an unnecessary dependency: 'curatedAssetsConfig'. Either exclude it or remove the dependency array.
🟡 src/components/MyData/Widgets/CuratedAssetsWidget/CuratedAssetsWidget.tsx:454:5 react-hooks/exhaustive-deps React Hook useMemo has an unnecessary dependency: 'curatedAssetsWidth'. Either exclude it or remove the dependency array.
🟡 src/components/MyData/Widgets/DataAssetsWidget/DataAssetsWidget.component.tsx:29:1 openmetadata-imports/no-lower-layer-page-imports Pages are route-level composition modules. Move the shared implementation/type to a lower layer instead of importing a page from here.
🟡 src/components/MyData/Widgets/DataAssetsWidget/DataAssetsWidget.component.tsx:79:6 react-hooks/exhaustive-deps React Hook useCallback has a missing dependency: 'selectedSortBy'. Either include it or remove the dependency array.
🟡 src/components/MyData/Widgets/DataAssetsWidget/DataAssetsWidget.component.tsx:177:5 react-hooks/exhaustive-deps React Hook useMemo has an unnecessary dependency: 'widgetData.w'. Either exclude it or remove the dependency array.
🟡 src/components/MyData/Widgets/DataAssetsWidget/DataAssetsWidget.component.tsx:205:5 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 'services'. Either include it or remove the dependency array.
🟡 src/components/MyData/Widgets/DataProductsWidget/DataProductsWidget.component.tsx:35:1 openmetadata-imports/no-lower-layer-page-imports Pages are route-level composition modules. Move the shared implementation/type to a lower layer instead of importing a page from here.
🟡 src/components/MyData/Widgets/DataProductsWidget/DataProductsWidget.component.tsx:101:6 react-hooks/exhaustive-deps React Hook useCallback has a missing dependency: 't'. Either include it or remove the dependency array. Outer scope values like 'getSortField' aren't valid depe
🟡 src/components/MyData/Widgets/DataProductsWidget/DataProductsWidget.component.tsx:288:15 sonarjs/no-nested-conditional Extract this nested ternary operation into an independent statement.
🟡 src/components/MyData/Widgets/DomainsWidget/DomainsWidget.tsx:34:1 openmetadata-imports/no-lower-layer-page-imports Pages are route-level composition modules. Move the shared implementation/type to a lower layer instead of importing a page from here.
🟡 src/components/MyData/Widgets/DomainsWidget/DomainsWidget.tsx:119:6 react-hooks/exhaustive-deps React Hook useCallback has a missing dependency: 't'. Either include it or remove the dependency array. Outer scope values like 'getSortField' aren't valid depe
🟡 src/components/MyData/Widgets/DomainsWidget/DomainsWidget.tsx:294:15 sonarjs/no-nested-conditional Extract this nested ternary operation into an independent statement.
🟡 src/components/MyData/Widgets/KPIWidget/KPIWidget.component.tsx:121:9 react-hooks/exhaustive-deps The 'handleTitleClick' function makes the dependencies of useMemo Hook (at line 444) change on every render. Move it inside the useMemo callback. Alternatively,
🟡 src/components/MyData/Widgets/KPIWidget/KPIWidget.component.tsx:153:9 openmetadata-imports/no-api-calls-in-iteration Avoid issuing one API request per item. Fetch at the data owner, use a bulk endpoint, or use useQueries with an intentional concurrency policy.
🟡 src/components/MyData/Widgets/KPIWidget/KPIWidget.component.tsx:275:45 sonarjs/no-nested-functions Refactor this code to not nest functions more than 4 levels deep.
🟡 src/components/MyData/Widgets/KPIWidget/KPIWidget.component.tsx:402:6 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 'customTooltipStyles'. Either include it or remove the dependency array.
🟡 src/components/MyData/Widgets/KPIWidget/KPIWidget.component.tsx:428:6 react-hooks/exhaustive-deps React Hook useEffect has missing dependencies: 'fetchKpiLatestResults' and 'fetchKpiResults'. Either include them or remove the dependency array.
🟡 src/components/MyData/Widgets/MyTaskWidget/MyTaskWidget.tsx:28:1 openmetadata-imports/no-lower-layer-page-imports Pages are route-level composition modules. Move the shared implementation/type to a lower layer instead of importing a page from here.
🟡 src/components/MyData/Widgets/MyTaskWidget/MyTaskWidget.tsx:124:5 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 'navigate'. Either include it or remove the dependency array.
🟡 src/components/MyData/Widgets/TotalDataAssetsWidget/TotalDataAssetsWidget.component.tsx:304:15 jsx-a11y/click-events-have-key-events Visible, non-interactive elements with click handlers must have at least one keyboard listener.
🟡 src/components/MyData/Widgets/TotalDataAssetsWidget/TotalDataAssetsWidget.component.tsx:304:15 jsx-a11y/no-static-element-interactions Avoid non-native interactive elements. If using native HTML is not possible, add an appropriate role and support for tabbing, mouse, keyboard, and touch inputs
🟡 src/components/MyData/Widgets/TotalDataAssetsWidget/TotalDataAssetsWidget.component.tsx:330:6 react-hooks/exhaustive-deps React Hook useEffect has a missing dependency: 'fetchData'. Either include it or remove the dependency array.
🟡 src/components/MyData/Widgets/TotalDataAssetsWidget/TotalDataAssetsWidget.component.tsx:336:6 react-hooks/exhaustive-deps React Hook useEffect has a missing dependency: 'selectedDate'. Either include it or remove the dependency array.
🟡 src/components/MyData/Widgets/TotalDataAssetsWidget/TotalDataAssetsWidget.component.tsx:364:5 react-hooks/exhaustive-deps React Hook useMemo has a missing dependency: 'navigate'. Either include it or remove the dependency array.
🟡 src/utils/CustomizeMyDataPageClassBase.ts:31:1 openmetadata-imports/no-lower-layer-page-imports Pages are route-level composition modules. Move the shared implementation/type to a lower layer instead of importing a page from here.
🟡 src/utils/CustomizeMyDataPageClassBase.ts:114:10 sonarjs/cyclomatic-complexity {"message":"Function has a complexity of 13 which is greater than 10 authorized.","cost":3,"secondaryLocations":[{"line":114,"column":9,"endLine":114,"endColumn

Fix locally (fast - only checks files changed in this branch):

make ui-checkstyle-changed

@github-actions

github-actions Bot commented Aug 17, 2026 •
edited
Loading

Copy link
Copy Markdown
Contributor

Jest test Coverage

UI tests summary

Lines Statements Branches Functions
Coverage: 66%
 66.86% (79909/119515) 51.25% (48770/95155) 52.24% (14599/27946)

@sonarqubecloud

sonarqubecloud Bot commented Aug 17, 2026

Copy link
Copy Markdown

Quality Gate Passed Quality Gate passed for 'open-metadata-ui'

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

@github-actions

github-actions Bot commented Aug 17, 2026

Copy link
Copy Markdown
Contributor

✅ Playwright Results — workflow succeeded

Validated commit 7c1b702fc5617147c333a4a49cccba2c41a9cdb9 in Playwright run 32022475872, attempt 1.

✅ 770 passed · ❌ 0 failed · 🟡 2 flaky · ⏭️ 0 skipped · 🧰 0 lifecycle flaky

Performance

Blocking targets: ✅ met · Optimization targets: 🟡 in progress

Shard-job maxima below are not the full workflow wall time; the linked run includes build, fixture, planning, and reporting.

🕒 Full workflow signal wall (to summary) 52m 29s

⏱️ Max setup 3m 2s · max shard execution 19m 20s · max shard-job elapsed before upload 22m 58s · reporting 6s

🌐 199.99 requests/attempt · 2.75 app boots/UI scenario · 7.76% common-shard skew

Optimization targets still in progress:

  • Application boot ratio was 2.75 per UI scenario (2267 boots / 825 scenarios; convergence target: at most 1).
Shard Passed Failed Flaky Skipped Lifecycle failed Lifecycle flaky
🟡 Shard chromium-01 148 0 1 0 0 0
🟡 Shard chromium-02 168 0 1 0 0 0
✅ Shard chromium-03 158 0 0 0 0 0
✅ Shard chromium-04 144 0 0 0 0 0
✅ Shard data-asset-rules-01 61 0 0 0 0 0
✅ Shard domain-isolation-01 14 0 0 0 0 0
✅ Shard global-state-01 34 0 0 0 0 0
✅ Shard ingestion-01 1 0 0 0 0 0
✅ Shard reindex-01 2 0 0 0 0 0
✅ Shard search-01 11 0 0 0 0 0
✅ Shard search-rbac-01 29 0 0 0 0 0
🟡 2 flaky test(s) (passed on retry)
  • Features/ContextCenterDocument.spec.ts › searching with folder selected scopes results to that folder only (shard chromium-01, 1 retry)
  • Features/ContextCenterArticles.spec.ts › Quick link lifecycle validates, creates, edits, and deletes from card (shard chromium-02, 1 retry)

📦 Download artifacts

How to debug locally 
# Download playwright-test-results-<shard> artifact and unzip
npx playwright show-trace path/to/trace.zip    # view trace

@Rohit0301
Rohit0301 added this pull request to the merge queue Aug 17, 2026
@github-merge-queue
github-merge-queue Bot removed this pull request from the merge queue due to failed status checks Aug 17, 2026
@Rohit0301
Rohit0301 added this pull request to the merge queue Aug 18, 2026
Merged via the queue into main with commit 4be16fd Aug 18, 2026
89 of 94 checks passed
@Rohit0301
Rohit0301 deleted the widget-icons branch August 18, 2026 07:33
@gitar-bot

gitar-bot Bot commented Aug 18, 2026

Copy link
Copy Markdown
Code Review ✅ Approved

Updates home page widget icons and adds widget filtering support via CustomizeMyDataPageClassBase. No issues found.

Options

Display: compact → Showing less information.

Comment with these commands to change the behavior for this request:

Compact 
gitar display:verbose

Was this helpful? React with 👍 / 👎 | Powered by Gitar — free for open source

Rohit0301 added a commit that referenced this pull request Aug 18, 2026
@Rohit0301
fix(UI): updated home page widget icons (#31624)
938e7c1 
* fix(UI): updated home page widget icons

* lint fix
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@chirag-madlani chirag-madlani chirag-madlani approved these changes
@ShaileshParmar11 ShaileshParmar11 ShaileshParmar11 approved these changes
@karanh37 karanh37 Awaiting requested review from karanh37 karanh37 is a code owner

Assignees

@Rohit0301 Rohit0301

Labels

safe to test Add this label to run secure Github workflows on PRs UI UI specific issues

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@Rohit0301 @chirag-madlani @ShaileshParmar11