feat!: update to uikit7

[Raubzeug]

closes #2144
Stand

CI Results

Test Status: ⚠️ FLAKY

📊 Full Report

Total	Passed	Failed	Flaky	Skipped
354	349	0	3	2

Test Changes Summary ⏭️2

⏭️ Skipped Tests (2)

1. Scroll to row, get shareable link, navigate to URL and verify row is scrolled into view (tenant/diagnostics/tabs/queries.test.ts)
2. Copy result button copies to clipboard (tenant/queryEditor/queryEditor.test.ts)

Bundle Size: 🔺

Current: 85.06 MB | Main: 84.01 MB
Diff: +1.05 MB (1.26%)

⚠️ Bundle size increased. Please review.

ℹ️ CI Information

• Test recordings for failed tests are available in the full report.
• Bundle size is measured for the entire 'dist' directory.
• 📊 indicates links to detailed reports.
• 🔺 indicates increase, 🔽 decrease, and ✅ no change in bundle size.

[astandrik]

bugbot run

[astandrik]

1. Unmigrated anchorRef Usage
   • File: src/containers/ReduxTooltip/ReduxTooltip.js
   • Lines: 49, 62
   • Issue: Still using deprecated anchorRef prop instead of anchorElement
   • Fix needed:

     // Line 49 - should be:
     anchorElement={fakeAnchor.current}
     
     // Line 62 - should be:
     anchorElement={anchor}

[astandrik]

2. Unmigrated contentClassName
   • File: src/containers/ReduxTooltip/ReduxTooltip.js
   • Line: 48
   • Issue: Using deprecated contentClassName prop
   • Fix needed: Should use className on Popup and wrap content in a div

[Raubzeug]

• ReduxTooltip

Decided not to fix it right now, cause we want to get rid of this component (#2342)

[astandrik]

src/components/ContentWithPopup/ContentWithPopup.tsx

'onOutsideClick' is deprecated.ts(6385)
Popup.d.ts(69, 8): The declaration was marked as deprecated here.
(property) PopupProps.onOutsideClick?: ((event: MouseEvent) => void) | undefined
This callback will be called when click is outside of elements of "top layer" This behaviour could be disabled with disableOutsideClick option

@deprecated — Use onOpenChange instead

[astandrik]

bugbot run

[astandrik]

bugbot run

[astandrik]

bugbot run

[Raubzeug]

bugbot run

[astandrik]

bugbot run

[cursor]

Bug: UsageLabel Component Overload Styling Missing

The UsageLabel component lost its overloadThreshold functionality during the UIKit migration. Previously, this prop (defaulting to 90) applied special "overload" styling when the value exceeded the threshold. The functionality was completely removed, including the overloadThreshold prop, its conditional styling logic, and associated SCSS, resulting in a loss of visual indication for high usage values.

src/components/UsageLabel/UsageLabel.tsx#L3-L14

ydb-embedded-ui/src/components/UsageLabel/UsageLabel.tsx

Lines 3 to 14 in 4d912d9

	interface UsageLabelProps extends Omit<LabelProps, 'value'> {
	value: number | string;
	}
	export function UsageLabel({value, theme, ...props}: UsageLabelProps) {
	return (
	<Label theme={theme} {...props}>
	{value || 0}%
	</Label>
	);
	}

Fix in Cursor • Fix in Web

---

Was this report helpful? Give feedback by reacting with 👍 or 👎