"use client"

import { useEffect } from "react"
import { SidebarNavProvider } from "@/lib/sidebar-nav-context"
import { MailSettingsSync } from "@/components/gmail/mail-settings-sync"
import { MailNavSync } from "@/components/gmail/mail-nav-sync"
import { ComposeIdentitiesSync } from "@/components/gmail/compose-identities-sync"
import { MailSignaturesSync } from "@/components/gmail/mail-signatures-sync"
import { MailNotificationsBridge } from "@/components/gmail/mail-notifications-bridge"
import { useWebSocket } from "@/lib/api/ws"
import { useMailSettingsStore } from "@/lib/stores/mail-settings-store"

export function SettingsAppShell({ children }: { children: React.ReactNode }) {
  useWebSocket()

  useEffect(() => {
    useMailSettingsStore.getState().setQuickSettingsOpen(false)
  }, [])

  useEffect(() => {
    const blockPinch = (event: Event) => event.preventDefault()
    document.addEventListener("gesturestart", blockPinch, { passive: false })
    document.addEventListener("gesturechange", blockPinch, { passive: false })
    document.addEventListener("gestureend", blockPinch, { passive: false })
    return () => {
      document.removeEventListener("gesturestart", blockPinch)
      document.removeEventListener("gesturechange", blockPinch)
      document.removeEventListener("gestureend", blockPinch)
    }
  }, [])

  return (
    <SidebarNavProvider>
      {children}
      <MailSettingsSync />
      <MailNavSync />
      <ComposeIdentitiesSync />
      <MailSignaturesSync />
      <MailNotificationsBridge />
    </SidebarNavProvider>
  )
}