From 49933c7fb09cc98ae0e57a483d68011ac67fd492 Mon Sep 17 00:00:00 2001
From: Lunny Xiao <xiaolunwen@gmail.com>
Date: Thu, 25 Nov 2021 00:12:54 +0800
Subject: [PATCH] Create menus for organization pages (#17802)

* Create menus for organization pages

* Fix frontend lint

* Fix frontend lint
---
 routers/web/org/home.go         |  1 +
 templates/org/header.tmpl       | 15 ++-------------
 templates/org/home.tmpl         | 12 +-----------
 templates/org/menu.tmpl         | 29 +++++++++++++++++++++++++++++
 web_src/less/_organization.less |  6 ++++++
 5 files changed, 39 insertions(+), 24 deletions(-)
 create mode 100644 templates/org/menu.tmpl

diff --git a/routers/web/org/home.go b/routers/web/org/home.go
index 0dc441fe84..52f0282b5c 100644
--- a/routers/web/org/home.go
+++ b/routers/web/org/home.go
@@ -142,6 +142,7 @@ func Home(ctx *context.Context) {
 	ctx.Data["Members"] = members
 	ctx.Data["Teams"] = ctx.Org.Teams
 	ctx.Data["DisableNewPullMirrors"] = setting.Mirror.DisableNewPull
+	ctx.Data["PageIsViewRepositories"] = true
 
 	pager := context.NewPagination(int(count), setting.UI.User.RepoPagingNum, page, 5)
 	pager.SetDefaultParams(ctx)
diff --git a/templates/org/header.tmpl b/templates/org/header.tmpl
index d06c54d9ca..4415e0a1f5 100644
--- a/templates/org/header.tmpl
+++ b/templates/org/header.tmpl
@@ -9,21 +9,10 @@
 						{{if .Visibility.IsLimited}}<div class="ui medium orange horizontal label">{{$.i18n.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}}
 						{{if .Visibility.IsPrivate}}<div class="ui medium red horizontal label">{{$.i18n.Tr "org.settings.visibility.private_shortname"}}</div>{{end}}
 					</span>
-					<div class="ui right">
-						<div class="ui menu">
-							<a class="{{if $.PageIsOrgMembers}}active{{end}} item" href="{{$.OrgLink}}/members">
-								{{svg "octicon-organization"}}&nbsp;{{$.i18n.Tr "org.people"}}
-								<div class="floating ui black label">{{.NumMembers}}</div>
-							</a>
-							<a class="{{if $.PageIsOrgTeams}}active{{end}} item" href="{{$.OrgLink}}/teams">
-								{{svg "octicon-people"}}&nbsp;{{$.i18n.Tr "org.teams"}}
-								<div class="floating ui black label">{{.NumTeams}}</div>
-							</a>
-						</div>
-					</div>
 				</div>
 			</div>
 		</div>
 	</div>
-	<div class="ui divider"></div>
 {{end}}
+
+{{template "org/menu" .}}
diff --git a/templates/org/home.tmpl b/templates/org/home.tmpl
index fc79deb139..5b4f6d2c02 100644
--- a/templates/org/home.tmpl
+++ b/templates/org/home.tmpl
@@ -9,7 +9,6 @@
 					{{if .Org.Visibility.IsLimited}}<div class="ui large basic horizontal label">{{.i18n.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}}
 					{{if .Org.Visibility.IsPrivate}}<div class="ui large basic horizontal label">{{.i18n.Tr "org.settings.visibility.private_shortname"}}</div>{{end}}
 				</span>
-				{{if .IsOrganizationOwner}}<a class="middle text grey" href="{{.OrgLink}}/settings">{{svg "octicon-gear" 16 "mb-3"}}</a>{{end}}
 			</div>
 			{{if $.RenderedDescription}}<p class="render-content markup">{{$.RenderedDescription|Str2html}}</p>{{end}}
 			<div class="text grey meta">
@@ -19,20 +18,11 @@
 		</div>
 	</div>
 
-	<div class="ui divider"></div>
+	{{template "org/menu" .}}
 
 	<div class="ui container">
 		<div class="ui mobile reversed stackable grid">
 			<div class="ui eleven wide column">
-				{{if .CanCreateOrgRepo}}
-					<div class="text right">
-						{{if not .DisableNewPullMirrors}}
-							<a class="ui green button" href="{{AppSubUrl}}/repo/migrate?org={{.Org.ID}}&mirror=1">{{.i18n.Tr "new_migrate"}}</a>
-						{{end}}
-						<a class="ui green button" href="{{AppSubUrl}}/repo/create?org={{.Org.ID}}">{{.i18n.Tr "new_repo"}}</a>
-					</div>
-					<div class="ui divider"></div>
-				{{end}}
 				{{template "explore/repo_search" .}}
 				{{template "explore/repo_list" .}}
 				{{template "base/paginate" .}}
diff --git a/templates/org/menu.tmpl b/templates/org/menu.tmpl
new file mode 100644
index 0000000000..ec985c03e4
--- /dev/null
+++ b/templates/org/menu.tmpl
@@ -0,0 +1,29 @@
+<div class="ui tabs container">
+	<div class="ui secondary stackable pointing menu">
+		<a class="{{if .PageIsViewRepositories}}active{{end}} item" href="{{$.Org.HomeLink}}">
+			{{svg "octicon-repo"}} {{.i18n.Tr "user.repositories"}}
+		</a>
+		{{if .IsOrganizationMember}}
+			<a class="{{if $.PageIsOrgMembers}}active{{end}} item" href="{{$.OrgLink}}/members">
+				{{svg "octicon-organization"}}&nbsp;{{$.i18n.Tr "org.people"}}
+				{{if .NumMembers}}
+					<div class="ui primary label">{{.NumMembers}}</div>
+				{{end}}
+			</a>
+			<a class="{{if $.PageIsOrgTeams}}active{{end}} item" href="{{$.OrgLink}}/teams">
+				{{svg "octicon-people"}}&nbsp;{{$.i18n.Tr "org.teams"}}
+				{{if .NumTeams}}
+					<div class="ui black label">{{.NumTeams}}</div>
+				{{end}}
+			</a>
+		{{end}}
+
+		{{if .IsOrganizationOwner}}
+			<div class="right menu">
+				<a class="{{if .PageIsSettingsOptions}}active{{end}} item" href="{{.OrgLink}}/settings">
+				{{svg "octicon-tools"}} {{.i18n.Tr "repo.settings"}}
+				</a>
+			</div>
+		{{end}}
+	</div>
+</div>
diff --git a/web_src/less/_organization.less b/web_src/less/_organization.less
index d1a003c214..d86938d56a 100644
--- a/web_src/less/_organization.less
+++ b/web_src/less/_organization.less
@@ -16,6 +16,12 @@
     }
   }
 
+  .ui.secondary.stackable.pointing.menu {
+    flex-wrap: wrap;
+    margin-top: 5px;
+    margin-bottom: 10px;
+  }
+
   &.new.org {
     #create-page-form();