arches: use TabbedLayout

Signed-off-by: Arthur Zamarin <arthurzam@gentoo.org>

4 files changed, 45 insertions, 82 deletions

diff --git a/pkg/app/handler/arches/changedVersions.templ b/pkg/app/handler/arches/changedVersions.templ
index 0ed5dfe..fb65fc3 100644
--- a/pkg/app/handler/arches/changedVersions.templ
+++ b/pkg/app/handler/arches/changedVersions.templ
@@ -1,85 +1,49 @@
 package arches
 
+import "net/http"
+import "soko/pkg/app/layout"
 import "soko/pkg/app/utils"
 import "soko/pkg/models"
 
-func activeClass(flag bool) string {
-	if flag {
-		return "nav-link active"
-	}
-	return "nav-link"
-}
-
-templ archesHeader(currentArch string) {
-	<div class="kk-header-container">
-		<div class="container">
-			<div class="row">
-				<div class="col-12">
-					<div class="row mt-3">
-						<div class="col-md-5 pt-2">
-							<h1 class="stick-top kk-package-title" id="package-title">
-								<div>
-									<div class="kk-package-name" style="margin-left: 0px!important;">
-										<span class="fa fa-fw fa-server"></span>
-										<span class="ml-2">Architectures</span>
-									</div>
-								</div>
-							</h1>
-						</div>
-						<div class="col-md-7"></div>
-						<div class="col-md-12 pt-4 mt-1">
-							<nav class="nav kk-package-nav">
-								for _, arch := range models.ArchesToShow {
-									<a
-										class={ activeClass(arch == currentArch) }
-										href={ templ.URL("/arches/" + arch + "/keyworded") }
-									>
-										{ arch }
-									</a>
-								}
-							</nav>
-						</div>
-					</div>
-				</div>
-			</div>
-		</div>
-	</div>
-}
-
-templ changedVersions(
-	currentArch string,
-	name string,
-	feedName string,
-	versions []*models.Version,
-) {
-	@archesHeader(currentArch)
-	<div class="tab-content" id="myTabContent">
-		<div class="container mb-5">
-			<div class="row">
-				<div class="col-11">
-					if name == "Keyworded" {
-						<h3>
-							<a class="text-dark"><i class="fa fa-circle-o" aria-hidden="true"></i> Keyworded Packages</a>
-							<a href={ templ.URL("/arches/" + currentArch + "/stable") } class="ml-3 text-muted"><i class="fa fa-check-circle-o" aria-hidden="true"></i> Newly Stable Packages</a>
-						</h3>
-					} else {
-						<h3>
-							<a href={ templ.URL("/arches/" + currentArch + "/keyworded") } class="text-muted"><i class="fa fa-circle-o" aria-hidden="true"></i> Keyworded Packages</a>
-							<a class="ml-3 text-dark"><i class="fa fa-check-circle-o" aria-hidden="true"></i> Newly Stable Packages</a>
-						</h3>
-					}
-				</div>
-				<div class="col-1 text-right">
+templ changedVersions(currentArch string, feedName string, versions []*models.Version) {
+	<div class="container mb-5">
+		<div class="row">
+			<div class="col-11">
+				if feedName == "keyworded" {
+					<h3>
+						<a class="text-dark"><i class="fa fa-circle-o" aria-hidden="true"></i> Keyworded Packages</a>
+						<a href={ templ.URL("/arches/" + currentArch + "/stable") } class="ml-3 text-muted"><i class="fa fa-check-circle-o" aria-hidden="true"></i> Newly Stable Packages</a>
+					</h3>
+				} else {
 					<h3>
-						<a title="Atom feed" href={ templ.URL("/arches/" + currentArch + "/" + feedName + ".atom") } class="kk-feed-icon"><span class="fa fa-fw fa-rss-square"></span></a>
+						<a href={ templ.URL("/arches/" + currentArch + "/keyworded") } class="text-muted"><i class="fa fa-circle-o" aria-hidden="true"></i> Keyworded Packages</a>
+						<a class="ml-3 text-dark"><i class="fa fa-check-circle-o" aria-hidden="true"></i> Newly Stable Packages</a>
 					</h3>
-				</div>
-				<div class="col-12">
-					<li class="list-group">
-						@utils.ChangedVersionsTable(versions)
-					</li>
-				</div>
+				}
+			</div>
+			<div class="col-1 text-right">
+				<h3>
+					<a title="Atom feed" href={ templ.URL("/arches/" + currentArch + "/" + feedName + ".atom") } class="kk-feed-icon"><span class="fa fa-fw fa-rss-square"></span></a>
+				</h3>
+			</div>
+			<div class="col-12">
+				<li class="list-group">
+					@utils.ChangedVersionsTable(versions)
+				</li>
 			</div>
 		</div>
 	</div>
 }
+
+var tabs []layout.SubTab
+
+func init() {
+	tabs = make([]layout.SubTab, len(models.AllArches))
+	for i, arch := range models.AllArches {
+		tabs[i] = layout.SubTab{Name: arch, Link: templ.URL("/arches/" + arch + "/keyworded")}
+	}
+}
+
+func renderPage(w http.ResponseWriter, r *http.Request, arch string, content templ.Component) {
+	layout.TabbedLayout("Architectures", "arches", "Architectures", "fa fa-fw fa-server", "", tabs, arch, content).Render(r.Context(), w)
+}
diff --git a/pkg/app/handler/arches/show.go b/pkg/app/handler/arches/show.go
index d202a9e..40fb048 100644
--- a/pkg/app/handler/arches/show.go
+++ b/pkg/app/handler/arches/show.go
@@ -3,7 +3,6 @@ package arches
 import (
 	"net/http"
 	"soko/pkg/app/handler/feeds"
-	"soko/pkg/app/layout"
 	"strings"
 )
 
@@ -14,9 +13,7 @@ func ShowStable(w http.ResponseWriter, r *http.Request) {
 		http.NotFound(w, r)
 		return
 	}
-	layout.Layout("Architectures", "arches", changedVersions(
-		arch, "Newly Stable", "stable", stabilizedVersions,
-	)).Render(r.Context(), w)
+	renderPage(w, r, arch, changedVersions(arch, "stable", stabilizedVersions))
 }
 
 func ShowStableFeed(w http.ResponseWriter, r *http.Request) {
@@ -38,9 +35,7 @@ func ShowKeyworded(w http.ResponseWriter, r *http.Request) {
 		http.NotFound(w, r)
 		return
 	}
-	layout.Layout("Architectures", "arches", changedVersions(
-		arch, "Keyworded", "keyworded", keywordedVersions,
-	)).Render(r.Context(), w)
+	renderPage(w, r, arch, changedVersions(arch, "keyworded", keywordedVersions))
 }
 
 func ShowKeywordedFeed(w http.ResponseWriter, r *http.Request) {
diff --git a/pkg/app/layout/page.templ b/pkg/app/layout/page.templ
index 41cdb8d..ebfe060 100644
--- a/pkg/app/layout/page.templ
+++ b/pkg/app/layout/page.templ
@@ -162,7 +162,10 @@ templ tabbedHeader(subTitle string, icon string, description string, tabs []SubT
 							<nav class="nav kk-package-nav">
 								for _, tab := range tabs {
 									<a class={ "nav-link", templ.KV("active", tab.Name == currentSubTab) } href={ tab.Link }>
-										<i class={ tab.Icon } aria-hidden="true"></i> { tab.Name }
+										if tab.Icon != "" {
+											<i class={ tab.Icon } aria-hidden="true"></i>
+										}
+										{ tab.Name }
 										if tab.BadgeValue != "" {
 											<span class="ml-1 badge badge-pill kk-misc-badge">{ tab.BadgeValue }</span>
 										}
diff --git a/pkg/models/userpreferences.go b/pkg/models/userpreferences.go
index 93311d3..803c66c 100644
--- a/pkg/models/userpreferences.go
+++ b/pkg/models/userpreferences.go
@@ -32,6 +32,7 @@ type UseflagsPreferences struct {
 }
 
 var ArchesToShow = [...]string{"amd64", "x86", "alpha", "arm", "arm64", "hppa", "ia64", "ppc", "ppc64", "riscv", "sparc"}
+var AllArches = [...]string{"alpha", "amd64", "arm", "arm64", "hppa", "ia64", "mips", "ppc", "ppc64", "riscv", "s390", "sparc", "x86"}
 
 func GetDefaultUserPreferences() UserPreferences {
 	userPreferences := UserPreferences{}