sundowndev
/
driftctl
mirror of https://github.com/sundowndev/driftctl.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor: diffs custom style

main
sundowndev 2021-06-10 18:35:13 +02:00
parent 76613149c1
commit 21747180d9
10 changed files with 536 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
pkg/cmd/scan/output/assets/index.tmpl
View File

@ -87,14 +87,44 @@
<span>Resource type</span>
</div>
{{range $diff := .Differences}}
<div class="resource-item resource-item-changed d-flex justify-space-between">
<div class="resource-item resource-item-changed">
<div class="d-flex justify-space-between">
<span class="resource-item-id">{{$diff.Res.TerraformId}}</span>
<div>
<span class="resource-item-type">{{$diff.Res.TerraformType}}</span>
</div>
<div class="code-box mt-2">
<ol>
{{range $change := $diff.Changelog}}
<div>{{ formatChange $change }}</div>
<li class="code-box-line">
{{ range $index, $path := $change.Path }}
<div style="margin-top:5px;">
{{/* Add indentation for each YAML field */}}
{{ repeatString "&emsp;" $index }}
{{ if eq (isInt .) true }}-{{ else }}
{{ $path }}:
{{end}}
{{/* If it's the last path key, display value difference */}}
{{ if eq (len $change.Path) (sum $index 1) }}
{{ if eq $change.Type "delete" }}
<span class="code-box-line-delete">{{ prettify $change.From }}</span>
{{end}}
{{ if eq $change.Type "create" }}
<span class="code-box-line-create">{{ prettify $change.To }}</span>
{{end}}
{{ if eq $change.Type "update" }}
<span class="code-box-line-delete">{{ prettify $change.From }}</span> => <span
class="code-box-line-create">{{ prettify $change.To }}</span>
{{end}}
</div>
<span class="resource-item-type">{{$diff.Res.TerraformType}}</span>
{{ end }}
{{end}}
</li>
{{end}}
</ol>
</div>
</div>
{{end}}
</div>

37
pkg/cmd/scan/output/assets/style.css
View File

