Wizard: Update description fetching for recommended packages

This update the way recommended packages' descriptions are fetched.

contentSources API was updated to accept an array of packages as a searchRpm argument, meaning we can now send a request to fetch all package descriptions at once.

src/Components/CreateImageWizard/steps/Packages/PackageRecommendations.tsx

@@ -21,11 +21,13 @@ import { Table, Tbody, Td, Th, Thead, Tr } from '@patternfly/react-table';
 import useChrome from '@redhat-cloud-services/frontend-components/useChrome';
 import { useDispatch } from 'react-redux';
 
-import PackageRecommendationDescription from './components/PackageRecommendationDescription';
 import { RedHatRepository } from './Packages';
 
 import { AMPLITUDE_MODULE_NAME, ContentOrigin } from '../../../../constants';
-import { useListRepositoriesQuery } from '../../../../store/contentSourcesApi';
+import {
+  useListRepositoriesQuery,
+  useSearchRpmMutation,
+} from '../../../../store/contentSourcesApi';
 import { useAppSelector } from '../../../../store/hooks';
 import { useRecommendPackageMutation } from '../../../../store/imageBuilderApi';
 import {
@@ -67,6 +69,15 @@ const PackageRecommendations = () => {
   const [fetchRecommendedPackages, { data, isSuccess, isLoading, isError }] =
     useRecommendPackageMutation();
 
+  const [
+    fetchRecommendationDescriptions,
+    {
+      data: dataDescriptions,
+      isSuccess: isSuccessDescriptions,
+      isLoading: isLoadingDescriptions,
+    },
+  ] = useSearchRpmMutation();
+
   useEffect(() => {
     if (isExpanded && packages.length > 0) {
       (async () => {
@@ -92,6 +103,17 @@ const PackageRecommendations = () => {
     }
   }, [fetchRecommendedPackages, packages, isExpanded]);
 
+  useEffect(() => {
+    if (isSuccess && data.packages.length > 0) {
+      fetchRecommendationDescriptions({
+        apiContentUnitSearchRequest: {
+          exact_names: data?.packages,
+          urls: distroRepoUrls,
+        },
+      });
+    }
+  }, [fetchRecommendationDescriptions, isSuccess, data?.packages]);
+
   const addAllPackages = () => {
     if (data?.packages?.length) {
       data.packages.forEach((pkg) =>
@@ -213,14 +235,18 @@ const PackageRecommendations = () => {
                     {data.packages.map((pkg) => (
                       <Tr key={pkg}>
                         <Td>{pkg}</Td>
-                        <Td>
-                          {distroRepoUrls && (
-                            <PackageRecommendationDescription
-                              pkg={pkg}
-                              urls={distroRepoUrls}
-                            />
-                          )}
-                        </Td>
+                        {isLoadingDescriptions && (
+                          <Td>
+                            <Spinner size="md" />
+                          </Td>
+                        )}
+                        {isSuccessDescriptions && (
+                          <Td>
+                            {dataDescriptions
+                              .filter((p) => p.package_name === pkg)
+                              .map((p) => p.summary)}
+                          </Td>
+                        )}
                         <Td>
                           <RedHatRepository />
                         </Td>

src/Components/CreateImageWizard/steps/Packages/components/PackageRecommendationDescription.tsx

@@ -1,50 +0,0 @@
-import React, { useEffect } from 'react';
-
-import { Spinner } from '@patternfly/react-core';
-
-import { useSearchRpmMutation } from '../../../../../store/contentSourcesApi';
-
-type PackageRecommendationDescriptionTypes = {
-  pkg: string;
-  urls: string[];
-};
-
-const PackageRecommendationDescription = ({
-  pkg,
-  urls,
-}: PackageRecommendationDescriptionTypes) => {
-  const [
-    searchRpms,
-    {
-      data: dataPkgRecInfo,
-      isSuccess: isSuccessPkgRecInfo,
-      isLoading: isLoadingPkgRecInfo,
-      isError: isErrorPkgRecInfo,
-    },
-  ] = useSearchRpmMutation();
-
-  useEffect(() => {
-    searchRpms({
-      apiContentUnitSearchRequest: {
-        search: pkg,
-        urls: urls,
-      },
-    });
-  }, [pkg, searchRpms, urls]);
-
-  if (isLoadingPkgRecInfo) {
-    return <Spinner size="md" />;
-  }
-  if (isSuccessPkgRecInfo && dataPkgRecInfo) {
-    if (dataPkgRecInfo.length > 0) {
-      return dataPkgRecInfo[0].summary;
-    } else {
-      return 'Package was not found in distribution repositories';
-    }
-  }
-  if (isErrorPkgRecInfo) {
-    return 'There was an error when fetching a description';
-  }
-};
-
-export default PackageRecommendationDescription;