ompchamber 2.0.2 → 3.1.0

package/src/client/hooks/editor/use-occurrences.ts

@@ -0,0 +1,98 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * The hook that owns the editor's extra selection ranges.
+ *
+ * It is a thin shell over `shared/lib/code/editor/occurrences`: the rules live
+ * there as pure functions, and this holds the ranges in a ref (the keydown and
+ * `input` handlers read them synchronously, inside one event) and tells the
+ * caller through `onChange` so the surface can paint them.
+ *
+ * The split is deliberate: a hook that decides where a range goes cannot be
+ * tested without a DOM, and every rule here is one a user notices when it is
+ * wrong.
+ */
+
+import { useRef } from 'preact/hooks';
+
+import {
+  growToNextOccurrence,
+  offsetBelow,
+  replicateAtRanges,
+  selectAllOccurrences,
+} from '@/shared/lib/code/editor/occurrences';
+import type { TextRange } from '@/shared/lib/code/editor/commands';
+
+export interface UseOccurrencesOptions {
+  /** Called with the extra ranges whenever they change, so the surface repaints. */
+  onChange: (ranges: readonly TextRange[]) => void;
+  /** The caller's copy of the ranges — clearing them there must clear them here. */
+  controlled?: readonly TextRange[];
+}
+
+export interface OccurrencesApi {
+  /** The extra ranges, excluding the textarea's own (primary) selection. */
+  readonly ranges: readonly TextRange[];
+  /** Replace the ranges and notify the surface. */
+  set: (ranges: readonly TextRange[]) => void;
+  /** Drop every extra range. */
+  clear: () => void;
+  /** ⌘D — grow the primary selection to the next occurrence of what it covers. */
+  selectNext: (input: HTMLTextAreaElement, select: (start: number, end: number) => void) => void;
+  /** ⌘⇧L — select every occurrence of the selection/word at the caret. */
+  selectAll: (input: HTMLTextAreaElement, select: (start: number, end: number) => void) => void;
+  /** ⌘⇧D — add an empty caret on the line below. */
+  insertCursorBelow: (input: HTMLTextAreaElement) => void;
+  /**
+   * Replay the browser's edit at every extra range. Returns the buffer and
+   * caret the caller should commit, or null when there is nothing to replicate.
+   */
+  replicate: (before: string, after: string, primaryBefore: TextRange) => { value: string; caret: number; rest: TextRange[] } | null;
+}
+
+export function useOccurrences({ onChange, controlled }: UseOccurrencesOptions): OccurrencesApi {
+  const ref = useRef<readonly TextRange[]>([]);
+  // The caller may clear the ranges without the editor asking (a file switch, a
+  // save), so its copy is mirrored into the ref the handlers read.
+  if (controlled && controlled !== ref.current) ref.current = controlled;
+
+  const set = (ranges: readonly TextRange[]) => {
+    ref.current = ranges;
+    onChange(ranges);
+  };
+
+  return {
+    get ranges() {
+      return ref.current;
+    },
+    set,
+    clear: () => set([]),
+
+    selectNext: (input, select) => {
+      const current: TextRange = { start: input.selectionStart, end: input.selectionEnd };
+      const next = growToNextOccurrence(input.value, current, ref.current);
+      if (!next) return;
+      select(next.primary.start, next.primary.end);
+      set(next.extras);
+    },
+
+    selectAll: (input, select) => {
+      const current: TextRange = { start: input.selectionStart, end: input.selectionEnd };
+      const all = selectAllOccurrences(input.value, current);
+      if (!all) return;
+      select(all.primary.start, all.primary.end);
+      set(all.extras);
+    },
+
+    insertCursorBelow: (input) => {
+      const target = offsetBelow(input.value, input.selectionStart);
+      if (target === null) return;
+      set([...ref.current, { start: target, end: target }]);
+    },
+
+    replicate: (before, after, primaryBefore) => replicateAtRanges(before, after, primaryBefore, ref.current),
+  };
+}

package/src/client/hooks/models/use-provider-names.ts

@@ -1,5 +1,5 @@
 import type { ModelsResponse } from '@/shared/lib/models/client';
-import { providerNamesFromConnected } from '@/shared/lib/models/provider-label';
+import { providerNamesFromConnected } from '@/shared/lib/models/provider/label';
 import { useModelsCatalog } from '@/client/hooks/models/use-models-catalog';
 
 /** slug → display-name map from `connectedProviders` ({} when none connected). */

