diff --git a/ci/release/changelogs/next.md b/ci/release/changelogs/next.md index 07a9d41ed..eca850d2b 100644 --- a/ci/release/changelogs/next.md +++ b/ci/release/changelogs/next.md @@ -11,3 +11,4 @@ - Restricts where `near` key constant values can be used, with good error messages, instead of erroring (e.g. setting `near: top-center` on a container would cause bad layouts or error). [#538](https://github.com/terrastruct/d2/pull/538) - Fixes an error during ELK layout when images had empty labels. [#555](https://github.com/terrastruct/d2/pull/555) - Fixes rendering classes and tables with empty headers. [#498](https://github.com/terrastruct/d2/pull/498) +- Fixes rendering sql tables with no columns. [#553](https://github.com/terrastruct/d2/pull/553) diff --git a/d2graph/d2graph.go b/d2graph/d2graph.go index 7bc38cfa7..7bd59ec6a 100644 --- a/d2graph/d2graph.go +++ b/d2graph/d2graph.go @@ -805,7 +805,9 @@ func (obj *Object) GetDefaultSize(mtexts []*d2target.MText, ruler *textmeasure.R // The rows get padded a little due to header font being larger than row font dims.Height = labelDims.Height * (len(obj.SQLTable.Columns) + 1) - dims.Width = d2target.NamePadding + maxNameWidth + d2target.TypePadding + maxTypeWidth + d2target.TypePadding + constraintWidth + headerWidth := d2target.HeaderPadding + labelDims.Width + d2target.HeaderPadding + rowsWidth := d2target.NamePadding + maxNameWidth + d2target.TypePadding + maxTypeWidth + d2target.TypePadding + constraintWidth + dims.Width = go2.Max(headerWidth, rowsWidth) } return &dims, nil diff --git a/d2renderers/d2svg/table.go b/d2renderers/d2svg/table.go index 9ec48e0a9..46bdef37c 100644 --- a/d2renderers/d2svg/table.go +++ b/d2renderers/d2svg/table.go @@ -19,8 +19,8 @@ func tableHeader(shape d2target.Shape, box *geo.Box, text string, textWidth, tex if text != "" { tl := label.InsideMiddleLeft.GetPointOnBox( box, - 20, - textWidth, + float64(d2target.HeaderPadding), + float64(shape.Width), textHeight, ) diff --git a/d2target/sqltable.go b/d2target/sqltable.go index f19f2a94b..8332a34c8 100644 --- a/d2target/sqltable.go +++ b/d2target/sqltable.go @@ -3,8 +3,9 @@ package d2target import "oss.terrastruct.com/d2/d2renderers/d2fonts" const ( - NamePadding = 10 - TypePadding = 20 + NamePadding = 10 + TypePadding = 20 + HeaderPadding = 20 ) type SQLTable struct { diff --git a/e2etests/regression_test.go b/e2etests/regression_test.go index a3698795b..aa8ca3b37 100644 --- a/e2etests/regression_test.go +++ b/e2etests/regression_test.go @@ -262,6 +262,26 @@ ico: { label: "" icon: https://icons.terrastruct.com/infra/019-network.svg } +`, + }, + { + name: "only_header_class_table", + script: ` + +class: RefreshAuthorizationPolicyProtocolServerSideTranslatorProtocolBuffer { + shape: class +} + +table: RefreshAuthorizationPolicyCache { + shape: sql_table +} + +table with short col: RefreshAuthorizationPolicyCache { + shape: sql_table + ok +} + +class -> table -> table with short col `, }, } diff --git a/e2etests/testdata/regression/only_header_class_table/dagre/board.exp.json b/e2etests/testdata/regression/only_header_class_table/dagre/board.exp.json new file mode 100644 index 000000000..c35935f77 --- /dev/null +++ b/e2etests/testdata/regression/only_header_class_table/dagre/board.exp.json @@ -0,0 +1,259 @@ +{ + "name": "", + "fontFamily": "SourceSansPro", + "shapes": [ + { + "id": "class", + "type": "class", + "pos": { + "x": 0, + "y": 0 + }, + "width": 1082, + "height": 36, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#0A0F25", + "stroke": "#FFFFFF", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "blend": false, + "fields": null, + "methods": null, + "columns": null, + "label": "RefreshAuthorizationPolicyProtocolServerSideTranslatorProtocolBuffer", + "fontSize": 20, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": false, + "underline": false, + "labelWidth": 982, + "labelHeight": 36, + "zIndex": 0, + "level": 1, + "primaryAccentColor": "#0D32B2", + "secondaryAccentColor": "#4A6FF3", + "neutralAccentColor": "#676C7E" + }, + { + "id": "table", + "type": "sql_table", + "pos": { + "x": 341, + "y": 136 + }, + "width": 401, + "height": 36, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#0A0F25", + "stroke": "#FFFFFF", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "blend": false, + "fields": null, + "methods": null, + "columns": null, + "label": "RefreshAuthorizationPolicyCache", + "fontSize": 20, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 361, + "labelHeight": 36, + "zIndex": 0, + "level": 1, + "primaryAccentColor": "#0D32B2", + "secondaryAccentColor": "#4A6FF3", + "neutralAccentColor": "#676C7E" + }, + { + "id": "table with short col", + "type": "sql_table", + "pos": { + "x": 341, + "y": 272 + }, + "width": 401, + "height": 72, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#0A0F25", + "stroke": "#FFFFFF", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "blend": false, + "fields": null, + "methods": null, + "columns": [ + { + "name": { + "label": "ok", + "fontSize": 0, + "fontFamily": "", + "language": "", + "color": "", + "italic": false, + "bold": false, + "underline": false, + "labelWidth": 21, + "labelHeight": 26 + }, + "type": { + "label": "", + "fontSize": 0, + "fontFamily": "", + "language": "", + "color": "", + "italic": false, + "bold": false, + "underline": false, + "labelWidth": 0, + "labelHeight": 0 + }, + "constraint": "", + "reference": "" + } + ], + "label": "RefreshAuthorizationPolicyCache", + "fontSize": 20, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 361, + "labelHeight": 36, + "zIndex": 0, + "level": 1, + "primaryAccentColor": "#0D32B2", + "secondaryAccentColor": "#4A6FF3", + "neutralAccentColor": "#676C7E" + } + ], + "connections": [ + { + "id": "(class -> table)[0]", + "src": "class", + "srcArrow": "none", + "srcLabel": "", + "dst": "table", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 0, + "labelHeight": 0, + "labelPosition": "", + "labelPercentage": 0, + "route": [ + { + "x": 541, + "y": 36 + }, + { + "x": 541, + "y": 76 + }, + { + "x": 541, + "y": 96 + }, + { + "x": 541, + "y": 136 + } + ], + "isCurve": true, + "animated": false, + "tooltip": "", + "icon": null, + "zIndex": 0 + }, + { + "id": "(table -> table with short col)[0]", + "src": "table", + "srcArrow": "none", + "srcLabel": "", + "dst": "table with short col", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 0, + "labelHeight": 0, + "labelPosition": "", + "labelPercentage": 0, + "route": [ + { + "x": 541, + "y": 172 + }, + { + "x": 541, + "y": 212 + }, + { + "x": 541, + "y": 232 + }, + { + "x": 541, + "y": 272 + } + ], + "isCurve": true, + "animated": false, + "tooltip": "", + "icon": null, + "zIndex": 0 + } + ] +} diff --git a/e2etests/testdata/regression/only_header_class_table/dagre/sketch.exp.svg b/e2etests/testdata/regression/only_header_class_table/dagre/sketch.exp.svg new file mode 100644 index 000000000..f4ee758ba --- /dev/null +++ b/e2etests/testdata/regression/only_header_class_table/dagre/sketch.exp.svg @@ -0,0 +1,40 @@ + +RefreshAuthorizationPolicyProtocolServerSideTranslatorProtocolBufferRefreshAuthorizationPolicyCacheRefreshAuthorizationPolicyCacheok + + + + + \ No newline at end of file diff --git a/e2etests/testdata/regression/only_header_class_table/elk/board.exp.json b/e2etests/testdata/regression/only_header_class_table/elk/board.exp.json new file mode 100644 index 000000000..31a428a6c --- /dev/null +++ b/e2etests/testdata/regression/only_header_class_table/elk/board.exp.json @@ -0,0 +1,241 @@ +{ + "name": "", + "fontFamily": "SourceSansPro", + "shapes": [ + { + "id": "class", + "type": "class", + "pos": { + "x": 12, + "y": 12 + }, + "width": 1082, + "height": 36, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#0A0F25", + "stroke": "#FFFFFF", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "blend": false, + "fields": null, + "methods": null, + "columns": null, + "label": "RefreshAuthorizationPolicyProtocolServerSideTranslatorProtocolBuffer", + "fontSize": 20, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": false, + "underline": false, + "labelWidth": 982, + "labelHeight": 36, + "zIndex": 0, + "level": 1, + "primaryAccentColor": "#0D32B2", + "secondaryAccentColor": "#4A6FF3", + "neutralAccentColor": "#676C7E" + }, + { + "id": "table", + "type": "sql_table", + "pos": { + "x": 352, + "y": 148 + }, + "width": 401, + "height": 36, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#0A0F25", + "stroke": "#FFFFFF", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "blend": false, + "fields": null, + "methods": null, + "columns": null, + "label": "RefreshAuthorizationPolicyCache", + "fontSize": 20, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 361, + "labelHeight": 36, + "zIndex": 0, + "level": 1, + "primaryAccentColor": "#0D32B2", + "secondaryAccentColor": "#4A6FF3", + "neutralAccentColor": "#676C7E" + }, + { + "id": "table with short col", + "type": "sql_table", + "pos": { + "x": 352, + "y": 284 + }, + "width": 401, + "height": 72, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#0A0F25", + "stroke": "#FFFFFF", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "blend": false, + "fields": null, + "methods": null, + "columns": [ + { + "name": { + "label": "ok", + "fontSize": 0, + "fontFamily": "", + "language": "", + "color": "", + "italic": false, + "bold": false, + "underline": false, + "labelWidth": 21, + "labelHeight": 26 + }, + "type": { + "label": "", + "fontSize": 0, + "fontFamily": "", + "language": "", + "color": "", + "italic": false, + "bold": false, + "underline": false, + "labelWidth": 0, + "labelHeight": 0 + }, + "constraint": "", + "reference": "" + } + ], + "label": "RefreshAuthorizationPolicyCache", + "fontSize": 20, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 361, + "labelHeight": 36, + "zIndex": 0, + "level": 1, + "primaryAccentColor": "#0D32B2", + "secondaryAccentColor": "#4A6FF3", + "neutralAccentColor": "#676C7E" + } + ], + "connections": [ + { + "id": "(class -> table)[0]", + "src": "class", + "srcArrow": "none", + "srcLabel": "", + "dst": "table", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 0, + "labelHeight": 0, + "labelPosition": "", + "labelPercentage": 0, + "route": [ + { + "x": 553, + "y": 48 + }, + { + "x": 553, + "y": 148 + } + ], + "animated": false, + "tooltip": "", + "icon": null, + "zIndex": 0 + }, + { + "id": "(table -> table with short col)[0]", + "src": "table", + "srcArrow": "none", + "srcLabel": "", + "dst": "table with short col", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 0, + "labelHeight": 0, + "labelPosition": "", + "labelPercentage": 0, + "route": [ + { + "x": 553, + "y": 184 + }, + { + "x": 553, + "y": 284 + } + ], + "animated": false, + "tooltip": "", + "icon": null, + "zIndex": 0 + } + ] +} diff --git a/e2etests/testdata/regression/only_header_class_table/elk/sketch.exp.svg b/e2etests/testdata/regression/only_header_class_table/elk/sketch.exp.svg new file mode 100644 index 000000000..546757264 --- /dev/null +++ b/e2etests/testdata/regression/only_header_class_table/elk/sketch.exp.svg @@ -0,0 +1,40 @@ + +RefreshAuthorizationPolicyProtocolServerSideTranslatorProtocolBufferRefreshAuthorizationPolicyCacheRefreshAuthorizationPolicyCacheok + + + + + \ No newline at end of file