Skip to content
Open
Show file tree
Hide file tree
Changes from 11 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
3 changes: 3 additions & 0 deletions peek/src/components/AddDataPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,9 @@ export default function AddDataPage() {
selectedTechnology={state.selectedTechnology}
foundSignals={state.verifiedSignals}
selectedSignals={state.selectedSignals}
verification={state.verification}
connectionAvailable={Boolean(state.connectionAvailable)}
signalExpectation={state.signalExpectation}
onAddAnotherSource={state.handleAddAnotherSource}
onBack={() => state.setWizardStep(2)}
/>
Expand Down
45 changes: 42 additions & 3 deletions peek/src/components/addData/AddDataStepSuccess.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { useMemo } from "react";
import { useMemo, useState } from "react";
import { useNavigate } from "react-router-dom";
import Alert from "@mui/material/Alert";
import Button from "@mui/material/Button";
Expand All @@ -7,13 +7,18 @@ import Stack from "@mui/material/Stack";
import Typography from "@mui/material/Typography";

import type { AddDataTechnologyCatalogEntry } from "../../services/addData/catalog";
import type { IngestionVerificationState } from "../../hooks/useRichIngestionVerification";
import { SIGNAL_NAV } from "../../utils/addDataUtils";
import type { AddDataSuccessCta, TelemetrySignal } from "../../utils/addDataUtils";
import IngestionVerificationPanel from "./IngestionVerificationPanel";

interface AddDataStepSuccessProps {
selectedTechnology: AddDataTechnologyCatalogEntry | null;
foundSignals: Set<TelemetrySignal>;
selectedSignals: readonly TelemetrySignal[];
verification: IngestionVerificationState;
connectionAvailable: boolean;
signalExpectation: string;
onAddAnotherSource: () => void;
onBack: () => void;
}
Expand All @@ -22,6 +27,9 @@ export default function AddDataStepSuccess({
selectedTechnology,
foundSignals,
selectedSignals,
verification,
connectionAvailable,
signalExpectation,
onAddAnotherSource,
onBack,
}: AddDataStepSuccessProps) {
Expand Down Expand Up @@ -69,6 +77,22 @@ export default function AddDataStepSuccess({
}, [outcomeSignals.join(","), selectedTechnology]);

const techName = selectedTechnology?.technology ?? "Your source";
const [verifyClicked, setVerifyClicked] = useState(false);
const showInlineVerification =
verifyClicked && verification.status !== "idle" && verification.status !== "detected";

const handleVerifyNow = () => {
setVerifyClicked(true);
if (!connectionAvailable) return;
if (verification.status === "error") {
verification.resetVerification();
verification.startPolling();
} else if (verification.status === "idle") {
verification.startPolling();
} else {
verification.checkNow();
}
};

return (
<Paper variant="outlined" sx={{ display: "flex", flexDirection: "column", gap: 1.5, p: 1.5 }}>
Expand All @@ -78,12 +102,17 @@ export default function AddDataStepSuccess({
? `Data is flowing from ${techName}. Explore dashboards, set up alerting, or add another source.`
: `${techName} setup is complete, but data is not verified yet. Start your collector, then verify or explore now.`}
</Typography>
{outcomeSignals.length > 0 && (
{outcomeSignals.length > 0 && !showInlineVerification && (
<Alert
severity={hasVerifiedSignals ? "success" : "info"}
action={
!hasVerifiedSignals ? (
<Button color="inherit" size="small" onClick={onBack}>
<Button
color="inherit"
size="small"
onClick={handleVerifyNow}
disabled={!connectionAvailable}
>
Verify now
</Button>
) : undefined
Expand All @@ -94,6 +123,16 @@ export default function AddDataStepSuccess({
: `Expected signals: ${outcomeSignals.map((signal) => SIGNAL_NAV[signal].label).join(", ")}. Run your collector and verify again.`}
</Alert>
)}
{showInlineVerification && (
<IngestionVerificationPanel
technologyName={techName}
signalExpectation={signalExpectation}
expectedSignals={selectedSignals}
verification={verification}
connectionAvailable={connectionAvailable}
autoStart={false}
/>
)}
<Stack direction="row" spacing={1} flexWrap="wrap" useFlexGap>
{outcomeCtas.map((cta, index) => (
<Button
Expand Down
Loading