Improve convenience in setting of auto-grid less than 3 images

Contribute Feature
1

Configurable minimum image count for automatic image grids

I have run into a limitation with the automatic image grid feature.

At the moment, the auto-grid behaviour appears to be controlled by the site setting for auto-grid images, but the actual threshold for when the composer inserts [grid]...[/grid] is still fixed in the frontend code.

The relevant composer logic currently uses a hardcoded value:

const MIN_IMAGES_TO_AUTO_GRID = 3;

So, as far as I can tell, admins currently have a choice between:

What admins can do now Result
Enable auto-grid images Uploads of 3 or more consecutive images are automatically wrapped in [grid]...[/grid]
Disable auto-grid images No automatic grid wrapping
Change the threshold from 3 to another number Not currently available as a site setting

The problem is that 3 is not necessarily the right threshold for every community.

For some sites, automatic grids are useful, but only when users upload a larger batch of images. For example, an admin might want auto-grid to start at 5, 6, 10, or another value, rather than triggering as soon as 3 images are uploaded.

This would be especially useful for communities where users often upload a small number of images inline with explanatory text, but larger galleries should still be compacted into a grid.

Proposed direction

I think this could be improved by adding a configurable site setting for the minimum number of consecutive image uploads before the composer automatically inserts a grid.

Something like:

auto_grid_images_minimum_count

For example:

Setting Example value
enable_auto_grid_images true
auto_grid_images_minimum_count 5

Then auto-grid would still be available, but it would only trigger once the configured threshold is reached.

This keeps the existing behaviour as the default if the new setting defaults to 3, while giving admins more control.

Experimental branch / possible head start

I have made a small experimental branch here in case anyone with more Discourse development experience has time to fork it, clean it up, or carry the idea forward:

image-grid-num-setting branch

The branch is not intended as a polished PR yet. It is more of a starting point showing the intended direction:

  • add a new site setting for the auto-grid minimum image count
  • expose that setting to the client
  • replace the hardcoded MIN_IMAGES_TO_AUTO_GRID = 3 check in the composer upload code with the configured value
  • update the admin setting text so the existing auto-grid wording no longer implies the threshold is always 3
  • add/update frontend specs if needed

The kind of frontend change I had in mind is roughly:

const minImagesToAutoGrid = Number(
  this.siteSettings.auto_grid_images_minimum_count ?? 3
);

if (
  this.siteSettings.enable_auto_grid_images &&
  this.#consecutiveImages?.length >= minImagesToAutoGrid &&
  this.textManipulation
) {
  this.textManipulation.autoGridImages([...this.#consecutiveImages]);
  this.#consecutiveImages.length = 0;
}

There is also a recent example of a Discourse-style enum site setting in PR #36014:

PR #36014 - FEATURE: adds calendar_upcoming_events_default_view setting

That PR is for the Calendar and Events plugin rather than image grids directly, so I am not suggesting it affects this feature. I mention it because it seems to show a useful implementation pattern for this sort of configurable site setting: define the setting, expose it to the client, and then read it from the frontend via siteSettings.

Related links

Original discussion about turning off auto-grid images:

Turning off auto-grid-images?

Automatic image grids announcement:

Automatically apply grids to image uploads

Example PR showing site-setting architecture:

PR #36014 - FEATURE: adds calendar_upcoming_events_default_view setting

My experimental branch:

image-grid-num-setting branch

1 Like