Add select2 style for NanoGPT list Closes #4911

373da39bf47bd0bf018585f347f1bba32850b5ff

Cohee <18619528+Cohee1207@users.noreply.github.com>

public/scripts/openai.js+37 -0 Viewed

     `));
+}
 +function getNanoGptModelTemplate(option) {
 +    const model = model_list.find(x => x.id === option?.element?.value);
++
 +    if (!option.id || !model) {
 +        return option.text;
 +    }
++
 +    const inputPrice = model.pricing?.prompt;
 +    const outputPrice = model.pricing?.completion;
++
 +    let price = 'Unknown';
 +    if (inputPrice !== undefined && outputPrice !== undefined) {
 +        // Check if both prices are 0 (free model)
 +        if (inputPrice === 0 && outputPrice === 0) {
 +            price = 'Free';
 +        } else {
 +            price = `$${Math.round(inputPrice * 100) / 100}/$${Math.round(outputPrice * 100) / 100} in/out Mtoken`;
 +        }
 +    }
++
 +    const contextLength = model.context_length || 'Unknown';
++
 +    return $((`
 +        <div class="flex-container alignItemsBaseline" title="${DOMPurify.sanitize(model.id)}">
 +            <strong>${DOMPurify.sanitize(model.id)}</strong> | ${contextLength} ctx | <small>${price}</small>
 +        </div>
 +    `));
 +}
++
 function calculateChutesCost() {
     if (oai_settings.chat_completion_source !== chat_completion_sources.CHUTES) {
         return;

             templateResult: getChutesModelTemplate,
             matcher: textValueMatcher,
         });
 +        $('#model_nanogpt_select').select2({
 +            placeholder: t`Select a model`,
 +            searchInputPlaceholder: t`Search models...`,
 +            searchInputCssClass: 'text_pole',
 +            width: '100%',
 +            templateResult: getNanoGptModelTemplate,
 +            matcher: textValueMatcher,
 +        });
         $('#completion_prompt_manager_popup_entry_form_injection_trigger').select2({
             placeholder: t`All types (default)`,
             width: '100%',