allow searching through addons

TODO.md

@@ -8,9 +8,7 @@
 - [ ] Streaming logs for pods
 - [ ] Project groupings?
 - [ ] Constantly refresh the processes page for readiness of pods
-- [ ] Add metrics page for add ons
 - [ ] Support GPU backed clusters
 - [ ] Make accidental deletions harder
 - [ ] Add connection tutorial to add on endpoints
 - [ ] Allow creating a one off pod even if there are no services or deployments yet.
-- [ ] Add addons to search

app/javascript/controllers/theme_controller.js

@@ -76,18 +76,18 @@ export default class extends Controller {
 
   _searchInput(term) {
     this.menuItemTargets.forEach(item => {
-      const projectName = item.dataset.projectName;
-      if (projectName.toLowerCase().includes(term.toLowerCase())) {
+      const name = item.dataset.name;
+      if (name.toLowerCase().includes(term.toLowerCase())) {
         item.setAttribute("open", "true");
         item.classList.remove("hidden");
         
         // Add underlining for matching text
         if (term) {
           const regex = new RegExp(`(${term})`, 'gi');
-          const highlightedText = projectName.replace(regex, '<span class="search-highlight">$1</span>');
-          item.querySelector('.project-name').innerHTML = highlightedText;
+          const highlightedText = name.replace(regex, '<span class="search-highlight">$1</span>');
+          item.querySelector('.name').innerHTML = highlightedText;
         } else {
-          item.querySelector('.project-name').textContent = projectName;
+          item.querySelector('.name').textContent = name;
         }
       } else {
         item.removeAttribute("open");

app/views/shared/_search.html.erb

@@ -26,8 +26,8 @@
         <li class="menu-title">Projects</li>
         <% current_account.projects.each do |project| %>
           <li class="">
-            <details open data-theme-target="menuItem" data-project-name="<%= project.name %>">
-              <summary><div class="project-name"><%= project.name %></div></summary>
+            <details open data-theme-target="menuItem" data-name="<%= project.name %>">
+              <summary><div class="name"><%= project.name %></div></summary>
               <ul>
                 <% %w(deployments services environment_variables processes metrics).each do |name| %>
                   <li>
@@ -40,6 +40,22 @@
             </details>
           </li>
         <% end %>
+        <% current_account.add_ons.each do |addon| %>
+          <li class="">
+            <details open data-theme-target="menuItem" data-name="<%= addon.name %>">
+              <summary><div class="name"><%= addon.name %></div></summary>
+              <ul>
+                <% %w(processes metrics).each do |name| %>
+                  <li>
+                    <a href="<%= send("add_on_#{name}_path", addon) %>" data-theme-target="linkItem">
+                      <%= name.titleize %>
+                    </a>
+                  </li>
+                <% end %>
+              </ul>
+            </details>
+          </li>
+        <% end %>
       </ul>
     </div>
   </div>