Skip to content

Commit fe4ccba

Browse files
ankormoreankorankormoreankor
committed
remove label classnames
1 parent ab5e461 commit fe4ccba

File tree

13 files changed

+36
-423
lines changed

13 files changed

+36
-423
lines changed

‎packages/ui/src/styles/shared-style-variables.css

Lines changed: 0 additions & 261 deletions
Large diffs are not rendered by default.

‎packages/ui/src/views/labels/components/label-marker.tsx

Lines changed: 0 additions & 71 deletions
This file was deleted.

‎packages/ui/src/views/labels/components/label-tag.tsx

Lines changed: 7 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -4,33 +4,29 @@ import { getScopeType, IconV2, Layout, scopeTypeToIconMap, Tag, TagProps } from
44

55
import { ILabelType } from '../types'
66

7-
export type LabelTagProps = {
7+
export type LabelTagProps = Omit<TagProps, 'label' | 'theme' | 'icon' | 'variant'> & {
88
scope?: ILabelType['scope']
99
color: ILabelType['color']
10-
labelKey: ILabelType['key']
11-
labelValue?: string
10+
labelKey?: ILabelType['key']
1211
withIndicator?: boolean
13-
tagProps?: Partial<TagProps>
14-
className?: string
12+
wrapperClassName?: string
1513
}
1614

1715
export const LabelTag: FC<LabelTagProps> = ({
1816
scope,
1917
color,
2018
labelKey,
21-
labelValue,
2219
withIndicator = false,
23-
tagProps,
24-
className
20+
wrapperClassName,
21+
...tagProps
2522
}) => (
26-
<Layout.Grid gap="xs" align="center" columns="auto auto" className={className}>
23+
<Layout.Grid gap="xs" align="center" columns="auto auto" className={wrapperClassName}>
2724
<Tag
25+
size="sm"
2826
icon={scope !== undefined ? scopeTypeToIconMap[getScopeType(scope)] : undefined}
2927
variant="secondary"
30-
size="md"
3128
theme={color}
3229
label={labelKey}
33-
value={labelValue ?? ''}
3430
className="grid grid-flow-col content-center"
3531
labelClassName="grid grid-flow-col content-center"
3632
valueClassName="grid grid-flow-col content-center"

‎packages/ui/src/views/labels/components/labels-list-view.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -135,11 +135,11 @@ export const LabelsListView: FC<LabelsListViewProps> = ({
135135
<Table.Cell className="align-top">
136136
<Layout.Vertical align="start" gap="xs">
137137
<LabelTag
138-
className="mt-cn-2xs"
138+
wrapperClassName="mt-cn-2xs"
139139
scope={label.scope ?? 0}
140140
labelKey={label.key}
141141
color={label.color}
142-
labelValue={(valuesCount || '').toString()}
142+
value={(valuesCount || '').toString()}
143143
withIndicator={label.type === LabelType.DYNAMIC}
144144
/>
145145

@@ -150,7 +150,7 @@ export const LabelsListView: FC<LabelsListViewProps> = ({
150150
scope={label.scope}
151151
labelKey={label.key}
152152
color={item?.color || label.color}
153-
labelValue={item.value}
153+
value={item.value}
154154
/>
155155
))}
156156
</Layout.Vertical>

‎packages/ui/src/views/labels/index.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
export * from './label-form-page'
22
export * from './labels-list-page'
3-
export * from './components/label-marker'
43
export * from './components/label-tag'
54
export * from './types'

‎packages/ui/src/views/labels/label-form-page.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -199,15 +199,15 @@ export const LabelFormPage: FC<LabelFormPageProps> = ({
199199
<LabelTag
200200
color={color}
201201
labelKey={key.length ? key : t('views:labelData.form.labelName', 'Label name')}
202-
labelValue={values.length > 0 ? String(values.length) : ''}
202+
value={values.length > 0 ? String(values.length) : ''}
203203
withIndicator={isDynamic}
204204
/>
205205
{values.map((value, idx) => (
206206
<LabelTag
207207
key={`${value.value}-${idx}`}
208208
color={value.color}
209209
labelKey={key.length ? key : t('views:labelData.form.labelName', 'Label name')}
210-
labelValue={value.value.length ? value.value : t('views:labelData.form.valueName', 'Label value')}
210+
value={value.value.length ? value.value : t('views:labelData.form.valueName', 'Label value')}
211211
/>
212212
))}
213213
</Layout.Vertical>

‎packages/ui/src/views/repo/pull-request/components/labels/label-value-selector.tsx

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -112,16 +112,16 @@ export const LabelValueSelector: FC<LabelValueSelectorProps> = ({ label, handleA
112112
</Button>
113113
}
114114
prefix={
115-
<LabelTag
116-
className="border-0 pl-cn-xs"
117-
scope={label.scope ?? 0}
118-
color={label.color as ColorsEnum}
119-
labelKey={label.key ?? ''}
120-
tagProps={{
121-
className: 'max-w-20',
122-
size: 'sm'
123-
}}
124-
/>
115+
// to avoid styles from .cn-input-prefix
116+
<div className="contents">
117+
<LabelTag
118+
wrapperClassName="border-0 pl-cn-xs"
119+
scope={label.scope ?? 0}
120+
color={label.color as ColorsEnum}
121+
value={label.key ?? ''}
122+
className="max-w-20"
123+
/>
124+
</div>
125125
}
126126
{...wrapConditionalObjectElement({ maxLength: 50 }, !!label?.isCustom)}
127127
/>

‎packages/ui/src/views/repo/pull-request/components/labels/labels-filter.tsx

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,7 @@ import { useEffect, useRef, useState } from 'react'
33
import { CounterBadge } from '@components/counter-badge'
44
import { DropdownMenu } from '@components/dropdown-menu'
55
import { SearchInput } from '@components/inputs'
6-
import { ColorsEnum, ILabelType, LabelValueType } from '@views/labels'
7-
import { LabelMarker } from '@views/labels/components/label-marker'
6+
import { ColorsEnum, ILabelType, LabelTag, LabelValueType } from '@views/labels'
87

98
export type LabelsValue = Record<
109
string,
@@ -87,7 +86,7 @@ export function LabelsFilter({
8786
key={option.id}
8887
onBlur={() => updateFocusState(option.id, 'parent', false)}
8988
onFocus={() => updateFocusState(option.id, 'parent', true)}
90-
title={<LabelMarker color={option.color} label={option.key} value={String(option.value_count)} />}
89+
title={<LabelTag color={option.color} labelKey={option.key} value={String(option.value_count)} />}
9190
checked={value[option.id]?.valueId ? 'indeterminate' : !!value[option.id]}
9291
subMenuProps={{
9392
open: open[option.id] as boolean,
@@ -133,20 +132,20 @@ export function LabelsFilter({
133132
>
134133
<DropdownMenu.RadioItem
135134
value={ANY_LABEL_VALUE}
136-
title={<LabelMarker color={option.color} label={option.key} value={ANY_LABEL_VALUE} />}
135+
title={<LabelTag color={option.color} labelKey={option.key} value={ANY_LABEL_VALUE} />}
137136
/>
138137
{valueOptions[option.key]?.map(value => (
139138
<DropdownMenu.RadioItem
140139
key={value.id}
141140
value={String(value.id)}
142-
title={<LabelMarker color={option.color} label={option.key} value={value.value} />}
141+
title={<LabelTag color={value.color} labelKey={option.key} value={value.value} />}
143142
/>
144143
))}
145144
</DropdownMenu.RadioGroup>
146145
</DropdownMenu.CheckboxItem>
147146
) : (
148147
<DropdownMenu.CheckboxItem
149-
title={<LabelMarker color={option.color} label={option.key} />}
148+
title={<LabelTag color={option.color} value={option.key} />}
150149
checked={!!value[option.id]}
151150
key={option.id}
152151
onCheckedChange={selectedValue => {
@@ -167,7 +166,7 @@ export function LabelsFilter({
167166
)
168167
)}
169168

170-
{description && <div className="mx-2 my-4 text-sm text-cn-3">{description}</div>}
169+
{description && <div className="text-cn-3 mx-2 my-4 text-sm">{description}</div>}
171170
</>
172171
)
173172
}
@@ -233,7 +232,7 @@ export function filterLabelRenderer({ selectedValue, labelOptions, valueOptions
233232
return (
234233
<div className="flex w-max items-center gap-1">
235234
{label.key && label.color && (
236-
<LabelMarker key={labelId} color={label.color} label={label.key} value={value?.value || ''} />
235+
<LabelTag key={labelId} color={label.color} labelKey={label.key} value={value?.value || ''} />
237236
)}
238237

239238
{selectedLabels.length > CNT_BAGDE_THRESHOLD && (

‎packages/ui/src/views/repo/pull-request/components/labels/pull-request-labels-header.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -171,9 +171,8 @@ export const LabelsHeader = ({
171171
scope={label.scope ?? 0}
172172
color={label.color as ILabelType['color']}
173173
labelKey={label.key ?? ''}
174-
labelValue={(label.values?.length || '').toString()}
174+
value={(label.values?.length || '').toString()}
175175
withIndicator={label.type === LabelType.DYNAMIC}
176-
tagProps={{ size: 'sm' }}
177176
/>
178177
}
179178
// TODO: add description when it is available from PR Labels call

‎packages/ui/src/views/repo/pull-request/components/labels/pull-request-labels-list.tsx

Lines changed: 4 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -36,19 +36,10 @@ export const LabelsList: FC<LabelsListProps> = ({ labels, className, showReset,
3636
scope={label.scope}
3737
color={label.color}
3838
labelKey={label.key}
39-
labelValue={label.value || ''}
40-
tagProps={{
41-
size: 'sm',
42-
onActionClick: label.onDelete,
43-
actionIcon: showReset ? 'xmark' : undefined,
44-
onClick: onClick
45-
? e => {
46-
e.stopPropagation()
47-
e.preventDefault()
48-
onClick?.(label)
49-
}
50-
: undefined
51-
}}
39+
value={label.value || ''}
40+
onActionClick={label.onDelete}
41+
actionIcon={showReset ? 'xmark' : undefined}
42+
onClick={() => onClick?.(label)}
5243
/>
5344
))}
5445
</div>

0 commit comments

Comments
 (0)