preferences: remove most of single package

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

5 files changed, 238 insertions, 570 deletions

diff --git a/pkg/app/handler/packages/overview.templ b/pkg/app/handler/packages/overview.templ
index 44f1e37..3027fbc 100644
--- a/pkg/app/handler/packages/overview.templ
+++ b/pkg/app/handler/packages/overview.templ
@@ -132,7 +132,7 @@ templ overviewVersions(pkg *models.Package, userPreferences *models.UserPreferen
 templ overview(pkg *models.Package, userPreferences *models.UserPreferences) {
 	<div class="row">
 		<div class="col-md-9">
-			if userPreferences.Packages.Overview.ShowOutdated && len(pkg.Outdated) > 0 {
+			if len(pkg.Outdated) > 0 {
 				if !pkg.HasVersion(pkg.Outdated[0].NewestVersion) {
 					<div class="alert alert-info">
 						<strong><span class="fa fa-fw fa-lightbulb-o"></span> Version { pkg.Outdated[0].NewestVersion } is available upstream. Please consider updating!</strong>
@@ -220,195 +220,181 @@ templ overview(pkg *models.Package, userPreferences *models.UserPreferences) {
 					<a href="https://wiki.gentoo.org/wiki/Project:Proxy_Maintainers" class="alert-link">Proxy Maintainers team</a>.
 				</div>
 			}
-			if len(userPreferences.Packages.Overview.MetadataFields) > 0 {
-				<h3 class="pt-3 mb-2">Package Metadata</h3>
-				<div class="card border-0 mb-3">
-					<ul class="list-group kk-metadata-list">
-						if slices.Contains(userPreferences.Packages.Overview.MetadataFields, "homepage") {
-							if len(pkg.Versions[0].Homepage) > 1 {
-								<li class="kk-metadata-item list-group-item">
-									<div class="row">
-										<div class="col-xs-12 col-md-3 kk-metadata-key">
-											<span class="fa fa-fw fa-home"></span>
-											Other homepage(s)
-										</div>
-										<div class="col-xs-12 col-md-9">
-											for i, url := range pkg.Versions[0].Homepage[1:] {
-												if i > 0 {
-													<br/>
-												}
-												<a href={ templ.URL(url) }>{ url }</a>
-											}
-										</div>
-									</div>
-								</li>
-							}
-						}
-						if slices.Contains(userPreferences.Packages.Overview.MetadataFields, "upstream") {
-							if len(pkg.Upstream.Doc) > 0 || len(pkg.Upstream.Changelog) > 0 || len(pkg.Upstream.BugsTo) > 0 || len(pkg.Upstream.RemoteIds) > 0 {
-								<li class="kk-metadata-item list-group-item">
-									<div class="row">
-										<div class="col-xs-12 col-md-3 kk-metadata-key">
-											<span class="fa fa-fw fa-code-fork"></span>
-											Upstream
-										</div>
-										<div class="col-xs-12 col-md-9">
-											<table>
-												for i, url := range pkg.Upstream.Doc {
-													<tr>
-														<td>
-															if i == 0 {
-																<span class="kk-useflag-group float-right mr-2">Documentation</span>
-															}
-														</td>
-														<td><a href={ templ.URL(url) }>{ url }</a></td>
-													</tr>
-												}
-												for i, url := range pkg.Upstream.Changelog {
-													<tr>
-														<td>
-															if i == 0 {
-																<span class="kk-useflag-group float-right mr-2">Changelog</span>
-															}
-														</td>
-														<td><a href={ templ.URL(url) }>{ url }</a></td>
-													</tr>
-												}
-												for i, url := range pkg.Upstream.BugsTo {
-													<tr>
-														<td>
-															if i == 0 {
-																<span class="kk-useflag-group float-right mr-2">Bugs-To</span>
-															}
-														</td>
-														<td><a href={ templ.URL(url) }>{ url }</a></td>
-													</tr>
-												}
-												for i, remote := range pkg.Upstream.RemoteIds {
-													<tr>
-														<td>
-															if i == 0 {
-																<span class="kk-useflag-group float-right mr-2">Remote-Id</span>
-															}
-														</td>
-														<td>
-															if url := remoteIdLink(remote); url != "" {
-																<a href={ templ.URL(url) }>{ url }</a>
-															} else {
-																<a>({ remote.Type }) { remote.Id }</a>
-															}
-														</td>
-													</tr>
-												}
-											</table>
-										</div>
-									</div>
-								</li>
-							}
-						}
-						if slices.Contains(userPreferences.Packages.Overview.MetadataFields, "longdescription") {
-							if pkg.Longdescription != "" {
-								<li class="kk-metadata-item list-group-item">
-									<div class="row">
-										<div class="col-xs-12 col-md-3 kk-metadata-key">
-											<span class="fa fa-fw fa-info"></span>Full description
-										</div>
-										<div class="col-xs-12 col-md-9">
-											{ pkg.Longdescription }
-										</div>
-									</div>
-								</li>
-							}
-						}
-						if slices.Contains(userPreferences.Packages.Overview.MetadataFields, "useflags") {
-							if localUseflags, globalUseflags, useExpands := getPackageUseflags(pkg); len(localUseflags) > 0 || len(globalUseflags) > 0 || len(useExpands) > 0 {
-								<li class="kk-metadata-item list-group-item">
-									<div class="row">
-										<div class="col-xs-12 col-md-3 kk-metadata-key">
-											<span class="fa fa-fw fa-sliders"></span>
-											USE flags
-										</div>
-										<div class="col-xs-12 col-md-9">
-											if len(localUseflags) > 0 {
-												<span class="kk-useflag-group">Local Use Flags</span>
-												<ul class={ "kk-useflag-container", templ.KV("kk-useflag-container-many", len(localUseflags) >= 10), templ.KV("kk-useflag-container-few", len(localUseflags) < 10) }>
-													for _, use := range localUseflags {
-														<li class="kk-useflag">
-															<a title={ use.Description } data-toggle="tooltip" href={ templ.URL("/useflags/" + use.Name) }>{ use.Name }</a>
-														</li>
+			<h3 class="pt-3 mb-2">Package Metadata</h3>
+			<div class="card border-0 mb-3">
+				<ul class="list-group kk-metadata-list">
+					if len(pkg.Versions[0].Homepage) > 1 {
+						<li class="kk-metadata-item list-group-item">
+							<div class="row">
+								<div class="col-xs-12 col-md-3 kk-metadata-key">
+									<span class="fa fa-fw fa-home"></span>
+									Other homepage(s)
+								</div>
+								<div class="col-xs-12 col-md-9">
+									for i, url := range pkg.Versions[0].Homepage[1:] {
+										if i > 0 {
+											<br/>
+										}
+										<a href={ templ.URL(url) }>{ url }</a>
+									}
+								</div>
+							</div>
+						</li>
+					}
+					if len(pkg.Upstream.Doc) > 0 || len(pkg.Upstream.Changelog) > 0 || len(pkg.Upstream.BugsTo) > 0 || len(pkg.Upstream.RemoteIds) > 0 {
+						<li class="kk-metadata-item list-group-item">
+							<div class="row">
+								<div class="col-xs-12 col-md-3 kk-metadata-key">
+									<span class="fa fa-fw fa-code-fork"></span>
+									Upstream
+								</div>
+								<div class="col-xs-12 col-md-9">
+									<table>
+										for i, url := range pkg.Upstream.Doc {
+											<tr>
+												<td>
+													if i == 0 {
+														<span class="kk-useflag-group float-right mr-2">Documentation</span>
 													}
-												</ul>
-											}
-											if len(globalUseflags) > 0 {
-												<span class="kk-useflag-group">Global Use Flags</span>
-												<ul class={ "kk-useflag-container", templ.KV("kk-useflag-container-many", len(localUseflags) >= 10), templ.KV("kk-useflag-container-few", len(localUseflags) < 10) }>
-													for _, use := range globalUseflags {
-														<li class="kk-useflag">
-															<a title={ use.Description } data-toggle="tooltip" href={ templ.URL("/useflags/" + use.Name) }>{ use.Name }</a>
-														</li>
+												</td>
+												<td><a href={ templ.URL(url) }>{ url }</a></td>
+											</tr>
+										}
+										for i, url := range pkg.Upstream.Changelog {
+											<tr>
+												<td>
+													if i == 0 {
+														<span class="kk-useflag-group float-right mr-2">Changelog</span>
+													}
+												</td>
+												<td><a href={ templ.URL(url) }>{ url }</a></td>
+											</tr>
+										}
+										for i, url := range pkg.Upstream.BugsTo {
+											<tr>
+												<td>
+													if i == 0 {
+														<span class="kk-useflag-group float-right mr-2">Bugs-To</span>
+													}
+												</td>
+												<td><a href={ templ.URL(url) }>{ url }</a></td>
+											</tr>
+										}
+										for i, remote := range pkg.Upstream.RemoteIds {
+											<tr>
+												<td>
+													if i == 0 {
+														<span class="kk-useflag-group float-right mr-2">Remote-Id</span>
 													}
-												</ul>
+												</td>
+												<td>
+													if url := remoteIdLink(remote); url != "" {
+														<a href={ templ.URL(url) }>{ url }</a>
+													} else {
+														<a>({ remote.Type }) { remote.Id }</a>
+													}
+												</td>
+											</tr>
+										}
+									</table>
+								</div>
+							</div>
+						</li>
+					}
+					if pkg.Longdescription != "" {
+						<li class="kk-metadata-item list-group-item">
+							<div class="row">
+								<div class="col-xs-12 col-md-3 kk-metadata-key">
+									<span class="fa fa-fw fa-info"></span>Full description
+								</div>
+								<div class="col-xs-12 col-md-9">
+									{ pkg.Longdescription }
+								</div>
+							</div>
+						</li>
+					}
+					if localUseflags, globalUseflags, useExpands := getPackageUseflags(pkg); len(localUseflags) > 0 || len(globalUseflags) > 0 || len(useExpands) > 0 {
+						<li class="kk-metadata-item list-group-item">
+							<div class="row">
+								<div class="col-xs-12 col-md-3 kk-metadata-key">
+									<span class="fa fa-fw fa-sliders"></span>
+									USE flags
+								</div>
+								<div class="col-xs-12 col-md-9">
+									if len(localUseflags) > 0 {
+										<span class="kk-useflag-group">Local Use Flags</span>
+										<ul class={ "kk-useflag-container", templ.KV("kk-useflag-container-many", len(localUseflags) >= 10), templ.KV("kk-useflag-container-few", len(localUseflags) < 10) }>
+											for _, use := range localUseflags {
+												<li class="kk-useflag">
+													<a title={ use.Description } data-toggle="tooltip" href={ templ.URL("/useflags/" + use.Name) }>{ use.Name }</a>
+												</li>
 											}
-											if len(useExpands) > 0 {
-												for groupName, flags := range useExpands {
-													<span class="kk-useflag-group">{ groupName } (Use Expand)</span>
-													<ul class={ "kk-useflag-container", templ.KV("kk-useflag-container-many", len(localUseflags) >= 10), templ.KV("kk-useflag-container-few", len(localUseflags) < 10) }>
-														for _, use := range flags {
-															<li class="kk-useflag">
-																<a title={ use.Description } data-toggle="tooltip" href={ templ.URL("/useflags/" + use.Name) }>{ strings.TrimPrefix(use.Name, use.UseExpand + "_") }</a>
-															</li>
-														}
-													</ul>
-												}
+										</ul>
+									}
+									if len(globalUseflags) > 0 {
+										<span class="kk-useflag-group">Global Use Flags</span>
+										<ul class={ "kk-useflag-container", templ.KV("kk-useflag-container-many", len(localUseflags) >= 10), templ.KV("kk-useflag-container-few", len(localUseflags) < 10) }>
+											for _, use := range globalUseflags {
+												<li class="kk-useflag">
+													<a title={ use.Description } data-toggle="tooltip" href={ templ.URL("/useflags/" + use.Name) }>{ use.Name }</a>
+												</li>
 											}
-										</div>
-									</div>
-								</li>
-							}
-						}
-						if slices.Contains(userPreferences.Packages.Overview.MetadataFields, "license") {
-							if pkg.Versions[0].License != "" {
-								<li class="kk-metadata-item list-group-item">
-									<div class="row">
-										<div class="col-xs-12 col-md-3 kk-metadata-key">
-											<span class="fa fa-fw fa-legal"></span>
-											License
-										</div>
-										<div class="col-xs-12 col-md-9">
-											{ pkg.Versions[0].License }
-										</div>
-									</div>
-								</li>
-							}
-						}
-						if slices.Contains(userPreferences.Packages.Overview.MetadataFields, "maintainers") {
-							if len(pkg.Maintainers) > 0 {
-								<li class="kk-metadata-item list-group-item">
-									<div class="row">
-										<div class="col-xs-12 col-md-3 kk-metadata-key">
-											<span class="fa fa-fw fa-user"></span>
-											Maintainer(s)
-										</div>
-										<div class="col-xs-12 col-md-9">
-											for i, maintainer := range pkg.Maintainers {
-												if i > 0 {
-													,&nbsp;
+										</ul>
+									}
+									if len(useExpands) > 0 {
+										for groupName, flags := range useExpands {
+											<span class="kk-useflag-group">{ groupName } (Use Expand)</span>
+											<ul class={ "kk-useflag-container", templ.KV("kk-useflag-container-many", len(localUseflags) >= 10), templ.KV("kk-useflag-container-few", len(localUseflags) < 10) }>
+												for _, use := range flags {
+													<li class="kk-useflag">
+														<a title={ use.Description } data-toggle="tooltip" href={ templ.URL("/useflags/" + use.Name) }>{ strings.TrimPrefix(use.Name, use.UseExpand + "_") }</a>
+													</li>
 												}
-												<a title={ maintainer.PrintName() } href={ templ.URL("/maintainer/" + maintainer.Email) }>
-													{ maintainer.PrintName() }
-												</a>
-												<a href={ templ.URL("mailto:" + maintainer.Email) }>
-													<i class="fa fa-envelope-o" style="font-size: .925em;" aria-hidden="true"></i>
-												</a>
-											}
-										</div>
-									</div>
-								</li>
-							}
-						}
-					</ul>
-				</div>
-			}
+											</ul>
+										}
+									}
+								</div>
+							</div>
+						</li>
+					}
+					if pkg.Versions[0].License != "" {
+						<li class="kk-metadata-item list-group-item">
+							<div class="row">
+								<div class="col-xs-12 col-md-3 kk-metadata-key">
+									<span class="fa fa-fw fa-legal"></span>
+									License
+								</div>
+								<div class="col-xs-12 col-md-9">
+									{ pkg.Versions[0].License }
+								</div>
+							</div>
+						</li>
+					}
+					if len(pkg.Maintainers) > 0 {
+						<li class="kk-metadata-item list-group-item">
+							<div class="row">
+								<div class="col-xs-12 col-md-3 kk-metadata-key">
+									<span class="fa fa-fw fa-user"></span>
+									Maintainer(s)
+								</div>
+								<div class="col-xs-12 col-md-9">
+									for i, maintainer := range pkg.Maintainers {
+										if i > 0 {
+											,&nbsp;
+										}
+										<a title={ maintainer.PrintName() } href={ templ.URL("/maintainer/" + maintainer.Email) }>
+											{ maintainer.PrintName() }
+										</a>
+										<a href={ templ.URL("mailto:" + maintainer.Email) }>
+											<i class="fa fa-envelope-o" style="font-size: .925em;" aria-hidden="true"></i>
+										</a>
+									}
+								</div>
+							</div>
+						</li>
+					}
+				</ul>
+			</div>
 			if userPreferences.Packages.Overview.Layout == "full" {
 				<div class="mt-4 pt-4"></div>
 				@components.Changelog(pkg.Atom, pkg.Commits)
diff --git a/pkg/app/handler/packages/show.go b/pkg/app/handler/packages/show.go
index e833b2a..27d8b29 100644
--- a/pkg/app/handler/packages/show.go
+++ b/pkg/app/handler/packages/show.go
@@ -64,7 +64,7 @@ func Show(w http.ResponseWriter, r *http.Request) {
 					fmt.Sprintf(template, "Deleted") +
 					") AS changed_files"), atom+"/%", atom+"/%", atom+"/%").
 				Order("preceding_commits DESC").
-				Limit(userPreferences.Packages.Overview.ChangelogLength), nil
+				Limit(50), nil
 		})
 	case "changelog.json":
 		changelogJSON(w, r)
@@ -95,11 +95,6 @@ func Show(w http.ResponseWriter, r *http.Request) {
 		query = query.Relation("Outdated").
 			Relation("Versions.Masks").
 			Relation("Versions.Deprecates")
-		if userPreferences.Packages.Overview.ChangelogType == "full" {
-			query = query.Relation("Commits", func(q *pg.Query) (*pg.Query, error) {
-				return q.Order("preceding_commits DESC").Limit(userPreferences.Packages.Overview.ChangelogLength), nil
-			})
-		}
 		currentSubTab = "Overview"
 	default:
 		http.NotFound(w, r)
diff --git a/pkg/app/handler/user/arches.templ b/pkg/app/handler/user/arches.templ
index 7f9fa50..5c11b32 100644
--- a/pkg/app/handler/user/arches.templ
+++ b/pkg/app/handler/user/arches.templ
@@ -82,9 +82,7 @@ templ arches(preferences models.ArchesPreferences) {
 									for _, arch := range models.GetAllKeywords() {
 										<option
 											value={ arch }
-											if preferences.DefaultArch == arch {
-												selected
-											}
+											selected?={ preferences.DefaultArch == arch }
 										>{ arch }</option>
 									}
 								</select>
@@ -94,15 +92,11 @@ templ arches(preferences models.ArchesPreferences) {
 								<select class="form-control" style="max-width: 150px;display: inline;" name="arches-default-page" id="arches-default-page">
 									<option
 										value="keyworded"
-										if preferences.DefaultPage == "keyworded" {
-											selected
-										}
+										selected?={ preferences.DefaultPage == "keyworded" }
 									>keyworded</option>
 									<option
 										value="stable"
-										if preferences.DefaultPage == "stable" {
-											selected
-										}
+										selected?={ preferences.DefaultPage == "stable" }
 									>newly stable</option>
 								</select>
 							</div>
diff --git a/pkg/app/handler/user/packages.templ b/pkg/app/handler/user/packages.templ
index db57ef1..30a5e43 100644
--- a/pkg/app/handler/user/packages.templ
+++ b/pkg/app/handler/user/packages.templ
@@ -3,295 +3,85 @@ package user
 import "encoding/base64"
 import "encoding/json"
 import "net/http"
-import "slices"
-import "strconv"
 import "time"
 import "soko/pkg/app/utils"
 import "soko/pkg/models"
 
 templ packages(preferences models.PackagesPreferences) {
 	<div class="row">
-		<div class="col-2 mt-1">
-			<div class="nav flex-column" role="tablist" aria-orientation="vertical" style="position: fixed;">
-				<a class="nav-link user-pref-nav-link active" id="overview-tab" href="#overview" aria-controls="overview-settings">Overview</a>
-				<a class="nav-link user-pref-nav-link" id="pull-requests-tab" href="#pull-requests" aria-controls="pull-requests-settings">Pull requests</a>
-				<a class="nav-link user-pref-nav-link" id="bugs-tab" href="#bugs" aria-controls="bugs-settings">Bugs</a>
-				<a class="nav-link user-pref-nav-link" id="security-tab" href="#security" aria-controls="security-settings">Security</a>
-				<a class="nav-link user-pref-nav-link" id="changelog-tab" href="#changelog" aria-controls="changelog-settings">Changelog</a>
-				<a class="nav-link user-pref-nav-link" id="tabs-tab" href="#tabs" aria-controls="tabs-settings">Tabs</a>
-			</div>
-		</div>
-		<div class="col-9 mt-1">
-			<form method="post" action="/user/preferences/packages/edit">
-				<h3 id="overview">Overview</h3>
-				<hr class="mt-1"/>
-				<h4 class="mb-1">Layout</h4>
-				<div class="row">
-					<div class="col-6 mt-1">
-						<div class="card" style="background: transparent;">
-							<div class="card-body">
-								<img id="img1" alt="Versions + Metadata (default)" src="/assets/pgo2.png" style="width: 100%;cursor: pointer;"/>
-							</div>
-						</div>
-						<div class="text-center mt-2">
-							<div class="form-check text-center form-check-inline" style="text-overflow: ellipsis;overflow: hidden;">
-								<input
-									type="radio"
-									id="minimalOverviewLayout"
-									name="overview-layout"
-									value="minimal"
-									checked?={ preferences.Overview.Layout == "minimal" }
-								/>
-								<label class="form-check-label ml-1" for="minimalOverviewLayout" style="overflow:hidden;text-overflow: ellipsis;" title="Versions + Metadata (default)">Versions + Metadata <i>(default)</i></label>
-							</div>
-						</div>
-					</div>
-					<div class="col-6 mt-1">
-						<div class="card" style="background: transparent;">
-							<div class="card-body">
-								<img id="img2" alt="Versions + Metadata + Changelog" src="/assets/pgo1.png" onclick="document.getElementById('fullOverviewLayout').checked = true;" style="width: 100%;cursor: pointer;"/>
-							</div>
+		<form method="post" action="/user/preferences/packages/edit">
+			<h4 class="mb-1">Layout</h4>
+			<div class="row">
+				<div class="col-6 mt-1">
+					<div class="card" style="background: transparent;">
+						<div class="card-body">
+							<img id="img1" alt="Versions + Metadata (default)" src="/assets/pgo2.png" style="width: 100%;cursor: pointer;"/>
 						</div>
-						<div class="text-center mt-2">
-							<div class="form-check text-center form-check-inline" style="text-overflow: ellipsis;overflow: hidden;">
-								<input
-									type="radio"
-									id="fullOverviewLayout"
-									name="overview-layout"
-									value="full"
-									checked?={ preferences.Overview.Layout == "full" }
-								/>
-								<label class="form-check-label ml-1" for="fullOverviewLayout" style="overflow:hidden;text-overflow: ellipsis;" title="Versions + Metadata + Changelog">Versions + Metadata + Changelog</label>
-							</div>
-						</div>
-					</div>
-				</div>
-				<h4 class="mt-4 mb-1">Keywords</h4>
-				<div class="row pl-3">
-					@archesTwoColumns(preferences.Overview.Keywords)
-				</div>
-				<h4 class="mt-4 mb-1">EAPI version</h4>
-				<div class="card">
-					<div class="card-body">
-						Show
-						<select class="form-control form-control-sm ml-2" style="max-width: 100px;display: inline;" name="overview-eapi" id="overview-eapi">
-							<option
-								value="none"
-								if preferences.Overview.EAPI == "none" {
-									selected
-								}
-							>none</option>
-							<option
-								value="column"
-								if preferences.Overview.EAPI == "column" {
-									selected
-								}
-							>in column</option>
-							<option
-								value="inline"
-								if preferences.Overview.EAPI == "inline" {
-									selected
-								}
-							>inline</option>
-						</select>
 					</div>
-				</div>
-				<h4 class="mt-4 mb-1">Outdated Versions</h4>
-				<div class="card">
-					<div class="card-body">
-						<div class="form-check form-check-inline">
+					<div class="text-center mt-2">
+						<div class="form-check text-center form-check-inline" style="text-overflow: ellipsis;overflow: hidden;">
 							<input
-								type="checkbox"
-								class=""
-								id="overview-showOutdated"
-								name="overview-showOutdated"
-								value="true"
-								checked?={ preferences.Overview.ShowOutdated }
+								type="radio"
+								id="minimalOverviewLayout"
+								name="overview-layout"
+								value="minimal"
+								checked?={ preferences.Overview.Layout == "minimal" }
 							/>
-							<label class="form-check-label ml-1" for="overview-showOutdated">Show Outdated warnings?</label>
-						</div>
-					</div>
-				</div>
-				<h4 class="mt-4 mb-1">Metadata</h4>
-				<div class="card">
-					<div class="card-body">
-						<div class="row">
-							<div class="col-4">
-								<div class="form-check form-check-inline">
-									<input
-										type="checkbox"
-										name="overview-metadata-fields"
-										id="overview-metadata-fields-homepage"
-										value="homepage"
-										checked?={ slices.Contains(preferences.Overview.MetadataFields, "homepage") }
-									/>
-									<label class="form-check-label ml-1" for="overview-metadata-fields-homepage">Homepage</label>
-								</div>
-							</div>
-							<div class="col-4">
-								<div class="form-check form-check-inline">
-									<input
-										type="checkbox"
-										name="overview-metadata-fields"
-										id="overview-metadata-fields-upstream"
-										value="upstream"
-										checked?={ slices.Contains(preferences.Overview.MetadataFields, "upstream") }
-									/>
-									<label class="form-check-label ml-1" for="overview-metadata-fields-upstream">Upstream</label>
-								</div>
-							</div>
-							<div class="col-4">
-								<div class="form-check form-check-inline">
-									<input
-										type="checkbox"
-										name="overview-metadata-fields"
-										id="overview-metadata-fields-longdescription"
-										value="longdescription"
-										checked?={ slices.Contains(preferences.Overview.MetadataFields, "longdescription") }
-									/>
-									<label class="form-check-label ml-1" for="overview-metadata-fields-longdescription">Longdescription</label>
-								</div>
-							</div>
-							<div class="col-4">
-								<div class="form-check form-check-inline">
-									<input
-										type="checkbox"
-										name="overview-metadata-fields"
-										id="overview-metadata-fields-useflags"
-										value="useflags"
-										checked?={ slices.Contains(preferences.Overview.MetadataFields, "useflags") }
-									/>
-									<label class="form-check-label ml-1" for="overview-metadata-fields-useflags">USE flags</label>
-								</div>
-							</div>
-							<div class="col-4">
-								<div class="form-check form-check-inline">
-									<input
-										type="checkbox"
-										name="overview-metadata-fields"
-										id="overview-metadata-fields-license"
-										value="license"
-										checked?={ slices.Contains(preferences.Overview.MetadataFields, "license") }
-									/>
-									<label class="form-check-label ml-1" for="overview-metadata-fields-license">License</label>
-								</div>
-							</div>
-							<div class="col-4">
-								<div class="form-check form-check-inline">
-									<input
-										type="checkbox"
-										name="overview-metadata-fields"
-										id="overview-metadata-fields-maintainers"
-										value="maintainers"
-										checked?={ slices.Contains(preferences.Overview.MetadataFields, "maintainers") }
-									/>
-									<label class="form-check-label ml-1" for="overview-metadata-fields-maintainers">Maintainers</label>
-								</div>
-							</div>
+							<label class="form-check-label ml-1" for="minimalOverviewLayout" style="overflow:hidden;text-overflow: ellipsis;" title="Versions + Metadata (default)">Versions + Metadata <i>(default)</i></label>
 						</div>
 					</div>
 				</div>
-				<h4 class="mt-4 mb-1">Changelog</h4>
-				<div class="card">
-					<div class="card-body">
-						<div class="row">
-							<div class="col-6">
-								Layout
-								<select class="form-control form-control-sm ml-1" style="max-width: 100px;display: inline;" name="overview-changelog-type" id="overview-changelog-type" disabled>
-									<option value="compact">default</option>
-								</select>
-							</div>
-							<div class="col-6">
-								Size <input type="number" name="overview-changelog-size" class="form-control form-control-sm ml-1" style="width:150px;display: inline;" value={ strconv.Itoa(preferences.Overview.ChangelogLength) }/>
-							</div>
+				<div class="col-6 mt-1">
+					<div class="card" style="background: transparent;">
+						<div class="card-body">
+							<img id="img2" alt="Versions + Metadata + Changelog" src="/assets/pgo1.png" onclick="document.getElementById('fullOverviewLayout').checked = true;" style="width: 100%;cursor: pointer;"/>
 						</div>
 					</div>
-				</div>
-				<h3 class="mt-5" id="pull-requests">Pull requests</h3>
-				<hr class="mt-1"/>
-				<div class="card">
-					<div class="card-body">
-						Layout
-						<select class="form-control form-control-sm ml-1" style="max-width: 200px;display: inline;" name="pullrequests-layout" id="pullrequests-layout" disabled>
-							<option
-								value="default"
-								if preferences.PullRequests.Layout == "default" {
-									selected
-								}
-							>default</option>
-						</select>
-					</div>
-				</div>
-				<h3 class="mt-5" id="bugs">Bugs</h3>
-				<hr class="mt-1"/>
-				<div class="card">
-					<div class="card-body">
-						Layout
-						<select class="form-control form-control-sm ml-1" style="max-width: 200px;display: inline;" name="bugs-layout" id="bugs-layout" disabled>
-							<option
-								value="default"
-								if preferences.PullRequests.Layout == "default" {
-									selected
-								}
-							>default</option>
-						</select>
-					</div>
-				</div>
-				<h3 class="mt-5" id="security">Security</h3>
-				<hr class="mt-1"/>
-				<div class="card">
-					<div class="card-body">
-						<div class="row">
-							<div class="col-6">
-								Layout
-								<select class="form-control form-control-sm ml-1" style="max-width: 100px;display: inline;" name="security-layout" id="security-layout" disabled>
-									<option value="default">default</option>
-								</select>
-							</div>
-							<div class="col-6">
-								<div class="form-check form-check-inline pt-2">
-									<input
-										type="checkbox"
-										name="security-show-glsas"
-										id="security-show-glsas"
-										class="disabled"
-										value="true"
-										if preferences.Security.ShowGLSAs {
-											selected
-										}
-										disabled
-									/>
-									<label class="form-check-label ml-1" style="color:grey;">Show GLSAs</label>
-								</div>
-							</div>
+					<div class="text-center mt-2">
+						<div class="form-check text-center form-check-inline" style="text-overflow: ellipsis;overflow: hidden;">
+							<input
+								type="radio"
+								id="fullOverviewLayout"
+								name="overview-layout"
+								value="full"
+								checked?={ preferences.Overview.Layout == "full" }
+							/>
+							<label class="form-check-label ml-1" for="fullOverviewLayout" style="overflow:hidden;text-overflow: ellipsis;" title="Versions + Metadata + Changelog">Versions + Metadata + Changelog</label>
 						</div>
 					</div>
 				</div>
-				<h3 class="mt-5" id="changelog">Changelog</h3>
-				<hr class="mt-1"/>
-				<div class="card">
-					<div class="card-body">
-						<div class="row">
-							<div class="col-6">
-								Layout
-								<select class="form-control form-control-sm ml-1" style="max-width: 100px;display: inline;" name="changelog-type" id="changelog-type" disabled>
-									<option value="compact">default</option>
-								</select>
-							</div>
-							<div class="col-6">
-								Size <input type="number" name="changelog-size" class="form-control form-control-sm" style="display: inline;width: 150px;" value={ strconv.Itoa(preferences.Changelog.Size) }/>
-							</div>
-						</div>
-					</div>
+			</div>
+			<h4 class="mt-4 mb-1">Keywords</h4>
+			<div class="row pl-3">
+				@archesTwoColumns(preferences.Overview.Keywords)
+			</div>
+			<h4 class="mt-4 mb-1">EAPI version</h4>
+			<div class="card">
+				<div class="card-body">
+					Show
+					<select class="form-control form-control-sm ml-2" style="max-width: 100px;display: inline;" name="overview-eapi" id="overview-eapi">
+						<option
+							value="none"
+							selected?={ preferences.Overview.EAPI == "none" }
+						>none</option>
+						<option
+							value="column"
+							selected?={ preferences.Overview.EAPI == "column" }
+						>in column</option>
+						<option
+							value="inline"
+							selected?={ preferences.Overview.EAPI == "inline" }
+						>inline</option>
+					</select>
 				</div>
-				<div class="row">
-					<div class="col-12 mt-4">
-						<button type="submit" class="float-right btn btn-sm btn-primary">Save</button>
-						<a class="float-right btn btn-sm btn-outline-danger mr-2" href="/user/preferences/packages/reset">Reset to Defaults</a>
-					</div>
+			</div>
+			<div class="row">
+				<div class="col-12 mt-4">
+					<button type="submit" class="float-right btn btn-sm btn-primary">Save</button>
+					<a class="float-right btn btn-sm btn-outline-danger mr-2" href="/user/preferences/packages/reset">Reset to Defaults</a>
 				</div>
-			</form>
-		</div>
+			</div>
+		</form>
 	</div>
 	<div id="myModal" class="modal">
 		<span class="close">&times;</span>
@@ -322,23 +112,6 @@ func EditPackagesPreferences(w http.ResponseWriter, r *http.Request) {
 		userPreferences.Packages.Overview.EAPI = showEAPI
 	}
 
-	// Overview: Show Outdated
-	userPreferences.Packages.Overview.ShowOutdated = r.Form.Get("overview-showOutdated") == "true"
-
-	// Overview: Metadata fields
-	overviewMetadataFields := r.Form["overview-metadata-fields"]
-	userPreferences.Packages.Overview.MetadataFields = overviewMetadataFields
-
-	// Overview: Changelog
-	changelogSize, err := strconv.Atoi(r.Form.Get("overview-changelog-size"))
-	if err == nil {
-		if changelogSize < 100 {
-			userPreferences.Packages.Overview.ChangelogLength = changelogSize
-		} else {
-			userPreferences.Packages.Overview.ChangelogLength = 100
-		}
-	}
-
 	//
 	// Store cookie
 	//
diff --git a/pkg/models/userpreferences.go b/pkg/models/userpreferences.go
index 023f153..3535abb 100644
--- a/pkg/models/userpreferences.go
+++ b/pkg/models/userpreferences.go
@@ -17,39 +17,13 @@ type GeneralPreferences struct {
 }
 
 type PackagesPreferences struct {
-	Overview     PackagesOverviewPreferences
-	PullRequests PackagesPullRequestsPreferences
-	Bugs         PackagesBugsPreferences
-	Security     PackagesSecurityPreferences
-	Changelog    PackagesChangelogPreferences
+	Overview PackagesOverviewPreferences
 }
 
 type PackagesOverviewPreferences struct {
-	Layout          string
-	Keywords        []string
-	EAPI            string
-	ShowOutdated    bool
-	MetadataFields  []string
-	ChangelogType   string
-	ChangelogLength int
-}
-
-type PackagesPullRequestsPreferences struct {
-	Layout string
-}
-
-type PackagesBugsPreferences struct {
-	Layout string
-}
-
-type PackagesSecurityPreferences struct {
-	Layout    string
-	ShowGLSAs bool
-}
-
-type PackagesChangelogPreferences struct {
-	Layout string
-	Size   int
+	Layout   string
+	Keywords []string
+	EAPI     string
 }
 
 type MaintainersPreferences struct {
@@ -72,10 +46,6 @@ func GetDefaultUserPreferences() UserPreferences {
 	userPreferences.General = GeneralPreferences{}
 	userPreferences.Packages = PackagesPreferences{}
 	userPreferences.Packages.Overview = PackagesOverviewPreferences{}
-	userPreferences.Packages.PullRequests = PackagesPullRequestsPreferences{}
-	userPreferences.Packages.Bugs = PackagesBugsPreferences{}
-	userPreferences.Packages.Security = PackagesSecurityPreferences{}
-	userPreferences.Packages.Changelog = PackagesChangelogPreferences{}
 	userPreferences.Maintainers = MaintainersPreferences{}
 	userPreferences.Useflags = UseflagsPreferences{}
 	userPreferences.Arches = ArchesPreferences{}
@@ -85,20 +55,6 @@ func GetDefaultUserPreferences() UserPreferences {
 	userPreferences.Packages.Overview.Layout = "minimal"
 	userPreferences.Packages.Overview.Keywords = []string{"amd64", "x86", "alpha", "arm", "arm64", "hppa", "ia64", "ppc", "ppc64", "riscv", "sparc"}
 	userPreferences.Packages.Overview.EAPI = "none"
-	userPreferences.Packages.Overview.ShowOutdated = true
-	userPreferences.Packages.Overview.MetadataFields = []string{"homepage", "upstream", "longdescription", "useflags", "license", "maintainers"}
-	userPreferences.Packages.Overview.ChangelogType = "compact"
-	userPreferences.Packages.Overview.ChangelogLength = 5
-
-	userPreferences.Packages.PullRequests.Layout = "default"
-
-	userPreferences.Packages.Bugs.Layout = "default"
-
-	userPreferences.Packages.Security.Layout = "default"
-	userPreferences.Packages.Security.ShowGLSAs = false
-
-	userPreferences.Packages.Changelog.Layout = "compact"
-	userPreferences.Packages.Changelog.Size = 15
 
 	userPreferences.Arches.Visible = []string{"amd64", "x86", "alpha", "arm", "arm64", "hppa", "ia64", "ppc", "ppc64", "riscv", "sparc"}
 	userPreferences.Arches.DefaultArch = "amd64"
@@ -135,42 +91,6 @@ func (u *UserPreferences) Sanitize() {
 		u.Packages.Overview.EAPI = defaultUserPreferences.Packages.Overview.EAPI
 	}
 
-	sanitizedMetadataFields := []string{}
-	for _, metadataField := range u.Packages.Overview.MetadataFields {
-		if strings.Contains(strings.Join(defaultUserPreferences.Packages.Overview.MetadataFields, ","), metadataField) {
-			sanitizedMetadataFields = append(sanitizedMetadataFields, metadataField)
-		}
-	}
-	u.Packages.Overview.MetadataFields = sanitizedMetadataFields
-
-	if !(u.Packages.Overview.ChangelogType == "compact") {
-		u.Packages.Overview.ChangelogType = defaultUserPreferences.Packages.Overview.ChangelogType
-	}
-
-	if !(u.Packages.Overview.ChangelogLength >= 100) {
-		u.Packages.Overview.ChangelogLength = 100
-	}
-
-	if !(u.Packages.PullRequests.Layout == "default") {
-		u.Packages.PullRequests.Layout = defaultUserPreferences.Packages.PullRequests.Layout
-	}
-
-	if !(u.Packages.Bugs.Layout == "default") {
-		u.Packages.Bugs.Layout = defaultUserPreferences.Packages.Bugs.Layout
-	}
-
-	if !(u.Packages.Security.Layout == "default") {
-		u.Packages.Security.Layout = defaultUserPreferences.Packages.Security.Layout
-	}
-
-	if !(u.Packages.Changelog.Layout == "default") {
-		u.Packages.Changelog.Layout = defaultUserPreferences.Packages.Changelog.Layout
-	}
-
-	if !(u.Packages.Changelog.Size >= 100) {
-		u.Packages.Changelog.Size = 100
-	}
-
 	sanitizedVisibleArches := []string{}
 	for _, keyword := range u.Arches.Visible {
 		if strings.Contains(strings.Join(GetAllKeywords(), ","), keyword) {