update ui

modules/app.py

@@ -15,7 +15,7 @@ import json
 # from flask import Flask, request, render_template
 # from flask_cors import CORS
 # app = Flask(__name__, static_folder='static')
-# app.config['TEMPLATES_AUTO_RELOAD'] = True
+# app.config['TEMPLATES_AUTO_RELOAD'] = Tru
 # CORS(app, resources= {
 #     r"/generate": {"origins": origins},
 #     r"/infill": {"origins": origins},
@@ -25,9 +25,12 @@ import json
 PORT = 7860
 VERBOSE = False
 
+MAX_LENGTH = 256+64
+TRUNCATION_MESSAGE = f'warning: This demo is limited to {MAX_LENGTH} tokens in the document for efficiency.'
+
 if BIG_MODEL:
     CUDA = True
-    model_name = "facebook/incoder-6B"
+    model_name = "./incoder-6B"
 else:
     CUDA = False
     model_name = "facebook/incoder-1B"
@@ -60,21 +63,28 @@ def generate(input, length_limit=None, temperature=None):
     input_ids = tokenizer(input, return_tensors="pt").input_ids
     if CUDA:
         input_ids = input_ids.cuda()
-    max_length = length_limit + input_ids.flatten().size(0)
-    if max_length > 256:
-        max_length = 256
+    current_length = input_ids.flatten().size(0)
+    max_length = length_limit + current_length
+    truncated = False
+    if max_length > MAX_LENGTH:
+        max_length = MAX_LENGTH
+        truncated = True
+    if max_length == current_length:
+        return input, True
     output = model.generate(input_ids=input_ids, do_sample=True, top_p=0.95, temperature=temperature, max_length=max_length)
     detok_hypo_str = tokenizer.decode(output.flatten())
     if detok_hypo_str.startswith(BOS):
         detok_hypo_str = detok_hypo_str[len(BOS):]
-    return detok_hypo_str
+    return detok_hypo_str, truncated
 
 def infill(parts: List[str], length_limit=None, temperature=None, extra_sentinel=False, max_retries=1):
     assert isinstance(parts, list)
     retries_attempted = 0
     done = False
 
+
     while (not done) and (retries_attempted < max_retries):
+        any_truncated = False
         retries_attempted += 1
         if VERBOSE:
             print(f"retry {retries_attempted}")
@@ -98,7 +108,8 @@ def infill(parts: List[str], length_limit=None, temperature=None, extra_sentinel
         for sentinel_ix, part in enumerate(parts[:-1]):
             complete.append(part)
             prompt += make_sentinel(sentinel_ix)
-            completion = generate(prompt, length_limit, temperature)
+            completion, this_truncated = generate(prompt, length_limit, temperature)
+            any_truncated |= this_truncated
             completion = completion[len(prompt):]
             if EOM not in completion:
                 if VERBOSE:
@@ -133,6 +144,7 @@ def infill(parts: List[str], length_limit=None, temperature=None, extra_sentinel
         'parts': parts,
         'infills': infills,
         'retries_attempted': retries_attempted,
+        'truncated': any_truncated,
     } 
 
 
@@ -151,11 +163,15 @@ async def generate_maybe(info: str):
     if VERBOSE:
         print(prompt)
     try:
-        generation = generate(prompt, length_limit, temperature)
-        return {'result': 'success', 'type': 'generate', 'prompt': prompt, 'text': generation}
+        generation, truncated = generate(prompt, length_limit, temperature)
+        if truncated:
+            message = TRUNCATION_MESSAGE 
+        else:
+            message = ''
+        return {'result': 'success', 'type': 'generate', 'prompt': prompt, 'text': generation, 'message': message}
     except Exception as e:
         traceback.print_exception(*sys.exc_info())
-        return {'result': 'error', 'type': 'generate', 'prompt': prompt, 'text': f'There was an error: {e}. Tell Daniel.'}
+        return {'result': 'error', 'type': 'generate', 'prompt': prompt, 'message': f'Error: {e}.'}
 
 @app.get('/infill')
 async def infill_maybe(info: str):
@@ -169,12 +185,16 @@ async def infill_maybe(info: str):
         generation = infill(form['parts'], length_limit, temperature, extra_sentinel=extra_sentinel, max_retries=max_retries)
         generation['result'] = 'success'
         generation['type'] = 'infill'
+        if generation['truncated']:
+            generation['message'] = TRUNCATION_MESSAGE
+        else:
+            generation['message'] = ''
         return generation
         # return {'result': 'success', 'prefix': prefix, 'suffix': suffix,  'text': generation['text']}
     except Exception as e:
         traceback.print_exception(*sys.exc_info())
         print(e)
-        return {'result': 'error', 'type': 'infill', 'text': f'There was an error: {e}.'}
+        return {'result': 'error', 'type': 'infill', 'message': f'Error: {e}.'}
 
 
 if __name__ == "__main__":

static/index.html

@@ -93,6 +93,10 @@ label {
     color: red;
     width: 100%;
 }
+#warning {
+    color: darkorange;
+    width: 100%;
+}
 #examples span {
     margin-right: 1em;
 }
