From 9dffcf849dfb401b0351029096f0a09444fb2394 Mon Sep 17 00:00:00 2001
From: Burak Civan <burakcivan22@gmail.com>
Date: Fri, 10 Jun 2022 09:46:23 +0300
Subject: [PATCH 1/7] button loading action return to view component

---
 public/css/app.css                             |  4 ++++
 resources/views/auth/forgot/create.blade.php   |  3 +--
 resources/views/auth/login/create.blade.php    |  5 +----
 resources/views/auth/reset/create.blade.php    |  3 +--
 .../banking/reconciliations/create.blade.php   | 18 +++---------------
 .../banking/reconciliations/edit.blade.php     | 17 +++--------------
 .../views/banking/transfers/show.blade.php     |  3 +--
 resources/views/common/import/create.blade.php |  5 +----
 .../views/components/button-loading.blade.php  |  9 +++++++++
 .../views/components/form/buttons.blade.php    |  5 +----
 .../layouts/modules/show/releases.blade.php    |  5 +----
 .../layouts/modules/show/reviews.blade.php     |  5 +----
 .../views/components/modules/items.blade.php   |  5 +----
 13 files changed, 28 insertions(+), 59 deletions(-)
 create mode 100644 resources/views/components/button-loading.blade.php

diff --git a/public/css/app.css b/public/css/app.css
index d27e36a75..2e5ef5f0d 100644
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -48223,6 +48223,10 @@ body{
     grid-template-columns: repeat(4, minmax(0, 1fr));
   }
 
