Add minimal chat template support in server UI (pull-down menu)

This commit is contained in:
chris 2024-02-04 23:47:29 +01:00
parent 277fad30c6
commit 2f2191fb70
2 changed files with 47 additions and 1 deletions

View file

@ -0,0 +1,16 @@
export const chat_templates = {
"Alpaca" : {
"template" : "{{prompt}}\n### Instruction:\n{{history}}\n### Response:\n{{char}}:",
"historyTemplate" : "{{name}}: {{message}}"
},
"Vicuna" : {
"template" : "{{prompt}}\n\n{{history}}\n{{char}}:",
"historyTemplate" : "{{name}}: {{message}}"
},
"ChatML" : {
"template" : "<|im_start|>system\n{{prompt}}<|im_end|>\n{{history}}<|im_start|>{{char}}\n",
"historyTemplate" : "<|im_start|>{{name}}\n{{message}}<|im_end|>\n"
}
};

View file

@ -203,6 +203,9 @@
import { llama } from '/completion.js'; import { llama } from '/completion.js';
import { SchemaConverter } from '/json-schema-to-grammar.mjs'; import { SchemaConverter } from '/json-schema-to-grammar.mjs';
import { chat_templates } from '/chat_templates.js';
let selected_image = false; let selected_image = false;
var slot_id = -1; var slot_id = -1;
@ -710,6 +713,28 @@
</fieldset> </fieldset>
` `
); );
const PromptTemplateOptions = () => {
var templatenames = Object.keys(chat_templates);
templatenames.sort();
var optionlist = templatenames.map(name => html`<option value="${name}">${name}</option>`);
return optionlist;
};
const updatePromptTemplate = (el) => {
// Get the selected template name
var templatename = el.target.value;
// console.log(templatename);
if (templatename != "") {
// set the template parameters
session.value.template = chat_templates[templatename]["template"];
session.value.historyTemplate = chat_templates[templatename]["historyTemplate"];
// this line is required to trigger the setting of the textareas
session.value = { ...session.value, image_selected: '' };
}
}
const ChatConfigForm = () => ( const ChatConfigForm = () => (
html` html`
@ -730,12 +755,17 @@
<fieldset> <fieldset>
<div> <div>
<label for="template">Prompt template</label> <label for="template">Prompt template</label>
<select id="templateSelect" onchange=${updatePromptTemplate} >
<option value="">- Select a chat template -</option>
${PromptTemplateOptions()}
</select>
<textarea id="template" name="template" value="${session.value.template}" rows=4 oninput=${updateSession}/> <textarea id="template" name="template" value="${session.value.template}" rows=4 oninput=${updateSession}/>
</div> </div>
<div> <div>
<label for="template">Chat history template</label> <label for="template">Chat history template</label>
<textarea id="template" name="historyTemplate" value="${session.value.historyTemplate}" rows=1 oninput=${updateSession}/> <textarea id="historyTemplate" name="historyTemplate" value="${session.value.historyTemplate}" rows=1 oninput=${updateSession}/>
</div> </div>
${GrammarControl()} ${GrammarControl()}
</fieldset> </fieldset>