Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -10,16 +10,16 @@ export const AgentFlowChartNodeToolbar = ({
position,
isEditMode,
onAddMCPServer,
onEditMCPServer,
onSetMCPServer,
onDeleteMCPServer,
showPlusButton
}: AgentFlowChartNodeToolbarProps) => {
const handleAddMCPServer = () => {
onAddMCPServer();
};

const handleEditMCPServer = (server: string) => {
onEditMCPServer(server);
const handleSetMCPServer = (server: string) => {
onSetMCPServer(server);
};

const handleDeleteMCPServer = (server: string) => {
Expand All @@ -32,7 +32,7 @@ export const AgentFlowChartNodeToolbar = ({
<MCPServersToolbar
key={"mcp-servers-toolbar"}
servers={servers}
onEditMCPServer={handleEditMCPServer}
onSetMCPServer={handleSetMCPServer}
onDeleteMCPServer={handleDeleteMCPServer}
/>
]
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ export interface AgentFlowChartNodeToolbarProps {
position: Position;
servers: ExtendedAgentMCPServer[];
onAddMCPServer: () => void;
onEditMCPServer: (server: string) => void;
onSetMCPServer: (server: string) => void;
onDeleteMCPServer: (server: string) => void;
showPlusButton?: boolean;
}
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ import type { MCPServersToolbarProps } from "./types";

export const MCPServersToolbar = ({
servers,
onEditMCPServer,
onSetMCPServer,
onDeleteMCPServer
}: MCPServersToolbarProps) => {
const [isKebabMenuOpen, setIsKebabMenuOpen] = useState(false);
Expand Down Expand Up @@ -48,9 +48,9 @@ export const MCPServersToolbar = ({
);

switch (id) {
case "edit": {
case "set": {
if (selectedMCPServer) {
onEditMCPServer(selectedMCPServer);
onSetMCPServer(selectedMCPServer);
}
break;
}
Expand All @@ -67,10 +67,10 @@ export const MCPServersToolbar = ({

const kebabMenuItems: MenuItem[] = [
{
id: "edit",
id: "set",
icon: <WrenchIcon size={16} color={"currentColor"} />,
label: "Edit",
onClick: () => handleKebabMenuItemClick("edit")
label: "Set",
onClick: () => handleKebabMenuItemClick("set")
},
{
id: "delete",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import type { ExtendedAgentMCPServer } from "../types";

export interface MCPServersToolbarProps {
servers: ExtendedAgentMCPServer[];
onEditMCPServer: (server: string) => void;
onSetMCPServer: (server: string) => void;
onDeleteMCPServer: (server: string) => void;
}

Expand Down
20 changes: 10 additions & 10 deletions src/components/Agentic/IncidentDetails/AgentFlowChart/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,15 +15,15 @@ const getFlowChartNodeData = ({
isInteractive,
isEditMode,
onAddMCPServer,
onEditMCPServer,
onSetMCPServer,
onDeleteMCPServer
}: {
agent?: ExtendedAgent;
isInteractive?: boolean;
isSelected?: boolean;
isEditMode?: boolean;
onAddMCPServer?: (agentName: string) => void;
onEditMCPServer?: (agentName: string, server: string) => void;
onSetMCPServer?: (agentName: string, server: string) => void;
onDeleteMCPServer?: (agentName: string, server: string) => void;
}): Partial<FlowChartNodeData> => {
const handleAddMCPServer = () => {
Expand All @@ -41,12 +41,12 @@ const getFlowChartNodeData = ({
onAddMCPServer?.(agent.name);
};

const handleEditMCPServer = (server: string) => {
const handleSetMCPServer = (server: string) => {
if (!agent) {
return;
}

onEditMCPServer?.(agent.name, server);
onSetMCPServer?.(agent.name, server);
};

const handleDeleteMCPServer = (server: string) => {
Expand Down Expand Up @@ -78,7 +78,7 @@ const getFlowChartNodeData = ({
position={sideContainerPosition}
servers={agent.mcp_servers}
onAddMCPServer={handleAddMCPServer}
onEditMCPServer={handleEditMCPServer}
onSetMCPServer={handleSetMCPServer}
onDeleteMCPServer={handleDeleteMCPServer}
showPlusButton={isEditMode}
/>
Expand All @@ -97,7 +97,7 @@ export const AgentFlowChart = ({
className,
isEditMode,
onAddMCPServer,
onEditMCPServer,
onSetMCPServer,
onDeleteMCPServer
}: AgentFlowChartProps) => {
const extendedAgents: ExtendedAgent[] = [
Expand Down Expand Up @@ -177,7 +177,7 @@ export const AgentFlowChart = ({
"skipped",
isEditMode,
onAddMCPServer,
onEditMCPServer,
onSetMCPServer,
onDeleteMCPServer
})
}
Expand All @@ -194,7 +194,7 @@ export const AgentFlowChart = ({
"skipped",
isEditMode,
onAddMCPServer,
onEditMCPServer,
onSetMCPServer,
onDeleteMCPServer
})
}
Expand All @@ -211,7 +211,7 @@ export const AgentFlowChart = ({
"skipped",
isEditMode,
onAddMCPServer,
onEditMCPServer,
onSetMCPServer,
onDeleteMCPServer
})
}
Expand All @@ -228,7 +228,7 @@ export const AgentFlowChart = ({
"skipped",
isEditMode,
onAddMCPServer,
onEditMCPServer,
onSetMCPServer,
onDeleteMCPServer
})
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ export interface AgentFlowChartProps {
className?: string;
isEditMode?: boolean;
onAddMCPServer?: (agentId: string) => void;
onEditMCPServer?: (agentId: string, server: string) => void;
onSetMCPServer?: (agentId: string, server: string) => void;
onDeleteMCPServer?: (agentId: string, server: string) => void;
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -36,9 +36,7 @@ export const MCPServerDialog = ({
onComplete
}: MCPServerDialogProps) => {
const [currentStep, setCurrentStep] = useState(0);
const [connectionSettings, setConnectionSettings] = useState(
serverData?.config ?? ""
);
const [connectionSettings, setConnectionSettings] = useState("");
const [testServerError, setTestServerError] = useState<string>();
const [addServerError, setAddServerError] = useState<string>();

Expand Down
4 changes: 2 additions & 2 deletions src/components/Agentic/IncidentTemplate/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@ export const IncidentTemplate = () => {
setAgentIdToUpdate(agentId);
};

const handleEditMCPServer = (agentId: string, serverName: string) => {
const handleSetMCPServer = (agentId: string, serverName: string) => {
const serverId = mcpServers?.mcps.find((x) => x.name === serverName)?.uid;

if (!serverId) {
Expand Down Expand Up @@ -184,7 +184,7 @@ export const IncidentTemplate = () => {
selectedAgentId={agentId}
isEditMode={true}
onAddMCPServer={handleAddMCPServer}
onEditMCPServer={handleEditMCPServer}
onSetMCPServer={handleSetMCPServer}
onDeleteMCPServer={handleDeleteMCPServer}
/>
<s.StyledAgentPromptInput
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,12 @@ import { useStore } from "../../../../../store/useStore";
import { isNull } from "../../../../../typeGuards/isNull";
import { isString } from "../../../../../typeGuards/isString";
import { openJaegerTraceInDefaultBrowser } from "../../../../../utils/actions/openJaegerTraceInDefaultBrowser";
import { openURLInDefaultBrowser } from "../../../../../utils/actions/openURLInDefaultBrowser";
import { sendUserActionTrackingEvent } from "../../../../../utils/actions/sendUserActionTrackingEvent";
import { getIdeLauncherLinkForError } from "../../../../../utils/getIdeLauncherLinkForError";
import { openBrowserTabWithContent } from "../../../../../utils/openBrowserTabWithContent";
import { TraceIcon } from "../../../../common/icons/16px/TraceIcon";
import { CodeIcon } from "../../../../common/icons/CodeIcon";
import { NewButton } from "../../../../common/v3/NewButton";
import { ToggleSwitch } from "../../../../common/v3/ToggleSwitch";
import { Tooltip } from "../../../../common/v3/Tooltip";
Expand All @@ -36,7 +39,7 @@ const filesURIsDataFetcherConfiguration: DataFetcherConfiguration = {
refreshOnPayloadChange: true
};

export const FlowStack = ({ data }: FlowStackProps) => {
export const FlowStack = ({ data, errorId }: FlowStackProps) => {
const { errorDetailsWorkspaceItemsOnly: showWorkspaceOnly } =
useErrorsSelector();
const { setErrorDetailsWorkspaceItemsOnly } = useStore.getState();
Expand Down Expand Up @@ -121,6 +124,15 @@ export const FlowStack = ({ data }: FlowStackProps) => {
}
};

const handleIdeButtonClick = () => {
sendUserActionTrackingEvent(trackingEvents.OPEN_IN_IDE_BUTTON_CLICKED);
const errorIdeLauncherLink = getIdeLauncherLinkForError(errorId);

if (errorIdeLauncherLink) {
openURLInDefaultBrowser(errorIdeLauncherLink);
}
};

const handleWorkspaceOnlyToggleSwitchChange = (value: boolean) => {
sendUserActionTrackingEvent(trackingEvents.WORKSPACE_ONLY_TOGGLE_SWITCHED, {
value
Expand Down Expand Up @@ -220,6 +232,11 @@ export const FlowStack = ({ data }: FlowStackProps) => {
isDisabled={isNull(traceId)}
/>
</Tooltip>
{platform === "Web" && (
<Tooltip title={"Open in IDE"}>
<NewButton icon={CodeIcon} onClick={handleIdeButtonClick} />
</Tooltip>
)}
</s.FooterButtonsContainer>
</s.Footer>
</s.Container>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import type { ErrorFlowInfo } from "../../../../../redux/services/types";

export interface FlowProps {
data: ErrorFlowInfo;
errorId: string;
}

export interface ShowOnlyWorkspaceErrorStackTraceItemsPayload {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -119,7 +119,7 @@ export const ErrorDetailsCardContent = ({
</s.IconButton>
</s.FlowPagination>
{flows.length > 0 && (
<FlowStack data={currentFlow} key={currentFlowStack} />
<FlowStack errorId={id} data={currentFlow} key={currentFlowStack} />
)}
</s.FlowsContainer>
</s.Container>
Expand Down
25 changes: 25 additions & 0 deletions src/components/Errors/NewErrorCard/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,16 +2,20 @@ import { useEffect, useMemo, useRef, useState } from "react";
import { CSSTransition } from "react-transition-group";
import { getFeatureFlagValue } from "../../../featureFlags";
import { usePrevious } from "../../../hooks/usePrevious";
import { platform } from "../../../platform";
import { ViewMode } from "../../../store/errors/errorsSlice";
import { useErrorsSelector } from "../../../store/errors/useErrorsSelector";
import { useStore } from "../../../store/useStore";
import { FeatureFlag } from "../../../types";
import { openURLInDefaultBrowser } from "../../../utils/actions/openURLInDefaultBrowser";
import { sendUserActionTrackingEvent } from "../../../utils/actions/sendUserActionTrackingEvent";
import { getIdeLauncherLinkForError } from "../../../utils/getIdeLauncherLinkForError";
import {
AffectedEndpointsSelector,
getEndpointKey
} from "../../common/AffectedEndpointsSelector";
import type { Option } from "../../common/AffectedEndpointsSelector/types";
import { CodeIcon } from "../../common/icons/16px/CodeIcon";
import { HistogramIcon } from "../../common/icons/16px/HistogramIcon";
import { PinFillIcon } from "../../common/icons/16px/PinFillIcon";
import { PinIcon } from "../../common/icons/16px/PinIcon";
Expand Down Expand Up @@ -180,6 +184,17 @@ export const NewErrorCard = ({
setIsHistogramVisible(!isHistogramVisible);
};

const handleIdeButtonClick = () => {
sendUserActionTrackingEvent(
trackingEvents.ERROR_CARD_OPEN_IN_IDE_BUTTON_CLICKED
);
const errorIdeLauncherLink = getIdeLauncherLinkForError(id);

if (errorIdeLauncherLink) {
openURLInDefaultBrowser(errorIdeLauncherLink);
}
};

const handlePinUnpinButtonClick = () => {
const value = !data.pinnedAt;
sendUserActionTrackingEvent(
Expand Down Expand Up @@ -246,6 +261,16 @@ export const NewErrorCard = ({
onClick={handleHistogramButtonClick}
/>
]
: []),
...(platform === "Web"
? [
<NewIconButton
key={"ide"}
buttonType={"secondaryBorderless"}
icon={CodeIcon}
onClick={handleIdeButtonClick}
/>
]
: [])
];

Expand Down
3 changes: 3 additions & 0 deletions src/components/Errors/tracking.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ export const trackingEvents = addPrefix(
BACK_BUTTON_CLICKED: "back button clicked",
FLOW_PAGINATION_BUTTON_CLICKED: "flow pagination button clicked",
TRACE_BUTTON_CLICKED: "trace button clicked",
OPEN_IN_IDE_BUTTON_CLICKED: "open in ide button clicked",
ERROR_STACK_TRACE_ITEM_CLICKED: "error stack trace item clicked",
RAW_ERROR_STACK_TRACE_BUTTON_CLICKED:
"raw error stack trace button clicked",
Expand Down Expand Up @@ -43,6 +44,8 @@ export const trackingEvents = addPrefix(
"error card affected endpoint link clicked",
ERROR_CARD_HISTOGRAM_BUTTON_CLICKED: "error card histogram button clicked",
ERROR_CARD_PIN_UNPIN_BUTTON_CLICKED: "error card pin unpin button clicked",
ERROR_CARD_OPEN_IN_IDE_BUTTON_CLICKED:
"error card open in ide button clicked",
ERROR_CARD_DISMISS_BUTTON_CLICKED: "error card dismiss button clicked",
ERROR_CARD_PIN_UNDISMISS_BUTTON_CLICKED:
"error card pin undismiss button clicked"
Expand Down
1 change: 0 additions & 1 deletion src/redux/services/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -1253,7 +1253,6 @@ export interface ExtendedGetDirectivesChatEventsResponse {
export interface MCPServerData {
uid: string;
name: string;
config: string;
agents: string[];
editable: boolean;
selected_tools: string[];
Expand Down
Loading