Allow using directory name as component name for anonymous components

Author: andyexeter

src/TwigComponent/CHANGELOG.md

@@ -4,6 +4,7 @@
 
 -  Add option `profiler.collect_components` to control component data collection
    in the profiler (enabled in debug mode by default)
+-  Add support for using directory name as component name for anonymous components
 
 ## 2.30
 

src/TwigComponent/doc/index.rst

@@ -676,6 +676,43 @@ the subdirectory:
     {# renders as: #}
     <button class="primary">Click Me!</button>
 
+If your anonymous component lives in a directory with the same name, you can
+name the component file ``index.html.twig`` to avoid repetition:
+
+.. code-block:: html+twig
+
+    {# templates/components/Menu/index.html.twig #}
+    <nav {{ attributes.defaults({class: 'menu'}) }}>
+        <ul>
+            {% block content %}{% endblock %}
+        </ul>
+    </nav>
+
+.. code-block:: html+twig
+
+    {# templates/components/Menu/Item.html.twig #}
+    {% props href, label %}
+    <li {{ attributes.defaults({class: 'menu__item'}) }}>
+        <a href="{{ href }}">{% block content %}{{ label }}{% endblock %}</a>
+    </li>
+
+.. code-block:: html+twig
+
+    {# index.html.twig #}
+    ...
+    <twig:Menu>
+        <twig:Menu:Item href="/">Home</twig:Menu:Item>
+        <twig:Menu:Item href="/about">About</twig:Menu:Item>
+    </twig:Menu>
+
+    {# renders as: #}
+    <nav class="menu">
+        <ul>
+            <li class="menu__item"><a href="/">Home</a></li>
+            <li class="menu__item"><a href="/about">About</a></li>
+        </ul>
+    </nav>
+
 Like normal, you can pass extra attributes that will be rendered on the element:
 
 .. code-block:: html+twig

src/TwigComponent/src/ComponentTemplateFinder.php

@@ -66,6 +66,11 @@ public function findAnonymousComponentTemplate(string $name): ?string
             return $template;
         }
 
+        $template = rtrim($this->directory, '/').'/'.$componentPath.'/index.html.twig';
+        if ($loader->exists($template)) {
+            return $template;
+        }
+
         $parts = explode('/', $componentPath, 2);
         if (\count($parts) < 2) {
             return null;

src/TwigComponent/tests/Fixtures/templates/anonymous/Bar.html.twig

@@ -178,6 +178,29 @@ public function testLoadingAnonymousComponentFromBundle()
         $this->assertNull($metadata->get('class'));
     }
 
+    public function testLoadingAnonymousComponentWithFallback()
+    {
+        self::bootKernel(['environment' => 'anonymous_directory']);
+
+        $metadata = $this->factory()->metadataFor('Menu');
+
+        $this->assertSame('anonymous/Menu/index.html.twig', $metadata->getTemplate());
+        $this->assertSame('Menu', $metadata->getName());
+        $this->assertNull($metadata->get('class'));
+
+        $metadata = $this->factory()->metadataFor('Menu:Item');
+
+        $this->assertSame('anonymous/Menu/Item.html.twig', $metadata->getTemplate());
+        $this->assertSame('Menu:Item', $metadata->getName());
+        $this->assertNull($metadata->get('class'));
+
+        // Ensure anonymous/Bar.html.twig takes precedence over anonymous/Bar/index.html.twig
+        $metadata = $this->factory()->metadataFor('Bar');
+        $this->assertSame('anonymous/Bar.html.twig', $metadata->getTemplate());
+        $this->assertSame('Bar', $metadata->getName());
+        $this->assertNull($metadata->get('class'));
+    }
+
     public function testAutoNamingInSubDirectory()
     {
         $metadata = $this->factory()->metadataFor('SubDirectory:ComponentInSubDirectory');

src/TwigComponent/tests/Fixtures/templates/anonymous/Bar/index.html.twig

@@ -117,13 +117,18 @@ public function testFindTemplateWithinDirectory()
             'foo/bar.html.twig',
             'bar/foo/bar.html.twig',
             'foo/foo/bar.html.twig',
+            'foo/qux/index.html.twig',
+            'foo/foo/baz/index.html.twig',
         ];
         $loader = $this->createLoader($templates);
         $finder = new ComponentTemplateFinder($loader, 'foo');
 
         $this->assertEquals('foo/bar.html.twig', $finder->findAnonymousComponentTemplate('bar'));
         $this->assertEquals('foo/foo/bar.html.twig', $finder->findAnonymousComponentTemplate('foo:bar'));
         $this->assertEquals('foo/foo/bar.html.twig', $finder->findAnonymousComponentTemplate('foo:bar'));
+
+        $this->assertEquals('foo/qux/index.html.twig', $finder->findAnonymousComponentTemplate('qux'));
+        $this->assertEquals('foo/foo/baz/index.html.twig', $finder->findAnonymousComponentTemplate('foo:baz'));
     }
 
     private function createLoader(array $templates): LoaderInterface