web push notifications

resources/js/layouts/AppLayout.vue

@@ -1,14 +1,25 @@
 <script setup lang="ts">
 import AppLayout from '@/layouts/app/AppSidebarLayout.vue';
 import type { BreadcrumbItem } from '@/types';
+import { usePushNotifications } from '@/composables/usePushNotifications';
 
 const { breadcrumbs = [] } = defineProps<{
     breadcrumbs?: BreadcrumbItem[];
 }>();
+
+const { isSubscribed, subscribe, unsubscribe } = usePushNotifications();
 </script>
 
 <template>
     <AppLayout :breadcrumbs="breadcrumbs">
         <slot />
+        <div class="fixed bottom-4 right-4">
+            <button
+                @click="isSubscribed ? unsubscribe() : subscribe()"
+                class="rounded-full bg-blue-500 px-4 py-2 text-white"
+            >
+                {{ isSubscribed ? 'Unsubscribe' : 'Subscribe' }}
+            </button>
+        </div>
     </AppLayout>
 </template>