Skip to content

Commit fe05864

Browse files
jessicasingh7jessicasingh7
committed
lint
1 parent 74a15b2 commit fe05864

File tree

3 files changed

+82
-53
lines changed

3 files changed

+82
-53
lines changed

‎web/src/app/chat/components/input/ActionManagement.tsx‎

Lines changed: 68 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -170,8 +170,8 @@ export function ActionItem({
170170
<DisableIcon
171171
className={`transition-colors cursor-pointer ${
172172
disabled
173-
? "text-text-900 hover:text-text-500"
174-
: "text-text-500 hover:text-text-900"
173+
? "text-neutral-900 dark:text-neutral-100 hover:text-neutral-500 dark:hover:text-neutral-400"
174+
: "text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-neutral-100"
175175
}`}
176176
/>
177177
</div>
@@ -184,7 +184,7 @@ export function ActionItem({
184184
>
185185
<FiChevronRight
186186
size={16}
187-
className="transition-colors cursor-pointer text-text-500 hover:text-text-900"
187+
className="transition-colors cursor-pointer text-neutral-500 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-neutral-100"
188188
/>
189189
</div>
190190
)}
@@ -277,7 +277,9 @@ function MCPServerItem({
277277
{getServerIcon()}
278278
<span className="text-sm font-medium select-none">{server.name}</span>
279279
{isAuthenticated && tools.length > 0 && (
280-
<span className="text-xs text-text-400">({tools.length} tools)</span>
280+
<span className="text-xs text-neutral-400 dark:text-neutral-500">
281+
({tools.length} tools)
282+
</span>
281283
)}
282284
</div>
283285
{isAuthenticated && tools.length > 0 && (
@@ -868,18 +870,18 @@ export function ActionToggle({
868870
className="
869871
w-[244px]
870872
max-h-[300px]
871-
text-text-600
873+
text-neutral-600 dark:text-neutral-400
872874
text-sm
873875
p-0
874876
overflow-hidden
875877
flex
876878
flex-col
879+
bg-white dark:bg-neutral-900
880+
border border-neutral-200 dark:border-transparent
881+
shadow-lg dark:shadow-xl dark:shadow-[0_0_8px_rgba(255,255,255,0.05)]
877882
"
878883
style={{
879884
borderRadius: "var(--Radius-12, 12px)",
880-
background: "var(--Background-Neutral-00, #FFF)",
881-
boxShadow:
882-
"0 2px 8px 0 var(--Shadow-02, rgba(0, 0, 0, 0.10)), 0 0 1px 1px var(--Shadow-01, rgba(0, 0, 0, 0.05))",
883885
}}
884886
>
885887
{/* Search Input */}
@@ -904,10 +906,8 @@ export function ActionToggle({
904906
rounded-lg
905907
text-sm
906908
outline-none
907-
text-text-700
908-
placeholder:text-text-400
909-
dark:placeholder:text-neutral-600
910-
dark:bg-neutral-950
909+
text-neutral-700 dark:text-neutral-300
910+
placeholder:text-neutral-400 dark:placeholder:text-neutral-500
911911
"
912912
autoFocus
913913
/>
@@ -944,9 +944,8 @@ export function ActionToggle({
944944
rounded-lg
945945
text-sm
946946
outline-none
947-
text-text-700
948-
placeholder:text-text-400
949-
dark:placeholder:text-neutral-600
947+
text-neutral-700 dark:text-neutral-300
948+
placeholder:text-neutral-400 dark:placeholder:text-neutral-500
950949
"
951950
/>
952951
</div>
@@ -972,18 +971,29 @@ export function ActionToggle({
972971
rounded-lg
973972
text-sm
974973
outline-none
975-
text-text-700
976-
placeholder:text-text-400
977-
dark:placeholder:text-neutral-600
974+
text-neutral-700 dark:text-neutral-300
975+
placeholder:text-neutral-400 dark:placeholder:text-neutral-500
978976
cursor-pointer
979-
hover:bg-gray-50
980-
dark:hover:bg-neutral-800
981977
"
982978
/>
983979
<img
984980
src="/unplug.svg"
985981
alt="Disable All Sources"
986-
className="absolute right-3 top-1/2 transform -translate-y-1/2 w-4 h-4 pointer-events-none opacity-60"
982+
className="absolute right-3 top-1/2 transform -translate-y-1/2 w-4 h-4 pointer-events-none"
983+
style={{
984+
filter:
985+
document.documentElement.classList.contains(
986+
"dark"
987+
)
988+
? "invert(0.6) sepia(1) saturate(0) hue-rotate(0deg) brightness(1.2)"
989+
: "invert(0.4) sepia(1) saturate(0) hue-rotate(0deg) brightness(0.8)",
990+
opacity:
991+
document.documentElement.classList.contains(
992+
"dark"
993+
)
994+
? 0.9
995+
: 0.7,
996+
}}
987997
/>
988998
</div>
989999
);
@@ -1004,18 +1014,29 @@ export function ActionToggle({
10041014
rounded-lg
10051015
text-sm
10061016
outline-none
1007-
text-text-700
1008-
placeholder:text-text-400
1009-
dark:placeholder:text-neutral-600
1017+
text-neutral-700 dark:text-neutral-300
1018+
placeholder:text-neutral-400 dark:placeholder:text-neutral-500
10101019
cursor-pointer
1011-
hover:bg-gray-50
1012-
dark:hover:bg-neutral-800
10131020
"
10141021
/>
10151022
<img
10161023
src="/plug.svg"
10171024
alt="Enable All Sources"
1018-
className="absolute right-3 top-1/2 transform -translate-y-1/2 w-4 h-4 pointer-events-none opacity-60"
1025+
className="absolute right-3 top-1/2 transform -translate-y-1/2 w-4 h-4 pointer-events-none"
1026+
style={{
1027+
filter:
1028+
document.documentElement.classList.contains(
1029+
"dark"
1030+
)
1031+
? "invert(0.6) sepia(1) saturate(0) hue-rotate(0deg) brightness(1.2)"
1032+
: "invert(0.4) sepia(1) saturate(0) hue-rotate(0deg) brightness(0.8)",
1033+
opacity:
1034+
document.documentElement.classList.contains(
1035+
"dark"
1036+
)
1037+
? 0.9
1038+
: 0.7,
1039+
}}
10191040
/>
10201041
</div>
10211042
);
@@ -1054,7 +1075,7 @@ export function ActionToggle({
10541075
.map((source) => (
10551076
<div
10561077
key={source.uniqueKey}
1057-
className="flex items-center justify-between px-1 py-1 mx-1 hover:bg-background-100 rounded-lg"
1078+
className="flex items-center justify-between px-1 py-1 mx-1 rounded-lg"
10581079
>
10591080
<div className="flex items-center gap-3">
10601081
<SourceIcon
@@ -1065,8 +1086,8 @@ export function ActionToggle({
10651086
<div
10661087
className={`text-sm font-medium ${
10671088
isSourceEnabled(source.uniqueKey)
1068-
? "text-text-700"
1069-
: "text-text-400 dark:text-neutral-600"
1089+
? "text-neutral-700 dark:text-neutral-300"
1090+
: "text-neutral-400 dark:text-neutral-500"
10701091
}`}
10711092
>
10721093
{source.displayName}
@@ -1075,22 +1096,28 @@ export function ActionToggle({
10751096
</div>
10761097
<button
10771098
onClick={() => toggleSource(source.uniqueKey)}
1078-
className="relative transition-colors"
1099+
className={`relative transition-colors ${
1100+
isSourceEnabled(source.uniqueKey)
1101+
? "bg-blue-500"
1102+
: "bg-neutral-300 dark:bg-neutral-700"
1103+
}`}
10791104
style={{
10801105
width: "28px",
10811106
height: "16px",
1082-
borderRadius: "1000px",
1083-
background: isSourceEnabled(source.uniqueKey)
1084-
? "#286DF8"
1085-
: "#d1d5db",
1107+
borderRadius: "var(--Radius-Round, 1000px)",
10861108
transition: "background-color 0.2s ease-in-out",
10871109
}}
10881110
>
10891111
<div
1090-
className="w-3 h-3 absolute transition-transform duration-200 ease-in-out"
1112+
className={`absolute transition-transform duration-200 ease-in-out ${
1113+
isSourceEnabled(source.uniqueKey)
1114+
? "bg-white"
1115+
: "bg-white dark:bg-neutral-900"
1116+
}`}
10911117
style={{
1092-
borderRadius: "1000px",
1093-
background: "#FFF",
1118+
width: "12px",
1119+
height: "12px",
1120+
borderRadius: "var(--Radius-Round, 1000px)",
10941121
boxShadow: "0 0 1px 1px rgba(0, 0, 0, 0.05)",
10951122
top: "2px",
10961123
left: "2px",
@@ -1109,7 +1136,7 @@ export function ActionToggle({
11091136
.toLowerCase()
11101137
.includes(searchLower);
11111138
}).length === 0 && (
1112-
<div className="text-center py-4 text-text-400">
1139+
<div className="text-center py-4 text-neutral-400 dark:text-neutral-500">
11131140
{sourceSearchTerm
11141141
? "No matching sources found"
11151142
: "No configured sources found"}
@@ -1119,17 +1146,15 @@ export function ActionToggle({
11191146
</div>
11201147
{/* Fade mask - only when content overflows and not at bottom */}
11211148
<div
1122-
className="absolute bottom-0 left-0 right-0 h-6 pointer-events-none transition-opacity ease-out"
1149+
className="absolute bottom-0 left-0 right-0 h-6 pointer-events-none transition-opacity ease-out bg-gradient-to-t from-white to-transparent dark:from-neutral-900"
11231150
style={{
1124-
background:
1125-
"linear-gradient(180deg, transparent 0%, var(--Background-Neutral-00, #FFF) 100%)",
11261151
opacity: showFadeMask ? 1 : 0,
11271152
}}
11281153
/>
11291154
</>
11301155
) : filteredTools.length === 0 &&
11311156
filteredMCPServers.length === 0 ? (
1132-
<div className="text-center py-1 text-text-400">
1157+
<div className="text-center py-1 text-neutral-400 dark:text-neutral-500">
11331158
No matching actions found
11341159
</div>
11351160
) : (

‎web/src/components/Dropdown.tsx‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -41,14 +41,18 @@ function StandardDropdownOption<T>({
4141
return (
4242
<button
4343
onClick={() => handleSelect(option)}
44-
className={`w-full text-left block px-4 py-2.5 text-sm bg-white dark:bg-neutral-800 hover:bg-background-50 ${
45-
index !== 0 ? "border-t border-background-200" : ""
44+
className={`w-full text-left block px-4 py-2.5 text-sm bg-white dark:bg-neutral-800 hover:bg-neutral-50 dark:hover:bg-neutral-700 ${
45+
index !== 0 ? "border-t border-neutral-200 dark:border-neutral-700" : ""
4646
}`}
4747
role="menuitem"
4848
>
49-
<p className="font-medium text-xs text-text-900">{option.name}</p>
49+
<p className="font-medium text-xs text-neutral-900 dark:text-neutral-100">
50+
{option.name}
51+
</p>
5052
{option.description && (
51-
<p className="text-xs text-text-500">{option.description}</p>
53+
<p className="text-xs text-neutral-500 dark:text-neutral-400">
54+
{option.description}
55+
</p>
5256
)}
5357
</button>
5458
);
@@ -156,21 +160,21 @@ export function SearchMultiSelectDropdown({
156160
handleCustomValueSelect();
157161
}
158162
}}
159-
className="inline-flex justify-between w-full px-4 py-2 text-sm bg-white dark:bg-transparent text-text-800 border border-background-300 rounded-md shadow-sm"
163+
className="inline-flex justify-between w-full px-4 py-2 text-sm bg-white dark:bg-transparent text-neutral-800 dark:text-neutral-200 border border-neutral-200 dark:border-neutral-700 rounded-md shadow-sm"
160164
/>
161165
<button
162166
type="button"
163-
className="absolute top-0 right-0 text-sm h-full px-2 border-l border-background-300"
167+
className="absolute top-0 right-0 text-sm h-full px-2 border-l border-neutral-200 dark:border-neutral-700"
164168
aria-expanded={isOpen}
165169
aria-haspopup="true"
166170
onClick={() => setIsOpen(!isOpen)}
167171
>
168-
<ChevronDownIcon className="my-auto w-4 h-4 text-text-600" />
172+
<ChevronDownIcon className="my-auto w-4 h-4 text-neutral-600 dark:text-neutral-400" />
169173
</button>
170174
</div>
171175

172176
{isOpen && (
173-
<div className="absolute z-10 mt-1 w-full rounded-md shadow-lg bg-white border border-background-300 max-h-60 overflow-y-auto">
177+
<div className="absolute z-10 mt-1 w-full rounded-md shadow-lg bg-white dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-700 max-h-60 overflow-y-auto">
174178
<div
175179
role="menu"
176180
aria-orientation="vertical"

‎web/src/components/search/filtering/TagFilter.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -75,10 +75,10 @@ export function TagFilter({
7575
placeholder="Search tags..."
7676
value={filterValue}
7777
onChange={(e) => setFilterValue(e.target.value)}
78-
className="border border-text-subtle w-full"
78+
className="border border-neutral-200 dark:border-neutral-700 w-full"
7979
/>
8080
</div>
81-
<div className="space-y-1 border-t pt-2 border-t-text-subtle px-4 default-scrollbar w-full max-h-64 overflow-y-auto">
81+
<div className="space-y-1 border-t pt-2 border-t-neutral-200 dark:border-t-neutral-700 px-4 default-scrollbar w-full max-h-64 overflow-y-auto">
8282
{filteredTags
8383
.sort((a, b) => a.tag_key.localeCompare(b.tag_key))
8484
.map((tag, index) => (

0 commit comments

Comments
 (0)