console: do not hide one-click-deploy error box till retried step is reached

[GT-497]: https://hasurahq.atlassian.net/browse/GT-497?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ

PR-URL: https://github.com/hasura/graphql-engine-mono/pull/7969
GitOrigin-RevId: b99544359fc15b83261f7cc790421b7fea5513ff
This commit is contained in:
Rikin Kachhia 2023-02-21 15:53:16 +05:30 committed by hasura-bot
parent 39f3e90be8
commit c402edee02
5 changed files with 37 additions and 24 deletions

View File

@ -72,6 +72,7 @@ export const CliLog: React.VFC<Props> = props => {
<ErrorBox <ErrorBox
step={step} step={step}
error={status.error} error={status.error}
logId={status.logId}
retryAction={retryAction} retryAction={retryAction}
fallbackApps={fallbackApps} fallbackApps={fallbackApps}
/> />

View File

@ -15,25 +15,20 @@ import { transformFallbackAppToLinkButtonProps } from '../fallbackAppUtil';
type Props = { type Props = {
step: UserFacingStep; step: UserFacingStep;
error: Record<string, any>; error: Record<string, any>;
logId: number;
retryAction: VoidFunction; retryAction: VoidFunction;
fallbackApps: FallbackApp[]; fallbackApps: FallbackApp[];
}; };
export function ErrorBox(props: Props) { export function ErrorBox(props: Props) {
const { step, error, retryAction, fallbackApps } = props; const { step, error, retryAction, fallbackApps, logId } = props;
const [isRetrying, setIsRetrying] = React.useState(false); const [isRetrying, setIsRetrying] = React.useState(false);
// mark retry as complete if logId is different
React.useEffect(() => { React.useEffect(() => {
let timeout: NodeJS.Timeout; setIsRetrying(false);
if (isRetrying) { }, [logId]);
timeout = setTimeout(() => {
setIsRetrying(false);
}, 5000);
}
return () => {
clearTimeout(timeout);
};
}, [isRetrying]);
const onRetryClick = () => { const onRetryClick = () => {
if (!isRetrying && retryAction) { if (!isRetrying && retryAction) {

View File

@ -62,6 +62,7 @@ export type ProgressStateStatus =
| { | {
kind: 'error'; kind: 'error';
error: Record<string, any>; error: Record<string, any>;
logId: number;
} }
| { | {
kind: 'awaiting'; kind: 'awaiting';

View File

@ -76,6 +76,7 @@ const tc: {
[OneClickDeploymentState.ReadingEnvironmentVariables]: { [OneClickDeploymentState.ReadingEnvironmentVariables]: {
kind: 'error', kind: 'error',
error: { message: 'unexpected' }, error: { message: 'unexpected' },
logId: 2,
}, },
[OneClickDeploymentState.AwaitingEnvironmentVariables]: { kind: 'idle' }, [OneClickDeploymentState.AwaitingEnvironmentVariables]: { kind: 'idle' },
[OneClickDeploymentState.SufficientEnvironmentVariables]: { [OneClickDeploymentState.SufficientEnvironmentVariables]: {
@ -158,6 +159,7 @@ const tc: {
[OneClickDeploymentState.ApplyingMetadataMigrationsSeeds]: { [OneClickDeploymentState.ApplyingMetadataMigrationsSeeds]: {
kind: 'error', kind: 'error',
error: { message: 'unable to connect' }, error: { message: 'unable to connect' },
logId: 2,
}, },
[OneClickDeploymentState.Completed]: { kind: 'idle' }, [OneClickDeploymentState.Completed]: { kind: 'idle' },
}, },

View File

@ -16,12 +16,23 @@ const getStepError = (
allStateTransitionsOrdered: OneClickDeploymentStateTransition[], allStateTransitionsOrdered: OneClickDeploymentStateTransition[],
step: UserFacingStep step: UserFacingStep
): ProgressStateStatus | null => { ): ProgressStateStatus | null => {
const lastTransition = let errorStatus: ProgressStateStatus | null = null;
allStateTransitionsOrdered[allStateTransitionsOrdered.length - 1]; // run through all transitions to get the latest state of a step
return lastTransition?.from_state === step && allStateTransitionsOrdered.forEach(transition => {
lastTransition.to_state === OneClickDeploymentState.Error if (transition.from_state === step) {
? { kind: 'error', error: lastTransition.additional_info } if (transition.to_state === OneClickDeploymentState.Error) {
: null; errorStatus = {
kind: 'error',
error: transition.additional_info,
logId: transition.id,
};
} else {
errorStatus = null;
}
}
});
return errorStatus;
}; };
/** /**
@ -34,6 +45,7 @@ const getStepSuccess = (
step: UserFacingStep step: UserFacingStep
): ProgressStateStatus | null => { ): ProgressStateStatus | null => {
let successStatus: ProgressStateStatus | null = null; let successStatus: ProgressStateStatus | null = null;
// run through all transitions to get the latest state of a step
allStateTransitionsOrdered.forEach(transition => { allStateTransitionsOrdered.forEach(transition => {
if (transition.from_state === step) { if (transition.from_state === step) {
// it's not a success if the step goes into an error // it's not a success if the step goes into an error
@ -129,17 +141,19 @@ const getStepProgressState = (
return { kind: 'idle' }; return { kind: 'idle' };
} }
// return error if error
const stepError = getStepError(allStateTransitionsOrdered, step);
if (stepError) return stepError;
// return success if success // return success if success
const stepSuccess = getStepSuccess(allStateTransitionsOrdered, step); const stepSuccess = getStepSuccess(allStateTransitionsOrdered, step);
if (stepSuccess) return stepSuccess; if (stepSuccess) return stepSuccess;
return ( // return pending if in progress
getStepPendingState(allStateTransitionsOrdered, step) || { kind: 'idle' } const stepPending = getStepPendingState(allStateTransitionsOrdered, step);
); if (stepPending) return stepPending;
// return error if error
const stepError = getStepError(allStateTransitionsOrdered, step);
if (stepError) return stepError;
return { kind: 'idle' };
}; };
export const getCliProgressState = ( export const getCliProgressState = (