pastilhasandClaude Opus 5
3dd4dd6592
THE TOP WAS THREE ROWS OF FURNITURE before any content: the workspace's chrome header saying "Detail", the panel's own strip saying "Media — Photos and video the site is built from", and then the browser's toolbar. a panel meta may supply its own `header`, which is the mechanism for exactly this and which gitea, invoices and desktop already use. so the section's name goes where a panel's name goes, and the strip inside is gone. "Detail" was never information — the panel is the detail panel, and the useful word is which section is open. the hint went with it. "Photos and video the site is built from" earns its place in the NAV, where somebody is choosing between ten sections. repeated above the one they chose, it is a caption for a decision already made. AND THE FOLDER IS IN THE QUERY STRING. `urlPath` puts it in `?path=`, so a reload lands where you were and a link can be sent to somebody — which for a media folder somebody else uploads into is the point. it is opt-in in the platform because a screen with two browsers would have them fighting over one parameter; this screen has one. `panelId` stays alongside it: the URL covers a reload or a shared link, and panelId covers a panel re-opened later, which the URL cannot. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
34 lines
1.3 KiB
TypeScript
34 lines
1.3 KiB
TypeScript
import { useSearchParams } from 'react-router';
|
|
import { DEFAULT_SECTION, isSectionKey, sectionFor } from './sections';
|
|
|
|
/**
|
|
* The detail panel's chrome header — the section's own name, not the word "Detail".
|
|
*
|
|
* ── Why this replaces a row inside the panel ──
|
|
*
|
|
* The panel used to draw its own header strip with the section label and its hint, UNDER the workspace's
|
|
* chrome header, which said "Detail". Two bars stacked, one of them saying nothing: the top of the panel
|
|
* was three rows of furniture before any content.
|
|
*
|
|
* A panel meta may supply its own `header`, which is the mechanism for exactly this — several plugins
|
|
* already do it. So the section's name goes where a panel's name goes, and the row inside is gone.
|
|
*
|
|
* ── The hint went with it ──
|
|
*
|
|
* "Photos and video the site is built from" is useful in the NAV, where somebody is choosing between
|
|
* ten sections. Repeated above the thing they chose, it is a caption for a decision already made.
|
|
*/
|
|
export const DetailHeader = () => {
|
|
const [params] = useSearchParams();
|
|
const raw = params.get('section');
|
|
const section = sectionFor(isSectionKey(raw) ? raw : DEFAULT_SECTION);
|
|
const Icon = section.icon;
|
|
|
|
return (
|
|
<>
|
|
<Icon className="h-3.5 w-3.5 shrink-0" />
|
|
<span className="flex-1 truncate text-xs font-medium">{section.label}</span>
|
|
</>
|
|
);
|
|
};
|