+1

appview/pages/templates/fragments/tabSelector.html

··· 9 9 {{ range $index, $value := $all }} 10 10 {{ $isActive := eq $value.Key $active }} 11 11 <a href="?{{ $name }}={{ $value.Key }}" 12 12 + hx-boost 12 13 {{ if $include }} 13 14 hx-get="?{{ $name }}={{ $value.Key }}" 14 15 hx-include="{{ $include }}"

+1 -1

appview/pages/templates/repo/fragments/diff.html

··· 18 18 {{ range $idx, $hunk := $diff }} 19 19 {{ with $hunk }} 20 20 <details open id="file-{{ .Id }}" class="group border border-gray-200 dark:border-gray-700 w-full mx-auto rounded bg-white dark:bg-gray-800 drop-shadow-sm" tabindex="{{ add $idx 1 }}"> 21 21 - <summary class="list-none cursor-pointer sticky top-0"> 21 21 + <summary class="list-none cursor-pointer sticky top-12"> 22 22 <div id="diff-file-header" class="rounded cursor-pointer bg-white dark:bg-gray-800 flex justify-between"> 23 23 <div id="left-side-items" class="p-2 flex gap-2 items-center overflow-x-auto"> 24 24 <span class="group-open:hidden inline">{{ i "chevron-right" "w-4 h-4" }}</span>

+1 -8

appview/pages/templates/repo/fragments/diffChangedFiles.html

··· 1 1 {{ define "repo/fragments/diffChangedFiles" }} 2 2 - {{ $stat := .Stat }} 3 2 {{ $fileTree := fileTree .ChangedFiles }} 4 3 <section class="overflow-x-auto text-sm px-6 py-2 border border-gray-200 dark:border-gray-700 w-full mx-auto min-h-full rounded bg-white dark:bg-gray-800 drop-shadow-sm"> 5 5 - <div class="diff-stat"> 6 6 - <div class="flex gap-2 items-center"> 7 7 - <strong class="text-sm uppercase dark:text-gray-200">Changed files</strong> 8 8 - {{ template "repo/fragments/diffStatPill" $stat }} 9 9 - </div> 10 10 - {{ template "repo/fragments/fileTree" $fileTree }} 11 11 - </div> 4 4 + {{ template "repo/fragments/fileTree" $fileTree }} 12 5 </section> 13 6 {{ end }}

+22 -25

appview/pages/templates/repo/fragments/diffOpts.html

··· 1 1 {{ define "repo/fragments/diffOpts" }} 2 2 - <section class="flex flex-col gap-2 overflow-x-auto text-sm px-6 py-2 border border-gray-200 dark:border-gray-700 w-full mx-auto rounded bg-white dark:bg-gray-800 drop-shadow-sm"> 3 3 - <strong class="text-sm uppercase dark:text-gray-200">options</strong> 4 4 - {{ $active := "unified" }} 5 5 - {{ if .Split }} 6 6 - {{ $active = "split" }} 7 7 - {{ end }} 2 2 + {{ $active := "unified" }} 3 3 + {{ if .Split }} 4 4 + {{ $active = "split" }} 5 5 + {{ end }} 8 6 9 9 - {{ $unified := 10 10 - (dict 11 11 - "Key" "unified" 12 12 - "Value" "unified" 13 13 - "Icon" "square-split-vertical" 14 14 - "Meta" "") }} 15 15 - {{ $split := 16 16 - (dict 17 17 - "Key" "split" 18 18 - "Value" "split" 19 19 - "Icon" "square-split-horizontal" 20 20 - "Meta" "") }} 21 21 - {{ $values := list $unified $split }} 7 7 + {{ $unified := 8 8 + (dict 9 9 + "Key" "unified" 10 10 + "Value" "unified" 11 11 + "Icon" "square-split-vertical" 12 12 + "Meta" "") }} 13 13 + {{ $split := 14 14 + (dict 15 15 + "Key" "split" 16 16 + "Value" "split" 17 17 + "Icon" "square-split-horizontal" 18 18 + "Meta" "") }} 19 19 + {{ $values := list $unified $split }} 22 20 23 23 - {{ template "fragments/tabSelector" 24 24 - (dict 25 25 - "Name" "diff" 26 26 - "Values" $values 27 27 - "Active" $active) }} 28 28 - </section> 21 21 + {{ template "fragments/tabSelector" 22 22 + (dict 23 23 + "Name" "diff" 24 24 + "Values" $values 25 25 + "Active" $active) }} 29 26 {{ end }} 30 27

