Merge pull request #142 from melnikga/chore/trace-control-buttons

chore: Execution trace control buttons disabled state - Issue #141
walnuthq · Apr 11, 2024 · a2ac75b · a2ac75b
2 parents 7272b2d + 4be683e
commit a2ac75b
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 0 deletions.
diff --git a/components/Tracer/ExecutionStatus.tsx b/components/Tracer/ExecutionStatus.tsx
@@ -6,15 +6,20 @@ import {
 import { Priority, useRegisterActions } from 'kbar'
 
 import { Button } from 'components/ui'
+import { TraceEntry } from '.'
 
 const ExecutionStatus = ({
   onStepIn,
   onStepOut,
   onContinueExecution,
+  trace,
+  executionTraceStepNumber,
 }: {
   onStepIn: () => void
   onStepOut: () => void
   onContinueExecution: () => void
+  trace: TraceEntry[] | undefined
+  executionTraceStepNumber: number
 }) => {
   const actions = [
     {
@@ -72,6 +77,7 @@ const ExecutionStatus = ({
           padded={false}
           tooltip="Step back [b]"
           tooltipId="step1"
+          disabled={executionTraceStepNumber === 0}
         >
           <RiArrowGoBackLine size={16} className="text-indigo-500" />
         </Button>
@@ -81,6 +87,7 @@ const ExecutionStatus = ({
           padded={false}
           tooltip="Step next [n]"
           tooltipId="step2"
+          disabled={executionTraceStepNumber + 1 === trace?.length || !trace}
         >
           <RiArrowGoForwardLine size={16} className="text-indigo-500" />
         </Button>
@@ -90,6 +97,7 @@ const ExecutionStatus = ({
           padded={false}
           tooltip="Continue execution [c]"
           tooltipId="continue-execution"
+          disabled={executionTraceStepNumber + 1 === trace?.length || !trace}
         >
           <RiPlayCircleLine size={16} className="text-indigo-500" />
         </Button>

diff --git a/components/Tracer/index.tsx b/components/Tracer/index.tsx
@@ -190,6 +190,8 @@ export const Tracer = () => {
           onStepIn={stepIn}
           onStepOut={stepOut}
           onContinueExecution={continueExecution}
+          trace={trace}
+          executionTraceStepNumber={executionTraceStepNumber}
         />
       </div>