From e796e963f3191604a13182a7500b474336b4d429 Mon Sep 17 00:00:00 2001
From: Kamil Niemczycki <contact@kamilcraft.com>
Date: Wed, 1 Jun 2022 12:16:52 +0200
Subject: [PATCH 1/7] #150 - added base for empty states

---
 resources/js/Shared/Feedbacks/EmptyState.vue | 21 ++++++++++++++++++++
 1 file changed, 21 insertions(+)
 create mode 100644 resources/js/Shared/Feedbacks/EmptyState.vue

diff --git a/resources/js/Shared/Feedbacks/EmptyState.vue b/resources/js/Shared/Feedbacks/EmptyState.vue
new file mode 100644
index 0000000..4467e65
--- /dev/null
+++ b/resources/js/Shared/Feedbacks/EmptyState.vue
@@ -0,0 +1,21 @@
+<template>
+  <div class="text-center my-5">
+    <slot name="head">
+      <SearchIcon class="mx-auto w-12 h-12" />
+    </slot>
+    <h3 class="mt-2 text-sm font-medium">
+      <slot name="title">
+        No search result
+      </slot>
+    </h3>
+    <p class="text-sm text-gray-500">
+      <slot name="text">
+        Try a different search query
+      </slot>
+    </p>
+  </div>
+</template>
+
+<script setup>
+import { SearchIcon } from '@heroicons/vue/solid'
+</script>
-- 
2.50.1


From e1d0096060f6dd0ad93581cf7019110148b83865 Mon Sep 17 00:00:00 2001
From: Kamil Niemczycki <contact@kamilcraft.com>
Date: Wed, 1 Jun 2022 12:45:02 +0200
Subject: [PATCH 2/7] #150 - added empty states to subpages

---
 resources/js/Pages/Holidays/Index.vue                  | 10 +++++++++-
 resources/js/Pages/Resumes/Index.vue                   | 10 +++++++++-
 resources/js/Pages/Technologies.vue                    | 10 +++++++++-
 resources/js/Pages/Users/Index.vue                     | 10 +++++++++-
 .../js/Pages/VacationRequest/IndexForApprovers.vue     | 10 +++++++++-
 5 files changed, 45 insertions(+), 5 deletions(-)

diff --git a/resources/js/Pages/Holidays/Index.vue b/resources/js/Pages/Holidays/Index.vue
index ac621f5..05247b1 100644
--- a/resources/js/Pages/Holidays/Index.vue
+++ b/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,
diff --git a/resources/js/Pages/Resumes/Index.vue b/resources/js/Pages/Resumes/Index.vue
index c5fd574..42caee1 100644
--- a/resources/js/Pages/Resumes/Index.vue
+++ b/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,
diff --git a/resources/js/Pages/Technologies.vue b/resources/js/Pages/Technologies.vue
index b9b0a4a..f77b46a 100644
--- a/resources/js/Pages/Technologies.vue
+++ b/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,
diff --git a/resources/js/Pages/Users/Index.vue b/resources/js/Pages/Users/Index.vue
index 074189a..4cf1d27 100644
--- a/resources/js/Pages/Users/Index.vue
+++ b/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,
diff --git a/resources/js/Pages/VacationRequest/IndexForApprovers.vue b/resources/js/Pages/VacationRequest/IndexForApprovers.vue
index 7f746d8..d4303af 100644
--- a/resources/js/Pages/VacationRequest/IndexForApprovers.vue
+++ b/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,
-- 
2.50.1


From 538830a5a16498d6e3c209a7b0f5071ea771fd75 Mon Sep 17 00:00:00 2001
From: Kamil Niemczycki <contact@kamilcraft.com>
Date: Wed, 1 Jun 2022 13:21:07 +0200
Subject: [PATCH 3/7] #150 - added empty states for the widget: vacation
 requests

