From 512e495e01fe477c9ce319a04c34c10d0767d892 Mon Sep 17 00:00:00 2001
From: eti <eti@eti.tf>
Date: Tue, 26 May 2026 15:42:42 +0200
Subject: [PATCH] appview/repo: copy file contents to clipboard

this pull request adds a "copy to clipboard" button on both the readme
of a repository and the file view shown when viewing a specific file

Signed-off-by: eti <eti@eti.tf>
---
 appview/models/repo.go                        |  4 ++
 appview/pages/templates/repo/blob.html        |  8 +++-
 .../repo/fragments/copyFileButton.html        |  9 +++++
 .../repo/fragments/copyFileScript.html        | 38 +++++++++++++++++++
 .../templates/repo/fragments/readme.html      |  6 ++-
 5 files changed, 63 insertions(+), 2 deletions(-)
 create mode 100644 appview/pages/templates/repo/fragments/copyFileButton.html
 create mode 100644 appview/pages/templates/repo/fragments/copyFileScript.html

diff --git a/appview/models/repo.go b/appview/models/repo.go
index 02afc6f4..01ec43fb 100644
--- a/appview/models/repo.go
+++ b/appview/models/repo.go
@@ -236,3 +236,7 @@ func (b BlobView) IsUnsupported() bool {
 func (b BlobView) ShowingText() bool {
 	return !b.ShowingRendered
 }
+
+func (b BlobView) ShowCopy() bool {
+	return b.ContentType.IsCode() || b.ContentType.IsMarkup() || b.ContentType.IsSvg() || b.ContentType.IsImage()
+}
diff --git a/appview/pages/templates/repo/blob.html b/appview/pages/templates/repo/blob.html
index a3a5cdad..14ced910 100644
--- a/appview/pages/templates/repo/blob.html
+++ b/appview/pages/templates/repo/blob.html
@@ -48,6 +48,11 @@
                   <a href="/{{ .RepoInfo.FullName }}/raw/{{ pathEscape .Ref }}/{{ .Path }}">View raw</a>
                 {{ end }}
 
+                {{ if .BlobView.ShowCopy }}
+                  <span class="select-none px-1 md:px-2 [&:before]:content-['·']"></span>
+                  {{ template "repo/fragments/copyFileButton" (dict "Url" (printf "/%s/raw/%s/%s" .RepoInfo.FullName (pathEscape .Ref) .Path)) }}
+                {{ end }}
+
                 {{ if .BlobView.ShowToggle }}
                   <span class="select-none px-1 md:px-2 [&:before]:content-['·']"></span>
                   <a href="/{{ .RepoInfo.FullName }}/blob/{{ pathEscape .Ref }}/{{ .Path }}?code={{ .BlobView.ShowingRendered }}" hx-boost="true">
@@ -58,7 +63,7 @@
                 {{ if .BlobView.ShowingText }}
                   <div id="toggle-wrap-content" class="flex items-center">
                     <span class="select-none px-1 md:px-2 [&:before]:content-['·']"></span>
-                    <label class="flex lowercase font-normal px-1 py-0 gap-1 text-xs md:text-sm">
+                    <label class="flex items-center lowercase font-normal px-1 py-0 gap-1 text-xs md:text-sm">
                       <input id="toggle-wrap-content-checkbox" type="checkbox" name="wrap"/>
                       wrap content
                     </label>
@@ -125,6 +130,7 @@
       </div>
     {{ end }}
     {{ template "fragments/multiline-select" }}
+    {{ template "repo/fragments/copyFileScript" }}
     <script>
       (() => {
         const abortController = new AbortController();
diff --git a/appview/pages/templates/repo/fragments/copyFileButton.html b/appview/pages/templates/repo/fragments/copyFileButton.html
new file mode 100644
index 00000000..830ed510
--- /dev/null
+++ b/appview/pages/templates/repo/fragments/copyFileButton.html
@@ -0,0 +1,9 @@
+{{ define "repo/fragments/copyFileButton" }}
+<button type="button"
+    class="btn-flat gap-1.5"
+    onclick="copyRawFile(this, '{{ .Url }}')">
+    <span class="copy-check hidden">{{ i "check" "size-3.5" }}</span>
+    <span class="copy-label">copy to clipboard</span>
+    <span class="copy-spinner hidden">{{ i "loader-circle" "size-3.5 animate-spin" }}</span>
+</button>
+{{ end }}
diff --git a/appview/pages/templates/repo/fragments/copyFileScript.html b/appview/pages/templates/repo/fragments/copyFileScript.html
new file mode 100644
index 00000000..17c298f8
--- /dev/null
+++ b/appview/pages/templates/repo/fragments/copyFileScript.html
@@ -0,0 +1,38 @@
+{{ define "repo/fragments/copyFileScript" }}
+<script>
+async function copyRawFile(btn, url) {
+    const label = btn.querySelector('.copy-label');
+    const spinner = btn.querySelector('.copy-spinner');
+    label.textContent = 'copying';
+    spinner.classList.remove('hidden');
+    btn.disabled = true;
+    try {
+        const res = await fetch(url);
+        if (!res.ok) throw new Error();
+        const contentType = res.headers.get('Content-Type') || '';
+        if (contentType.startsWith('image/')) {
+            const blob = await res.blob();
+            await navigator.clipboard.write([
+                new ClipboardItem({ [contentType]: blob })
+            ]);
+        } else {
+            const text = await res.text();
+            await navigator.clipboard.writeText(text);
+        }
+        spinner.classList.add('hidden');
+        label.textContent = 'copied';
+        btn.querySelector('.copy-check').classList.remove('hidden');
+        btn.disabled = false;
+        setTimeout(() => {
+            label.textContent = 'copy to clipboard';
+            btn.querySelector('.copy-check').classList.add('hidden');
+        }, 2500);
+    } catch {
+        spinner.classList.add('hidden');
+        label.textContent = 'error';
+        btn.disabled = false;
+        setTimeout(() => { label.textContent = 'copy to clipboard'; }, 2500);
+    }
+}
+</script>
+{{ end }}
diff --git a/appview/pages/templates/repo/fragments/readme.html b/appview/pages/templates/repo/fragments/readme.html
index ee9e77f7..dcf99644 100644
--- a/appview/pages/templates/repo/fragments/readme.html
+++ b/appview/pages/templates/repo/fragments/readme.html
@@ -1,9 +1,12 @@
 {{ define "repo/fragments/readme" }}
 <div class="mt-4 rounded bg-white dark:bg-gray-800 drop-shadow-sm w-full mx-auto overflow-hidden">
     {{- if .ReadmeFileName -}}
-    <div class="px-4 py-2 border-b border-gray-200 dark:border-gray-600 flex items-center gap-2">
+    <div class="px-4 py-2 border-b border-gray-200 dark:border-gray-600 flex justify-between">
+      <span class="flex items-center gap-2">
         {{ i "file-text" "w-4 h-4" "text-gray-600 dark:text-gray-400" }}
         <span class="font-mono text-sm text-gray-800 dark:text-gray-200">{{ .ReadmeFileName }}</span>
+      </span>
+      {{ template "repo/fragments/copyFileButton" (dict "Url" (printf "/%s/raw/%s/%s" .RepoInfo.FullName (pathEscape .Ref) .ReadmeFileName)) }}
     </div>
     {{- end -}}
     <section
@@ -21,4 +24,5 @@
         {{- end -}}</article>
     </section>
 </div>
+{{ template "repo/fragments/copyFileScript" }}
 {{ end }}
-- 
2.51.2