Fix git graph page (#34948) (#34949)

routers/web/repo/commit.go

@@ -169,10 +169,13 @@ func Graph(ctx *context.Context) {
 	ctx.Data["Username"] = ctx.Repo.Owner.Name
 	ctx.Data["Reponame"] = ctx.Repo.Repository.Name
 
+	divOnly := ctx.FormBool("div-only")
+	queryParams := ctx.Req.URL.Query()
+	queryParams.Del("div-only")
 	paginator := context.NewPagination(int(graphCommitsCount), setting.UI.GraphMaxCommitNum, page, 5)
-	paginator.AddParamFromRequest(ctx.Req)
+	paginator.AddParamFromQuery(queryParams)
 	ctx.Data["Page"] = paginator
-	if ctx.FormBool("div-only") {
+	if divOnly {
 		ctx.HTML(http.StatusOK, tplGraphDiv)
 		return
 	}

services/context/pagination.go

@@ -33,8 +33,8 @@ func (p *Pagination) WithCurRows(n int) *Pagination {
 	return p
 }
 
-func (p *Pagination) AddParamFromRequest(req *http.Request) {
+func (p *Pagination) AddParamFromQuery(q url.Values) {
-	for key, values := range req.URL.Query() {
+	for key, values := range q {
 		if key == "page" || len(values) == 0 || (len(values) == 1 && values[0] == "") {
 			continue
 		}
@@ -45,6 +45,10 @@ func (p *Pagination) AddParamFromRequest(req *http.Request) {
 	}
 }
 
+func (p *Pagination) AddParamFromRequest(req *http.Request) {
+	p.AddParamFromQuery(req.URL.Query())
+}
+
 // GetParams returns the configured URL params
 func (p *Pagination) GetParams() template.URL {
 	return template.URL(strings.Join(p.urlParams, "&"))

web_src/css/features/gitgraph.css

@@ -71,11 +71,13 @@
 
 #git-graph-container li .author {
   color: var(--color-text-light);
+  flex-shrink: 0;
 }
 
 #git-graph-container li .time {
   color: var(--color-text-light-3);
   font-size: 80%;
+  flex-shrink: 0;
 }
 
 #git-graph-container li a:not(.ui):hover {
@@ -109,6 +111,10 @@
   background-color: var(--color-secondary-alpha-30);
 }
 
+#git-graph-container #rev-list .commit-refs {
+  flex-shrink: 0;
+}
+
 #git-graph-container #rev-list .commit-refs .button {
   padding: 2px 4px;
   margin-right: 0.25em;

web_src/js/features/repo-graph.ts

@@ -84,9 +84,9 @@ export function initRepoGraphGit() {
 
   const flowSelectRefsDropdown = document.querySelector('#flow-select-refs-dropdown');
   const $dropdown = fomanticQuery(flowSelectRefsDropdown);
+  $dropdown.dropdown({clearable: true});
+  $dropdown.dropdown('set selected', dropdownSelected);
   $dropdown.dropdown({
-    clearable: true,
-    fullTextSeach: 'exact',
     onRemove(toRemove: string) {
       if (toRemove === '...flow-hide-pr-refs') {
         params.delete('hide-pr-refs');
@@ -110,7 +110,6 @@ export function initRepoGraphGit() {
       updateGraph();
     },
   });
-  $dropdown.dropdown('set selected', dropdownSelected);
 
   graphContainer.addEventListener('mouseenter', (e: DOMEvent<MouseEvent>) => {
     if (e.target.matches('#rev-list li')) {