import { useTranslation } from 'react-i18next' import { useState, useEffect } from 'react' import { OLModalHeader, OLModalTitle, OLModal, } from '@/shared/components/ol/ol-modal' import { getJSON } from '@/infrastructure/fetch-json' import useAsync from '@/shared/hooks/use-async' import { debugConsole } from '@/utils/debugging' import GitSyncLoadingModal from './git-sync-loading-modal' import GitSyncMergeOverviewModal from './git-sync-merge-overview-modal' import GitSyncMergeModal from './git-sync-merge-modal' import GitSyncConflictModal from './git-sync-conflict-modal' import GitSyncExportModal from './git-sync-export-modal' import GitSyncNeedAuthModal from './git-sync-need-auth-modal' import GitSyncNeedPermissionModal from './git-sync-need-permission-modal' import GitSyncConfirmUnlinkModal from './git-sync-confirm-unlink-modal' import GitSyncUnlinkUnavailableModal from './git-sync-unlink-unavailable-modal' import GitSyncCannotExportModal from './git-sync-cannot-export-modal' import { GitSyncModalStatus, ProjectSyncState } from '../../types/git-sync-types' type GitSyncModalProps = { show: boolean handleHide: () => void projectId: string projectName: string modalStatus: GitSyncModalStatus setModalStatus: (modalStatus: GitSyncModalStatus) => void } function GitSyncModal({ show, handleHide, projectId, projectName, modalStatus, setModalStatus, }: GitSyncModalProps) { const { t } = useTranslation() const [commitMessage, setCommitMessage] = useState('') const [errorMessage, setErrorMessage] = useState('') const { runAsync: runAsyncConn, error: errorConn, setError: setErrorConn, data: dataConn, } = useAsync() const { runAsync, data: projectSyncState, setData: setProjectSyncState, error, setError, } = useAsync() useEffect(() => { if (!show) return if (modalStatus !== 'loading') return const fetchProjectState = () => { setError(null) setErrorMessage('') runAsync(getJSON(`/project/${projectId}/github-sync/state`)) .then(pss => { switch (pss.mergeStatus) { // pss.ownerEmail is set to the email address of the project owner // or null if the user is the project owner // only owner can export project to git server case 'need-export': if (!pss.ownerEmail) setModalStatus('need-export') else setModalStatus('cannot-export') break case 'clean': case 'diverged': setModalStatus('merge-overview') break case 'conflict': setModalStatus('show-conflict') break // user does not have push permission to repo // pss.ownerEmail is set to the email address of the owner // or null if the user is the project owner // if the user is owner, it seems that repo is not accessible case 'need-permission': { if (!pss.ownerEmail) setModalStatus('unlink-unavailable') else setModalStatus('need-permission') break } } }) .catch(err => { debugConsole.error(err?.data?.message || err?.message || err) setErrorMessage(t('generic_something_went_wrong')) }) } const fetchConnectionStatus = () => { setErrorConn(null) setErrorMessage('') runAsyncConn(getJSON(`/user/github-sync/status`)) .then(isConnected => { if (!isConnected) { setModalStatus('need-auth') return } fetchProjectState() }) .catch(err => { debugConsole.error(err?.data?.message || err?.message || err) setErrorMessage(t('generic_something_went_wrong')) }) } fetchConnectionStatus() }, [show, modalStatus, projectId, runAsyncConn, runAsync]) return ( {t('sync_with_github')} {modalStatus === 'loading' && ( )} {modalStatus === 'need-export' && ( )} {modalStatus === 'cannot-export' && ( )} {modalStatus === 'need-auth' && ( )} {modalStatus === 'need-permission' && ( )} {modalStatus === 'merge-overview' && ( )} {modalStatus === 'confirm-unlink' && ( )} {modalStatus === 'unlink-unavailable' && ( )} {(modalStatus === 'run-merge' || modalStatus === 'run-merge-resolved') && ( )} {modalStatus === 'show-conflict' && ( )} ) } export default GitSyncModal