How do I assign a template to the user edit form?

Question

I am trying to create a twig template for user edit page.

I have tried

/**
 * Implements hook_theme_suggestions_alter().
 */
function my_module_user_theme_suggestions_alter(array &$suggestions, array $variables, $hook) {
  if($variables['element']['#type'] == 'form' && $variables['element']['#form_id'] == 'user_form') {
    $original_theme_hook = $variables['theme_hook_original'];
    $suggestions[] = $original_theme_hook . '__bs_' . str_replace('-', '_', $variables['element']['#id']);
  }
  return $suggestions;
}

I have added my template in my module under templates/form__bs_user_form.html.twig

I have also added in my form_alter:

$form['#theme'] = ['bs_user_form'];

and

function my_module_user_theme($existing, $type, $theme, $path) {
  return [
    'bs_user_form' => [
      'render element' => 'form',
      ],
  ];
}

It does retrieve this error: Argument 1 passed to Drupal\Core\Render\Element::setAttributes() must be of the type array, null given

How can I assign a template to the user edit form?

---

Solved, I removed my_module_user_theme_suggestions_alter and I got it working. If anyone has a better solution feel free to add it to the answers.

Answer 1

To add an additional template level to a form, add the #theme key to the form array:

$form['#theme'] = ['bs_user_form'];

and in my_module.module:

/**
 * Implements hook_theme().
 */
function my_module_theme($existing, $type, $theme, $path) {
  return [
    'bs_user_form' => [
      'render element' => 'form',
      ],
  ];
}

The template name is then bs-user-form.html.twig, where you can print the form with {{ form }} or theme it like for example:

entity-moderation-form.html.twig

<ul class="entity-moderation-form">
  <li>{{ form.current }}</li>
  <li>{{ form.new_state }}</li>
  <li>{{ form.revision_log }}</li>
  <li>{{ form.submit }}</li>
</ul>
{{ form|without('current', 'new_state', 'revision_log', 'submit') }}

---

You can add theme suggestion to the theme name, but don't use form__ as base hook, because this is already used for the Form element, which caused the error.