-
Notifications
You must be signed in to change notification settings - Fork 24
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Restructure the dashboards to leverage
mosaicLayout (#18)
This layout is more cumbersome because of the requirement to explicitly lay things out, however, this change introduces a number of helper modules to make this a bit more tolerable. At a high-level, "sections" (our own intermediate concept) produce groupings of tiles laid out relative to `(0, 0)` with a width of `module.width.size` (see below). The modules in `./dashboard/sections` group our "widgets" into arrangements of "tiles" (e.g. logs, http, resources) with several special helper modules: 1. `width`: This module exists to define a global constant for the dashboard width, 1. `collapsible`: This wraps a list of tiles in a "collapsible" region with a title (it automagically figures out the bounding box, to avoid human error here), 1. `layout`: This takes a list of "sections" (defined above) and rebases them so that the `yPos` of each section starts after the preceding section. This also incorporates a change to give our networking module's DNS constructs unique names, so that we can provision multiple distinct private networks (I hit this creating a small example to test with, and it conflicted with my dev environment). Signed-off-by: Matt Moore <[email protected]>
- Loading branch information
Showing
12 changed files
with
328 additions
and
146 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,24 @@ | ||
| variable "title" { type = string } | ||
| variable "tiles" {} | ||
| variable "collapsed" { default = false } | ||
|
|
||
| locals { | ||
| start_row = min([for s in var.tiles : s.yPos]...) | ||
| } | ||
|
|
||
| module "width" { source = "../width" } | ||
|
|
||
| output "section" { | ||
| value = concat([{ | ||
| yPos = local.start_row | ||
| xPos = 0, | ||
| height = max([for s in var.tiles : s.yPos + s.height - local.start_row]...), | ||
| width = module.width.size, | ||
| widget = { | ||
| title = var.title | ||
| collapsibleGroup = { | ||
| collapsed = var.collapsed | ||
| } | ||
| }, | ||
| }], var.tiles) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,60 @@ | ||
| variable "title" { type = string } | ||
| variable "filter" { type = list(string) } | ||
| variable "collapsed" { default = false } | ||
|
|
||
| module "width" { source = "../width" } | ||
|
|
||
| module "request_count" { | ||
| source = "../../widgets/xy" | ||
| title = "Request count" | ||
| filter = concat(var.filter, ["metric.type=\"run.googleapis.com/request_count\""]) | ||
| group_by_fields = ["metric.label.\"response_code_class\""] | ||
| primary_align = "ALIGN_RATE" | ||
| primary_reduce = "REDUCE_NONE" | ||
| secondary_align = "ALIGN_NONE" | ||
| secondary_reduce = "REDUCE_SUM" | ||
| } | ||
|
|
||
| module "incoming_latency" { | ||
| source = "../../widgets/latency" | ||
| title = "Incoming request latency" | ||
| filter = concat(var.filter, ["metric.type=\"run.googleapis.com/request_latencies\""]) | ||
| } | ||
|
|
||
| // TODO(mattmoor): output HTTP charts. | ||
|
|
||
| locals { | ||
| columns = 2 | ||
| unit = module.width.size / local.columns | ||
|
|
||
| // https://www.terraform.io/language/functions/range | ||
| // N columns, unit width each ([0, unit, 2 * unit, ...]) | ||
| col = range(0, local.columns * local.unit, local.unit) | ||
|
|
||
| tiles = [{ | ||
| yPos = 0 | ||
| xPos = local.col[0], | ||
| height = local.unit, | ||
| width = local.unit, | ||
| widget = module.request_count.widget, | ||
| }, | ||
| { | ||
| yPos = 0 | ||
| xPos = local.col[1], | ||
| height = local.unit, | ||
| width = local.unit, | ||
| widget = module.incoming_latency.widget, | ||
| }] | ||
| } | ||
|
|
||
| module "collapsible" { | ||
| source = "../collapsible" | ||
|
|
||
| title = var.title | ||
| tiles = local.tiles | ||
| collapsed = var.collapsed | ||
| } | ||
|
|
||
| output "section" { | ||
| value = module.collapsible.section | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,28 @@ | ||
| variable "sections" {} | ||
|
|
||
| module "width" { source = "../width" } | ||
|
|
||
| locals { | ||
| // The maximum height of a tile in each section. | ||
| max_heights = [for s in var.sections : max([for t in s : t.yPos + t.height]...)] | ||
|
|
||
| // The sum of the maximum tile heights in all of the sections prior to this one. | ||
| // Note: sum doesn't work on an empty list, so we concatenate with 0 for the base case. | ||
| sum_heights = [for s in var.sections : sum(concat([0], slice(local.max_heights, 0, index(var.sections, s))))] | ||
|
|
||
| // Rebase the yPos of each tile in each section to be relative to the top of | ||
| // the section, which starts after the topmost tile of the preceding section. | ||
| rebased = [for s in var.sections : [ | ||
| for t in s : { | ||
| yPos = t.yPos + local.sum_heights[index(var.sections, s)] | ||
| xPos = t.xPos | ||
| height = t.height | ||
| width = t.width | ||
| widget = t.widget | ||
| }] | ||
| ] | ||
| } | ||
|
|
||
| output "tiles" { | ||
| value = concat(local.rebased...) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,33 @@ | ||
| variable "title" { type = string } | ||
| variable "filter" { type = list(string) } | ||
| variable "collapsed" { default = true } | ||
|
|
||
| module "width" { source = "../width" } | ||
|
|
||
| module "logs" { | ||
| source = "../../widgets/logs" | ||
| title = var.title | ||
| filter = var.filter | ||
| } | ||
|
|
||
| locals { | ||
| tiles = [{ | ||
| yPos = 0 | ||
| xPos = 0, | ||
| height = module.width.size, | ||
| width = module.width.size, | ||
| widget = module.logs.widget, | ||
| }] | ||
| } | ||
|
|
||
| module "collapsible" { | ||
| source = "../collapsible" | ||
|
|
||
| title = var.title | ||
| tiles = local.tiles | ||
| collapsed = var.collapsed | ||
| } | ||
|
|
||
| output "section" { | ||
| value = module.collapsible.section | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,119 @@ | ||
| variable "title" { type = string } | ||
| variable "filter" { type = list(string) } | ||
| variable "collapsed" { default = false } | ||
|
|
||
| module "width" { source = "../width" } | ||
|
|
||
| module "instance_count" { | ||
| source = "../../widgets/xy" | ||
| title = "Instance count + revisions" | ||
| filter = concat(var.filter, ["metric.type=\"run.googleapis.com/container/instance_count\""]) | ||
| group_by_fields = ["resource.label.\"revision_name\""] | ||
| primary_align = "ALIGN_MEAN" | ||
| primary_reduce = "REDUCE_SUM" | ||
| plot_type = "STACKED_AREA" | ||
| } | ||
|
|
||
| module "cpu_utilization" { | ||
| source = "../../widgets/xy" | ||
| title = "CPU utilization" | ||
| filter = concat(var.filter, ["metric.type=\"run.googleapis.com/container/cpu/utilizations\""]) | ||
| primary_align = "ALIGN_DELTA" | ||
| primary_reduce = "REDUCE_MEAN" | ||
| } | ||
|
|
||
| module "memory_utilization" { | ||
| source = "../../widgets/xy" | ||
| title = "Memory utilization" | ||
| filter = concat(var.filter, ["metric.type=\"run.googleapis.com/container/memory/utilizations\""]) | ||
| primary_align = "ALIGN_DELTA" | ||
| primary_reduce = "REDUCE_MEAN" | ||
| } | ||
|
|
||
| module "startup_latency" { | ||
| source = "../../widgets/xy" | ||
| title = "Startup latency" | ||
| filter = concat(var.filter, ["metric.type=\"run.googleapis.com/container/startup_latencies\""]) | ||
| primary_align = "ALIGN_DELTA" | ||
| primary_reduce = "REDUCE_MEAN" | ||
| } | ||
|
|
||
| module "sent_bytes" { | ||
| source = "../../widgets/xy" | ||
| title = "Sent bytes" | ||
| filter = concat(var.filter, ["metric.type=\"run.googleapis.com/container/network/sent_bytes_count\""]) | ||
| primary_align = "ALIGN_MEAN" | ||
| primary_reduce = "REDUCE_NONE" | ||
| } | ||
|
|
||
| module "received_bytes" { | ||
| source = "../../widgets/xy" | ||
| title = "Received bytes" | ||
| filter = concat(var.filter, ["metric.type=\"run.googleapis.com/container/network/received_bytes_count\""]) | ||
| primary_align = "ALIGN_MEAN" | ||
| primary_reduce = "REDUCE_NONE" | ||
| } | ||
|
|
||
| locals { | ||
| columns = 3 | ||
| unit = module.width.size / local.columns | ||
|
|
||
| // https://www.terraform.io/language/functions/range | ||
| // N columns, unit width each ([0, unit, 2 * unit, ...]) | ||
| col = range(0, local.columns * local.unit, local.unit) | ||
|
|
||
| tiles = [{ | ||
| yPos = 0, | ||
| xPos = local.col[0], | ||
| height = local.unit, | ||
| width = local.unit, | ||
| widget = module.cpu_utilization.widget, | ||
| }, | ||
| { | ||
| yPos = 0, | ||
| xPos = local.col[1], | ||
| height = local.unit, | ||
| width = local.unit, | ||
| widget = module.memory_utilization.widget, | ||
| }, | ||
| { | ||
| yPos = 0, | ||
| xPos = local.col[2], | ||
| height = local.unit, | ||
| width = local.unit, | ||
| widget = module.instance_count.widget, | ||
| }, | ||
| { | ||
| yPos = local.unit, | ||
| xPos = local.col[0], | ||
| height = local.unit, | ||
| width = local.unit, | ||
| widget = module.startup_latency.widget, | ||
| }, | ||
| { | ||
| yPos = local.unit, | ||
| xPos = local.col[1], | ||
| height = local.unit, | ||
| width = local.unit, | ||
| widget = module.sent_bytes.widget, | ||
| }, | ||
| { | ||
| yPos = local.unit, | ||
| xPos = local.col[2], | ||
| height = local.unit, | ||
| width = local.unit, | ||
| widget = module.received_bytes.widget, | ||
| }] | ||
| } | ||
|
|
||
| module "collapsible" { | ||
| source = "../collapsible" | ||
|
|
||
| title = var.title | ||
| tiles = local.tiles | ||
| collapsed = var.collapsed | ||
| } | ||
|
|
||
| output "section" { | ||
| value = module.collapsible.section | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| output "size" { | ||
| value = 12 | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.