Add Deepl endpoint selection Fixes #3224

29acc2e2db8fcc3e108b0fb1b0f889bc06f9ae6d

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

public/scripts/extensions/translate/index.html+6 -2 Viewed

             </select>
             <label data-i18n="ext_translate_mode_provider" for="translation_provider">Provider</label>
             <div class="flex-container gap5px flexnowrap marginBot5">
                 <select id="translation_provider" name="provider" class="margin0 text_pole flex2">
                     <option value="libre">LibreTranslate</option>
                     <option value="google">Google</option>
                     <option value="lingva">Lingva</option>
                     <option value="deepl">DeepL API</option>
                     <option value="deeplx">DeepLX</option>
                     <option value="bing">Bing</option>
                     <option value="oneringtranslator">OneRingTranslator</option>
                     <option value="yandex">Yandex</option>
                 <select>
 +                <select id="deepl_api_endpoint" class="margin0 text_pole flex1" title="DeepL API Endpoint">
 +                    <option value="free">Free</option>
 +                    <option value="pro">Pro</option>
 +                </select>
                 <div id="translate_key_button" class="menu_button fa-solid fa-key margin0"></div>
                 <div id="translate_url_button" class="menu_button fa-solid fa-link margin0"></div>
             </div>

public/scripts/extensions/translate/index.js+24 -4 Viewed

     internal_language: 'en',
     provider: 'google',
     auto_mode: autoModeOptions.NONE,
 +    deepl_endpoint: 'free',
 };
 const languageCodes = {

     $('#translate_key_button').toggleClass('success', Boolean(secret_state[extension_settings.translate.provider]));
     $('#translate_url_button').toggle(providerOptionalUrl);
     $('#translate_url_button').toggleClass('success', Boolean(secret_state[extension_settings.translate.provider + '_url']));
 +    $('#deepl_api_endpoint').toggle(extension_settings.translate.provider === 'deepl');
+}
 function loadSettings() {

@@ -163,9 +165,10 @@ function loadSettings() {
163	165	}
164	166	}
165	167
166	168	$(`#translation_provider option[value="${extension_settings.translate.provider}"]`).attr('selected', 'true');
167	169	$(`#translation_target_language option[value="${extension_settings.translate.target_language}"]`).attr('selected', 'true');
168	170	$(`#translation_auto_mode option[value="${extension_settings.translate.auto_mode}"]`).attr('selected', 'true');
	171	+ $('#deepl_api_endpoint').val(extension_settings.translate.deepl_endpoint).toggle(extension_settings.translate.provider === 'deepl');
169	172	showKeysButton();
170	173	}
171	174

         throw new Error('No DeepL API key');
+    }
 +    const endpoint = extension_settings.translate.deepl_endpoint || 'free';
     const response = await fetch('/api/translate/deepl', {
         method: 'POST',
         headers: getRequestHeaders(),
         body: JSON.stringify({ text: text, lang: lang, endpoint: endpoint }),
     });
     if (response.ok) {

+    }
     $('#translation_auto_mode').on('change', (event) => {
 +        if (!(event.target instanceof HTMLSelectElement)) {
 +            return;
 +        }
         extension_settings.translate.auto_mode = event.target.value;
         saveSettingsDebounced();
     });
     $('#translation_provider').on('change', (event) => {
 +        if (!(event.target instanceof HTMLSelectElement)) {
 +            return;
 +        }
         extension_settings.translate.provider = event.target.value;
         showKeysButton();
         saveSettingsDebounced();
     });
     $('#translation_target_language').on('change', (event) => {
 +        if (!(event.target instanceof HTMLSelectElement)) {
 +            return;
 +        }
         extension_settings.translate.target_language = event.target.value;
         saveSettingsDebounced();
     });
 +    $('#deepl_api_endpoint').on('change', (event) => {
 +        if (!(event.target instanceof HTMLSelectElement)) {
 +            return;
 +        }
 +        extension_settings.translate.deepl_endpoint = event.target.value;
 +        saveSettingsDebounced();
 +    });
     $(document).on('click', '.mes_translate', onMessageTranslateClick);
     $('#translate_key_button').on('click', async () => {
         const optionText = $('#translation_provider option:selected').text();

src/endpoints/translate.js+5 -1 Viewed

             params.append('formality', formality);
+        }
 -        const result = await fetch('https://api-free.deepl.com/v2/translate', {
 +        const endpoint = request.body.endpoint === 'pro'
 +            ? 'https://api.deepl.com/v2/translate'
 +            : 'https://api-free.deepl.com/v2/translate';
++
 +        const result = await fetch(endpoint, {
             method: 'POST',
             body: params,
             headers: {