+  .sm\:grid-cols-2{
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+
   .sm\:grid-cols-3{
     grid-template-columns: repeat(3, minmax(0, 1fr));
   }
diff --git a/resources/views/auth/forgot/create.blade.php b/resources/views/auth/forgot/create.blade.php
index 81b457120..f02a5cea8 100644
--- a/resources/views/auth/forgot/create.blade.php
+++ b/resources/views/auth/forgot/create.blade.php
@@ -41,8 +41,7 @@
                     override="class"
                     data-loading-text="{{ trans('general.loading') }}"
                 >
-                    <i v-if="form.loading" class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"></i>
-                    <span :class="[{'opacity-0': form.loading}]">{{ trans('general.send') }}</span>
+                    <x-button-loading v-if="form.loading" text="{{ trans('general.send') }}" text-hide="[{'opacity-0': form.loading}]" />
                 </x-button>
             </div>
         </x-form>
diff --git a/resources/views/auth/login/create.blade.php b/resources/views/auth/login/create.blade.php
index ccaf72d3f..aaba5ef84 100644
--- a/resources/views/auth/login/create.blade.php
+++ b/resources/views/auth/login/create.blade.php
@@ -70,10 +70,7 @@
                     override="class"
                     data-loading-text="{{ trans('general.loading') }}"
                 >
-                    <i v-if="form.loading" class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"></i> 
-                    <span :class="[{'opacity-0': form.loading}]">
-                        {{ trans('auth.login') }}
-                    </span>
+                    <x-button-loading v-if="form.loading" text="{{ trans('auth.login') }}" text-hide="[{'opacity-0': form.loading}]" />
                 </x-button>
             </div>
         </x-form>
diff --git a/resources/views/auth/reset/create.blade.php b/resources/views/auth/reset/create.blade.php
index f8f32091e..8ad7867af 100644
--- a/resources/views/auth/reset/create.blade.php
+++ b/resources/views/auth/reset/create.blade.php
@@ -58,8 +58,7 @@
                     override="class"
                     data-loading-text="{{ trans('general.loading') }}"
                 >
-                <i v-if="form.loading" class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"></i>
-                <span :class="[{'opacity-0': form.loading}]">{{ trans('auth.reset') }}</span>
+                    <x-button-loading v-if="form.loading" text="{{ trans('auth.reset') }}" text-hide="[{'opacity-0': form.loading}]" />
                 </x-button>
             </div>
         </x-form>
diff --git a/resources/views/banking/reconciliations/create.blade.php b/resources/views/banking/reconciliations/create.blade.php
index 36b00756a..9e6fe558c 100644
--- a/resources/views/banking/reconciliations/create.blade.php
+++ b/resources/views/banking/reconciliations/create.blade.php
@@ -264,8 +264,7 @@
                                     class="flex items-center justify-center bg-transparent hover:bg-gray-200 px-3 py-1.5 text-base rounded-lg disabled:opacity-50"
                                     override="class"
                                 >
-                                    <i v-if="form.loading" class="material-icons animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"></i>
-                                    <span :class="[{'ml-0': form.loading}]">{{ trans('reconciliations.save_draft') }}</span>
+                                    <x-button-loading v-if="form.loading" text="{{ trans('reconciliations.save_draft') }}" text-hide="[{'opacity-0': form.loading}]" />
                                 </x-button>
     
                                 <div v-if="reconcile">
@@ -278,13 +277,7 @@
                                           @click="onReconcileSubmit"
                                           data-loading-text="{{ trans('general.loading') }}"
                                         >
-                                          <i 
-                                            v-if="form.loading"
-                                            class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"
-                                          >
-                                          </i>
-
-                                          <span :class="[{'opacity-1': reconcile}]">{{ trans('reconciliations.reconcile') }}</span>
+                                            <x-button-loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
                                         </x-button>
                                     </x-tooltip>
                                 </div>
@@ -297,12 +290,7 @@
                                       @click="onReconcileSubmit"
                                       data-loading-text="{{ trans('general.loading') }}"
                                     >
-                                    <i 
-                                      v-if="form.loading"
-                                      class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"
-                                    >
-                                    </i>
-                                    <span :class="[{'opacity-1': reconcile}]">{{ trans('reconciliations.reconcile') }}</span>
+                                        <x-button-loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
                                     </x-button>
                                 </div>
                             </div>
diff --git a/resources/views/banking/reconciliations/edit.blade.php b/resources/views/banking/reconciliations/edit.blade.php
index 3324ded68..6d4b49ed4 100644
--- a/resources/views/banking/reconciliations/edit.blade.php
+++ b/resources/views/banking/reconciliations/edit.blade.php
@@ -203,8 +203,7 @@
                                 class="relative flex items-center justify-center bg-transparent hover:bg-gray-200 px-3 py-1.5 text-base rounded-lg disabled:opacity-50"
                                 override="class"
                             >
-                                <i v-if="form.loading" class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"></i>
-                                <span :class="[{'ml-0': form.loading}]">{{ trans('general.save') }}</span>
+                                <x-button-loading v-if="form.loading" text="{{ trans('general.save') }}" text-hide="[{'opacity-1': reconcile}]" />
                             </x-button>
                             <div v-if="reconcile">
                                 <x-tooltip id="tooltip-reconcile" placement="top" message="{{ trans('reconciliations.irreconcilable') }}">
@@ -217,12 +216,7 @@
                                         data-loading-text="{{ trans('general.loading') }}"
                                     >
 
-                                    <i 
-                                        v-if="form.loading"
-                                        class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"
-                                    >
-                                    </i>
-                                    <span :class="[{'opacity-1': reconcile}]">{{ trans('reconciliations.reconcile') }}</span>
+                                        <x-button-loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
                                     </x-button>
                                 </x-tooltip>
                             </div>
@@ -236,12 +230,7 @@
                                     data-loading-text="{{ trans('general.loading') }}"
                                 >
 
-                                    <i 
-                                        v-if="form.loading"
-                                        class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"
-                                    >
-                                    </i>
-                                    <span :class="[{'opacity-1': reconcile}]">{{ trans('reconciliations.reconcile') }}</span>
+                                    <x-button-loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
                                 </x-button>
                             </div>
                         </div>
diff --git a/resources/views/banking/transfers/show.blade.php b/resources/views/banking/transfers/show.blade.php
index dceea98e5..3feb71825 100644
--- a/resources/views/banking/transfers/show.blade.php
+++ b/resources/views/banking/transfers/show.blade.php
@@ -41,8 +41,7 @@
                     </button>
 
                     <button :disabled="form.loading"  type="button" class="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" @click="addTemplate">
-                        <i v-if="form.loading" class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"></i>
-                        <span :class="[{'opacity-0': form.loading}]">{{ trans('general.confirm') }}</span>
+                        <x-button-loading v-if="form.loading" text="{{ trans('general.confirm') }}" text-hide="[{'opacity-0': form.loading}]" />
                     </button>
                 </div>
             </template>
diff --git a/resources/views/common/import/create.blade.php b/resources/views/common/import/create.blade.php
index 0a1107206..42e18dcea 100644
--- a/resources/views/common/import/create.blade.php
+++ b/resources/views/common/import/create.blade.php
@@ -47,10 +47,7 @@
                             ::disabled="form.loading"
                             override="class"
                         >
-                            <i v-if="form.loading" class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"></i>
-                            <span :class="[{'opacity-0': form.loading}]">
-                                {{ trans('import.import') }}
-                            </span>
+                            <x-button-loading v-if="form.loading" text="{{ trans('import.import') }}" text-hide="[{'opacity-0': form.loading}]" />
                         </x-button>
                     </div>
                 </div>
diff --git a/resources/views/components/button-loading.blade.php b/resources/views/components/button-loading.blade.php
new file mode 100644
index 000000000..6eaab8fc7
--- /dev/null
+++ b/resources/views/components/button-loading.blade.php
@@ -0,0 +1,9 @@
+<i
+  {{ $attributes }}
+  class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"
+>
+</i>
+
+<span :class="{{ $textHide }}">
+  {!! $text !!}
+</span> 
\ No newline at end of file
diff --git a/resources/views/components/form/buttons.blade.php b/resources/views/components/form/buttons.blade.php
index efa84f1a8..793311cd3 100644
--- a/resources/views/components/form/buttons.blade.php
+++ b/resources/views/components/form/buttons.blade.php
@@ -17,10 +17,7 @@
             ::disabled="form.loading"
             override="class"
         >
-            <i v-if="form.loading" class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:-left-3.5 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:-right-3.5 after:rounded-full after:animate-submit after:delay-[0.42s]"></i>
-            <span :class="[{'opacity-0': form.loading}]">
-                {{ trans('general.save') }}
-            </span>
+            <x-button-loading v-if="form.loading" text="{{ trans('general.save') }}" text-hide="[{'opacity-0': form.loading}]" />
         </x-button>
     </div>
 @stack('save_buttons_end')
diff --git a/resources/views/components/layouts/modules/show/releases.blade.php b/resources/views/components/layouts/modules/show/releases.blade.php
index 287b1c05e..2e1b0ec3b 100644
--- a/resources/views/components/layouts/modules/show/releases.blade.php
+++ b/resources/views/components/layouts/modules/show/releases.blade.php
@@ -21,10 +21,7 @@
             @click="onModuleLoadMore('releases')"
             class="w-48 bg-green m-auto block whitespace-nowrap px-4 py-2 border border-transparent rounded-md shadow-sm text-base font-medium text-white text-center js-learn-more js-button-modal-submit hover:bg-green-700 disabled:bg-green-300"
         >
-            <i v-if="loadMoreLoading" class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"></i>
-            <span :class="[{'opacity-0': loadMoreLoading}]">
-                {{ trans('modules.see_more') }}
-            </span>
+            <x-button-loading v-if="loadMoreLoading" text="{{ trans('modules.see_more') }}" text-hide="[{'opacity-0': loadMoreLoading}]" />
         </button>
     </div>
 
diff --git a/resources/views/components/layouts/modules/show/reviews.blade.php b/resources/views/components/layouts/modules/show/reviews.blade.php
index 79eac6ca5..55e8e20c7 100644
--- a/resources/views/components/layouts/modules/show/reviews.blade.php
+++ b/resources/views/components/layouts/modules/show/reviews.blade.php
@@ -21,10 +21,7 @@
             @click="onModuleLoadMore('reviews')"
             class="w-48 bg-green m-auto block whitespace-nowrap px-4 py-2 border border-transparent rounded-md shadow-sm text-base font-medium text-white text-center js-learn-more js-button-modal-submit hover:bg-green-700 disabled:bg-green-300"
         >
-            <i v-if="loadMoreLoading" class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"></i>
-            <span :class="[{'opacity-0': loadMoreLoading}]">
-                {{ trans('modules.see_more') }}
-            </span>
+            <x-button-loading v-if="loadMoreLoading" text="{{ trans('modules.see_more') }}" text-hide="[{'opacity-0': loadMoreLoading}]" />
         </button>
     </div>
 
diff --git a/resources/views/components/modules/items.blade.php b/resources/views/components/modules/items.blade.php
index 94f07fbbb..496a5eb1f 100644
--- a/resources/views/components/modules/items.blade.php
+++ b/resources/views/components/modules/items.blade.php
@@ -34,10 +34,7 @@
                     :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"
                 >
-                    <i v-if="loadMoreLoading" class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"></i>
-                    <span :class="[{'opacity-0': loadMoreLoading}]">
-                        {{ trans('modules.see_more') }}
-                    </span>
+                    <x-button-loading v-if="loadMoreLoading" text="{{ trans('modules.see_more') }}" text-hide="[{'opacity-0': loadMoreLoading}]" />
                 </button>
 
                 <x-form.input.hidden name="see_more_path" value="{{ route('apps.load-more', ['type' => $type]) }}" />

From eff1c5e8168c1442b23762f3c954b79c7f084b30 Mon Sep 17 00:00:00 2001
From: Burak Civan <burakcivan22@gmail.com>
Date: Tue, 14 Jun 2022 10:59:16 +0300
Subject: [PATCH 2/7] code refactoring

---
 resources/views/auth/forgot/create.blade.php                | 2 +-
 resources/views/auth/login/create.blade.php                 | 2 +-
 resources/views/auth/reset/create.blade.php                 | 2 +-
 resources/views/banking/reconciliations/create.blade.php    | 6 +++---
 resources/views/banking/reconciliations/edit.blade.php      | 6 +++---
 resources/views/banking/transfers/show.blade.php            | 2 +-
 resources/views/common/import/create.blade.php              | 2 +-
 .../{button-loading.blade.php => button/loading.blade.php}  | 0
 resources/views/components/form/buttons.blade.php           | 2 +-
 .../components/layouts/modules/show/releases.blade.php      | 2 +-
 .../views/components/layouts/modules/show/reviews.blade.php | 2 +-
 resources/views/components/modules/items.blade.php          | 2 +-
 12 files changed, 15 insertions(+), 15 deletions(-)
 rename resources/views/components/{button-loading.blade.php => button/loading.blade.php} (100%)

diff --git a/resources/views/auth/forgot/create.blade.php b/resources/views/auth/forgot/create.blade.php
index f02a5cea8..8fe07c8ea 100644
--- a/resources/views/auth/forgot/create.blade.php
+++ b/resources/views/auth/forgot/create.blade.php
@@ -41,7 +41,7 @@
                     override="class"
                     data-loading-text="{{ trans('general.loading') }}"
                 >
-                    <x-button-loading v-if="form.loading" text="{{ trans('general.send') }}" text-hide="[{'opacity-0': form.loading}]" />
+                    <x-button.loading v-if="form.loading" text="{{ trans('general.send') }}" text-hide="[{'opacity-0': form.loading}]" />
                 </x-button>
             </div>
         </x-form>
diff --git a/resources/views/auth/login/create.blade.php b/resources/views/auth/login/create.blade.php
index aaba5ef84..b62665bc9 100644
--- a/resources/views/auth/login/create.blade.php
+++ b/resources/views/auth/login/create.blade.php
@@ -70,7 +70,7 @@
                     override="class"
                     data-loading-text="{{ trans('general.loading') }}"
                 >
-                    <x-button-loading v-if="form.loading" text="{{ trans('auth.login') }}" text-hide="[{'opacity-0': form.loading}]" />
+                    <x-button.loading v-if="form.loading" text="{{ trans('auth.login') }}" text-hide="[{'opacity-0': form.loading}]" />
                 </x-button>
             </div>
         </x-form>
diff --git a/resources/views/auth/reset/create.blade.php b/resources/views/auth/reset/create.blade.php
index 8ad7867af..766138570 100644
--- a/resources/views/auth/reset/create.blade.php
+++ b/resources/views/auth/reset/create.blade.php
@@ -58,7 +58,7 @@
                     override="class"
                     data-loading-text="{{ trans('general.loading') }}"
                 >
-                    <x-button-loading v-if="form.loading" text="{{ trans('auth.reset') }}" text-hide="[{'opacity-0': form.loading}]" />
+                    <x-button.loading v-if="form.loading" text="{{ trans('auth.reset') }}" text-hide="[{'opacity-0': form.loading}]" />
                 </x-button>
             </div>
         </x-form>
diff --git a/resources/views/banking/reconciliations/create.blade.php b/resources/views/banking/reconciliations/create.blade.php
index 9e6fe558c..d3b6bbd64 100644
--- a/resources/views/banking/reconciliations/create.blade.php
+++ b/resources/views/banking/reconciliations/create.blade.php
@@ -264,7 +264,7 @@
                                     class="flex items-center justify-center bg-transparent hover:bg-gray-200 px-3 py-1.5 text-base rounded-lg disabled:opacity-50"
                                     override="class"
                                 >
-                                    <x-button-loading v-if="form.loading" text="{{ trans('reconciliations.save_draft') }}" text-hide="[{'opacity-0': form.loading}]" />
+                                    <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.save_draft') }}" text-hide="[{'opacity-0': form.loading}]" />
                                 </x-button>
     
                                 <div v-if="reconcile">
@@ -277,7 +277,7 @@
                                           @click="onReconcileSubmit"
                                           data-loading-text="{{ trans('general.loading') }}"
                                         >
-                                            <x-button-loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
+                                            <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
                                         </x-button>
                                     </x-tooltip>
                                 </div>
@@ -290,7 +290,7 @@
                                       @click="onReconcileSubmit"
                                       data-loading-text="{{ trans('general.loading') }}"
                                     >
-                                        <x-button-loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
+                                        <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
                                     </x-button>
                                 </div>
                             </div>
diff --git a/resources/views/banking/reconciliations/edit.blade.php b/resources/views/banking/reconciliations/edit.blade.php
index 6d4b49ed4..d17e496d0 100644
--- a/resources/views/banking/reconciliations/edit.blade.php
+++ b/resources/views/banking/reconciliations/edit.blade.php
@@ -203,7 +203,7 @@
                                 class="relative flex items-center justify-center bg-transparent hover:bg-gray-200 px-3 py-1.5 text-base rounded-lg disabled:opacity-50"
                                 override="class"
                             >
-                                <x-button-loading v-if="form.loading" text="{{ trans('general.save') }}" text-hide="[{'opacity-1': reconcile}]" />
+                                <x-button.loading v-if="form.loading" text="{{ trans('general.save') }}" text-hide="[{'opacity-1': reconcile}]" />
                             </x-button>
                             <div v-if="reconcile">
                                 <x-tooltip id="tooltip-reconcile" placement="top" message="{{ trans('reconciliations.irreconcilable') }}">
@@ -216,7 +216,7 @@
                                         data-loading-text="{{ trans('general.loading') }}"
                                     >
 
-                                        <x-button-loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
+                                        <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
                                     </x-button>
                                 </x-tooltip>
                             </div>
@@ -230,7 +230,7 @@
                                     data-loading-text="{{ trans('general.loading') }}"
                                 >
 
-                                    <x-button-loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
+                                    <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
                                 </x-button>
                             </div>
                         </div>
diff --git a/resources/views/banking/transfers/show.blade.php b/resources/views/banking/transfers/show.blade.php
index 3feb71825..dab688a27 100644
--- a/resources/views/banking/transfers/show.blade.php
+++ b/resources/views/banking/transfers/show.blade.php
@@ -41,7 +41,7 @@
                     </button>
 
                     <button :disabled="form.loading"  type="button" class="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" @click="addTemplate">
-                        <x-button-loading v-if="form.loading" text="{{ trans('general.confirm') }}" text-hide="[{'opacity-0': form.loading}]" />
+                        <x-button.loading v-if="form.loading" text="{{ trans('general.confirm') }}" text-hide="[{'opacity-0': form.loading}]" />
                     </button>
                 </div>
             </template>
diff --git a/resources/views/common/import/create.blade.php b/resources/views/common/import/create.blade.php
index 42e18dcea..a62998008 100644
--- a/resources/views/common/import/create.blade.php
+++ b/resources/views/common/import/create.blade.php
@@ -47,7 +47,7 @@
                             ::disabled="form.loading"
                             override="class"
                         >
-                            <x-button-loading v-if="form.loading" text="{{ trans('import.import') }}" text-hide="[{'opacity-0': form.loading}]" />
+                            <x-button.loading v-if="form.loading" text="{{ trans('import.import') }}" text-hide="[{'opacity-0': form.loading}]" />
                         </x-button>
                     </div>
                 </div>
diff --git a/resources/views/components/button-loading.blade.php b/resources/views/components/button/loading.blade.php
similarity index 100%
rename from resources/views/components/button-loading.blade.php
rename to resources/views/components/button/loading.blade.php
diff --git a/resources/views/components/form/buttons.blade.php b/resources/views/components/form/buttons.blade.php
index 793311cd3..5dbb47e50 100644
--- a/resources/views/components/form/buttons.blade.php
+++ b/resources/views/components/form/buttons.blade.php
@@ -17,7 +17,7 @@
             ::disabled="form.loading"
             override="class"
         >
-            <x-button-loading v-if="form.loading" text="{{ trans('general.save') }}" text-hide="[{'opacity-0': form.loading}]" />
+            <x-button.loading v-if="form.loading" text="{{ trans('general.save') }}" text-hide="[{'opacity-0': form.loading}]" />
         </x-button>
     </div>
 @stack('save_buttons_end')
diff --git a/resources/views/components/layouts/modules/show/releases.blade.php b/resources/views/components/layouts/modules/show/releases.blade.php
index 2e1b0ec3b..91f0bd197 100644
--- a/resources/views/components/layouts/modules/show/releases.blade.php
+++ b/resources/views/components/layouts/modules/show/releases.blade.php
@@ -21,7 +21,7 @@
             @click="onModuleLoadMore('releases')"
             class="w-48 bg-green m-auto block whitespace-nowrap px-4 py-2 border border-transparent rounded-md shadow-sm text-base font-medium text-white text-center js-learn-more js-button-modal-submit hover:bg-green-700 disabled:bg-green-300"
         >
-            <x-button-loading v-if="loadMoreLoading" text="{{ trans('modules.see_more') }}" text-hide="[{'opacity-0': loadMoreLoading}]" />
+            <x-button.loading v-if="loadMoreLoading" text="{{ trans('modules.see_more') }}" text-hide="[{'opacity-0': loadMoreLoading}]" />
         </button>
     </div>
 
diff --git a/resources/views/components/layouts/modules/show/reviews.blade.php b/resources/views/components/layouts/modules/show/reviews.blade.php
index 55e8e20c7..e57f2612d 100644
--- a/resources/views/components/layouts/modules/show/reviews.blade.php
+++ b/resources/views/components/layouts/modules/show/reviews.blade.php
@@ -21,7 +21,7 @@
             @click="onModuleLoadMore('reviews')"
             class="w-48 bg-green m-auto block whitespace-nowrap px-4 py-2 border border-transparent rounded-md shadow-sm text-base font-medium text-white text-center js-learn-more js-button-modal-submit hover:bg-green-700 disabled:bg-green-300"
         >
-            <x-button-loading v-if="loadMoreLoading" text="{{ trans('modules.see_more') }}" text-hide="[{'opacity-0': loadMoreLoading}]" />
+            <x-button.loading v-if="loadMoreLoading" text="{{ trans('modules.see_more') }}" text-hide="[{'opacity-0': loadMoreLoading}]" />
         </button>
     </div>
 
diff --git a/resources/views/components/modules/items.blade.php b/resources/views/components/modules/items.blade.php
index 496a5eb1f..45ec6b9cd 100644
--- a/resources/views/components/modules/items.blade.php
+++ b/resources/views/components/modules/items.blade.php
@@ -34,7 +34,7 @@
                     :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"
                 >
-                    <x-button-loading v-if="loadMoreLoading" text="{{ trans('modules.see_more') }}" text-hide="[{'opacity-0': loadMoreLoading}]" />
+                    <x-button.loading v-if="loadMoreLoading" text="{{ trans('modules.see_more') }}" text-hide="[{'opacity-0': loadMoreLoading}]" />
                 </button>
 
                 <x-form.input.hidden name="see_more_path" value="{{ route('apps.load-more', ['type' => $type]) }}" />

From 7ac568ece162c71a6feb149c4b4947b91e5d98b0 Mon Sep 17 00:00:00 2001
From: Burak Civan <burakcivan22@gmail.com>
Date: Tue, 14 Jun 2022 11:06:16 +0300
Subject: [PATCH 3/7] code refactoring

---
 resources/views/auth/forgot/create.blade.php                | 1 +
 resources/views/auth/login/create.blade.php                 | 1 +
 resources/views/auth/reset/create.blade.php                 | 1 +
 resources/views/banking/reconciliations/create.blade.php    | 3 +++
 resources/views/banking/reconciliations/edit.blade.php      | 5 +++--
 resources/views/banking/transfers/show.blade.php            | 1 +
 resources/views/common/import/create.blade.php              | 1 +
 resources/views/components/button/loading.blade.php         | 6 +-----
 resources/views/components/form/buttons.blade.php           | 1 +
 .../components/layouts/modules/show/releases.blade.php      | 1 +
 .../views/components/layouts/modules/show/reviews.blade.php | 1 +
 resources/views/components/modules/items.blade.php          | 1 +
 12 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/resources/views/auth/forgot/create.blade.php b/resources/views/auth/forgot/create.blade.php
index 8fe07c8ea..9f3deb2ed 100644
--- a/resources/views/auth/forgot/create.blade.php
+++ b/resources/views/auth/forgot/create.blade.php
@@ -41,6 +41,7 @@
                     override="class"
                     data-loading-text="{{ trans('general.loading') }}"
                 >
+                    <span>{{ trans('general.send') }}</span>
                     <x-button.loading v-if="form.loading" text="{{ trans('general.send') }}" text-hide="[{'opacity-0': form.loading}]" />
                 </x-button>
             </div>
diff --git a/resources/views/auth/login/create.blade.php b/resources/views/auth/login/create.blade.php
index b62665bc9..80e00e651 100644
--- a/resources/views/auth/login/create.blade.php
+++ b/resources/views/auth/login/create.blade.php
@@ -70,6 +70,7 @@
                     override="class"
                     data-loading-text="{{ trans('general.loading') }}"
                 >
+                    <span>{{ trans('auth.login') }}</span>
                     <x-button.loading v-if="form.loading" text="{{ trans('auth.login') }}" text-hide="[{'opacity-0': form.loading}]" />
                 </x-button>
             </div>
diff --git a/resources/views/auth/reset/create.blade.php b/resources/views/auth/reset/create.blade.php
index 766138570..f11e9c996 100644
--- a/resources/views/auth/reset/create.blade.php
+++ b/resources/views/auth/reset/create.blade.php
@@ -58,6 +58,7 @@
                     override="class"
                     data-loading-text="{{ trans('general.loading') }}"
                 >
+                    <span>{{ trans('auth.reset') }}</span>
                     <x-button.loading v-if="form.loading" text="{{ trans('auth.reset') }}" text-hide="[{'opacity-0': form.loading}]" />
                 </x-button>
             </div>
diff --git a/resources/views/banking/reconciliations/create.blade.php b/resources/views/banking/reconciliations/create.blade.php
index d3b6bbd64..264f48dd2 100644
--- a/resources/views/banking/reconciliations/create.blade.php
+++ b/resources/views/banking/reconciliations/create.blade.php
@@ -264,6 +264,7 @@
                                     class="flex items-center justify-center bg-transparent hover:bg-gray-200 px-3 py-1.5 text-base rounded-lg disabled:opacity-50"
                                     override="class"
                                 >
+                                    <span>{{ trans('reconciliations.save_draft') }}</span>
                                     <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.save_draft') }}" text-hide="[{'opacity-0': form.loading}]" />
                                 </x-button>
     
@@ -277,6 +278,7 @@
                                           @click="onReconcileSubmit"
                                           data-loading-text="{{ trans('general.loading') }}"
                                         >
+                                            <span>{{ trans('reconciliations.reconcile') }}</span>
                                             <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
                                         </x-button>
                                     </x-tooltip>
@@ -290,6 +292,7 @@
                                       @click="onReconcileSubmit"
                                       data-loading-text="{{ trans('general.loading') }}"
                                     >
+                                        <span>{{ trans('reconciliations.reconcile') }}</span>
                                         <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
                                     </x-button>
                                 </div>
diff --git a/resources/views/banking/reconciliations/edit.blade.php b/resources/views/banking/reconciliations/edit.blade.php
index d17e496d0..3cb635fcd 100644
--- a/resources/views/banking/reconciliations/edit.blade.php
+++ b/resources/views/banking/reconciliations/edit.blade.php
@@ -203,6 +203,7 @@
                                 class="relative flex items-center justify-center bg-transparent hover:bg-gray-200 px-3 py-1.5 text-base rounded-lg disabled:opacity-50"
                                 override="class"
                             >
+                                <span>{{ trans('general.save') }}</span>
                                 <x-button.loading v-if="form.loading" text="{{ trans('general.save') }}" text-hide="[{'opacity-1': reconcile}]" />
                             </x-button>
                             <div v-if="reconcile">
@@ -215,7 +216,7 @@
                                         @click="onReconcileSubmit"
                                         data-loading-text="{{ trans('general.loading') }}"
                                     >
-
+                                        <span>{{ trans('reconciliations.reconcile') }}</span>
                                         <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
                                     </x-button>
                                 </x-tooltip>
@@ -229,7 +230,7 @@
                                     @click="onReconcileSubmit"
                                     data-loading-text="{{ trans('general.loading') }}"
                                 >
-
+                                    <span>{{ trans('reconciliations.reconcile') }}"</span>
                                     <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
                                 </x-button>
                             </div>
diff --git a/resources/views/banking/transfers/show.blade.php b/resources/views/banking/transfers/show.blade.php
index dab688a27..8ae853bb3 100644
--- a/resources/views/banking/transfers/show.blade.php
+++ b/resources/views/banking/transfers/show.blade.php
@@ -41,6 +41,7 @@
                     </button>
 
                     <button :disabled="form.loading"  type="button" class="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" @click="addTemplate">
+                        <span>{{ trans('general.confirm') }}</span>
                         <x-button.loading v-if="form.loading" text="{{ trans('general.confirm') }}" text-hide="[{'opacity-0': form.loading}]" />
                     </button>
                 </div>
diff --git a/resources/views/common/import/create.blade.php b/resources/views/common/import/create.blade.php
index a62998008..e7f885487 100644
--- a/resources/views/common/import/create.blade.php
+++ b/resources/views/common/import/create.blade.php
@@ -47,6 +47,7 @@
                             ::disabled="form.loading"
                             override="class"
                         >
+                            <span>{{ trans('import.import') }}</span>
                             <x-button.loading v-if="form.loading" text="{{ trans('import.import') }}" text-hide="[{'opacity-0': form.loading}]" />
                         </x-button>
                     </div>
diff --git a/resources/views/components/button/loading.blade.php b/resources/views/components/button/loading.blade.php
index 6eaab8fc7..7122aa4ea 100644
--- a/resources/views/components/button/loading.blade.php
+++ b/resources/views/components/button/loading.blade.php
@@ -2,8 +2,4 @@
   {{ $attributes }}
   class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"
 >
-</i>
-
-<span :class="{{ $textHide }}">
-  {!! $text !!}
-</span> 
\ No newline at end of file
+</i>
\ No newline at end of file
diff --git a/resources/views/components/form/buttons.blade.php b/resources/views/components/form/buttons.blade.php
index 5dbb47e50..e63659603 100644
--- a/resources/views/components/form/buttons.blade.php
+++ b/resources/views/components/form/buttons.blade.php
@@ -17,6 +17,7 @@
             ::disabled="form.loading"
             override="class"
         >
+            <span>{{ trans('general.save') }}</span>
             <x-button.loading v-if="form.loading" text="{{ trans('general.save') }}" text-hide="[{'opacity-0': form.loading}]" />
         </x-button>
     </div>
diff --git a/resources/views/components/layouts/modules/show/releases.blade.php b/resources/views/components/layouts/modules/show/releases.blade.php
index 91f0bd197..2d45c55f5 100644
--- a/resources/views/components/layouts/modules/show/releases.blade.php
+++ b/resources/views/components/layouts/modules/show/releases.blade.php
@@ -21,6 +21,7 @@
             @click="onModuleLoadMore('releases')"
             class="w-48 bg-green m-auto block whitespace-nowrap px-4 py-2 border border-transparent rounded-md shadow-sm text-base font-medium text-white text-center js-learn-more js-button-modal-submit hover:bg-green-700 disabled:bg-green-300"
         >
+            <span>{{ trans('modules.see_more') }}</span>
             <x-button.loading v-if="loadMoreLoading" text="{{ trans('modules.see_more') }}" text-hide="[{'opacity-0': loadMoreLoading}]" />
         </button>
     </div>
diff --git a/resources/views/components/layouts/modules/show/reviews.blade.php b/resources/views/components/layouts/modules/show/reviews.blade.php
index e57f2612d..b050b56aa 100644
--- a/resources/views/components/layouts/modules/show/reviews.blade.php
+++ b/resources/views/components/layouts/modules/show/reviews.blade.php
@@ -21,6 +21,7 @@
             @click="onModuleLoadMore('reviews')"
             class="w-48 bg-green m-auto block whitespace-nowrap px-4 py-2 border border-transparent rounded-md shadow-sm text-base font-medium text-white text-center js-learn-more js-button-modal-submit hover:bg-green-700 disabled:bg-green-300"
         >
+            <span>{{ trans('modules.see_more') }}</span>
             <x-button.loading v-if="loadMoreLoading" text="{{ trans('modules.see_more') }}" text-hide="[{'opacity-0': loadMoreLoading}]" />
         </button>
     </div>
diff --git a/resources/views/components/modules/items.blade.php b/resources/views/components/modules/items.blade.php
index 45ec6b9cd..58b367afc 100644
--- a/resources/views/components/modules/items.blade.php
+++ b/resources/views/components/modules/items.blade.php
@@ -34,6 +34,7 @@
                     :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}]" />
                 </button>
 

