{
  "widgettype": "VBox",
  "options": {
    "width": "100%",
    "height": "100%",
    "padding": "20px"
  },
  "subwidgets": [
    {
      "widgettype": "Text",
      "options": {
        "text": "Active Sessions",
        "fontSize": "24px",
        "fontWeight": "bold",
        "marginBottom": "20px",
        "color": "#F8FAFC"
      }
    },
    {
      "widgettype": "DataViewer",
      "options": {
        "data_url": "/hermes-web-cli/active_sessions/",
        "page_rows": 10,
        "row_options": {
          "fields": [
            {
              "name": "session_id",
              "label": "Session ID",
              "uitype": "str"
            },
            {
              "name": "session_name",
              "label": "Session Name",
              "uitype": "str"
            },
            {
              "name": "service_name",
              "label": "Service",
              "uitype": "str"
            },
            {
              "name": "message_count",
              "label": "Messages",
              "uitype": "int"
            },
            {
              "name": "created_at",
              "label": "Created",
              "uitype": "date"
            },
            {
              "name": "status",
              "label": "Status",
              "uitype": "str"
            }
          ]
        },
        "toolbar": {
          "tools": [
            {
              "name": "open_session",
              "text": "Open",
              "icon": "fa fa-folder-open"
            },
            {
              "name": "delete_session",
              "text": "Delete",
              "icon": "fa fa-trash"
            }
          ]
        }
      },
      "binds": [
        {
          "wid": "self",
          "event": "open_session",
          "actiontype": "script",
          "script": "const selectedRow = event.params; if (selectedRow) { const url = `{{entire_url('session_detail.ui')}}?session_id=${selectedRow.session_id}`; bricks.app.load_widget(url, 'main-content', 'replace'); }"
        },
        {
          "wid": "self",
          "event": "delete_session",
          "actiontype": "script",
          "script": "const selectedRow = event.params; if (selectedRow) { fetch(`/hermes-web-cli/active_sessions/?session_id=${selectedRow.session_id}`, { method: 'DELETE' }).then(() => { this.refresh(); }); }"
        }
      ]
    }
  ]
}