mirror of
https://github.com/MHSanaei/3x-ui.git
synced 2026-08-27 21:47:14 +00:00
fix(frontend): stabilize speed tags on inbound and client pages (#5930)
* fix(frontend): add shared stable speed-tag style Give live up/down rate tags a fixed width, centered layout, nowrap, and tabular numerals so digit/unit changes cannot reflow the Speed column. Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai> * fix(frontend): stabilize InboundSpeedTag and ClientSpeedTag layout Apply the shared speed-tag class/style to both live rate tags and lock the behavior with a focused component test for small and large rates. Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai> * fix(frontend): align speed columns with stable tag width Widen inbound/client Speed columns to match the fixed tag and apply the same stable style to idle dash cells so active/idle swaps do not jitter. Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai> * fix(frontend): scope stable speed tags to table cells and fit content --------- Co-authored-by: x06579 <x06579@ai-dashboard> Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
This commit is contained in:
@@ -2,6 +2,7 @@ import { Tag } from 'antd';
|
||||
|
||||
import { SizeFormatter } from '@/utils';
|
||||
import type { ClientSpeedEntry } from '@/hooks/useClients';
|
||||
import { SPEED_TAG_CLASS_NAME, SPEED_TAG_STYLE } from '@/components/utility/speedTagStyle';
|
||||
|
||||
export type { ClientSpeedEntry };
|
||||
|
||||
@@ -11,11 +12,16 @@ export function isActiveSpeed(speed?: ClientSpeedEntry): speed is ClientSpeedEnt
|
||||
|
||||
interface ClientSpeedTagProps {
|
||||
speed: ClientSpeedEntry;
|
||||
tableCell?: boolean;
|
||||
}
|
||||
|
||||
export function ClientSpeedTag({ speed }: ClientSpeedTagProps) {
|
||||
export function ClientSpeedTag({ speed, tableCell = false }: ClientSpeedTagProps) {
|
||||
return (
|
||||
<Tag color="blue">
|
||||
<Tag
|
||||
color="blue"
|
||||
className={tableCell ? SPEED_TAG_CLASS_NAME : undefined}
|
||||
style={tableCell ? SPEED_TAG_STYLE : undefined}
|
||||
>
|
||||
↑ {SizeFormatter.speedFormat(speed.up)}
|
||||
{' / '}
|
||||
↓ {SizeFormatter.speedFormat(speed.down)}
|
||||
|
||||
Reference in New Issue
Block a user