@ -206,6 +206,10 @@ h2 {
background-color: #f9f9f9;
}
.resource-item.resource-item-changed:hover {
background-color: transparent;
}
.text--bold {
font-weight: bold;
}
@ -303,3 +307,36 @@ h2 {
.empty-message-container {
color: #747578;
}
.code-box {
padding: 5px;
background: #f6f8fa;
color: #747578;
margin-top: 21px;
border-radius: 3px;
}
.code-box ol {
list-style-type: none;
}
.code-box .code-box-line {
padding: 8px;
border-radius: 2px;
margin: 10px;
}
span.code-box-line-create {
background-color: #22863a1a;
color: #22863a;
padding: 3px;
border-radius: 3px;
}
span.code-box-line-delete {
text-decoration: line-through;
background-color: #bf404a17;
color: #bf404a;
padding: 3px;
border-radius: 3px;
}

2
pkg/cmd/scan/output/console.go
View File

@ -168,7 +168,7 @@ func (c Console) writeSummary(analysis *analyser.Analysis) {
func prettify(resource interface{}) string {
res := reflect.ValueOf(resource)
if resource == nil || res.Kind() == reflect.Ptr && res.IsNil() {
return "<nil>"
return "<null>"
}
return awsutil.Prettify(resource)

21
pkg/cmd/scan/output/html.go
View File

@ -6,6 +6,7 @@ import (
"html/template"
"math"
"os"
"strconv"
"strings"
"time"
@ -100,6 +101,26 @@ func (c *HTML) Write(analysis *analyser.Analysis) error {
}
return math.Round(100 * float64(count) / float64(analysis.Summary().TotalResources))
},
"isInt": func(str string) bool {
_, err := strconv.ParseInt(str, 10, 32)
if err != nil {
return false
}
return true
},
"prettify": func(res interface{}) string {
return prettify(res)
},
"sum": func(n ...int) int {
total := 0
for _, v := range n {
total += v
}
return total
},
"repeatString": func(s string, count int) template.HTML {
return template.HTML(strings.Repeat(s, count))
},
}
tmpl, err := template.New("main").Funcs(funcMap).Parse(string(tmplFile))

38
pkg/cmd/scan/output/html_test.go
View File

@ -90,15 +90,47 @@ func TestHTML_Write(t *testing.T) {
},
)
a.AddDifference(analyser.Difference{Res: &testresource.FakeResource{
Id: "diff-id-1",
Id: "diff-id-2",
Type: "aws_diff_resource",
}, Changelog: []analyser.Change{
{
Change: diff.Change{
Type: diff.DELETE,
Path: []string{"path", "to", "field"},
Path: []string{"path", "to", "fields", "0"},
From: []string{"value"},
To: nil,
},
},
{
Change: diff.Change{
Type: diff.DELETE,
Path: []string{"path", "to", "fields", "1"},
From: []string{"test"},
To: nil,
},
},
{
Change: diff.Change{
Type: diff.DELETE,
Path: []string{"group_id"},
From: []string{"a071314398026"},
To: nil,
},
},
{
Change: diff.Change{
Type: diff.CREATE,
Path: []string{"Tags", "Name"},
From: nil,
To: []string{"value"},
To: "aws-www-1-root",
},
},
{
Change: diff.Change{
Type: diff.UPDATE,
Path: []string{"InstanceInitiatedShutdownBehavior"},
From: "",
To: nil,
},
},
}})

337
pkg/cmd/scan/output/testdata/output.html vendored
View File

@ -214,6 +214,10 @@ h2 {
background-color: #f9f9f9;
}
.resource-item.resource-item-changed:hover {
background-color: transparent;
}
.text--bold {
font-weight: bold;
}
@ -310,6 +314,39 @@ h2 {
.empty-message-container {
color: #747578;
}
.code-box {
padding: 5px;
background: #f6f8fa;
color: #747578;
margin-top: 21px;
border-radius: 3px;
}
.code-box ol {
list-style-type: none;
}
.code-box .code-box-line {
padding: 8px;
border-radius: 2px;
margin: 10px;
}
span.code-box-line-create {
background-color: #22863a1a;
color: #22863a;
padding: 3px;
border-radius: 3px;
}
span.code-box-line-delete {
text-decoration: line-through;
background-color: #bf404a17;
color: #bf404a;
padding: 3px;
border-radius: 3px;
}</style>
</head>
<body>
@ -415,29 +452,301 @@ h2 {
<span>Resource type</span>
</div>
<div class="resource-item resource-item-changed d-flex justify-space-between">
<div class="resource-item resource-item-changed">
<div class="d-flex justify-space-between">
<span class="resource-item-id">diff-id-1</span>
<div>
<div>~ updated.field: &#34;foobar&#34; =&gt; &#34;barfoo&#34; </div>
<div>&#43; new.field: &lt;nil&gt; =&gt; &#34;newValue&#34; </div>
<div>- a: &#34;oldValue&#34; =&gt; &lt;nil&gt; </div>
</div>
<span class="resource-item-type">aws_diff_resource</span>
</div>
<div class="code-box mt-2">
<ol>
<div class="resource-item resource-item-changed d-flex justify-space-between">
<span class="resource-item-id">diff-id-1</span>
<div>
<li class="code-box-line">
<div>- path.to.field: &lt;nil&gt; =&gt; [&#34;value&#34;] </div>
<div style="margin-top:5px;">
updated:
<div style="margin-top:5px;">
&emsp;
field:
<span class="code-box-line-delete">&#34;foobar&#34;</span> => <span
class="code-box-line-create">&#34;barfoo&#34;</span>
</div>
</li>
<li class="code-box-line">
<div style="margin-top:5px;">
new:
<div style="margin-top:5px;">
&emsp;
field:
<span class="code-box-line-create">&#34;newValue&#34;</span>
</div>
</li>
<li class="code-box-line">
<div style="margin-top:5px;">
a:
<span class="code-box-line-delete">&#34;oldValue&#34;</span>
</div>
</li>
</ol>
</div>
</div>
<div class="resource-item resource-item-changed">
<div class="d-flex justify-space-between">
<span class="resource-item-id">diff-id-2</span>
<span class="resource-item-type">aws_diff_resource</span>
</div>
<div class="code-box mt-2">
<ol>
<li class="code-box-line">
<div style="margin-top:5px;">
path:
<div style="margin-top:5px;">
&emsp;
to:
<div style="margin-top:5px;">
&emsp;&emsp;
fields:
<div style="margin-top:5px;">
&emsp;&emsp;&emsp;
-
<span class="code-box-line-delete">[&#34;value&#34;]</span>
</div>
</li>
<li class="code-box-line">
<div style="margin-top:5px;">
path:
<div style="margin-top:5px;">
&emsp;
to:
<div style="margin-top:5px;">
&emsp;&emsp;
fields:
<div style="margin-top:5px;">
&emsp;&emsp;&emsp;
-
<span class="code-box-line-delete">[&#34;test&#34;]</span>
</div>
</li>
<li class="code-box-line">
<div style="margin-top:5px;">
group_id:
<span class="code-box-line-delete">[&#34;a071314398026&#34;]</span>
</div>
</li>
<li class="code-box-line">
<div style="margin-top:5px;">
Tags:
<div style="margin-top:5px;">
&emsp;
Name:
<span class="code-box-line-create">&#34;aws-www-1-root&#34;</span>
</div>
</li>
<li class="code-box-line">
<div style="margin-top:5px;">
InstanceInitiatedShutdownBehavior:
<span class="code-box-line-delete">&#34;&#34;</span> => <span
class="code-box-line-create">&lt;null&gt;</span>
</div>
</li>
</ol>
</div>
</div>
</div>

4
pkg/cmd/scan/output/testdata/output.txt vendored
View File

@ -16,8 +16,8 @@ Found resources not covered by IaC:
Found changed resources:
- diff-id-1 (aws_diff_resource):
~ updated.field: "foobar" => "barfoo"
+ new.field: <nil> => "newValue"
- a: "oldValue" => <nil>
+ new.field: <null> => "newValue"
- a: "oldValue" => <null>
Found 10 resource(s)
- 20% coverage
- 2 covered by IaC

4
pkg/cmd/scan/output/testdata/output_computed_fields.txt vendored
View File

@ -1,8 +1,8 @@
Found changed resources:
- diff-id-1 (aws_diff_resource):
~ updated.field: "foobar" => "barfoo" (computed)
+ new.field: <nil> => "newValue"
- a: "oldValue" => <nil> (computed)
+ new.field: <null> => "newValue"
- a: "oldValue" => <null> (computed)
~ struct.0.array.0: "foo" => "oof" (computed)
~ struct.0.string: "one" => "two" (computed)
Found 1 resource(s)

37
pkg/cmd/scan/output/testdata/output_empty.html vendored
View File

@ -214,6 +214,10 @@ h2 {
background-color: #f9f9f9;
}
.resource-item.resource-item-changed:hover {
background-color: transparent;
}
.text--bold {
font-weight: bold;
}
@ -310,6 +314,39 @@ h2 {
.empty-message-container {
color: #747578;
}
.code-box {
padding: 5px;
background: #f6f8fa;
color: #747578;
margin-top: 21px;
border-radius: 3px;
}
.code-box ol {
list-style-type: none;
}
.code-box .code-box-line {
padding: 8px;
border-radius: 2px;
margin: 10px;
}
span.code-box-line-create {
background-color: #22863a1a;
color: #22863a;
padding: 3px;
border-radius: 3px;
}
span.code-box-line-delete {
text-decoration: line-through;
background-color: #bf404a17;
color: #bf404a;
padding: 3px;
border-radius: 3px;
}</style>
</head>
<body>

37
pkg/cmd/scan/output/testdata/output_sync.html vendored
View File

@ -214,6 +214,10 @@ h2 {
background-color: #f9f9f9;
}
.resource-item.resource-item-changed:hover {
background-color: transparent;
}
.text--bold {
font-weight: bold;
}
@ -310,6 +314,39 @@ h2 {
.empty-message-container {
color: #747578;
}
.code-box {
padding: 5px;
background: #f6f8fa;
color: #747578;
margin-top: 21px;
border-radius: 3px;
}
.code-box ol {
list-style-type: none;
}
.code-box .code-box-line {
padding: 8px;
border-radius: 2px;
margin: 10px;
}
span.code-box-line-create {
background-color: #22863a1a;
color: #22863a;
padding: 3px;
border-radius: 3px;
}
span.code-box-line-delete {
text-decoration: line-through;
background-color: #bf404a17;
color: #bf404a;
padding: 3px;
border-radius: 3px;
}</style>
</head>
<body>