Refactor branch/tag selector to Vue SFC (#23421)

Follow #23394

There were many bad smells in old code. This PR only moves the code into
Vue SFC, doesn't touch the unrelated logic.

update: after
5f23218c85
, there should be no usage of the vue-rumtime-compiler anymore
(hopefully), so I think this PR could close #19851

---------

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>

web_src/js/features/repo-findfile.js

@@ -1,6 +1,7 @@
 import $ from 'jquery';
 import {svg} from '../svg.js';
 import {toggleElem} from '../utils/dom.js';
+import {pathEscapeSegments} from '../utils/url.js';
 
 const {csrf} = window.config;
 
@@ -73,10 +74,6 @@ export function filterRepoFilesWeighted(files, filter) {
   return filterResult;
 }
 
-export function escapePath(s) {
-  return s.split('/').map(encodeURIComponent).join('/');
-}
-
 function filterRepoFiles(filter) {
   const treeLink = $repoFindFileInput.attr('data-url-tree-link');
   $repoFindFileTableBody.empty();
@@ -88,7 +85,7 @@ function filterRepoFiles(filter) {
   for (const r of filterResult) {
     const $row = $(tmplRow);
     const $a = $row.find('a');
-    $a.attr('href', `${treeLink}/${escapePath(r.matchResult.join(''))}`);
+    $a.attr('href', `${treeLink}/${pathEscapeSegments(r.matchResult.join(''))}`);
     const $octiconFile = $(svg('octicon-file')).addClass('gt-mr-3');
     $a.append($octiconFile);
     // if the target file path is "abc/xyz", to search "bx", then the matchResult is ['a', 'b', 'c/', 'x', 'yz']