import type { ComponentProps } from "react"; import { LintModal } from "./LintModal"; import { AskAgentModal } from "./AskAgentModal"; import { StudioGlobalDragOverlay } from "./StudioGlobalDragOverlay"; import { StudioToast } from "./StudioToast"; import { buildAgentContextPreview } from "./editor/domEditingAgentPrompt"; import type { useDomEditSession } from "../hooks/useDomEditSession"; import type { useToast } from "../hooks/useToast"; type LintFindings = ComponentProps["findings"]; export interface StudioOverlaysProps { projectId: string; lintModal: LintFindings | null; closeLintModal: () => void; consoleErrors: LintFindings | null; clearConsoleErrors: () => void; domEditSession: ReturnType; activeCompPath: string | null; dragOverlayActive: boolean; appToast: ReturnType["appToast"]; dismissToast: () => void; } /** * Floating overlays for the studio shell: lint / console-error modals, the * ask-agent modal, the global drag overlay, and the toast. Extracted from * `App.tsx` to keep the shell within the studio's 600-line decomposition budget. */ // fallow-ignore-next-line complexity export function StudioOverlays({ projectId, lintModal, closeLintModal, consoleErrors, clearConsoleErrors, domEditSession, activeCompPath, dragOverlayActive, appToast, dismissToast, }: StudioOverlaysProps) { return ( <> {lintModal !== null && ( )} {consoleErrors !== null && consoleErrors.length > 0 && ( )} {domEditSession.agentModalOpen && domEditSession.domEditSelection && ( { domEditSession.setAgentModalOpen(false); domEditSession.setAgentPromptSelectionContext(undefined); domEditSession.setAgentModalAnchorPoint(null); }} /> )} {dragOverlayActive && } {appToast && ( )} ); }