8000 Add missing link to parent menu item · activeadmin/activeadmin@358317b · GitHub
[go: up one dir, main page]
Skip to content

Commit 358317b

Browse files
hasgharihasghari
committed
Add missing link to parent menu item
Currently when rendering a nested menu, if the parent menu item links to a url, the link is not rendered for the parent item and there is no way to navigate to it.
1 parent e242b89 commit 358317b

File tree

5 files changed

+25
-16
lines changed

5 files changed

+25
-16
lines changed

‎app/controllers/active_admin/base_controller/menu.rb

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,8 @@ def current_menu
1717
active_admin_config.navigation_menu
1818
end
1919

20-
def current_menu_item?(item)
21-
item.current?(@current_menu_item)
20+
def current_menu_item?(item, children: true)
21+
item.current?(@current_menu_item, children: children)
2222
end
2323

2424
def set_current_menu_item

‎app/javascript/active_admin/features/main_menu.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
11
import Rails from '@rails/ujs';
22

3-
const toggleMenu = function(event) {
4-
const parent = this.parentNode
3+
const toggleMenu = function() {
4+
const parent = this.closest([`[data-item-id="${this.dataset.parentId}"]`])
5+
56
if (!("open" in parent.dataset)) {
67
parent.dataset.open = ""
78
} else {

‎app/views/active_admin/_main_navigation.html.erb

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -3,24 +3,32 @@
33
<% current_menu.items(self).each do |item| %>
44
<% children = item.items(self).presence %>
55
<li <%= current_menu_item?(item) && "data-open" %> class="group" data-item-id="<%= item.id %>">
6-
<% if children %>
7-
<button data-menu-button class="text-gray-600 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white flex items-center w-full rounded-md p-2 gap-x-2 text-sm">
6+
<% label = capture do %>
7+
<% if (url = item.url(self)).present? %>
8+
<%= link_to item.label(self), url, item.html_options.merge(class: "text-gray-600 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white flex items-center w-full rounded-md p-2 gap-x-2 text-sm no-underline #{(current_menu_item?(item, children: false) ? "bg-gray-100 dark:bg-white/5 text-gray-900 dark:text-white selected" : "")}") %>
9+
<% else %>
810
<%= item.label(self) %>
9-
<svg class="group-data-[open]:rotate-90 group-data-[open]:rtl:-rotate-90 ms-auto h-5 w-5 shrink-0 rtl:-scale-x-100" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
10-
<path fill-rule="evenodd" d="M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z" clip-rule="evenodd" />
11-
</svg>
12-
</button>
11+
<% end %>
12+
<% end %>
13+
14+
<% if children %>
15+
<div class="flex gap-2">
16+
<div class="flex-auto"><%= label %></div>
17+
<button data-parent-id="<%= item.id %>" data-menu-button class="bg-gray-100 dark:bg-white/5 text-gray-600 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white flex items-center rounded-full p-2 text-sm">
18+
<svg class="group-data-[open]:rotate-90 group-data-[open]:rtl:-rotate-90 ms-auto h-5 w-5 shrink-0 rtl:-scale-x-100" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
19+
<path fill-rule="evenodd" d="M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z" clip-rule="evenodd" />
20+
</svg>
21+
</button>
22+
</div>
1323
<ul role="list" class="mt-1 space-y-1 hidden group-data-[open]:block">
1424
<% children.each do |j| %>
1525
<li data-item-id="<%= j.id %>">
1626
<%= link_to j.label(self), j.url(self), j.html_options.merge(class: "text-gray-600 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white block rounded-md py-1.5 px-2 text-sm no-underline #{(current_menu_item?(j) ? "bg-gray-100 dark:bg-white/5 text-gray-900 dark:text-white selected" : "")}") %>
1727
</li>
1828
<% end %>
1929
</ul>
20-
<% elsif url = item.url(self) %>
21-
<%= link_to item.label(self), url, item.html_options.merge(class: "text-gray-600 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white flex items-center w-full rounded-md p-2 gap-x-2 text-sm no-underline #{(current_menu_item?(item) ? "bg-gray-100 dark:bg-white/5 text-gray-900 dark:text-white selected" : "")}") %>
2230
<% else %>
23-
<%= item.label(self) %>
31+
<%= label %>
2432
<% end %>
2533
</li>
2634
<% end %>

‎features/step_definitions/menu_steps.rb

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
end
1313

1414
Then /^I should see a menu parent for "([^"]*)"$/ do |name|
15-
expect(page).to have_css "#main-menu li button", text: name
15+
expect(page).to have_css "#main-menu li a", text: name
1616
end
1717

1818
Then /^I should see a nested menu item for "([^"]*)"$/ do |name|

‎lib/active_admin/menu.rb

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -66,8 +66,8 @@ def include?(item)
6666
end
6767

6868
# Used in the UI to visually distinguish which menu item is selected.
69-
def current?(item)
70-
self == item || include?(item)
69+
def current?(item, children: true)
70+
self == item || (children ? include?(item) : false)
7171
end
7272

7373
# Returns sorted array of menu items that should be displayed in this context.

0 commit comments

Comments
 (0)
0