Merge pull request #459 from bartoval/minor_fix_v2

Minor fix v2

__tests__/pages/Processes/ProcessPairs.spec.tsx

@@ -4,6 +4,8 @@ import { fireEvent, render, screen, waitForElementToBeRemoved } from '@testing-l
 import { Server } from 'miragejs';
 import * as router from 'react-router';
 
+import { ProcessesLabels } from '@pages/Processes/Processes.enum';
+
 import processPairsData from '../../../mocks/data/PROCESS_PAIRS.json';
 import { loadMockServer } from '../../../mocks/server';
 import { waitForElementToBeRemovedTimeout } from '../../../src/config/config';
@@ -93,7 +95,7 @@ describe('Begin testing the Processes component', () => {
       timeout: waitForElementToBeRemovedTimeout
     });
 
-    fireEvent.click(getByText('Connection history (2)'));
+    fireEvent.click(getByText(ProcessesLabels.OldConnections));
 
     expect(getByTestId('tcp-old-connections-table')).toBeInTheDocument();
   });

src/core/components/SkFlowPairsTable/FlowPair.constants.ts

@@ -50,7 +50,7 @@ export const tcpFlowPairsColumns: SKTableColumn<FlowPairsResponse>[] = [
     name: FlowPairLabels.FlowPairClosed,
     prop: 'endTime' as keyof FlowPairsResponse,
     customCellName: 'TimestampCell',
-    width: 15
+    modifier: 'fitContent'
   },
   {
     name: FlowPairLabels.Client,

src/pages/ProcessGroups/Components.constants.ts

@@ -42,6 +42,7 @@ export const ComponentColumns: SKTableColumn<ComponentResponse>[] = [
     name: ComponentLabels.Created,
     prop: 'startTime' as keyof ComponentResponse,
     customCellName: 'TimestampCell',
+    modifier: 'fitContent',
     width: 15
   }
 ];

src/pages/Processes/Processes.constants.ts

@@ -85,6 +85,7 @@ export const processesTableColumns: SKTableColumn<ProcessResponse>[] = [
     name: ProcessesLabels.Created,
     prop: 'startTime' as keyof ProcessResponse,
     customCellName: 'TimestampCell',
+    modifier: 'fitContent',
     width: 15
   }
 ];

src/pages/Processes/components/Details.tsx

@@ -44,7 +44,6 @@ const Details: FC<DetailsProps> = function ({ process }) {
     addresses
   } = process;
 
