From c1b637b2842c29f32bb2c30f05185a4e3019ee12 Mon Sep 17 00:00:00 2001
From: Ali BARIN <ali.barin53@gmail.com>
Date: Sat, 13 Aug 2022 01:39:41 +0200
Subject: [PATCH] feat: display flow count on per connection

---
 packages/types/index.d.ts                               | 1 +
 packages/web/src/components/AppConnectionRow/index.tsx  | 4 ++--
 packages/web/src/graphql/queries/get-app-connections.ts | 1 +
 3 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/types/index.d.ts b/packages/types/index.d.ts
index b4f39bd7..a2a067a4 100644
--- a/packages/types/index.d.ts
+++ b/packages/types/index.d.ts
@@ -14,6 +14,7 @@ export interface IConnection {
   userId: string;
   verified: boolean;
   count: number;
+  flowCount: number;
   createdAt: string;
 }
 
diff --git a/packages/web/src/components/AppConnectionRow/index.tsx b/packages/web/src/components/AppConnectionRow/index.tsx
index d7d8d08c..b85a2328 100644
--- a/packages/web/src/components/AppConnectionRow/index.tsx
+++ b/packages/web/src/components/AppConnectionRow/index.tsx
@@ -42,7 +42,7 @@ function AppConnectionRow(props: AppConnectionRowProps): React.ReactElement {
   const [deleteConnection] = useMutation(DELETE_CONNECTION);
 
   const formatMessage = useFormatMessage();
-  const { id, key, formattedData, verified, createdAt } = props.connection;
+  const { id, key, formattedData, verified, createdAt, flowCount } = props.connection;
 
   const contextButtonRef = React.useRef<SVGSVGElement | null>(null);
   const [anchorEl, setAnchorEl] = React.useState<SVGSVGElement | null>(null);
@@ -121,7 +121,7 @@ function AppConnectionRow(props: AppConnectionRowProps): React.ReactElement {
 
             <Box sx={{ px: 2 }}>
               <Typography variant="caption" color="textSecondary" sx={{ display: ['none', 'inline-block'] }}>
-                {formatMessage('connection.flowCount', { count: countTranslation(0) })}
+                {formatMessage('connection.flowCount', { count: countTranslation(flowCount) })}
               </Typography>
             </Box>
 
diff --git a/packages/web/src/graphql/queries/get-app-connections.ts b/packages/web/src/graphql/queries/get-app-connections.ts
index e8a972fe..1151d3a6 100644
--- a/packages/web/src/graphql/queries/get-app-connections.ts
+++ b/packages/web/src/graphql/queries/get-app-connections.ts
@@ -8,6 +8,7 @@ export const GET_APP_CONNECTIONS = gql`
         id
         key
         verified
+        flowCount
         formattedData {
           screenName
         }