I can show WorkflowPlayer tab

src/components/workflows/components/WorkflowDesigner.py

@@ -5,11 +5,14 @@ from fasthtml.components import *
 from fasthtml.xtend import Script
 
 from components.BaseComponent import BaseComponent
+from components.workflows.assets.icons import icon_play, icon_pause, icon_stop
 from components.workflows.commands import WorkflowDesignerCommandManager
+from components.workflows.components.WorkflowPlayer import WorkflowPlayer
 from components.workflows.constants import WORKFLOW_DESIGNER_INSTANCE_ID, ProcessorTypes
 from components.workflows.db_management import WorkflowsDesignerSettings, WorkflowComponent, \
-  Connection, WorkflowsDesignerDbManager
-from components_helpers import apply_boundaries, mk_tooltip, mk_dialog_buttons
+  Connection, WorkflowsDesignerDbManager, WorkflowsPlayerSettings
+from components_helpers import apply_boundaries, mk_tooltip, mk_dialog_buttons, mk_icon
+from core.instance_manager import InstanceManager
 from core.utils import get_unique_id, make_safe_id
 from utils.DbManagementHelper import DbManagementHelper
 
@@ -47,11 +50,13 @@ class WorkflowDesigner(BaseComponent):
   def __init__(self, session,
                _id=None,
                settings_manager=None,
+               tabs_manager=None,
                key: str = None,
                designer_settings: WorkflowsDesignerSettings = None,
                boundaries: dict = None):
     super().__init__(session, _id)
     self._settings_manager = settings_manager
+    self.tabs_manager = tabs_manager
     self._key = key
     self._designer_settings = designer_settings
     self._db = WorkflowsDesignerDbManager(session, settings_manager)
@@ -169,6 +174,23 @@ class WorkflowDesigner(BaseComponent):
     self._db.save_state(self._key, self._state)
     return self.refresh_properties()
   
+  def play_workflow(self, boundaries: dict):
+    if self._state.selected_component_id is None:
+      return self.error_message("No component selected")
+    
+    workflow_name = self._designer_settings.workflow_name
+    player = InstanceManager.get(self._session,
+                                 WorkflowPlayer.create_component_id(self._session, workflow_name),
+                                 WorkflowPlayer,
+                                 settings_manager=self._settings_manager,
+                                 tabs_manager=self.tabs_manager,
+                                 player_settings=WorkflowsPlayerSettings(workflow_name),
+                                 boundaries=boundaries)
+    
+    self.tabs_manager.add_tab(f"Workflow {workflow_name}", player, player.key)
+    # player.start(self._state.selected_component_id)
+    return self.tabs_manager.refresh()
+  
   def on_processor_details_event(self, component_id: str, event_name: str, details: dict):
     if component_id in self._state.components:
       component = self._state.components[component_id]
@@ -183,6 +205,7 @@ class WorkflowDesigner(BaseComponent):
     return Div(
       H1(f"{self._designer_settings.workflow_name}", cls="text-xl font-bold"),
       P("Drag components from the toolbox to the canvas to create your workflow.", cls="text-sm mb-6"),
+      self._mk_media(),
       self._mk_designer(),
       Div(cls="wkf-splitter", id=f"s_{self._id}"),
       self._mk_properties(),
@@ -259,6 +282,14 @@ class WorkflowDesigner(BaseComponent):
       style=f"height:{self._state.designer_height}px;"
     )
   
+  def _mk_media(self):
+    return Div(
+      mk_icon(icon_play, cls="mr-1", **self.commands.play_workflow()),
+      mk_icon(icon_pause, cls="mr-1", **self.commands.play_workflow()),
+      mk_icon(icon_stop, cls="mr-1", **self.commands.play_workflow()),
+      cls=f"media-controls flex m-2"
+    )
+  
   def _mk_processor_properties(self, component, processor_name):
     if processor_name == "Jira":
       return self._mk_jira_processor_details(component)