From 7bf579325bc111d0084e62bebd8d6883f1aef9e2 Mon Sep 17 00:00:00 2001
From: Shuchang Zheng <shu@skyvern.com>
Date: Thu, 12 Dec 2024 14:03:24 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=84=20synced=20local=20'skyvern-fronte?=
 =?UTF-8?q?nd/src/'=20with=20remote=20'skyvern-frontend/src/'?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

<!-- ELLIPSIS_HIDDEN -->

> [!IMPORTANT]
> Add tooltips to `ActionNode.tsx` and `NavigationNode.tsx` to provide execution guidance.
>
>   - **UI Enhancements**:
>     - Added tooltips to `ActionNode.tsx` and `NavigationNode.tsx`.
>     - `ActionNode.tsx`: Tooltip explains that only one action is taken during execution.
>     - `NavigationNode.tsx`: Tooltip explains that multiple actions are taken to achieve a single goal.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis" src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=Skyvern-AI%2Fskyvern-cloud&utm_source=github&utm_medium=referral)<sup> for bb541e45e4b46a103484dc6f8ebd2cac1a256599. It will automatically update as commits are pushed.</sup>

<!-- ELLIPSIS_HIDDEN -->
---
 .../workflows/editor/nodes/ActionNode/ActionNode.tsx      | 6 ++++++
 .../editor/nodes/NavigationNode/NavigationNode.tsx        | 8 +++++++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/skyvern-frontend/src/routes/workflows/editor/nodes/ActionNode/ActionNode.tsx b/skyvern-frontend/src/routes/workflows/editor/nodes/ActionNode/ActionNode.tsx
index a2a6c0e36..53c148abd 100644
--- a/skyvern-frontend/src/routes/workflows/editor/nodes/ActionNode/ActionNode.tsx
+++ b/skyvern-frontend/src/routes/workflows/editor/nodes/ActionNode/ActionNode.tsx
@@ -143,6 +143,12 @@ function ActionNode({ id, data }: NodeProps<ActionNode>) {
               className="nopan text-xs"
             />
           </div>
+          <div className="rounded-md bg-slate-800 p-2">
+            <div className="space-y-1 text-xs text-slate-400">
+              Tip: While executing the action block, Skyvern will only take one
+              action.
+            </div>
+          </div>
         </div>
         <Separator />
         <Accordion type="single" collapsible>
diff --git a/skyvern-frontend/src/routes/workflows/editor/nodes/NavigationNode/NavigationNode.tsx b/skyvern-frontend/src/routes/workflows/editor/nodes/NavigationNode/NavigationNode.tsx
index 84d382fbe..0a8c71a9e 100644
--- a/skyvern-frontend/src/routes/workflows/editor/nodes/NavigationNode/NavigationNode.tsx
+++ b/skyvern-frontend/src/routes/workflows/editor/nodes/NavigationNode/NavigationNode.tsx
@@ -96,7 +96,7 @@ function NavigationNode({ id, data }: NodeProps<NavigationNode>) {
             }}
           />
         </header>
-        <div className="space-y-2">
+        <div className="space-y-4">
           <div className="space-y-2">
             <div className="flex gap-2">
               <Label className="text-xs text-slate-300">URL</Label>
@@ -129,6 +129,12 @@ function NavigationNode({ id, data }: NodeProps<NavigationNode>) {
               className="nopan text-xs"
             />
           </div>
+          <div className="rounded-md bg-slate-800 p-2">
+            <div className="space-y-1 text-xs text-slate-400">
+              Tip: While executing the navigation block, Skyvern will take
+              multiple actions to accomplish a single goal.
+            </div>
+          </div>
         </div>
         <Separator />
         <Accordion type="single" collapsible>