@pascal-app/editor 1.0.0-beta.5 → 1.0.1

package/src/components/ui/sidebar/panels/settings-panel/index.tsx

@@ -1,21 +1,48 @@
 import {
   clearSceneHistory,
   emitter,
+  isNodeKindEnabled,
+  nodeRegistry,
+  useRegistryVersion,
   useScene,
+  type ParsedBuildJson,
   validateBuildJson,
 } from '@pascal-app/core'
-import { useViewer } from '@pascal-app/viewer'
+import { useViewer, viewerPresentationRegistry } from '@pascal-app/viewer'
 import { TreeView, VisualJson } from '@visual-json/react'
-import { Camera, Download, Map as MapIcon, Save, Trash2, Upload } from 'lucide-react'
+import {
+  Camera,
+  Check,
+  ChevronDown,
+  Copy,
+  Download,
+  Map as MapIcon,
+  Save,
+  Send,
+  Trash2,
+  Upload,
+} from 'lucide-react'
 import {
   type KeyboardEvent,
   type SyntheticEvent,
   useCallback,
+  useEffect,
+  useId,
   useMemo,
   useRef,
   useState,
+  useSyncExternalStore,
 } from 'react'
-import { exportFloorplanPdf } from '../../../../../lib/floorplan/floorplan-export'
+import {
+  exportFloorplanPdf,
+  type FloorplanExportScope,
+} from '../../../../../lib/floorplan/floorplan-export'
+import {
+  LocalAppError,
+  probeLocalApp,
+  sendGlbToLocalApp,
+  waitForLocalImport,
+} from '../../../../../lib/send-to-app'
 import { Button } from './../../../../../components/ui/primitives/button'
 import {
   Dialog,
@@ -23,12 +50,15 @@ import {
   DialogTitle,
   DialogTrigger,
 } from './../../../../../components/ui/primitives/dialog'
+import { Input } from './../../../../../components/ui/primitives/input'
 import { Switch } from './../../../../../components/ui/primitives/switch'
 import useEditor, { selectDefaultBuildingAndLevel } from './../../../../../store/use-editor'
+import { type SendToAppStep, useSendToApp } from './../../../../../store/use-send-to-app'
 import useFloorplanMode from './../../../../../store/use-floorplan-mode'
 import { AudioSettingsDialog } from './audio-settings-dialog'
 import { KeyboardShortcutsDialog } from './keyboard-shortcuts-dialog'
 import { LoadBuildDialog, type PendingImport } from './load-build-dialog'
+import { PrintExportButton } from './print-export-button'
 
 type SceneNode = Record<string, unknown> & {
   id?: unknown
@@ -53,6 +83,30 @@ type SceneGraphValue = {
   detachedNodes?: SceneGraphNode[]
 }
 
+const MODEL_EXPORT_FORMATS = [
+  { format: 'glb', label: 'GLB' },
+  { format: 'usdz', label: 'USDZ' },
+  { format: 'stl', label: 'STL' },
+  { format: 'obj', label: 'OBJ' },
+] as const
+
+type ModelExportFormat = (typeof MODEL_EXPORT_FORMATS)[number]['format']
+
+const SEND_TO_BLENDER_STEP_LABEL: Record<SendToAppStep, string> = {
+  probing: 'Looking for Blender…',
+  exporting: 'Preparing the scene…',
+  sending: 'Sending to Blender…',
+  importing: 'Blender is importing…',
+}
+
+const BLENDER_ADDON_URL = 'https://github.com/pascalorg/blender-addon#install'
+
+type ExportableNodeType = {
+  type: string
+  label: string
+  supportsGeometryOnly: boolean
+}
+
 const isSceneNode = (value: unknown): value is SceneNode => {
   return (
     typeof value === 'object' &&
@@ -171,6 +225,8 @@ export interface ProjectVisibility {
 
 export interface SettingsPanelProps {
   projectId?: string
+  /** Shown as the scene name in apps the scene is sent to (Blender collection name). */
+  projectName?: string
   projectVisibility?: ProjectVisibility
   onVisibilityChange?: (
     field: 'isPrivate' | 'showScansPublic' | 'showGuidesPublic',
@@ -180,22 +236,88 @@ export interface SettingsPanelProps {
 
 export function SettingsPanel({
   projectId,
+  projectName,
   projectVisibility,
   onVisibilityChange,
 }: SettingsPanelProps = {}) {
   const fileInputRef = useRef<HTMLInputElement>(null)
+  const copyResetTimeoutRef = useRef<number | null>(null)
   const nodes = useScene((state) => state.nodes)
   const rootNodeIds = useScene((state) => state.rootNodeIds)
   const installedPlugins = useScene((state) => state.installedPlugins)
+  const materials = useScene((state) => state.materials)
+  const collections = useScene((state) => state.collections)
   const setScene = useScene((state) => state.setScene)
   const clearScene = useScene((state) => state.clearScene)
   const resetSelection = useViewer((state) => state.resetSelection)
-  const exportScene = useViewer((state) => state.exportScene)
+  const modelExport = useEditor((state) => state.modelExport)
   const shadows = useViewer((state) => state.shadows)
   const setPhase = useEditor((state) => state.setPhase)
   const floorplanMode = useFloorplanMode((state) => state.mode)
+  const registryVersion = useRegistryVersion()
+  const visibleOnlySwitchId = useId()
+  const includeNodeTypeIdPrefix = useId()
+  const includePresentationIdPrefix = useId()
   const [isGeneratingThumbnail, setIsGeneratingThumbnail] = useState(false)
+  const [exportOnlyVisible, setExportOnlyVisible] = useState(true)
+  const [excludedNodeTypes, setExcludedNodeTypes] = useState<string[]>([])
+  const [includedPresentationIds, setIncludedPresentationIds] = useState<string[]>([])
+  const [activeModelExport, setActiveModelExport] = useState<ModelExportFormat | null>(null)
+  const [modelExportError, setModelExportError] = useState<string | null>(null)
+  const [modelExportWarning, setModelExportWarning] = useState<string | null>(null)
+  const sendToBlenderStep = useSendToApp((state) => state.step)
+  const sendToBlenderMessage = useSendToApp((state) => state.message)
+  const setSendToBlenderStep = useSendToApp((state) => state.setStep)
+  const setSendToBlenderMessage = useSendToApp((state) => state.setMessage)
+  const [activeFloorplanExport, setActiveFloorplanExport] = useState<FloorplanExportScope | null>(
+    null,
+  )
+  const [floorplanExportError, setFloorplanExportError] = useState<string | null>(null)
   const [pendingImport, setPendingImport] = useState<PendingImport | null>(null)
+  const [projectIdCopyState, setProjectIdCopyState] = useState<'idle' | 'copied' | 'error'>('idle')
+  const exportableNodeTypes = useMemo(() => {
+    void registryVersion
+    const uniqueTypes = new Set(Object.values(nodes).map((node) => node.type))
+    const options: ExportableNodeType[] = []
+
+    for (const type of uniqueTypes) {
+      const definition = nodeRegistry.get(type)
+      if (
+        !(
+          definition?.bakeGeometry ||
+          definition?.bakeGeometryAsync ||
+          definition?.bake === 'replace'
+        ) ||
+        !isNodeKindEnabled(type, installedPlugins)
+      ) {
+        continue
+      }
+      options.push({
+        type,
+        label: definition.presentation?.label ?? type,
+        supportsGeometryOnly: !definition.bakeGeometryAsync || Boolean(definition.bakeGeometry),
+      })
+    }
+
+    return options.sort((a, b) => {
+      const labelOrder = a.label.localeCompare(b.label)
+      return labelOrder === 0 ? a.type.localeCompare(b.type) : labelOrder
+    })
+  }, [installedPlugins, nodes, registryVersion])
+  const registeredPresentations = useSyncExternalStore(
+    viewerPresentationRegistry.subscribe,
+    viewerPresentationRegistry.getSnapshot,
+    viewerPresentationRegistry.getSnapshot,
+  )
+  const exportablePresentations = useMemo(
+    () =>
+      registeredPresentations.filter(
+        (contribution) =>
+          contribution.staticExport &&
+          (!contribution.pluginId || installedPlugins.includes(contribution.pluginId)),
+      ),
+    [installedPlugins, registeredPresentations],
+  )
   const sceneGraphValue = useMemo(
     () => buildSceneGraphValue(nodes as Record<string, SceneNode>, rootNodeIds),
     [nodes, rootNodeIds],
@@ -211,10 +333,22 @@ export function SettingsPanel({
     }
   }, [])
 
+  useEffect(
+    () => () => {
+      if (copyResetTimeoutRef.current !== null) {
+        window.clearTimeout(copyResetTimeoutRef.current)
+      }
+    },
+    [],
+  )
+
   const isLocalProject = false // Props-based; only show cloud sections when projectId provided
 
   const handleSaveBuild = () => {
-    const sceneData = { nodes, rootNodeIds, installedPlugins }
+    // Materials ride along: nodes reference them by `scene:<id>` slot
+    // refs, so a save without the table produces a file whose custom
+    // finishes revert to defaults on the very Load Build path below.
+    const sceneData = { nodes, rootNodeIds, installedPlugins, materials, collections }
     const json = JSON.stringify(sceneData, null, 2)
     const blob = new Blob([json], { type: 'application/json' })
     const url = URL.createObjectURL(blob)
@@ -270,16 +404,17 @@ export function SettingsPanel({
     e.target.value = ''
   }
 
-  const handleConfirmImport = (parsed: {
-    nodes: Record<string, unknown>
-    rootNodeIds: string[]
-    installedPlugins?: string[]
-  }) => {
+  const handleConfirmImport = (parsed: ParsedBuildJson) => {
     const currentScene = useScene.getState()
     setScene(
       parsed.nodes as Parameters<typeof setScene>[0],
       parsed.rootNodeIds as Parameters<typeof setScene>[1],
       {
+        // Without this, every `scene:<id>` slot ref in the imported file
+        // pointed at a material that no longer existed — custom finishes
+        // silently reverted to defaults on import.
+        materials: parsed.materials,
+        collections: parsed.collections,
         installedPlugins: parsed.installedPlugins ?? currentScene.installedPlugins,
         hasExplicitPluginInstallState:
           parsed.installedPlugins !== undefined || currentScene.hasExplicitPluginInstallState,
@@ -310,6 +445,25 @@ export function SettingsPanel({
     setTimeout(() => setIsGeneratingThumbnail(false), 3000)
   }
 
+  const handleCopyProjectId = async () => {
+    if (!projectId) return
+    if (copyResetTimeoutRef.current !== null) {
+      window.clearTimeout(copyResetTimeoutRef.current)
+    }
+
+    try {
+      await navigator.clipboard.writeText(projectId)
+      setProjectIdCopyState('copied')
+    } catch {
+      setProjectIdCopyState('error')
+    }
+
+    copyResetTimeoutRef.current = window.setTimeout(() => {
+      setProjectIdCopyState('idle')
+      copyResetTimeoutRef.current = null
+    }, 2000)
+  }
+
   const handleVisibilityChange = async (
     field: 'isPrivate' | 'showScansPublic' | 'showGuidesPublic',
     value: boolean,
@@ -317,8 +471,161 @@ export function SettingsPanel({
     await onVisibilityChange?.(field, value)
   }
 
+  const handleNodeTypeInclusion = useCallback((type: string, included: boolean) => {
+    setExcludedNodeTypes((current) => {
+      const isExcluded = current.includes(type)
+      if (included) {
+        return isExcluded ? current.filter((excludedType) => excludedType !== type) : current
+      }
+      return isExcluded ? current : [...current, type]
+    })
+  }, [])
+  const handlePresentationInclusion = useCallback((id: string, included: boolean) => {
+    setIncludedPresentationIds((current) => {
+      const isIncluded = current.includes(id)
+      if (included) return isIncluded ? current : [...current, id]
+      return isIncluded ? current.filter((includedId) => includedId !== id) : current
+    })
+  }, [])
+
+  const handleModelExport = async (format: ModelExportFormat, label: string) => {
+    if (!modelExport || activeModelExport || useSendToApp.getState().step) return
+
+    setActiveModelExport(format)
+    setModelExportError(null)
+    setModelExportWarning(null)
+    try {
+      const artifact = await modelExport(format, {
+        onlyVisible: exportOnlyVisible,
+        excludedNodeTypes,
+        includedPresentationIds:
+          format === 'glb' || format === 'usdz'
+            ? includedPresentationIds.filter((id) =>
+                exportablePresentations.some((contribution) => contribution.id === id),
+              )
+            : [],
+      })
+      if (!artifact) {
+        throw new Error('Model export did not produce a file')
+      }
+      if (artifact.warnings?.length) setModelExportWarning(artifact.warnings.join(' '))
+    } catch (error) {
+      setModelExportError(
+        error instanceof Error ? error.message : `Couldn’t export ${label}. Try again.`,
+      )
+    } finally {
+      setActiveModelExport(null)
+    }
+  }
+
+  const handleSendToBlender = async () => {
+    if (!modelExport || activeModelExport || useSendToApp.getState().step) return
+
+    setSendToBlenderMessage(null)
+    setSendToBlenderStep('probing')
+    try {
+      const probe = await probeLocalApp()
+      if (probe.status === 'unreachable') {
+        setSendToBlenderMessage({
+          tone: 'error',
+          text: 'Blender isn’t listening. Open Blender with the Pascal add-on installed and enabled, then try again.',
+        })
+        return
+      }
+      if (probe.status === 'refused') {
+        setSendToBlenderMessage({
+          tone: 'error',
+          text: `Blender is open but hasn’t allowed ${window.location.origin} yet. In Blender, open the Pascal tab in the 3D viewport sidebar (N) and click Allow.`,
+        })
+        return
+      }
+
+      setSendToBlenderStep('exporting')
+      const artifact = await modelExport('glb', {
+        onlyVisible: exportOnlyVisible,
+        excludedNodeTypes,
+        includedPresentationIds: includedPresentationIds.filter((id) =>
+          exportablePresentations.some((contribution) => contribution.id === id),
+        ),
+        download: false,
+      })
+      if (!artifact) throw new Error('Model export did not produce a file')
+
+      setSendToBlenderStep('sending')
+      const queued = await sendGlbToLocalApp(probe.base, artifact.blob, {
+        name: projectName,
+        projectId,
+      })
+
+      setSendToBlenderStep('importing')
+      const done = await waitForLocalImport(probe.base, queued.id)
+      setSendToBlenderMessage({
+        tone: 'info',
+        text: done.summary ? `Sent to Blender. ${done.summary}.` : 'Sent to Blender.',
+      })
+    } catch (error) {
+      const text =
+        error instanceof LocalAppError || error instanceof Error
+          ? error.message
+          : 'Couldn’t send the scene to Blender. Try again.'
+      setSendToBlenderMessage({ tone: 'error', text })
+    } finally {
+      setSendToBlenderStep(null)
+    }
+  }
+
+  const handleFloorplanExport = async (scope: FloorplanExportScope) => {
+    if (activeFloorplanExport) return
+
+    setActiveFloorplanExport(scope)
+    setFloorplanExportError(null)
+    try {
+      await exportFloorplanPdf(scope)
+    } catch (error) {
+      setFloorplanExportError(
+        `Couldn’t export the floor plan. ${error instanceof Error ? error.message : 'Try again.'}`,
+      )
+    } finally {
+      setActiveFloorplanExport(null)
+    }
+  }
+
   return (
-    <div className="flex flex-col gap-6 p-3">
+    <div className="subtle-scrollbar min-h-0 flex-1 space-y-6 overflow-x-hidden overflow-y-auto overscroll-contain p-3">
+      {projectId && (
+        <div className="space-y-2">
+          <label className="font-medium text-muted-foreground text-xs uppercase">Project</label>
+          <div className="font-medium text-sm">Project ID</div>
+          <div className="flex items-center gap-2">
+            <Input
+              aria-label="Project ID"
+              className="font-mono text-xs"
+              readOnly
+              value={projectId}
+            />
+            <Button
+              aria-label={projectIdCopyState === 'copied' ? 'Project ID copied' : 'Copy project ID'}
+              className="rounded-full"
+              onClick={() => void handleCopyProjectId()}
+              size="sm"
+              type="button"
+              variant="outline"
+            >
+              {projectIdCopyState === 'copied' ? (
+                <Check className="size-3.5" />
+              ) : (
+                <Copy className="size-3.5" />
+              )}
+              {projectIdCopyState === 'copied'
+                ? 'Copied'
+                : projectIdCopyState === 'error'
+                  ? 'Try again'
+                  : 'Copy'}
+            </Button>
+          </div>
+        </div>
+      )}
+
       {/* Visibility Section (only for cloud projects) */}
       {projectId && !isLocalProject && (
         <div className="space-y-3">
@@ -331,6 +638,7 @@ export function SettingsPanel({
               </div>
             </div>
             <Switch
+              aria-label="Make project public"
               checked={!(projectVisibility?.isPrivate ?? false)}
               onCheckedChange={(checked) => handleVisibilityChange('isPrivate', !checked)}
             />
@@ -341,6 +649,7 @@ export function SettingsPanel({
               <div className="text-muted-foreground text-xs">Visible to public viewers</div>
             </div>
             <Switch
+              aria-label="Show 3D scans to public viewers"
               checked={projectVisibility?.showScansPublic ?? true}
               onCheckedChange={(checked) => handleVisibilityChange('showScansPublic', checked)}
             />
@@ -351,6 +660,7 @@ export function SettingsPanel({
               <div className="text-muted-foreground text-xs">Visible to public viewers</div>
             </div>
             <Switch
+              aria-label="Show floorplans to public viewers"
               checked={projectVisibility?.showGuidesPublic ?? true}
               onCheckedChange={(checked) => handleVisibilityChange('showGuidesPublic', checked)}
             />
@@ -361,6 +671,7 @@ export function SettingsPanel({
               <div className="text-muted-foreground text-xs">Cast shadows from lights</div>
             </div>
             <Switch
+              aria-label="Enable shadows"
               checked={shadows}
               onCheckedChange={(checked) => useViewer.getState().setShadows(checked)}
             />
@@ -374,30 +685,176 @@ export function SettingsPanel({
 
         <div className="space-y-2">
           <div className="font-medium text-muted-foreground text-xs">3D model</div>
-          <Button
-            className="w-full justify-start gap-2"
-            onClick={() => exportScene?.('glb')}
-            variant="outline"
+          <details
+            className="group"
+            onKeyDownCapture={(event) => {
+              // Keep Space available to the disclosure and switches, not canvas panning.
+              if (event.code === 'Space') event.stopPropagation()
+            }}
           >
-            <Download className="size-4" />
-            Export GLB
-          </Button>
-          <Button
-            className="w-full justify-start gap-2"
-            onClick={() => exportScene?.('stl')}
-            variant="outline"
-          >
-            <Download className="size-4" />
-            Export STL
-          </Button>
+            <summary className="flex min-h-10 cursor-pointer list-none items-center justify-between rounded-md border px-3 text-sm font-medium focus-visible:outline-2 focus-visible:outline-ring">
+              Export options
+              <ChevronDown aria-hidden="true" className="size-4 group-open:rotate-180" />
+            </summary>
+            <div className="space-y-3 pt-3">
+              <div className="flex items-center justify-between gap-4 rounded-md border p-3">
+                <div className="min-w-0">
+                  <label className="font-medium text-sm" htmlFor={visibleOnlySwitchId}>
+                    Visible nodes only
+                  </label>
+                  <div className="text-muted-foreground text-xs">
+                    Exclude hidden furniture and other hidden scene nodes
+                  </div>
+                </div>
+                <Switch
+                  aria-label="Export visible nodes only"
+                  checked={exportOnlyVisible}
+                  id={visibleOnlySwitchId}
+                  onCheckedChange={setExportOnlyVisible}
+                />
+              </div>
+
+              <fieldset className="space-y-2 rounded-md border p-3">
+                <legend className="px-1 font-medium text-sm">Include in file</legend>
+                <p className="text-muted-foreground text-xs">
+                  Choose which procedural content is baked into model files. GLB and USDZ use the
+                  textured portable path; STL and OBJ remain geometry-only.
+                </p>
+                {exportableNodeTypes.length > 0 ? (
+                  <div className="space-y-2 pt-1">
+                    {exportableNodeTypes.map(({ type, label, supportsGeometryOnly }, index) => {
+                      const switchId = `${includeNodeTypeIdPrefix}-${index}`
+                      return (
+                        <div className="flex items-center justify-between gap-4" key={type}>
+                          <label className="min-w-0 font-medium text-sm" htmlFor={switchId}>
+                            {label}
+                            {!supportsGeometryOnly && (
+                              <span className="text-muted-foreground text-xs"> (GLB/USDZ only)</span>
+                            )}
+                          </label>
+                          <Switch
+                            aria-label={`Include ${label} in model files`}
+                            checked={!excludedNodeTypes.includes(type)}
+                            id={switchId}
+                            onCheckedChange={(included) => handleNodeTypeInclusion(type, included)}
+                          />
+                        </div>
+                      )
+                    })}
+                  </div>
+                ) : (
+                  <p className="text-muted-foreground text-xs">
+                    No optional procedural content is present.
+                  </p>
+                )}
+                <p className="text-muted-foreground text-xs">
+                  Viewer surroundings are excluded unless selected separately below.
+                </p>
+              </fieldset>
+              {exportablePresentations.length > 0 ? (
+                <fieldset className="space-y-2 rounded-md border p-3">
+                  <legend className="px-1 font-medium text-sm">Viewer surroundings</legend>
+                  <p className="text-muted-foreground text-xs">
+                    Optional static surroundings are included only in GLB and USDZ.
+                  </p>
+                  <div className="space-y-2 pt-1">
+                    {exportablePresentations.map((contribution, index) => {
+                      const switchId = `${includePresentationIdPrefix}-${index}`
+                      const label = contribution.staticExport!.label
+                      return (
+                        <div
+                          className="flex items-center justify-between gap-4"
+                          key={contribution.id}
+                        >
+                          <label className="min-w-0 font-medium text-sm" htmlFor={switchId}>
+                            {label}
+                          </label>
+                          <Switch
+                            aria-label={`Include ${label} in GLB and USDZ`}
+                            checked={includedPresentationIds.includes(contribution.id)}
+                            id={switchId}
+                            onCheckedChange={(included) =>
+                              handlePresentationInclusion(contribution.id, included)
+                            }
+                          />
+                        </div>
+                      )
+                    })}
+                  </div>
+                </fieldset>
+              ) : null}
+            </div>
+          </details>
+
+          {MODEL_EXPORT_FORMATS.map(({ format, label }) => {
+            const isActive = activeModelExport === format
+            return (
+              <Button
+                aria-busy={isActive}
+                className="w-full justify-start gap-2"
+                disabled={activeModelExport !== null || sendToBlenderStep !== null || !modelExport}
+                key={format}
+                onClick={() => void handleModelExport(format, label)}
+                variant="outline"
+              >
+                <Download aria-hidden="true" className="size-4" />
+                {isActive ? `Exporting ${label}…` : `Export ${label}`}
+              </Button>
+            )
+          })}
+
           <Button
+            aria-busy={sendToBlenderStep !== null}
             className="w-full justify-start gap-2"
-            onClick={() => exportScene?.('obj')}
+            disabled={activeModelExport !== null || sendToBlenderStep !== null || !modelExport}
+            onClick={() => void handleSendToBlender()}
             variant="outline"
           >
-            <Download className="size-4" />
-            Export OBJ
+            <Send aria-hidden="true" className="size-4" />
+            {sendToBlenderStep ? SEND_TO_BLENDER_STEP_LABEL[sendToBlenderStep] : 'Send to Blender'}
           </Button>
+          <p className="text-muted-foreground text-xs">
+            Needs the{' '}
+            <a
+              className="underline underline-offset-2"
+              href={BLENDER_ADDON_URL}
+              rel="noreferrer"
+              target="_blank"
+            >
+              Pascal add-on for Blender
+            </a>{' '}
+            running in an open Blender.
+          </p>
+          {sendToBlenderMessage ? (
+            <p
+              className={
+                sendToBlenderMessage.tone === 'error'
+                  ? 'text-destructive text-xs'
+                  : 'text-foreground text-xs'
+              }
+              role={sendToBlenderMessage.tone === 'error' ? 'alert' : 'status'}
+            >
+              {sendToBlenderMessage.text}
+            </p>
+          ) : null}
+
+          {activeModelExport ? (
+            <p className="text-muted-foreground text-xs" role="status">
+              Preparing {activeModelExport.toUpperCase()} file…
+            </p>
+          ) : null}
+          {modelExportError ? (
+            <p className="text-destructive text-xs" role="alert">
+              {modelExportError}
+            </p>
+          ) : null}
+          {modelExportWarning ? (
+            <p className="text-foreground text-xs" role="status">
+              Warning: {modelExportWarning}
+            </p>
+          ) : null}
+
+          <PrintExportButton onlyVisible={exportOnlyVisible} />
         </div>
 
         <div className="space-y-2">
@@ -406,21 +863,35 @@ export function SettingsPanel({
             <span>{floorplanMode === 'default' ? 'Default mode' : 'Expert mode'}</span>
           </div>
           <Button
+            aria-busy={activeFloorplanExport === 'full'}
             className="w-full justify-start gap-2"
-            onClick={() => exportFloorplanPdf('full')}
+            disabled={activeFloorplanExport !== null}
+            onClick={() => void handleFloorplanExport('full')}
             variant="outline"
           >
             <MapIcon className="size-4" />
             Full floor plan
           </Button>
           <Button
+            aria-busy={activeFloorplanExport === 'structure'}
             className="w-full justify-start gap-2"
-            onClick={() => exportFloorplanPdf('structure')}
+            disabled={activeFloorplanExport !== null}
+            onClick={() => void handleFloorplanExport('structure')}
             variant="outline"
           >
             <MapIcon className="size-4" />
             Structure only
           </Button>
+          {activeFloorplanExport ? (
+            <p className="text-muted-foreground text-xs" role="status">
+              Preparing floor-plan PDF…
+            </p>
+          ) : null}
+          {floorplanExportError ? (
+            <p className="break-words text-destructive text-xs" role="alert">
+              {floorplanExportError}
+            </p>
+          ) : null}
         </div>
       </div>