gridPos is not working after version 11.0.0

[mihdimitrov]

The proposed solution ( #214 ) works for me for version 10.4.0 after updating to version 11.0.0 gridPos is not working. Do you know why this solution is not working?

[Duologic]

Can you give example code? Steps to reproduce?

[mihdimitrov]

g.dashboard.new('dashboard_name')
+ g.dashboard.withDescription(|||
  dashboard_description
|||)
+ g.dashboard.graphTooltip.withSharedCrosshair()
+ g.dashboard.withVariables([
  variables.1,
  variables.2,
  variables.3,
  variables.4,
  variables.5,
  variables.6,

])

+ g.dashboard.withPanels(
  g.util.panel.resolveCollapsedFlagOnRows(
    g.util.grid.wrapPanels([
      g.panel.row.new('row_name')
      + g.panel.row.withCollapsed(false)
      + g.panel.row.withPanels([
        shared_panels.stat.baseStatWithShortName('name', queries.name) + { gridPos: { h: 4, w: 2, x: 0, y: 0 } },
        shared_panels.stat.baseStatWithShortName('name 2', queries.name2) + { gridPos: { h: 4, w: 2, x: 2, y: 0 } },
        shared_panels.stat.baseStatWithShortName('name3', queries.name3) + { gridPos: { h: 4, w: 2, x: 4, y: 0 } },
        shared_panels.stat.baseStatWithShortName('name4', queries.name4) + { gridPos: { h: 4, w: 2, x: 6, y: 0 } },
        shared_panels.stat.baseStatWithShortName('name5', queries.name5) + { gridPos: { h: 4, w: 2, x: 8, y: 0 } },
        shared_panels.timeSeries.Name_timeseries('name6', queries.name6) + { gridPos: { h: 4, w: 2, x: 10, y: 0 } },
        panels.stat.namestat('name7', queries.name7) + { gridPos: { h: 4, w: 2, x: 12, y: 0 } },
        panels.timeSeries.Name_timeseries('name8', queries.name8) + { gridPos: { h: 4, w: 10, x: 14, y: 0 } },
        panels.stat.namestat('name9', queries.name9) + { gridPos: { h: 3, w: 2, x: 0, y: 4 } },
        panels.stat.namestat('name11', queries.name11) + { gridPos: { h: 3, w: 2, x: 2, y: 4 } },
        panels.stat.namestat('name12', queries.name12) + { gridPos: { h: 3, w: 2, x: 0, y: 7 } },
        panels.stat.namestat('name13', queries.name13) + { gridPos: { h: 3, w: 2, x: 2, y: 7 } },
        panels.barGauge.name_barGauge('name14', queries.name14) + { gridPos: { h: 6, w: 4, x: 4, y: 4 } },
        panels.timeSeries.Name_timeseries('name15', queries.name15) + { gridPos: { h: 6, w: 10, x: 8, y: 4 } },
        panels.timeSeries.Name_timeseries('name16', queries.name16) + { gridPos: { h: 6, w: 6, x: 18, y: 4 } },
        panels.timeSeries.Name_timeseries('name17', queries.name17) + { gridPos: { h: 8, w: 8, x: 0, y: 10 } },
        panels.timeSeries.Name_timeseries('name18', queries.name18) + { gridPos: { h: 8, w: 8, x: 8, y: 10 } },
        panels.timeSeries.Name_timeseries('name19', queries.name19) + { gridPos: { h: 8, w: 8, x: 16, y: 10 } },
        panels.timeSeries.Name_timeseries('name20', queries.name20) + { gridPos: { h: 8, w: 8, x: 0, y: 18 } },
        panels.timeSeries.Name_timeseries('name21', queries.name21) + { gridPos: { h: 8, w: 8, x: 8, y: 18 } },
        panels.timeSeries.Name_timeseries('name22', queries.name22) + { description: 'description' } + { gridPos: { h: 8, w: 8, x: 16, y: 18 } },
      ]),
    ],)
  )
)

[Duologic]

This is not sufficient for me to reproduce this. Can you reduce it to a minimally reproducible example?

[mihdimitrov]

g.dashboard.new('dashboard_name')

• g.dashboard.withDescription(|||
  dashboard_description
  |||)
• g.dashboard.graphTooltip.withSharedCrosshair()
• g.dashboard.withVariables([
  variables.1,
  variables.2,
  variables.3,
  variables.4,
  variables.5,
  variables.6,

])

• g.dashboard.withPanels(
  g.util.panel.resolveCollapsedFlagOnRows(
  g.util.grid.wrapPanels([
  g.panel.row.new('row_name')
  + g.panel.row.withCollapsed(false)
  + g.panel.row.withPanels([

    shared_panels.stat.baseStatWithShortName('name', queries.name) + { gridPos: { h: 4, w: 18, x: 0, y: 0 } } + { description: '1' } 
    shared_panels.stat.baseStatWithShortName('name', queries.name) + { gridPos: { h: 2, w: 2, x: 18, y: 0 } } + { description: '2' } 
    shared_panels.stat.baseStatWithShortName('name', queries.name) + { gridPos: { h: 2, w: 2, x: 18, y: 2 } } + { description: '3' } 
    shared_panels.stat.baseStatWithShortName('name', queries.name) + { gridPos: { h: 2, w: 4, x: 20, y: 0 } } + { description: '4' } 
    shared_panels.stat.baseStatWithShortName('name', queries.name) + { gridPos: { h: 2, w: 2, x: 20, y: 2 } } + { description: '5' } 
    shared_panels.stat.baseStatWithShortName('name', queries.name) + { gridPos: { h: 2, w: 2, x: 22, y: 2 } } + { description: '6' } 
  

[Duologic]

I can't run this example on my system, I don't have shared_panels. Perhaps you have a repository that has a fully functional example?

[mihdimitrov]

You may pick gridPos and to use it for every dashboard and will see that after version 11.0.0 is not working
{ gridPos: { h: 4, w: 18, x: 0, y: 0 } } + { description: '1' }
{ gridPos: { h: 2, w: 2, x: 18, y: 0 } } + { description: '2' }
{ gridPos: { h: 2, w: 2, x: 18, y: 2 } } + { description: '3' }
{ gridPos: { h: 2, w: 4, x: 20, y: 0 } } + { description: '4' }
{ gridPos: { h: 2, w: 2, x: 20, y: 2 } } + { description: '5' }
{ gridPos: { h: 2, w: 2, x: 22, y: 2 } } + { description: '6' }

[Duologic]

That seems to work: https://jsonnet-libs.github.io/playground/?code=Wwp7IGdyaWRQb3M6IHsgaDogNCwgdzogMTgsIHg6IDAsIHk6IDAgfSB9ICsgeyBkZXNjcmlwdGlvbjogJzEnIH0sCnsgZ3JpZFBvczogeyBoOiAyLCB3OiAyLCB4OiAxOCwgeTogMCB9IH0gKyB7IGRlc2NyaXB0aW9uOiAnMicgfSwKeyBncmlkUG9zOiB7IGg6IDIsIHc6IDIsIHg6IDE4LCB5OiAyIH0gfSArIHsgZGVzY3JpcHRpb246ICczJyB9LAp7IGdyaWRQb3M6IHsgaDogMiwgdzogNCwgeDogMjAsIHk6IDAgfSB9ICsgeyBkZXNjcmlwdGlvbjogJzQnIH0sCnsgZ3JpZFBvczogeyBoOiAyLCB3OiAyLCB4OiAyMCwgeTogMiB9IH0gKyB7IGRlc2NyaXB0aW9uOiAnNScgfSwKeyBncmlkUG9zOiB7IGg6IDIsIHc6IDIsIHg6IDIyLCB5OiAyIH0gfSArIHsgZGVzY3JpcHRpb246ICc2JyB9LApd