From 26a298da5dbb00ee6128ca244a0dca849cae588c Mon Sep 17 00:00:00 2001
From: strowk <str.write@gmail.com>
Date: Sat, 28 Dec 2024 19:41:23 +0700
Subject: [PATCH] feat: support link in code block title (#523)

* feat: support link in code block title

* refactor: simplify code block filename link implementation

* docs: update syntax-highlighting.md

* chore: rename `filename_uri_base` to `base_url`

[skip ci]

* refactor: use `base_url` int code block implementation

---------

Co-authored-by: Xin <xin@imfing.com>
---
 .../content/docs/guide/syntax-highlighting.md  | 16 ++++++++++++++++
 layouts/_default/_markup/render-codeblock.html |  9 +++++----
 layouts/partials/components/codeblock.html     | 18 +++++++++++++++++-
 3 files changed, 38 insertions(+), 5 deletions(-)

diff --git a/exampleSite/content/docs/guide/syntax-highlighting.md b/exampleSite/content/docs/guide/syntax-highlighting.md
index 45cc50c5..42c5f617 100644
--- a/exampleSite/content/docs/guide/syntax-highlighting.md
+++ b/exampleSite/content/docs/guide/syntax-highlighting.md
@@ -40,6 +40,22 @@ def say_hello():
     print("Hello!")
 ```
 
+### Link to File
+
+You can use the `base_url` attribute to provide a base URL that will be combined with the file name to generate a link.
+
+The file name can include a relative path if it specifies the file's location within the base path.
+
+````markdown {filename="Markdown"}
+```go {base_url="https://github.com/imfing/hextra/blob/main/",filename="exampleSite/hugo.work"}
+go 1.20
+```
+````
+
+```go {base_url="https://github.com/imfing/hextra/blob/main/",filename="exampleSite/hugo.work"}
+go 1.20
+```
+
 ### Line Numbers
 
 To set line numbers, set attribute `linenos` to `table` and optionally set `linenostart` to the starting line number:
diff --git a/layouts/_default/_markup/render-codeblock.html b/layouts/_default/_markup/render-codeblock.html
index 31b3c258..fe2df204 100644
--- a/layouts/_default/_markup/render-codeblock.html
+++ b/layouts/_default/_markup/render-codeblock.html
@@ -1,12 +1,13 @@
 {{- $class := .Attributes.class | default "" -}}
 {{- $filename := .Attributes.filename | default "" -}}
+{{- $base_url := .Attributes.base_url | default "" -}}
 {{- $lang := .Attributes.lang | default .Type -}}
 
 
 <div class="hextra-code-block hx-relative hx-mt-6 first:hx-mt-0 hx-group/code">
-  {{ partial "components/codeblock" (dict "filename" $filename "lang" $lang "content" .Inner "options" .Options) }}
+  {{- partial "components/codeblock" (dict "filename" $filename "lang" $lang "base_url" $base_url "content" .Inner "options" .Options) -}}
 
-  {{- if or (eq site.Params.highlight.copy.enable nil) (site.Params.highlight.copy.enable) }}
-    {{- partialCached "components/codeblock-copy-button" (dict "filename" $filename) $filename }}
-  {{ end }}
+  {{- if or (eq site.Params.highlight.copy.enable nil) (site.Params.highlight.copy.enable) -}}
+    {{- partialCached "components/codeblock-copy-button" (dict "filename" $filename) $filename -}}
+  {{- end -}}
 </div>
diff --git a/layouts/partials/components/codeblock.html b/layouts/partials/components/codeblock.html
index f96a74ab..f5e1d8cf 100644
--- a/layouts/partials/components/codeblock.html
+++ b/layouts/partials/components/codeblock.html
@@ -1,11 +1,27 @@
 {{ $filename := .filename | default "" -}}
+{{ $base_url := .base_url | default "" -}}
 {{ $lang := .lang | default "" }}
 {{ $content := .content }}
 {{ $options := .options | default (dict) }}
 
 {{- if $filename -}}
-  <div class="filename" dir="auto">{{ $filename }}</div>
+  <div class="filename not-prose" dir="auto">
+    {{- if $base_url -}}
+
+      {{- $base_url = strings.TrimSuffix "/" $base_url -}}
+      {{- $filename = strings.TrimPrefix "/" $filename -}}
+      {{- $file_url := urls.JoinPath $base_url $filename -}}
+
+      <a class="hx-no-underline hx-inline-flex hx-items-center hx-gap-1" href="{{ $file_url }}" target="_blank" rel="noopener noreferrer">
+          <span>{{- $filename -}}</span>
+          {{- partial "utils/icon" (dict "name" "external-link" "attributes" "height=1em") -}}
+      </a>
+    {{- else -}}
+      {{- $filename -}}
+    {{- end -}}
+  </div>
 {{- end -}}
+
 {{- if transform.CanHighlight $lang -}}
   <div>{{- highlight $content $lang $options -}}</div>
 {{- else -}}