From 34ecb1b54f640e171d9e1e213d4f7a25cf8e81f0 Mon Sep 17 00:00:00 2001
From: Thomas Miceli <tho.miceli@gmail.com>
Date: Mon, 14 Oct 2024 18:22:35 +0200
Subject: [PATCH] Render SVG file

---
 internal/render/highlight.go    | 28 ++++++++++++++++++++++++----
 internal/web/server.go          |  3 +++
 public/embed.scss               |  4 ++++
 public/style.css                |  4 ++++
 templates/pages/gist.html       |  2 ++
 templates/pages/gist_embed.html |  2 ++
 6 files changed, 39 insertions(+), 4 deletions(-)

diff --git a/internal/render/highlight.go b/internal/render/highlight.go
index 2098c2c7..18a4bb1b 100644
--- a/internal/render/highlight.go
+++ b/internal/render/highlight.go
@@ -3,6 +3,7 @@ package render
 import (
 	"bufio"
 	"bytes"
+	"encoding/base64"
 	"fmt"
 	"github.com/alecthomas/chroma/v2"
 	"github.com/alecthomas/chroma/v2/formatters/html"
@@ -11,6 +12,7 @@ import (
 	"github.com/rs/zerolog/log"
 	"github.com/thomiceli/opengist/internal/db"
 	"github.com/thomiceli/opengist/internal/git"
+	"path"
 	"sync"
 )
 
@@ -28,18 +30,22 @@ type RenderedGist struct {
 }
 
 func HighlightFile(file *git.File) (RenderedFile, error) {
-	rendered := RenderedFile{
-		File: file,
-	}
-
 	style := newStyle()
 	lexer := newLexer(file.Filename)
+
 	if lexer.Config().Name == "markdown" {
 		return MarkdownFile(file)
 	}
+	if lexer.Config().Name == "XML" && path.Ext(file.Filename) == ".svg" {
+		return RenderSvgFile(file), nil
+	}
 
 	formatter := html.New(html.WithClasses(true), html.PreventSurroundingPre(true))
 
+	rendered := RenderedFile{
+		File: file,
+	}
+
 	iterator, err := lexer.Tokenise(nil, file.Content+"\n")
 	if err != nil {
 		return rendered, err
@@ -140,6 +146,20 @@ func HighlightGistPreview(gist *db.Gist) (RenderedGist, error) {
 	return rendered, err
 }
 
+func RenderSvgFile(file *git.File) RenderedFile {
+	rendered := RenderedFile{
+		File: file,
+	}
+
+	encoded := base64.StdEncoding.EncodeToString([]byte(file.Content))
+	content := `<img src="data:image/svg+xml;base64,` + encoded + `" />`
+
+	rendered.HTML = content
+	rendered.Type = "SVG"
+
+	return rendered
+}
+
 func parseFileTypeName(config chroma.Config) string {
 	fileType := config.Name
 	if fileType == "fallback" || fileType == "plaintext" {
diff --git a/internal/web/server.go b/internal/web/server.go
index 4869b6e8..9723591e 100644
--- a/internal/web/server.go
+++ b/internal/web/server.go
@@ -65,6 +65,9 @@ var (
 		"isCsv": func(i string) bool {
 			return strings.ToLower(filepath.Ext(i)) == ".csv"
 		},
+		"isSvg": func(i string) bool {
+			return strings.ToLower(filepath.Ext(i)) == ".svg"
+		},
 		"csvFile": func(file *git.File) *git.CsvFile {
 			if strings.ToLower(filepath.Ext(file.Filename)) != ".csv" {
 				return nil
diff --git a/public/embed.scss b/public/embed.scss
index 5ac19410..63effbb1 100644
--- a/public/embed.scss
+++ b/public/embed.scss
@@ -107,6 +107,10 @@ dl.dl-config dd {
     @apply overflow-auto whitespace-pre;
 }
 
+.markdown-body img {
+    @apply bg-transparent dark:bg-transparent;
+}
+
 .chroma.preview.markdown pre code {
     @apply p-4;
 }
diff --git a/public/style.css b/public/style.css
index 85422f2c..4659e5c7 100644
--- a/public/style.css
+++ b/public/style.css
@@ -167,6 +167,10 @@ dl.dl-config dd {
     @apply overflow-auto whitespace-pre !important;
 }
 
+.markdown-body img {
+    @apply bg-transparent dark:bg-transparent !important;
+}
+
 .chroma.preview.markdown pre code {
     @apply p-4 !important;
 }
diff --git a/templates/pages/gist.html b/templates/pages/gist.html
index 4095b0cd..26cbe8f3 100644
--- a/templates/pages/gist.html
+++ b/templates/pages/gist.html
@@ -68,6 +68,8 @@
                     </table>
                 {{ else if isMarkdown $file.Filename }}
                     <div class="chroma markdown markdown-body p-8">{{ $file.HTML | safe }}</div>
+                {{ else if isSvg $file.Filename }}
+                    <div class="p-8 flex justify-center">{{ $file.HTML | safe }}</div>
                 {{ else }}
                     <div class="code">
                         {{ $fileslug := slug $file.Filename }}
diff --git a/templates/pages/gist_embed.html b/templates/pages/gist_embed.html
index e051c763..65159775 100644
--- a/templates/pages/gist_embed.html
+++ b/templates/pages/gist_embed.html
@@ -32,6 +32,8 @@
             </table>
             {{ else if isMarkdown $file.Filename }}
             <div class="chroma markdown markdown-body p-8">{{ $file.HTML | safe }}</div>
+            {{ else if isSvg $file.Filename }}
+            <div class="p-8 flex justify-center">{{ $file.HTML | safe }}</div>
             {{ else }}
             <div class="code dark:bg-gray-900">
             {{ $fileslug := slug $file.Filename }}