Skip to content

Commit bc103af

Browse files
lisalupilisalupi
committed
refactor: reduce more complexities
1 parent 1e8709a commit bc103af

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

50 files changed

+1462
-1252
lines changed

‎packages/ui/src/components/Checkbox/index.tsx‎

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -99,6 +99,18 @@ export const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(
9999
)
100100
const isCheck = checked === true ? checked : false
101101

102+
const childStack =
103+
children || required ? (
104+
<Stack alignItems="center" direction="row" flex={1} gap={0.5}>
105+
{children ? styledChildren : null}
106+
{required ? (
107+
<Text as="sup" sentiment="danger" variant="body">
108+
*
109+
</Text>
110+
) : null}
111+
</Stack>
112+
) : null
113+
102114
return (
103115
<Tooltip text={tooltip}>
104116
<div
@@ -141,17 +153,7 @@ export const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(
141153
</svg>
142154
{children || required || helper || error ? (
143155
<Stack flex={1} gap={0.5}>
144-
{children || required ? (
145-
<Stack alignItems="center" direction="row" flex={1} gap={0.5}>
146-
{children ? styledChildren : null}
147-
{required ? (
148-
<Text as="sup" sentiment="danger" variant="body">
149-
*
150-
</Text>
151-
) : null}
152-
</Stack>
153-
) : null}
154-
156+
{childStack}
155157
{helper ? (
156158
<Text
157159
as="span"

‎packages/ui/src/components/DateInput/components/CalendarDaily.tsx‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -251,6 +251,8 @@ export const Daily = () => {
251251
return 'neutral'
252252
}
253253

254+
const isHightlighted = isSelected || isInHoveredRange
255+
254256
return (
255257
<Button
256258
aria-label={dayState()}
@@ -279,8 +281,8 @@ export const Daily = () => {
279281
setHoveredDate(constructedDate)
280282
}
281283
}}
282-
sentiment={isSelected || isInHoveredRange ? 'primary' : 'neutral'}
283-
variant={isSelected || isInHoveredRange ? 'filled' : 'ghost'}
284+
sentiment={isHightlighted ? 'primary' : 'neutral'}
285+
variant={isHightlighted ? 'filled' : 'ghost'}
284286
>
285287
{data.day}
286288
</Button>

‎packages/ui/src/components/DateInput/components/CalendarMonthly.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -139,6 +139,7 @@ export const Monthly = () => {
139139

140140
return 'neutral'
141141
}
142+
const isHightlighted = isSelected || isInHoveredRange
142143

143144
return (
144145
<Button
@@ -165,8 +166,8 @@ export const Monthly = () => {
165166
}
166167
}}
167168
onMouseEnter={() => setHoveredDate(constructedDate)}
168-
sentiment={isSelected || isInHoveredRange ? 'primary' : 'neutral'}
169-
variant={isSelected || isInHoveredRange ? 'filled' : 'ghost'}
169+
sentiment={isHightlighted ? 'primary' : 'neutral'}
170+
variant={isHightlighted ? 'filled' : 'ghost'}
170171
>
171172
{month[1]}
172173
</Button>

‎packages/ui/src/components/FileInput/DropzoneContent.tsx‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import { UploadIcon } from '@ultraviolet/icons/UploadIcon'
2+
import type { RefObject } from 'react'
3+
import { Text } from '../Text'
4+
import { fileInputStyle } from './styles.css'
5+
import type { FileInputProps } from './types'
6+
7+
export const DropzoneContent = ({
8+
disabled,
9+
isSmall,
10+
inputId,
11+
title,
12+
inputRef,
13+
}: {
14+
disabled?: boolean
15+
isSmall: boolean
16+
inputId: string
17+
title: FileInputProps['title']
18+
inputRef: RefObject<HTMLInputElement | null>
19+
}) => (
20+
<>
21+
<UploadIcon
22+
disabled={disabled}
23+
sentiment={isSmall ? 'neutral' : 'primary'}
24+
size={isSmall ? 'small' : 'xlarge'}
25+
/>
26+
<Text
27+
as={isSmall ? 'label' : 'div'}
28+
className={
29+
isSmall
30+
? fileInputStyle.titleSmall[disabled ? 'disabled' : 'default']
31+
: undefined
32+
}
33+
disabled={disabled}
34+
htmlFor={inputId}
35+
placement="left"
36+
sentiment="neutral"
37+
variant={isSmall ? 'bodySmallStrong' : 'headingSmallStrong'}
38+
>
39+
{typeof title === 'function' ? title(inputId, inputRef) : title}
40+
</Text>
41+
</>
42+
)

‎packages/ui/src/components/FileInput/__tests__/__snapshots__/index.test.tsx.snap‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -172,6 +172,7 @@ exports[`fileInput > renders correctly onChange 1`] = `
172172
<input
173173
class="styles__12cubgs8"
174174
id="_r_1g_"
175+
multiple=""
175176
name="label"
176177
type="file"
177178
/>
@@ -1072,6 +1073,7 @@ exports[`fileInput > renders correctly with FileInput.Button 1`] = `
10721073
<input
10731074
class="styles__12cubgs8"
10741075
id="_r_2t_"
1076+
multiple=""
10751077
name="label"
10761078
type="file"
10771079
/>
@@ -1662,6 +1664,7 @@ exports[`fileInput > renders correctly with multiple and list - empty 1`] = `
16621664
<input
16631665
class="styles__12cubgs8"
16641666
id="_r_10_"
1667+
multiple=""
16651668
name="label"
16661669
type="file"
16671670
/>
@@ -1715,6 +1718,7 @@ exports[`fileInput > renders correctly with multiple and list 1`] = `
17151718
<input
17161719
class="styles__12cubgs8"
17171720
id="_r_a_"
1721+
multiple=""
17181722
name="label"
17191723
type="file"
17201724
/>
@@ -2361,6 +2365,7 @@ exports[`fileInput > should work correctly with listLimit 1`] = `
23612365
<input
23622366
class="styles__12cubgs8"
23632367
id="_r_26_"
2368+
multiple=""
23642369
name="label"
23652370
type="file"
23662371
/>
@@ -2829,6 +2834,7 @@ exports[`fileInput > should work with function children and title 1`] = `
28292834
<input
28302835
class="styles__12cubgs8"
28312836
id="_r_3k_"
2837+
multiple=""
28322838
name="label"
28332839
type="file"
28342840
/>

‎packages/ui/src/components/FileInput/components/List.tsx‎

Lines changed: 12 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -19,30 +19,27 @@ const getIllustration = (
1919
error: boolean,
2020
loading?: boolean,
2121
) => {
22+
const state = error ? 'error' : 'default'
23+
const sentiment = error ? 'danger' : 'primary'
24+
2225
if (loading) {
2326
return (
24-
<div
25-
className={fileInputStyle.fileViewerImage[error ? 'error' : 'default']}
26-
>
27+
<div className={fileInputStyle.fileViewerImage[state]}>
2728
<Loader active sentiment="primary" size="xsmall" />
2829
</div>
2930
)
3031
}
3132
if (type === 'audio') {
3233
return (
33-
<div
34-
className={fileInputStyle.fileViewerImage[error ? 'error' : 'default']}
35-
>
36-
<AudioIcon sentiment={error ? 'danger' : 'primary'} size="medium" />
34+
<div className={fileInputStyle.fileViewerImage[state]}>
35+
<AudioIcon sentiment={sentiment} size="medium" />
3736
</div>
3837
)
3938
}
4039
if (type === 'video') {
4140
return (
42-
<div
43-
className={fileInputStyle.fileViewerImage[error ? 'error' : 'default']}
44-
>
45-
<VideoIcon sentiment={error ? 'danger' : 'primary'} size="medium" />
41+
<div className={fileInputStyle.fileViewerImage[state]}>
42+
<VideoIcon sentiment={sentiment} size="medium" />
4643
</div>
4744
)
4845
}
@@ -60,19 +57,15 @@ const getIllustration = (
6057

6158
if (type === 'image' && error) {
6259
return (
63-
<div
64-
className={fileInputStyle.fileViewerImage[error ? 'error' : 'default']}
65-
>
66-
<ImageIcon sentiment={error ? 'danger' : 'primary'} size="medium" />
60+
<div className={fileInputStyle.fileViewerImage[state]}>
61+
<ImageIcon sentiment={sentiment} size="medium" />
6762
</div>
6863
)
6964
}
7065

7166
return (
72-
<div
73-
className={fileInputStyle.fileViewerImage[error ? 'error' : 'default']}
74-
>
75-
<DocIcon sentiment={error ? 'danger' : 'primary'} size="medium" />
67+
<div className={fileInputStyle.fileViewerImage[state]}>
68+
<DocIcon sentiment={sentiment} size="medium" />
7669
</div>
7770
)
7871
}

0 commit comments

Comments
 (0)