From 89d1a2ce0a979fd525ab7c58bff3ed43af04fb36 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=BCneyt=20=C5=9Eent=C3=BCrk?= <cneytsenturk@gmail.com>
Date: Thu, 16 Jun 2022 16:59:50 +0300
Subject: [PATCH 4/7] Button file change location

---
 .../components/{button.blade.php => button/index.blade.php} | 0
 resources/views/components/button/loading.blade.php         | 6 +++++-
 2 files changed, 5 insertions(+), 1 deletion(-)
 rename resources/views/components/{button.blade.php => button/index.blade.php} (100%)

diff --git a/resources/views/components/button.blade.php b/resources/views/components/button/index.blade.php
similarity index 100%
rename from resources/views/components/button.blade.php
rename to resources/views/components/button/index.blade.php
diff --git a/resources/views/components/button/loading.blade.php b/resources/views/components/button/loading.blade.php
index 7122aa4ea..66bafbf5d 100644
--- a/resources/views/components/button/loading.blade.php
+++ b/resources/views/components/button/loading.blade.php
@@ -1,5 +1,9 @@
 <i
+  @class([
+    'animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto',
+    'before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s]',
+    'after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]'
+  ])
   {{ $attributes }}
-  class="animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s] after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]"
 >
 </i>
\ No newline at end of file

