Clément Fiere
37 lines
1.6 KiB
TypeScript
37 lines
1.6 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { DockviewDefaultTab, type IDockviewPanelHeaderProps } from "dockview-react";
|
|
import { pluginRegistry, usePluginRegistry } from "@/lib/plugins/registry";
|
|
import { resolvePluginIcon } from "@/lib/plugins/icons";
|
|
import { resolveTaskPanelTitle } from "@/lib/state/layout-manager/plugin-panels";
|
|
|
|
/**
|
|
* Tab chrome for a plugin task panel: the plugin's curated icon (if any)
|
|
* beside the default title/close chrome, mirroring `plan-tab.tsx`'s
|
|
* structure. `params.pluginId`/`params.panelKey` identify which
|
|
* registration to read the icon from — the title itself is owned by
|
|
* dockview's `api.title`, set from the registration when the panel opens.
|
|
*/
|
|
export function PluginPanelTab(props: IDockviewPanelHeaderProps) {
|
|
usePluginRegistry();
|
|
const { i18n } = useTranslation();
|
|
const pluginId = props.params?.pluginId as string | undefined;
|
|
const panelKey = props.params?.panelKey as string | undefined;
|
|
const registration =
|
|
pluginId && panelKey ? pluginRegistry.getTaskPanel(pluginId, panelKey) : undefined;
|
|
const Icon = resolvePluginIcon(registration?.icon);
|
|
const title = registration ? resolveTaskPanelTitle(registration, i18n) : (props.api.title ?? "");
|
|
useEffect(() => {
|
|
if (title && props.api.title !== title) props.api.setTitle(title);
|
|
}, [props.api, title]);
|
|
|
|
return (
|
|
<div data-testid="plugin-panel-tab" className="relative flex items-center gap-1.5">
|
|
<Icon className="ml-2 size-3.5 shrink-0 text-muted-foreground" />
|
|
<DockviewDefaultTab {...props} />
|
|
</div>
|
|
);
|
|
}
|