disabled "see more" button when no results are available
---
 .../Widgets/PendingVacationRequests.vue       | 23 +++++++++++++++----
 1 file changed, 18 insertions(+), 5 deletions(-)

diff --git a/resources/js/Shared/Widgets/PendingVacationRequests.vue b/resources/js/Shared/Widgets/PendingVacationRequests.vue
index 4c287da..ab3941b 100644
--- a/resources/js/Shared/Widgets/PendingVacationRequests.vue
+++ b/resources/js/Shared/Widgets/PendingVacationRequests.vue
@@ -52,16 +52,27 @@
             </div>
           </li>
           <li v-if="! requests.length">
-            <p class="py-2">
-              Brak danych
-            </p>
+            <EmptyState class="text-gray-700">
+              <template #head>
+                <CollectionIcon class="mx-auto w-12 h-12" />
+              </template>
+              <template #title>
+                Brak wniosków
+              </template>
+              <template #text>
+                Nie ma oczekujących wniosków
+              </template>
+            </EmptyState>
           </li>
         </ul>
       </div>
-      <div class="mt-6">
+      <div
+        v-if="requests.length"
+        class="mt-6"
+      >
         <InertiaLink
           href="/vacation/requests"
-          :data="{status: 'waiting_for_action'}"
+          :data="{ status: 'waiting_for_action' }"
           class="flex justify-center items-center py-2 px-4 w-full text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 rounded-md border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blumilk-500 shadow-sm"
         >
           Zobacz wszystkie
@@ -73,6 +84,8 @@
 
 <script setup>
 import VacationType from '@/Shared/VacationType'
