feat: [AH-944]: fix UI flickering if upstream proxy length is big (#3392)

* feat: [AH-944]: use color from design system
* feat: [AH-944]: fix UI flickering if upstream proxy length is big
* feat: [AH-944]: add ellipsis to upstream proxy name in reorder select
pull/3616/head
Shivanand Sonnad 2025-02-10 06:25:26 +00:00 committed by Harness
parent 824f72479c
commit cee3efb886
4 changed files with 11 additions and 5 deletions

View File

@ -47,7 +47,7 @@
color: var(--black);
.addBtn {
display: block !important;
display: inline-flex !important;
}
}
}
@ -57,5 +57,5 @@
min-height: 20px !important;
height: 20px !important;
display: none !important;
min-width: 10px !important;
min-width: 50px !important;
}

View File

@ -17,6 +17,7 @@
import React from 'react'
import { Menu } from '@blueprintjs/core'
import { Layout, Text } from '@harnessio/uicore'
import { Color } from '@harnessio/design-system'
import { useStrings } from '@ar/frameworks/strings'
import MenuItemAction from './MenuItemAction'
@ -41,7 +42,9 @@ function SelectListMenuItem(props: SelectListMenuItemProps): JSX.Element {
disabled={disabled}
text={
<Layout.Horizontal flex={{ justifyContent: 'space-between', alignItems: 'center' }}>
<Text color="black">{label ? label : getString('na')}</Text>
<Text color={Color.GREY_900} lineClamp={1}>
{label ? label : getString('na')}
</Text>
{!disabled && <MenuItemAction rightIcon="main-chevron-right" text={getString('add')} />}
</Layout.Horizontal>
}

View File

@ -17,6 +17,7 @@
import React from 'react'
import { Expander, Menu } from '@blueprintjs/core'
import { Layout, Text } from '@harnessio/uicore'
import { Color } from '@harnessio/design-system'
import { Icon } from '@harnessio/icons'
import { useStrings } from '@ar/frameworks/strings'
@ -49,7 +50,9 @@ function SelectedListMenuItem(props: SelectedListMenuItemProps): JSX.Element {
text={
<Layout.Horizontal spacing="small" flex={{ justifyContent: 'flex-start', alignItems: 'center' }}>
{!disabled && <Icon name="drag-handle-vertical" size={12} />}
<Text color="black">{label ? label : getString('na')}</Text>
<Text lineClamp={1} color={Color.GREY_900}>
{label ? label : getString('na')}
</Text>
<Expander />
{!disabled && (
<MenuItemAction

View File

@ -134,7 +134,7 @@ function UpstreamProxiesSelect(props: UpstreamProxiesSelectProps): JSX.Element {
}
return (
<Container>
<Container width="100%">
<ReorderSelect
className={className}
items={items}