feat: add pagination, search, and description to org teams page

Add pagination and keyword search to the organization teams list page.
Display team descriptions in team cards.

- Refactor Teams() handler to use SearchTeam() with ListOptions
  for server-side pagination and keyword filtering
- Add search input with the existing 'search.team_kind' locale string
- Show team description in an attached segment below the team name
- Add standard pagination widget at the bottom of the list

Fixes go-gitea/gitea#34482

routers/web/org/teams.go

@@ -54,13 +54,42 @@ func Teams(ctx *context.Context) {
 	ctx.Data["Title"] = org.FullName
 	ctx.Data["PageIsOrgTeams"] = true
 
-	for _, t := range ctx.Org.Teams {
+	page := max(ctx.FormInt("page"), 1)
+	keyword := ctx.FormTrim("q")
+
+	opts := &org_model.SearchTeamOptions{
+		Keyword:     keyword,
+		OrgID:       org.ID,
+		IncludeDesc: true,
+		ListOptions: db.ListOptions{
+			Page:     page,
+			PageSize: setting.UI.MembersPagingNum,
+		},
+	}
+
+	if !ctx.Org.IsOwner {
+		opts.UserID = ctx.Doer.ID
+	}
+
+	teams, count, err := org_model.SearchTeam(ctx, opts)
+	if err != nil {
+		ctx.ServerError("SearchTeam", err)
+		return
+	}
+
+	for _, t := range teams {
 		if err := t.LoadMembers(ctx); err != nil {
 			ctx.ServerError("GetMembers", err)
 			return
 		}
 	}
-	ctx.Data["Teams"] = ctx.Org.Teams
+
+	pager := context.NewPagination(int(count), setting.UI.MembersPagingNum, page, 5)
+	pager.AddParamFromRequest(ctx.Req)
+	ctx.Data["Page"] = pager
+	ctx.Data["Teams"] = teams
+	ctx.Data["Keyword"] = keyword
+	ctx.Data["Total"] = count
 
 	ctx.HTML(http.StatusOK, tplTeams)
 }

templates/org/team/teams.tmpl

@@ -7,9 +7,19 @@
 			<div class="flex-text-block tw-justify-end">
 				<a class="ui primary button" href="{{.OrgLink}}/teams/new">{{svg "octicon-plus"}} {{ctx.Locale.Tr "org.create_new_team"}}</a>
 			</div>
-			<div class="divider"></div>
 		{{end}}
 
+		<div class="ui secondary filter menu tw-mx-0">
+			<form class="ui form ignore-dirty tw-flex-1" method="get">
+				<div class="ui fluid action input">
+					<input name="q" value="{{$.Keyword}}" placeholder="{{ctx.Locale.Tr "search.team_kind"}}" autofocus>
+					<button class="ui primary button" type="submit">{{svg "octicon-search"}}</button>
+				</div>
+			</form>
+		</div>
+
+		<div class="divider"></div>
+
 		<div class="ui two column stackable grid">
 			{{range .Teams}}
 				<div class="column">
@@ -30,6 +40,11 @@
 							{{end}}
 						</div>
 					</div>
+					{{if .Description}}
+						<div class="ui attached segment">
+							<p class="tw-text-sm tw-text-secondary tw-my-0">{{.Description}}</p>
+						</div>
+					{{end}}
 					<div class="ui attached segment members">
 						{{range .Members}}
 							{{template "shared/user/avatarlink" dict "user" .}}
@@ -41,6 +56,8 @@
 				</div>
 			{{end}}
 		</div>
+
+		{{template "base/paginate" .}}
 	</div>
 </div>
 <div class="ui g-modal-confirm delete modal" id="leave-team">
@@ -53,3 +70,4 @@
 	{{template "base/modal_actions_confirm" .}}
 </div>
 {{template "base/footer" .}}
+