From 68e0b539d55656a4e0b607ad54c6c62f916a2986 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=BCneyt=20=C5=9Eent=C3=BCrk?= <cneytsenturk@gmail.com>
Date: Thu, 16 Jun 2022 17:09:15 +0300
Subject: [PATCH 5/7] Fixed button component path..

---
 app/View/Components/Button.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/View/Components/Button.php b/app/View/Components/Button.php
index 6e5f083b9..a9134ec72 100644
--- a/app/View/Components/Button.php
+++ b/app/View/Components/Button.php
@@ -37,7 +37,7 @@ class Button extends Component
      */
     public function render()
     {
-        return view('components.button');
+        return view('components.button.index');
     }
 
     protected function getOverride($override)

From 9b0cb3da35364858cbfd1fdcff2c9c2de1c17977 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=BCneyt=20=C5=9Eent=C3=BCrk?= <cneytsenturk@gmail.com>
Date: Thu, 16 Jun 2022 18:32:41 +0300
Subject: [PATCH 6/7] Button loading re-factoring..

---
 resources/views/auth/forgot/create.blade.php  |  5 ++--
 resources/views/auth/login/create.blade.php   |  5 ++--
 resources/views/auth/reset/create.blade.php   |  5 ++--
 .../banking/reconciliations/create.blade.php  | 15 ++++++-----
 .../banking/reconciliations/edit.blade.php    | 17 +++++++-----
 .../views/banking/transfers/show.blade.php    |  7 ++---
 .../views/common/import/create.blade.php      |  5 ++--
 .../views/components/button/loading.blade.php | 26 ++++++++++++++-----
 .../views/components/form/buttons.blade.php   |  5 ++--
 .../layouts/modules/show/releases.blade.php   |  5 ++--
 .../layouts/modules/show/reviews.blade.php    |  5 ++--
 .../views/components/modules/items.blade.php  | 10 ++++---
 12 files changed, 71 insertions(+), 39 deletions(-)

