Add AJAX functionality to dynamically update fields based on provider and model

Created on 7 May 2025, about 2 months ago

Problem/Motivation

The AI Media Image module currently doesn't dynamically update configuration fields when switching between different AI providers or models. When a user changes the AI provider or selects a different model, the configuration options (like image size, response format, etc.) don't update to reflect the capabilities of the selected provider/model.

This is particularly problematic when switching between models that support different image sizes (e.g., DALL-E 2 vs DALL-E 3), as users may be presented with incompatible options.

Proposed Solution

This patch implements AJAX functionality to dynamically update the form elements when changing providers or models:

  1. Adds AJAX callbacks for both provider and model select fields
  2. Updates the model options when the provider is changed
  3. Updates configuration fields like image size and response format based on the selected model
  4. Adds special handling for provider-specific options (OpenAI and Stability AI)
  5. Includes proper error handling and logging

Benefits

  • Improved user experience with dynamically updated fields
  • Prevents errors from submitting incompatible configuration options
  • Maintains parity with similar functionality in the ai_audio_field πŸ› C Active module
  • Ensures proper defaults are selected based on the capabilities of each model
✨ Feature request
Status

Needs review

Version

1.0

Component

Code

Created by

πŸ‡°πŸ‡¬Kyrgyzstan dan_metille

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @dan_metille
  • πŸ‡§πŸ‡ͺBelgium svendecabooter Gent

    Tested with OpenAI, and getting the following errors:

    Warning: Undefined array key "fids" in Drupal\media_library\Form\FileUploadForm->validateUploadElement() (line 212 of /var/www/html/web/core/modules/media_library/src/Form/FileUploadForm.php)

    ypeError: count(): Argument #1 ($value) must be of type Countable|array, null given in count() (line 212 of /var/www/html/web/core/modules/media_library/src/Form/FileUploadForm.php).

    Haven't investigated the root cause yet...

  • πŸ‡§πŸ‡ͺBelgium svendecabooter Gent

    EDIT: seems to be unrelated to this patch, because I'm getting the same errors when patch is not applied.

  • πŸ‡ΊπŸ‡ΈUnited States CoffeyMachine

    Hi @dan_metille, this is another good catch, thank you.

    This is a use case I have not been able to properly test as I've only been able to work with a single provider so far. I tried setting up the Gemini and AWS Bedrock providers, but it appears both of those have their own issues with their text-to-image models. Are you able to share some details about what providers/models are you testing with? Maybe I can setup a similar environment.
    For my future reference:
    https://www.drupal.org/project/gemini_provider/issues/3466342 πŸ“Œ Implement media in prompt Active
    https://www.drupal.org/project/ai_provider_aws_bedrock/issues/3494009 πŸ› Malformed Input Request Active

    Despite this, I was able to test your UI AJAX changes. I see the form updating when I select different providers in the dropdown on /media/add/image. However, when I tested this in the Media Image field modal on a node, an AJAX error was thrown and the form did not update. We'll need this enhancement to work for both use cases.

    I'm also concerned about the special handling for specific providers/models. Why is this necessary? Code for specific providers/models is outside the scope of this module and needs to be handled by the provider modules.

    It would be helpful to create an issue fork instead of sharing patch files. That way I may be able to collaborate on code changes.

  • πŸ‡°πŸ‡¬Kyrgyzstan dan_metille

    Thanks for the feedback @coffeymachine.

    Let me first answer about the alternative provider that I have successfully tested: https://www.drupal.org/project/fireworksai β†’ (Stable Diffusion, etc).

    While I did not tried AWS Bedrock, I also had issues with Gemini, which is a pity because ImageFX is great.

    Finally, I should admit that I forgot to test the patch while adding a Media Image on a node. Therefore, let me check that together with the special handling for specific providers/models and come back with an issue fork.

Production build 0.71.5 2024