63 lines
1.9 KiB
TypeScript
63 lines
1.9 KiB
TypeScript
import { ProjectNodeToolTipProps } from '@nrwl/graph/ui-tooltips';
|
|
import { getProjectGraphService } from '../machines/get-services';
|
|
import { useRouteConstructor } from '../util';
|
|
import { useNavigate } from 'react-router-dom';
|
|
import { TooltipButton, TooltipLinkButton } from '@nrwl/graph/ui-tooltips';
|
|
import { FlagIcon, MapPinIcon } from '@heroicons/react/24/solid';
|
|
|
|
export function ProjectNodeActions({ id }: ProjectNodeToolTipProps) {
|
|
const projectGraphService = getProjectGraphService();
|
|
const { start, end, algorithm } =
|
|
projectGraphService.getSnapshot().context.tracing;
|
|
const routeConstructor = useRouteConstructor();
|
|
const navigate = useNavigate();
|
|
const encodedId = encodeURIComponent(id);
|
|
|
|
function onExclude() {
|
|
projectGraphService.send({
|
|
type: 'deselectProject',
|
|
projectName: id,
|
|
});
|
|
navigate(routeConstructor('/projects', true));
|
|
}
|
|
|
|
function onStartTrace() {
|
|
navigate(routeConstructor(`/projects/trace/${encodedId}`, true));
|
|
}
|
|
|
|
function onEndTrace() {
|
|
navigate(
|
|
routeConstructor(
|
|
`/projects/trace/${encodeURIComponent(start)}/${encodedId}`,
|
|
true
|
|
)
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="grid grid-cols-3 gap-4">
|
|
<TooltipLinkButton to={routeConstructor(`/projects/${encodedId}`, true)}>
|
|
Focus
|
|
</TooltipLinkButton>
|
|
<TooltipButton onClick={onExclude}>Exclude</TooltipButton>
|
|
{!start ? (
|
|
<TooltipButton
|
|
className="flex flex-row items-center"
|
|
onClick={onStartTrace}
|
|
>
|
|
<MapPinIcon className="mr-2 h-5 w-5 text-slate-500"></MapPinIcon>
|
|
Start
|
|
</TooltipButton>
|
|
) : (
|
|
<TooltipButton
|
|
className="flex flex-row items-center"
|
|
onClick={onEndTrace}
|
|
>
|
|
<FlagIcon className="mr-2 h-5 w-5 text-slate-500"></FlagIcon>
|
|
End
|
|
</TooltipButton>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|