{
  "widgettype": "VBox",
  "options": {
    "width": "100%",
    "height": "100%",
    "padding": "20px"
  },
  "subwidgets": [
    {
      "widgettype": "HBox",
      "options": {
        "width": "100%",
        "height": "auto",
        "marginBottom": "24px"
      },
      "subwidgets": [
        {
          "widgettype": "Text",
          "options": {
            "text": "Session Chat",
            "fontSize": "24px",
            "fontWeight": "bold",
            "color": "#F8FAFC"
          }
        },
        {
          "widgettype": "Filler"
        },
        {
          "widgettype": "Button",
          "options": {
            "icon": "fa fa-arrow-left",
            "label": "Back to Sessions",
            "backgroundColor": "#1E293B",
            "color": "#F8FAFC",
            "border": "1px solid #334155",
            "borderRadius": "6px",
            "padding": "8px 16px"
          },
          "binds": [
            {
              "wid": "self",
              "event": "click",
              "actiontype": "urlwidget",
              "target": "main-content",
              "options": {
                "url": "{{entire_url('sessions.ui')}}"
              },
              "mode": "replace"
            }
          ]
        }
      ]
    },
    {
      "widgettype": "VBox",
      "options": {
        "width": "100%",
        "height": "calc(100% - 100px)",
        "backgroundColor": "#1E293B",
        "borderRadius": "8px",
        "padding": "20px",
        "border": "1px solid #334155",
        "overflow": "auto"
      },
      "subwidgets": [
        {
          "widgettype": "DataViewer",
          "id": "chat-messages",
          "options": {
            "data_url": "/hermes-web-cli/session_messages/?session_id={{params_kw.get('session_id')}}",
            "page_rows": 50,
            "row_options": {
              "fields": [
                {
                  "name": "role",
                  "label": "Role",
                  "uitype": "str"
                },
                {
                  "name": "content",
                  "label": "Message",
                  "uitype": "str"
                },
                {
                  "name": "timestamp",
                  "label": "Time",
                  "uitype": "date"
                }
              ]
            },
            "toolbar": {
              "tools": []
            }
          }
        }
      ]
    },
    {
      "widgettype": "Form",
      "options": {
        "fields": [
          {
            "name": "message",
            "label": "Your Message",
            "uitype": "text",
            "required": true,
            "placeholder": "Type your message here..."
          }
        ],
        "notoolbar": true,
        "submit_url": "/hermes-web-cli/session_messages/?session_id={{params_kw.get('session_id')}}",
        "method": "POST"
      },
      "binds": [
        {
          "wid": "self",
          "event": "submited",
          "actiontype": "script",
          "script": "bricks.show_resp_message_or_error(event.params).then(() => { document.querySelector('#chat-messages').refresh(); });"
        }
      ]
    }
  ]
}