Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Don't do a full page load when searching code #29138

Closed
wants to merge 9 commits into from
Closed

Don't do a full page load when searching code #29138

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
75ac21e
enhancement: Don't do a full page load when searching in repo
zokkis Feb 11, 2024
2b57f1c
enhancement: use same url
zokkis Feb 11, 2024
b61968e
enhancement: htmx for user/code
zokkis Feb 11, 2024
8d514df
enhancement: htmx for explore/code
zokkis Feb 11, 2024
491b66d
fix: don't replace complete searchcombo
zokkis Feb 11, 2024
6fc98e6
fix: replace paginator with htmx
zokkis Feb 11, 2024
8285bf3
fix: show empty page, when no keyword is given
zokkis Feb 11, 2024
56461b9
enhancement: folding
zokkis Feb 11, 2024
7ffd7e3
chore: linting
zokkis Feb 11, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 10 additions & 2 deletions routers/web/explore/code.go
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import (
const (
// tplExploreCode explore code page template
tplExploreCode base.TplName = "explore/code"
tplSearchBody base.TplName = "code/search_body"
)

// Code render explore code page
Expand All @@ -42,8 +43,15 @@ func Code(ctx *context.Context) {
ctx.Data["queryType"] = queryType
ctx.Data["PageIsViewCode"] = true

isHtmxRequest := len(ctx.Req.Header.Values("HX-Request")) > 0
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
isHtmxRequest := len(ctx.Req.Header.Values("HX-Request")) > 0
isHtmxRequest := ctx.Req.Header.Get("HX-Request") == "true"


template := tplExploreCode
if isHtmxRequest {
template = tplSearchBody
}

if keyword == "" {
ctx.HTML(http.StatusOK, tplExploreCode)
ctx.HTML(http.StatusOK, template)
return
}

Expand Down Expand Up @@ -131,5 +139,5 @@ func Code(ctx *context.Context) {
pager.AddParam(ctx, "l", "Language")
ctx.Data["Page"] = pager

ctx.HTML(http.StatusOK, tplExploreCode)
ctx.HTML(http.StatusOK, template)
}
16 changes: 13 additions & 3 deletions routers/web/repo/search.go
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,10 @@ import (
"code.gitea.io/gitea/modules/setting"
)

const tplSearch base.TplName = "repo/search"
const (
tplSearch base.TplName = "repo/search"
tplSearchResult base.TplName = "repo/search_result"
)

// Search render repository search page
func Search(ctx *context.Context) {
Expand All @@ -32,8 +35,15 @@ func Search(ctx *context.Context) {
ctx.Data["queryType"] = queryType
ctx.Data["PageIsViewCode"] = true

isHtmxRequest := len(ctx.Req.Header.Values("HX-Request")) > 0

template := tplSearch
if isHtmxRequest {
template = tplSearchResult
}

if keyword == "" {
ctx.HTML(http.StatusOK, tplSearch)
ctx.HTML(http.StatusOK, template)
return
}

Expand Down Expand Up @@ -63,5 +73,5 @@ func Search(ctx *context.Context) {
pager.AddParam(ctx, "l", "Language")
ctx.Data["Page"] = pager

ctx.HTML(http.StatusOK, tplSearch)
ctx.HTML(http.StatusOK, template)
}
14 changes: 11 additions & 3 deletions routers/web/user/code.go
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,8 @@ import (
)

const (
tplUserCode base.TplName = "user/code"
tplUserCode base.TplName = "user/code"
tplSearchBody base.TplName = "code/search_body"
)

// CodeSearch render user/organization code search page
Expand Down Expand Up @@ -47,8 +48,15 @@ func CodeSearch(ctx *context.Context) {
ctx.Data["queryType"] = queryType
ctx.Data["IsCodePage"] = true

isHtmxRequest := len(ctx.Req.Header.Values("HX-Request")) > 0

template := tplUserCode
if isHtmxRequest {
template = tplSearchBody
}

if keyword == "" {
ctx.HTML(http.StatusOK, tplUserCode)
ctx.HTML(http.StatusOK, template)
return
}

Expand Down Expand Up @@ -116,5 +124,5 @@ func CodeSearch(ctx *context.Context) {
pager.AddParam(ctx, "l", "Language")
ctx.Data["Page"] = pager

ctx.HTML(http.StatusOK, tplUserCode)
ctx.HTML(http.StatusOK, template)
}
12 changes: 12 additions & 0 deletions templates/code/search_body.tmpl
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<div id="search-body">
<div class="ui user list">
{{if .CodeIndexerUnavailable}}
<div class="ui error message">
<p>{{ctx.Locale.Tr "explore.code_search_unavailable"}}</p>
</div>
{{else}}
{{template "code/searchresults" .}}
{{end}}
</div>
{{template "base/paginate" .}}
</div>
16 changes: 1 addition & 15 deletions templates/code/searchcombo.tmpl
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,17 +1,3 @@
{{template "code/searchform" .}}
<div class="divider"></div>
<div class="ui user list">
{{if .CodeIndexerUnavailable}}
<div class="ui error message">
<p>{{ctx.Locale.Tr "explore.code_search_unavailable"}}</p>
</div>
{{else if .SearchResults}}
<h3>
{{ctx.Locale.Tr "explore.code_search_results" (.Keyword|Escape) | Str2html}}
</h3>
{{template "code/searchresults" .}}
{{else if .Keyword}}
<div>{{ctx.Locale.Tr "explore.code_no_results"}}</div>
{{end}}
</div>
{{template "base/paginate" .}}
{{template "code/search_body" .}}
2 changes: 1 addition & 1 deletion templates/code/searchform.tmpl
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<form class="ui form ignore-dirty">
<form class="ui form ignore-dirty" hx-get="{{.Link}}" hx-push-url="true" hx-target="next #search-body" hx-swap="innerHTML">
<div class="ui fluid action input">
{{template "shared/searchinput" dict "Value" .Keyword "Disabled" .CodeIndexerUnavailable}}
<div class="ui dropdown selection {{if .CodeIndexerUnavailable}} disabled{{end}}" data-tooltip-content="{{ctx.Locale.Tr "explore.search.type.tooltip"}}">
Expand Down
42 changes: 26 additions & 16 deletions templates/code/searchresults.tmpl
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
{{if .SearchResults}}
<h3>
{{ctx.Locale.Tr "explore.code_search_results" (.Keyword|Escape) | Str2html}}
</h3>
<div class="flex-text-block gt-fw">
{{range $term := .SearchResultLanguages}}
<a class="ui {{if eq $.Language $term.Language}}primary{{end}} basic label gt-m-0" href="{{AppSubUrl}}{{if $.ContextUser}}/{{$.ContextUser.Name}}/-/code{{else}}/explore/code{{end}}?q={{$.Keyword}}{{if ne $.Language $term.Language}}&l={{$term.Language}}{{end}}{{if ne $.queryType ""}}&t={{$.queryType}}{{end}}">
Expand All @@ -10,8 +14,9 @@
<div class="repository search">
{{range $result := .SearchResults}}
{{$repo := (index $.RepoMaps .RepoID)}}
<div class="diff-file-box diff-box file-content non-diff-file-content repo-search-result">
<div class="diff-file-box fold-container diff-box file-content non-diff-file-content repo-search-result">
<h4 class="ui top attached normal header gt-df gt-fw">
<button class="fold-button btn interact-bg gt-mr-2 gt-p-2">{{svg "octicon-chevron-down" 18}}</button>
<span class="file gt-f1">
<a rel="nofollow" href="{{$repo.Link}}">{{$repo.FullName}}</a>
{{if $repo.IsArchived}}
Expand All @@ -21,23 +26,28 @@
</span>
<a role="button" class="ui basic tiny button" rel="nofollow" href="{{$repo.Link}}/src/commit/{{$result.CommitID | PathEscape}}/{{.Filename | PathEscapeSegments}}">{{ctx.Locale.Tr "repo.diff.view_file"}}</a>
</h4>
<div class="ui attached table segment">
<div class="file-body file-code code-view">
<table>
<tbody>
<tr>
<td class="lines-num">
{{range .LineNumbers}}
<a href="{{$repo.Link}}/src/commit/{{$result.CommitID | PathEscape}}/{{$result.Filename | PathEscapeSegments}}#L{{.}}"><span>{{.}}</span></a>
{{end}}
</td>
<td class="lines-code chroma"><code class="code-inner">{{.FormattedLines}}</code></td>
</tr>
</tbody>
</table>
<div class="fold-body">
<div class="ui attached table segment">
<div class="file-body file-code code-view">
<table>
<tbody>
<tr>
<td class="lines-num">
{{range .LineNumbers}}
<a href="{{$repo.Link}}/src/commit/{{$result.CommitID | PathEscape}}/{{$result.Filename | PathEscapeSegments}}#L{{.}}"><span>{{.}}</span></a>
{{end}}
</td>
<td class="lines-code chroma"><code class="code-inner">{{.FormattedLines}}</code></td>
</tr>
</tbody>
</table>
</div>
</div>
{{template "shared/searchbottom" dict "root" $ "result" .}}
</div>
{{template "shared/searchbottom" dict "root" $ "result" .}}
</div>
{{end}}
</div>
{{else if .Keyword}}
<div>{{ctx.Locale.Tr "explore.code_no_results"}}</div>
{{end}}
6 changes: 3 additions & 3 deletions templates/repo/diff/box.tmpl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -109,10 +109,10 @@
{{$showFileViewToggle := or $isImage (and (not $file.IsIncomplete) $isCsv)}}
{{$isExpandable := or (gt $file.Addition 0) (gt $file.Deletion 0) $file.IsBin}}
{{$isReviewFile := and $.IsSigned $.PageIsPullFiles (not $.IsArchived) $.IsShowingAllCommits}}
<div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}} gt-mt-0" id="diff-{{$file.NameHash}}" data-old-filename="{{$file.OldName}}" data-new-filename="{{$file.Name}}" {{if or ($file.ShouldBeHidden) (not $isExpandable)}}data-folded="true"{{end}}>
<div class="diff-file-box fold-container diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}} gt-mt-0" id="diff-{{$file.NameHash}}" data-old-filename="{{$file.OldName}}" data-new-filename="{{$file.Name}}" {{if or ($file.ShouldBeHidden) (not $isExpandable)}}data-folded="true"{{end}}>
<h4 class="diff-file-header sticky-2nd-row ui top attached normal header gt-df gt-ac gt-sb gt-fw">
<div class="diff-file-name gt-df gt-ac gt-gap-2 gt-fw">
<button class="fold-file btn interact-bg gt-p-2{{if not $isExpandable}} gt-invisible{{end}}">
<button class="fold-file fold-button btn interact-bg gt-p-2{{if not $isExpandable}} gt-invisible{{end}}">
{{if $file.ShouldBeHidden}}
{{svg "octicon-chevron-right" 18}}
{{else}}
Expand Down Expand Up @@ -175,7 +175,7 @@
{{end}}
</div>
</h4>
<div class="diff-file-body ui attached unstackable table segment" {{if and $file.IsViewed $.IsShowingAllCommits}}data-folded="true"{{end}}>
<div class="diff-file-body fold-body ui attached unstackable table segment" {{if and $file.IsViewed $.IsShowingAllCommits}}data-folded="true"{{end}}>
<div id="diff-source-{{$file.NameHash}}" class="file-body file-code unicode-escaped code-diff{{if $.IsSplitStyle}} code-diff-split{{else}} code-diff-unified{{end}}{{if $showFileViewToggle}} gt-hidden{{end}}">
{{if or $file.IsIncomplete $file.IsBin}}
<div class="diff-file-body binary" style="padding: 5px 10px;">
Expand Down
56 changes: 8 additions & 48 deletions templates/repo/search.tmpl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
{{template "repo/header" .}}
<div class="ui container">
<div class="ui repo-search">
<form class="ui form ignore-dirty" method="get">
<form class="ui form ignore-dirty" hx-get="{{.Link}}" hx-push-url="true" hx-target="#search-content" hx-swap="innerHTML">
<div class="ui fluid action input">
<input name="q" value="{{.Keyword}}"{{if .CodeIndexerUnavailable}} disabled{{end}} placeholder="{{ctx.Locale.Tr "repo.search.search_repo"}}">
<div class="ui dropdown selection {{if .CodeIndexerUnavailable}} disabled{{end}}" data-tooltip-content="{{ctx.Locale.Tr "repo.search.type.tooltip"}}">
Expand All @@ -18,56 +18,16 @@
</div>
</form>
</div>
{{if .CodeIndexerUnavailable}}
<div class="ui error message">
<p>{{ctx.Locale.Tr "repo.search.code_search_unavailable"}}</p>
</div>
{{else if .Keyword}}
<h3>
{{ctx.Locale.Tr "repo.search.results" (.Keyword|Escape) (.RepoLink|Escape) (.RepoName|Escape) | Str2html}}
</h3>
{{if .SearchResults}}
<div class="flex-text-block gt-fw">
{{range $term := .SearchResultLanguages}}
<a class="ui {{if eq $.Language $term.Language}}primary{{end}} basic label gt-m-0" href="{{$.SourcePath}}/search?q={{$.Keyword}}{{if ne $.Language $term.Language}}&l={{$term.Language}}{{end}}{{if ne $.queryType ""}}&t={{$.queryType}}{{end}}">
<i class="color-icon gt-mr-3" style="background-color: {{$term.Color}}"></i>
{{$term.Language}}
<div class="detail">{{$term.Count}}</div>
</a>
{{end}}
<div class="divider"></div>
<div id="search-content">
{{if .CodeIndexerUnavailable}}
<div class="ui error message">
<p>{{ctx.Locale.Tr "repo.search.code_search_unavailable"}}</p>
</div>
<div class="repository search">
{{range $result := .SearchResults}}
<div class="diff-file-box diff-box file-content non-diff-file-content repo-search-result">
<h4 class="ui top attached normal header gt-df gt-fw">
<span class="file gt-f1">{{.Filename}}</span>
<a role="button" class="ui basic tiny button" rel="nofollow" href="{{$.SourcePath}}/src/commit/{{PathEscape $result.CommitID}}/{{PathEscapeSegments .Filename}}">{{ctx.Locale.Tr "repo.diff.view_file"}}</a>
</h4>
<div class="ui attached table segment">
<div class="file-body file-code code-view">
<table>
<tbody>
<tr>
<td class="lines-num">
{{range .LineNumbers}}
<a href="{{$.SourcePath}}/src/commit/{{PathEscape $result.CommitID}}/{{PathEscapeSegments $result.Filename}}#L{{.}}"><span>{{.}}</span></a>
{{end}}
</td>
<td class="lines-code chroma"><code class="code-inner">{{.FormattedLines}}</code></td>
</tr>
</tbody>
</table>
</div>
</div>
{{template "shared/searchbottom" dict "root" $ "result" .}}
</div>
{{end}}
</div>
{{template "base/paginate" .}}
{{else}}
<div>{{ctx.Locale.Tr "repo.search.code_no_results"}}</div>
{{template "repo/search_result" .}}
{{end}}
{{end}}
</div>
</div>
</div>
{{template "base/footer" .}}
49 changes: 49 additions & 0 deletions templates/repo/search_result.tmpl
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
{{if .Keyword}}
<h3>
{{ctx.Locale.Tr "repo.search.results" (.Keyword|Escape) (.RepoLink|Escape) (.RepoName|Escape) | Str2html}}
</h3>
{{if .SearchResults}}
<div class="flex-text-block gt-fw">
{{range $term := .SearchResultLanguages}}
<a class="ui {{if eq $.Language $term.Language}}primary{{end}} basic label gt-m-0" href="{{$.SourcePath}}/search?q={{$.Keyword}}{{if ne $.Language $term.Language}}&l={{$term.Language}}{{end}}{{if ne $.queryType ""}}&t={{$.queryType}}{{end}}">
<i class="color-icon gt-mr-3" style="background-color: {{$term.Color}}"></i>
{{$term.Language}}
<div class="detail">{{$term.Count}}</div>
</a>
{{end}}
</div>
<div class="repository search">
{{range $result := .SearchResults}}
<div class="diff-file-box fold-container diff-box repo-search-result">
<h4 class="ui top attached normal header gt-df gt-fw">
<button class="fold-button btn interact-bg gt-mr-2 gt-p-2">{{svg "octicon-chevron-down" 18}}</button>
<span class="file gt-f1">{{.Filename}}</span>
<a role="button" class="ui basic tiny button" rel="nofollow" href="{{$.SourcePath}}/src/commit/{{PathEscape $result.CommitID}}/{{PathEscapeSegments .Filename}}">{{ctx.Locale.Tr "repo.diff.view_file"}}</a>
</h4>
<div class="fold-body">
<div class="ui attached table segment">
<div class="file-body file-code code-view">
<table>
<tbody>
<tr>
<td class="lines-num">
{{range .LineNumbers}}
<a href="{{$.SourcePath}}/src/commit/{{PathEscape $result.CommitID}}/{{PathEscapeSegments $result.Filename}}#L{{.}}"><span>{{.}}</span></a>
{{end}}
</td>
<td class="lines-code chroma"><code class="code-inner">{{.FormattedLines}}</code></td>
</tr>
</tbody>
</table>
</div>
</div>
{{template "shared/searchbottom" dict "root" $ "result" .}}
</div>
</div>
{{end}}
</div>
{{template "base/paginate" .}}
{{else}}
<div>{{ctx.Locale.Tr "repo.search.code_no_results"}}</div>
{{end}}
{{end}}
8 changes: 8 additions & 0 deletions web_src/css/base.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2055,3 +2055,11 @@ table th[data-sortt-desc] .svg {
align-items: center;
gap: .25rem;
}

.fold-container[data-folded="true"] .fold-body {
display: none;
}

.fold-container[data-folded="true"] .ui.header {
border-radius: var(--border-radius);
}
8 changes: 0 additions & 8 deletions web_src/css/repo.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2706,14 +2706,6 @@ tbody.commit-list {
padding: 5px 8px !important;
}

.diff-file-box[data-folded="true"] .diff-file-body {
display: none;
}

.diff-file-box[data-folded="true"] .diff-file-header {
border-radius: var(--border-radius) !important;
}

.ui.attached.header.diff-file-header.sticky-2nd-row {
position: sticky;
top: 44px; /* match .repository .diff-detail-box */
Expand Down
Loading