package/src/client/hooks/settings/providers/actions.ts

@@ -0,0 +1,337 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * The provider mutation actions behind Settings → Providers.
+ *
+ * Split from the hook (`providers.ts`) so that file holds state wiring only:
+ * every action here is a write whose failure has to be reported, and keeping
+ * them together means the "what does each mutation actually change" contract
+ * has one home. `deps` is a single record rather than a positional list, so a
+ * caller cannot silently pass the wrong setter.
+ */
+
+import type { ProviderItem, ProviderModel } from '@/shared/types';
+import { notifyModelsUpdated } from '@/shared/lib/models/client';
+import {
+  deleteProvider,
+  saveProviderOverlay,
+  setProviderEnabled,
+} from '@/shared/lib/models/provider/connection';
+import {
+  fetchProviderModelsRemote,
+  mergeProviderModels,
+  syncProviderModelsToCatalog,
+} from '@/shared/lib/models/provider/models';
+import { removeLegacyKenariModels } from '@/shared/lib/models/provider/cleanup';
+import { addProviderMessage, fetchModelsNote } from '@/client/hooks/settings/providers/messages';
+import { saveModelOverrideRemote } from '@/client/hooks/settings/providers/api';
+
+export interface ProviderActionsDeps {
+  providers: ProviderItem[];
+  selectedProvider: ProviderItem | undefined;
+  connectedProviders: ProviderItem[];
+  isFetchingModels: boolean;
+  isDeletingProvider: boolean;
+  pushToast: (message: string, tone: 'success' | 'error') => void;
+  setProviders: (providers: ProviderItem[]) => void;
+  setSelectedProviderId: (id: string) => void;
+  setIsAddModalOpen: (open: boolean) => void;
+  setIsDeleteModalOpen: (open: boolean) => void;
+  setIsDeletingProvider: (deleting: boolean) => void;
+  setIsFetchingModels: (fetching: boolean) => void;
+  onAddModalClose?: () => void;
+}
+
+export function createProviderActions(deps: ProviderActionsDeps) {
+  const {
+    providers,
+    selectedProvider,
+    connectedProviders,
+    isFetchingModels,
+    isDeletingProvider,
+    pushToast,
+    setProviders,
+    setSelectedProviderId,
+    setIsAddModalOpen,
+    setIsDeleteModalOpen,
+    setIsDeletingProvider,
+    setIsFetchingModels,
+    onAddModalClose,
+  } = deps;
+
+  /** Publish an overlay edit and adopt whatever the server merged back. */
+  const persistProviders = async (updated: ProviderItem[]) => {
+    setProviders(updated);
+    try {
+      const merged = await saveProviderOverlay(updated);
+      if (merged) setProviders(merged);
+    } catch (error) {
+      console.error('Failed to save providers via API:', error);
+      pushToast('Failed to save provider settings.', 'error');
+    }
+  };
+
+  const toggleProviderEnabled = async (
+    slug: string,
+    enabled: boolean,
+  ): Promise<ProviderItem[] | null> => {
+    try {
+      const merged = await setProviderEnabled(slug, enabled);
+      if (merged) setProviders(merged);
+      return merged;
+    } catch (error) {
+      console.error('Failed to update provider connection:', error);
+      pushToast('Failed to update the provider connection.', 'error');
+      return null;
+    }
+  };
+
+  const handleAddProvider = async (
+    newProvider: ProviderItem,
+    options: { fetchedCount: number; ompNote?: string },
+  ) => {
+    // Replace by slug rather than append: an endpoint override reuses the slug
+    // of a provider omp already ships, and two overlay rows for one slug would
+    // let the stale one win the next merge.
+    const slug = newProvider.slug.trim().toLowerCase();
+    const withoutExisting = providers.filter((p) => p.slug.trim().toLowerCase() !== slug);
+    await persistProviders([...withoutExisting, newProvider]);
+    const merged = await toggleProviderEnabled(newProvider.slug, true);
+    const registered = merged?.find((provider) => provider.slug.trim().toLowerCase() === slug);
+    setSelectedProviderId(registered?.id || newProvider.id);
+    setIsAddModalOpen(false);
+    onAddModalClose?.();
+
+    const message = addProviderMessage(newProvider, options);
+    pushToast(message.text, message.tone);
+  };
+
+  const handleReconnect = async (updates: Partial<ProviderItem>) => {
+    if (!selectedProvider) return;
+    const target = selectedProvider;
+    // A keyless provider stores no credential, so a masked placeholder echoed
+    // back from the dialog must never be persisted as one — it would show a key
+    // that authenticates nothing.
+    const patch: Partial<ProviderItem> = target.auth === 'none'
+      ? Object.fromEntries(Object.entries(updates).filter(([key]) => key !== 'apiKey'))
+      : updates;
+    await persistProviders(providers.map((p) => (
+      p.id === target.id ? { ...p, ...patch, status: 'connected' as const } : p
+    )));
+    if (target.status !== 'connected') {
+      await toggleProviderEnabled(target.slug, true);
+    }
+  };
+
+  const handleFetchModels = async (credentials: { apiKey?: string; baseUrl?: string }) => {
+    if (!selectedProvider || isFetchingModels) return;
+    const baseUrl = credentials.baseUrl || selectedProvider.baseUrl;
+    if (!baseUrl) {
+      pushToast('Base URL is required to fetch models.', 'error');
+      return;
+    }
+    setIsFetchingModels(true);
+    try {
+      const result = await fetchModelsFor(selectedProvider, baseUrl, credentials.apiKey);
+      if (!result) return;
+      if (result.omp?.written) notifyModelsUpdated();
+    } finally {
+      setIsFetchingModels(false);
+    }
+  };
+
+  /**
+   * The listing probe plus its reporting. Kept as one unit because the three
+   * outcomes — models added, legacy models pruned, nothing new — each have their
+   * own message, and a partial report reads as a failed fetch.
+   */
+  const fetchModelsFor = async (
+    provider: ProviderItem,
+    baseUrl: string,
+    credential: string | undefined,
+  ): Promise<{ omp?: { written: boolean; reason?: string } } | null> => {
+    const result = await fetchProviderModelsRemote({
+      baseUrl,
+      apiKey: credential || provider.apiKey,
+      providerSlug: provider.slug,
+      persistToOmp: true,
+      // The provider's own dialect decides the auth header the probe sends;
+      // falling back to the URL classifier would send a Bearer header to an
+      // Anthropic-shaped proxy that only accepts x-api-key.
+      ...(provider.api ? { api: provider.api } : {}),
+      ...(provider.auth ? { auth: provider.auth } : {}),
+    });
+    if (!result.ok || !result.models) {
+      pushToast(result.error || 'Failed to fetch models from the provider.', 'error');
+      return null;
+    }
+    const cleaned = removeLegacyKenariModels(provider, provider.models);
+    const removedCount = provider.models.length - cleaned.length;
+    const { merged, addedCount } = mergeProviderModels(cleaned, result.models);
+    if (addedCount > 0 || removedCount > 0) {
+      await handleReconnect({ models: merged });
+    }
+    if (addedCount > 0) {
+      pushToast(`Fetched ${addedCount} new model${addedCount === 1 ? '' : 's'} from the provider.`, 'success');
+    } else if (removedCount > 0) {
+      pushToast('Removed legacy fallback models from the provider.', 'success');
+    } else {
+      pushToast('No new models found — all fetched models already exist.', 'success');
+    }
+    const note = fetchModelsNote(result);
+    if (note) pushToast(note.text, note.tone);
+    if (addedCount > 0) void syncProviderModelsToCatalog(provider.name, result.models);
+    return { omp: result.omp };
+  };
+
+  const handleFetchModelsFromList = async () => {
+    if (!selectedProvider) return;
+    await handleFetchModels({
+      apiKey: selectedProvider.apiKey,
+      baseUrl: selectedProvider.baseUrl,
+    });
+  };
+
+  const handleOmpAuthSuccess = () => {
+    if (!selectedProvider) return;
+    const target = selectedProvider;
+    void persistProviders(providers.map((p) => (
+      p.id === target.id ? { ...p, status: 'connected' as const } : p
+    )));
+    void toggleProviderEnabled(target.slug, true);
+  };
+
+  const handleToggleDisconnect = async () => {
+    if (!selectedProvider) return;
+    const target = selectedProvider;
+    const disconnecting = target.status === 'connected';
+    if (disconnecting) {
+      setSelectedProviderId(connectedProviders.find((provider) => provider.id !== target.id)?.id || '');
+    }
+    const merged = await toggleProviderEnabled(target.slug, !disconnecting);
+    if (!merged) return;
+    pushToast(
+      disconnecting
+        ? `${target.name} disconnected — its models are no longer offered in the chat picker.`
+        : `${target.name} reconnected.`,
+      'success',
+    );
+  };
+
+  const updateSelectedModels = (transform: (models: ProviderModel[]) => ProviderModel[]) => {
+    if (!selectedProvider) return;
+    void persistProviders(providers.map((p) => (
+      p.id === selectedProvider.id ? { ...p, models: transform(p.models) } : p
+    )));
+  };
+
+  /**
+   * Disable/enable from omp's own config.yml `disabledProviders`. This is the
+   * coarse switch that removes the provider — and every model it serves — from
+   * the chat picker; the per-model eye toggle is the fine-grained one.
+   */
+  const handleToggleProviderDisabled = async () => {
+    if (!selectedProvider) return;
+    const target = selectedProvider;
+    const disabling = target.disabled !== true;
+    const merged = await toggleProviderEnabled(target.slug, !disabling);
+    if (!merged) return;
+    pushToast(
+      disabling
+        ? `${target.name} disabled — it no longer appears in the model list.`
+        : `${target.name} enabled — its models are offered again.`,
+      'success',
+    );
+  };
+
+  /**
+   * Delete a provider's `models.yml` entry (and the chamber's overlay row).
+   *
+   * Only offered for a provider the server reports as `inModelsYml`, because
+   * the action is a file edit: a login provider's credential is untouched, and
+   * a provider with no file entry has nothing to delete. The selection moves off
+   * the deleted provider BEFORE the list is republished — leaving it selected
+   * would render a detail pane for a provider that no longer exists.
+   */
+  const handleDeleteProvider = async () => {
+    if (!selectedProvider || isDeletingProvider) return;
+    const target = selectedProvider;
+    setIsDeletingProvider(true);
+    try {
+      const result = await deleteProvider(target.id);
+      if (!result.ok) {
+        pushToast(result.error || 'Failed to delete the provider.', 'error');
+        return;
+      }
+      setIsDeleteModalOpen(false);
+      const remaining = result.providers ?? [];
+      setSelectedProviderId(remaining.find((provider) => provider.status === 'connected')?.id || '');
+      setProviders(remaining);
+      // The overlay row is gone even when the file cleanup failed, so the
+      // warning is reported rather than presented as a clean delete.
+      if (result.warning) {
+        pushToast(`${target.name} removed from the chamber, but models.yml cleanup failed: ${result.warning}`, 'error');
+      } else if (result.removedFromOmp) {
+        const count = result.modelsRemoved ?? 0;
+        pushToast(
+          `${target.name} deleted from models.yml${count > 0 ? ` with its ${count} model${count === 1 ? '' : 's'}` : ''}.`,
+          'success',
+        );
+      } else {
+        pushToast(`${target.name} removed from the chamber list.`, 'success');
+      }
+    } finally {
+      setIsDeletingProvider(false);
+    }
+  };
+
+  const handleHideAll = () => updateSelectedModels(
+    (models) => models.map((m) => ({ ...m, isVisible: false })),
+  );
+
+  const handleShowAll = () => updateSelectedModels(
+    (models) => models.map((m) => ({ ...m, isVisible: true })),
+  );
+
+  const handleToggleModelVisibility = (modelId: string) => updateSelectedModels(
+    (models) => models.map((m) => (m.id === modelId ? { ...m, isVisible: !m.isVisible } : m)),
+  );
+
+  /**
+   * Save the per-model knobs omp honours (`models.yml` modelOverrides). The
+   * overlay still stores the display value so the dialog reopens where the user
+   * left it, but omp only reads the override — writing just the overlay was the
+   * bug that made these controls inert.
+   */
+  const handleSaveModelConfig = async (modelId: string, updates: Partial<ProviderModel>) => {
+    if (!selectedProvider) return;
+    const provider = selectedProvider;
+    updateSelectedModels((models) => models.map((m) => (m.id === modelId ? { ...m, ...updates } : m)));
+
+    const result = await saveModelOverrideRemote(provider.slug, modelId, updates);
+    if (!result.ok) {
+      pushToast(result.error || 'Failed to save the model configuration.', 'error');
+      return;
+    }
+    if (result.written) notifyModelsUpdated();
+    else if (result.reason) pushToast(result.reason, 'error');
+  };
+
+  return {
+    handleAddProvider,
+    handleReconnect,
+    handleFetchModels,
+    handleFetchModelsFromList,
+    handleOmpAuthSuccess,
+    handleToggleDisconnect,
+    handleToggleProviderDisabled,
+    handleDeleteProvider,
+    handleHideAll,
+    handleShowAll,
+    handleToggleModelVisibility,
+    handleSaveModelConfig,
+  };
+}

