Improve milestone filter on issues page

models/issues/issue.go

@@ -1272,7 +1272,11 @@ func (opts *IssuesOptions) setupSessionNoLimit(sess *xorm.Session) {
 	}
 
 	if len(opts.MilestoneIDs) > 0 {
-		sess.In("issue.milestone_id", opts.MilestoneIDs)
+		if len(opts.MilestoneIDs) == 1 && opts.MilestoneIDs[0] == db.NoneID {
+			sess.And("issue.milestone_id = 0")
+		} else {
+			sess.In("issue.milestone_id", opts.MilestoneIDs)
+		}
 	}
 
 	if opts.UpdatedAfterUnix != 0 {
@@ -1719,6 +1723,8 @@ func getIssueStatsChunk(opts *IssueStatsOptions, issueIDs []int64) (*IssueStats,
 
 		if opts.MilestoneID > 0 {
 			sess.And("issue.milestone_id = ?", opts.MilestoneID)
+		} else if opts.MilestoneID == -1 {
+			sess.And("issue.milestone_id = 0")
 		}
 
 		if opts.ProjectID > 0 {

options/locale/locale_en-US.ini

@@ -1311,7 +1311,10 @@ issues.filter_label = Label
 issues.filter_label_exclude = `Use <code>alt</code> + <code>click/enter</code> to exclude labels`
 issues.filter_label_no_select = All labels
 issues.filter_milestone = Milestone
-issues.filter_milestone_no_select = All milestones
+issues.filter_milestone_all = All milestones
+issues.filter_milestone_none = No milestones
+issues.filter_milestone_open = Open milestones
+issues.filter_milestone_closed = Closed milestones
 issues.filter_project = Project
 issues.filter_project_all = All projects
 issues.filter_project_none = No project

routers/web/repo/issue.go

@@ -241,7 +241,7 @@ func issues(ctx *context.Context, milestoneID, projectID int64, isPullOption uti
 	pager := context.NewPagination(total, setting.UI.IssuePagingNum, page, 5)
 
 	var mileIDs []int64
-	if milestoneID > 0 {
+	if milestoneID > 0 || milestoneID == db.NoneID { // -1 to get those issues which have no any milestone assigned
 		mileIDs = []int64{milestoneID}
 	}
 
@@ -443,20 +443,37 @@ func Issues(ctx *context.Context) {
 		return
 	}
 
-	var err error
+	renderMilestones(ctx)
+	if ctx.Written() {
+		return
+	}
+
+	ctx.Data["CanWriteIssuesOrPulls"] = ctx.Repo.CanWriteIssuesOrPulls(isPullList)
+
+	ctx.HTML(http.StatusOK, tplIssues)
+}
+
+func renderMilestones(ctx *context.Context) {
 	// Get milestones
-	ctx.Data["Milestones"], _, err = issues_model.GetMilestones(issues_model.GetMilestonesOption{
+	milestones, _, err := issues_model.GetMilestones(issues_model.GetMilestonesOption{
 		RepoID: ctx.Repo.Repository.ID,
-		State:  api.StateType(ctx.FormString("state")),
+		State:  api.StateAll,
 	})
 	if err != nil {
 		ctx.ServerError("GetAllRepoMilestones", err)
 		return
 	}
 
-	ctx.Data["CanWriteIssuesOrPulls"] = ctx.Repo.CanWriteIssuesOrPulls(isPullList)
-
-	ctx.HTML(http.StatusOK, tplIssues)
+	openMilestones, closedMilestones := issues_model.MilestoneList{}, issues_model.MilestoneList{}
+	for _, milestone := range milestones {
+		if milestone.IsClosed {
+			closedMilestones = append(closedMilestones, milestone)
+		} else {
+			openMilestones = append(openMilestones, milestone)
+		}
+	}
+	ctx.Data["OpenMilestones"] = openMilestones
+	ctx.Data["ClosedMilestones"] = closedMilestones
 }
 
 // RetrieveRepoMilestonesAndAssignees find all the milestones and assignees of a repository

templates/repo/issue/list.tmpl

@@ -63,7 +63,7 @@
 					</div>
 
 					<!-- Milestone -->
-					<div class="ui {{if not .Milestones}}disabled{{end}} dropdown jump item">
+					<div class="ui {{if not (or .OpenMilestones .ClosedMilestones)}}disabled{{end}} dropdown jump item">
 						<span class="text">
 							{{.locale.Tr "repo.issues.filter_milestone"}}
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
@@ -73,9 +73,25 @@
 								<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 								<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_milestone"}}">
 							</div>
-							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">{{.locale.Tr "repo.issues.filter_milestone_no_select"}}</a>
-							{{range .Milestones}}
-								<a class="{{if $.MilestoneID}}{{if eq $.MilestoneID .ID}}active selected{{end}}{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{.ID}}&project={{$.ProjectID}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">{{.Name}}</a>
+							<a class="{{if not $.MilestoneID}}active selected {{end}}item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone=0&project={{$.ProjectID}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">{{.locale.Tr "repo.issues.filter_milestone_all"}}</a>
+							<a class="{{if $.MilestoneID}}{{if eq $.MilestoneID -1}}active selected {{end}}{{end}}item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone=-1&project={{$.ProjectID}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">{{.locale.Tr "repo.issues.filter_milestone_none"}}</a>
+							{{if .OpenMilestones}}
+								<a class="item disabled"><h4>{{.locale.Tr "repo.issues.filter_milestone_open"}}</h4></a>
+								{{range .OpenMilestones}}
+								<a class="{{if $.MilestoneID}}{{if eq $.MilestoneID .ID}}active selected {{end}}{{end}}item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{.ID}}&project={{$.ProjectID}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">
+									{{svg "octicon-milestone" 16 "mr-2"}}
+									{{.Name}}
+								</a>
+								{{end}}
+							{{end}}
+							{{if .ClosedMilestones}}
+								<a class="item disabled"><h4>{{.locale.Tr "repo.issues.filter_milestone_closed"}}</h4></a>
+								{{range .ClosedMilestones}}
+								<a class="{{if $.MilestoneID}}{{if eq $.MilestoneID .ID}}active selected {{end}}{{end}}item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{.ID}}&project={{$.ProjectID}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">
+									{{svg "octicon-milestone" 16 "mr-2"}}
+									{{.Name}}
+								</a>
+								{{end}}
 							{{end}}
 						</div>
 					</div>

templates/repo/issue/milestone/select_menu.tmpl

@@ -0,0 +1,38 @@
+<div class="header" style="text-transform: none;font-size:16px;">{{.locale.Tr "repo.issues.new.add_milestone_title"}}</div>
+{{if or .OpenMilestones .ClosedMilestones}}
+<div class="ui icon search input">
+	<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
+	<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_milestones"}}">
+</div>
+{{end}}
+<div class="no-select item">{{.locale.Tr "repo.issues.new.clear_milestone"}}</div>
+{{if and (not .OpenMilestones) (not .ClosedMilestones)}}
+	<div class="header" style="text-transform: none;font-size:14px;">
+		{{.locale.Tr "repo.issues.new.no_items"}}
+	</div>
+{{else}}
+	{{if .OpenMilestones}}
+		<div class="divider"></div>
+		<div class="header">
+			{{.locale.Tr "repo.issues.new.open_milestone"}}
+		</div>
+		{{range .OpenMilestones}}
+			<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
+				{{svg "octicon-milestone" 16 "gt-mr-2"}}
+				{{.Name}}
+			</a>
+		{{end}}
+	{{end}}
+	{{if .ClosedMilestones}}
+		<div class="divider"></div>
+		<div class="header">
+			{{.locale.Tr "repo.issues.new.closed_milestone"}}
+		</div>
+		{{range .ClosedMilestones}}
+			<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
+				{{svg "octicon-milestone" 16 "gt-mr-2"}}
+				{{.Name}}
+			</a>
+		{{end}}
+	{{end}}
+{{end}}

templates/repo/issue/new_form.tmpl

@@ -50,44 +50,7 @@
 					{{end}}
 				</span>
 				<div class="menu">
-					<div class="header" style="text-transform: none;font-size:16px;">{{.locale.Tr "repo.issues.new.add_milestone_title"}}</div>
-					{{if or .OpenMilestones .ClosedMilestones}}
-					<div class="ui icon search input">
-						<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
-						<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_milestones"}}">
-					</div>
-					{{end}}
-					<div class="no-select item">{{.locale.Tr "repo.issues.new.clear_milestone"}}</div>
-					{{if and (not .OpenMilestones) (not .ClosedMilestones)}}
-						<div class="header" style="text-transform: none;font-size:14px;">
-							{{.locale.Tr "repo.issues.new.no_items"}}
-						</div>
-					{{else}}
-						{{if .OpenMilestones}}
-							<div class="divider"></div>
-							<div class="header">
-								{{.locale.Tr "repo.issues.new.open_milestone"}}
-							</div>
-							{{range .OpenMilestones}}
-								<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
-									{{svg "octicon-milestone" 16 "gt-mr-2"}}
-									{{.Name}}
-								</a>
-							{{end}}
-						{{end}}
-						{{if .ClosedMilestones}}
-							<div class="divider"></div>
-							<div class="header">
-								{{.locale.Tr "repo.issues.new.closed_milestone"}}
-							</div>
-							{{range .ClosedMilestones}}
-								<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
-									{{svg "octicon-milestone" 16 "gt-mr-2"}}
-									{{.Name}}
-								</a>
-							{{end}}
-						{{end}}
-					{{end}}
+					{{template "repo/issue/milestone/select_menu" .}}
 				</div>
 			</div>
 			<div class="ui select-milestone list">

templates/repo/issue/view_content/sidebar.tmpl

@@ -118,44 +118,7 @@
 				{{end}}
 			</a>
 			<div class="menu" data-action="update" data-issue-id="{{$.Issue.ID}}" data-update-url="{{$.RepoLink}}/issues/milestone">
-				<div class="header" style="text-transform: none;font-size:16px;">{{.locale.Tr "repo.issues.new.add_milestone_title"}}</div>
-				{{if or .OpenMilestones .ClosedMilestones}}
-				<div class="ui icon search input">
-					<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
-					<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_milestones"}}">
-				</div>
-				{{end}}
-				<div class="no-select item">{{.locale.Tr "repo.issues.new.clear_milestone"}}</div>
-				{{if and (not .OpenMilestones) (not .ClosedMilestones)}}
-					<div class="header" style="text-transform: none;font-size:14px;">
-						{{.locale.Tr "repo.issues.new.no_items"}}
-					</div>
-				{{else}}
-					{{if .OpenMilestones}}
-						<div class="divider"></div>
-						<div class="header">
-							{{.locale.Tr "repo.issues.new.open_milestone"}}
-						</div>
-						{{range .OpenMilestones}}
-							<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
-								{{svg "octicon-milestone" 16 "gt-mr-2"}}
-								{{.Name}}
-							</a>
-						{{end}}
-					{{end}}
-					{{if .ClosedMilestones}}
-						<div class="divider"></div>
-						<div class="header">
-							{{.locale.Tr "repo.issues.new.closed_milestone"}}
-						</div>
-						{{range .ClosedMilestones}}
-							<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
-								{{svg "octicon-milestone" 16 "gt-mr-2"}}
-								{{.Name}}
-							</a>
-						{{end}}
-					{{end}}
-				{{end}}
+				{{template "repo/issue/milestone/select_menu" .}}
 			</div>
 		</div>
 		<div class="ui select-milestone list">