Skip to content

Commit 6662065

Browse files
zokkiszokkis
committed
use form for search instead of printf
1 parent ae846c1 commit 6662065

File tree

2 files changed

+47
-48
lines changed

2 files changed

+47
-48
lines changed

‎templates/shared/repo_search.tmpl

Lines changed: 30 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1-
<div class="ui secondary filter menu gt-ac gt-mx-0">
2-
<form class="ui form ignore-dirty gt-f1">
3-
<input type="hidden" name="sort" value="{{$.SortType}}">
4-
<input type="hidden" name="language" value="{{$.Language}}">
5-
<div class="ui fluid action input">
1+
<div class="ui secondary filter menu">
2+
<form id="repo-search-form" class="ui form ignore-dirty tw-flex-1 tw-flex tw-flex-row tw-gap-x-2">
3+
{{if .Language}}<input hidden name="language" value="{{.Language}}">{{end}}
4+
<div class="ui fluid action input tw-flex-1">
65
{{template "shared/searchinput" dict "Value" .Keyword}}
76
{{if .PageIsExploreRepositories}}
87
<input type="hidden" name="only_show_relevant" value="{{.OnlyShowRelevant}}">
@@ -11,22 +10,14 @@
1110
{{end}}
1211
<button class="ui primary button">{{ctx.Locale.Tr "explore.search"}}</button>
1312
</div>
14-
</form>
15-
{{$tabQuery := ""}}
16-
{{if .TabName}}{{$tabQuery = printf "tab=%s&" (QueryEscape .TabName)}}{{end}}
17-
{{$languageQuery := ""}}
18-
{{if .TabName}}{{$languageQuery = printf "language=%s&" (QueryEscape .Language)}}{{end}}
19-
{{$queryParams := printf "%s%sq=%s" $tabQuery $languageQuery (QueryEscape .Keyword)}}
20-
<!-- Filter -->
21-
{{$queryParamsWithSort := printf "%s&sort=%s" $queryParams (QueryEscape .SortType)}}
22-
<form class="ui form ignore-dirty" id="repo-search-form" data-query-params="{{$queryParamsWithSort}}">
23-
<div class="ui dropdown type jump item gt-mr-0">
13+
<!-- Filter -->
14+
<div class="ui dropdown type jump item tw-mr-0">
2415
<span class="text">
2516
{{ctx.Locale.Tr "filter"}}
2617
</span>
2718
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
2819
<div class="menu">
29-
<a class="item" href="{{printf "%s?%s" .Link $queryParamsWithSort}}">{{ctx.Locale.Tr "filter.clear"}}</a>
20+
<label class="item"><input type="radio" name="clear-filter"> {{ctx.Locale.Tr "filter.clear"}}</label>
3021
<div class="divider"></div>
3122
<label class="item"><input type="radio" name="archived" {{if .IsArchived.IsTrue}}checked{{end}} value="1"> {{ctx.Locale.Tr "filter.is_archived"}}</label>
3223
<label class="item"><input type="radio" name="archived" {{if .IsArchived.IsFalse}}checked{{end}} value="0"> {{ctx.Locale.Tr "filter.not_archived"}}</label>
@@ -44,29 +35,30 @@
4435
<label class="item"><input type="radio" name="private" {{if .IsPrivate.IsTrue}}checked{{end}} value="1"> {{ctx.Locale.Tr "filter.private"}}</label>
4536
</div>
4637
</div>
47-
</form>
48-
<!-- Sort -->
49-
<div class="ui dropdown type jump item gt-mr-0">
50-
<span class="text">
51-
{{ctx.Locale.Tr "repo.issues.filter_sort"}}
52-
</span>
53-
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
54-
<div class="menu">
55-
{{$href := printf "%s?%s" .Link $queryParams}}
56-
<a class="{{if eq .SortType "newest"}}active {{end}}item" href="{{$href}}&sort=newest">{{ctx.Locale.Tr "repo.issues.filter_sort.latest"}}</a>
57-
<a class="{{if eq .SortType "oldest"}}active {{end}}item" href="{{$href}}&sort=oldest">{{ctx.Locale.Tr "repo.issues.filter_sort.oldest"}}</a>
58-
<a class="{{if eq .SortType "alphabetically"}}active {{end}}item" href="{{$href}}&sort=alphabetically">{{ctx.Locale.Tr "repo.issues.label.filter_sort.alphabetically"}}</a>
59-
<a class="{{if eq .SortType "reversealphabetically"}}active {{end}}item" href="{{$href}}&sort=reversealphabetically">{{ctx.Locale.Tr "repo.issues.label.filter_sort.reverse_alphabetically"}}</a>
60-
<a class="{{if eq .SortType "recentupdate"}}active {{end}}item" href="{{$href}}&sort=recentupdate">{{ctx.Locale.Tr "repo.issues.filter_sort.recentupdate"}}</a>
61-
<a class="{{if eq .SortType "leastupdate"}}active {{end}}item" href="{{$href}}&sort=leastupdate">{{ctx.Locale.Tr "repo.issues.filter_sort.leastupdate"}}</a>
62-
{{if not .DisableStars}}
63-
<a class="{{if eq .SortType "moststars"}}active {{end}}item" href="{{$href}}&sort=moststars">{{ctx.Locale.Tr "repo.issues.filter_sort.moststars"}}</a>
64-
<a class="{{if eq .SortType "feweststars"}}active {{end}}item" href="{{$href}}&sort=feweststars">{{ctx.Locale.Tr "repo.issues.filter_sort.feweststars"}}</a>
65-
{{end}}
66-
<a class="{{if eq .SortType "mostforks"}}active {{end}}item" href="{{$href}}&sort=mostforks">{{ctx.Locale.Tr "repo.issues.filter_sort.mostforks"}}</a>
67-
<a class="{{if eq .SortType "fewestforks"}}active {{end}}item" href="{{$href}}&sort=fewestforks">{{ctx.Locale.Tr "repo.issues.filter_sort.fewestforks"}}</a>
38+
<!-- Sort -->
39+
<div class="ui dropdown type jump item gt-mr-0">
40+
<span class="text">
41+
{{ctx.Locale.Tr "repo.issues.filter_sort"}}
42+
</span>
43+
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
44+
<div class="menu">
45+
<label class="{{if eq .SortType "newest"}}active {{end}}item"><input hidden type="radio" name="sort" {{if eq .SortType "newest"}}checked{{end}} value="newest"> {{ctx.Locale.Tr "repo.issues.filter_sort.latest"}}</label>
46+
<label class="{{if eq .SortType "oldest"}}active {{end}}item"><input hidden type="radio" name="sort" {{if eq .SortType "oldest"}}checked{{end}} value="oldest"> {{ctx.Locale.Tr "repo.issues.filter_sort.oldest"}}</label>
47+
<label class="{{if eq .SortType "alphabetically"}}active {{end}}item"><input hidden type="radio" name="sort" {{if eq .SortType "alphabetically"}}checked{{end}} value="alphabetically"> {{ctx.Locale.Tr "repo.issues.label.filter_sort.alphabetically"}}</label>
48+
<label class="{{if eq .SortType "reversealphabetically"}}active {{end}}item"><input hidden type="radio" name="sort" {{if eq .SortType "reversealphabetically"}}checked{{end}} value="reversealphabetically"> {{ctx.Locale.Tr "repo.issues.label.filter_sort.reverse_alphabetically"}}</label>
49+
<label class="{{if eq .SortType "recentupdate"}}active {{end}}item"><input hidden type="radio" name="sort" {{if eq .SortType "recentupdate"}}checked{{end}} value="recentupdate"> {{ctx.Locale.Tr "repo.issues.filter_sort.recentupdate"}}</label>
50+
<label class="{{if eq .SortType "leastupdate"}}active {{end}}item"><input hidden type="radio" name="sort" {{if eq .SortType "leastupdate"}}checked{{end}} value="leastupdate"> {{ctx.Locale.Tr "repo.issues.filter_sort.leastupdate"}}</label>
51+
{{if not .DisableStars}}
52+
<label class="{{if eq .SortType "moststars"}}active {{end}}item"><input hidden type="radio" name="sort" {{if eq .SortType "moststars"}}checked{{end}} value="moststars"> {{ctx.Locale.Tr "repo.issues.filter_sort.moststars"}}</label>
53+
<label class="{{if eq .SortType "feweststars"}}active {{end}}item"><input hidden type="radio" name="sort" {{if eq .SortType "feweststars"}}checked{{end}} value="feweststars"> {{ctx.Locale.Tr "repo.issues.filter_sort.feweststars"}}</label>
54+
{{end}}
55+
<label class="{{if eq .SortType "mostforks"}}active {{end}}item"><input hidden type="radio" name="sort" {{if eq .SortType "mostforks"}}checked{{end}} value="mostforks"> {{ctx.Locale.Tr "repo.issues.filter_sort.mostforks"}}</label>
56+
<label class="{{if eq .SortType "fewestforks"}}active {{end}}item"><input hidden type="radio" name="sort" {{if eq .SortType "fewestforks"}}checked{{end}} value="fewestforks"> {{ctx.Locale.Tr "repo.issues.filter_sort.fewestforks"}}</label>
57+
<label class="{{if eq .SortType "size"}}active {{end}}item"><input hidden type="radio" name="sort" {{if eq .SortType "size"}}checked{{end}} value="size"> {{ctx.Locale.Tr "repo.issues.label.filter_sort.by_size"}}</label>
58+
<label class="{{if eq .SortType "reversesize"}}active {{end}}item"><input hidden type="radio" name="sort" {{if eq .SortType "reversesize"}}checked{{end}} value="reversesize"> {{ctx.Locale.Tr "repo.issues.label.filter_sort.reverse_by_size"}}</label>
59+
</div>
6860
</div>
69-
</div>
61+
</form>
7062
</div>
7163
{{if and .PageIsExploreRepositories .OnlyShowRelevant}}
7264
<div class="ui message explore-relevancy-note">

‎web_src/js/features/repo-search.js

Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,21 @@ export function initRepositorySearch() {
22
const repositorySearchForm = document.querySelector('#repo-search-form');
33
if (!repositorySearchForm) return;
44

5-
for (const radio of repositorySearchForm.querySelectorAll('input[type=radio]')) {
6-
radio.addEventListener('click', (e) => {
7-
e.preventDefault();
8-
9-
const formData = new FormData(repositorySearchForm);
10-
const params = new URLSearchParams(formData);
11-
const otherQueryParams = repositorySearchForm.getAttribute('data-query-params');
12-
window.location.search = `${otherQueryParams}&${params.toString()}`;
13-
});
14-
}
5+
repositorySearchForm.addEventListener('change', (e) => {
6+
e.preventDefault();
7+
8+
const formData = new FormData(repositorySearchForm);
9+
const params = new URLSearchParams(formData);
10+
11+
if (e.target.name === 'clear-filter') {
12+
params.delete('archived');
13+
params.delete('fork');
14+
params.delete('mirror');
15+
params.delete('template');
16+
params.delete('private');
17+
}
18+
19+
params.delete('clear-filter');
20+
window.location.search = params.toString();
21+
});
1522
}

0 commit comments

Comments
 (0)