fix: improve ux import model

[urmauur]

Describe Your Changes

This pull request improves the user experience when importing models in the provider settings page. The main changes add feedback and error handling to the import process, preventing duplicate imports and showing a loading indicator during long-running operations.

Model Import UX Improvements:

• Added an importingModel state to track when a model is being imported and to disable the import button during the process. [1] [2]
• Updated the import button to display a loading spinner and change its text to "Importing..." while an import is in progress.

Error Handling and Validation:

• Added a check to prevent importing a model with a name that already exists; displays an error toast if a duplicate is detected.
• Ensured that the importingModel state is reset to false in all code paths, including error and early return scenarios. [1] [2]

Minor Improvements:

• Normalized imported model filenames by replacing whitespace with dashes.
• Changed the toast success message to display the imported model's filename instead of the provider name.

Fixes Issues

<img width="314" height="281" alt="Screenshot 2025-08-19 at 21 21 35" src="https://github.com/user-attachments/assets/602d1522-8efa-4348-8100-d908bbe656c0"

/>

• Closes bug: GGUF model says its loaded but doesnt show up #5833
• Closes #

Self Checklist

• Added relevant comments, esp in complex areas
• Updated docs (for bug fixes / features)
• Created issues for follow-up changes or refactoring needed

---

Important

Improves model import UX in provider settings with loading state, error handling, and duplicate prevention.

• Model Import UX Improvements:
  • Added importingModel state in $providerName.tsx to track import process and disable button.
  • Updated import button to show loading spinner and "Importing..." text during import.
• Error Handling and Validation:
  • Prevents importing models with duplicate names, shows error toast if detected.
  • Ensures importingModel state resets in all scenarios, including errors.
• Minor Improvements:
  • Normalized imported model filenames by replacing spaces with dashes.
  • Changed success toast to display imported model's filename.
• Dependencies:
  • Updated Cargo.lock to include darling version 0.21.2 and rmcp version 0.5.0.

^{This description was created by for b828d3f. You can customize this summary. It will automatically update as commits are pushed.}

[ellipsis-dev]

Caution

Changes requested ❌

Reviewed everything up to 6ee044d in 2 minutes and 23 seconds. Click for details.

• Reviewed 93 lines of code in 1 files
• Skipped 0 files when reviewing.
• Skipped posting 2 draft comments. View those below.
• Modify your settings and rules to customize what types of comments Ellipsis leaves. And don't forget to react with 👍 or 👎 to teach Ellipsis.

1. web-app/src/routes/settings/providers/$providerName.tsx:531

• Draft comment:
  Consider refactoring the 'await getProviders().then(setProviders)' into a more readable async/await style for clarity. For example: 'const providers = await getProviders(); setProviders(providers);'.
• Reason this comment was not posted:
  Confidence changes required: 33% <= threshold 50% None

2. web-app/src/routes/settings/providers/$providerName.tsx:524

• Draft comment:
  In the catch block for pullModel, only console.error is called. It might improve UX to also display a toast error so the user is informed when the import fails.
• Reason this comment was not posted:
  Comment was not on a location in the diff, so it can't be submitted as a review comment.

Workflow ID: wflow_VAgg5jfKeWpa1VlK

^{You can customize by changing your verbosity settings, reacting with 👍 or 👎, replying to comments, or adding code review rules.}

[github-actions]

Barecheck - Code coverage report

Total: 37.52%

Your code coverage diff: -0.06% ▾

Uncovered files and lines

File

Lines

web-app/src/routes/settings/providers/$providerName.tsx

2-8, 15, 21-42, 45-47, 49-53, 55-86, 89-97, 99-102, 104-114, 116-122, 124, 126-128, 130-136, 138-139, 141-163, 165, 167, 170-172, 174-175, 178-179, 181, 183-188, 191-192, 194-197, 202-203, 205-208, 210-216, 218-220, 223-229, 232-235, 237, 239-243, 245-269, 271, 273-287, 289-291, 293-303, 305-342, 344-350, 353-354, 356-363, 365-375, 379-381, 384, 387-389, 391-402, 405-409, 411-414, 417-418, 421, 423-427, 429-436, 438-441, 443, 446-455, 457-462, 464-474, 476-478, 480-492, 494, 496-497, 499, 501-502, 505-522, 524-529, 531-534, 536-542, 544-545, 547-553, 555-560, 562-565, 567-571, 573-574, 577-587, 589-592, 594-600, 602-611, 613-625, 627-628, 630-635, 637-643, 645, 647, 649, 651, 653, 655, 657-664, 666-668, 670-676, 678

[ellipsis-dev]

Caution

Changes requested ❌

Reviewed 6c612d8 in 2 minutes and 16 seconds. Click for details.

• Reviewed 140 lines of code in 1 files
• Skipped 0 files when reviewing.
• Skipped posting 2 draft comments. View those below.
• Modify your settings and rules to customize what types of comments Ellipsis leaves. And don't forget to react with 👍 or 👎 to teach Ellipsis.

1. web-app/src/routes/settings/providers/$providerName.tsx:549

• Draft comment:
  Refactored the inline onClick handler to use handleImportModel, which improves readability and reduces duplication.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50% None

2. web-app/src/routes/settings/providers/$providerName.tsx:115

• Draft comment:
  Ensure that 'open' returns a string as expected. If there's potential for an array (even with multiple:false), consider adding a type guard for safety.
• Reason this comment was not posted:
  Confidence changes required: 50% <= threshold 50% None

Workflow ID: wflow_guZGpMJEpDL1HEJ7

^{You can customize by changing your verbosity settings, reacting with 👍 or 👎, replying to comments, or adding code review rules.}

[ellipsis-dev]

Important

Looks good to me! 👍

Reviewed b828d3f in 1 minute and 28 seconds. Click for details.

• Reviewed 122 lines of code in 2 files
• Skipped 0 files when reviewing.
• Skipped posting 2 draft comments. View those below.
• Modify your settings and rules to customize what types of comments Ellipsis leaves. And don't forget to react with 👍 or 👎 to teach Ellipsis.

1. web-app/src/routes/settings/providers/$providerName.tsx:373

• Draft comment:
  Consider handling the asynchronous update of provider settings more robustly. The onChange callback updates settings by calling updateSettings and updateProvider without awaiting or error handling. This might lead to race conditions and unhandled errors. Consider awaiting these calls and handling errors before calling stopAllModels().
• Reason this comment was not posted:
  Comment was not on a location in the diff, so it can't be submitted as a review comment.

2. web-app/src/routes/settings/providers/$providerName.tsx:125

• Draft comment:
  Ensure consistency in duplicate model detection: the import check compares fileName with model.name, whereas refresh logic uses model.id. Consider standardizing on a single unique identifier for models.
• Reason this comment was not posted:
  Comment was not on a location in the diff, so it can't be submitted as a review comment.

Workflow ID: wflow_tI08FT4wGDoHVNz3

^{You can customize by changing your verbosity settings, reacting with 👍 or 👎, replying to comments, or adding code review rules.}

[louis-jan]

LGTM