minne/html-router/templates/admin/sections/models.html

<section class="nb-panel p-4 sm:p-5 flex flex-col gap-4">
  <div class="flex items-start justify-between flex-col sm:flex-row gap-3">
    <div>
      <div class="text-sm uppercase tracking-wide opacity-60 mb-1">AI Models</div>
      <h2 class="text-lg font-semibold">Model configuration</h2>
      <p class="text-xs opacity-70 max-w-2xl">
        Choose which models power conversational search, ingestion analysis, and embeddings.
        Embedding dimension changes apply after you restart the worker or server.
      </p>
    </div>
    <a
      href="/admin?section=overview"
      class="nb-btn btn-sm btn-ghost"
      hx-boost="true"
      hx-target="#admin-shell"
      hx-select="#admin-shell"
      hx-swap="outerHTML"
      hx-push-url="true"
    >
      ← Back to Admin
    </a>
  </div>

  {% if available_models %}
    {% block model_settings_form %}
    <form hx-patch="/update-model-settings" hx-swap="outerHTML" class="grid grid-cols-1 gap-4">
      <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
        <div>
          <div class="text-sm opacity-80 mb-1">Query Model</div>
          <select name="query_model" class="nb-select w-full">
            {% for model in available_models.data %}
            <option value="{{ model.id }}" {% if settings.query_model == model.id %}selected{% endif %}>{{ model.id }}</option>
            {% endfor %}
          </select>
          <p class="text-xs opacity-70 mt-1">Current: <span class="font-mono">{{ settings.query_model }}</span></p>
        </div>

        <div>
          <div class="text-sm opacity-80 mb-1">Processing Model</div>
          <select name="processing_model" class="nb-select w-full">
            {% for model in available_models.data %}
            <option value="{{ model.id }}" {% if settings.processing_model == model.id %}selected{% endif %}>{{ model.id }}</option>
            {% endfor %}
          </select>
          <p class="text-xs opacity-70 mt-1">Current: <span class="font-mono">{{ settings.processing_model }}</span></p>
        </div>
      </div>

      <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
        <div>
          <div class="text-sm opacity-80 mb-1">Image Processing Model</div>
          <select name="image_processing_model" class="nb-select w-full">
            {% for model in available_models.data %}
            <option value="{{ model.id }}" {% if settings.image_processing_model == model.id %}selected{% endif %}>{{ model.id }}</option>
            {% endfor %}
          </select>
          <p class="text-xs opacity-70 mt-1">Current: <span class="font-mono">{{ settings.image_processing_model }}</span></p>
        </div>

        <div>
          <div class="text-sm opacity-80 mb-1">Voice Processing Model</div>
          <select name="voice_processing_model" class="nb-select w-full">
            {% for model in available_models.data %}
            <option value="{{ model.id }}" {% if settings.voice_processing_model == model.id %}selected{% endif %}>{{ model.id }}</option>
            {% endfor %}
          </select>
          <p class="text-xs opacity-70 mt-1">Current: <span class="font-mono">{{ settings.voice_processing_model }}</span></p>
        </div>
      </div>

      <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
        <div>
          <div class="text-sm opacity-80 mb-1">Embedding Model</div>
          {% if effective_embedding_backend == "fastembed" %}
          {% if fastembed_model_locked_by_config %}
          <input
            type="text"
            class="nb-input w-full opacity-60 cursor-not-allowed"
            value="{{ settings.embedding_model }}"
            disabled
          />
          <p class="text-xs text-info mt-1">
            Overridden by <span class="font-mono">fastembed_model</span> in config.yaml at startup. Remove that setting to manage the model here.
          </p>
          {% else %}
          <select name="embedding_model" id="fastembed_model_select" class="nb-select w-full">
            {% for fe in fastembed_models %}
            <option value="{{ fe.model_code }}" {% if settings.embedding_model == fe.model_code %}selected{% endif %}>
              {{ fe.model_code }} ({{ fe.dimension }} dims)
            </option>
            {% endfor %}
          </select>
          <p class="text-xs opacity-70 mt-1">
            Save, then restart the worker or server to load the new model. First run may download weights.
          </p>
          {% endif %}
          {% elif effective_embedding_backend == "hashed" %}
          <input
            type="text"
            name="embedding_model"
            class="nb-input w-full opacity-60 cursor-not-allowed"
            value="{{ settings.embedding_model }}"
            disabled
          />
          <p class="text-xs text-info mt-1">
            Hashed embeddings use <span class="font-mono">embedding_dimensions</span> from config, not the admin UI.
          </p>
          {% else %}
          <select name="embedding_model" class="nb-select w-full">
            {% for model in available_models.data %}
            <option value="{{ model.id }}" {% if settings.embedding_model == model.id %}selected{% endif %}>{{ model.id }}</option>
            {% endfor %}
          </select>
          <p class="text-xs opacity-70 mt-1">Current: <span class="font-mono">{{ settings.embedding_model }}</span></p>
          {% endif %}
        </div>

        <div>
          <div class="text-sm opacity-80 mb-1" for="embedding_dimensions">Embedding Dimensions</div>
          {% if effective_embedding_backend == "fastembed" %}
          <input
            type="number"
            id="embedding_dimensions"
            class="nb-input w-full opacity-60 cursor-not-allowed"
            value="{{ settings.embedding_dimensions }}"
            disabled
          />
          <p class="text-xs opacity-70 mt-1">
            Fixed by the selected FastEmbed model. A dimension change triggers a full re-embed after restart.
          </p>
          {% elif effective_embedding_backend == "hashed" %}
          <input
            type="number"
            id="embedding_dimensions"
            name="embedding_dimensions"
            class="nb-input w-full opacity-60 cursor-not-allowed"
            value="{{ settings.embedding_dimensions }}"
            disabled
          />
          <p class="text-xs text-info mt-1">
            Set <span class="font-mono">EMBEDDING_BACKEND=openai</span> for OpenAI embeddings, or configure hashed dims in config.
          </p>
          {% else %}
          <input
            type="number"
            id="embedding_dimensions"
            name="embedding_dimensions"
            class="nb-input w-full"
            value="{{ settings.embedding_dimensions }}"
            required
            min="1"
          />
          <p class="text-xs opacity-70 mt-1">
            Saving a new dimension updates settings only. Restart the worker (or combined app) to re-embed stored data and rebuild indexes.
          </p>
          {% endif %}
        </div>
      </div>

      {% if effective_embedding_backend == "fastembed" and not fastembed_model_locked_by_config %}
      <div class="nb-panel p-3 bg-base-200/40 border border-base-content/10 text-xs opacity-90 max-w-3xl">
        <p class="mb-2">
          <strong>FastEmbed:</strong> The running process keeps the model loaded until restart. Changing to a model with a
          different dimension re-embeds all stored vectors on the next worker/server startup.
        </p>
        <p>
          Same-dimension model swaps update settings only; existing vectors are not automatically regenerated until you
          change dimension (or re-embed via the OpenAI workaround described in ops docs).
        </p>
      </div>

      <div id="fastembed-change-alert" class="nb-panel p-3 bg-warning/20 hidden">
        <div class="text-sm">
          <strong>Warning:</strong> You changed the FastEmbed model. Save, then restart the worker or server to apply.
          If the dimension changed, stored embeddings and HNSW indexes will be rebuilt on startup.
        </div>
      </div>
      {% endif %}

      {% if effective_embedding_backend != "fastembed" and effective_embedding_backend != "hashed" %}
      <div class="nb-panel p-3 bg-base-200/40 border border-base-content/10 text-xs opacity-90 max-w-3xl">
        <p class="mb-2">
          <strong>Re-embedding stored data:</strong> Only a change to <span class="font-mono">embedding_dimensions</span>
          followed by a restart triggers a full re-embed of text chunks and knowledge entities. Changing the embedding model alone
          does <em>not</em> update vectors already in the database.
        </p>
        <p>
          To force a full re-embed (for example after switching models), save a <em>different</em> dimension integer, restart the
          worker, then set the final dimension and model and restart again if needed.
        </p>
      </div>

      <div id="embedding-change-alert" class="nb-panel p-3 bg-warning/20 hidden">
        <div class="text-sm">
          <strong>Warning:</strong> You changed embedding dimensions. Save, then restart the worker or server so stored embeddings
          and HNSW indexes are rebuilt. Until then, search may use the old dimension.
        </div>
      </div>
      {% endif %}

      <div class="flex justify-end gap-2">
        <button type="submit" class="nb-btn nb-cta btn-sm">Save Model Settings</button>
      </div>
    </form>

    {% if effective_embedding_backend == "fastembed" and not fastembed_model_locked_by_config %}
    <script>
      (() => {
        const modelSelect = document.getElementById('fastembed_model_select');
        const alertElement = document.getElementById('fastembed-change-alert');
        const initialModel = '{{ settings.embedding_model }}';
        if (modelSelect && alertElement) {
          modelSelect.addEventListener('change', (event) => {
            if (String(event.target.value) !== String(initialModel)) {
              alertElement.classList.remove('hidden');
            } else {
              alertElement.classList.add('hidden');
            }
          });
        }
      })();
    </script>
    {% endif %}

    {% if effective_embedding_backend != "fastembed" and effective_embedding_backend != "hashed" %}
    <script>
      (() => {
        const dimensionInput = document.getElementById('embedding_dimensions');
        const alertElement = document.getElementById('embedding-change-alert');
        const initialDimensions = '{{ settings.embedding_dimensions }}';
        if (dimensionInput && alertElement) {
          dimensionInput.addEventListener('input', (event) => {
            if (String(event.target.value) !== String(initialDimensions)) {
              alertElement.classList.remove('hidden');
            } else {
              alertElement.classList.add('hidden');
            }
          });
        }
      })();
    </script>
    {% endif %}
    {% endblock %}
  {% else %}
    <div class="nb-panel p-4 bg-warning/10 border border-warning/40">
      <div class="text-sm font-semibold mb-1">Unable to load models</div>
      <p class="text-xs opacity-70">We could not reach the model provider. Check the API key and retry.</p>
    </div>
  {% endif %}
</section>