GitHub like repo home page

options/locale/locale_en-US.ini

@@ -144,6 +144,7 @@ confirm_delete_selected = Confirm to delete all selected items?
 
 name = Name
 value = Value
+readme = Readme
 
 filter = Filter
 filter.clear = Clear Filter
@@ -1035,7 +1036,8 @@ generate_repo = Generate Repository
 generate_from = Generate From
 repo_desc = Description
 repo_desc_helper = Enter short description (optional)
-repo_lang = Language
+repo_no_desc = No description provided
+repo_lang = Languages
 repo_gitignore_helper = Select .gitignore templates.
 repo_gitignore_helper_desc = Choose which files not to track from a list of templates for common languages. Typical artifacts generated by each language's build tools are included on .gitignore by default.
 issue_labels = Issue Labels

routers/web/repo/view.go

@@ -903,6 +903,22 @@ func renderLanguageStats(ctx *context.Context) {
 	ctx.Data["LanguageStats"] = langs
 }
 
+func renderLatestRelease(ctx *context.Context) {
+	release, err := repo_model.GetLatestReleaseByRepoID(ctx, ctx.Repo.Repository.ID)
+	if err != nil && !repo_model.IsErrReleaseNotExist(err) {
+		ctx.ServerError("GetLatestReleaseByRepoID", err)
+		return
+	}
+
+	if release != nil {
+		if err = release.LoadAttributes(ctx); err != nil {
+			ctx.ServerError("release.LoadAttributes", err)
+			return
+		}
+		ctx.Data["LatestRelease"] = release
+	}
+}
+
 func renderRepoTopics(ctx *context.Context) {
 	topics, err := db.Find[repo_model.Topic](ctx, &repo_model.FindTopicOptions{
 		RepoID: ctx.Repo.Repository.ID,
@@ -1015,6 +1031,11 @@ func renderHomeCode(ctx *context.Context) {
 		return
 	}
 
+	renderLatestRelease(ctx)
+	if ctx.Written() {
+		return
+	}
+
 	if entry.IsDir() {
 		renderDirectory(ctx)
 	} else {

templates/repo/sub_menu.tmpl

@@ -13,39 +13,12 @@
 					{{svg "octicon-tag"}} <b>{{ctx.Locale.PrettyNumber .NumTags}}</b> {{ctx.Locale.TrN .NumTags "repo.tag" "repo.tags"}}
 				</a>
 			{{end}}
-			{{if .DetectedRepoLicenses}}
-				<a class="item muted" href="{{.RepoLink}}/src/{{.Repository.DefaultBranch}}/{{PathEscapeSegments .LicenseFileName}}" data-tooltip-placement="top" data-tooltip-content="{{StringUtils.Join .DetectedRepoLicenses ", "}}">
-					{{svg "octicon-law"}} <b>{{if eq (len .DetectedRepoLicenses) 1}}{{index .DetectedRepoLicenses 0}}{{else}}{{ctx.Locale.Tr "repo.multiple_licenses"}}{{end}}</b>
-				</a>
-			{{end}}
 			<span class="item not-mobile" {{if not (eq .Repository.Size 0)}}data-tooltip-placement="top" data-tooltip-content="{{.Repository.SizeDetailsString}}"{{end}}>
 				{{$fileSizeFormatted := FileSize .Repository.Size}}{{/* the formatted string is always "{val} {unit}" */}}
 				{{$fileSizeFields := StringUtils.Split $fileSizeFormatted " "}}
 				{{svg "octicon-database"}} <b>{{ctx.Locale.PrettyNumber (index $fileSizeFields 0)}}</b> {{index $fileSizeFields 1}}
 			</span>
 		{{end}}
 	</div>
-	{{if and (.Permission.CanRead ctx.Consts.RepoUnitTypeCode) (not .IsEmptyRepo) .LanguageStats}}
-	<div class="ui segment sub-menu language-stats-details tw-hidden">
-		{{range .LanguageStats}}
-		<div class="item">
-			<i class="color-icon" style="background-color: {{.Color}}"></i>
-			<span class="tw-font-semibold">
-				{{if eq .Language "other"}}
-					{{ctx.Locale.Tr "repo.language_other"}}
-				{{else}}
-					{{.Language}}
-				{{end}}
-			</span>
-			{{.Percentage}}%
-		</div>
-		{{end}}
-	</div>
-	<a class="ui segment language-stats show-panel toggle" data-panel=".repository-summary > .sub-menu">
-		{{range .LanguageStats}}
-		<div class="bar" style="width: {{.Percentage}}%; background-color: {{.Color}}" data-tooltip-placement="top" data-tooltip-content={{.Language}} data-tooltip-follow-cursor="horizontal"></div>
-		{{end}}
-	</a>
-	{{end}}
 </div>
 {{end}}

web_src/css/modules/flexcontainer.css

@@ -21,6 +21,10 @@
   min-width: 0; /* make the "text truncate" work, otherwise the flex axis is not limited and the text just overflows */
 }
 
+.flex-container-repo {
+  width: 25%;
+}
+
 @media (max-width: 767.98px) {
   .flex-container {
     flex-direction: column;
@@ -30,4 +34,7 @@
     order: -1;
     width: auto;
   }
+  .flex-container-repo {
+    width: auto;
+  }
 }

web_src/css/repo.css

@@ -1836,14 +1836,33 @@ td .commit-summary {
   background: var(--color-secondary);
 }
 
-.repository .repository-summary .segment.language-stats {
+.language-stats {
   display: flex;
   gap: 2px;
   padding: 0;
   height: 10px;
   white-space: nowrap;
   border-radius: 0 0 3px 3px !important;
   overflow: hidden;
+  width: 100%;
+  margin-top: 1rem;
+  margin-bottom: 5px;
+}
+
+.language-stats-details {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.language-stats-details .item {
+  height: 30px;
+  line-height: var(--line-height-default);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.25em;
+  padding: 0 0.5em; /* make the UI look better for narrow (mobile) view */
+  text-decoration: none;
 }
 
 #cite-repo-modal #citation-panel {

web_src/js/features/citation.ts

@@ -30,6 +30,7 @@ export async function initCitationFileCopyContent() {
   const citationCopyApa = document.querySelector('#citation-copy-apa');
   const citationCopyBibtex = document.querySelector('#citation-copy-bibtex');
   const inputContent = document.querySelector('#citation-copy-content');
+  const modal = document.querySelector('#cite-repo-modal');
 
   if ((!citationCopyApa && !citationCopyBibtex) || !inputContent) return;
 
@@ -41,9 +42,9 @@ export async function initCitationFileCopyContent() {
     citationCopyApa.classList.toggle('primary', !isBibtex);
   };
 
-  document.querySelector('#cite-repo-button')?.addEventListener('click', async (e) => {
-    const dropdownBtn = e.target.closest('.ui.dropdown.button');
-    dropdownBtn.classList.add('is-loading');
+  document.querySelector('#cite-repo-button')?.addEventListener('click', async () => {
+    $(modal).modal('show');
+    $(modal).addClass('is-loading');
 
     try {
       try {
@@ -68,9 +69,7 @@ export async function initCitationFileCopyContent() {
         inputContent.select();
       });
     } finally {
-      dropdownBtn.classList.remove('is-loading');
+      $(modal).removeClass('is-loading');
     }
-
-    $('#cite-repo-modal').modal('show');
   });
 }

web_src/js/features/repo-home.ts

@@ -46,11 +46,12 @@ export function initRepoTopicBar() {
           topicArray.sort();
           for (const topic of topicArray) {
             // it should match the code in repo/home.tmpl
+            // TODO: sort items in topicDropdown, or items in edit div will have different order to the items in view div
             const link = document.createElement('a');
             link.classList.add('repo-topic', 'ui', 'large', 'label');
             link.href = `${appSubUrl}/explore/repos?q=${encodeURIComponent(topic)}&topic=1`;
             link.textContent = topic;
-            mgrBtn.parentNode.insertBefore(link, mgrBtn); // insert all new topics before manage button
+            viewDiv.append(link);
           }
         }
         hideElem(editDiv);