+import EmptyState from '@/Shared/Feedbacks/EmptyState'
+import { CollectionIcon } from '@heroicons/vue/solid'
 
 defineProps({
   requests: Object,
-- 
2.50.1


From 398300cd9f9f09e8ccea6f6c06a1e8f2a470be1a Mon Sep 17 00:00:00 2001
From: Kamil Niemczycki <contact@kamilcraft.com>
Date: Wed, 1 Jun 2022 14:37:17 +0200
Subject: [PATCH 4/7] Update resources/js/Pages/Holidays/Index.vue

Removed emoji from text

Co-authored-by: Krzysztof Rewak <krzysztof.rewak@gmail.com>
---
 resources/js/Pages/Holidays/Index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/Pages/Holidays/Index.vue b/resources/js/Pages/Holidays/Index.vue
index 05247b1..a62ebd7 100644
--- a/resources/js/Pages/Holidays/Index.vue
+++ b/resources/js/Pages/Holidays/Index.vue
@@ -124,7 +124,7 @@
                     Brak dni wolnych od pracy
                   </template>
                   <template #text>
-                    Brak wpisów dotyczących dni wolnych 😔
+                    Brak wpisów dotyczących dni wolnych
                   </template>
                 </EmptyState>
               </td>
-- 
2.50.1


From 52e546ed645c14fd76e66ec3b050054c3d329375 Mon Sep 17 00:00:00 2001
From: Kamil Niemczycki <contact@kamilcraft.com>
Date: Thu, 2 Jun 2022 09:03:21 +0200
Subject: [PATCH 5/7] #150 - added empty state for key page

---
 resources/js/Pages/Keys.vue | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/resources/js/Pages/Keys.vue b/resources/js/Pages/Keys.vue
index 5c158fa..83a8bac 100644
--- a/resources/js/Pages/Keys.vue
+++ b/resources/js/Pages/Keys.vue
@@ -156,7 +156,17 @@
                 colspan="100%"
                 class="py-4 text-xl leading-5 text-center text-gray-700"
               >
-                Brak danych
+                <EmptyState class="text-gray-700">
+                  <template #head>
+                    <KeyIcon class="mx-auto w-12 h-12" />
+                  </template>
+                  <template #title>
+                    Brak kluczy
+                  </template>
+                  <template #text>
+                    Nie dodano ani jednego klucza
+                  </template>
+                </EmptyState>
               </td>
             </tr>
           </tbody>
@@ -307,7 +317,7 @@
 </template>
 
 <script setup>
-import { DotsVerticalIcon, TrashIcon, CheckIcon, SelectorIcon } from '@heroicons/vue/solid'
+import { DotsVerticalIcon, TrashIcon, CheckIcon, SelectorIcon, KeyIcon } from '@heroicons/vue/solid'
 import DominoMaskIcon from 'vue-material-design-icons/DominoMask.vue'
 import HandshakeIcon from 'vue-material-design-icons/Handshake.vue'
 import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/vue'
@@ -315,6 +325,7 @@ import { computed, ref } from 'vue'
 import { Dialog, DialogOverlay, DialogTitle, TransitionChild, TransitionRoot } from '@headlessui/vue'
 import { Listbox, ListboxButton, ListboxLabel, ListboxOption, ListboxOptions } from '@headlessui/vue'
 import { useForm } from '@inertiajs/inertia-vue3'
+import EmptyState from '@/Shared/Feedbacks/EmptyState'
 
 const props = defineProps({
   keys: Object,
-- 
2.50.1


From 70d3e3cd3346bcb33fd63deedda3504cf3275ac2 Mon Sep 17 00:00:00 2001
From: Kamil Niemczycki <contact@kamilcraft.com>
Date: Thu, 2 Jun 2022 09:04:10 +0200
Subject: [PATCH 6/7] #150 - added empty state for user vacation request widget

---
 .../Shared/Widgets/UserVacationRequests.vue   | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/resources/js/Shared/Widgets/UserVacationRequests.vue b/resources/js/Shared/Widgets/UserVacationRequests.vue
index b942779..bd0019d 100644
--- a/resources/js/Shared/Widgets/UserVacationRequests.vue
+++ b/resources/js/Shared/Widgets/UserVacationRequests.vue
@@ -38,12 +38,25 @@
           </li>
           <li v-if="! requests.length">
             <p class="py-2">
-              Brak danych
+              <EmptyState class="text-gray-700">
+                <template #head>
+                  <CollectionIcon class="mx-auto w-12 h-12" />
+                </template>
+                <template #title>
+                  Brak wniosków
+                </template>
+                <template #text>
+                  Nie ma oczekujących wniosków
+                </template>
+              </EmptyState>
             </p>
           </li>
         </ul>
       </div>
-      <div class="mt-6">
+      <div
+        v-if="requests.length"
+        class="mt-6"
+      >
         <InertiaLink
           href="/vacation/requests/me"
           class="flex justify-center items-center py-2 px-4 w-full text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 rounded-md border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blumilk-500 shadow-sm"
@@ -58,6 +71,8 @@
 <script setup>
 import Status from '@/Shared/Status'
 import VacationType from '@/Shared/VacationType'
+import EmptyState from '@/Shared/Feedbacks/EmptyState'
+import { CollectionIcon } from '@heroicons/vue/solid'
 
 defineProps({
   requests: Object,
-- 
2.50.1


From 435475f97cde75a9ecc9bd29d7d88590a1cbd239 Mon Sep 17 00:00:00 2001
From: Kamil Niemczycki <contact@kamilcraft.com>
Date: Thu, 2 Jun 2022 10:09:48 +0200
Subject: [PATCH 7/7] #31 - title corrected

---
 resources/js/Pages/Technologies.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/Pages/Technologies.vue b/resources/js/Pages/Technologies.vue
index f77b46a..f578cc4 100644
--- a/resources/js/Pages/Technologies.vue
+++ b/resources/js/Pages/Technologies.vue
@@ -1,5 +1,5 @@
 <template>
-  <InertiaHead title="Klucze" />
+  <InertiaHead title="Technologie" />
   <div class="bg-white shadow-md">
     <div class="flex justify-between items-center p-4 sm:px-6">
       <div>
-- 
2.50.1