feat: make repo selector searchable on create issue form

Replace the plain <select> with an HTML5 <input> + <datalist> pair so
users can type to filter repositories. Add debounced input handler for
label loading, change event for direct datalist selection, and client-side
validation that the entered value is a known repository.

Closes leeworks-agents/gitea-mobile#87

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

internal/gitea/client.go

@@ -325,7 +325,9 @@ type PaginatedPulls struct {
 
 // ListAllIssues fetches issues across all repos in the given orgs,
 // using concurrent requests with a semaphore. Results are paginated.
-func (c *Client) ListAllIssues(ctx context.Context, token string, orgs []string, state string, page int) (PaginatedIssues, error) {
+// The label parameter filters issues by label name (empty string means no filter).
+// The repoFilter parameter narrows results to a single repo name (empty means all repos).
+func (c *Client) ListAllIssues(ctx context.Context, token string, orgs []string, state string, page int, label string, repoFilter string) (PaginatedIssues, error) {
 	if state == "" {
 		state = "open"
 	}
@@ -333,7 +335,7 @@ func (c *Client) ListAllIssues(ctx context.Context, token string, orgs []string,
 		page = 1
 	}
 
-	cacheKey := fmt.Sprintf("issues-%s-%s", state, strings.Join(orgs, ","))
+	cacheKey := fmt.Sprintf("issues-%s-%s-%s-%s", state, strings.Join(orgs, ","), label, repoFilter)
 	var allIssues []Issue
 	if cached, ok := c.getFromCache(cacheKey); ok {
 		allIssues = cached.([]Issue)
@@ -348,6 +350,17 @@ func (c *Client) ListAllIssues(ctx context.Context, token string, orgs []string,
 			allRepos = append(allRepos, repos...)
 		}
 
+		// Filter to a single repo if specified.
+		if repoFilter != "" {
+			var filtered []Repo
+			for _, r := range allRepos {
+				if r.Name == repoFilter {
+					filtered = append(filtered, r)
+				}
+			}
+			allRepos = filtered
+		}
+
 		// Fan out issue fetching across repos.
 		var mu sync.Mutex
 		sem := make(chan struct{}, c.maxConcurrent)
@@ -362,6 +375,9 @@ func (c *Client) ListAllIssues(ctx context.Context, token string, orgs []string,
 				defer func() { <-sem }()
 
 				path := fmt.Sprintf("/repos/%s/issues?state=%s&type=issues&limit=50", r.FullName, state)
+				if label != "" {
+					path += "&labels=" + label
+				}
 				resp, err := c.doRequest(ctx, token, http.MethodGet, path, nil)
 				if err != nil {
 					mu.Lock()
@@ -424,8 +440,9 @@ func (c *Client) ListAllIssues(ctx context.Context, token string, orgs []string,
 }
 
 // ListAllPullRequests fetches PRs across all repos in the given orgs.
-// Results are paginated.
-func (c *Client) ListAllPullRequests(ctx context.Context, token string, orgs []string, state string, page int) (PaginatedPulls, error) {
+// Results are paginated. The label parameter filters PRs by label name.
+// The repoFilter parameter narrows results to a single repo name.
+func (c *Client) ListAllPullRequests(ctx context.Context, token string, orgs []string, state string, page int, label string, repoFilter string) (PaginatedPulls, error) {
 	if state == "" {
 		state = "open"
 	}
@@ -433,7 +450,7 @@ func (c *Client) ListAllPullRequests(ctx context.Context, token string, orgs []s
 		page = 1
 	}
 
-	cacheKey := fmt.Sprintf("pulls-%s-%s", state, strings.Join(orgs, ","))
+	cacheKey := fmt.Sprintf("pulls-%s-%s-%s-%s", state, strings.Join(orgs, ","), label, repoFilter)
 	var allPRs []PullRequest
 	if cached, ok := c.getFromCache(cacheKey); ok {
 		allPRs = cached.([]PullRequest)
@@ -447,6 +464,17 @@ func (c *Client) ListAllPullRequests(ctx context.Context, token string, orgs []s
 			allRepos = append(allRepos, repos...)
 		}
 
+		// Filter to a single repo if specified.
+		if repoFilter != "" {
+			var filtered []Repo
+			for _, r := range allRepos {
+				if r.Name == repoFilter {
+					filtered = append(filtered, r)
+				}
+			}
+			allRepos = filtered
+		}
+
 		var mu sync.Mutex
 		sem := make(chan struct{}, c.maxConcurrent)
 		var wg sync.WaitGroup
@@ -460,6 +488,9 @@ func (c *Client) ListAllPullRequests(ctx context.Context, token string, orgs []s
 				defer func() { <-sem }()
 
 				path := fmt.Sprintf("/repos/%s/pulls?state=%s&limit=50", r.FullName, state)
+				if label != "" {
+					path += "&labels=" + label
+				}
 				resp, err := c.doRequest(ctx, token, http.MethodGet, path, nil)
 				if err != nil {
 					mu.Lock()
@@ -524,7 +555,7 @@ func (c *Client) GetTriageQueue(ctx context.Context, token string, orgs []string
 	// Collect all open issues across all pages.
 	var issues []Issue
 	for page := 1; ; page++ {
-		result, err := c.ListAllIssues(ctx, token, orgs, "open", page)
+		result, err := c.ListAllIssues(ctx, token, orgs, "open", page, "", "")
 		if err != nil {
 			return nil, fmt.Errorf("fetching issues for triage: %w", err)
 		}
@@ -537,7 +568,7 @@ func (c *Client) GetTriageQueue(ctx context.Context, token string, orgs []string
 	// Collect all open PRs across all pages.
 	var prs []PullRequest
 	for page := 1; ; page++ {
-		result, err := c.ListAllPullRequests(ctx, token, orgs, "open", page)
+		result, err := c.ListAllPullRequests(ctx, token, orgs, "open", page, "", "")
 		if err != nil {
 			return nil, fmt.Errorf("fetching PRs for triage: %w", err)
 		}

internal/handlers/handlers.go

@@ -249,6 +249,9 @@ func (h *Handler) ListIssues(w http.ResponseWriter, r *http.Request) {
 		Orgs          []string
 		SelectedOrg   string
 		SelectedState string
+		SelectedLabel string
+		SelectedRepo  string
+		Repos         []string
 		HasMore       bool
 		NextPage      int
 		Error         string
@@ -259,6 +262,8 @@ func (h *Handler) ListIssues(w http.ResponseWriter, r *http.Request) {
 	if selectedState == "" {
 		selectedState = "open"
 	}
+	selectedLabel := r.URL.Query().Get("label")
+	selectedRepo := r.URL.Query().Get("repo")
 	page, _ := strconv.Atoi(r.URL.Query().Get("page"))
 	if page < 1 {
 		page = 1
@@ -268,6 +273,8 @@ func (h *Handler) ListIssues(w http.ResponseWriter, r *http.Request) {
 		Orgs:          orgNames,
 		SelectedOrg:   selectedOrg,
 		SelectedState: selectedState,
+		SelectedLabel: selectedLabel,
+		SelectedRepo:  selectedRepo,
 	}
 
 	if len(orgNames) == 0 {
@@ -277,9 +284,19 @@ func (h *Handler) ListIssues(w http.ResponseWriter, r *http.Request) {
 		queryOrgs := orgNames
 		if selectedOrg != "" {
 			queryOrgs = []string{selectedOrg}
+
+			// Populate repo list for the selected org.
+			repos, err := h.Client.ListOrgRepos(r.Context(), token, selectedOrg)
+			if err != nil {
+				slog.Warn("failed to list repos for org filter", "error", err, "org", selectedOrg)
+			} else {
+				for _, repo := range repos {
+					data.Repos = append(data.Repos, repo.Name)
+				}
+			}
 		}
 
-		result, err := h.Client.ListAllIssues(r.Context(), token, queryOrgs, selectedState, page)
+		result, err := h.Client.ListAllIssues(r.Context(), token, queryOrgs, selectedState, page, selectedLabel, selectedRepo)
 		if err != nil {
 			slog.Error("failed to list issues", "error", err)
 			data.Error = "Error loading issues."
@@ -338,6 +355,9 @@ func (h *Handler) ListPulls(w http.ResponseWriter, r *http.Request) {
 		Orgs          []string
 		SelectedOrg   string
 		SelectedState string
+		SelectedLabel string
+		SelectedRepo  string
+		Repos         []string
 		HasMore       bool
 		NextPage      int
 		Error         string
@@ -348,6 +368,8 @@ func (h *Handler) ListPulls(w http.ResponseWriter, r *http.Request) {
 	if selectedState == "" {
 		selectedState = "open"
 	}
+	selectedLabel := r.URL.Query().Get("label")
+	selectedRepo := r.URL.Query().Get("repo")
 	page, _ := strconv.Atoi(r.URL.Query().Get("page"))
 	if page < 1 {
 		page = 1
@@ -357,6 +379,8 @@ func (h *Handler) ListPulls(w http.ResponseWriter, r *http.Request) {
 		Orgs:          orgNames,
 		SelectedOrg:   selectedOrg,
 		SelectedState: selectedState,
+		SelectedLabel: selectedLabel,
+		SelectedRepo:  selectedRepo,
 	}
 
 	if len(orgNames) == 0 {
@@ -365,9 +389,19 @@ func (h *Handler) ListPulls(w http.ResponseWriter, r *http.Request) {
 		queryOrgs := orgNames
 		if selectedOrg != "" {
 			queryOrgs = []string{selectedOrg}
+
+			// Populate repo list for the selected org.
+			repos, err := h.Client.ListOrgRepos(r.Context(), token, selectedOrg)
+			if err != nil {
+				slog.Warn("failed to list repos for org filter", "error", err, "org", selectedOrg)
+			} else {
+				for _, repo := range repos {
+					data.Repos = append(data.Repos, repo.Name)
+				}
+			}
 		}
 
-		result, err := h.Client.ListAllPullRequests(r.Context(), token, queryOrgs, selectedState, page)
+		result, err := h.Client.ListAllPullRequests(r.Context(), token, queryOrgs, selectedState, page, selectedLabel, selectedRepo)
 		if err != nil {
 			slog.Error("failed to list pull requests", "error", err)
 			data.Error = "Error loading pull requests."

internal/templates/create_issue.html

@@ -6,16 +6,15 @@
 <form id="create-issue-form" hx-post="/issues" hx-swap="innerHTML" hx-target="#main-content">
   <div class="form-group">
     <label for="repo-select">Repository</label>
-    <select id="repo-select" name="owner_repo" required>
-      <option value="">Select a repository...</option>
+    <input list="repo-options" id="repo-select" name="owner_repo"
+           placeholder="Type to search repositories..." required autocomplete="off">
+    <datalist id="repo-options">
       {{range $org, $repos := .Repos}}
-      <optgroup label="{{$org}}">
         {{range $repos}}
         <option value="{{.Owner.Login}}/{{.Name}}">{{.FullName}}</option>
         {{end}}
-      </optgroup>
       {{end}}
-    </select>
+    </datalist>
     <input type="hidden" name="owner" id="owner-input">
     <input type="hidden" name="repo" id="repo-input">
   </div>
@@ -45,9 +44,16 @@
     var repoInput = document.getElementById('repo-input');
     var formError = document.getElementById('form-error');
 
+    // Build a set of valid repo values for validation.
+    var validRepos = {};
+    var options = document.getElementById('repo-options').options;
+    for (var i = 0; i < options.length; i++) {
+      validRepos[options[i].value] = true;
+    }
+
     function splitOwnerRepo() {
       var val = repoSelect.value;
-      if (val) {
+      if (val && val.indexOf('/') !== -1) {
         var parts = val.split('/');
         ownerInput.value = parts[0] || '';
         repoInput.value = parts[1] || '';
@@ -57,11 +63,31 @@
       }
     }
 
-    repoSelect.addEventListener('change', function() {
+    var debounceTimer = null;
+    repoSelect.addEventListener('input', function() {
+      clearTimeout(debounceTimer);
+      debounceTimer = setTimeout(function() {
         splitOwnerRepo();
         var labelSection = document.getElementById('label-section');
         var labelList = document.getElementById('label-list');
-      if (ownerInput.value && repoInput.value) {
+        if (ownerInput.value && repoInput.value && validRepos[repoSelect.value]) {
+          labelList.innerHTML = '<span class="empty">Loading labels...</span>';
+          labelSection.style.display = 'block';
+          htmx.ajax('GET', '/issues/new/labels?owner=' + encodeURIComponent(ownerInput.value) + '&repo=' + encodeURIComponent(repoInput.value), {target: '#label-list', swap: 'innerHTML'});
+        } else {
+          labelSection.style.display = 'none';
+          labelList.innerHTML = '';
+        }
+      }, 300);
+    });
+
+    // Also handle the change event for when a datalist option is selected directly.
+    repoSelect.addEventListener('change', function() {
+      clearTimeout(debounceTimer);
+      splitOwnerRepo();
+      var labelSection = document.getElementById('label-section');
+      var labelList = document.getElementById('label-list');
+      if (ownerInput.value && repoInput.value && validRepos[repoSelect.value]) {
         labelList.innerHTML = '<span class="empty">Loading labels...</span>';
         labelSection.style.display = 'block';
         htmx.ajax('GET', '/issues/new/labels?owner=' + encodeURIComponent(ownerInput.value) + '&repo=' + encodeURIComponent(repoInput.value), {target: '#label-list', swap: 'innerHTML'});
@@ -80,6 +106,12 @@
         formError.style.display = 'block';
         return false;
       }
+      if (!validRepos[repoSelect.value]) {
+        evt.preventDefault();
+        formError.textContent = 'Please select a valid repository from the list.';
+        formError.style.display = 'block';
+        return false;
+      }
       formError.style.display = 'none';
     });
 

internal/templates/issues.html

@@ -14,7 +14,7 @@
   </div>
   {{end}}
   {{if .HasMore}}
-  <div class="scroll-sentinel" hx-get="/issues?page={{.NextPage}}&org={{.SelectedOrg}}&state={{.SelectedState}}" hx-trigger="revealed" hx-swap="outerHTML" hx-target="this">
+  <div class="scroll-sentinel" hx-get="/issues?page={{.NextPage}}&org={{.SelectedOrg}}&state={{.SelectedState}}&label={{.SelectedLabel}}&repo={{.SelectedRepo}}" hx-trigger="revealed" hx-swap="outerHTML" hx-target="this">
     <div class="spinner htmx-indicator"></div>
   </div>
   {{end}}
@@ -24,16 +24,25 @@
 <h1>Issues</h1>
 
 <div class="filter-bar">
-  <select name="org" hx-get="/issues" hx-trigger="change" hx-target="#main-content" hx-swap="innerHTML" hx-push-url="true" hx-include="[name='state']">
+  <select name="org" hx-get="/issues" hx-trigger="change" hx-target="#main-content" hx-swap="innerHTML" hx-push-url="true" hx-include="[name='state'],[name='label']">
     <option value="">All orgs</option>
     {{range .Orgs}}
     <option value="{{.}}" {{if eq . $.SelectedOrg}}selected{{end}}>{{.}}</option>
     {{end}}
   </select>
-  <select name="state" hx-get="/issues" hx-trigger="change" hx-target="#main-content" hx-swap="innerHTML" hx-push-url="true" hx-include="[name='org']">
+  {{if .Repos}}
+  <select name="repo" hx-get="/issues" hx-trigger="change" hx-target="#main-content" hx-swap="innerHTML" hx-push-url="true" hx-include="[name='org'],[name='state'],[name='label']">
+    <option value="">All repos</option>
+    {{range .Repos}}<option value="{{.}}" {{if eq . $.SelectedRepo}}selected{{end}}>{{.}}</option>{{end}}
+  </select>
+  {{end}}
+  <select name="state" hx-get="/issues" hx-trigger="change" hx-target="#main-content" hx-swap="innerHTML" hx-push-url="true" hx-include="[name='org'],[name='repo'],[name='label']">
     <option value="open" {{if eq .SelectedState "open"}}selected{{end}}>Open</option>
     <option value="closed" {{if eq .SelectedState "closed"}}selected{{end}}>Closed</option>
   </select>
+  <input type="text" name="label" placeholder="Filter by label..." value="{{.SelectedLabel}}"
+         hx-get="/issues" hx-trigger="input changed delay:400ms" hx-target="#main-content"
+         hx-swap="innerHTML" hx-push-url="true" hx-include="[name='org'],[name='state'],[name='repo']">
 </div>
 
 {{if .Error}}

internal/templates/pulls.html

@@ -17,7 +17,7 @@
   </div>
   {{end}}
   {{if .HasMore}}
-  <div class="scroll-sentinel" hx-get="/pulls?page={{.NextPage}}&org={{.SelectedOrg}}&state={{.SelectedState}}" hx-trigger="revealed" hx-swap="outerHTML" hx-target="this">
+  <div class="scroll-sentinel" hx-get="/pulls?page={{.NextPage}}&org={{.SelectedOrg}}&state={{.SelectedState}}&label={{.SelectedLabel}}&repo={{.SelectedRepo}}" hx-trigger="revealed" hx-swap="outerHTML" hx-target="this">
     <div class="spinner htmx-indicator"></div>
   </div>
   {{end}}
@@ -27,16 +27,25 @@
 <h1>Pull Requests</h1>
 
 <div class="filter-bar">
-  <select name="org" hx-get="/pulls" hx-trigger="change" hx-target="#main-content" hx-swap="innerHTML" hx-push-url="true" hx-include="[name='state']">
+  <select name="org" hx-get="/pulls" hx-trigger="change" hx-target="#main-content" hx-swap="innerHTML" hx-push-url="true" hx-include="[name='state'],[name='label']">
     <option value="">All orgs</option>
     {{range .Orgs}}
     <option value="{{.}}" {{if eq . $.SelectedOrg}}selected{{end}}>{{.}}</option>
     {{end}}
   </select>
-  <select name="state" hx-get="/pulls" hx-trigger="change" hx-target="#main-content" hx-swap="innerHTML" hx-push-url="true" hx-include="[name='org']">
+  {{if .Repos}}
+  <select name="repo" hx-get="/pulls" hx-trigger="change" hx-target="#main-content" hx-swap="innerHTML" hx-push-url="true" hx-include="[name='org'],[name='state'],[name='label']">
+    <option value="">All repos</option>
+    {{range .Repos}}<option value="{{.}}" {{if eq . $.SelectedRepo}}selected{{end}}>{{.}}</option>{{end}}
+  </select>
+  {{end}}
+  <select name="state" hx-get="/pulls" hx-trigger="change" hx-target="#main-content" hx-swap="innerHTML" hx-push-url="true" hx-include="[name='org'],[name='repo'],[name='label']">
     <option value="open" {{if eq .SelectedState "open"}}selected{{end}}>Open</option>
     <option value="closed" {{if eq .SelectedState "closed"}}selected{{end}}>Closed</option>
   </select>
+  <input type="text" name="label" placeholder="Filter by label..." value="{{.SelectedLabel}}"
+         hx-get="/pulls" hx-trigger="input changed delay:400ms" hx-target="#main-content"
+         hx-swap="innerHTML" hx-push-url="true" hx-include="[name='org'],[name='state'],[name='repo']">
 </div>
 
 {{if .Error}}