Skip to content

Commit d7a2760

Browse files
j-sanaaj-sanaa
committed
Fix gemini comments
1 parent 7513b0e commit d7a2760

6 files changed

Lines changed: 43 additions & 27 deletions

File tree

‎packages/agentflow/src/atoms/Dropdown.tsx‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import { useState } from 'react'
1+
import { useEffect, useState } from 'react'
22

33
import { Box, FormControl, Popper, TextField, Typography } from '@mui/material'
44
import Autocomplete, { autocompleteClasses } from '@mui/material/Autocomplete'
5-
import { styled, useTheme } from '@mui/material/styles'
5+
import { alpha, styled, useTheme } from '@mui/material/styles'
66

77
const StyledPopper = styled(Popper)({
88
boxShadow: '0px 8px 10px -5px rgb(0 0 0 / 20%), 0px 16px 24px 2px rgb(0 0 0 / 14%), 0px 6px 30px 5px rgb(0 0 0 / 12%)',
@@ -49,10 +49,13 @@ export function Dropdown({
4949
disableClearable = false
5050
}: DropdownProps) {
5151
const theme = useTheme()
52-
const isDarkMode = theme.palette.mode === 'dark'
5352

5453
const [internalValue, setInternalValue] = useState(value ?? 'choose an option')
5554

55+
useEffect(() => {
56+
setInternalValue(value ?? 'choose an option')
57+
}, [value])
58+
5659
const findMatchingOption = (val: string) => options.find((option) => option.name === val) ?? null
5760

5861
return (
@@ -79,13 +82,12 @@ export function Dropdown({
7982
return (
8083
<TextField
8184
{...params}
82-
value={internalValue}
8385
sx={{
8486
height: '100%',
8587
'& .MuiInputBase-root': {
8688
height: '100%',
8789
'& fieldset': {
88-
borderColor: theme.palette.grey[900] + '25'
90+
borderColor: alpha(theme.palette.grey[900], 0.25)
8991
}
9092
}
9193
}}
@@ -124,7 +126,7 @@ export function Dropdown({
124126
<div style={{ display: 'flex', flexDirection: 'column' }}>
125127
<Typography variant='h5'>{option.label}</Typography>
126128
{option.description && (
127-
<Typography sx={{ color: isDarkMode ? '#9e9e9e' : '' }}>{option.description}</Typography>
129+
<Typography sx={{ color: theme.palette.text.secondary }}>{option.description}</Typography>
128130
)}
129131
</div>
130132
</Box>

‎packages/agentflow/src/atoms/NodeInputHandler.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -411,7 +411,7 @@ export function NodeInputHandler({
411411
<Box sx={{ p: 2 }}>
412412
<Typography>
413413
{inputAnchor.label}
414-
{!inputAnchor.optional && <span style={{ color: 'red' }}>&nbsp;*</span>}
414+
{!inputAnchor.optional && <span style={{ color: theme.palette.error.main }}>&nbsp;*</span>}
415415
</Typography>
416416
</Box>
417417
</>
@@ -439,7 +439,7 @@ export function NodeInputHandler({
439439
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
440440
<Typography>
441441
{inputParam?.label}
442-
{!inputParam?.optional && <span style={{ color: 'red' }}>&nbsp;*</span>}
442+
{!inputParam?.optional && <span style={{ color: theme.palette.error.main }}>&nbsp;*</span>}
443443
{inputParam?.description && <TooltipWithParser title={inputParam.description} />}
444444
</Typography>
445445
<div style={{ flexGrow: 1 }} />
@@ -451,7 +451,7 @@ export function NodeInputHandler({
451451
disabled={disabled}
452452
onClick={(e) => setVariableAnchorEl(e.currentTarget)}
453453
>
454-
<IconVariable size={20} style={{ color: 'teal' }} />
454+
<IconVariable size={20} style={{ color: theme.palette.info.main }} />
455455
</IconButton>
456456
</Tooltip>
457457
)}

‎packages/agentflow/src/atoms/ScenariosInput.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -80,7 +80,7 @@ export function ScenariosInput({ inputParam, data, disabled = false, onDataChang
8080
<Box sx={{ p: 2 }}>
8181
<Typography>
8282
{inputParam.label}
83-
{!inputParam.optional && <span style={{ color: 'red' }}>&nbsp;*</span>}
83+
{!inputParam.optional && <span style={{ color: theme.palette.error.main }}>&nbsp;*</span>}
8484
{inputParam.description && <TooltipWithParser title={inputParam.description} />}
8585
</Typography>
8686

‎packages/agentflow/src/atoms/StructuredOutputBuilder.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { useCallback, useMemo, useState } from 'react'
22

33
import { Box, Button, Chip, IconButton, MenuItem, Select, TextField, Typography } from '@mui/material'
4-
import { useTheme } from '@mui/material/styles'
4+
import { alpha, useTheme } from '@mui/material/styles'
55
import { IconArrowsMaximize, IconPlus, IconTrash } from '@tabler/icons-react'
66

77
import { ExpandTextDialog } from '@/atoms'
@@ -103,7 +103,7 @@ export function StructuredOutputBuilder({ inputParam, data, disabled = false, on
103103
mt: 2,
104104
mb: 1,
105105
border: 1,
106-
borderColor: theme.palette.grey[900] + 25,
106+
borderColor: alpha(theme.palette.grey[900], 0.25),
107107
borderRadius: 2,
108108
position: 'relative'
109109
}}
@@ -120,7 +120,7 @@ export function StructuredOutputBuilder({ inputParam, data, disabled = false, on
120120
width: '35px',
121121
right: 10,
122122
top: 10,
123-
'&:hover': { color: 'red' }
123+
'&:hover': { color: theme.palette.error.main }
124124
}}
125125
>
126126
<IconTrash />
@@ -135,7 +135,7 @@ export function StructuredOutputBuilder({ inputParam, data, disabled = false, on
135135
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
136136
<Typography>
137137
Key
138-
<span style={{ color: 'red' }}>&nbsp;*</span>
138+
<span style={{ color: theme.palette.error.main }}>&nbsp;*</span>
139139
</Typography>
140140
</div>
141141
<TextField
@@ -154,7 +154,7 @@ export function StructuredOutputBuilder({ inputParam, data, disabled = false, on
154154
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
155155
<Typography>
156156
Type
157-
<span style={{ color: 'red' }}>&nbsp;*</span>
157+
<span style={{ color: theme.palette.error.main }}>&nbsp;*</span>
158158
</Typography>
159159
</div>
160160
<Select
@@ -227,7 +227,7 @@ export function StructuredOutputBuilder({ inputParam, data, disabled = false, on
227227
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
228228
<Typography>
229229
Description
230-
<span style={{ color: 'red' }}>&nbsp;*</span>
230+
<span style={{ color: theme.palette.error.main }}>&nbsp;*</span>
231231
</Typography>
232232
</div>
233233
<TextField

‎packages/agentflow/src/features/node-editor/ConfigInput.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { type ComponentType, useCallback, useEffect, useMemo, useRef, useState }
22

33
import ExpandMoreIcon from '@mui/icons-material/ExpandMore'
44
import { Accordion, AccordionDetails, AccordionSummary, Box, Typography } from '@mui/material'
5-
import { useTheme } from '@mui/material/styles'
5+
import { alpha, useTheme } from '@mui/material/styles'
66
import { IconSettings } from '@tabler/icons-react'
77

88
import { type AsyncInputProps, NodeInputHandler } from '@/atoms'
@@ -196,7 +196,7 @@ export function ConfigInput({
196196
mt: 1,
197197
mb: 1,
198198
border: 1,
199-
borderColor: theme.palette.grey[900] + 25,
199+
borderColor: alpha(theme.palette.grey[900], 0.25),
200200
borderRadius: 2
201201
}}
202202
>

‎packages/agentflow/src/features/node-editor/CreateCredentialDialog.tsx‎

Lines changed: 23 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import {
1313
OutlinedInput,
1414
Typography
1515
} from '@mui/material'
16+
import { useTheme } from '@mui/material/styles'
1617
import { IconAlertTriangle, IconArrowsMaximize } from '@tabler/icons-react'
1718
import parser from 'html-react-parser'
1819

@@ -37,6 +38,7 @@ export interface CreateCredentialDialogProps {
3738
*/
3839
export function CreateCredentialDialog({ open, credentialNames, onClose, onCreated }: CreateCredentialDialogProps) {
3940
const { credentialsApi, apiBaseUrl } = useApiContext()
41+
const theme = useTheme()
4042

4143
const [schemas, setSchemas] = useState<ComponentCredentialSchema[]>([])
4244
const [selectedSchema, setSelectedSchema] = useState<ComponentCredentialSchema | null>(null)
@@ -122,10 +124,21 @@ export function CreateCredentialDialog({ open, credentialNames, onClose, onCreat
122124
setError(null)
123125

124126
try {
127+
const plainDataObj: Record<string, unknown> = {}
128+
for (const key of Object.keys(formValues)) {
129+
const input = selectedSchema.inputs?.find((i) => i.name === key)
130+
const val = formValues[key]
131+
if (input?.type === 'number' && typeof val === 'string' && val) {
132+
plainDataObj[key] = Number(val)
133+
} else {
134+
plainDataObj[key] = val
135+
}
136+
}
137+
125138
const result = await credentialsApi.createCredential({
126139
name: credentialName.trim(),
127140
credentialName: selectedSchema.name,
128-
plainDataObj: formValues
141+
plainDataObj
129142
})
130143
onCreated(result.id)
131144
} catch (err) {
@@ -153,7 +166,7 @@ export function CreateCredentialDialog({ open, credentialNames, onClose, onCreat
153166
height: 50,
154167
marginRight: 10,
155168
borderRadius: '50%',
156-
backgroundColor: 'white'
169+
backgroundColor: theme.palette.common.white
157170
}}
158171
>
159172
<img
@@ -211,21 +224,21 @@ export function CreateCredentialDialog({ open, credentialNames, onClose, onCreat
211224
display: 'flex',
212225
flexDirection: 'row',
213226
borderRadius: 10,
214-
background: 'rgb(254,252,191)',
227+
background: theme.palette.warning.light,
215228
padding: 10,
216229
marginTop: 10,
217230
marginBottom: 10
218231
}}
219232
>
220-
<span style={{ color: 'rgb(116,66,16)' }}>{parser(selectedSchema.description)}</span>
233+
<span style={{ color: theme.palette.warning.dark }}>{parser(selectedSchema.description)}</span>
221234
</div>
222235
</Box>
223236
)}
224237

225238
<Box sx={{ p: 2 }}>
226239
<Typography variant='overline'>
227240
Credential Name
228-
<span style={{ color: 'red' }}>&nbsp;*</span>
241+
<span style={{ color: theme.palette.error.main }}>&nbsp;*</span>
229242
</Typography>
230243
<OutlinedInput
231244
fullWidth
@@ -276,6 +289,7 @@ interface CredentialFieldProps {
276289
}
277290

278291
function CredentialField({ input, value, onChange, disabled = false }: CredentialFieldProps) {
292+
const theme = useTheme()
279293
const [expandOpen, setExpandOpen] = useState(false)
280294
const showExpand = input.type === 'string' && !!input.rows
281295

@@ -285,7 +299,7 @@ function CredentialField({ input, value, onChange, disabled = false }: Credentia
285299
<div style={{ display: 'flex', flexDirection: 'row' }}>
286300
<Typography>
287301
{input.label}
288-
{!input.optional && <span style={{ color: 'red' }}>&nbsp;*</span>}
302+
{!input.optional && <span style={{ color: theme.palette.error.main }}>&nbsp;*</span>}
289303
{input.description && <TooltipWithParser title={input.description} />}
290304
</Typography>
291305
<div style={{ flexGrow: 1 }} />
@@ -309,14 +323,14 @@ function CredentialField({ input, value, onChange, disabled = false }: Credentia
309323
display: 'flex',
310324
flexDirection: 'row',
311325
borderRadius: 10,
312-
background: 'rgb(254,252,191)',
326+
background: theme.palette.warning.light,
313327
padding: 10,
314328
marginTop: 10,
315329
marginBottom: 10
316330
}}
317331
>
318-
<IconAlertTriangle size={36} color='orange' />
319-
<span style={{ color: 'rgb(116,66,16)', marginLeft: 10 }}>{input.warning}</span>
332+
<IconAlertTriangle size={36} color={theme.palette.warning.main} />
333+
<span style={{ color: theme.palette.warning.dark, marginLeft: 10 }}>{input.warning}</span>
320334
</div>
321335
)}
322336

0 commit comments

Comments
 (0)