diff --git a/resources/views/auth/forgot/create.blade.php b/resources/views/auth/forgot/create.blade.php
index 9f3deb2ed..ced46325e 100644
--- a/resources/views/auth/forgot/create.blade.php
+++ b/resources/views/auth/forgot/create.blade.php
@@ -41,8 +41,9 @@
                     override="class"
                     data-loading-text="{{ trans('general.loading') }}"
                 >
-                    <span>{{ trans('general.send') }}</span>
-                    <x-button.loading v-if="form.loading" text="{{ trans('general.send') }}" text-hide="[{'opacity-0': form.loading}]" />
+                    <x-button.loading>
+                        {{ trans('general.send') }}
+                    </x-button.loading>
                 </x-button>
             </div>
         </x-form>
diff --git a/resources/views/auth/login/create.blade.php b/resources/views/auth/login/create.blade.php
index 80e00e651..0a3ecf927 100644
--- a/resources/views/auth/login/create.blade.php
+++ b/resources/views/auth/login/create.blade.php
@@ -70,8 +70,9 @@
                     override="class"
                     data-loading-text="{{ trans('general.loading') }}"
                 >
-                    <span>{{ trans('auth.login') }}</span>
-                    <x-button.loading v-if="form.loading" text="{{ trans('auth.login') }}" text-hide="[{'opacity-0': form.loading}]" />
+                    <x-button.loading>
+                        {{ trans('auth.login') }}
+                    </x-button.loading>
                 </x-button>
             </div>
         </x-form>
