@airplane/views
Version:
A React library for building Airplane views. Views components are optimized in style and functionality to produce internal apps that are easy to build and maintain.
100 lines (99 loc) • 3.36 kB
JavaScript
import { jsxs, jsx } from "react/jsx-runtime";
import { createStyles } from "@mantine/core";
import { useCallback } from "react";
import { ButtonComponent } from "../button/Button.js";
import { CalloutComponent } from "../callout/Callout.js";
import { CodeInput } from "../codeinput/CodeInput.js";
import { HeadingComponent } from "../heading/Heading.js";
import { XCircleIconMini } from "@airplane/views/icons/index.js";
import { getFullQuery } from "../query.js";
import { StackComponent } from "../stack/Stack.js";
import { sendViewMessage } from "../../message/sendViewMessage.js";
const useStyles = createStyles((theme) => ({
runBadge: {
borderRadius: theme.radius.md,
backgroundColor: theme.colors.gray[1],
color: theme.colors.gray[6],
fontFamily: theme.fontFamilyMonospace,
fontSize: theme.fontSizes.xs,
fontWeight: 700,
paddingTop: 2,
paddingBottom: 2,
paddingLeft: 10,
paddingRight: 10,
border: "none",
transition: "background-color 0.2s",
"&:hover": {
backgroundColor: theme.colors.gray[2]
}
},
header: {
display: "flex",
gap: 6,
alignItems: "center"
},
callout: {
whiteSpace: "pre-wrap"
}
}));
const LatestRunDetails = ({
runID,
output,
error
}) => {
const {
classes
} = useStyles();
return /* @__PURE__ */ jsxs(StackComponent, { spacing: "sm", children: [
/* @__PURE__ */ jsxs("div", { className: classes.header, children: [
/* @__PURE__ */ jsx(HeadingComponent, { level: 5, children: "Latest run" }),
runID && /* @__PURE__ */ jsxs(ButtonComponent, { compact: true, className: classes.runBadge, onClick: () => sendViewMessage({
type: "debug_panel",
open: true,
activeTab: "activity",
runID
}), children: [
"#",
runID
] })
] }),
error && /* @__PURE__ */ jsx(CalloutComponent, { icon: /* @__PURE__ */ jsx(XCircleIconMini, { color: "red.4" }), variant: "error", title: error.type === "FAILED" ? "Run failed with error" : "Internal error occured", className: classes.callout, children: error.message }),
output && /* @__PURE__ */ jsx(CodeInput, { value: JSON.stringify(output, null, 2), foldGutter: true, lineNumbers: true, language: "json", disabled: true, style: {
maxHeight: 230
} })
] });
};
const useSetLatestRunInTaskQuery = (task, setLatestRun) => {
const fullQuery = getFullQuery(task);
const fullQueryOnSuccess = fullQuery.onSuccess;
const fullQueryOnError = fullQuery.onError;
fullQuery.onSuccess = useCallback(
// eslint-disable-next-line @typescript-eslint/no-explicit-any
(output, runID) => {
fullQueryOnSuccess == null ? void 0 : fullQueryOnSuccess(output, runID);
setLatestRun == null ? void 0 : setLatestRun({
output,
runID
});
},
[fullQueryOnSuccess, setLatestRun]
);
fullQuery.onError = useCallback(
// eslint-disable-next-line @typescript-eslint/no-explicit-any
(output, error, runID) => {
fullQueryOnError == null ? void 0 : fullQueryOnError(output, error, runID);
setLatestRun == null ? void 0 : setLatestRun({
output,
error,
runID
});
},
[fullQueryOnError, setLatestRun]
);
return fullQuery;
};
export {
LatestRunDetails,
useSetLatestRunInTaskQuery
};
//# sourceMappingURL=LatestRunDetails.js.map