[BUG] Vega visualization on nested fields

[alycesst]

I have the following index user_roles_analytics

{
  "user_roles_analytics" : {
    "mappings" : {
      "properties" : {
        "roles" : {
          "type" : "nested",
          "properties" : {
            "effective_from" : {
              "type" : "date"
            },
            "effective_until" : {
              "type" : "date"
            },
            "role_id" : {
              "type" : "keyword"
            },
            "role_name" : {
              "type" : "keyword"
            }
          }
        },
        "timestamp" : {
          "type" : "long"
        },
        "user_id" : {
          "type" : "text",
          "fields" : {
            "keyword" : {
              "type" : "keyword",
              "ignore_above" : 256
            }
          }
        },
        "username" : {
          "type" : "text",
          "fields" : {
            "keyword" : {
              "type" : "keyword",
              "ignore_above" : 256
            }
          }
        }
      }
    }
  }
}

which represents the assignment of roles to a user with the field roles being a nested field.
I am trying to create a visualization, I've noticed that the classical visualizations aren't available for the nested fields, the nested fields do not appear in the list of available fields

Online it is suggested to use vega, but I could not find a vega table visualization to display on one column the user name, and on the other the flattened role name

I am trying this, but I am getting error undefined

{
  "$schema": "https://vega.github.io/schema/vega/v5.json",
  "data": [
    {
      "name": "user_roles_analytics",
      "url": {
        "index": "user_roles_analytics",
        "body": {
          "_source": ["username", "roles.role_name"],
          "query": {
            "match_all": {}
          }
        }
      },
      "format": {
        "property": "hits.hits"
      }
    },
    {
      "name": "flattened",
      "source": "user_roles_analytics",
      "transform": [
        {
          "type": "flatten",
          "fields": ["_source.roles"]  // Flatten the roles array
        },
        {
          "type": "formula",
          "as": "row",
          "expr": "datum._id"  // Using _id as a unique row identifier
        }
      ]
    }
  ],
  "marks": [
    {
      "type": "group",
      "from": {
        "data": "flattened"
      },
      "marks": [
        {
          "type": "text",
          "encode": {
            "enter": {
              "x": { "value": 0 },  // Positioning for username column
              "y": { "field": "row" },
              "text": { "field": "_source.username" },  // Accessing username
              "fontSize": { "value": 12 },
              "align": { "value": "left" },
              "baseline": { "value": "middle" },
              "fill": { "value": "#000000" }
            }
          }
        },
        {
          "type": "text",
          "encode": {
            "enter": {
              "x": { "value": 200 },  // Positioning for role_name column
              "y": { "field": "row" },
              "text": { "field": "_source.roles.role_name" },  // Accessing role_name
              "fontSize": { "value": 12 },
              "align": { "value": "left" },
              "baseline": { "value": "middle" },
              "fill": { "value": "#000000" }
            }
          }
        }
      ]
    }
  ],
  "scales": [
    {
      "name": "x",
      "type": "band",
      "domain": ["username", "role_name"],
      "range": "width"
    },
    {
      "name": "y",
      "type": "linear",
      "domain": [0, {"signal": "length(data('flattened'))"}],  // Adjust for number of rows
      "range": "height"
    }
  ],
  "size": {
    "signal": "{width: 600, height: 400}"
  }
}

How to overpass the error?

Thanks a lot!