diff --git a/src/components/trace/hat-graph-branch.ts b/src/components/trace/hat-graph-branch.ts index c5da464bcf..04a9c936c8 100644 --- a/src/components/trace/hat-graph-branch.ts +++ b/src/components/trace/hat-graph-branch.ts @@ -1,4 +1,4 @@ -import { css, html, LitElement, svg } from "lit"; +import { css, html, LitElement, nothing, svg } from "lit"; import { customElement, property, state } from "lit/decorators"; import { classMap } from "lit/directives/class-map"; import { BRANCH_HEIGHT, SPACING } from "./hat-graph-const"; @@ -41,8 +41,8 @@ export class HatGraphBranch extends LitElement { branches.push({ x: width / 2 + total_width, height, - start: c.hasAttribute("graphStart"), - end: c.hasAttribute("graphEnd"), + start: c.hasAttribute("graph-start"), + end: c.hasAttribute("graph-end"), track: c.hasAttribute("track"), }); total_width += width; @@ -65,11 +65,8 @@ export class HatGraphBranch extends LitElement { return html` ${!this.start - ? svg` - + ? html` + ${this._branches.map((branch) => branch.start ? "" @@ -86,7 +83,7 @@ export class HatGraphBranch extends LitElement { )} ` - : ""} + : nothing} ${this._branches.map((branch) => { @@ -107,11 +104,8 @@ export class HatGraphBranch extends LitElement { ${!this.short - ? svg` - + ? html` + ${this._branches.map((branch) => { if (branch.end) return ""; return svg` @@ -128,7 +122,7 @@ export class HatGraphBranch extends LitElement { })} ` - : ""} + : nothing} `; }