diff --git a/src/api/services/configs.ts b/src/api/services/configs.ts index 38f0825e8..1c4e26878 100644 --- a/src/api/services/configs.ts +++ b/src/api/services/configs.ts @@ -11,6 +11,7 @@ import { ConfigChange, ConfigHealthCheckView, ConfigItem, + ConfigItemDetails, ConfigSummary, ConfigTypeRelationships } from "../types/configs"; @@ -138,8 +139,10 @@ export const getAllChanges = ( }; export const getConfig = (id: string) => - resolvePostGrestRequestWithPagination( - ConfigDB.get(`/config_detail?id=eq.${id}&select=*,config_scrapers(id,name)`) + resolvePostGrestRequestWithPagination( + ConfigDB.get( + `/config_detail?id=eq.${id}&select=*,config_scrapers(id,name),config_component_relationships(component_id,component:components(*))` + ) ); export type ConfigsTagList = { diff --git a/src/api/types/configs.ts b/src/api/types/configs.ts index 9ecfda145..7ca34d160 100644 --- a/src/api/types/configs.ts +++ b/src/api/types/configs.ts @@ -1,5 +1,6 @@ import { Agent, Avatar, CreatedAt, Timestamped } from "../traits"; import { HealthCheckSummary } from "./health"; +import { Topology } from "./topology"; export interface ConfigChange extends CreatedAt { id: string; @@ -69,13 +70,6 @@ export interface ConfigItem extends Timestamped, Avatar, Agent, Costs { id: string; name: string; }; - summary?: { - relationships?: number; - analysis?: number; - changes?: number; - playbook_runs?: number; - checks?: number; - }; properties?: { icon: string; name: string; @@ -87,6 +81,20 @@ export interface ConfigItem extends Timestamped, Avatar, Agent, Costs { last_scraped_time?: string; } +export interface ConfigItemDetails extends ConfigItem { + summary?: { + relationships?: number; + analysis?: number; + changes?: number; + playbook_runs?: number; + checks?: number; + }; + config_component_relationships: { + component_id: string; + component: Topology; + }[]; +} + export interface ConfigItemGraphData extends ConfigItem { expanded?: boolean; expandable?: boolean; diff --git a/src/components/Configs/ConfigDetailsTabs.tsx b/src/components/Configs/ConfigDetailsTabs.tsx index a91d715be..a6a39a9b9 100644 --- a/src/components/Configs/ConfigDetailsTabs.tsx +++ b/src/components/Configs/ConfigDetailsTabs.tsx @@ -9,6 +9,7 @@ import { Head } from "../../ui/Head"; import { refreshButtonClickedTrigger } from "../../ui/SlidingSideBar/SlidingSideBar"; import TabbedLinks from "../../ui/Tabs/TabbedLinks"; import { ErrorBoundary } from "../ErrorBoundary"; +import { TopologyCard } from "../Topology/TopologyCard"; import { useConfigDetailsTabs } from "./ConfigTabsLinks"; import ConfigSidebar from "./Sidebar/ConfigSidebar"; @@ -46,6 +47,10 @@ export function ConfigDetailsTabs({ const configTabList = useConfigDetailsTabs(configItem?.summary); + // Show topology section if there is only one relationship + const showTopologySection = + configItem?.config_component_relationships.length === 1; + return ( <> -
+
+ {showTopologySection && ( +
+ +
+ )} + (); return [ diff --git a/src/components/Topology/TopologyCard/index.tsx b/src/components/Topology/TopologyCard/index.tsx index aa7a654fd..b85e2228b 100644 --- a/src/components/Topology/TopologyCard/index.tsx +++ b/src/components/Topology/TopologyCard/index.tsx @@ -37,7 +37,20 @@ export const StatusStyles: Record = { interface IProps { size?: Size | string; topologyId?: string; - topology?: Topology; + topology?: Pick< + Topology, + | "summary" + | "is_leaf" + | "id" + | "properties" + | "components" + | "agent_id" + | "status" + | "status_reason" + | "text" + | "name" + | "icon" + >; selectionMode?: boolean; hideMenu?: boolean; // where to open new links