vodorod/Dorod-Sky
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Move navigation payload to base content (#894)

Browse Source
This commit is contained in:
Kerem Yilmaz
2024-10-02 07:45:05 -07:00
committed by GitHub
parent b98a9867ed
commit 054de55b11
2 changed files with 124 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
skyvern-frontend/src/routes/tasks/create/CreateNewTaskForm.tsx
View File

@@ -87,6 +87,7 @@ function CreateNewTaskForm({ initialValues }: Props) {
const [section, setSection] = useState<"base" | "extraction" | "advanced">( const [section, setSection] = useState<"base" | "extraction" | "advanced">(
"base", "base",
); );
const [showAdvancedBaseContent, setShowAdvancedBaseContent] = useState(false);
const form = useForm<CreateNewTaskFormValues>({ const form = useForm<CreateNewTaskFormValues>({
resolver: zodResolver(createNewTaskFormSchema), resolver: zodResolver(createNewTaskFormSchema),
@@ -233,6 +234,67 @@ function CreateNewTaskForm({ initialValues }: Props) {
</FormItem> </FormItem>
)} )}
/> />
{showAdvancedBaseContent ? (
<div className="border-t border-dashed pt-4">
<FormField
control={form.control}
name="navigationPayload"
render={({ field }) => (
<FormItem>
<div className="flex gap-16">
<FormLabel>
<div className="w-72">
<h1 className="text-lg">Navigation Payload</h1>
<h2 className="text-base text-slate-400">
Specify important parameters, routes, or
states
</h2>
</div>
<Button
className="mt-4"
type="button"
variant="tertiary"
onClick={() => {
setShowAdvancedBaseContent(false);
}}
size="sm"
>
Hide Advanced Settings
</Button>
</FormLabel>
<div className="w-full">
<FormControl>
<CodeEditor
{...field}
language="json"
fontSize={12}
minHeight="96px"
value={
field.value === null ? "" : field.value
}
/>
</FormControl>
<FormMessage />
</div>
</div>
</FormItem>
)}
/>
</div>
) : (
<div>
<Button
type="button"
variant="tertiary"
onClick={() => {
setShowAdvancedBaseContent(true);
}}
size="sm"
>
Show Advanced Settings
</Button>
</div>
)}
</div> </div>
</div> </div>
)} )}
@@ -331,36 +393,6 @@ function CreateNewTaskForm({ initialValues }: Props) {
{section === "advanced" && ( {section === "advanced" && (
<div className="space-y-6"> <div className="space-y-6">
<div className="space-y-4"> <div className="space-y-4">
<FormField
control={form.control}
name="navigationPayload"
render={({ field }) => (
<FormItem>
<div className="flex gap-16">
<FormLabel>
<div className="w-72">
<h1 className="text-lg">Navigation Payload</h1>
<h2 className="text-base text-slate-400">
Specify important parameters, routes, or states
</h2>
</div>
</FormLabel>
<div className="w-full">
<FormControl>
<CodeEditor
{...field}
language="json"
fontSize={12}
minHeight="96px"
value={field.value === null ? "" : field.value}
/>
</FormControl>
<FormMessage />
</div>
</div>
</FormItem>
)}
/>
<FormField <FormField
control={form.control} control={form.control}
name="maxStepsOverride" name="maxStepsOverride"

97
skyvern-frontend/src/routes/tasks/create/SavedTaskForm.tsx
View File

@@ -138,6 +138,7 @@ function SavedTaskForm({ initialValues }: Props) {
const [section, setSection] = useState<"base" | "extraction" | "advanced">( const [section, setSection] = useState<"base" | "extraction" | "advanced">(
"base", "base",
); );
const [showAdvancedBaseContent, setShowAdvancedBaseContent] = useState(false);
const form = useForm<SavedTaskFormValues>({ const form = useForm<SavedTaskFormValues>({
resolver: zodResolver(savedTaskFormSchema), resolver: zodResolver(savedTaskFormSchema),
@@ -398,6 +399,67 @@ function SavedTaskForm({ initialValues }: Props) {
</FormItem> </FormItem>
)} )}
/> />
{showAdvancedBaseContent ? (
<div className="border-t border-dashed pt-4">
<FormField
control={form.control}
name="navigationPayload"
render={({ field }) => (
<FormItem>
<div className="flex gap-16">
<FormLabel>
<div className="w-72">
<h1 className="text-lg">Navigation Payload</h1>
<h2 className="text-base text-slate-400">
Specify important parameters, routes, or
states
</h2>
</div>
<Button
className="mt-4"
type="button"
variant="tertiary"
onClick={() => {
setShowAdvancedBaseContent(false);
}}
size="sm"
>
Hide Advanced Settings
</Button>
</FormLabel>
<div className="w-full">
<FormControl>
<CodeEditor
{...field}
language="json"
fontSize={12}
minHeight="96px"
value={
field.value === null ? "" : field.value
}
/>
</FormControl>
<FormMessage />
</div>
</div>
</FormItem>
)}
/>
</div>
) : (
<div>
<Button
type="button"
variant="tertiary"
onClick={() => {
setShowAdvancedBaseContent(true);
}}
size="sm"
>
Show Advanced Settings
</Button>
</div>
)}
</div> </div>
</div> </div>
)} )}
@@ -497,41 +559,6 @@ function SavedTaskForm({ initialValues }: Props) {
{section === "advanced" && ( {section === "advanced" && (
<div className="space-y-6"> <div className="space-y-6">
<div className="space-y-4"> <div className="space-y-4">
<FormField
control={form.control}
name="navigationPayload"
render={({ field }) => (
<FormItem>
<div className="flex gap-16">
<FormLabel>
<div className="w-72">
<h1 className="text-lg">Navigation Payload</h1>
<h2 className="text-base text-slate-400">
Specify important parameters, routes, or states
</h2>
</div>
</FormLabel>
<div className="w-full">
<FormControl>
<CodeEditor
{...field}
language="json"
fontSize={12}
minHeight="96px"
value={
field.value === null ||
typeof field.value === "undefined"
? ""
: field.value
}
/>
</FormControl>
<FormMessage />
</div>
</div>
</FormItem>
)}
/>
<FormField <FormField
control={form.control} control={form.control}
name="maxStepsOverride" name="maxStepsOverride"