group components on manage subscriptions page

app/Http/Controllers/SubscribeController.php

@@ -18,6 +18,7 @@
 use CachetHQ\Cachet\Bus\Commands\Subscriber\UpdateSubscriberSubscriptionCommand;
 use CachetHQ\Cachet\Bus\Commands\Subscriber\VerifySubscriberCommand;
 use CachetHQ\Cachet\Models\Component;
+use CachetHQ\Cachet\Models\ComponentGroup;
 use CachetHQ\Cachet\Models\Subscriber;
 use CachetHQ\Cachet\Models\Subscription;
 use GrahamCampbell\Binput\Facades\Binput;
@@ -147,15 +148,19 @@ public function showManage($code = null)
         }
 
         $subscriber = Subscriber::where('verify_code', '=', $code)->first();
+        $usedComponentGroups = Component::enabled()->where('group_id', '>', 0)->groupBy('group_id')->pluck('group_id');
+        $componentGroups = ComponentGroup::whereIn('id', $usedComponentGroups)->orderBy('order')->get();
+        $ungroupedComponents = Component::enabled()->where('group_id', 0)->orderBy('order')->orderBy('created_at')->get();
 
         if (!$subscriber) {
             throw new BadRequestHttpException();
         }
 
         return View::make('subscribe.manage')
-            ->withComponents(Component::all())
+            ->withUngroupedComponents($ungroupedComponents)
             ->withSubscriber($subscriber)
-            ->withSubscriptions($subscriber->subscriptions->pluck('component_id')->all());
+            ->withSubscriptions($subscriber->subscriptions->pluck('component_id')->all())
+            ->withComponentGroups($componentGroups);
     }
 
     /**

app/Presenters/ComponentGroupPresenter.php

@@ -97,4 +97,27 @@ public function toArray()
             'lowest_human_status' => $this->lowest_human_status(),
         ]);
     }
+
+    /**
+     * Determine if any of the contained components have active subscriptions.
+     *
+     * @return bool
+     */
+    public function has_subscriber($subscriptions)
+    {
+        $enabled_components = $this->wrappedObject->enabled_components()->orderBy('order')->pluck('id')->toArray();
+        $intersected = array_intersect($enabled_components, $subscriptions);
+
+        return count($intersected) != 0;
+    }
+
+    /**
+     * Determine the class for collapsed/uncollapsed groups on the subscription form.
+     *
+     * @return string
+     */
+    public function collapse_class_with_subscriptions($subscriptions)
+    {
+        return $this->has_subscriber($subscriptions) ? 'ion-ios-minus-outline' : 'ion-ios-plus-outline';
+    }
 }

resources/assets/js/app.js

@@ -277,6 +277,24 @@ $(function() {
         $this.next('.group-items').toggleClass('hide');
     });
 
