Skip to content

Commit

Permalink
feat: add checks dropdown
Browse files Browse the repository at this point in the history
  • Loading branch information
mainawycliffe committed Sep 16, 2024
1 parent c41fd16 commit 43c30a7
Show file tree
Hide file tree
Showing 3 changed files with 63 additions and 0 deletions.
6 changes: 6 additions & 0 deletions src/api/services/topology.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import { SchemaResourceI } from "../schemaResources";
import { PaginationInfo } from "../types/common";
import {
HealthCheck,
HealthCheckNames,
HealthCheckStatus,
HealthCheckSummary
} from "../types/health";
Expand Down Expand Up @@ -294,3 +295,8 @@ export const getComponentChecks = async (id: string) => {
);
return res.data;
};

export const getCheckNames = async () => {
const res = await IncidentCommander.get<HealthCheckNames[]>(`/check_names`);
return res.data;
};
5 changes: 5 additions & 0 deletions src/api/types/health.ts
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,11 @@ export type HealthCheckSummary = Pick<
| "last_transition_time"
>;

export type HealthCheckNames = Pick<
HealthCheck,
"id" | "name" | "canary_id" | "status" | "type"
>;

export interface HealthCheckStatus {
status: boolean;
time: string;
Expand Down
52 changes: 52 additions & 0 deletions src/components/Forms/Formik/FormikChecksDropdown.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
import { getCheckNames } from "@flanksource-ui/api/services/topology";
import { useQuery } from "@tanstack/react-query";
import { useMemo } from "react";
import { Icon } from "../../../ui/Icons/Icon";
import FormikSelectDropdown from "./FormikSelectDropdown";

type FormikChecksDropdownProps = {
name: string;
label?: string;
required?: boolean;
hint?: string;
filter?: {
types: string[];
};
className?: string;
};

export default function FormikChecksDropdown({
name,
label,
required = false,
hint,
filter,
className = "flex flex-col space-y-2 py-2"
}: FormikChecksDropdownProps) {
const { isLoading, data: checks } = useQuery({
queryKey: ["checks", "check_names"],
queryFn: () => getCheckNames()
});

const options = useMemo(
() =>
checks?.map((check) => ({
label: check.name,
value: check.id,
icon: <Icon name={check.type} className="h-5 w-5" />
})),
[checks]
);

return (
<FormikSelectDropdown
name={name}
className={className}
options={options}
label={label}
isLoading={isLoading}
required={required}
hint={hint}
/>
);
}

0 comments on commit 43c30a7

Please sign in to comment.