From 034aaa07de91902794d76f7c954ae2303b17b994 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]" <github-actions[bot]@users.noreply.github.com>
Date: Mon, 9 Sep 2024 17:25:35 +0000
Subject: [PATCH] Fix integration imports for table and card view (#2147)

Signed-off-by: Shenoy Pratik <sgguruda@amazon.com>
(cherry picked from commit 7a63a9e14a1d65b40c14282016851aa0d3148add)
Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .../components/added_integration_table.tsx    |  2 +-
 .../available_integration_card_view.tsx       | 20 ++++++++-----------
 2 files changed, 9 insertions(+), 13 deletions(-)

diff --git a/public/components/integrations/components/added_integration_table.tsx b/public/components/integrations/components/added_integration_table.tsx
index 741c21ffaa..f8205e004e 100644
--- a/public/components/integrations/components/added_integration_table.tsx
+++ b/public/components/integrations/components/added_integration_table.tsx
@@ -94,7 +94,7 @@ export function AddedIntegrationsTable(props: AddedIntegrationsTableProps) {
       truncateText: true,
       render: (value, record) => (
         <EuiText data-test-subj={`${record.templateName}IntegrationDescription`}>
-          {truncate(record.dataSourceMDSLabel || 'Local cluster', { length: 100 })}
+          {_.truncate(record.dataSourceMDSLabel || 'Local cluster', { length: 100 })}
         </EuiText>
       ),
     });
diff --git a/public/components/integrations/components/available_integration_card_view.tsx b/public/components/integrations/components/available_integration_card_view.tsx
index a4ee7aed79..621d5310fc 100644
--- a/public/components/integrations/components/available_integration_card_view.tsx
+++ b/public/components/integrations/components/available_integration_card_view.tsx
@@ -4,23 +4,19 @@
  */
 
 import {
-  EuiPanel,
+  EuiButtonGroup,
   EuiCard,
+  EuiCompressedFieldSearch,
   EuiFlexGroup,
   EuiFlexItem,
+  EuiPanel,
   EuiSpacer,
-  EuiCompressedFieldSearch,
-  EuiButtonGroup,
 } from '@elastic/eui';
-import _ from 'lodash';
 import React, { useState } from 'react';
-import {
-  AvailableIntegrationsCardViewProps,
-  AvailableIntegrationType,
-} from './available_integration_overview_page';
 import { INTEGRATIONS_BASE } from '../../../../common/constants/shared';
-import { badges } from './integration_category_badge_group';
 import { basePathLink } from '../../../../common/utils/shared';
+import { AvailableIntegrationsCardViewProps } from './available_integration_overview_page';
+import { badges } from './integration_category_badge_group';
 
 export function AvailableIntegrationsCardView(props: AvailableIntegrationsCardViewProps) {
   const [toggleIconIdSelected, setToggleIconIdSelected] = useState('1');
@@ -57,7 +53,7 @@ export function AvailableIntegrationsCardView(props: AvailableIntegrationsCardVi
     }
   };
 
-  const renderRows = (integrations: AvailableIntegrationType[]) => {
+  const renderRows = (integrations: IntegrationConfig[]) => {
     if (!integrations || !integrations.length) return null;
     return (
       <>
@@ -68,11 +64,11 @@ export function AvailableIntegrationsCardView(props: AvailableIntegrationsCardVi
                 <EuiCard
                   icon={getImage(
                     basePathLink(
-                      `${INTEGRATIONS_BASE}/repository/${i.name}/static/${i.statics.logo.path}`
+                      `${INTEGRATIONS_BASE}/repository/${i.name}/static/${i.statics?.logo?.path}`
                     )
                   )}
                   title={i.displayName ? i.displayName : i.name}
-                  description={i.description}
+                  description={i.description ?? ''}
                   data-test-subj={`integration_card_${i.name.toLowerCase()}`}
                   titleElement="span"
                   href={basePathLink(`/app/integrations#/available/${i.name}`)}