From a75e0cb90b436f2124f34d3d6b6d83c896796607 Mon Sep 17 00:00:00 2001
From: eti <eti@eti.tf>
Date: Thu, 25 Jun 2026 20:14:15 +0200
Subject: [PATCH] appview/pages: add [view file] button

![](https://x.eti.tf/9ee3f60.png)

resolves
[TAN-456](https://linear.app/tangled/issue/TAN-456/in-diff-view-add-open-full-file-button)

Signed-off-by: eti <eti@eti.tf>
---
 appview/pages/templates/repo/commit.html      |  2 +-
 .../pages/templates/repo/compare/compare.html |  2 +-
 .../pages/templates/repo/fragments/diff.html  | 25 ++++++++++++++++---
 input.css                                     |  4 +--
 4 files changed, 26 insertions(+), 7 deletions(-)

diff --git a/appview/pages/templates/repo/commit.html b/appview/pages/templates/repo/commit.html
index 3b992670..57e7c7ec 100644
--- a/appview/pages/templates/repo/commit.html
+++ b/appview/pages/templates/repo/commit.html
@@ -153,5 +153,5 @@
 
 
 {{ define "contentAfter" }}
-  {{ template "repo/fragments/diff" (list .Diff .DiffOpts) }}
+  {{ template "repo/fragments/diff" (list .Diff .DiffOpts "" (printf "/%s/blob/%s" .RepoInfo.FullName (pathEscape .Diff.Commit.This))) }}
 {{end}}
diff --git a/appview/pages/templates/repo/compare/compare.html b/appview/pages/templates/repo/compare/compare.html
index 36af0e99..a744f9c0 100644
--- a/appview/pages/templates/repo/compare/compare.html
+++ b/appview/pages/templates/repo/compare/compare.html
@@ -21,5 +21,5 @@
 {{ end }}
 
 {{ define "contentAfter" }}
-  {{ template "repo/fragments/diff" (list .Diff .DiffOpts) }}
+  {{ template "repo/fragments/diff" (list .Diff .DiffOpts "" (printf "/%s/blob/%s" .RepoInfo.FullName (pathEscape .Head))) }}
 {{end}}
diff --git a/appview/pages/templates/repo/fragments/diff.html b/appview/pages/templates/repo/fragments/diff.html
index 8e74fbf7..3a0edc07 100644
--- a/appview/pages/templates/repo/fragments/diff.html
+++ b/appview/pages/templates/repo/fragments/diff.html
@@ -101,7 +101,9 @@
 {{ define "diffLayout" }}
   {{ $diff := index . 0 }}
   {{ $opts := index . 1 }}
-  {{ $padBottom := gt (len .) 2 }}
+  {{ $padBottom := and (gt (len .) 2) (index . 2) }}
+  {{ $blobBase := "" }}
+  {{ if gt (len .) 3 }}{{ $blobBase = index . 3 }}{{ end }}
 
   <div class="flex col-span-full flex-grow">
     <!-- left panel -->
@@ -115,7 +117,7 @@
 
     <!-- main content -->
     <div id="diff-files" class="flex-1 min-w-0 sticky top-12 {{ if $padBottom }}pb-12{{ end }}">
-      {{ template "diffFiles" (list $diff $opts) }}
+      {{ template "diffFiles" (list $diff $opts $blobBase) }}
     </div>
 
   </div>
@@ -124,6 +126,8 @@
 {{ define "diffFiles" }}
   {{ $diff := index . 0 }}
   {{ $opts := index . 1 }}
+  {{ $blobBase := "" }}
+  {{ if gt (len .) 2 }}{{ $blobBase = index . 2 }}{{ end }}
   {{ $files := $diff.ChangedFiles }}
   {{ $isSplit := $opts.Split }}
   <div class="flex flex-col gap-4">
@@ -133,7 +137,7 @@
       </div>
     {{ else }}
       {{ range $idx, $file := $files }}
-        {{ template "diffFile" (list $idx $file $isSplit) }}
+        {{ template "diffFile" (list $idx $file $isSplit false $blobBase) }}
       {{ end }}
     {{ end }}
   </div>
@@ -145,6 +149,8 @@
   {{ $isSplit := index . 2 }}
   {{ $collapsed := false }}
   {{ if gt (len .) 3 }}{{ $collapsed = index . 3 }}{{ end }}
+  {{ $blobBase := "" }}
+  {{ if gt (len .) 4 }}{{ $blobBase = index . 4 }}{{ end }}
   {{ $isGenerated := false }}
   {{ $isDeleted := false }}
   {{ with $file }}
@@ -182,6 +188,18 @@
               {{ end }}
             </div>
           </div>
+          <div class="flex items-center pr-1">
+          {{ if and $blobBase $n.New }}
+            <a
+              href="{{ $blobBase }}/{{ $n.New }}"
+              onclick="event.stopPropagation()"
+              class="btn-flat hidden md:flex"
+              title="Open file"
+            >
+              {{ i "eye" "size-4" }}
+              <span class="hidden md:inline">View file</span>
+            </a>
+          {{ end }}
           <label
             data-review-btn="file-{{ .Id }}"
             onclick="event.stopPropagation()"
@@ -197,6 +215,7 @@
             <span class="hidden peer-checked:inline text-green-600 dark:text-green-400">{{ i "circle-check" "size-4" }}</span>
             <span class="hidden md:inline">Reviewed</span>
           </label>
+          </div>
         </div>
       </summary>
 
diff --git a/input.css b/input.css
index 5f8f0cfa..d2427f09 100644
--- a/input.css
+++ b/input.css
@@ -223,9 +223,9 @@
 
         .btn-flat {
             @apply inline-flex items-center justify-center
-          min-h-[32px] px-2 py-[6px]
+          min-h-[32px] px-2 py-[6px] gap-1.5
           rounded
-          text-sm text-gray-900 dark:text-gray-100 cursor-pointer
+          text-sm text-gray-900 dark:text-gray-100 cursor-pointer no-underline hover:no-underline
           transition-colors duration-150 ease-in-out
           focus:outline-none
           focus-visible:outline focus-visible:outline-2 focus-visible:outline-gray-400
-- 
2.51.2