diff --git a/resources/views/auth/reset/create.blade.php b/resources/views/auth/reset/create.blade.php
index f11e9c996..c48fefa93 100644
--- a/resources/views/auth/reset/create.blade.php
+++ b/resources/views/auth/reset/create.blade.php
@@ -58,8 +58,9 @@
                     override="class"
                     data-loading-text="{{ trans('general.loading') }}"
                 >
-                    <span>{{ trans('auth.reset') }}</span>
-                    <x-button.loading v-if="form.loading" text="{{ trans('auth.reset') }}" text-hide="[{'opacity-0': form.loading}]" />
+                    <x-button.loading>
+                        {{ trans('auth.reset') }}
+                    </x-button.loading>
                 </x-button>
             </div>
         </x-form>
diff --git a/resources/views/banking/reconciliations/create.blade.php b/resources/views/banking/reconciliations/create.blade.php
index 264f48dd2..2438d2659 100644
--- a/resources/views/banking/reconciliations/create.blade.php
+++ b/resources/views/banking/reconciliations/create.blade.php
@@ -264,8 +264,9 @@
                                     class="flex items-center justify-center bg-transparent hover:bg-gray-200 px-3 py-1.5 text-base rounded-lg disabled:opacity-50"
                                     override="class"
                                 >
-                                    <span>{{ trans('reconciliations.save_draft') }}</span>
-                                    <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.save_draft') }}" text-hide="[{'opacity-0': form.loading}]" />
+                                    <x-button.loading>
+                                        {{ trans('reconciliations.save_draft') }}
+                                    </x-button.loading>
                                 </x-button>
     
                                 <div v-if="reconcile">
