Add new diagnostic tabs #538
Conversation
…src/' <!-- ELLIPSIS_HIDDEN --> | 🚀 | This description was created by [Ellipsis](https://www.ellipsis.dev) for commit 2e6fb7a31a98c249461b08048404df3b16f63806 | |--------|--------| ### Summary: Adds new diagnostic tabs for 'HTML Element Tree' and 'LLM Request (Raw)' in `StepArtifacts` component, handling new artifact types and updating UI accordingly. **Key points**: - **File Modified**: `skyvern-frontend/src/routes/tasks/detail/StepArtifacts.tsx` - **Component Modified**: `StepArtifacts` - **New Tabs Added**: 'HTML Element Tree' and 'LLM Request (Raw)' - **New Artifact Types Handled**: `ArtifactType.VisibleElementsTree` and `ArtifactType.LLMRequest` - **UI Changes**: Updated `TabsList` to include new tabs and `TabsContent` to display corresponding content if artifacts are present. ---- Generated with ❤️ by [ellipsis.dev](https://www.ellipsis.dev) <!-- ELLIPSIS_HIDDEN -->
![ellipsis-dev[bot]](https://avatars.githubusercontent.com/in/64358?s=60&v=4){kind=small}
There was a problem hiding this comment.
❌ Changes requested. Reviewed everything up to 39ae778 in 47 seconds
More details
- Looked at
60lines of code in1files - Skipped
0files when reviewing. - Skipped posting
0drafted comments based on config settings.
Workflow ID: wflow_0zlpgkSzvjCSQ5Uo
Want Ellipsis to fix these issues? Tag @ellipsis-dev in a comment. You can customize Ellipsis with 👍 / 👎 feedback, review rules, user-specific overrides, quiet mode, and more.
| @@ -72,14 +80,16 @@ function StepArtifacts({ id, stepProps }: Props) { | |||
|
|
|||
| return ( | |||
| <Tabs defaultValue="info" className="w-full"> | |||
| <TabsList className="grid w-full h-16 grid-cols-4"> | |||
| <TabsList className="grid w-full h-16 grid-cols-5"> | |||
There was a problem hiding this comment.
The grid layout specified as grid-cols-5 does not match the number of TabsTrigger components (8). This will cause layout issues. Consider adjusting the grid columns to match the number of tabs or using a more responsive grid setup.
| <TabsList className="grid w-full h-16 grid-cols-5"> | |
| <TabsList className="grid w-full h-16 grid-cols-8"> |
There was a problem hiding this comment.
Well this is the worst suggestion ellipsis has given lol
There was a problem hiding this comment.
Whoops - sorry about that, thanks for leaving a 👎
There was a problem hiding this comment.
❌ Changes requested. Incremental review on 39ae778 in 55 seconds
More details
- Looked at
59lines of code in1files - Skipped
0files when reviewing. - Skipped posting
0drafted comments based on config settings.
Workflow ID: wflow_WgM7MxQ953iFa6cM
Want Ellipsis to fix these issues? Tag @ellipsis-dev in a comment. You can customize Ellipsis with 👍 / 👎 feedback, review rules, user-specific overrides, quiet mode, and more.
| @@ -72,14 +80,16 @@ function StepArtifacts({ id, stepProps }: Props) { | |||
|
|
|||
| return ( | |||
| <Tabs defaultValue="info" className="w-full"> | |||
| <TabsList className="grid w-full h-16 grid-cols-4"> | |||
| <TabsList className="grid w-full h-16 grid-cols-5"> | |||
There was a problem hiding this comment.
The grid layout for TabsList is set to 5 columns, but there are 9 tabs defined. This will cause layout issues. Consider adjusting the grid layout to accommodate all tabs properly.
| <TabsList className="grid w-full h-16 grid-cols-5"> | |
| <TabsList className="grid w-full h-16 grid-cols-9"> |
Summary:
Adds new diagnostic tabs for 'HTML Element Tree' and 'LLM Request (Raw)' in
StepArtifactscomponent, handling new artifact types and updating UI accordingly.Key points:
skyvern-frontend/src/routes/tasks/detail/StepArtifacts.tsxStepArtifactsArtifactType.VisibleElementsTreeandArtifactType.LLMRequestTabsListto include new tabs andTabsContentto display corresponding content if artifacts are present.Generated with ❤️ by ellipsis.dev