package/src/client/hooks/settings/providers/api.ts

@@ -0,0 +1,69 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * The settings API calls behind Settings → Providers.
+ *
+ * Split from the hook so the hook holds state transitions only — each of these
+ * is a request whose failure has to be reported to the user, and keeping them
+ * here means the "what does the server answer" contract has one home.
+ */
+
+import type { PresetProviderOption, ProviderItem, ProviderModel } from '@/shared/types';
+
+export interface ProviderSettingsPayload {
+  providers: ProviderItem[];
+  presetProviders?: PresetProviderOption[];
+}
+
+/** Load the merged provider registry (omp's sources + the chamber overlay). */
+export async function loadProvidersFromApi(): Promise<ProviderSettingsPayload | null> {
+  try {
+    const response = await fetch('/api/settings/providers');
+    const data = await response.json() as Partial<ProviderSettingsPayload>;
+    if (!Array.isArray(data?.providers)) return null;
+    return { providers: data.providers, ...(data.presetProviders ? { presetProviders: data.presetProviders } : {}) };
+  } catch (error) {
+    console.error('Failed to load providers from API:', error);
+    return null;
+  }
+}
+
+export interface ModelOverrideResult {
+  ok: boolean;
+  written?: boolean;
+  reason?: string;
+  error?: string;
+}
+
+/**
+ * Write the per-model knobs omp honours (`maxTokens`, reasoning effort) into
+ * models.yml `modelOverrides`. Writing only the chamber overlay left the
+ * controls inert — omp never read them.
+ */
+export async function saveModelOverrideRemote(
+  providerSlug: string,
+  modelId: string,
+  updates: Partial<ProviderModel>,
+): Promise<ModelOverrideResult> {
+  const body: Record<string, unknown> = { provider: providerSlug, modelId };
+  if ('maxTokens' in updates) body.maxTokens = updates.maxTokens ?? null;
+  if ('reasoningEffort' in updates) body.reasoningEffort = updates.reasoningEffort ?? null;
+  // Nothing omp would read — the overlay update alone is the whole change.
+  if (Object.keys(body).length === 2) return { ok: true, written: false };
+  try {
+    const response = await fetch('/api/settings/model-override', {
+      method: 'PUT',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify(body),
+    });
+    const data = await response.json() as { success?: boolean; written?: boolean; reason?: string; error?: string };
+    if (!response.ok) return { ok: false, error: data.error || 'Failed to save the model configuration.' };
+    return { ok: true, written: data.written, reason: data.reason };
+  } catch (error) {
+    console.error('Failed to save model override:', error);
+    return { ok: false, error: 'Failed to save the model configuration.' };
+  }
+}

