import { SessionProvider } from "next-auth/react"
import type { Metadata } from "next"
import "../styles/styles.css"
import "../styles/global.css"
import "tailwindcss/tailwind.css"

import type { AppProps } from "next/app";
import type { Session } from "next-auth";
import { useEffect } from "react"
// for fontawesome
import Head from 'next/head';
import { LocalizationProvider } from '@mui/x-date-pickers';
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'
// Use of the <SessionProvider> is mandatory to allow components that call
// `useSession()` anywhere in your application to access the `session` object.

// export const metadata: Metadata = {
//   title: "Специално Свидетелстване София",
//   description: "Специално Свидетелстване София",
//   viewport: "width=device-width, initial-scale=1",
//   appleWebApp: true,
// }


export default function App({
  Component,
  pageProps: { session, ...pageProps },
}: AppProps<{ session: Session }>) {

  useEffect(() => {
    const use = async () => {
      (await import('tw-elements')).default;
    };
    use();
  }, []);


  // PUSH NOTIFICATIONS
  useEffect(() => {
    // Function to ask for Notification permission
    const askForNotificationPermission = async () => {
      // Check if the browser supports service workers and push notifications
      if ('serviceWorker' in navigator && 'PushManager' in window) {
        try {
          // Wait for service worker registration
          const registration = await navigator.serviceWorker.ready;
          // Ask for notification permission
          const permission = await Notification.requestPermission();
          if (permission === 'granted') {
            console.log('Notification permission granted.');
            // TODO: Subscribe the user to push notifications here
          } else {
            console.log('Notification permission not granted.');
          }
        } catch (error) {
          console.error('Error during service worker registration:', error);
        }
      } else {
        console.log('Service Worker or Push notifications not supported in this browser.');
      }
    };

    // Call the function to ask for permission on first load
    askForNotificationPermission();
  }, []);


  return (
    <>
      <SessionProvider session={session} >
        <LocalizationProvider dateAdapter={AdapterDayjs}>
          <Component {...pageProps} />
        </LocalizationProvider>
      </SessionProvider>
    </>
  )
}