groot/automatisch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add no data alert in test substep and execution

Browse Source
This commit is contained in:
Ali BARIN
2022-09-01 22:22:18 +02:00
parent 91f5f1d628
commit dc79d623be
6 changed files with 47 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
packages/web/src/pages/Execution/index.tsx
View File

@@ -2,8 +2,12 @@ import * as React from 'react';
import { useParams } from 'react-router-dom';
import { useQuery } from '@apollo/client';
import Grid from '@mui/material/Grid';
import Box from '@mui/material/Box';
import AlertTitle from '@mui/material/AlertTitle';
import Alert from '@mui/material/Alert';
import type { IExecutionStep } from '@automatisch/types';
import useFormatMessage from 'hooks/useFormatMessage';
import ExecutionHeader from 'components/ExecutionHeader';
import ExecutionStep from 'components/ExecutionStep';
import Container from 'components/Container';
@@ -23,8 +27,9 @@ const getLimitAndOffset = (page: number) => ({
export default function Execution(): React.ReactElement {
const { executionId } = useParams() as ExecutionParams;
const formatMessage = useFormatMessage();
const { data: execution } = useQuery(GET_EXECUTION, { variables: { executionId } });
const { data } = useQuery(GET_EXECUTION_STEPS, { variables: { executionId, ...getLimitAndOffset(1) } });
const { data, loading } = useQuery(GET_EXECUTION_STEPS, { variables: { executionId, ...getLimitAndOffset(1) } });
const { edges } = data?.getExecutionSteps || {};
const executionSteps: IExecutionStep[] = edges?.map((edge: { node: IExecutionStep }) => edge.node);
@@ -36,6 +41,14 @@ export default function Execution(): React.ReactElement {
/>
<Grid container item sx={{ mt: 2, mb: [2, 5] }} rowGap={3}>
{!loading && !executionSteps?.length && (
<Alert severity="warning" sx={{ flex: 1 }}>
<AlertTitle sx={{ fontWeight: 700 }}>{formatMessage('execution.noDataTitle')}</AlertTitle>
<Box sx={{ fontWeight: 400 }}>{formatMessage('execution.noDataMessage')}</Box>
</Alert>
)}
{executionSteps?.map((executionStep) => (
<ExecutionStep key={executionStep.id} executionStep={executionStep} step={executionStep.step} />
))}