Merge pull request #1038 from GeorgianaElena/serve_ui_from_backend

manics · web-flow · commit 4b41dc23312b · 2021-03-25T17:47:53.000Z
Serve UI config from the backend
diff --git a/binderhub/app.py b/binderhub/app.py
@@ -39,9 +39,11 @@
 from .base import AboutHandler, Custom404, VersionHandler
 from .build import Build
 from .builder import BuildHandler
+from .config import ConfigHandler
 from .health import HealthHandler
 from .launcher import Launcher
 from .log import log_request
+from .repoproviders import RepoProvider
 from .registry import DockerRegistry
 from .main import MainHandler, ParameterizedMainHandler, LegacyRedirectHandler
 from .repoproviders import (GitHubRepoProvider, GitRepoProvider,
@@ -453,6 +455,18 @@ def _add_slash(self, proposal):
         List of Repo Providers to register and try
         """
     )
+
+    @validate('repo_providers')
+    def _validate_repo_providers(self, proposal):
+        """trait validator to ensure there is at least one repo provider"""
+        if not proposal.value:
+            raise TraitError("Please provide at least one repo provider")
+
+        if any([not issubclass(provider, RepoProvider) for provider in proposal.value.values()]):
+            raise TraitError("Repository providers should inherit from 'binderhub.RepoProvider'")
+
+        return proposal.value
+
     concurrent_build_limit = Integer(
         32,
         config=True,
@@ -728,6 +742,7 @@ def initialize(self, *args, **kwargs):
                 {'path': os.path.join(self.tornado_settings['static_path'], 'images')}),
             (r'/about', AboutHandler),
             (r'/health', HealthHandler, {'hub_url': self.hub_url_local}),
+            (r'/_config', ConfigHandler),
             (r'/', MainHandler),
             (r'.*', Custom404),
         ]
diff --git a/binderhub/config.py b/binderhub/config.py
@@ -0,0 +1,13 @@
+from tornado.log import app_log
+from .base import BaseHandler
+
+class ConfigHandler(BaseHandler):
+    """Serve config"""
+    def generate_config(self):
+        config = dict()
+        for repo_provider_class_alias, repo_provider_class in self.settings["repo_providers"].items():
+            config[repo_provider_class_alias] = repo_provider_class.labels
+        return config
+
+    async def get(self):
+        self.write(self.generate_config())
diff --git a/binderhub/main.py b/binderhub/main.py
@@ -35,6 +35,7 @@ def get(self):
             google_analytics_code=self.settings['google_analytics_code'],
             google_analytics_domain=self.settings['google_analytics_domain'],
             extra_footer_scripts=self.settings['extra_footer_scripts'],
+            repo_providers=self.settings['repo_providers'],
         )
 
 
diff --git a/binderhub/repoproviders.py b/binderhub/repoproviders.py
@@ -212,6 +212,15 @@ class ZenodoProvider(RepoProvider):
     """
     name = Unicode("Zenodo")
 
+    display_name = "Zenodo DOI"
+
+    labels = {
+        "text": "Zenodo DOI (10.5281/zenodo.3242074)",
+        "tag_text": "Git ref (branch, tag, or commit)",
+        "ref_prop_disabled": True,
+        "label_prop_disabled": True,
+    }
+
     async def get_resolved_ref(self):
         client = AsyncHTTPClient()
         req = HTTPRequest("https://doi.org/{}".format(self.spec),
@@ -249,8 +258,18 @@ class FigshareProvider(RepoProvider):
     Users must provide a spec consisting of the Figshare DOI.
     """
     name = Unicode("Figshare")
+
+    display_name = "Figshare DOI"
+
     url_regex = re.compile(r"(.*)/articles/([^/]+)/([^/]+)/(\d+)(/)?(\d+)?")
 
+    labels = {
+        "text": "Figshare DOI (10.6084/m9.figshare.9782777.v1)",
+        "tag_text": "Git ref (branch, tag, or commit)",
+        "ref_prop_disabled": True,
+        "label_prop_disabled": True,
+    }
+
     async def get_resolved_ref(self):
         client = AsyncHTTPClient()
         req = HTTPRequest("https://doi.org/{}".format(self.spec),
@@ -292,6 +311,15 @@ def get_build_slug(self):
 class DataverseProvider(RepoProvider):
     name = Unicode("Dataverse")
 
+    display_name = "Dataverse DOI"
+
+    labels = {
+        "text": "Dataverse DOI (10.7910/DVN/TJCLKP)",
+        "tag_text": "Git ref (branch, tag, or commit)",
+        "ref_prop_disabled": True,
+        "label_prop_disabled": True,
+    }
+
     async def get_resolved_ref(self):
         client = AsyncHTTPClient()
         req = HTTPRequest("https://doi.org/{}".format(self.spec),
@@ -349,8 +377,18 @@ class HydroshareProvider(RepoProvider):
     Users must provide a spec consisting of the Hydroshare resource id.
     """
     name = Unicode("Hydroshare")
+
+    display_name = "Hydroshare resource"
+
     url_regex = re.compile(r".*([0-9a-f]{32}).*")
 
+    labels = {
+        "text": "Hydroshare resource id or URL",
+        "tag_text": "Git ref (branch, tag, or commit)",
+        "ref_prop_disabled": True,
+        "label_prop_disabled": True,
+    }
+
     def _parse_resource_id(self, spec):
         match = self.url_regex.match(spec)
         if not match:
@@ -414,6 +452,15 @@ class GitRepoProvider(RepoProvider):
 
     name = Unicode("Git")
 
+    display_name = "Git repository"
+
+    labels = {
+        "text": "Arbitrary git repository URL (http://git.example.com/repo)",
+        "tag_text": "Git ref (branch, tag, or commit)",
+        "ref_prop_disabled": False,
+        "label_prop_disabled": False,
+    }
+
     def __init__(self, *args, **kwargs):
         super().__init__(*args, **kwargs)
         self.url, unresolved_ref = self.spec.split('/', 1)
@@ -476,6 +523,8 @@ class GitLabRepoProvider(RepoProvider):
 
     name = Unicode('GitLab')
 
+    display_name = "GitLab.com"
+
     hostname = Unicode('gitlab.com', config=True,
         help="""The host of the GitLab instance
 
@@ -525,6 +574,13 @@ def _default_git_credentials(self):
             return r'username=binderhub\npassword={token}'.format(token=self.private_token)
         return ""
 
+    labels = {
+        "text": "GitLab.com repository or URL",
+        "tag_text": "Git ref (branch, tag, or commit)",
+        "ref_prop_disabled": False,
+        "label_prop_disabled": False,
+    }
+
     def __init__(self, *args, **kwargs):
         super().__init__(*args, **kwargs)
         self.quoted_namespace, unresolved_ref = self.spec.split('/', 1)
@@ -584,6 +640,8 @@ class GitHubRepoProvider(RepoProvider):
     """Repo provider for the GitHub service"""
     name = Unicode('GitHub')
 
+    display_name = 'GitHub'
+
     # shared cache for resolved refs
     cache = Cache(1024)
 
@@ -657,6 +715,13 @@ def _default_git_credentials(self):
                 return r'username={token}\npassword=x-oauth-basic'.format(token=self.access_token)
         return ""
 
+    labels = {
+        "text": "GitHub repository name or URL",
+        "tag_text": "Git ref (branch, tag, or commit)",
+        "ref_prop_disabled": False,
+        "label_prop_disabled": False,
+    }
+
     def __init__(self, *args, **kwargs):
         super().__init__(*args, **kwargs)
         self.user, self.repo, self.unresolved_ref = tokenize_spec(self.spec)
@@ -823,15 +888,25 @@ class GistRepoProvider(GitHubRepoProvider):
     If master or no ref is specified the latest revision will be used.
     """
 
-    name = Unicode('Gist')
-    hostname = Unicode('gist.github.com')
+    name = Unicode("Gist")
+
+    display_name = "Gist"
+
+    hostname = Unicode("gist.github.com")
 
     allow_secret_gist = Bool(
         default_value=False,
         config=True,
         help="Flag for allowing usages of secret Gists.  The default behavior is to disallow secret gists.",
     )
 
+    labels = {
+        "text": "Gist ID (username/gistId) or URL",
+        "tag_text": "Git commit SHA",
+        "ref_prop_disabled": False,
+        "label_prop_disabled": False,
+    }
+
     def __init__(self, *args, **kwargs):
         # We dont need to initialize entirely the same as github
         super(RepoProvider, self).__init__(*args, **kwargs)
diff --git a/binderhub/static/js/index.js b/binderhub/static/js/index.js
@@ -31,6 +31,7 @@ import {fit} from './vendor/xterm/addons/fit';
 
 var BASE_URL = $('#base-url').data().url;
 var BADGE_BASE_URL = $('#badge-base-url').data().url;
+var config_dict = {};
 
 function update_favicon(path) {
     var link = document.querySelector("link[rel*='icon']") || document.createElement('link');
@@ -59,50 +60,39 @@ function v2url(providerPrefix, repository, ref, path, pathType) {
   return url;
 }
 
-function updateRepoText() {
-  var text;
+function loadConfig(callback) {
+  var req = new XMLHttpRequest();
+  req.onreadystatechange = function() {
+    if (req.readyState == 4 && req.status == 200)
+      callback(req.responseText)
+  };
+  req.open('GET', BASE_URL + "_config", true);
+  req.send(null);
+}
+
+function setLabels() {
   var provider = $("#provider_prefix").val();
-  var tag_text = "Git ref (branch, tag, or commit)";
+  var text = config_dict[provider]["text"];
+  var tag_text = config_dict[provider]["tag_text"];
+  var ref_prop_disabled = config_dict[provider]["ref_prop_disabled"];
+  var label_prop_disabled = config_dict[provider]["label_prop_disabled"];
   var placeholder = "HEAD";
-  // first enable branch/ref field, some providers later disable it
-  $("#ref").prop("disabled", false);
-  $("label[for=ref]").prop("disabled", false);
-  if (provider === "gh") {
-    text = "GitHub repository name or URL";
-  } else if (provider === "gl") {
-    text = "GitLab.com repository or URL";
-  }
-  else if (provider === "gist") {
-    text = "Gist ID (username/gistId) or URL";
-    tag_text = "Git commit SHA";
-  }
-  else if (provider === "git") {
-    text = "Arbitrary git repository URL (http://git.example.com/repo)";
-  }
-  else if (provider === "zenodo") {
-    text = "Zenodo DOI (10.5281/zenodo.3242074)";
-    $("#ref").prop("disabled", true);
-    $("label[for=ref]").prop("disabled", true);
-  }
-  else if (provider === "figshare") {
-    text = "Figshare DOI (10.6084/m9.figshare.9782777.v1)";
-    $("#ref").prop("disabled", true);
-    $("label[for=ref]").prop("disabled", true);
-  }
-  else if (provider === "hydroshare") {
-    text = "Hydroshare resource id or URL";
-    $("#ref").prop("disabled", true);
-    $("label[for=ref]").prop("disabled", true);
-  }
-  else if (provider === "dataverse") {
-    text = "Dataverse DOI (10.7910/DVN/TJCLKP)";
-    $("#ref").prop("disabled", true);
-    $("label[for=ref]").prop("disabled", true);
-  }
+
+  $("#ref").attr('placeholder', placeholder).prop("disabled", ref_prop_disabled);
+  $("label[for=ref]").text(tag_text).prop("disabled", label_prop_disabled);
   $("#repository").attr('placeholder', text);
   $("label[for=repository]").text(text);
-  $("#ref").attr('placeholder', placeholder);
-  $("label[for=ref]").text(tag_text);
+}
+
+function updateRepoText() {
+  if (Object.keys(config_dict).length === 0){
+    loadConfig(function(res) {
+      config_dict = JSON.parse(res);
+      setLabels();
+    });
+  } else {
+    setLabels();
+  }
 }
 
 function getBuildFormValues() {
diff --git a/binderhub/templates/index.html b/binderhub/templates/index.html
@@ -37,44 +37,39 @@ <h4>New to Binder? Get started with a Zero-to-Binder tutorial in <a href="https:
       {% block form %}
       <form id="build-form" class="form jumbotron">
         <h4 id="form-header" class='row'>Build and launch a repository</h4>
-        <input type="hidden" id="provider_prefix" value="gh"/>
+        <input type="hidden" id="provider_prefix" value="{{repo_providers.keys() | list | first}}"/> 
         <div class="form-group row">
-          <label for="repository">Git repository URL (github.com, gitlab.com or self-host)</label>
+          <label for="repository">{{(repo_providers.values() | list | first).labels.text}}</label>
           <div class="input-group">
             <div class="input-group-btn" id="url-type-btn">
               <button type="button" class="btn btn-secondary dropdown-toggle"
                 data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
                 title="Specify source of repository"
               >
               <span id="provider_prefix-selected">
-              GitHub
+                {{(repo_providers.values() | list | first).display_name}}
               </span>
               <span class="caret"></span>
               </button>
               <ul class="dropdown-menu" id="provider_prefix_sel">
-                <li class="dropdown-item" value="gh"><a href="#">GitHub</a></li>
-                <li class="dropdown-item" value="gist"><a href="#">Gist</a></li>
-                <li class="dropdown-item" value="gl"><a href="#">GitLab.com</a></li>
-                <li class="dropdown-item" value="git"><a href="#">Git repository</a></li>
-                <li class="dropdown-item" value="zenodo"><a href="#">Zenodo DOI</a></li>
-                <li class="dropdown-item" value="figshare"><a href="#">Figshare DOI</a></li>
-                <li class="dropdown-item" value="hydroshare"><a href="#">Hydroshare resource</a></li>
-                <li class="dropdown-item" value="dataverse"><a href="#">Dataverse DOI</a></li>
+                {% for provider_prefix, provider in repo_providers.items() %}
+                  <li class="dropdown-item" value={{provider_prefix}}><a href="#">{{provider.display_name}}</a></li>
+                {% endfor %}
               </ul>
             </div>
-            <input class="form-control" type="text" id="repository" data-lpignore="true" placeholder="GitHub repository name or link"/>
+            <input class="form-control" type="text" id="repository" data-lpignore="true" placeholder="{{(repo_providers.values() | list | first).labels.text}}"/>
           </div>
         </div>
         <div class="form-row row">
           <div class="form-group col-md-4">
-            <label for="ref">Git branch, tag, or commit</label>
-            <input class="form-control" type="text" id="ref" placeholder="master"/>
+            <label for="ref">{{(repo_providers.values() | list | first).labels.tag_text}}</label>
+            <input class="form-control" type="text" id="ref" placeholder="HEAD"/>
           </div>
           <div class="form-group col-md-6">
-            <label for="filepath"></label>
+            <label for="filepath">Path to a notebook file (optional)</label>
             <div class="input-group">
               <input class="form-control" type="text" id="filepath"
-                placeholder=""
+                placeholder="Path to a notebook file (optional)"
               />
               <div class="input-group-btn" id="url-or-file-btn">
                 <button type="button" class="btn btn-secondary dropdown-toggle"
@@ -107,7 +102,8 @@ <h4 id="form-header" class='row'>Build and launch a repository</h4>
               <label>Copy the URL below and share your Binder with others:</label>
             </div>
             <div class="url-row">
-              <pre id="basic-url-snippet" data-default="Fill in the fields to see a URL for sharing your Binder."></pre>
+              <pre id="basic-url-snippet" data-default="Fill in the fields to see a URL for sharing your Binder."
+              >Fill in the fields to see a URL for sharing your Binder.</pre>
               <img class="icon clipboard" src="{{static_url("images/copy-icon-black.svg")}}" data-clipboard-target="#basic-url-snippet" alt="Copy to clipboard">
             </div>
         </div>
diff --git a/binderhub/tests/test_app.py b/binderhub/tests/test_app.py

Original file line number	Diff line number	Diff line change
`@@ -35,6 +35,7 @@ def get(self):`
`35`	`35`	`google_analytics_code=self.settings['google_analytics_code'],`
`36`	`36`	`google_analytics_domain=self.settings['google_analytics_domain'],`
`37`	`37`	`extra_footer_scripts=self.settings['extra_footer_scripts'],`
	`38`	`+ repo_providers=self.settings['repo_providers'],`
`38`	`39`	`)`
`39`	`40`
`40`	`41`