github/drone
5
0
Fork 0
mirror of https://github.com/harness/drone.git synced 2025-05-04 23:22:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: [code-860]: add the sse export progress

Browse Source
This commit is contained in:
calvin 2023-09-16 17:55:51 -06:00
parent 2246316edd
commit a7ed7a090c
2 changed files with 60 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/pages/SpaceSettings/ExportForm/ExportForm.tsx
View File

@ -20,10 +20,10 @@ import {
} from '@harnessio/uicore'
import { Icon } from '@harnessio/icons'
import type { TypesRepository } from 'services/code'
import Upgrade from '../../../icons/Upgrade.svg'
import { useStrings } from 'framework/strings'
import type { ExportFormDataExtended } from 'utils/GitUtils'
import Upgrade from '../../../icons/Upgrade.svg'
import css from '../SpaceSettings.module.scss'
interface ExportFormProps {

86
web/src/pages/SpaceSettings/SpaceSettings.tsx
View File

@ -1,4 +1,4 @@
import React, { useState } from 'react'
import React, { useEffect, useState } from 'react'
import {
Button,
Text,
@ -13,25 +13,26 @@ import {
useToaster,
Heading
} from '@harnessio/uicore'
import { useMutate } from 'restful-react'
import { noop } from 'lodash-es'
import { useMutate, useGet } from 'restful-react'
import { Intent, Color, FontVariation } from '@harnessio/design-system'
import { useGetSpace } from 'services/code'
import { useGetRepositoryMetadata } from 'hooks/useGetRepositoryMetadata'
import { ACCESS_MODES, permissionProps, voidFn } from 'utils/Utils'
import { Dialog } from '@blueprintjs/core'
import { ProgressBar, Intent as IntentCore } from '@blueprintjs/core'
import { useHistory } from 'react-router-dom'
import { Dialog } from '@blueprintjs/core'
import { useGetRepositoryMetadata } from 'hooks/useGetRepositoryMetadata'
import { ProgressBar, Intent as IntentCore } from '@blueprintjs/core'
import { TypesJobProgress, useGetSpace } from 'services/code'
import { useAppContext } from 'AppContext'
import { useStrings } from 'framework/strings'
import useDeleteSpaceModal from './DeleteSpaceModal/DeleteSpaceModal'
import Harness from '../../icons/Harness.svg'
import Upgrade from '../../icons/Upgrade.svg'
import { getErrorMessage } from 'utils/Utils'
import { ACCESS_MODES, permissionProps, voidFn } from 'utils/Utils'
import type { ExportFormDataExtended } from 'utils/GitUtils'
import { useModalHook } from 'hooks/useModalHook'
import useSpaceSSE from 'hooks/useSpaceSSE'
import Harness from '../../icons/Harness.svg'
import Upgrade from '../../icons/Upgrade.svg'
import useDeleteSpaceModal from './DeleteSpaceModal/DeleteSpaceModal'
import ExportForm from './ExportForm/ExportForm'
import css from './SpaceSettings.module.scss'
import useSpaceSSE from 'hooks/useSpaceSSE'
export default function SpaceSettings() {
const { space } = useGetRepositoryMetadata()
@ -56,18 +57,59 @@ export default function SpaceSettings() {
verb: 'POST',
path: `/api/v1/spaces/${space}/move`
})
const { data: exportProgressSpace, refetch: refetchExport } = useGet({
path: `/api/v1/spaces/${space}/export-progress`
})
const countFinishedRepos = () => {
return exportProgressSpace?.repos.filter((repo: TypesJobProgress) => repo.state === 'finished').length
}
const checkReposState = () => {
return exportProgressSpace?.repos.every(
(repo: TypesJobProgress) => repo.state === 'finished' || repo.state === 'failed' || repo.state === 'canceled'
)
}
const checkExportIsRunning = () => {
return exportProgressSpace?.repos.every(
(repo: TypesJobProgress) => repo.state === 'running' || repo.state === 'scheduled'
)
}
useEffect(() => {
if (exportProgressSpace?.repos && checkExportIsRunning()) {
setUpgrading(true)
setRepoCount(exportProgressSpace?.repos.length)
} else if (exportProgressSpace?.repos && checkReposState()) {
setRepoCount(countFinishedRepos)
setExportDone(true)
}
}, [exportProgressSpace, checkExportIsRunning, checkReposState, countFinishedRepos])
useSpaceSSE({
space,
events: ['repository_export_completed'],
onEvent: () => {
refetchExport()
if (exportProgressSpace && checkReposState()) {
setRepoCount(countFinishedRepos)
setExportDone(true)
}
}
})
const ExportModal = () => {
const { getString } = useStrings()
const [step, setStep] = useState(0)
const { mutate: exportSpace } = useMutate({
verb: 'POST',
path: `/api/v1/spaces/${space}/export`
})
const handleExportSubmit = (formData: ExportFormDataExtended) => {
try {
setRepoCount(formData.repoCount)
setUpgrading(true)
const exportPayload = {
accountId: formData.accountId || '',
orgIdentifier: formData.organization,
@ -77,6 +119,7 @@ export default function SpaceSettings() {
exportSpace(exportPayload)
.then(_ => {
hideModal()
setUpgrading(true)
})
.catch(_error => {
showError(getErrorMessage(_error), 0, getString('failedToImportSpace'))
@ -86,17 +129,6 @@ export default function SpaceSettings() {
}
}
useSpaceSSE({
space,
events: ['space_export_completed'],
onEvent: eventData => {
if (eventData.id === data?.id && data?.uid === eventData.uid) {
setExportDone(true)
} else if (eventData.status === 200) {
setExportDone(true)
}
}
})
return (
<Dialog
isOpen
@ -136,7 +168,7 @@ export default function SpaceSettings() {
</Dialog>
)
}
const [openModal, hideModal] = useModalHook(ExportModal, [() => {}, space])
const [openModal, hideModal] = useModalHook(ExportModal, [noop, space])
const permEditResult = hooks?.usePermissionTranslate?.(
{
resource: {
@ -174,7 +206,7 @@ export default function SpaceSettings() {
<Layout.Vertical padding={{ top: 'medium' }}>
{upgrading ? (
<Container
height={187}
height={exportDone ? 150 : 187}
color={Color.PRIMARY_BG}
padding="xlarge"
margin={{ bottom: 'medium' }}
@ -197,7 +229,7 @@ export default function SpaceSettings() {
<Container padding={{ top: 'medium' }}>
{exportDone ? (
<Text
icon={'check'}
icon={'execution-success'}
iconProps={{
size: 16,
color: Color.GREEN_500