feat: use use download hook globally

Author: arunjaindev

src/Shared/Components/CICDHistory/Artifacts.tsx

@@ -16,8 +16,8 @@
 
 import { useEffect, useState } from 'react'
 import { useParams } from 'react-router'
+import { useDownload } from '@Shared/Hooks'
 import {
-    showError,
     GenericEmptyState,
     ImageTagsContainer,
     ClipboardButton,
@@ -122,7 +122,7 @@ const Artifacts = ({
     artifact,
     blobStorageEnabled,
     isArtifactUploaded,
-    getArtifactPromise,
+    downloadArtifactUrl,
     ciPipelineId,
     artifactId,
     isJobView,
@@ -137,6 +137,7 @@ const Artifacts = ({
     renderCIListHeader,
 }: ArtifactType) => {
     const { isSuperAdmin } = useSuperAdmin()
+    const { handleDownload } = useDownload()
 
     const { triggerId, buildId } = useParams<{
         triggerId: string
@@ -152,17 +153,11 @@ const Artifacts = ({
     }, [copied])
 
     async function handleArtifact() {
-        // TODO: Use useDownload() Hook instead to download file/folder
-        try {
-            const response = await getArtifactPromise()
-            const b = await (response as any).blob()
-            const a = document.createElement('a')
-            a.href = URL.createObjectURL(b)
-            a.download = `${buildId || triggerId}.zip`
-            a.click()
-        } catch (err) {
-            showError(err)
-        }
+        await handleDownload({
+            downloadUrl: downloadArtifactUrl,
+            showFilePreparingToast: true,
+            fileName: `${buildId || triggerId}.zip`,
+        })
     }
 
     if (status.toLowerCase() === TERMINAL_STATUS_MAP.RUNNING || status.toLowerCase() === TERMINAL_STATUS_MAP.STARTING) {
@@ -260,7 +255,7 @@ const Artifacts = ({
                     </div>
                 </CIListItem>
             )}
-            {blobStorageEnabled && getArtifactPromise && (type === HistoryComponentType.CD || isArtifactUploaded) && (
+            {blobStorageEnabled && downloadArtifactUrl && (type === HistoryComponentType.CD || isArtifactUploaded) && (
                 <CIListItem
                     type="report"
                     hideImageTaggingHardDelete={hideImageTaggingHardDelete}

src/Shared/Components/CICDHistory/TriggerOutput.tsx

@@ -63,7 +63,7 @@ import {
     VirtualHistoryArtifactProps,
     RunSourceType,
 } from './types'
-import { getTagDetails, getTriggerDetails, cancelCiTrigger, cancelPrePostCdTrigger, getCDBuildReport } from './service'
+import { getTagDetails, getTriggerDetails, cancelCiTrigger, cancelPrePostCdTrigger } from './service'
 import { DEFAULT_ENV, TIMEOUT_VALUE, WORKER_POD_BASE_URL } from './constants'
 import { GitTriggers } from '../../types'
 import warn from '../../../Assets/Icon/ic-warning.svg'
@@ -561,6 +561,8 @@ const HistoryLogs: React.FC<{
         workflowId: triggerDetails.id,
     }
 
+    const CDBuildReportUrl = `app/cd-pipeline/workflow/download/${appId}/${envId}/${pipelineId}/${triggerId}`
+
     const [ref, scrollToTop, scrollToBottom] = useScrollable({
         autoBottomScroll: triggerDetails.status.toLowerCase() !== 'succeeded',
     })
@@ -665,7 +667,7 @@ const HistoryLogs: React.FC<{
                                         tagsEditable={tagsEditable}
                                         appReleaseTagNames={appReleaseTags}
                                         hideImageTaggingHardDelete={hideImageTaggingHardDelete}
-                                        getArtifactPromise={() => getCDBuildReport(appId, envId, pipelineId, triggerId)}
+                                        downloadArtifactUrl={CDBuildReportUrl}
                                         type={HistoryComponentType.CD}
                                         renderCIListHeader={renderCIListHeader}
                                     />

src/Shared/Components/CICDHistory/service.tsx

@@ -268,10 +268,6 @@ export const getDeploymentDiffSelector = (
     return get(url)
 }
 
-export function getCDBuildReport(appId, envId, pipelineId, workflowId) {
-    return get(`app/cd-pipeline/workflow/download/${appId}/${envId}/${pipelineId}/${workflowId}`)
-}
-
 export const getTriggerHistory = async ({
     appId,
     envId,

src/Shared/Components/CICDHistory/types.tsx

@@ -551,7 +551,7 @@ export interface ArtifactType {
     artifact: string
     blobStorageEnabled: boolean
     isArtifactUploaded?: boolean
-    getArtifactPromise?: () => Promise<any>
+    downloadArtifactUrl?: string
     isJobView?: boolean
     isJobCI?: boolean
     type: HistoryComponentType