gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2026-01-07 23:24:25 +01:00
Code Issues Actions 15 Packages Projects Releases Wiki Activity

make the AI settings even fancier to setting precedence

Browse Source
This commit is contained in:
perf3ct 2025-03-17 21:24:56 +00:00
parent ebc5107b96
commit 43cf33c191
No known key found for this signature in database
GPG Key ID: 569C4EEC436F5232
1 changed files with 40 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
src/public/app/widgets/type_widgets/options/ai_settings.ts
View File

@ -305,47 +305,47 @@ export default class AiSettingsWidget extends OptionsWidget {
<input type="hidden" class="embedding-provider-precedence" value=""> <input type="hidden" class="embedding-provider-precedence" value="">
<div class="embedding-precedence-container"> <div class="embedding-precedence-container">
<div class="alert alert-info mb-2">${t("ai_llm.drag_providers_to_reorder")}</div> <div class="alert alert-info mb-2">${t("ai_llm.drag_providers_to_reorder")}</div>
<div class="card mb-3"> <div class="standard-list-container mb-3">
<div class="card-header"> <div class="standard-list-header">
<strong>${t("ai_llm.active_providers")}</strong> <strong>${t("ai_llm.active_providers")}</strong>
</div> </div>
<ul class="list-group list-group-flush embedding-provider-sortable"> <ul class="standard-list-item-list embedding-provider-sortable">
<li class="list-group-item d-flex align-items-center" data-provider="openai"> <li class="standard-list-item d-flex align-items-center" data-provider="openai">
<span class="bx bx-menu handle me-2"></span> <span class="bx bx-menu handle me-2"></span>
<strong class="flex-grow-1">OpenAI</strong> <strong class="flex-grow-1">OpenAI</strong>
<button class="btn btn-sm btn-outline-danger remove-provider" title="${t("ai_llm.remove_provider")}"> <button class="icon-action remove-provider" title="${t("ai_llm.remove_provider")}">
<span class="bx bx-x"></span> <span class="bx bx-x"></span>
</button> </button>
</li> </li>
<li class="list-group-item d-flex align-items-center" data-provider="ollama"> <li class="standard-list-item d-flex align-items-center" data-provider="ollama">
<span class="bx bx-menu handle me-2"></span> <span class="bx bx-menu handle me-2"></span>
<strong class="flex-grow-1">Ollama</strong> <strong class="flex-grow-1">Ollama</strong>
<button class="btn btn-sm btn-outline-danger remove-provider" title="${t("ai_llm.remove_provider")}"> <button class="icon-action remove-provider" title="${t("ai_llm.remove_provider")}">
<span class="bx bx-x"></span> <span class="bx bx-x"></span>
</button> </button>
</li> </li>
<li class="list-group-item d-flex align-items-center" data-provider="anthropic"> <li class="standard-list-item d-flex align-items-center" data-provider="anthropic">
<span class="bx bx-menu handle me-2"></span> <span class="bx bx-menu handle me-2"></span>
<strong class="flex-grow-1">Anthropic</strong> <strong class="flex-grow-1">Anthropic</strong>
<button class="btn btn-sm btn-outline-danger remove-provider" title="${t("ai_llm.remove_provider")}"> <button class="icon-action remove-provider" title="${t("ai_llm.remove_provider")}">
<span class="bx bx-x"></span> <span class="bx bx-x"></span>
</button> </button>
</li> </li>
<li class="list-group-item d-flex align-items-center" data-provider="local"> <li class="standard-list-item d-flex align-items-center" data-provider="local">
<span class="bx bx-menu handle me-2"></span> <span class="bx bx-menu handle me-2"></span>
<strong class="flex-grow-1">Local</strong> <strong class="flex-grow-1">Local</strong>
<button class="btn btn-sm btn-outline-danger remove-provider" title="${t("ai_llm.remove_provider")}"> <button class="icon-action remove-provider" title="${t("ai_llm.remove_provider")}">
<span class="bx bx-x"></span> <span class="bx bx-x"></span>
</button> </button>
</li> </li>
</ul> </ul>
</div> </div>
<div class="card disabled-providers-container" style="display: none;"> <div class="standard-list-container disabled-providers-container" style="display: none;">
<div class="card-header"> <div class="standard-list-header">
<strong>${t("ai_llm.disabled_providers")}</strong> <strong>${t("ai_llm.disabled_providers")}</strong>
</div> </div>
<ul class="list-group list-group-flush embedding-provider-disabled"> <ul class="standard-list-item-list embedding-provider-disabled">
<!-- Disabled providers will be added here dynamically --> <!-- Disabled providers will be added here dynamically -->
</ul> </ul>
</div> </div>
@ -883,9 +883,9 @@ export default class AiSettingsWidget extends OptionsWidget {
// Create a new item for the disabled list // Create a new item for the disabled list
const $disabledItem = $(` const $disabledItem = $(`
<li class="list-group-item d-flex align-items-center" data-provider="${provider}"> <li class="standard-list-item d-flex align-items-center" data-provider="${provider}">
<strong class="flex-grow-1">${providerName}</strong> <strong class="flex-grow-1">${providerName}</strong>
<button class="btn btn-sm btn-outline-success restore-provider" title="${t("ai_llm.restore_provider")}"> <button class="icon-action restore-provider" title="${t("ai_llm.restore_provider")}">
<span class="bx bx-plus"></span> <span class="bx bx-plus"></span>
</button> </button>
</li> </li>
@ -912,10 +912,10 @@ export default class AiSettingsWidget extends OptionsWidget {
// Create a new item for the active list // Create a new item for the active list
const $activeItem = $(` const $activeItem = $(`
<li class="list-group-item d-flex align-items-center" data-provider="${provider}"> <li class="standard-list-item d-flex align-items-center" data-provider="${provider}">
<span class="bx bx-menu handle me-2"></span> <span class="bx bx-menu handle me-2"></span>
<strong class="flex-grow-1">${providerName}</strong> <strong class="flex-grow-1">${providerName}</strong>
<button class="btn btn-sm btn-outline-danger remove-provider" title="${t("ai_llm.remove_provider")}"> <button class="icon-action remove-provider" title="${t("ai_llm.remove_provider")}">
<span class="bx bx-x"></span> <span class="bx bx-x"></span>
</button> </button>
</li> </li>
@ -1054,6 +1054,28 @@ export default class AiSettingsWidget extends OptionsWidget {
this.startStatsPolling(); this.startStatsPolling();
}, 500); }, 500);
// Add minimal styles for the sortable lists
if (!$('#embedding-sortable-styles').length) {
$('head').append(`
<style id="embedding-sortable-styles">
/* Basic drag functionality styles */
.embedding-provider-sortable .handle {
cursor: grab;
}
.standard-list-item-list li {
cursor: grab;
}
.standard-list-item-list li.dragging {
opacity: 0.7;
}
.standard-list-item-list li.drag-over {
border-width: 2px !important;
border-style: dashed !important;
}
</style>
`);
}
return this.$widget; return this.$widget;
} }
@ -1061,29 +1083,6 @@ export default class AiSettingsWidget extends OptionsWidget {
// Call the ancestor method with the options to store them // Call the ancestor method with the options to store them
super.optionsLoaded(options); super.optionsLoaded(options);
// Add CSS styles for the sortable list
// We add this here to ensure it's only added once
if (!$('#embedding-sortable-styles').length) {
$('head').append(`
<style id="embedding-sortable-styles">
.embedding-provider-sortable .handle {
cursor: grab;
}
.embedding-provider-sortable li {
cursor: grab;
transition: background-color 0.2s;
}
.embedding-provider-sortable li.dragging {
opacity: 0.5;
background-color: #f8f9fa;
}
.embedding-provider-sortable li.drag-over {
border: 2px dashed #007bff;
}
</style>
`);
}
// Set values from options to UI components // Set values from options to UI components
if (!this.$widget) return; if (!this.$widget) return;