show limit message

Author: wxiaoguang

routers/web/repo/repo.go

@@ -154,8 +154,8 @@ func createCommon(ctx *context.Context) {
 	ctx.Data["Licenses"] = repo_module.Licenses
 	ctx.Data["Readmes"] = repo_module.Readmes
 	ctx.Data["IsForcedPrivate"] = setting.Repository.ForcePrivate
-	ctx.Data["CanCreateRepo"] = ctx.Doer.CanCreateRepo()
-	ctx.Data["MaxCreationLimit"] = ctx.Doer.MaxCreationLimit()
+	ctx.Data["CanCreateRepoInDoer"] = ctx.Doer.CanCreateRepo()
+	ctx.Data["MaxCreationLimitOfDoer"] = ctx.Doer.MaxCreationLimit()
 	ctx.Data["SupportedObjectFormats"] = git.DefaultFeatures().SupportedObjectFormats
 	ctx.Data["DefaultObjectFormat"] = git.Sha1ObjectFormat
 }

templates/repo/create.tmpl

@@ -9,17 +9,19 @@
 			{{template "repo/create_helper" .}}
 			<form class="ui form left-right-form new-repo-form" action="{{.Link}}" method="post">
 				{{.CsrfTokenHtml}}
+				<div id="create-repo-error-message" class="ui negative message tw-text-center tw-hidden"></div>
 				<div class="inline required field {{if .Err_Owner}}error{{end}}">
 					<label>{{ctx.Locale.Tr "repo.owner"}}</label>
-					<div class="ui selection owner dropdown">
-						<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
-						<span class="text truncated-item-container" title="{{.ContextUser.Name}}">
-							{{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}}
-							<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
-						</span>
+					<div class="ui selection dropdown" id="repo_owner_dropdown">
+						<input type="hidden" name="uid" value="{{.ContextUser.ID}}">
+						<span class="text truncated-item-name"></span>
 						{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 						<div class="menu">
-							<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}">
+							<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}" title="{{.Name}}"
+								{{if not .CanCreateRepoInDoer}}
+									 data-create-repo-disallowed-prompt="{{ctx.Locale.TrN .MaxCreationLimit "repo.form.reach_limit_of_creation_1" "repo.form.reach_limit_of_creation_n" .MaxCreationLimitOfDoer}}"
+								{{end}}
+							>
 								{{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}}
 								<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 							</div>

web_src/js/features/repo-new.ts

@@ -6,7 +6,8 @@ import {sanitizeRepoName} from './repo-common.ts';
 const {appSubUrl} = window.config;
 
 function initRepoNewTemplateSearch(form: HTMLFormElement) {
-  const inputRepoOwnerUid = form.querySelector<HTMLInputElement>('#uid');
+  const elCreateRepoErrorMessage = form.querySelector('#create-repo-error-message');
+  const elRepoOwnerDropdown = form.querySelector('#repo_owner_dropdown');
   const elRepoTemplateDropdown = form.querySelector<HTMLInputElement>('#repo_template_search');
   const inputRepoTemplate = form.querySelector<HTMLInputElement>('#repo_template');
   const elTemplateUnits = form.querySelector('#template_units');
@@ -19,11 +20,20 @@ function initRepoNewTemplateSearch(form: HTMLFormElement) {
   inputRepoTemplate.addEventListener('change', checkTemplate);
   checkTemplate();
 
-  const $dropdown = fomanticQuery(elRepoTemplateDropdown);
+  const $repoOwnerDropdown = fomanticQuery(elRepoOwnerDropdown);
+  const $repoTemplateDropdown = fomanticQuery(elRepoTemplateDropdown);
   const onChangeOwner = function () {
-    $dropdown.dropdown('setting', {
+    const ownerId = $repoOwnerDropdown.dropdown('get value');
+    const $ownerItem = $repoOwnerDropdown.dropdown('get item', ownerId);
+    hideElem(elCreateRepoErrorMessage);
+    if ($ownerItem?.length) {
+      const elOwnerItem = $ownerItem[0];
+      elCreateRepoErrorMessage.textContent = elOwnerItem.getAttribute('data-create-repo-disallowed-prompt') ?? '';
+      toggleElem(elCreateRepoErrorMessage, Boolean(elCreateRepoErrorMessage.textContent));
+    }
+    $repoTemplateDropdown.dropdown('setting', {
       apiSettings: {
-        url: `${appSubUrl}/repo/search?q={query}&template=true&priority_owner_id=${inputRepoOwnerUid.value}`,
+        url: `${appSubUrl}/repo/search?q={query}&template=true&priority_owner_id=${ownerId}`,
         onResponse(response: any) {
           const results = [];
           results.push({name: '', value: ''}); // empty item means not using template
@@ -33,14 +43,14 @@ function initRepoNewTemplateSearch(form: HTMLFormElement) {
               value: String(tmplRepo.repository.id),
             });
           }
-          $dropdown.fomanticExt.onResponseKeepSelectedItem($dropdown, inputRepoTemplate.value);
+          $repoTemplateDropdown.fomanticExt.onResponseKeepSelectedItem($repoTemplateDropdown, inputRepoTemplate.value);
           return {results};
         },
         cache: false,
       },
     });
   };
-  inputRepoOwnerUid.addEventListener('change', onChangeOwner);
+  $repoOwnerDropdown.dropdown('setting', 'onChange', onChangeOwner);
   onChangeOwner();
 }