package/src/client/hooks/settings/providers/index.ts

@@ -0,0 +1,138 @@
+import { useEffect, useMemo, useState } from 'preact/hooks';
+import type { PresetProviderOption, ProviderItem, ProviderModel } from '@/shared/types';
+import { PRESET_NEW_PROVIDERS } from '@/client/data/settings/provider';
+import { buildAvailableProviderPresets } from '@/shared/lib/models/provider/presets';
+import { useToasts } from '@/client/hooks/ui/toasts';
+import { loadProvidersFromApi } from '@/client/hooks/settings/providers/api';
+import { createProviderActions } from '@/client/hooks/settings/providers/actions';
+
+interface UseProviderSettingsOptions {
+  autoOpenAdd?: boolean;
+  onAddModalClose?: () => void;
+}
+
+/**
+ * State wiring behind Settings → Providers.
+ *
+ * The mutations themselves live in `providers/actions.ts`, which receives this
+ * hook's setters as one `deps` record — the split keeps both files under the
+ * repo's size ceiling without changing closure semantics, since every action
+ * still closes over the same state.
+ *
+ * Every mutation lands in one of two stores: the chamber-local overlay (per-model
+ * visibility and sampling config) or omp's own config.yml `disabledProviders`
+ * (connect / disconnect). Disconnect has to use the latter — the overlay is
+ * re-merged away on load, which is why a disconnected provider used to come back
+ * as connected.
+ */
+export function useProviderSettings({
+  autoOpenAdd = false,
+  onAddModalClose,
+}: UseProviderSettingsOptions = {}) {
+  const [providers, setProviders] = useState<ProviderItem[]>([]);
+  const [presetProviders, setPresetProviders] = useState<PresetProviderOption[]>(PRESET_NEW_PROVIDERS);
+  const [selectedProviderId, setSelectedProviderId] = useState<string>('provider-deepseek');
+  const [currentProject, setCurrentProject] = useState('ompchamber');
+  const [isFetchingModels, setIsFetchingModels] = useState(false);
+  const { toasts, pushToast, dismissToast } = useToasts();
+
+  const [isAddModalOpen, setIsAddModalOpen] = useState(autoOpenAdd);
+  const [isAddModelModalOpen, setIsAddModelModalOpen] = useState(false);
+  const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
+  const [isDeletingProvider, setIsDeletingProvider] = useState(false);
+  const [isReconnectModalOpen, setIsReconnectModalOpen] = useState(false);
+  const [isLoginModalOpen, setIsLoginModalOpen] = useState(false);
+  const [configModel, setConfigModel] = useState<ProviderModel | null>(null);
+  const [capabilitiesModel, setCapabilitiesModel] = useState<ProviderModel | null>(null);
+
+  useEffect(() => {
+    if (autoOpenAdd) setIsAddModalOpen(true);
+  }, [autoOpenAdd]);
+
+  useEffect(() => {
+    let active = true;
+    void loadProvidersFromApi().then((data) => {
+      if (!active || !data) return;
+      setProviders(data.providers);
+      const connected = data.providers.filter((provider) => provider.status === 'connected');
+      setSelectedProviderId(connected.length > 0 ? connected[0].id : '');
+      if (data.presetProviders) setPresetProviders(data.presetProviders);
+    });
+    return () => { active = false; };
+  }, []);
+
+  // The sidebar lists connected providers plus every provider the user disabled:
+  // a disabled provider reports `disconnected`, so filtering on status alone
+  // would make the switch that hid it unreachable.
+  const connectedProviders = useMemo(
+    () => providers.filter(
+      (provider) => provider.status === 'connected' || provider.disabled === true,
+    ),
+    [providers],
+  );
+  const availablePresetProviders = useMemo(
+    () => buildAvailableProviderPresets(providers, presetProviders),
+    [providers, presetProviders],
+  );
+  const selectedProvider = connectedProviders.find((p) => p.id === selectedProviderId) || connectedProviders[0];
+
+  const actions = createProviderActions({
+    providers,
+    selectedProvider,
+    connectedProviders,
+    isFetchingModels,
+    isDeletingProvider,
+    pushToast,
+    setProviders,
+    setSelectedProviderId,
+    setIsAddModalOpen,
+    setIsDeleteModalOpen,
+    setIsDeletingProvider,
+    setIsFetchingModels,
+    ...(onAddModalClose ? { onAddModalClose } : {}),
+  });
+
+  /**
+   * After a hand-registered model lands in models.yml, the registry has to be
+   * re-read: the new row exists only in omp's file, so nothing in the chamber's
+   * own overlay knows about it yet. Re-fetching the MERGED list (rather than
+   * re-saving the overlay, whose response is the overlay alone) is what puts
+   * the model in the sidebar count and the chat picker.
+   */
+  const handleModelAdded = async (modelId: string) => {
+    pushToast(`${modelId} registered in models.yml.`, 'success');
+    const data = await loadProvidersFromApi();
+    if (data) setProviders(data.providers);
+  };
+
+  return {
+    providers,
+    connectedProviders,
+    availablePresetProviders,
+    selectedProvider,
+    currentProject,
+    setCurrentProject,
+    isFetchingModels,
+    toasts,
+    pushToast,
+    dismissToast,
+    isAddModelModalOpen,
+    setIsAddModelModalOpen,
+    handleModelAdded,
+    isDeleteModalOpen,
+    setIsDeleteModalOpen,
+    isDeletingProvider,
+    isAddModalOpen,
+    setIsAddModalOpen,
+    isReconnectModalOpen,
+    setIsReconnectModalOpen,
+    isLoginModalOpen,
+    setIsLoginModalOpen,
+    configModel,
+    setConfigModel,
+    capabilitiesModel,
+    setCapabilitiesModel,
+    setSelectedProviderId,
+    ...actions,
+  };
+}