Define breakpoint names neutrally outside the theme - leads to unwanted drowl_base dependency

Moved to drowl_media as drowl_media_types contains the DIRECT references:

grep -r "drowl_base.small" *;
drowl_media/modules/drowl_media_types/config/optional/responsive_image.styles.viewport_width.yml:    breakpoint_id: drowl_base.small
drowl_media/modules/drowl_media_types/config/optional/responsive_image.styles.page_width_25.yml:    breakpoint_id: drowl_base.small
drowl_media/modules/drowl_media_types/config/optional/responsive_image.styles.page_width_scale.yml:    breakpoint_id: drowl_base.small
drowl_media/modules/drowl_media_types/config/optional/responsive_image.styles.page_width_50.yml:    breakpoint_id: drowl_base.small
drowl_media/modules/drowl_media_types/config/optional/responsive_image.styles.page_width_25_scale.yml:    breakpoint_id: drowl_base.small
drowl_media/modules/drowl_media_types/config/optional/responsive_image.styles.viewport_width_scale.yml:    breakpoint_id: drowl_base.small
drowl_media/modules/drowl_media_types/config/optional/responsive_image.styles.page_width.yml:    breakpoint_id: drowl_base.small
drowl_media/modules/drowl_media_types/config/optional/responsive_image.styles.page_width_50_scale.yml:    breakpoint_id: drowl_base.small

While drowl_paragraphs requires drowl_media (like drowl_header_images also) and this way has an indirect dependency on drowl_base theme.

Indeed I'm unsure if there's anything we can do about this problem. Let's keep this open as reminder, if someone has a good idea, but it's definitely minor.

This looked like a minor problem, but not defining the theme, which provides the breakpoints, broke configuration import!

So as a quickfix I moved all the responsive image styles into config/optional and added drowl_base as dependency. This has some consequences:

• If drowl_base is not present, the responsive image styles will NOT be installed
• drowl_base becomes an indirect / optional dependency

In consequence this also means that none of the configs depending on these responsive image styles will be imported / working!

Whenever drowl_base is present (which is the case for our NEW sites) or existing installations where we already added the responsive image styles manually, this is no problem. Anyway, we can't just leave it as it is forever.

Best would still be to define the breakpoints outside of the theme (better in this module), but I think this isn't allowed by Drupal Core currently? Or is it? We should check that with more time...

=> No concrete consequences for us currently, but this part is definitely polluted by "drowl_base" and should be resolved some day!

Here's the related commit:

Perhaps yes, perhaps not... we'll have to look at this with more time and test carefully.

1.

The Docs for breakpoints mentions Themes AND modules

If it's possible to define the breakpoints in a module, we should consider doing that, instead of the theme. In drowl_media or a separate.

Then this would be decoupled, and everything is fine and usable without referencing a theme.

2.

Specifying a group is optional, if you don't specify a group, the group will be named the same as your theme or module.

I think this is what the UI does, but we have three references in the responsive image style config:

langcode: en
status: true
dependencies:
  config:
    - image.style.page_width_25_lg
  theme:
    - drowl_base
id: page_width_25
label: '25% Page width, cropped'
image_style_mappings:
  -
    image_mapping_type: image_style
    image_mapping: page_width_25_lg
    breakpoint_id: drowl_base.small
    multiplier: 1x
breakpoint_group: drowl_base

A)

  theme:
    - drowl_base

tells drupal about the dependencies. If there wouldn't be any, we could remove them (that was the case before, lead to breaking config - which is correct behaviour of drupal. The dependency should be defined explicitly, if it exists

B)
breakpoint_group: drowl_base
I guess that is what the text refers to. PERHAPS it can even be left empty or be ANY string in the config as it's just for structuring the UI and has no technical implications.

C)
I guess the real inner dependency is:
breakpoint_id: drowl_base.small

And if I remember correctly, I already invested some time, the last time I worked on this issue and found out that this was the logical problem...

Conclusion and further steps:
For me, this topic is too large and dangerous to proceed here for now or trying a simple fix without extensive testing. This is supposed to break a lot of things if rolled out.

Next step would be to decide where to put the breakpoints (separate module or drowl_media), set up a proof of concept and document the required migration / update steps. But this has to be 100% bulletproof.

Switching to bug report as of the last comments.

Created a first MR from #12

Still TDB:
- Read all comments above and ensure we considered everything
- Replace drowl_base breakpoints with drowl_media breakpoints in the configuration files
- Match with our theme? / VL?

Just ran into this again. Let's get this committed. We also had to align the import configurations accordingly.