detailpanel

2025-11-01 19:39:51 +01:00
parent 366f716b1c
commit 03bc311403
5 changed files with 142 additions and 52 deletions
@@ -21,6 +21,7 @@ import DocumentSummarySection, {
  sortCorrespondents,
  buildCorrespondentOptions,
 } from '../documents/DocumentSummarySection';
+import BreadcrumbTrail from '../ui/BreadcrumbTrail';

 const MAX_PREVIEW_STACK_ITEMS = 15;

@@ -192,6 +193,39 @@ const DetailPanel = ({
    return `${selectedCount} document${selectedCount === 1 ? '' : 's'}`;
  }, [selectedCount, detailSummary]);

+  const headerBreadcrumbs = useMemo(() => {
+    if (selectedCount !== 1 || !singleDoc || typeof resolveFolderPath !== 'function') {
+      return null;
+    }
+
+    const handleNavigate = (folderId) => {
+      if (!folderId || typeof onFolderNavigate !== 'function') {
+        return;
+      }
+      onFolderNavigate(folderId);
+    };
+
+    const folderSegments = resolveFolderPath(singleDoc.folder_id);
+    const normalizedSegments = Array.isArray(folderSegments)
+      ? folderSegments
+          .filter((segment) => segment && segment.id && segment.name)
+          .map((segment) => ({
+            id: segment.id,
+            label: segment.name,
+            onClick: segment.id ? () => handleNavigate(segment.id) : null,
+          }))
+      : [];
+
+    const documentLabel = detailSummary.title || 'Document';
+    return [
+      ...normalizedSegments,
+      {
+        id: singleDoc.id || 'current-document',
+        label: documentLabel,
+      },
+    ];
+  }, [selectedCount, singleDoc, resolveFolderPath, detailSummary, onFolderNavigate]);
+
  const [zoomedPreview, setZoomedPreview] = useState(null);

  const bulkDocumentIds = useMemo(
@@ -933,7 +967,18 @@ const DetailPanel = ({
      <aside className="detail-panel panel">
        <PanelHeader
          leading={headerLeading}
-          title={headerTitle}
+          title={
+            headerBreadcrumbs ? (
+              <BreadcrumbTrail
+                entries={headerBreadcrumbs}
+                separator="/"
+                className="panel-header__breadcrumbs"
+                truncateFromStart
+              />
+            ) : (
+              headerTitle
+            )
+          }
          titleTag="h3"
          actions={headerActions.length ? headerActions : null}
        />