@@ -278,8 +279,9 @@
                                           @click="onReconcileSubmit"
                                           data-loading-text="{{ trans('general.loading') }}"
                                         >
-                                            <span>{{ trans('reconciliations.reconcile') }}</span>
-                                            <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
+                                            <x-button.loading action="! reconcile">
+                                                {{ trans('reconciliations.reconcile') }}
+                                            </x-button.loading>
                                         </x-button>
                                     </x-tooltip>
                                 </div>
@@ -292,8 +294,9 @@
                                       @click="onReconcileSubmit"
                                       data-loading-text="{{ trans('general.loading') }}"
                                     >
-                                        <span>{{ trans('reconciliations.reconcile') }}</span>
-                                        <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
+                                        <x-button.loading action="! reconcile">
+                                            {{ trans('reconciliations.reconcile') }}
+                                        </x-button.loading>
                                     </x-button>
                                 </div>
                             </div>
diff --git a/resources/views/banking/reconciliations/edit.blade.php b/resources/views/banking/reconciliations/edit.blade.php
index 3cb635fcd..152eb75e1 100644
--- a/resources/views/banking/reconciliations/edit.blade.php
+++ b/resources/views/banking/reconciliations/edit.blade.php
@@ -203,9 +203,11 @@
                                 class="relative flex items-center justify-center bg-transparent hover:bg-gray-200 px-3 py-1.5 text-base rounded-lg disabled:opacity-50"
                                 override="class"
                             >
-                                <span>{{ trans('general.save') }}</span>
-                                <x-button.loading v-if="form.loading" text="{{ trans('general.save') }}" text-hide="[{'opacity-1': reconcile}]" />
+                                <x-button.loading>
+                                    {{ trans('general.save') }}
+                                </x-button.loading>
                             </x-button>
+
                             <div v-if="reconcile">
                                 <x-tooltip id="tooltip-reconcile" placement="top" message="{{ trans('reconciliations.irreconcilable') }}">
                                     <x-button
@@ -216,11 +218,13 @@
                                         @click="onReconcileSubmit"
                                         data-loading-text="{{ trans('general.loading') }}"
                                     >
-                                        <span>{{ trans('reconciliations.reconcile') }}</span>
-                                        <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
+                                        <x-button.loading action="! reconcile">
+                                            {{ trans('reconciliations.reconcile') }}
+                                        </x-button.loading>
                                     </x-button>
                                 </x-tooltip>
                             </div>
+
                             <div v-else>
                                 <x-button
                                     type="button"
@@ -230,8 +234,9 @@
                                     @click="onReconcileSubmit"
                                     data-loading-text="{{ trans('general.loading') }}"
                                 >
-                                    <span>{{ trans('reconciliations.reconcile') }}"</span>
-                                    <x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
+                                    <x-button.loading action="! reconcile">
+                                        {{ trans('reconciliations.reconcile') }}
+                                    </x-button.loading>
                                 </x-button>
                             </div>
                         </div>
diff --git a/resources/views/banking/transfers/show.blade.php b/resources/views/banking/transfers/show.blade.php
index 8ae853bb3..8a2563d89 100644
--- a/resources/views/banking/transfers/show.blade.php
+++ b/resources/views/banking/transfers/show.blade.php
@@ -40,9 +40,10 @@
                         {{ trans('general.cancel') }}
                     </button>
 
-                    <button :disabled="form.loading"  type="button" class="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" @click="addTemplate">
-                        <span>{{ trans('general.confirm') }}</span>
-                        <x-button.loading v-if="form.loading" text="{{ trans('general.confirm') }}" text-hide="[{'opacity-0': form.loading}]" />
+                    <button :disabled="form.loading" type="button" class="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" @click="addTemplate">
+                        <x-button.loading>
+                            {{ trans('general.confirm') }}
+                        </x-button.loading>
                     </button>
                 </div>
             </template>
diff --git a/resources/views/common/import/create.blade.php b/resources/views/common/import/create.blade.php
index e7f885487..6e7ec5744 100644
--- a/resources/views/common/import/create.blade.php
+++ b/resources/views/common/import/create.blade.php
@@ -47,8 +47,9 @@
                             ::disabled="form.loading"
                             override="class"
                         >
-                            <span>{{ trans('import.import') }}</span>
-                            <x-button.loading v-if="form.loading" text="{{ trans('import.import') }}" text-hide="[{'opacity-0': form.loading}]" />
+                            <x-button.loading>
+                                {{ trans('import.import') }}
+                            </x-button.loading>
                         </x-button>
                     </div>
                 </div>
diff --git a/resources/views/components/button/loading.blade.php b/resources/views/components/button/loading.blade.php
index 66bafbf5d..47d9d6c2a 100644
--- a/resources/views/components/button/loading.blade.php
+++ b/resources/views/components/button/loading.blade.php
@@ -1,9 +1,21 @@
+@props('action')
+@php
+    if (empty($action)) {
+        $action = 'form.loading';
+    }
+@endphp
+
 <i
-  @class([
-    'animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto',
-    'before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s]',
-    'after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]'
-  ])
-  {{ $attributes }}
+    @class([
+        'animate-submit delay-[0.28s] absolute w-2 h-2 rounded-full left-0 right-0 -top-3.5 m-auto',
+        'before:absolute before:w-2 before:h-2 before:rounded-full before:animate-submit before:delay-[0.14s]',
+        'after:absolute after:w-2 after:h-2 after:rounded-full after:animate-submit before:-left-3.5 after:-right-3.5 after:delay-[0.42s]'
+    ])
+    {{ $attributes }}
+    v-if="{{ $action }}"
 >