+    $('.select-group').on('click', function () {
+        var $parentGroup = $(this).closest('ul.list-group');
+        $parentGroup.find('input[type=checkbox]').prop('checked', true);
+        $parentGroup.find('.group-items').removeClass('hide')
+        $parentGroup.find('.group-toggle').addClass('ion-ios-minus-outline').removeClass('ion-ios-plus-outline');
+        event.stopPropagation();
+        return false;
+    });
+
+    $('.deselect-group').on('click', function () {
+        var $parentGroup = $(this).closest('ul.list-group');
+        $parentGroup.find('input[type=checkbox]').prop('checked', false);
+        $parentGroup.find('.group-items').addClass('hide');
+        $parentGroup.find('.group-toggle').removeClass('ion-ios-minus-outline').addClass('ion-ios-plus-outline');
+        event.stopPropagation();
+        return false;
+    });
+
     // Setup wizard
     $('.wizard-next').on('click', function () {
         var $form   = $('#setup-form'),

resources/views/partials/component_input.blade.php

@@ -0,0 +1,17 @@
+<li class="list-group-item {{ $component->group_id ? "sub-component" : "component" }}">
+    <div class="checkbox">
+        <label for="component-{{ $component->id }}">
+            <input type="checkbox"
+                     id="component-{{ $component->id }}"
+                   name="subscriptions[]"
+                  value="{{ $component->id }}"
+            @if (in_array($component->id, $subscriptions) || $subscriber->global)
+                checked="checked"
+            @endif />
+          {{ $component->name }}
+      </label>
+  </div>
+  @if($component->description)
+    <i class="ion ion-ios-help-outline help-icon" data-toggle="tooltip" data-title="{{ $component->description }}" data-container="body"></i>
+  @endif
+</li>

resources/views/partials/components_form.blade.php

@@ -0,0 +1,33 @@
+@if($component_groups->count() > 0)
+    @foreach($component_groups as $componentGroup)
+        <ul class="list-group components">
+            @if($componentGroup->enabled_components->count() > 0)
+                <li class="list-group-item group-name">
+                    <i class="{{ $componentGroup->collapse_class_with_subscriptions($subscriptions) }} group-toggle"></i>
+                    <strong>{{ $componentGroup->name }}</strong>
+                    <div class="pull-right text-muted small">
+                        <a href="#" class="select-group" id="select-all-{{$componentGroup->id}}">Select All</a>
+                        &nbsp;|&nbsp;
+                        <a href="#" class="deselect-group" id="deselect-all-{{$componentGroup->id}}">Deselect All</a>
+                    </div>
+                </li>
+                <div class="form-group group-items {{ $componentGroup->has_subscriber($subscriptions) ? null : "hide" }}">
+                    @foreach($componentGroup->enabled_components()->orderBy('order')->get() as $component)
+                    @include('partials.component_input', compact($component))
+                    @endforeach
+                </div>
+            @endif
+        </ul>
+    @endforeach
+@endif
+
+@if($ungrouped_components->count() > 0)
+    <ul class="list-group components">
+        <li class="list-group-item group-name">
+            <strong>{{ trans('cachet.components.group.other') }}</strong>
+        </li>
+        @foreach($ungrouped_components as $component)
+        @include('partials.component_input', compact($component))
+        @endforeach
+    </ul>
+@endif

resources/views/subscribe/manage.blade.php

@@ -1,6 +1,7 @@
 @extends('layout.master')
 
 @section('content')
+
 <div class="pull-right">
     <p><a class="btn btn-success btn-outline" href="/"><i class="ion ion-home"></i></a></p>
 </div>
@@ -17,43 +18,24 @@
                 Manage notifications for {{ $subscriber->email }}
             </p>
         </div>
-        @if($components->count() > 0)
         <form action="{{ route('subscribe.manage', $subscriber->verify_code) }}" method="post">
             <input type="hidden" name="_token" value="{{ csrf_token() }}">
             <div class="panel panel-default">
                 <div class="panel-heading">
                     {{ trans('cachet.subscriber.manage.my_subscriptions') }}
                 </div>
-                <div class="list-group">
-                    @foreach($components as $component)
-                    <div class="list-group-item">
-                        <div class="checkbox">
-                            <label for="component-{{ $component->id }}">
-                                <input type="checkbox"
-                                    id="component-{{ $component->id }}"
-                                    name="subscriptions[]"
-                                    value="{{ $component->id }}"
-                                    @if (in_array($component->id, $subscriptions) || $subscriber->global)
-                                        checked="checked"
-                                    @endif>
-                                    {{ $component->name }}
-                            </label>
-                        </div>
-                    </div>
-                    @endforeach
+                <div class="panel-body">
+                    @if(!$component_groups->isEmpty() || !$ungrouped_components->isEmpty())
+                    @include('partials.components_form')
+                    @else
+                        <p>{{ trans('cachet.subscriber.manage.no_subscriptions') }}</p>
+                    @endif
                 </div>
             </div>
             <div class="text-right">
                 <button type="submit" class="btn btn-success">Update Subscription</button>
             </div>
         </form>
-        @else
-        <div class="panel panel-default">
-            <div class="panel-body">
-                <p>{{ trans('cachet.subscriber.manage.no_subscriptions') }}</p>
-            </div>
-        </div>
-        @endif
     </div>
 </div>
 @stop