feat: add shareable link to the website (#79)

* feat: add shareable link to the website

* updated the version

* tiny refactor

README.md

@@ -79,7 +79,7 @@ cty generate -c delivery.krok.app_krokcommands --comments --minimal --format htm
 
 ### Folder source
 
-To parse mutliple CRDs in a single folder, just pass in the whole folder like this:
+To parse multiple CRDs in a single folder, just pass in the whole folder like this:
 
 ```
 cty generate -r folder
@@ -98,6 +98,16 @@ make run
 
 This will start a front-end that can be used to paste in and parse CRDs.
 
+## Shareable Link
+
+It's possible to provide a link that can be shared using a url parameter like this:
+
+```
+https://crdtoyaml.com/share?url=https://raw.githubusercontent.com/Skarlso/crd-to-sample-yaml/main/sample-crd/infrastructure.cluster.x-k8s.io_awsclusters.yaml
+```
+
+Will load the content, or display an appropriate error message.
+
 ## Comments
 
 Comments can be added to each line of the generated YAML content where descriptions are available. This looks something

docs/release_notes/v0.6.1.md

@@ -0,0 +1,3 @@
+# v0.6.1 Release
+
+- feat: add shareable link to the website (#79)

go.mod

@@ -3,7 +3,7 @@ module github.com/Skarlso/crd-to-sample-yaml
 go 1.22.0
 
 require (
-	github.com/maxence-charriere/go-app/v9 v9.8.0
+	github.com/maxence-charriere/go-app/v10 v10.0.4
 	github.com/spf13/cobra v1.8.0
 	github.com/stretchr/testify v1.9.0
 	k8s.io/apiextensions-apiserver v0.30.1
@@ -23,8 +23,8 @@ require (
 	github.com/modern-go/reflect2 v1.0.2 // indirect
 	github.com/pmezard/go-difflib v1.0.0 // indirect
 	github.com/spf13/pflag v1.0.5 // indirect
-	golang.org/x/net v0.24.0 // indirect
-	golang.org/x/text v0.14.0 // indirect
+	golang.org/x/net v0.25.0 // indirect
+	golang.org/x/text v0.15.0 // indirect
 	gopkg.in/check.v1 v1.0.0-20201130134442-10cb98267c6c // indirect
 	gopkg.in/inf.v0 v0.9.1 // indirect
 	gopkg.in/yaml.v2 v2.4.0 // indirect

go.sum

@@ -28,8 +28,8 @@ github.com/kr/pty v1.1.1/go.mod h1:pFQYn66WHrOpPYNljwOMqo10TkYh1fy3cYio2l3bCsQ=
 github.com/kr/text v0.1.0/go.mod h1:4Jbv+DJW3UT/LiOwJeYQe1efqtUx/iVham/4vfdArNI=
 github.com/kr/text v0.2.0 h1:5Nx0Ya0ZqY2ygV366QzturHI13Jq95ApcVaJBhpS+AY=
 github.com/kr/text v0.2.0/go.mod h1:eLer722TekiGuMkidMxC/pM04lWEeraHUUmBw8l2grE=
-github.com/maxence-charriere/go-app/v9 v9.8.0 h1:rDfLNvxIKXyjpRS76P45kn9Xj8IumwfoqpsEJYxfd+E=
-github.com/maxence-charriere/go-app/v9 v9.8.0/go.mod h1:gzgFoeaDuoNHw9MbJraTCKIoKtZ/SoIfOIHHn2FOffc=
+github.com/maxence-charriere/go-app/v10 v10.0.4 h1:6djvxk4RtNkuR2J5u21LlP/4yWd9UncaAHHkbO41LLU=
+github.com/maxence-charriere/go-app/v10 v10.0.4/go.mod h1:+BMrOhRAAXKUE7WFFC5Xp+Y+8atKUVvGJNePO4iMydM=
 github.com/modern-go/concurrent v0.0.0-20180228061459-e0a39a4cb421/go.mod h1:6dJC0mAP4ikYIbvyc7fijjWJddQyLn8Ig3JB5CqoB9Q=
 github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd h1:TRLaZ9cD/w8PVh93nsPXa1VrQ6jlwL5oN8l14QlcNfg=
 github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd/go.mod h1:6dJC0mAP4ikYIbvyc7fijjWJddQyLn8Ig3JB5CqoB9Q=
@@ -59,8 +59,8 @@ golang.org/x/net v0.0.0-20190404232315-eb5bcb51f2a3/go.mod h1:t9HGtf8HONx5eT2rtn
 golang.org/x/net v0.0.0-20190620200207-3b0461eec859/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s=
 golang.org/x/net v0.0.0-20200226121028-0de0cce0169b/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s=
 golang.org/x/net v0.0.0-20201021035429-f5854403a974/go.mod h1:sp8m0HH+o8qH0wwXwYZr8TS3Oi6o0r6Gce1SSxlDquU=
-golang.org/x/net v0.24.0 h1:1PcaxkF854Fu3+lvBIx5SYn9wRlBzzcnHZSiaFFAb0w=
-golang.org/x/net v0.24.0/go.mod h1:2Q7sJY5mzlzWjKtYUEXSlBWCdyaioyXzRB2RtU8KVE8=
+golang.org/x/net v0.25.0 h1:d/OCCoBEUq33pjydKrGQhw7IlUPI2Oylr+8qLx49kac=
+golang.org/x/net v0.25.0/go.mod h1:JkAGAh7GEvH74S6FOH42FLoXpXbE/aqXSrIQjXgsiwM=
 golang.org/x/sync v0.0.0-20190423024810-112230192c58/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
 golang.org/x/sync v0.0.0-20190911185100-cd5d95a43a6e/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
 golang.org/x/sync v0.0.0-20201020160332-67f06af15bc9/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
@@ -69,8 +69,8 @@ golang.org/x/sys v0.0.0-20190412213103-97732733099d/go.mod h1:h1NjWce9XRLGQEsW7w
 golang.org/x/sys v0.0.0-20200930185726-fdedc70b468f/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/text v0.3.0/go.mod h1:NqM8EUOU14njkJ3fqMW+pc6Ldnwhi/IjpwHt7yyuwOQ=
 golang.org/x/text v0.3.3/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ=
-golang.org/x/text v0.14.0 h1:ScX5w1eTa3QqT8oi6+ziP7dTV1S2+ALU0bI+0zXKWiQ=
-golang.org/x/text v0.14.0/go.mod h1:18ZOQIKpY8NJVqYksKHtTdi31H5itFRjB5/qKTNYzSU=
+golang.org/x/text v0.15.0 h1:h1V/4gjBv8v9cjcR6+AR5+/cIYK5N/WAgiv4xlsEtAk=
+golang.org/x/text v0.15.0/go.mod h1:18ZOQIKpY8NJVqYksKHtTdi31H5itFRjB5/qKTNYzSU=
 golang.org/x/tools v0.0.0-20180917221912-90fa682c2a6e/go.mod h1:n7NCudcB/nEzxVGmLbDWY5pfWTLqBcC2KZ6jyYvM4mQ=
 golang.org/x/tools v0.0.0-20191119224855-298f0cb1881e/go.mod h1:b+2E5dAYhXwXZwtnZ6UAqBI28+e2cm9otk0dWdXHAEo=
 golang.org/x/tools v0.0.0-20200619180055-7c47624df98f/go.mod h1:EkVYQZoAsY45+roYkvgYkIh4xh/qjgUK9TdY2XT94GE=

wasm/app-worker.js

@@ -1,8 +1,8 @@
-const cacheName = "app-" + "0bbe4f618b019a028888bfd14fb564d3bd34e87d";
+const cacheName = "app-" + "f8ac4218bb548048986824403cd7e3fdb9206c6d";
 const resourcesToCache = ["/","/app.css","/app.js","/manifest.webmanifest","/wasm_exec.js","/web/app.wasm","/web/css/alert.css","/web/img/logo.png","https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js","https://cdn.jsdelivr.net/npm/[email protected]/css/halfmoon.min.css","https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.11/clipboard.min.js","https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css","https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-twilight.min.css"];
 
 self.addEventListener("install", (event) => {
-  console.log("installing app worker 0bbe4f618b019a028888bfd14fb564d3bd34e87d");
+  console.log("installing app worker f8ac4218bb548048986824403cd7e3fdb9206c6d");
 
   event.waitUntil(
     caches
@@ -28,7 +28,7 @@ self.addEventListener("activate", (event) => {
       );
     })
   );
-  console.log("app worker 0bbe4f618b019a028888bfd14fb564d3bd34e87d is activated");
+  console.log("app worker f8ac4218bb548048986824403cd7e3fdb9206c6d is activated");
 });
 
 self.addEventListener("fetch", (event) => {

wasm/app.css

@@ -31,8 +31,8 @@
 }
 
 .goapp-logo {
-  max-width: 100px;
-  max-height: 100px;
+  width: 100px;
+  height: 100px;
   user-select: none;
   -moz-user-select: none;
   -webkit-user-drag: none;

wasm/app.go

@@ -2,11 +2,16 @@ package main
 
 import (
 	"bytes"
+	"errors"
 	"fmt"
+	"net/http"
+	"net/url"
 	"sort"
 	"strconv"
+	"strings"
 
-	"github.com/maxence-charriere/go-app/v9/pkg/app"
+	"github.com/Skarlso/crd-to-sample-yaml/pkg/fetcher"
+	"github.com/maxence-charriere/go-app/v10/pkg/app"
 	"k8s.io/apiextensions-apiserver/pkg/apis/apiextensions/v1beta1"
 	"k8s.io/apimachinery/pkg/util/yaml"
 
@@ -16,6 +21,7 @@ import (
 // crdView is the main component to display a rendered CRD.
 type crdView struct {
 	app.Compo
+	preRenderErr error
 
 	content []byte
 	comment bool
@@ -53,9 +59,44 @@ func (h *crdView) buildError(err error) app.UI {
 		app.Text(err.Error()))
 }
 
+func (h *crdView) OnNav(ctx app.Context) {
+	if !strings.Contains(ctx.Page().URL().String(), "share") {
+		return
+	}
+
+	u := ctx.Page().URL().Query().Get("url")
+	if u == "" {
+		h.preRenderErr = errors.New(
+			"url parameter has to be define in the following format: " +
+				"/share?url=https://example.com/crd.yaml")
+
+		return
+	}
+
+	if _, err := url.Parse(u); err != nil {
+		h.preRenderErr = fmt.Errorf("invald url provided in query: %w", err)
+
+		return
+	}
+
+	f := fetcher.NewFetcher(http.DefaultClient)
+	content, err := f.Fetch(u)
+	if err != nil {
+		h.preRenderErr = err
+
+		return
+	}
+
+	h.content = content
+}
+
 // The Render method is where the component appearance is defined. Here, a
 // "Hello World!" is displayed as a heading.
 func (h *crdView) Render() app.UI {
+	if h.preRenderErr != nil {
+		return h.buildError(h.preRenderErr)
+	}
+
 	crd := &v1beta1.CustomResourceDefinition{}
 	if err := yaml.Unmarshal(h.content, crd); err != nil {
 		return h.buildError(err)

wasm/app.js

@@ -2,11 +2,20 @@
 // go-app
 // -----------------------------------------------------------------------------
 var goappNav = function () {};
-var goappOnUpdate = function () {};
-var goappOnAppInstallChange = function () {};
 
-const goappEnv = {"GOAPP_INTERNAL_URLS":"null","GOAPP_ROOT_PREFIX":"","GOAPP_STATIC_RESOURCES_URL":"","GOAPP_VERSION":"0bbe4f618b019a028888bfd14fb564d3bd34e87d"};
+var goappUpdatedBeforeWasmLoaded = false;
+var goappOnUpdate = function () {
+  goappUpdatedBeforeWasmLoaded = true;
+};
+
+var goappAppInstallChangedBeforeWasmLoaded = false;
+var goappOnAppInstallChange = function () {
+  goappAppInstallChangedBeforeWasmLoaded = true;
+};
+
+const goappEnv = {"GOAPP_INTERNAL_URLS":"null","GOAPP_ROOT_PREFIX":"/","GOAPP_STATIC_RESOURCES_URL":"/web","GOAPP_VERSION":"f8ac4218bb548048986824403cd7e3fdb9206c6d"};
 const goappLoadingLabel = "{progress}%";
+const goappWasmContentLength = "";
 const goappWasmContentLengthHeader = "";
 
 let goappServiceWorkerRegistration;
@@ -29,7 +38,6 @@ async function goappInitServiceWorker() {
 
       goappServiceWorkerRegistration = registration;
       goappSetupNotifyUpdate(registration);
-      goappSetupAutoUpdate(registration);
       goappSetupPushNotification();
     } catch (err) {
       console.error("goapp service worker registration failed", err);
@@ -55,23 +63,19 @@ function goappSetupNotifyUpdate(registration) {
       if (!navigator.serviceWorker.controller) {
         return;
       }
-      if (newSW.state != "installed") {
+      if (newSW.state != "activated") {
         return;
       }
       goappOnUpdate();
     });
   });
 }
 
-function goappSetupAutoUpdate(registration) {
-  const autoUpdateInterval = "0";
-  if (autoUpdateInterval == 0) {
+function goappTryUpdate() {
+  if (!goappServiceWorkerRegistration) {
     return;
   }
-
-  window.setInterval(() => {
-    registration.update();
-  }, autoUpdateInterval);
+  goappServiceWorkerRegistration.update();
 }
 
 // -----------------------------------------------------------------------------
@@ -240,12 +244,14 @@ function goappCanLoadWebAssembly() {
 async function fetchWithProgress(url, progess) {
   const response = await fetch(url);
 
-  let contentLength;
-  try {
-    contentLength = response.headers.get(goappWasmContentLengthHeader);
-  } catch {}
-  if (!goappWasmContentLengthHeader || !contentLength) {
-    contentLength = response.headers.get("Content-Length");
+  let contentLength = goappWasmContentLength;
+  if (contentLength <= 0) {
+    try {
+      contentLength = response.headers.get(goappWasmContentLengthHeader);
+    } catch {}
+    if (!goappWasmContentLengthHeader || !contentLength) {
+      contentLength = response.headers.get("Content-Length");
+    }
   }
 
   const total = parseInt(contentLength, 10);

wasm/index.go

@@ -4,8 +4,9 @@ import (
 	"errors"
 	"net/http"
 
+	"github.com/maxence-charriere/go-app/v10/pkg/app"
+
 	"github.com/Skarlso/crd-to-sample-yaml/pkg/fetcher"
-	"github.com/maxence-charriere/go-app/v9/pkg/app"
 )
 
 const maximumBytes = 200 * 1000 // 200KB

wasm/index.html

@@ -1,36 +1,35 @@
 <!DOCTYPE html>
-<html data-bs-core="modern" data-bs-theme="dark" lang="en">
-<head>
-<meta charset="UTF-8">
-<meta name="author" content="Gergely Brautigam">
-<meta name="description" content>
-<meta name="keywords" content>
-<meta name="theme-color" content="#2d2c2c">
-<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, viewport-fit=cover" name="viewport">
-<meta property="og:url" content="http://127.0.0.1:50903/">
-<meta content="Preview CRDs" property="og:title">
-<meta property="og:description" content>
-<meta content="website" property="og:type">
-<meta property="og:image" content>
-<title>Preview CRDs</title>
-<link as="style" type="text/css" rel="preload" href="/app.css">
-<link href="/web/css/alert.css" as="style" type="text/css" rel="preload">
-<link as="style" type="text/css" rel="preload" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-twilight.min.css">
-<link type="text/css" rel="preload" href="https://cdn.jsdelivr.net/npm/[email protected]/css/halfmoon.min.css" as="style">
-<link type="text/css" rel="preload" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" as="style">
-<link rel="icon" href="https://raw.githubusercontent.com/maxence-charriere/go-app/master/docs/web/icon.svg">
-<link rel="apple-touch-icon" href="/web/img/logo.png">
-<link rel="manifest" href="/manifest.webmanifest">
-<link rel="stylesheet" type="text/css" href="/app.css">
-<link rel="stylesheet" type="text/css" href="/web/css/alert.css">
-<link type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-twilight.min.css" rel="stylesheet">
-<link href="https://cdn.jsdelivr.net/npm/[email protected]/css/halfmoon.min.css" rel="stylesheet" type="text/css">
-<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
-<script defer src="/wasm_exec.js"></script>
-<script defer src="/app.js"></script>
-<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.11/clipboard.min.js"></script>
-<meta charset="utf-8">
+<html data-bs-theme="dark" lang="en" data-bs-core="modern">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="author" content="Gergely Brautigam">
+    <meta name="description" content>
+    <meta name="theme-color" content="#2d2c2c">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, viewport-fit=cover">
+    <meta property="og:url" content="https://">
+    <meta content="Preview CRDs" property="og:title">
+    <meta property="og:description" content>
+    <meta property="og:type" content="website">
+    <meta property="og:image" content="https://">
+    <title>Preview CRDs</title>
+    <link type="text/css" rel="preload" as="style" href="/app.css">
+    <link href="/web/css/alert.css" type="text/css" rel="preload" as="style">
+    <link rel="preload" as="style" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-twilight.min.css" type="text/css">
+    <link rel="preload" as="style" href="https://cdn.jsdelivr.net/npm/[email protected]/css/halfmoon.min.css" type="text/css">
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css" rel="preload" as="style">
+    <link rel="icon" href="https://raw.githubusercontent.com/maxence-charriere/go-app/master/docs/web/icon.svg">
+    <link rel="apple-touch-icon" href="/web/img/logo.png">
+    <link rel="manifest" href="/manifest.webmanifest">
+    <link href="/app.css" type="text/css" rel="stylesheet">
+    <link href="/web/css/alert.css" type="text/css" rel="stylesheet">
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-twilight.min.css" type="text/css" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/css/halfmoon.min.css" type="text/css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
+    <script defer src="/wasm_exec.js"></script>
+    <script defer src="/app.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.11/clipboard.min.js"></script>
+    <meta charset="utf-8">
 			<meta name="viewport" content="width=device-width, initial-scale=1">
 			<style>
 				header{
@@ -58,12 +57,12 @@
 					list-style: none;
 				}
 			</style>
-</head>
-<body>
-<main></main>
-<aside id="app-wasm-loader" class="goapp-app-info">
-<img class="goapp-logo goapp-spin" src="/web/img/logo.png" id="app-wasm-loader-icon">
-<p id="app-wasm-loader-label" class="goapp-label">0%</p>
-</aside>
-</body>
+  </head>
+  <body>
+    <main></main>
+    <aside id="app-wasm-loader" class="goapp-app-info">
+      <img id="app-wasm-loader-icon" class="goapp-logo goapp-spin" alt="wasm loader icon" src="/web/img/logo.png">
+      <p id="app-wasm-loader-label" class="goapp-label">0%</p>
+    </aside>
+  </body>
 </html>

wasm/main.go

@@ -5,7 +5,7 @@ import (
 	"net/http"
 	"os"
 
-	"github.com/maxence-charriere/go-app/v9/pkg/app"
+	"github.com/maxence-charriere/go-app/v10/pkg/app"
 )
 
 // The main function is the entry point where the app is configured and started.
@@ -21,7 +21,12 @@ func main() {
 	//
 	// This is done by calling the Route() function,  which tells go-app what
 	// component to display for a given path, on both client and server-side.
-	app.Route("/", &index{})
+	app.Route("/", func() app.Composer {
+		return &index{}
+	})
+	app.RouteWithRegexp("^/share.*$", func() app.Composer {
+		return &crdView{}
+	})
 
 	// Once the routes set up, the next thing to do is to either launch the app
 	// or the server that serves the app.