-</i>
\ No newline at end of file
+</i>
+
+<span :class="[{'opacity-0': {{ $action }}}]">
+    {!! $slot !!}
+</span>
diff --git a/resources/views/components/form/buttons.blade.php b/resources/views/components/form/buttons.blade.php
index e63659603..e66b04c42 100644
--- a/resources/views/components/form/buttons.blade.php
+++ b/resources/views/components/form/buttons.blade.php
@@ -17,8 +17,9 @@
             ::disabled="form.loading"
             override="class"
         >
-            <span>{{ trans('general.save') }}</span>
-            <x-button.loading v-if="form.loading" text="{{ trans('general.save') }}" text-hide="[{'opacity-0': form.loading}]" />
+            <x-button.loading>
+                {{ trans('general.save') }}
+            </x-button.loading>
         </x-button>
     </div>
 @stack('save_buttons_end')
diff --git a/resources/views/components/layouts/modules/show/releases.blade.php b/resources/views/components/layouts/modules/show/releases.blade.php
index 2d45c55f5..17844f24e 100644
--- a/resources/views/components/layouts/modules/show/releases.blade.php
+++ b/resources/views/components/layouts/modules/show/releases.blade.php
@@ -21,8 +21,9 @@
             @click="onModuleLoadMore('releases')"
             class="w-48 bg-green m-auto block whitespace-nowrap px-4 py-2 border border-transparent rounded-md shadow-sm text-base font-medium text-white text-center js-learn-more js-button-modal-submit hover:bg-green-700 disabled:bg-green-300"
         >
-            <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>
     </div>
 
diff --git a/resources/views/components/layouts/modules/show/reviews.blade.php b/resources/views/components/layouts/modules/show/reviews.blade.php
index b050b56aa..871bee219 100644
--- a/resources/views/components/layouts/modules/show/reviews.blade.php
+++ b/resources/views/components/layouts/modules/show/reviews.blade.php
@@ -21,8 +21,9 @@
             @click="onModuleLoadMore('reviews')"
             class="w-48 bg-green m-auto block whitespace-nowrap px-4 py-2 border border-transparent rounded-md shadow-sm text-base font-medium text-white text-center js-learn-more js-button-modal-submit hover:bg-green-700 disabled:bg-green-300"
         >
-            <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>
     </div>
 
diff --git a/resources/views/components/modules/items.blade.php b/resources/views/components/modules/items.blade.php
index 58b367afc..047f34f91 100644
--- a/resources/views/components/modules/items.blade.php
+++ b/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]) }}" />

From 87e012bb86d7a1de34ffc9f63ee678ad57ec8f2f Mon Sep 17 00:00:00 2001
From: Burak Civan <burakcivan22@gmail.com>
Date: Thu, 16 Jun 2022 18:54:16 +0300
Subject: [PATCH 7/7] code refactor

---
 resources/views/auth/login/create.blade.php                     | 1 -
 resources/views/components/button/loading.blade.php             | 2 +-
 .../views/components/layouts/modules/show/releases.blade.php    | 2 +-
 .../views/components/layouts/modules/show/reviews.blade.php     | 2 +-
 resources/views/components/modules/items.blade.php              | 2 +-
 5 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/resources/views/auth/login/create.blade.php b/resources/views/auth/login/create.blade.php
index 0a3ecf927..7b0eb2802 100644
--- a/resources/views/auth/login/create.blade.php
+++ b/resources/views/auth/login/create.blade.php
@@ -68,7 +68,6 @@
                     ::disabled="form.loading"
                     class="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 sm:col-span-6"
                     override="class"
-                    data-loading-text="{{ trans('general.loading') }}"
                 >
                     <x-button.loading>
                         {{ trans('auth.login') }}
diff --git a/resources/views/components/button/loading.blade.php b/resources/views/components/button/loading.blade.php
index 47d9d6c2a..a94953e34 100644
--- a/resources/views/components/button/loading.blade.php
+++ b/resources/views/components/button/loading.blade.php
@@ -1,4 +1,4 @@
-@props('action')
+@props(['action'])
 @php
     if (empty($action)) {
         $action = 'form.loading';
diff --git a/resources/views/components/layouts/modules/show/releases.blade.php b/resources/views/components/layouts/modules/show/releases.blade.php
index 17844f24e..82dd6c84d 100644
--- a/resources/views/components/layouts/modules/show/releases.blade.php
+++ b/resources/views/components/layouts/modules/show/releases.blade.php
@@ -19,7 +19,7 @@
             id="releases-load-more"
             :disabled="loadMoreLoading"
             @click="onModuleLoadMore('releases')"
-            class="w-48 bg-green m-auto block whitespace-nowrap px-4 py-2 border border-transparent rounded-md shadow-sm text-base font-medium text-white text-center js-learn-more js-button-modal-submit hover:bg-green-700 disabled:bg-green-300"
+            class="relative w-48 bg-green m-auto block whitespace-nowrap px-4 py-2 border border-transparent rounded-md shadow-sm text-base font-medium text-white text-center js-learn-more js-button-modal-submit hover:bg-green-700 disabled:bg-green-300"
         >
             <x-button.loading action="loadMoreLoading">
                 {{ trans('modules.see_more') }}
diff --git a/resources/views/components/layouts/modules/show/reviews.blade.php b/resources/views/components/layouts/modules/show/reviews.blade.php
index 871bee219..352e3310b 100644
--- a/resources/views/components/layouts/modules/show/reviews.blade.php
+++ b/resources/views/components/layouts/modules/show/reviews.blade.php
@@ -19,7 +19,7 @@
             id="review-load-more"
             :disabled="loadMoreLoading"
             @click="onModuleLoadMore('reviews')"
-            class="w-48 bg-green m-auto block whitespace-nowrap px-4 py-2 border border-transparent rounded-md shadow-sm text-base font-medium text-white text-center js-learn-more js-button-modal-submit hover:bg-green-700 disabled:bg-green-300"
+            class="relative w-48 bg-green m-auto block whitespace-nowrap px-4 py-2 border border-transparent rounded-md shadow-sm text-base font-medium text-white text-center js-learn-more js-button-modal-submit hover:bg-green-700 disabled:bg-green-300"
         >
             <x-button.loading action="loadMoreLoading">
                 {{ trans('modules.see_more') }}
diff --git a/resources/views/components/modules/items.blade.php b/resources/views/components/modules/items.blade.php
index 047f34f91..47b82f5bb 100644
--- a/resources/views/components/modules/items.blade.php
+++ b/resources/views/components/modules/items.blade.php
@@ -35,7 +35,7 @@
                     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"
+                    class="relative w-48 m-auto 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"
                 >
                     <x-button.loading action="loadMoreLoading">
                         {{ trans('modules.see_more') }}