Adjust caching and accessibility

css/archive_tree.css

@@ -9,9 +9,13 @@
 .archive-tree-year {
   font-weight: normal;
 }
+.archive-tree-month-list {
+    margin: 0;
+    padding-left: 2em;
+}
 .archive-tree-month {
-  margin-left: 2em;
-  padding-left: 0.5em;
+  margin-left: 0;
+  padding-left: 0;
   border-left: 2px solid #ccc;
   display: block;
 }

src/Plugin/Block/ArchiveTreeBlock.php

@@ -114,32 +114,44 @@ class ArchiveTreeBlock extends BlockBase {
     foreach ($tree as $year => $data) {
       $year_url = '/archive-tree/' . $year . '/' . $type_arg;
       $open = $expand ? ' open' : '';
-      $output .= '<details' . $open . '><summary class="archive-tree-year">';
+      $output .= '<details' . $open . ' aria-label="Archive for ' . $year . '"><summary class="archive-tree-year">';
       $output .= '<a href="' . $year_url . '">' . $year . '</a> (' . $data['count'] . ')';
       $output .= '</summary>';
       if (!empty($data['months'])) {
+        $output .= '<ul class="archive-tree-month-list">';
         foreach ($data['months'] as $month => $month_data) {
           $month_url = '/archive-tree/' . $year . '/' . $month . '/' . $type_arg;
-          $output .= '<div class="archive-tree-month">';
+          $output .= '<li class="archive-tree-month">';
           $output .= '<a href="' . $month_url . '">' . $month . '</a> (' . $month_data['count'] . ')';
-          $output .= '</div>';
+          $output .= '</li>';
         }
+        $output .= '</ul>';
       }
       $output .= '</details>';
     }
 
     return [
       '#markup' => '<div class="archive-tree-block">' . $output . '</div>',
-      '#allowed_tags' => ['details', 'summary', 'a', 'div'],
+      '#allowed_tags' => ['details', 'summary', 'a', 'div', 'ul', 'li'],
       '#attached' => [
         'library' => [
           'archive_tree/archive_tree',
         ],
       ],
       '#cache' => [
-        'contexts' => ['user', 'languages'],
-        'tags' => ['node_list'],
-        'max-age' => -1,
+        // Cache per user, language, route, and theme for accuracy.
+        'contexts' => [
+          'user',
+          'languages',
+          'theme',
+        ],
+        // Invalidate when any node changes or content type config changes.
+        'tags' => [
+          'node_list',
+          'config:node.type',
+        ],
+        // Cache for 1 hour (3600 seconds) for performance, but not forever.
+        'max-age' => 3600,
       ],
     ];
   }