Split manual and UI configuration not working

I am certain I must be doing something wrong, but this has been driving me crazy for days. I even spun up a new dummy instance of Home Assistant to make sure there wasn’t something wrong with my default setup.

What happens is that Home Assistant seem to correctly load the manual scripts and automations, but when created with the UI it stores them in the default path (next to configuration.yaml) and not in the designated path/file. Why is that? Shouldn’t they be saved into the ui-path?

Even though I’ve copied the examples from the documentation and from several community posts in different threads it still won’t work. Perhaps I’ve missed something.

configuration.yaml:

# Loads default set of integrations. Do not remove.
default_config:

lovelace:
mode: yaml

# Load frontend themes from the themes folder
frontend:

themes: !include_dir_merge_named themes

# My own handmade automations
automation manual: !include_dir_merge_list automations/

# Automations I create in the UI
automation ui: !include ui/automations.yaml

# Scripts I create in the UI
script ui: !include ui/scripts.yaml

# My own handmade scripts
script manual: !include manual/scripts.yaml

scene: !include scenes.yaml

dummy file in automations/ (loads as expected):

- alias: "Automation 1"
  trigger:
    - platform: state
      entity_id: sun.sun
      to: "above_horizon"
  action:
    - service: todo.add_item
      target:
        entity_id: todo.shopping_list
      data:
        item: Test

- alias: "Automation 2"
  trigger:
    - platform: state
      entity_id: todo.shopping_list
      to: "1"
  action:
    - service: todo.add_item
      target:
        entity_id: todo.shopping_list
      data:
        item: Test 2

ui/automations.yaml and ui/scripts.yaml only contains square brackets ([])

I also tried !include_dir_merge_list for the UI and that made them load but I still get the following error when I open/edit them: