Skip to content

fix(ui): accurate topology filter count + Helm chart-name tooltip #825

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
nadaverell merged 3 commits into from
May 30, 2026
+31 −5
Merged

fix(ui): accurate topology filter count + Helm chart-name tooltip #825

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
4954cf7
fix(ui): accurate topology filter count + Helm chart-name tooltip
nadaverell May 29, 2026
3845dbd
fix(topology): rename footer local to avoid shadowing hiddenKinds prop
nadaverell May 29, 2026
63564ff
fix(helm): use themed Tooltip for chart names instead of native title
nadaverell May 29, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 25 additions & 3 deletions packages/k8s-ui/src/components/topology/TopologyFilterSidebar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -386,9 +386,31 @@ export const TopologyFilterSidebar = memo(function TopologyFilterSidebar({

{/* Footer stats */}
<div className="px-3 py-2 border-t border-theme-border bg-theme-surface/50">
<div className="text-xs text-theme-text-tertiary">
Showing {availableKinds.filter(k => visibleKinds.has(k.kind)).reduce((sum, k) => sum + (kindCounts.get(k.kind) || 0), 0)} of {nodes.length} resources
</div>
{(() => {
// Total and visible both sum over availableKinds (the kinds the user
// can filter). nodes.length would include the synthetic Internet node,
// which isn't a filterable kind, so the two wouldn't reconcile and a
// "filtered" count would show even with nothing hidden.
const sumKinds = (ks: typeof availableKinds) =>
ks.reduce((sum, k) => sum + (kindCounts.get(k.kind) || 0), 0)
const total = sumKinds(availableKinds)
const visible = sumKinds(availableKinds.filter(k => visibleKinds.has(k.kind)))
const hidden = total - visible
const filteredOutKinds = availableKinds.filter(k => !visibleKinds.has(k.kind) && (kindCounts.get(k.kind) || 0) > 0)
return (
<div
className="text-xs text-theme-text-tertiary"
title={filteredOutKinds.length > 0
? `Hidden by kind filter: ${filteredOutKinds.map(k => `${kindCounts.get(k.kind)} ${k.kind}`).join(', ')}`
: undefined}
>
Showing {visible} of {total} resources
{hidden > 0 && (
<span className="ml-1 text-amber-400 cursor-help">· {hidden} filtered</span>
)}
</div>
)
})()}
</div>
</div>
)
Expand Down
8 changes: 6 additions & 2 deletions web/src/components/helm/ChartBrowser.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -476,7 +476,9 @@ function LocalChartCard({ chart, onSelect }: LocalChartCardProps) {
)}
<div className="flex-1 min-w-0">
<div className="flex items-center gap-2">
<h4 className="text-sm font-medium text-theme-text-primary truncate">{chart.name}</h4>
<Tooltip content={chart.name} wrapperClassName="min-w-0 flex-1">
<h4 className="text-sm font-medium text-theme-text-primary truncate">{chart.name}</h4>
</Tooltip>
{chart.deprecated && (
<span className={clsx('px-1 py-0.5 text-[10px] rounded', SEVERITY_BADGE.warning)}>
deprecated
Expand Down Expand Up @@ -540,7 +542,9 @@ function ArtifactHubChartCard({ chart, onSelect }: ArtifactHubChartCardProps) {

{/* Name and org */}
<div className="flex-1 min-w-0">
<h4 className="text-sm font-medium text-theme-text-primary truncate">{chart.name}</h4>
<Tooltip content={chart.name} wrapperClassName="w-full">
<h4 className="text-sm font-medium text-theme-text-primary truncate">{chart.name}</h4>
</Tooltip>
<div className="flex items-center gap-2 mt-0.5 text-xs text-theme-text-tertiary">
<span className="flex items-center gap-1">
<Building2 className="w-3 h-3" />
Expand Down
Loading