fixes

src/App.vue

@@ -7,12 +7,11 @@
 
     <!-- Контентная часть заполняет оставшееся пространство -->
     <div class="flex-grow  ">
-
+      <Button label="Sub" :class="checkNotif ? 'flex' : '!hidden'" @click="checkSubscribe"/>
       <router-view/>
     </div>
     <OverlayView class="w-full sticky  invisible lg:visible top-0 z-10"/>
-{{not}}
-    <Button label="Sub" @click="checkSubscribe"/>
+
   </div>
 </template>
 
@@ -22,23 +21,30 @@ import OverlayView from "@/components/OverlayView.vue";
 import ToolBar from "@/components/ToolBar.vue";
 import Button from "primevue/button";
 import axiosSetup from "@/services/axiosSetup";
-import {onMounted, ref} from "vue";
+import {computed, onMounted, ref} from "vue";
 import {subscribeUserToPush} from "@/services/pushManager";
 import apiClient from '@/services/axiosSetup';
 
+const checkNotif = computed(() => {
+  return 'Notification' in window && Notification.permission === 'default'
+})
 
-const not = ref(Notification.permission)
-const checkSubscribe = async  () => {
-  if (Notification.permission === 'default') {
-    await Notification.requestPermission().then(sendSubscribe)
-  } else if (Notification.permission === 'granted') {
-    await sendSubscribe()
+const checkSubscribe = async () => {
+  if ("Notification" in window) {
+    if (Notification.permission === 'default') {
+      await Notification.requestPermission().then(sendSubscribe)
+    } else if (Notification.permission === 'granted') {
+      await sendSubscribe()
+    } else {
+      // Пользователь ранее отклонил запрос
+    }
   } else {
-    // Пользователь ранее отклонил запрос
+    console.log("Notification API is not supported in this browser.");
+    // You may want to use an alternative method, like alerts or modals
   }
 }
 
-const sendSubscribe = async  () => {
+const sendSubscribe = async () => {
   try {
     const subscription = await subscribeUserToPush();
     console.log("Push subscription:", subscription);
@@ -51,7 +57,7 @@ const sendSubscribe = async  () => {
 }
 
 onMounted(async () => {
- await  checkSubscribe()
+  await checkSubscribe()
 
 
 })