I can show WorkflowPlayer tab

src/components/workflows/commands.py

@@ -34,7 +34,7 @@ class WorkflowDesignerCommandManager(BaseCommandManager):
   def __init__(self, owner):
     super().__init__(owner)
   
-  def select_processor(self, component_id :str):
+  def select_processor(self, component_id: str):
     return {
         "hx_post": f"{ROUTE_ROOT}{Routes.SelectProcessor}",
         "hx-target": f"#p_{self._id}",
@@ -67,3 +67,32 @@ class WorkflowDesignerCommandManager(BaseCommandManager):
         "hx-swap": "outerHTML",
         "hx-vals": f'js:{{"_id": "{self._id}", "component_id": "{component_id}", "event_name": "{event_name}"}}',
     }
+  
+  def play_workflow(self):
+    return {
+        "hx_post": f"{ROUTE_ROOT}{Routes.PlayWorkflow}",
+        "hx-target": f"#{self._owner.tabs_manager.get_id()}",
+        "hx-swap": "outerHTML",
+        "hx-vals": f'js:{{"_id": "{self._id}", "tab_boundaries": getTabContentBoundaries("{self._owner.tabs_manager.get_id()}")}}',
+    }
+  
+  def pause_workflow(self):
+    return {
+        "hx_post": f"{ROUTE_ROOT}{Routes.PauseWorkflow}",
+        "hx-target": f"#{self._owner.tabs_manager.get_id()}",
+        "hx-swap": "outerHTML",
+        "hx-vals": f'js:{{"_id": "{self._id}", "tab_boundaries": getTabContentBoundaries("{self._owner.tabs_manager.get_id()}")}}',
+    }
+  
+  def stop_workflow(self):
+    return {
+        "hx_post": f"{ROUTE_ROOT}{Routes.StopWorkflow}",
+        "hx-target": f"#{self._owner.tabs_manager.get_id()}",
+        "hx-swap": "outerHTML",
+        "hx-vals": f'js:{{"_id": "{self._id}", "tab_boundaries": getTabContentBoundaries("{self._owner.tabs_manager.get_id()}")}}',
+    }
+
+
+class WorkflowPlayerCommandManager(BaseCommandManager):
+  def __init__(self, owner):
+    super().__init__(owner)