Something went wrong. Try again.
A local-first note taking app
Something went wrong. Try again.
1.6 kB · 48 lines
TSX
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849import { DocumentSlotView } from '../../editors/DocumentSlotView';import { useDocumentSlot } from '../../documents/useDocumentSlot';import { useDocumentTitle } from '../../documents/useDocumentTitle';import { WorkspaceBarSlot } from '../barSlot';import type { WorkspaceProps } from '../workspace';
export function ZenWorkspace({ active, openRequestId, openRequest, resolveProvider,}: WorkspaceProps) { const { state, close } = useDocumentSlot({ openRequestId, openRequest, resolveProvider, accepts: active, });
const handle = state.kind === 'open' ? state.handle : null; const title = useDocumentTitle(handle);
return ( <> <div className="flex h-full min-h-0 w-full flex-col overflow-hidden p-2"> <DocumentSlotView state={state} className="min-h-0 flex-1" /> </div> <WorkspaceBarSlot> <div className="text-foreground/70 min-w-0 flex-1 truncate text-xs"> {state.kind === 'empty' ? 'Zen · no document open' : state.kind === 'open' ? title || state.request.title : state.request.title} </div> {state.kind !== 'empty' ? ( <button type="button" onClick={close} className="border-border bg-background text-foreground hover:bg-border/30 focus-visible:ring-accent/50 shrink-0 rounded border px-2 py-1 text-xs outline-none focus-visible:ring-2" > Close </button> ) : null} </WorkspaceBarSlot> </> );}