Built action list popover on top of popover

Author: mattvague

app/assets/stylesheets/active_admin/components/_popovers.css.scss

@@ -18,7 +18,6 @@
   box-shadow: rgba(0,0,0,0.3) 0 1px 5px;
   background-color: $primary-color;
   border-radius: 3px;
-  width: 120px;
 
   &::after {
     content: "";
@@ -57,8 +56,9 @@
         display: block;
         font-size: 0.9em;
         font-weight: bold;
-        padding: 6px 8px;
+        padding: 6px 15px;
         text-decoration: none;
+        text-align: center;
 
         &:hover {
           @include gradient(#75a1c2, #608cb4);

lib/active_admin/view_factory.rb

@@ -4,22 +4,23 @@ module ActiveAdmin
   class ViewFactory < AbstractViewFactory
 
     # Register Helper Renderers
-    register  :global_navigation  => ActiveAdmin::Views::TabbedNavigation,
-              :action_items       => ActiveAdmin::Views::ActionItems,
-              :header             => ActiveAdmin::Views::HeaderRenderer,
-              :dashboard_section  => ActiveAdmin::Views::DashboardSection,
-              :index_scopes       => ActiveAdmin::Views::Scopes,
-              :blank_slate        => ActiveAdmin::Views::BlankSlate,
-              :popover            => ActiveAdmin::Views::Popover
+    register  :global_navigation   => ActiveAdmin::Views::TabbedNavigation,
+              :action_items        => ActiveAdmin::Views::ActionItems,
+              :header              => ActiveAdmin::Views::HeaderRenderer,
+              :dashboard_section   => ActiveAdmin::Views::DashboardSection,
+              :index_scopes        => ActiveAdmin::Views::Scopes,
+              :blank_slate         => ActiveAdmin::Views::BlankSlate,
+              :popover             => ActiveAdmin::Views::Popover,
+              :action_list_popover => ActiveAdmin::Views::ActionListPopover
 
 
     # Register All The Pages
-    register  :dashboard_page     => ActiveAdmin::Views::Pages::Dashboard,
-              :index_page         => ActiveAdmin::Views::Pages::Index,
-              :show_page          => ActiveAdmin::Views::Pages::Show,
-              :new_page           => ActiveAdmin::Views::Pages::New,
-              :edit_page          => ActiveAdmin::Views::Pages::Edit,
-              :layout             => ActiveAdmin::Views::Pages::Layout
+    register  :dashboard_page      => ActiveAdmin::Views::Pages::Dashboard,
+              :index_page          => ActiveAdmin::Views::Pages::Index,
+              :show_page           => ActiveAdmin::Views::Pages::Show,
+              :new_page            => ActiveAdmin::Views::Pages::New,
+              :edit_page           => ActiveAdmin::Views::Pages::Edit,
+              :layout              => ActiveAdmin::Views::Pages::Layout
 
   end
 end

lib/active_admin/views/components/action_list_popover.rb

@@ -0,0 +1,28 @@
+require 'active_admin/views/components/popover'
+
+module ActiveAdmin
+  module Views
+    # Build an ActionListPopover
+    class ActionListPopover < ActiveAdmin::Views::Popover
+      builder_method :action_list_popover
+      
+      
+      def build(*args, &block)
+        @contents = ul :class => "popover_contents"
+
+        super(args)
+      end
+      
+      def action(title, url, *args)
+        options = args.extract_options!
+        
+        within @contents do
+          li do
+            text_node link_to(title, url, options)
+          end
+        end
+      end
+
+    end
+  end
+end

lib/active_admin/views/components/popover.rb

@@ -16,7 +16,7 @@ def build(*args, &block)
 
         self.id = options[:id]
 
-        @contents = div(:class => "popover_contents")
+        @contents ||= div(:class => "popover_contents")
 
       end
 

lib/active_admin/views/pages/index.rb

@@ -49,16 +49,15 @@ def build_download_format_links(formats = [:csv, :xml, :json])
         end
 
         def build_batch_action_popover
-          insert_tag view_factory.popover do
-            "Popover contents"
-          end
-
-          #
-          #view_factory.action_list_popover do
-          #  action "Delete Selected", "#"
-          #  action "Flag Selected", "#"
-          #  action "Export Selected", "#"
+          #insert_tag view_factory.popover do
+          #  "Popover contents"
           #end
+          
+          insert_tag view_factory.action_list_popover do
+            action "Delete Selected", "#"
+            action "Flag Selected", "#"
+            action "Export Selected", "#"
+          end
         end
 
         def build_scopes

spec/unit/view_factory_spec.rb

@@ -8,13 +8,14 @@ def it_should_have_view(key, value)
 
 describe ActiveAdmin::ViewFactory do
 
-  it_should_have_view :global_navigation, ActiveAdmin::Views::TabbedNavigation
-  it_should_have_view :action_items,      ActiveAdmin::Views::ActionItems
-  it_should_have_view :header,            ActiveAdmin::Views::HeaderRenderer
-  it_should_have_view :blank_slate,       ActiveAdmin::Views::BlankSlate
-  it_should_have_view :popover,           ActiveAdmin::Views::Popover
+  it_should_have_view :global_navigation,    ActiveAdmin::Views::TabbedNavigation
+  it_should_have_view :action_items,         ActiveAdmin::Views::ActionItems
+  it_should_have_view :header,               ActiveAdmin::Views::HeaderRenderer
+  it_should_have_view :blank_slate,          ActiveAdmin::Views::BlankSlate
+  it_should_have_view :popover,              ActiveAdmin::Views::Popover
+  it_should_have_view :action_list_popover,  ActiveAdmin::Views::ActionListPopover
 
-  it_should_have_view :dashboard_page,    ActiveAdmin::Views::Pages::Dashboard
-  it_should_have_view :layout,            ActiveAdmin::Views::Pages::Layout
+  it_should_have_view :dashboard_page,       ActiveAdmin::Views::Pages::Dashboard
+  it_should_have_view :layout,               ActiveAdmin::Views::Pages::Layout
 
 end

spec/unit/views/components/action_list_popover_spec.rb

@@ -0,0 +1,28 @@
+require 'spec_helper'
+
+describe ActiveAdmin::Views::ActionListPopover do
+
+  setup_arbre_context!
+
+  let(:the_popover) do
+    action_list_popover :id => "my_awesome_action_list_popover" do
+      action "Action 1", "#"
+      action "Action 2", "#"
+      action "Action 3", "#"
+    end
+  end
+  
+  describe "the action list" do
+    subject do
+      the_popover.find_by_class("popover_contents").first
+    end
+
+    its(:tag_name) { should eql("ul") }
+    
+    its(:content){ should include("<li><a href=\"#\">Action 1</a></li>") }
+    its(:content){ should include("<li><a href=\"#\">Action 2</a></li>") }
+    its(:content){ should include("<li><a href=\"#\">Action 3</a></li>") }
+    
+  end
+
+end