cleanup

It's used in other custom pages too

cmd/dkl-local-server/bootv2.go

@@ -58,8 +58,10 @@ func buildInitrd(out io.Writer, ctx *renderContext) (err error) {
 	for _, layer := range cfg.Layers {
 		switch layer {
 		case "modules":
-
 			layerVersion := ctx.Host.Versions[layer]
+			if layerVersion == "" {
+				layerVersion = ctx.Host.Kernel
+			}
 			modulesPath, err := distFetch("layers", layer, layerVersion)
 			if err != nil {
 				return err

cmd/dkl-local-server/render-context.go

@@ -4,6 +4,7 @@ import (
 	"bytes"
 	"crypto/sha1"
 	"crypto/sha256"
+	"encoding/base64"
 	"encoding/hex"
 	"encoding/json"
 	"fmt"
@@ -31,6 +32,8 @@ import (
 
 var cmdlineParam = restful.QueryParameter("cmdline", "Linux kernel cmdline addition")
 
+var b64 = base64.StdEncoding.WithPadding(base64.NoPadding)
+
 type renderContext struct {
 	Host      *localconfig.Host
 	SSLConfig *cfsslconfig.Config
@@ -101,6 +104,8 @@ func (ctx *renderContext) Config() (ba []byte, cfg *config.Config, err error) {
 		return
 	}
 
+	// log.Print("rendered config:\n", string(ba))
+
 	cfg = &config.Config{}
 	if err = yaml.Unmarshal(ba, cfg); err != nil {
 		return
@@ -184,6 +189,10 @@ func (ctx *renderContext) TemplateFuncs() map[string]any {
 	}
 
 	for name, method := range map[string]any{
+		"base64": func(input string) string {
+			return b64.EncodeToString([]byte(input))
+		},
+
 		"host_ip": func() (s string) {
 			return ctx.Host.IPs[0]
 		},
@@ -236,6 +245,10 @@ func (ctx *renderContext) TemplateFuncs() map[string]any {
 				Content: string(userCA),
 			}})
 		},
+		"ssh_user_ca_pub": func(cluster string) (s string, err error) {
+			userCA, err := sshCAPubKey(cluster)
+			return string(userCA), err
+		},
 		"ssh_host_keys": func(dir, cluster, host string) (s string, err error) {
 			if host == "" {
 				host = ctx.Host.Name
@@ -270,6 +283,20 @@ func (ctx *renderContext) TemplateFuncs() map[string]any {
 
 			return asYaml(files)
 		},
+		"ssh_host_key": func(type_ string) (s string, err error) {
+			pair, err := ctx.sshHostKeyPair(type_)
+			if err != nil {
+				return
+			}
+			return pair.Private, nil
+		},
+		"ssh_host_pubkey": func(type_ string) (s string, err error) {
+			pair, err := ctx.sshHostKeyPair(type_)
+			if err != nil {
+				return
+			}
+			return pair.Public, nil
+		},
 		"host_download_token": func() (token string, err error) {
 			key := ctx.Host.Name
 			token, found, err := hostDownloadTokens.Get(key)
@@ -337,3 +364,19 @@ func (ctx *renderContext) TemplateFuncs() map[string]any {
 
 	return funcs
 }
+
+func (ctx *renderContext) sshHostKeyPair(type_ string) (kp SSHKeyPair, err error) {
+	pairs, err := getSSHKeyPairs(ctx.Host.Name)
+	if err != nil {
+		return
+	}
+
+	for _, pair := range pairs {
+		if pair.Type == type_ {
+			return pair, nil
+		}
+	}
+
+	err = fmt.Errorf("no key pair with type %q", type_)
+	return
+}

go.mod

@@ -25,7 +25,7 @@ require (
 	gopkg.in/yaml.v2 v2.4.0
 	k8s.io/apimachinery v0.33.2
 	m.cluseau.fr/go v0.0.0-20230809064045-12c5a121c766
-	novit.tech/direktil/pkg v0.0.0-20250706092353-d857af8032a1
+	novit.tech/direktil/pkg v0.0.0-20260125193049-56f78e083a84
 )
 
 replace github.com/zmap/zlint/v3 => github.com/zmap/zlint/v3 v3.3.1

go.sum

@@ -346,5 +346,5 @@ k8s.io/utils v0.0.0-20250604170112-4c0f3b243397 h1:hwvWFiBzdWw1FhfY1FooPn3kzWuJ8
 k8s.io/utils v0.0.0-20250604170112-4c0f3b243397/go.mod h1:OLgZIPagt7ERELqWJFomSt595RzquPNLL48iOWgYOg0=
 m.cluseau.fr/go v0.0.0-20230809064045-12c5a121c766 h1:JRzMBDbUwrTTGDJaJSH0ap4vRL0Q9CN1bG8a6n49eaQ=
 m.cluseau.fr/go v0.0.0-20230809064045-12c5a121c766/go.mod h1:BMv3aOSYpupuiiG3Ch3ND88aB5CfAks3YZuRLE8j1ls=
-novit.tech/direktil/pkg v0.0.0-20250706092353-d857af8032a1 h1:hKj9qhbTAoTxYIj6KaMLJp9I+bvZfkSM/QwK8Bd496o=
+novit.tech/direktil/pkg v0.0.0-20260125193049-56f78e083a84 h1:eqLPaRpVth1WgdvprKKtc4CVF13dkxuKbo7bLzlYG6s=
-novit.tech/direktil/pkg v0.0.0-20250706092353-d857af8032a1/go.mod h1:zjezU6tELE880oYHs/WAauGBupKIEQQ7KqWTB69RW10=
+novit.tech/direktil/pkg v0.0.0-20260125193049-56f78e083a84/go.mod h1:zjezU6tELE880oYHs/WAauGBupKIEQQ7KqWTB69RW10=

html/ui/app-7f4645e84eaae7ce.js

@@ -133,7 +133,12 @@ createApp({
             })
         },
         uploadConfig() {
-            this.apiPost('/configs', this.$refs.configUpload.files[0], (v) => {}, "text/vnd.yaml")
+            const file = this.$refs.configUpload.files[0];
+            let contentType = "text/vnd.yaml";
+            if (file.name.endsWith(".json")) {
+                contentType = "application/json";
+            }
+            this.apiPost('/configs', file, (v) => {}, contentType, true)
         },
         hostFromTemplateAdd() {
             let v = this.forms.hostFromTemplate;
@@ -148,7 +153,7 @@ createApp({
             }
             this.apiDelete('/hosts-from-template/'+v, (v) => { this.forms.hostFromTemplateDel = "" });
         },
-        apiPost(action, data, onload, contentType = 'application/json') {
+        apiPost(action, data, onload, contentType = 'application/json', raw = false) {
             event.preventDefault()
 
             if (data === undefined) {
@@ -190,7 +195,7 @@ createApp({
                 xhr.setRequestHeader('Authorization', 'Bearer '+this.session.token)
             }
 
-            if (contentType == "application/json") {
+            if (!raw && contentType == "application/json") {
                 xhr.send(JSON.stringify(data))
             } else {
                 xhr.send(data)

html/ui/app.css

@@ -0,0 +1,42 @@
+
+.view-links > span {
+    display: inline-block;
+    white-space: nowrap;
+    margin-right: 1ex;
+    margin-bottom: 1ex;
+    padding: 0.5ex;
+    border: 1pt solid;
+    border-radius: 1ex;
+    cursor: pointer;
+}
+
+.downloads, .download-links {
+  & > * {
+    display: inline-block;
+    margin-right: 1ex;
+    margin-bottom: 1ex;
+    padding: 0.5ex;
+    border: 1px solid;
+    border-radius: 1ex;
+    cursor: pointer;
+  }
+}
+
+.downloads, .view-links {
+  & > .selected {
+    color: var(--link);
+  }
+}
+
+.text-and-file {
+  position:relative;
+
+  textarea {
+    width: 64em;
+  }
+
+  input[type="file"] {
+    position:absolute;
+    bottom:0;right:0;
+  }
+}

html/ui/index.html

@@ -6,247 +6,11 @@
 
 <link rel="icon" href="favicon.ico" />
 
-<style>:root {
-    --bg: #eee;
-    --color: black;
-    --bevel-dark:  darkgray;
-    --bevel-light: lightgray;
-    --link: blue;
-    --input-bg: #ddd;
-    --input-text: white;
-    --btn-bg: #eee;
-}
 
-@media (prefers-color-scheme: dark) {
-  :root {
-    --bg: black;
-    --color: orange;
-    --bevel-dark:  #402900;
-    --bevel-light: #805300;
-    --link: #31b0fa;
-    --input-bg: #111;
-    --input-text: #ddd;
-    --btn-bg: #222;
-  }
-}
 
-body {
+<style>@import url('/ui/style.css');@import url('/ui/app.css');</style>
-    background: var(--bg);
-    color: var(--color);
-}
-
-button[disabled] {
-    opacity: 0.5;
-}
-
-a[href], a[href]:visited, button.link {
-    border: none;
-    color: var(--link);
-    background: none;
-    cursor: pointer;
-    text-decoration: none;
-}
-
-table {
-    border-collapse: collapse;
-}
-th, td {
-    border-left:   dotted 1pt;
-    border-right:  dotted 1pt;
-    border-bottom: dotted 1pt;
-    padding: 2pt 4pt;
-}
-tr:first-child > th {
-    border-top: dotted 1pt;
-}
-th, tr:last-child > td {
-    border-bottom: solid 1pt;
-}
-
-.flat > * { margin-left: 1ex; }
-.flat > *:first-child { margin-left: 0; }
-
-.green { color: green; }
-.red   { color: red; }
-
-@media (prefers-color-scheme: dark) {
-  .red { color: #c00; }
-}
-
-textarea, select, input {
-    background: var(--input-bg);
-    color: var(--input-text);
-    border: solid 1pt;
-    border-color:  var(--bevel-light);
-    border-top-color:  var(--bevel-dark);
-    border-left-color: var(--bevel-dark);
-    margin: 1pt;
-
-    &:focus {
-      outline: solid 1pt var(--color);
-    }
-  }
-
-button, input[type=button], input[type=submit], ::file-selector-button {
-    background: var(--btn-bg);
-    color: var(--color);
-    border: solid 2pt;
-    border-color:  var(--bevel-dark);
-    border-top-color:  var(--bevel-light);
-    border-left-color: var(--bevel-light);
-
-    &:hover {
-      background: var(--bevel-dark);
-    }
-    &:active {
-      background: var(--bevel-dark);
-      border-color: var(--bevel-light);
-    }
-}
-
-header {
-    display: flex;
-    align-items: center;
-    border-bottom: 2pt solid;
-    margin: 0 0 1em 0;
-    padding: 1ex;
-    justify-content: space-between;
-}
-#logo > img {
-    vertical-align: middle;
-}
-header .utils > * {
-    margin-left: 1ex;
-}
-
-.error {
-    display: flex;
-    position: relative;
-    background: rgba(255,0,0,0.2);
-    border: 1pt solid red;
-    justify-content: space-between;
-    align-items: center;
-}
-.error .btn-close,
-.error .code {
-    background: #600;
-    color: white;
-    font-weight: bold;
-    border: none;
-    align-self: stretch;
-    padding: 1ex 1em;
-}
-.error .code {
-    order: 1;
-
-    display: flex;
-    align-items: center;
-    text-align: center;
-}
-.error .message {
-    order: 2;
-    padding: 1ex 2em;
-}
-.error .btn-close {
-    order: 3;
-}
-
-.sheets {
-    display: flex;
-    align-items: stretch;
-}
-.sheets > div {
-    margin: 0 1ex;
-    border: 1pt solid;
-    border-radius: 6pt;
-}
-.sheets .title {
-    text-align: center;
-    font-weight: bold;
-    font-size: large;
-    padding: 2pt 6pt;
-    background: rgba(127,127,127,0.5);
-}
-.sheets .section {
-    padding: 2pt 6pt 2pt 6pt;
-    font-weight: bold;
-    border-top: 1px dotted;
-}
-.sheets section {
-    margin: 2pt 6pt 6pt 6pt;
-}
-.sheets > *:last-child > table:last-child > tr:last-child > td {
-    border-bottom: none;
-}
-
-.notif {
-    display: inline-block;
-    position: relative;
-}
-.notif > div:first-child {
-    position: absolute;
-    min-width: 100%; height: 100%;
-    background: white;
-    opacity: 75%;
-    text-align: center;
-}
-
-.links > * { margin-left: 1ex; }
-.links > *:first-child { margin-left: 0; }
-
-@media (prefers-color-scheme: dark) {
-  .notif > div:first-child {
-    background: black;
-  }
-}
-
-.copy { font-size: small; }
-</style>
-<style>
-.view-links > span {
-    display: inline-block;
-    white-space: nowrap;
-    margin-right: 1ex;
-    margin-bottom: 1ex;
-    padding: 0.5ex;
-    border: 1pt solid;
-    border-radius: 1ex;
-    cursor: pointer;
-}
-
-.downloads, .download-links {
-  & > * {
-    display: inline-block;
-    margin-right: 1ex;
-    margin-bottom: 1ex;
-    padding: 0.5ex;
-    border: 1px solid;
-    border-radius: 1ex;
-    cursor: pointer;
-  }
-}
-
-.downloads, .view-links {
-  & > .selected {
-    color: var(--link);
-  }
-}
-
-.text-and-file {
-  position:relative;
-
-  textarea {
-    width: 64em;
-  }
-
-  input[type="file"] {
-    position:absolute;
-    bottom:0;right:0;
-  }
-}
-</style>
 <script src="/ui/jsonpatch.min-942279a1c4209cc2.js" integrity="sha384-GcPrkRS12jtrElEkbJcrZ8asvvb9s3mc+CUq9UW/8bL4L0bpkmh9M+oFnWN6qLq2"></script>
-<script src="/ui/app-492d80052b1d2654.js" defer integrity="sha384-uSjgCS+NzQPUHO1r5S81fX5l/4Q/MVAvhLXeDfu/fFdDRUzHu/EBrKEw8v5OQeMv" type="module"></script>
+<script src="/ui/app-7f4645e84eaae7ce.js" defer integrity="sha384-31uiQnXVSPLDq61o+chfyKRkSdkmzv023M7KafOo+0xRw5AM70BUFyYO6yo0kPiZ" type="module"></script>
 <script src="/ui/Downloads-c9374f19f52c46d.js" integrity="sha384-WQIkCSxlUkvu4jFIWwS3bESMaazGwwnBn9dyvB7nItz3L8BmusRMsJACzfJa7sC4"></script>
 <script src="/ui/GetCopy-7e3c9678f9647d40.js" integrity="sha384-LzxUXylxE/t25HyTch8y2qvKcehvP2nqCo37swIBGEKZZUzHVJVQrS5UJDWNskTA"></script>
 <script src="/ui/Cluster-703dcdca97841304.js" integrity="sha384-ifGpq/GB1nDfqczm5clTRtcfnc9UMkT+SptMyS3UG9Di3xoKORtOGGjmK5RnJx+v"></script>

html/ui/style.css

@@ -0,0 +1,195 @@
+:root {
+    --bg: #eee;
+    --color: black;
+    --bevel-dark:  darkgray;
+    --bevel-light: lightgray;
+    --link: blue;
+    --input-bg: #ddd;
+    --input-text: white;
+    --btn-bg: #eee;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --bg: black;
+    --color: orange;
+    --bevel-dark:  #402900;
+    --bevel-light: #805300;
+    --link: #31b0fa;
+    --input-bg: #111;
+    --input-text: #ddd;
+    --btn-bg: #222;
+  }
+}
+
+body {
+    background: var(--bg);
+    color: var(--color);
+}
+
+button[disabled] {
+    opacity: 0.5;
+}
+
+a[href], a[href]:visited, button.link {
+    border: none;
+    color: var(--link);
+    background: none;
+    cursor: pointer;
+    text-decoration: none;
+}
+
+table {
+    border-collapse: collapse;
+}
+th, td {
+    border-left:   dotted 1pt;
+    border-right:  dotted 1pt;
+    border-bottom: dotted 1pt;
+    padding: 2pt 4pt;
+}
+tr:first-child > th {
+    border-top: dotted 1pt;
+}
+th, tr:last-child > td {
+    border-bottom: solid 1pt;
+}
+
+.flat > * { margin-left: 1ex; }
+.flat > *:first-child { margin-left: 0; }
+
+.green { color: green; }
+.red   { color: red; }
+
+@media (prefers-color-scheme: dark) {
+  .red { color: #c00; }
+}
+
+textarea, select, input {
+    background: var(--input-bg);
+    color: var(--input-text);
+    border: solid 1pt;
+    border-color:  var(--bevel-light);
+    border-top-color:  var(--bevel-dark);
+    border-left-color: var(--bevel-dark);
+    margin: 1pt;
+
+    &:focus {
+      outline: solid 1pt var(--color);
+    }
+  }
+
+button, input[type=button], input[type=submit], ::file-selector-button {
+    background: var(--btn-bg);
+    color: var(--color);
+    border: solid 2pt;
+    border-color:  var(--bevel-dark);
+    border-top-color:  var(--bevel-light);
+    border-left-color: var(--bevel-light);
+
+    &:hover {
+      background: var(--bevel-dark);
+    }
+    &:active {
+      background: var(--bevel-dark);
+      border-color: var(--bevel-light);
+    }
+}
+
+header {
+    display: flex;
+    align-items: center;
+    border-bottom: 2pt solid;
+    margin: 0 0 1em 0;
+    padding: 1ex;
+    justify-content: space-between;
+}
+#logo > img {
+    vertical-align: middle;
+}
+header .utils > * {
+    margin-left: 1ex;
+}
+
+.error {
+    display: flex;
+    position: relative;
+    background: rgba(255,0,0,0.2);
+    border: 1pt solid red;
+    justify-content: space-between;
+    align-items: center;
+}
+.error .btn-close,
+.error .code {
+    background: #600;
+    color: white;
+    font-weight: bold;
+    border: none;
+    align-self: stretch;
+    padding: 1ex 1em;
+}
+.error .code {
+    order: 1;
+
+    display: flex;
+    align-items: center;
+    text-align: center;
+}
+.error .message {
+    order: 2;
+    padding: 1ex 2em;
+}
+.error .btn-close {
+    order: 3;
+}
+
+.sheets {
+    display: flex;
+    align-items: stretch;
+}
+.sheets > div {
+    margin: 0 1ex;
+    border: 1pt solid;
+    border-radius: 6pt;
+}
+.sheets .title {
+    text-align: center;
+    font-weight: bold;
+    font-size: large;
+    padding: 2pt 6pt;
+    background: rgba(127,127,127,0.5);
+}
+.sheets .section {
+    padding: 2pt 6pt 2pt 6pt;
+    font-weight: bold;
+    border-top: 1px dotted;
+}
+.sheets section {
+    margin: 2pt 6pt 6pt 6pt;
+}
+.sheets > *:last-child > table:last-child > tr:last-child > td {
+    border-bottom: none;
+}
+
+.notif {
+    display: inline-block;
+    position: relative;
+}
+.notif > div:first-child {
+    position: absolute;
+    min-width: 100%; height: 100%;
+    background: white;
+    opacity: 75%;
+    text-align: center;
+}
+
+.links > * { margin-left: 1ex; }
+.links > *:first-child { margin-left: 0; }
+
+@media (prefers-color-scheme: dark) {
+  .notif > div:first-child {
+    background: black;
+  }
+}
+
+.copy { font-size: small; }

ui/build

@@ -0,0 +1 @@
+trunk build --release

ui/index.html

@@ -6,8 +6,9 @@
 <link data-trunk rel="copy-file" href="favicon.ico" />
 <link rel="icon" href="favicon.ico" />
 <link data-trunk rel="copy-file" href="js/vue.esm-browser.js" />
-<link data-trunk rel="inline" href="style.css" />
+<link data-trunk rel="copy-file" href="style.css" />
-<link data-trunk rel="inline" href="app.css" />
+<link data-trunk rel="copy-file" href="app.css" />
+<style>@import url('/ui/style.css');@import url('/ui/app.css');</style>
 <script data-trunk src="js/jsonpatch.min.js"></script>
 <script data-trunk src="js/app.js" type="module" defer></script>
 <script data-trunk src="js/Downloads.js"></script>

ui/js/app.js

@@ -133,7 +133,12 @@ createApp({
             })
         },
         uploadConfig() {
-            this.apiPost('/configs', this.$refs.configUpload.files[0], (v) => {}, "text/vnd.yaml")
+            const file = this.$refs.configUpload.files[0];
+            let contentType = "text/vnd.yaml";
+            if (file.name.endsWith(".json")) {
+                contentType = "application/json";
+            }
+            this.apiPost('/configs', file, (v) => {}, contentType, true)
         },
         hostFromTemplateAdd() {
             let v = this.forms.hostFromTemplate;
@@ -148,7 +153,7 @@ createApp({
             }
             this.apiDelete('/hosts-from-template/'+v, (v) => { this.forms.hostFromTemplateDel = "" });
         },
-        apiPost(action, data, onload, contentType = 'application/json') {
+        apiPost(action, data, onload, contentType = 'application/json', raw = false) {
             event.preventDefault()
 
             if (data === undefined) {
@@ -190,7 +195,7 @@ createApp({
                 xhr.setRequestHeader('Authorization', 'Bearer '+this.session.token)
             }
 
-            if (contentType == "application/json") {
+            if (!raw && contentType == "application/json") {
                 xhr.send(JSON.stringify(data))
             } else {
                 xhr.send(data)