From 3f1f808b9eeb3f7cd923c6b89fbb57583202e76d Mon Sep 17 00:00:00 2001
From: Dustin Firebaugh <dafirebaugh@gmail.com>
Date: Sat, 8 Mar 2025 23:51:58 -0500
Subject: Full-file syntax highlighting for diff pages (#33766)

Fix #33358, fix #21970

This adds a step in the `GitDiffForRender` that does syntax highlighting for the
entire file and then only references lines from that syntax highlighted
code. This allows things like multi-line comments to be syntax
highlighted correctly.

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
---
 templates/repo/diff/image_diff.tmpl | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

(limited to 'templates')

diff --git a/templates/repo/diff/image_diff.tmpl b/templates/repo/diff/image_diff.tmpl
index 608174e51b..bbd8d4a2ec 100644
--- a/templates/repo/diff/image_diff.tmpl
+++ b/templates/repo/diff/image_diff.tmpl
@@ -9,15 +9,15 @@
 		>
 			<overflow-menu class="ui secondary pointing tabular menu custom">
 				<div class="overflow-menu-items tw-justify-center">
-					<a class="item active" data-tab="diff-side-by-side-{{.file.Index}}">{{ctx.Locale.Tr "repo.diff.image.side_by_side"}}</a>
+					<a class="item active" data-tab="diff-side-by-side-{{.file.NameHash}}">{{ctx.Locale.Tr "repo.diff.image.side_by_side"}}</a>
 					{{if and .blobBase .blobHead}}
-					<a class="item" data-tab="diff-swipe-{{.file.Index}}">{{ctx.Locale.Tr "repo.diff.image.swipe"}}</a>
-					<a class="item" data-tab="diff-overlay-{{.file.Index}}">{{ctx.Locale.Tr "repo.diff.image.overlay"}}</a>
+					<a class="item" data-tab="diff-swipe-{{.file.NameHash}}">{{ctx.Locale.Tr "repo.diff.image.swipe"}}</a>
+					<a class="item" data-tab="diff-overlay-{{.file.NameHash}}">{{ctx.Locale.Tr "repo.diff.image.overlay"}}</a>
 					{{end}}
 				</div>
 			</overflow-menu>
 			<div class="image-diff-tabs is-loading">
-				<div class="ui bottom attached tab image-diff-container active" data-tab="diff-side-by-side-{{.file.Index}}">
+				<div class="ui bottom attached tab image-diff-container active" data-tab="diff-side-by-side-{{.file.NameHash}}">
 					<div class="diff-side-by-side">
 						{{if .blobBase}}
 						<span class="side">
@@ -52,7 +52,7 @@
 					</div>
 				</div>
 				{{if and .blobBase .blobHead}}
-				<div class="ui bottom attached tab image-diff-container" data-tab="diff-swipe-{{.file.Index}}">
+				<div class="ui bottom attached tab image-diff-container" data-tab="diff-swipe-{{.file.NameHash}}">
 					<div class="diff-swipe">
 						<div class="swipe-frame">
 							<span class="before-container"><img class="image-before"></span>
@@ -66,7 +66,7 @@
 						</div>
 					</div>
 				</div>
-				<div class="ui bottom attached tab image-diff-container" data-tab="diff-overlay-{{.file.Index}}">
+				<div class="ui bottom attached tab image-diff-container" data-tab="diff-overlay-{{.file.NameHash}}">
 					<div class="diff-overlay">
 						<input type="range" min="0" max="100" value="50">
 						<div class="overlay-frame">
-- 
cgit v1.2.3