REV-12050 fetch correct actions while searching

src/Controllers/ThrustActionsController.php

@@ -60,6 +60,18 @@ public function perform($resourceName)
         return back()->withMessage($response);
     }
 
+    public function index($resourceName)
+    {
+        $resource = Thrust::make($resourceName);
+        if(request('search') && $resource::$searchResource) {
+            $resource = Thrust::make($resource::$searchResource);
+        }
+        return view('thrust::components.actionsIndex', [
+            'actions' => collect($resource->actions()),
+            'resourceName' => $resource->name(),
+        ]);
+    }
+
     private function findActionForResource($resourceName, $actionClass)
     {
         $resource   = Thrust::make($resourceName);

src/Controllers/ThrustController.php

@@ -26,6 +26,7 @@ public function index($resourceName)
         return view('thrust::index', [
             'resourceName' => $resourceName,
             'resource'     => $resource,
+            'actions'      => collect($resource->actions()),
             'searchable'   => count($resource::$search) > 0,
             'description'  => $resource->getDescription(),
         ]);

src/Controllers/ThrustHasManyController.php

@@ -21,6 +21,7 @@ public function index($resourceName, $id, $relationship)
             'resourceName'            => $hasManyField->resourceName,
             'searchable'              => count($resource::$search) > 0,
             'resource'                => $childResource,
+            'actions'                 => collect($childResource->actions()),
             'parent_id'               => $id,
             'isChild'                 => $resource instanceof ChildResource && $backHasManyURLParams,
             'hasManyBackUrlParams'    => $backHasManyURLParams,

src/resources/js/searcher.js

@@ -10,39 +10,46 @@
 (function($) {
     $.fn.searcher = function( callbackUrl , options ) {
 
-        let settings = $.extend({
+        const settings = $.extend({
             resultsDiv   : 'results',
             allDiv       : 'all',
             minChars     : 3,
             onFound      : null,
             updateAddressBar : true
-        }, options);
+        }, options)
 
-        let timeout = null;
+        let timeout = null
         this.on('keyup',function(){
-            clearTimeout(timeout);
-            let self = $(this);
+            clearTimeout(timeout)
+            const self = this
             timeout = setTimeout(function () {
-                let searchString = (self.val());
+                const searchString = self.value
 
                 if (searchString.length >= settings.minChars) {
                     if (settings.updateAddressBar) {
-                        window.history.pushState("", "", '?search=' + searchString);
+                        window.history.pushState("", "", '?search=' + searchString)
                     }
-                    $('#' + settings.resultsDiv).show();
-                    $('#' + settings.allDiv).hide();
-                    $('#' + settings.resultsDiv).load(callbackUrl + self.val().replace(new RegExp(' ', 'g'), '%20'), settings.onFound);
+                    document.getElementById(settings.resultsDiv).style.display = 'block'
+                    document.getElementById(settings.allDiv).style.display = 'none'
+                    fetch(callbackUrl + self.value.replace(new RegExp(' ', 'g'), '%20')).then(response => {
+                        response.text().then(html => {
+                            document.getElementById(settings.resultsDiv).innerHTML = html
+                        })
+                    })
+                    window.dispatchEvent(new Event('thrust.searchStarted'))
                 } else {
                     if (settings.updateAddressBar) {
-                        window.history.pushState("", "", "?");
+                        window.history.pushState("", "", "?")
                     }
-                    $('#' + settings.resultsDiv).hide();
-                    $('#' + settings.allDiv).show();
+
+                    document.getElementById(settings.resultsDiv).style.display = 'none'
+                    document.getElementById(settings.allDiv).style.display = 'block'
+                    window.dispatchEvent(new Event('thrust.searchEnded'))
                 }
-            }, 300);
-        });
+            }, 300)
+        })
     }