+11 -11

appview/pages/templates/repo/pulls/fragments/pullActions.html

··· 22 22 {{ $isLastRound := eq $roundNumber $lastIdx }} 23 23 {{ $isSameRepoBranch := .Pull.IsBranchBased }} 24 24 {{ $isUpToDate := .ResubmitCheck.No }} 25 25 - <div id="actions-{{$roundNumber}}" class="flex flex-wrap gap-2 relative py-2 px-4"> 25 25 + <div id="actions-{{$roundNumber}}" class="flex flex-wrap gap-2 relative p-2"> 26 26 <button 27 27 hx-get="/{{ .RepoInfo.FullName }}/pulls/{{ .Pull.PullId }}/round/{{ $roundNumber }}/comment" 28 28 hx-target="#actions-{{$roundNumber}}" 29 29 hx-swap="outerHtml" 30 30 class="btn-flat p-2 flex items-center gap-2 no-underline hover:no-underline group"> 31 31 - {{ i "message-square-plus" "w-4 h-4" }} 32 32 - <span>comment</span> 31 31 + {{ i "message-square-plus" "w-4 h-4 inline group-[.htmx-request]:hidden" }} 33 32 {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 33 33 + comment 34 34 </button> 35 35 {{ if .BranchDeleteStatus }} 36 36 <button ··· 53 53 hx-swap="none" 54 54 hx-confirm="Are you sure you want to merge pull #{{ .Pull.PullId }} into the `{{ .Pull.TargetBranch }}` branch?" 55 55 class="btn-flat p-2 flex items-center gap-2 group" {{ $disabled }}> 56 56 - {{ i "git-merge" "w-4 h-4" }} 57 57 - <span>merge{{if $stackCount}} {{$stackCount}}{{end}}</span> 56 56 + {{ i "git-merge" "w-4 h-4 inline group-[.htmx-request]:hidden" }} 58 57 {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 58 58 + merge{{if $stackCount}} {{$stackCount}}{{end}} 59 59 </button> 60 60 {{ end }} 61 61 ··· 82 82 title="Resubmit this pull request" 83 83 {{ end }} 84 84 > 85 85 - {{ i "rotate-ccw" "w-4 h-4" }} 86 86 - <span>resubmit</span> 85 85 + {{ i "rotate-ccw" "w-4 h-4 inline group-[.htmx-request]:hidden" }} 87 86 {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 87 87 + resubmit 88 88 </button> 89 89 {{ end }} 90 90 ··· 93 93 hx-post="/{{ .RepoInfo.FullName }}/pulls/{{ .Pull.PullId }}/close" 94 94 hx-swap="none" 95 95 class="btn-flat p-2 flex items-center gap-2 group"> 96 96 - {{ i "ban" "w-4 h-4" }} 97 97 - <span>close</span> 96 96 + {{ i "ban" "w-4 h-4 inline group-[.htmx-request]:hidden" }} 98 97 {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 98 98 + close 99 99 </button> 100 100 {{ end }} 101 101 ··· 104 104 hx-post="/{{ .RepoInfo.FullName }}/pulls/{{ .Pull.PullId }}/reopen" 105 105 hx-swap="none" 106 106 class="btn-flat p-2 flex items-center gap-2 group"> 107 107 - {{ i "refresh-ccw-dot" "w-4 h-4" }} 108 108 - <span>reopen</span> 107 107 + {{ i "refresh-ccw-dot" "w-4 h-4 inline group-[.htmx-request]:hidden" }} 109 108 {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 109 109 + reopen 110 110 </button> 111 111 {{ end }} 112 112 </div>

+39 -24

appview/pages/templates/repo/pulls/fragments/pullNewComment.html

··· 1 1 {{ define "repo/pulls/fragments/pullNewComment" }} 2 2 <div 3 3 id="pull-comment-card-{{ .RoundNumber }}" 4 4 - class="bg-white dark:bg-gray-800 rounded drop-shadow-sm p-4 relative w-full flex flex-col gap-2"> 5 5 - <div class="text-sm text-gray-500 dark:text-gray-400"> 6 6 - {{ resolve .LoggedInUser.Did }} 7 7 - </div> 4 4 + class="w-full flex flex-col gap-2"> 5 5 + {{ template "user/fragments/picHandleLink" .LoggedInUser.Did }} 8 6 <form 9 7 hx-post="/{{ .RepoInfo.FullName }}/pulls/{{ .Pull.PullId }}/round/{{ .RoundNumber }}/comment" 10 10 - hx-indicator="#create-comment-spinner" 11 8 hx-swap="none" 12 12 - class="w-full flex flex-wrap gap-2" 9 9 + hx-on::after-request="if(event.detail.successful) this.reset()" 10 10 + hx-disabled-elt="#reply-{{ .RoundNumber }}" 11 11 + class="w-full flex flex-wrap gap-2 group" 13 12 > 14 13 <textarea 15 14 name="body" 16 15 class="w-full p-2 rounded border border-gray-200" 16 16 + rows=8 17 17 placeholder="Add to the discussion..."></textarea 18 18 > 19 19 - <button type="submit" class="btn flex items-center gap-2"> 20 20 - {{ i "message-square" "w-4 h-4" }} 21 21 - <span>comment</span> 22 22 - <span id="create-comment-spinner" class="group"> 23 23 - {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 24 24 - </span> 25 25 - </button> 26 26 - <button 27 27 - type="button" 28 28 - class="btn flex items-center gap-2 group" 29 29 - hx-get="/{{ .RepoInfo.FullName }}/pulls/{{ .Pull.PullId }}/round/{{ .RoundNumber }}/actions" 30 30 - hx-swap="outerHTML" 31 31 - hx-target="#actions-{{.RoundNumber}}" 32 32 - > 33 33 - {{ i "x" "w-4 h-4" }} 34 34 - <span>cancel</span> 35 35 - {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 36 36 - </button> 19 19 + {{ template "replyActions" . }} 37 20 <div id="pull-comment"></div> 38 21 </form> 39 22 </div> 40 23 {{ end }} 24 24 + 25 25 + {{ define "replyActions" }} 26 26 + <div class="flex flex-wrap items-stretch justify-end gap-2 text-gray-500 dark:text-gray-400 text-sm w-full"> 27 27 + {{ template "cancel" . }} 28 28 + {{ template "reply" . }} 29 29 + </div> 30 30 + {{ end }} 31 31 + 32 32 + {{ define "cancel" }} 33 33 + <button 34 34 + type="button" 35 35 + class="btn text-red-500 dark:text-red-400 flex gap-2 items-center group" 36 36 + hx-get="/{{ .RepoInfo.FullName }}/pulls/{{ .Pull.PullId }}/round/{{ .RoundNumber }}/actions" 37 37 + hx-swap="outerHTML" 38 38 + hx-target="#actions-{{.RoundNumber}}" 39 39 + > 40 40 + {{ i "x" "w-4 h-4" }} 41 41 + <span>cancel</span> 42 42 + </button> 43 43 + {{ end }} 44 44 + 45 45 + {{ define "reply" }} 46 46 + <button 47 47 + type="submit" 48 48 + id="reply-{{ .RoundNumber }}" 49 49 + class="btn-create flex items-center gap-2"> 50 50 + {{ i "reply" "w-4 h-4 inline group-[.htmx-request]:hidden" }} 51 51 + {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }} 52 52 + reply 53 53 + </button> 54 54 + {{ end }} 55 55 +

+49 -9

appview/pages/templates/repo/pulls/pull.html

··· 15 15 {{ end }} 16 16 17 17 {{ define "repoContentLayout" }} 18 18 - <div class="grid grid-cols-1 md:grid-cols-10 gap-4 w-full"> 18 18 + <div class="grid grid-cols-1 md:grid-cols-10 gap-y-2 gap-x-4 w-full"> 19 19 <div class="col-span-1 md:col-span-7"> 20 20 <section class="bg-white dark:bg-gray-800 p-6 rounded relative w-full mx-auto dark:text-white h-full"> 21 21 {{ block "repoContent" . }}{{ end }} ··· 35 35 {{ template "repo/fragments/externalLinkPanel" $.Pull.AtUri }} 36 36 </div> 37 37 38 38 - <div class="col-span-1 md:col-span-7"> 39 39 - {{ template "repo/fragments/diff" (list .Diff .DiffOpts) }} 38 38 + <style> 39 39 + #filesToggle:checked ~ div label[for="filesToggle"] .show-text { display: none; } 40 40 + #filesToggle:checked ~ div label[for="filesToggle"] .hide-text { display: inline; } 41 41 + #filesToggle:not(:checked) ~ div label[for="filesToggle"] .hide-text { display: none; } 42 42 + 43 43 + #filesToggle:checked ~ div div#files { width: 10vw; margin-right: 1rem; } 44 44 + #filesToggle:not(:checked) ~ div div#files { width: 0; display: hidden; margin-right: 0; } 45 45 + 46 46 + #subsToggle:checked ~ div div#subs { width: 25vw; margin-left: 1rem; } 47 47 + #subsToggle:not(:checked) ~ div div#subs { width: 0; display: hidden; margin-left: 0; } 48 48 + </style> 49 49 + 50 50 + <!-- Checkboxes must come first as siblings --> 51 51 + <input type="checkbox" id="filesToggle" class="peer/files hidden" checked/> 52 52 + <input type="checkbox" id="subsToggle" class="peer/subs hidden" checked/> 53 53 + 54 54 + <!-- Top bar with controls --> 55 55 + <div class="sticky top-0 z-30 bg-slate-100 dark:bg-gray-900 flex items-center gap-2 col-span-full h-12"> 56 56 + <label for="filesToggle" class="inline-flex items-center justify-center rounded cursor-pointer p-2 text-normal font-normal normalcase"> 57 57 + <span class="show-text">{{ i "panel-left-open" "size-5" }}</span> 58 58 + <span class="hide-text">{{ i "panel-left-close" "size-5" }}</span> 59 59 + </label> 60 60 + {{ template "repo/fragments/diffStatPill" .Diff.Stat }} 61 61 + {{ .Diff.Stat.FilesChanged }} changed file{{ if ne .Diff.Stat.FilesChanged 1 }}s{{ end }} 62 62 + <div class="flex-grow"></div> 63 63 + {{ template "repo/fragments/diffOpts" .DiffOpts }} 64 64 + <label for="subsToggle" class="inline-flex items-center justify-center rounded cursor-pointer p-2"> 65 65 + {{ i "message-square-more" "size-5" }} 66 66 + </label> 40 67 </div> 41 41 - <div class="col-span-1 md:col-span-3 flex flex-col max-h-dvh sticky top-0"> 42 42 - <div class="z-20 sticky top-0 rounded-t p-3 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700"> 43 43 - <h2 class="font-bold uppercase">history</h2> 68 68 + 69 69 + <div class="flex col-span-full"> 70 70 + <!-- left panel --> 71 71 + <div id="files" class="w-0 overflow-hidden sticky top-12 max-h-screen overflow-y-auto pb-12"> 72 72 + {{ template "repo/fragments/diffChangedFiles" .Diff }} 73 73 + </div> 74 74 + 75 75 + <!-- main content --> 76 76 + <div class="flex-1 min-w-0 sticky top-12 pb-12"> 77 77 + {{ template "repo/fragments/diff" (list .Diff .DiffOpts) }} 44 78 </div> 45 45 - <div class="flex flex-col-reverse gap-4 overflow-y-auto"> 46 46 - {{ template "submissions2" . }} 79 79 + 80 80 + <!-- right panel --> 81 81 + <div id="subs" class="w-0 overflow-hidden max-h-screen flex flex-col sticky top-12 pb-12"> 82 82 + <div class="z-20 sticky top-0 rounded-t p-3 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700"> 83 83 + <h2 class="font-bold uppercase">history</h2> 84 84 + </div> 85 85 + <div class="flex flex-col-reverse gap-4 overflow-y-auto"> 86 86 + {{ template "submissions2" . }} 87 87 + </div> 47 88 </div> 48 89 </div> 49 90 </div> ··· 51 92 52 93 {{ define "repoContent" }} 53 94 {{ template "repo/pulls/fragments/pullHeader" . }} 54 54 - 55 95 {{ if .Pull.IsStacked }} 56 96 <div class="mt-8"> 57 97 {{ template "repo/pulls/fragments/pullStack" . }}

+4 -2

types/diff.go

··· 27 27 } 28 28 29 29 type DiffStat struct { 30 30 - Insertions int64 31 31 - Deletions int64 30 30 + Insertions int64 31 31 + Deletions int64 32 32 + FilesChanged int 32 33 } 33 34 34 35 func (d *Diff) Stats() DiffStat { ··· 37 38 stats.Insertions += f.LinesAdded 38 39 stats.Deletions += f.LinesDeleted 39 40 } 41 41 + stats.FilesChanged = len(d.TextFragments) 40 42 return stats 41 43 } 42 44