appview: add raw patch to compare params for client-side rendering #1083

pass raw patch string to template to enable client-side diff rendering with pierre diffs

Signed-off-by: dropalltables 80474621+dropalltables@users.noreply.github.com Amp-Thread-ID: https://ampcode.com/threads/T-019c7ca9-f797-773a-9650-20d5ed91167e Co-authored-by: Amp amp@ampcode.com

+58 -1

3 changed files

Diff round #1

expand all

appview

pages

pages.go

templates

repo

fragments

diff.html

repo

compare.go

appview/pages/pages.go

··· 1292 1292 Head string 1293 1293 Diff *types.NiceDiff 1294 1294 DiffOpts types.DiffOpts 1295 + RawPatch string 1295 1296 1296 1297 Active string 1297 1298 }

+54 -1

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

··· 9 9 </style> 10 10 11 11 {{ template "diffTopbar" . }} 12 - {{ block "diffLayout" . }} {{ end }} 12 + 13 +  14 + <div id="diff-server-rendered"> 15 + {{ block "diffLayout" . }} {{ end }} 16 + </div> 17 + 13 18 {{ template "fragments/resizable" }} 19 + 20 +  21 + <script src="https://cdn.jsdelivr.net/npm/@pierre/diffs@1.0.10/dist/index.js"></script> 22 + <script> 23 + window.__diffData = { 24 + patch: {{ .RawPatch | js }}, 25 + isSplit: {{ .DiffOpts.Split }} 26 + }; 27 + 28 + // Enhance with client-side rendering when library loads 29 + window.addEventListener('load', async function() { 30 + if (!window.PierreDiffs || !window.__diffData.patch) { 31 + return; // Gracefully degrade to server-rendered version 32 + } 33 + 34 + try { 35 + const { parsePatchFiles } = window.PierreDiffs; 36 + const serverContainer = document.getElementById('diff-server-rendered'); 37 + if (!serverContainer) return; 38 + 39 + // Parse patch 40 + const files = parsePatchFiles(window.__diffData.patch); 41 + 42 + // Replace server-rendered diffs with enhanced client version 43 + const newContainer = document.createElement('div'); 44 + newContainer.id = 'diff-server-rendered'; 45 + 46 + for (const file of files) { 47 + const fileDiv = document.createElement('div'); 48 + fileDiv.className = 'border border-gray-200 dark:border-gray-700 rounded bg-white dark:bg-gray-800 drop-shadow-sm mb-4'; 49 + newContainer.appendChild(fileDiv); 50 + 51 + new window.PierreDiffs.FileDiff({ 52 + oldFile: file.oldFile, 53 + newFile: file.newFile, 54 + renderOptions: { 55 + displayMode: window.__diffData.isSplit ? 'split' : 'unified' 56 + } 57 + }); 58 + } 59 + 60 + serverContainer.replaceWith(newContainer); 61 + } catch (e) { 62 + console.error('Error enhancing diffs with Pierre Diffs, keeping server version:', e); 63 + // Server-rendered version stays visible on error 64 + } 65 + }); 66 + </script> 14 67 {{ end }} 15 68 16 69 {{ define "diffTopbar" }}

appview/repo/compare.go

··· 194 194 } 195 195 196 196 var diff types.NiceDiff 197 + rawPatch := formatPatch.FormatPatchRaw 197 198 if formatPatch.CombinedPatchRaw != "" { 198 199 diff = patchutil.AsNiceDiff(formatPatch.CombinedPatchRaw, base) 200 + rawPatch = formatPatch.CombinedPatchRaw 199 201 } else { 200 202 diff = patchutil.AsNiceDiff(formatPatch.FormatPatchRaw, base) 201 203 } ··· 209 211 Head: head, 210 212 Diff: &diff, 211 213 DiffOpts: diffOpts, 214 + RawPatch: rawPatch, 212 215 }) 213 216 214 217 }

History

2 rounds 1 comment

viruus.zip submitted #1 3w

interdiff

3 commits

expand

215ebfa8

appview: add raw patch to compare params for client-side rendering

5f28c846

appview/repo/fragments: integrate pierre diffs with progressive enhancement

922234e9

appview/repo/fragments: fix pierre diffs cdn url

expand 1 comment

viruus.zip 3w

I'm going to do a lot more work on this so I'm closing this for now

closed without merging

viruus.zip submitted #0 3w

diff

2 commits

expand

215ebfa8

appview: add raw patch to compare params for client-side rendering

5f28c846

appview/repo/fragments: integrate pierre diffs with progressive enhancement

expand 0 comments