-
   return (
     <Card>
       <CardBody>

src/pages/Processes/components/FlowPairsList.tsx

@@ -160,8 +160,6 @@ const FlowPairsList: FC<FlowPairsListProps> = function ({ sourceProcessId, destP
             ? TAB_4_KEY
             : '';
 
-  //         {!activeConnectionsCount && !oldConnectionsCount && !http2RequestsCount && !httpRequestsCount && (
-
   return (
     <>
       {!activeConnectionsCount && !oldConnectionsCount && (
@@ -197,7 +195,7 @@ const FlowPairsList: FC<FlowPairsListProps> = function ({ sourceProcessId, destP
           <Tab
             disabled={oldConnectionsCount === 0}
             eventKey={TAB_2_KEY}
-            title={<TabTitleText>{`${ProcessesLabels.OldConnections} (${oldConnectionsCount})`}</TabTitleText>}
+            title={<TabTitleText>{ProcessesLabels.OldConnections}</TabTitleText>}
           >
             <SkFlowPairsTable
               data-testid={'tcp-old-connections-table'}

src/pages/Services/Services.constants.ts

@@ -60,6 +60,7 @@ export const ServiceColumns: SKTableColumn<ServiceResponse>[] = [
     name: ProcessesLabels.Created,
     prop: 'startTime' as keyof ServiceResponse,
     customCellName: 'TimestampCell',
+    modifier: 'fitContent',
     width: 15
   }
 ];

src/pages/Sites/Sites.constants.ts

@@ -44,6 +44,7 @@ export const siteColumns: SKTableColumn<SiteResponse>[] = [
     name: SiteLabels.Created,
     prop: 'startTime' as keyof SiteResponse,
     customCellName: 'TimestampCell',
+    modifier: 'fitContent',
     width: 15
   }
 ];

src/pages/Sites/hooks/useSiteData.ts

@@ -1,16 +1,28 @@
-import { useSuspenseQuery } from '@tanstack/react-query';
+import { useQuery, useSuspenseQuery } from '@tanstack/react-query';
 
 import { RESTApi } from '@API/REST.api';
+import { Role } from '@API/REST.enum';
 import { UPDATE_INTERVAL } from '@config/config';
 
 import { QueriesSites } from '../Sites.enum';
 
+const processQueryParams = {
+  limit: 0,
+  processRole: [Role.Remote, Role.External]
+};
+
 export const useSiteData = (id: string) => {
   const { data } = useSuspenseQuery({
     queryKey: [QueriesSites.GetSite, id],
     queryFn: () => RESTApi.fetchSite(id),
     refetchInterval: UPDATE_INTERVAL
   });
 
-  return { site: data.results };
+  const { data: processes } = useQuery({
+    queryKey: [QueriesSites.GetProcessesBySiteId, { ...processQueryParams, parent: id }],
+    queryFn: () => RESTApi.fetchProcesses({ ...processQueryParams, parent: id }),
+    refetchInterval: UPDATE_INTERVAL
+  });
+
+  return { site: data.results, summary: { processCount: processes?.timeRangeCount || 0 } };
 };

src/pages/Sites/hooks/useSiteProcessListData.ts

@@ -6,7 +6,7 @@ import { UPDATE_INTERVAL } from '@config/config';
 
 import { QueriesSites } from '../Sites.enum';
 
-const processQueryParams = { processRole: [Role.Remote, Role.External], endTime: 0 };
+const processQueryParams = { processRole: [Role.Remote, Role.External] };
 
 export const useSiteProcessListData = (id: string) => {
   const { data: processes } = useSuspenseQuery({

src/pages/Sites/views/Site.tsx

@@ -21,7 +21,10 @@ interface SiteProps {
 }
 
 const SiteContent: FC<SiteProps> = function ({ id, defaultTab }) {
-  const { site } = useSiteData(id);
+  const {
+    site,
+    summary: { processCount }
+  } = useSiteData(id);
 
   const [tabSelected, setTabSelected] = useState(defaultTab);
   useUpdateQueryStringValueWithoutNavigation(TopologyURLQueyParams.Type, tabSelected, true);
@@ -35,7 +38,11 @@ const SiteContent: FC<SiteProps> = function ({ id, defaultTab }) {
       <Tabs activeKey={tabSelected} onSelect={handleTabClick} component="nav">
         <Tab eventKey={SiteLabels.Overview} title={<TabTitleText>{SiteLabels.Overview}</TabTitleText>} />
         <Tab eventKey={SiteLabels.Details} title={<TabTitleText>{SiteLabels.Details}</TabTitleText>} />
-        <Tab eventKey={SiteLabels.Processes} title={<TabTitleText>{SiteLabels.Processes}</TabTitleText>} />
+        <Tab
+          eventKey={SiteLabels.Processes}
+          title={<TabTitleText>{SiteLabels.Processes}</TabTitleText>}
+          disabled={!processCount}
+        />
       </Tabs>
     );
   };

src/pages/Topology/services/topologySiteController.ts

@@ -36,7 +36,7 @@ const convertRouterLinksToEdges = (sites: SiteResponse[], links: LinkResponse[])
         id: `${sourceId}-to${targetId}`,
         source: sourceId,
         target: targetId,
-        label: linkCost !== undefined ? `${TopologyLabels.SiteLinkText} ${linkCost}` : ''
+        label: linkCost !== undefined && linkCost > 0 ? `${TopologyLabels.SiteLinkText} ${linkCost}` : ''
       }
     ])
   );