Function TitleBar

packages/app-core/src/components/TitleBar.tsx:10–63

()

import { resolveSystemFolderLabels } from '../lib/system-folder-labels'

export function TitleBar(): JSX.Element {
  const vault = useStore((s) => s.vault)
  const activeNote = useStore((s) => s.activeNote)
  const selectedPath = useStore((s) => s.selectedPath)
  const systemFolderLabels = useStore((s) => s.systemFolderLabels)
  const workspaceMode = useStore((s) => s.workspaceMode)
  const isMac = window.zen.platformSync() === 'darwin'
  const labels = resolveSystemFolderLabels(systemFolderLabels)

  const title = activeNote
    ? activeNote.title
    : isQuickNotesTabPath(selectedPath)
      ? labels.quick
    : isTasksTabPath(selectedPath)
      ? labels.tasks
      : isTagsTabPath(selectedPath)
        ? 'Tags'
        : isHelpTabPath(selectedPath)
          ? 'Help'
          : isArchiveTabPath(selectedPath)
            ? labels.archive
          : isTrashTabPath(selectedPath)
            ? labels.trash
          : vault
            ? vault.name
            : 'ZenNotes'

  return (
    <div
      className="drag-region glass-titlebar flex h-11 shrink-0 items-center px-4 text-xs text-ink-500"
      style={{ paddingLeft: isMac ? 80 : 12 }}
    >
      <div className="flex flex-1 items-center justify-center gap-2 text-center tracking-wide">
        <span className="truncate">{title}</span>
        {workspaceMode === 'remote' && (
          <span className="rounded-full border border-paper-300/70 bg-paper-100/80 px-2 py-0.5 text-2xs font-medium uppercase tracking-[0.14em] text-ink-700">
            Remote
          </span>
        )}
      </div>
      {!isMac && (
        <div className="flex items-center gap-1">
          <WinButton onClick={() => window.zen.windowMinimize()} label="–" />
          <WinButton onClick={() => window.zen.windowToggleMaximize()} label="▢" />
          <WinButton
            onClick={() => window.zen.windowClose()}
            label="✕"
            className="hover:bg-red-500/90 hover:text-white"
          />
        </div>
      )}
    </div>
  )
}

function WinButton({
  onClick,