"use client"

import { useLayoutEffect } from "react"
import { getDemoMailPreviewLayout } from "@/lib/demo/demo-mail-preview"
import { useMailSettingsStore } from "@/lib/stores/mail-settings-store"
import { useMailUiStore } from "@/lib/stores/mail-ui-store"

/** Applique reading pane / sidebar pour les iframes marketing (?preview=). */
export function DemoMailPreviewBootstrap() {
  useLayoutEffect(() => {
    const preview = getDemoMailPreviewLayout()
    if (!preview) return

    if (preview === "tablet") {
      useMailSettingsStore.getState().setReadingPane("right")
      useMailUiStore.getState().setSidebarCollapsed(true)
    }

    if (preview === "desktop") {
      useMailSettingsStore.getState().setReadingPane("none")
      useMailUiStore.getState().setSidebarCollapsed(false)
    }

    if (preview === "phone") {
      useMailSettingsStore.getState().setReadingPane("none")
      useMailUiStore.getState().setSidebarCollapsed(true)
    }
  }, [])

  return null
}