Button loading re-factoring..

resources/views/components/modules/items.blade.php

@@ -30,12 +30,16 @@
 
         @if ($seeMore)
             <div class="flex items-center mt-10">
-                <button type="button" id="button-pre-load" @click="onloadMore"
+                <button
+                    type="button"
+                    id="button-pre-load"
+                    @click="onloadMore"
                     :disabled="loadMoreLoading"
                     class="w-48 m-auto relative flex items-center justify-center bg-green hover:bg-green-700 text-white px-6 py-1.5 text-base rounded-lg disabled:bg-green-100 js-learn-more js-button-modal-submit"
                 >
-                    <span>{{ trans('modules.see_more') }}</span>
-                    <x-button.loading v-if="loadMoreLoading" text="{{ trans('modules.see_more') }}" text-hide="[{'opacity-0': loadMoreLoading}]" />
+                    <x-button.loading action="loadMoreLoading">
+                        {{ trans('modules.see_more') }}
+                    </x-button.loading>
                 </button>
 
                 <x-form.input.hidden name="see_more_path" value="{{ route('apps.load-more', ['type' => $type]) }}" />