ui: rename ScrapeDetails→ScrapeTimingDetails; refine labels per review
Rename component for clarity (timing-only focus) Chevron title: “Show/Hide additional timing info” Duration pill tooltip: “Duration of last target scrape” Update imports/usages; keep DOM-conditional expanded content Signed-off-by: ADITYATIWARI342005 <142050150+ADITYATIWARI342005@users.noreply.github.com>
This commit is contained in:
parent
8eb8758925
commit
3ef9f4e18a
|
@ -29,7 +29,7 @@ import CustomInfiniteScroll from "../../components/CustomInfiniteScroll";
|
||||||
import badgeClasses from "../../Badge.module.css";
|
import badgeClasses from "../../Badge.module.css";
|
||||||
import panelClasses from "../../Panel.module.css";
|
import panelClasses from "../../Panel.module.css";
|
||||||
import TargetLabels from "./TargetLabels";
|
import TargetLabels from "./TargetLabels";
|
||||||
import ScrapeDetails from "./ScrapeDetails";
|
import ScrapeTimingDetails from "./ScrapeTimingDetails";
|
||||||
import { targetPoolDisplayLimit } from "./TargetsPage";
|
import { targetPoolDisplayLimit } from "./TargetsPage";
|
||||||
|
|
||||||
type ScrapePool = {
|
type ScrapePool = {
|
||||||
|
@ -324,7 +324,7 @@ const ScrapePoolList: FC<ScrapePoolListProp> = memo(
|
||||||
/>
|
/>
|
||||||
</Table.Td>
|
</Table.Td>
|
||||||
<Table.Td valign="top">
|
<Table.Td valign="top">
|
||||||
<ScrapeDetails target={target} />
|
<ScrapeTimingDetails target={target} />
|
||||||
</Table.Td>
|
</Table.Td>
|
||||||
<Table.Td valign="top">
|
<Table.Td valign="top">
|
||||||
<Badge
|
<Badge
|
||||||
|
|
|
@ -14,11 +14,11 @@ import { Target } from "../../api/responseTypes/targets";
|
||||||
import badgeClasses from "../../Badge.module.css";
|
import badgeClasses from "../../Badge.module.css";
|
||||||
import { actionIconStyle, badgeIconStyle } from "../../styles";
|
import { actionIconStyle, badgeIconStyle } from "../../styles";
|
||||||
|
|
||||||
type ScrapeDetailsProps = {
|
type ScrapeTimingDetailsProps = {
|
||||||
target: Target;
|
target: Target;
|
||||||
};
|
};
|
||||||
|
|
||||||
const ScrapeDetails: FC<ScrapeDetailsProps> = ({ target }) => {
|
const ScrapeTimingDetails: FC<ScrapeTimingDetailsProps> = ({ target }) => {
|
||||||
const [showDetails, { toggle: toggleDetails }] = useDisclosure(false);
|
const [showDetails, { toggle: toggleDetails }] = useDisclosure(false);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
@ -38,15 +38,7 @@ const ScrapeDetails: FC<ScrapeDetailsProps> = ({ target }) => {
|
||||||
</Badge>
|
</Badge>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
|
|
||||||
<Tooltip
|
<Tooltip label="Duration of last target scrape" withArrow>
|
||||||
label={
|
|
||||||
<div style={{ lineHeight: 1.2 }}>
|
|
||||||
<div>Interval: {target.scrapeInterval}</div>
|
|
||||||
<div>Timeout: {target.scrapeTimeout}</div>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
withArrow
|
|
||||||
>
|
|
||||||
<Badge
|
<Badge
|
||||||
variant="light"
|
variant="light"
|
||||||
className={badgeClasses.statsBadge}
|
className={badgeClasses.statsBadge}
|
||||||
|
@ -65,7 +57,7 @@ const ScrapeDetails: FC<ScrapeDetailsProps> = ({ target }) => {
|
||||||
color="gray"
|
color="gray"
|
||||||
variant="light"
|
variant="light"
|
||||||
onClick={toggleDetails}
|
onClick={toggleDetails}
|
||||||
title={`${showDetails ? "Hide" : "Show"} scrape configuration details`}
|
title={`${showDetails ? "Hide" : "Show"} additional timing info`}
|
||||||
>
|
>
|
||||||
{showDetails ? (
|
{showDetails ? (
|
||||||
<IconChevronUp style={actionIconStyle} />
|
<IconChevronUp style={actionIconStyle} />
|
||||||
|
@ -106,4 +98,4 @@ const ScrapeDetails: FC<ScrapeDetailsProps> = ({ target }) => {
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default ScrapeDetails;
|
export default ScrapeTimingDetails;
|
Loading…
Reference in New Issue