Refactor project templates (#26448)

This PR refactors a bunch of projects-related code, mostly the templates. The following things were done: - rename boards to columns in frontend code - use the new `ctx.Locale.Tr` method - cleanup template, remove useless newlines, classes, comments - merge org-/user and repo level project template together - move "new column" button into project toolbar - move issue card (shared by projects and pinned issues) to shared template, remove useless duplicated styles - add search function to projects (to make the layout more similar to milestones list where it is inherited from 😆) - maybe more changes I forgot I've done 😆 Closes #24893 After: ![Bildschirmfoto vom 2023-08-10 23-02-00](https://github.com/go-gitea/gitea/assets/47871822/cab61456-1d23-4373-8163-e567f1b3b5f9) ![Bildschirmfoto vom 2023-08-10 23-02-26](https://github.com/go-gitea/gitea/assets/47871822/94b55d60-5572-48eb-8111-538a52d8bcc6) ![Bildschirmfoto vom 2023-08-10 23-02-46](https://github.com/go-gitea/gitea/assets/47871822/a0358f4b-4e05-4194-a7bc-6e0ecba5a9b6) --------- Co-authored-by: silverwind <me@silverwind.io>
go-gitea · Aug 12, 2023 · ab78c39 · ab78c39
1 parent 74930b1
commit ab78c39
Show file tree

Hide file tree

Showing 16 changed files with 339 additions and 662 deletions.
diff --git a/models/project/project.go b/models/project/project.go
@@ -198,6 +198,7 @@ type SearchOptions struct {
 	IsClosed util.OptionalBool
 	OrderBy  db.SearchOrderBy
 	Type     Type
+	Title    string
 }
 
 func (opts *SearchOptions) toConds() builder.Cond {
@@ -218,6 +219,10 @@ func (opts *SearchOptions) toConds() builder.Cond {
 	if opts.OwnerID > 0 {
 		cond = cond.And(builder.Eq{"owner_id": opts.OwnerID})
 	}
+
+	if len(opts.Title) != 0 {
+		cond = cond.And(db.BuildCaseInsensitiveLike("title", opts.Title))
+	}
 	return cond
 }
 

diff --git a/routers/web/org/projects.go b/routers/web/org/projects.go
@@ -47,6 +47,7 @@ func Projects(ctx *context.Context) {
 	sortType := ctx.FormTrim("sort")
 
 	isShowClosed := strings.ToLower(ctx.FormTrim("state")) == "closed"
+	keyword := ctx.FormTrim("q")
 	page := ctx.FormInt("page")
 	if page <= 1 {
 		page = 1
@@ -64,6 +65,7 @@ func Projects(ctx *context.Context) {
 		IsClosed: util.OptionalBoolOf(isShowClosed),
 		OrderBy:  project_model.GetSearchOrderByBySortType(sortType),
 		Type:     projectType,
+		Title:    keyword,
 	})
 	if err != nil {
 		ctx.ServerError("FindProjects", err)
@@ -395,7 +397,7 @@ func ViewProject(ctx *context.Context) {
 	ctx.Data["CanWriteProjects"] = canWriteProjects(ctx)
 	ctx.Data["Project"] = project
 	ctx.Data["IssuesMap"] = issuesMap
-	ctx.Data["Boards"] = boards
+	ctx.Data["Columns"] = boards // TODO: rename boards to columns in backend
 	shared_user.RenderUserHeader(ctx)
 
 	err = shared_user.LoadHeaderCount(ctx)

diff --git a/routers/web/repo/projects.go b/routers/web/repo/projects.go
@@ -54,6 +54,7 @@ func Projects(ctx *context.Context) {
 	sortType := ctx.FormTrim("sort")
 
 	isShowClosed := strings.ToLower(ctx.FormTrim("state")) == "closed"
+	keyword := ctx.FormTrim("q")
 	repo := ctx.Repo.Repository
 	page := ctx.FormInt("page")
 	if page <= 1 {
@@ -76,6 +77,7 @@ func Projects(ctx *context.Context) {
 		IsClosed: util.OptionalBoolOf(isShowClosed),
 		OrderBy:  project_model.GetSearchOrderByBySortType(sortType),
 		Type:     project_model.TypeRepository,
+		Title:    keyword,
 	})
 	if err != nil {
 		ctx.ServerError("GetProjects", err)
@@ -364,7 +366,7 @@ func ViewProject(ctx *context.Context) {
 	ctx.Data["CanWriteProjects"] = ctx.Repo.Permission.CanWrite(unit.TypeProjects)
 	ctx.Data["Project"] = project
 	ctx.Data["IssuesMap"] = issuesMap
-	ctx.Data["Boards"] = boards
+	ctx.Data["Columns"] = boards // TODO: rename boards to columns in backend
 
 	ctx.HTML(http.StatusOK, tplProjectsView)
 }

diff --git a/templates/projects/list.tmpl b/templates/projects/list.tmpl
@@ -1,25 +1,36 @@
 {{if and $.CanWriteProjects (not $.Repository.IsArchived)}}
-	<div class="gt-text-right">
-		<a class="ui small green button" href="{{$.Link}}/new">{{.locale.Tr "repo.projects.new"}}</a>
+	<div class="gt-df gt-sb gt-mb-4">
+		<div class="small-menu-items ui compact tiny menu list-header-toggle">
+			<a class="item{{if not .IsShowClosed}} active{{end}}" href="{{$.Link}}?state=open&q={{$.Keyword}}">
+				{{svg "octicon-project-symlink" 16 "gt-mr-3"}}
+				{{.locale.PrettyNumber .OpenCount}}&nbsp;{{.locale.Tr "repo.issues.open_title"}}
+			</a>
+			<a class="item{{if .IsShowClosed}} active{{end}}" href="{{$.Link}}?state=closed&q={{$.Keyword}}">
+				{{svg "octicon-check" 16 "gt-mr-3"}}
+				{{.locale.PrettyNumber .ClosedCount}}&nbsp;{{.locale.Tr "repo.issues.closed_title"}}
+			</a>
+		</div>
+		<div class="gt-text-right">
+			<a class="ui small green button" href="{{$.Link}}/new">{{.locale.Tr "repo.projects.new"}}</a>
+		</div>
 	</div>
-	<div class="divider"></div>
 {{end}}
 
 {{template "base/alert" .}}
-<div class="small-menu-items ui compact tiny menu">
-	<a class="item{{if not .IsShowClosed}} active{{end}}" href="{{$.Link}}?state=open">
-		{{svg "octicon-project-symlink" 16 "gt-mr-3"}}
-		{{.locale.PrettyNumber .OpenCount}}&nbsp;{{.locale.Tr "repo.issues.open_title"}}
-	</a>
-	<a class="item{{if .IsShowClosed}} active{{end}}" href="{{$.Link}}?state=closed">
-		{{svg "octicon-check" 16 "gt-mr-3"}}
-		{{.locale.PrettyNumber .ClosedCount}}&nbsp;{{.locale.Tr "repo.issues.closed_title"}}
-	</a>
-</div>
 
-<div class="ui right floated secondary filter menu">
+<div class="list-header">
+	<!-- Search -->
+	<form class="list-header-search ui form ignore-dirty">
+		<div class="ui small search fluid action input">
+			<input type="hidden" name="state" value="{{$.State}}">
+			{{template "shared/searchinput" dict "locale" .locale "Value" .Keyword}}
+			<button class="ui small icon button" type="submit" aria-label="{{.locale.Tr "explore.search"}}">
+				{{svg "octicon-search"}}
+			</button>
+		</div>
+	</form>
 	<!-- Sort -->
-	<div class="ui dropdown type jump item">
+	<div class="list-header-sort ui small dropdown type jump item">
 		<span class="text">
 			{{.locale.Tr "repo.issues.filter_sort"}}
 			{{svg "octicon-triangle-down" 14 "dropdown icon"}}
@@ -31,6 +42,7 @@
 		</div>
 	</div>
 </div>
+
 <div class="milestone-list">
 	{{range .Projects}}
 		<li class="milestone-card">

diff --git a/templates/projects/new.tmpl b/templates/projects/new.tmpl
@@ -1,10 +1,10 @@
 <h2 class="ui dividing header">
 	{{if .PageIsEditProjects}}
-		{{.locale.Tr "repo.projects.edit"}}
-		<div class="sub header">{{.locale.Tr "repo.projects.edit_subheader"}}</div>
+		{{ctx.Locale.Tr "repo.projects.edit"}}
+		<div class="sub header">{{ctx.Locale.Tr "repo.projects.edit_subheader"}}</div>
 	{{else}}
-		{{.locale.Tr "repo.projects.new"}}
-		<div class="sub header">{{.locale.Tr "repo.projects.new_subheader"}}</div>
+		{{ctx.Locale.Tr "repo.projects.new"}}
+		<div class="sub header">{{ctx.Locale.Tr "repo.projects.new_subheader"}}</div>
 	{{end}}
 </h2>
 {{template "base/alert" .}}
@@ -13,42 +13,42 @@
 	<div>
 		<input type="hidden" id="redirect" name="redirect" value="{{.redirect}}">
 		<div class="field {{if .Err_Title}}error{{end}}">
-			<label>{{.locale.Tr "repo.projects.title"}}</label>
-			<input name="title" placeholder="{{.locale.Tr "repo.projects.title"}}" value="{{.title}}" autofocus required>
+			<label>{{ctx.Locale.Tr "repo.projects.title"}}</label>
+			<input name="title" placeholder="{{ctx.Locale.Tr "repo.projects.title"}}" value="{{.title}}" autofocus required>
 		</div>
 		<div class="field">
-			<label>{{.locale.Tr "repo.projects.description"}}</label>
-			<textarea name="content" placeholder="{{.locale.Tr "repo.projects.description_placeholder"}}">{{.content}}</textarea>
+			<label>{{ctx.Locale.Tr "repo.projects.description"}}</label>
+			<textarea name="content" placeholder="{{ctx.Locale.Tr "repo.projects.description_placeholder"}}">{{.content}}</textarea>
 		</div>
 
 		{{if not .PageIsEditProjects}}
 			<div class="field">
-				<label>{{.locale.Tr "repo.projects.template.desc"}}</label>
+				<label>{{ctx.Locale.Tr "repo.projects.template.desc"}}</label>
 				<div class="ui selection dropdown">
 					<input type="hidden" name="board_type" value="{{.type}}">
-					<div class="default text">{{.locale.Tr "repo.projects.template.desc_helper"}}</div>
+					<div class="default text">{{ctx.Locale.Tr "repo.projects.template.desc_helper"}}</div>
 					<div class="menu">
 						{{range $element := .BoardTypes}}
-							<div class="item" data-id="{{$element.BoardType}}" data-value="{{$element.BoardType}}">{{$.locale.Tr $element.Translation}}</div>
+							<div class="item" data-id="{{$element.BoardType}}" data-value="{{$element.BoardType}}">{{ctx.Locale.Tr $element.Translation}}</div>
 						{{end}}
 					</div>
 				</div>
 			</div>
 		{{end}}
 
 		<div class="field">
-			<label>{{.locale.Tr "repo.projects.card_type.desc"}}</label>
+			<label>{{ctx.Locale.Tr "repo.projects.card_type.desc"}}</label>
 			<div class="ui selection dropdown">
 				{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 				{{range $element := .CardTypes}}
 					{{if or (eq $.card_type $element.CardType) (and (not $.PageIsEditProjects) (eq $element.CardType 1))}}
 						<input type="hidden" name="card_type" value="{{$element.CardType}}">
-						<div class="default text">{{$.locale.Tr $element.Translation}}</div>
+						<div class="default text">{{ctx.Locale.Tr $element.Translation}}</div>
 					{{end}}
 				{{end}}
 				<div class="menu">
 					{{range $element := .CardTypes}}
-						<div class="item" data-id="{{$element.CardType}}" data-value="{{$element.CardType}}">{{$.locale.Tr $element.Translation}}</div>
+						<div class="item" data-id="{{$element.CardType}}" data-value="{{$element.CardType}}">{{ctx.Locale.Tr $element.Translation}}</div>
 					{{end}}
 				</div>
 			</div>
@@ -57,10 +57,10 @@
 	<div class="divider"></div>
 	<div class="gt-text-right">
 		<a class="ui cancel button" href="{{$.CancelLink}}">
-			{{.locale.Tr "repo.milestones.cancel"}}
+			{{ctx.Locale.Tr "repo.milestones.cancel"}}
 		</a>
 		<button class="ui primary button">
-			{{if .PageIsEditProjects}}{{.locale.Tr "repo.projects.modify"}}{{else}}{{.locale.Tr "repo.projects.create"}}{{end}}
+			{{if .PageIsEditProjects}}{{ctx.Locale.Tr "repo.projects.modify"}}{{else}}{{ctx.Locale.Tr "repo.projects.create"}}{{end}}
 		</button>
 	</div>
 </form>