@@ -117,17 +121,20 @@ label {
 <div id="about">
 <p>Refresh "Extend" will insert text at the end. "Infill" will replace all <infill> masks. (click add <infill> mask to add infill mask at the cursors or selections ) </p>
 <p id="examples">
-    <span style="font-weight: bold">Examples:</span>
-    <span><a href='javascript:select_example("python");'>Python</a></span>
-    <span><a href='javascript:select_example("python-infill2");'>Python-infill</a></span>
-    <span><a href='javascript:select_example("type-pred");'>Type-prediction</a></span>
-    <span><a href='javascript:select_example("docstring");'>Doc-string</a></span>
+    <span style="font-weight: bold">Infill Examples:</span>
+    <span><a href='javascript:select_example("class");'>Class generation</a></span>
+    <span><a href='javascript:select_example("type-pred");'>Type prediction</a></span>
+    <span><a href='javascript:select_example("docstring");'>Function to docstring</a></span>
+    <span><a href='javascript:select_example("python-infill2");'>Docstring to function</a></span>
+    <br>
+    <span style="font-weight: bold">Extend Examples:</span>
+    <span><a href='javascript:select_example("javascript");'>JavaScript</a></span>
     <span><a href='javascript:select_example("javascript");'>JavaScript</a></span>
     <span><a href='javascript:select_example("jupyter");'>Jupyter</a></span>
     <span><a href='javascript:select_example("stackoverflow");'>StackOverflow</a></span>
     <span><a href='javascript:select_example("metadata-conditioning");'>Metadata Conditioning</a></span>
     <span><a href='javascript:select_example("metadata-prediction");'>Metadata Prediction</a></span>
-    <span><a href='javascript:select_example("humaneval");'>Docstring->Code</a></span>
+    <!-- <span><a href='javascript:select_example("humaneval");'>Docstring->Code</a></span> -->
 </div>
 </div>
 <div class="request">
@@ -135,17 +142,17 @@ label {
     <div class="leftside">
     <div>
     <label>Response Length:</label>
-    <input type="range" value="64" min="16" max="512" step="16" class="slider"
+    <input type="range" value="64" min="16" max="256" step="16" class="slider"
         oninput="this.nextElementSibling.value = this.value" name="length"
         id='length_slider'>
     <output class='a' id="length_slider_output">64</output>
     <div>
     <label>Temperature:</label>
-    <input type="range" value="0.6" min="0.2" max="1.0" step="0.10" class="slider"
+    <input type="range" value="0.6" min="0.1" max="1.0" step="0.10" class="slider"
         oninput="this.nextElementSibling.value = this.value" name="temp"
         id='temp_slider'
         >
-    <output>0.6</output>
+    <output class='a' id="temp_slider_output">0.6</output>
     </div>
     <div>
         <!-- <input type="submit" value="Extend" id="extend-form-button"/> -->
@@ -173,8 +180,6 @@ label {
     </div>
 </form>
 </div>
-<div id="editor-holder">
-<div>
 Syntax:
 <select name="mode" id="mode">
     <option value="text">Text</option>
@@ -210,6 +215,7 @@ Syntax:
 </div>
 </div>
   <div id="error"></div>
+  <div id="warning"></div>
 
 <h3 id="debug-info">More Info</h3>
 <p>
@@ -236,25 +242,21 @@ var Range = require("ace/range").Range;
 
 // examples for the user
 var EXAMPLES = {
-    "python": {
-        "prompt": "<| file ext=.py |>\nclass Person:\n" + SPLIT_TOKEN + "\np = Person('Eren', 18, 'Male')",
-        "length": 64,
-        "mode": "python"
-    },
     "python-infill2": {
         "prompt":
 `from collections import Counter
-def <infill>(file_name):
+def <infill>
     """Count the number of occurrences of each word in the file."""
     <infill>
 `,
         "length": 64,
+        "temperature": 0.2,
         "mode": "python"
     },
 
     "type-pred": {
         "prompt": 
-`def count_words(filename: str) -> <infill>:
+`def count_words(filename: str) -> <infill>
     """Count the number of occurrences of each word in the file."""
     with open(filename, 'r') as f:
         word_counts = {}
@@ -267,6 +269,7 @@ def <infill>(file_name):
     return word_counts
 `,
         "length": 4,
+        "temperature": 0.2,
         "mode": "python"
     },
     "docstring": {
@@ -285,35 +288,57 @@ def <infill>(file_name):
     return word_counts
 `,
         "length": 32,
+        "temperature": 0.2,
+        "mode": "python"
+    },
+    "python": {
+        "prompt": 
+`<| file ext=.py |>
+def count_words(filename):
+    """Count the number of occurrences of each word in the file"""`,
+        "length": 64,
+        "temperature": 0.6,
+        "mode": "python"
+    },
+    "class": {
+        "prompt": "<| file ext=.py |>\nclass Person:\n" + SPLIT_TOKEN + "\np = Person('Eren', 18, 'Male')",
+        "length": 64,
+        "temperature": 0.2,
         "mode": "python"
     },
     "javascript": {
         "prompt": "<| file ext=.js |>\n // is something really happening here",
         "length": 64,
+        "temperature": 0.6,
         "mode": "javascript"
     },
     "jupyter": {
         "prompt": "<| file ext=.ipynb:python |>\n<text>\nThis notebook demonstrates using scikit-learn to perform PCA.\n</text>\n<cell>",
         "length": 64,
+        "temperature": 0.6,
         "mode": "python"
     },
     "stackoverflow": {
         "prompt": "<| q tags=regex,html |>\nParsing HTML with regular expressions\nHow do I do this? Is it a good idea?\n<|/ q dscore=3 |>\n<| a dscore=4 |>",
         "length": 64,
+        "temperature": 0.6,
         "mode": "text"
     },
     "metadata-conditioning": {
         "prompt": "<| file ext=.py filename=train_model.py source=github dstars=4 |>\n",
         "length": 64,
+        "temperature": 0.6,
         "mode": "python"
     },
     "metadata-prediction": {
         "prompt": "<| file source=github ext=.py |>\nfrom setuptools import setup\nfrom setuptools_rust import Binding, RustExtension\n\nextras = {}\nextras[\"testing\"] = [\"pytest\", \"requests\", \"numpy\", \"datasets\"]\nextras[\"docs\"] = [\"sphinx\", \"sphinx_rtd_theme\", \"setuptools_rust\"]\n\nsetup(\n    name=\"tokenizers\",\n    version=\"0.11\",\n    description=\"Fast and Customizable Tokenizers\",\n    long_description=open(\"README.md\", \"r\", encoding=\"utf-8\").read(),\n)\n\n<|/ file filename=",
         "length": 1,
+        "temperature": 0.2,
         "mode": "python"
     },
     "humaneval": {
         "prompt": "from typing import List, Optional\n\n\ndef longest(strings: List[str]) -> Optional[str]:\n    \"\"\" Out of list of strings, return the longest one. Return the first one in case of multiple\n    strings of the same length. Return None in case the input list is empty.\n    >>> longest([])\n\n    >>> longest(['a', 'b', 'c'])\n    'a'\n    >>> longest(['a', 'bb', 'ccc'])\n    'ccc'\n    \"\"\"\n",
+        "temperature": 0.6,
         "length": 64,
         "mode": "python"
     },
@@ -392,6 +417,8 @@ function set_selection(data) {
 function select_example(name) {
     $("#length_slider").val(EXAMPLES[name]["length"]);
     $("#length_slider_output").text(EXAMPLES[name]["length"]);
+    $("#temp_slider").val(EXAMPLES[name]["temperature"]);
+    $("#temp_slider_output").text(EXAMPLES[name]["temperature"]);
     set_text(EXAMPLES[name]["prompt"])
     var mode = EXAMPLES[name]["mode"];
 
@@ -442,11 +469,11 @@ function convert_string_index_to_location(string_index, lines) {
     return null;
 }
 
-function get_infill_parts() {
+function get_infill_parts(warn_on_single) {
     var lines = editor.getSession().doc.$lines;
     var lines_flat = join_lines(lines);
     parts = lines_flat.split(SPLIT_TOKEN)
-    if (parts.length == 1) {
+    if (warn_on_single && parts.length == 1) {
         window.alert('There are no infill masks, add some <infill> masks before requesting an infill')
     }
     return parts
@@ -477,7 +504,7 @@ function make_generate_listener(url) {
             temperature: $("#temp_slider").val(),
             extra_sentinel: $('#extra_sentinel_checkbox').is(":checked"),
             max_retries: $('#max_retries_slider').val(),
-            parts: get_infill_parts(),
+            parts: get_infill_parts(url == "infill"),
             prompt: editor.getSession().getValue(),
         }
         console.log("send_data:");
@@ -503,6 +530,11 @@ function make_generate_listener(url) {
                 set_text(receive_data["text"]);
                 set_selection(receive_data);
                 $("#error").text("");
+                if (receive_data["message"] != "") {
+                    $("#warning").text(receive_data["message"]);
+                } else {
+                    $("#warning").text("");
+                }
             } else {
                 // set_text(data["prompt"])
                 $("#error").text(receive_data["text"]);
@@ -522,8 +554,10 @@ function make_generate_listener(url) {
             const response = await fetch(`${url}?info=${encoded_data}`);
             if (response.status >= 400) {
                 error(response.statusText);
+                complete();
+            } else {
+                response.json().then(success).catch(error).finally(complete);
             }
-            response.json().then(success).catch(error).finally(complete);
         } catch (e) {
             error(e);
         } finally {