-}(jQuery));
+}(jQuery))
 
 function RVAjaxSelect2(url, options) {
     this.options = {
@@ -58,7 +65,7 @@ function RVAjaxSelect2(url, options) {
             data: function (params) {
                 return {
                     search: params.term
-                };
+                }
             },
             processResults: function (data) {
                 return {
@@ -72,8 +79,8 @@ function RVAjaxSelect2(url, options) {
                 }
             }
         }
-    };
-    $.extend(this.options, options);
+    }
+    $.extend(this.options, options)
 
     this.show = function(itemId) {
         return $(itemId).select2(this.options)

src/resources/views/components/actions.blade.php

@@ -1,30 +1,14 @@
-<?php
-$actions = collect($resource->actions());
-?>
-
 @if (count($actions) > 0)
     @if ($actions->where('main', false)->count() > 0)
         <div x-data = "{isOpen : false}">
             <button class="secondary relative" x-on:click="isOpen = !isOpen"> <i id='actions-loading' class="fa fa-circle-o-notch fa-spin fa-fw" style="display:none"></i> {{ __("thrust::messages.actions") }} @icon(caret-down) </button>
-            <div class="thrust-actions-dropdown absolute" x-show="isOpen" x-transition x-cloak x-on:click.away = "isOpen = false">
-                @foreach($actions->where('main', false) as $action)
-                    <div class="">
-                        @if (count($action->fields()) == 0)
-                            <a class='pointer' onclick='runAction("{{ $action->getClassForJs() }}", "{{$action->needsConfirmation}}", "{{$action->needsSelection}}", "{{$action->getConfirmationMessage()}}")'>
-                                {!! $action->getIcon() !!} {!! $action->getTitle() !!}
-                            </a>
-                        @else
-                            <a class='actionPopup' href="{{route('thrust.actions.create',[$resourceName])}}?action={{get_class($action)}}">
-                                {!! $action->getIcon() !!} {!! $action->getTitle() !!}
-                            </a>
-                        @endif
-                    </div>
-                @endforeach
+            <div id="thrust-resource-actions" class="thrust-actions-dropdown absolute" x-show="isOpen" x-transition x-cloak x-on:click.away = "isOpen = false">
+                @include('thrust::components.actionsIndex')
             </div>
         </div>
     @endif
 
     @foreach( $actions->where('main', true) as $action)
         <button class="secondary" onclick='runAction("{{ $action->getClassForJs() }}", "{{$action->needsConfirmation}}", "{{$action->needsSelection}}", "{{$action->getConfirmationMessage()}}")'> {!! icon($action->icon) !!} </button>
     @endforeach
-@endif
+@endif

src/resources/views/components/actionsIndex.blade.php

@@ -0,0 +1,13 @@
+@foreach($actions->where('main', false) as $action)
+    <div class="">
+        @if (count($action->fields()) == 0)
+            <a class='pointer' onclick='runAction("{{ $action->getClassForJs() }}", "{{$action->needsConfirmation}}", "{{$action->needsSelection}}", "{{$action->getConfirmationMessage()}}")'>
+                {!! $action->getIcon() !!} {!! $action->getTitle() !!}
+            </a>
+        @else
+            <a class='actionPopup' href="{{route('thrust.actions.create',[$resourceName])}}?action={{get_class($action)}}">
+                {!! $action->getIcon() !!} {!! $action->getTitle() !!}
+            </a>
+        @endif
+    </div>
+@endforeach

src/resources/views/components/js/actions.blade.php

@@ -1,22 +1,28 @@
 <script>
-    $(".actionPopup").on('click',function(e) {
-        e.preventDefault();
-        var selected = getSelectedRowsIds();
+    const onClickHandler = function(e) {
+        e.preventDefault()
+        var selected = getSelectedRowsIds()
         if (selected.length == 0){
-            return alert("{!! __("thrust::messages.noRowsSelected") !!}");
+            return alert("{!! __("thrust::messages.noRowsSelected") !!}")
         }
 
-        $(this).attr('href', $(this).attr('href') + "&ids=" + selected);
-        showPopup($(this).attr('href'));
-    });
+        this.setAttribute('href', this.getAttribute('href') + "&ids=" + selected)
+        showPopup(this.getAttribute('href'))
+    }
 
+    function registerActionPopupListeners() {
+        const elems = [...document.getElementsByClassName('actionPopup')]
+        elems.forEach(elem => {
+            elem.removeEventListener('click', onClickHandler)
+            elem.addEventListener('click', onClickHandler)
+        })
+    }
 
     function runAction(actionClass, needsConfirmation, needsSelection, confirmationMessage){
-        var selected = getSelectedRowsIds();
-        console.log(actionClass, selected, needsConfirmation, needsSelection);
+        var selected = getSelectedRowsIds()
 
         if (needsSelection == 1 && selected.length == 0){
-            return alert("{!! __("thrust::messages.noRowsSelected") !!}");
+            return alert("{!! __("thrust::messages.noRowsSelected") !!}")
         }
 
         if (! needsConfirmation || confirm(confirmationMessage)){
@@ -25,37 +31,58 @@ function runAction(actionClass, needsConfirmation, needsSelection, confirmationM
     }
 
     function doAction(actionClass, selected){
-        $('#actions-loading').show();
+        document.getElementById('actions-loading').style.display = 'block'
         $.post("{{ route('thrust.actions.perform', [$resourceName]) }}", {
             "_token": "{{ csrf_token() }}",
             "action" : actionClass,
             "ids" : selected
         }).done(function(data){
-            $('#actions-loading').hide();
-            console.log("Action finished");
-            //console.log(data);
+            document.getElementById('actions-loading').style.display = 'none'
             if (data["responseAsPopup"]){
-                $('#popup').popup('show');
-                $("#popupContent").html(data["message"]);
+                $('#popup').popup('show')
+                $("#popupContent").html(data["message"])
             } else {
-                showMessage(data["message"]);
+                showMessage(data["message"])
             }
             if (data["shouldReload"]) {
-                location.reload();
+                location.reload()
             }
         }).fail(function(){
-            console.log("Action failed");
-            showMessage("Something went wrong");
-        });
+            showMessage("Something went wrong")
+        })
     }
 
     function getSelectedRowsIds(){
-        return $("input[name^=selected]:checked").map(function() {
-            return $(this).attr("meta:id");
-        }).toArray();
+        return [...document.querySelectorAll('input[name^=selected]:checked')]
+            .map(elem => elem.getAttribute("meta:id"))
     }
 
     function toggleSelectAll(checkbox){
-        $("input[name^=selected]").prop('checked', checkbox.checked);
+        console.log([...document.querySelectorAll('input[name^=selected]')]);
+        [...document.querySelectorAll('input[name^=selected]')]
+            .forEach(elem => checkbox.checked
+                ? elem.checked = true
+                : elem.checked = false
+            )
     }
-</script>
+
+    registerActionPopupListeners()
+
+    window.addEventListener('thrust.searchStarted', () => {
+        fetch("{{ route('thrust.actions.index', ['resourceName' => $resourceName, 'search' => true]) }}").then(response => {
+            response.text().then(html => {
+                document.getElementById('thrust-resource-actions').innerHTML = html
+                registerActionPopupListeners()
+            })
+        })
+    })
+
+    window.addEventListener('thrust.searchEnded', () => {
+        fetch("{{ route('thrust.actions.index', ['resourceName' => $resourceName]) }}").then(response => {
+            response.text().then(html => {
+                document.getElementById('thrust-resource-actions').innerHTML = html
+                registerActionPopupListeners()
+            })
+        })
+    })
+</script>

src/routes.php

@@ -18,6 +18,7 @@
 Route::group(['prefix' => config('thrust.routePrefix', 'thrust'), 'namespace' => 'BadChoice\Thrust\Controllers', 'middleware' => config('thrust.routeMiddleware', ['web','auth'])], function () {
     Route::post('{resourceName}/actions', 'ThrustActionsController@perform')->name('thrust.actions.perform');
     Route::get('{resourceName}/actions', 'ThrustActionsController@create')->name('thrust.actions.create');
+    Route::get('{resourceName}/index/actions', 'ThrustActionsController@index')->name('thrust.actions.index');
 
     Route::post('{resourceName}/updateOrder', 'ThrustSortController@updateOrder')->name('thrust.updateOrder');
     Route::get('{resourceName}/{id}/toggle/{field}', 'ThrustActionsController@toggle')->name('thrust.toggle');