plugins/_model_config/webui/models-summary.html

<html>
<head>
  <title>Models</title>
  <script type="module">
    import { store } from "/plugins/_model_config/webui/model-config-store.js";
  </script>
</head>

<body>
  <div x-data>
    <template x-if="$store.modelConfig">
      <div>
        <div class="section-title">Models</div>
        <div class="section-description">
          Choose a global model preset. Project and agent-profile defaults are available in the full model settings.
        </div>

        <div class="settings-model-preset"
             x-data="$store.modelConfig.createGlobalPresetSelector()"
             x-init="await init($store.chats?.selected || '')">
          <div x-show="loading" class="settings-model-loading">
            <x-icon class="spinning" name="progress_activity"></x-icon>
            Loading model preset...
          </div>
          <div x-show="!loading">
            <x-component path="/plugins/_model_config/webui/preset-overview.html"></x-component>
          </div>
        </div>
      </div>
    </template>
  </div>

  <style>
    .settings-model-preset {
      margin-top: 1rem;
    }

    .settings-model-loading {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0.5rem;
      min-height: 7rem;
      color: var(--color-text-secondary);
    }
  </style>
</body>
</html>