#150 - added empty states to subpages

resources/js/Pages/Holidays/Index.vue

@@ -119,7 +119,14 @@
                 colspan="100%"
                 class="py-4 text-xl leading-5 text-center text-gray-700"
               >
-                Brak danych
+                <EmptyState>
+                  <template #title>
+                    Brak dni wolnych od pracy
+                  </template>
+                  <template #text>
+                    Brak wpisów dotyczących dni wolnych 😔
+                  </template>
+                </EmptyState>
               </td>
             </tr>
           </tbody>
@@ -132,6 +139,7 @@
 <script setup>
 import { DotsVerticalIcon, PencilIcon, TrashIcon } from '@heroicons/vue/solid'
 import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/vue'
+import EmptyState from '@/Shared/Feedbacks/EmptyState'
 
 defineProps({
   holidays: Object,

resources/js/Pages/Resumes/Index.vue

@@ -175,7 +175,14 @@
                 colspan="100%"
                 class="py-4 text-xl leading-5 text-center text-gray-700"
               >
-                Brak danych
+                <EmptyState>
+                  <template #title>
+                    Brak CV
+                  </template>
+                  <template #text>
+                    Brak wpisów dotyczących CV
+                  </template>
+                </EmptyState>
               </td>
             </tr>
           </tbody>
@@ -191,6 +198,7 @@ import { DotsVerticalIcon } from '@heroicons/vue/outline'
 import { DownloadIcon, PencilIcon, TrashIcon } from '@heroicons/vue/solid'
 import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/vue'
 import Pagination from '@/Shared/Pagination'
+import EmptyState from '@/Shared/Feedbacks/EmptyState'
 
 defineProps({
   resumes: Object,

resources/js/Pages/Technologies.vue

@@ -92,7 +92,14 @@
                 colspan="100%"
                 class="py-4 text-xl leading-5 text-center text-gray-700"
               >
-                Brak danych
+                <EmptyState>
+                  <template #title>
+                    Brak technologii
+                  </template>
+                  <template #text>
+                    Brak wpisów dotyczących technologii
+                  </template>
+                </EmptyState>
               </td>
             </tr>
           </tbody>
@@ -200,6 +207,7 @@ import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/vue'
 import { ref } from 'vue'
 import { Dialog, DialogOverlay, DialogTitle, TransitionChild, TransitionRoot } from '@headlessui/vue'
 import { useForm } from '@inertiajs/inertia-vue3'
+import EmptyState from '@/Shared/Feedbacks/EmptyState'
 
 defineProps({
   technologies: Object,

resources/js/Pages/Users/Index.vue

@@ -194,7 +194,14 @@
                 colspan="100%"
                 class="py-4 text-xl leading-5 text-center text-gray-700"
               >
-                Brak danych
+                <EmptyState>
+                  <template #title>
+                    Nie znaleziono użytkownika
+                  </template>
+                  <template #text>
+                    Spróbuj sformułować zapytanie inaczej
+                  </template>
+                </EmptyState>
               </td>
             </tr>
           </tbody>
@@ -214,6 +221,7 @@ import { DotsVerticalIcon, PencilIcon, BanIcon, RefreshIcon } from '@heroicons/v
 import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/vue'
 import { DateTime } from 'luxon'
 import Pagination from '@/Shared/Pagination'
+import EmptyState from '@/Shared/Feedbacks/EmptyState'
 
 const props = defineProps({
   users: Object,

resources/js/Pages/VacationRequest/IndexForApprovers.vue

@@ -346,7 +346,14 @@
               colspan="100%"
               class="py-4 text-xl leading-5 text-center text-gray-700"
             >
-              Brak danych
+              <EmptyState>
+                <template #title>
+                  Brak wniosków o urlop
+                </template>
+                <template #text>
+                  Spróbuj sformułować zapytanie inaczej
+                </template>
+              </EmptyState>
             </td>
           </tr>
         </tbody>
@@ -365,6 +372,7 @@ import { debounce } from 'lodash'
 import { Inertia } from '@inertiajs/inertia'
 import { Listbox, ListboxButton, ListboxLabel, ListboxOption, ListboxOptions } from '@headlessui/vue'
 import Pagination from '@/Shared/Pagination'
+import EmptyState from '@/Shared/Feedbacks/EmptyState'
 
 const props = defineProps({
   requests: Object,