github/oneuptime
1
1
Fork 0
mirror of https://github.com/OneUptime/oneuptime.git synced 2026-04-06 00:32:12 +02:00
Code Issues 193 Packages Projects Releases Wiki Activity

refactor: Update telemetry service fetching logic in MonitorStepElement

Browse Source
This commit is contained in:
Simon Larsen
2024-08-15 16:34:25 +01:00
parent 946e53b5c5
commit 183ff170ae
4 changed files with 48 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
Dashboard/src/Components/Form/Monitor/MonitorStep.tsx
View File

@@ -78,9 +78,6 @@ const MonitorStepElement: FunctionComponent<ComponentProps> = (
props.initialValue || new MonitorStep(),
);
const [monitorStepTraceMonitor, setMonitorStepTraceMonitor] =
useState<MonitorStepTraceMonitor>(MonitorStepTraceMonitorUtil.getDefault());
const [telemetryServices, setTelemetryServices] = useState<
Array<TelemetryService>
>([]);
@@ -557,12 +554,14 @@ const MonitorStepElement: FunctionComponent<ComponentProps> = (
{props.monitorType === MonitorType.Traces && (
<div className="mt-5">
<TraceMonitorStepForm
monitorStepTraceMonitor={monitorStepTraceMonitor}
monitorStepTraceMonitor={
monitorStep.data?.traceMonitor ||
MonitorStepTraceMonitorUtil.getDefault()
}
onMonitorStepTraceMonitorChanged={(
value: MonitorStepTraceMonitor,
) => {
monitorStep.setTraceMonitor(value);
setMonitorStepTraceMonitor(value);
setMonitorStep(MonitorStep.clone(monitorStep));
}}
attributeKeys={attributeKeys}

24
Dashboard/src/Components/Monitor/MonitorSteps/MonitorStep.tsx
View File

@@ -32,6 +32,7 @@ import Includes from "Common/Types/BaseDatabase/Includes";
import OneUptimeDate from "Common/Types/Date";
import TelemetryServicesElement from "../../TelemetryService/TelemetryServiceElements";
import { SpanStatus } from "Common/Models/AnalyticsModels/Span";
import ObjectID from "Common/Types/ObjectID";
export interface ComponentProps {
monitorStatusOptions: Array<MonitorStatus>;
@@ -89,13 +90,27 @@ const MonitorStepElement: FunctionComponent<ComponentProps> = (
const fetchTelemetryServices: PromiseVoidFunction =
async (): Promise<void> => {
let telemetryServiceIds: Array<ObjectID> = [];
// if the monitor is a log monitor
if (props.monitorStep.data?.logMonitor && props.monitorType === MonitorType.Logs) {
telemetryServiceIds = props.monitorStep.data?.logMonitor?.telemetryServiceIds || [];
}
// if the monitor is a trace monitor
if (props.monitorStep.data?.traceMonitor && props.monitorType === MonitorType.Traces) {
telemetryServiceIds = props.monitorStep.data?.traceMonitor?.telemetryServiceIds || [];
}
const telemetryServicesResult: ListResult<TelemetryService> =
await ModelAPI.getList<TelemetryService>({
modelType: TelemetryService,
query: {
projectId: DashboardNavigation.getProjectId(),
_id: new Includes(
props.monitorStep.data?.logMonitor?.telemetryServiceIds || [],
telemetryServiceIds
),
},
limit: LIMIT_PER_PROJECT,
@@ -462,6 +477,13 @@ const MonitorStepElement: FunctionComponent<ComponentProps> = (
fields={logFields}
/>
)}
{traceFields && traceFields.length > 0 && (
<Detail<TraceMonitorStepView>
id={"monitor-traces"}
item={traceMonitorDetailView}
fields={traceFields}
/>
)}
</div>
<HorizontalRule />

8
Dashboard/src/Pages/Incidents/View/Index.tsx
View File

@@ -47,6 +47,7 @@ import Card from "Common/UI/Components/Card/Card";
import DashboardLogsViewer from "../../../Components/Logs/LogsViewer";
import TelemetryType from "Common/Types/Telemetry/TelemetryType";
import JSONFunctions from "Common/Types/JSONFunctions";
import TraceTable from "../../../Components/Traces/TraceTable";
const IncidentView: FunctionComponent<
PageComponentProps
@@ -699,6 +700,13 @@ const IncidentView: FunctionComponent<
</Card>
</div>
)}
{telemetryQuery &&
telemetryQuery.telemetryType === TelemetryType.Trace && (
<div>
<TraceTable spanQuery={telemetryQuery.telemetryQuery} />
</div>
)}
</Fragment>
);
};

30
Dashboard/src/Pages/Monitor/View/Index.tsx
View File

@@ -64,7 +64,8 @@ import useAsyncEffect from "use-async-effect";
import RouteMap, { RouteUtil } from "../../../Utils/RouteMap";
import PageMap from "../../../Utils/PageMap";
import LogMonitorPreview from "../../../Components/Monitor/LogMonitor/LogMonitorPreview";
import TraceMonitorPreview from "../../../Components/Monitor/TraceMonitor/TraceMonitorPreview";
import TraceTable from "../../../Components/Traces/TraceTable";
import { MonitorStepTraceMonitorUtil } from "Common/Types/Monitor/MonitorStepTraceMonitor";
const MonitorView: FunctionComponent<PageComponentProps> = (): ReactElement => {
const modelId: ObjectID = Navigation.getLastParamAsObjectID();
@@ -641,22 +642,17 @@ const MonitorView: FunctionComponent<PageComponentProps> = (): ReactElement => {
{monitor?.monitorType === MonitorType.Traces &&
monitor.monitorSteps &&
monitor.monitorSteps.data?.monitorStepsInstanceArray &&
monitor.monitorSteps.data?.monitorStepsInstanceArray.length > 0 && (
<div>
<Card
title={"Spans Preview"}
description={
"Preview of the spans that match the filter of this monitor."
}
>
<TraceMonitorPreview
monitorStepTraceMonitor={
monitor.monitorSteps.data?.monitorStepsInstanceArray[0]?.data
?.traceMonitor
}
/>
</Card>
</div>
monitor.monitorSteps.data?.monitorStepsInstanceArray.length > 0 &&
monitor.monitorSteps.data?.monitorStepsInstanceArray[0] &&
monitor.monitorSteps.data?.monitorStepsInstanceArray[0]!.data &&
monitor.monitorSteps.data?.monitorStepsInstanceArray[0]!.data!
.traceMonitor && (
<TraceTable
spanQuery={MonitorStepTraceMonitorUtil.toQuery(
monitor.monitorSteps.data?.monitorStepsInstanceArray[0]!.data!
.traceMonitor!,
)}
/>
)}
{shouldFetchMonitorMetrics && getMonitorMetricsChartGroup()}