diff --git a/packages/web/src/components/NoResultFound/index.tsx b/packages/web/src/components/NoResultFound/index.tsx
index c4835665..1ed981d0 100644
--- a/packages/web/src/components/NoResultFound/index.tsx
+++ b/packages/web/src/components/NoResultFound/index.tsx
@@ -9,7 +9,7 @@ import { CardContent } from './style';
type NoResultFoundProps = {
text?: string;
- to: string;
+ to?: string;
}
export default function NoResultFound(props: NoResultFoundProps): React.ReactElement {
@@ -21,6 +21,8 @@ export default function NoResultFound(props: NoResultFoundProps): React.ReactEle
linkProps,
ref,
) {
+ if (!to) return
{linkProps.children}
;
+
return ;
}),
[to],
@@ -30,7 +32,7 @@ export default function NoResultFound(props: NoResultFoundProps): React.ReactEle
-
+ {!!to && }
{text}
diff --git a/packages/web/src/locales/en.json b/packages/web/src/locales/en.json
index c75dabd7..dea54604 100644
--- a/packages/web/src/locales/en.json
+++ b/packages/web/src/locales/en.json
@@ -51,6 +51,7 @@
"flows.noFlows": "You don't have any flows yet.",
"flowEditor.goBack": "Go back to flows",
"executions.title": "Executions",
+ "executions.noExecutions": "There is no execution data point to show.",
"execution.executedAt": "executed {datetime}",
"profileSettings.title": "My Profile",
"profileSettings.email": "Email",
diff --git a/packages/web/src/pages/Executions/index.tsx b/packages/web/src/pages/Executions/index.tsx
index 446411b2..aabe0557 100644
--- a/packages/web/src/pages/Executions/index.tsx
+++ b/packages/web/src/pages/Executions/index.tsx
@@ -3,15 +3,19 @@ import { Link, useSearchParams } from 'react-router-dom';
import { useQuery } from '@apollo/client';
import Box from '@mui/material/Box';
import Grid from '@mui/material/Grid';
+import CircularProgress from '@mui/material/CircularProgress';
+import Divider from '@mui/material/Divider';
import Pagination from '@mui/material/Pagination';
import PaginationItem from '@mui/material/PaginationItem';
import type { IExecution } from '@automatisch/types';
+import NoResultFound from 'components/NoResultFound';
import ExecutionRow from 'components/ExecutionRow';
import Container from 'components/Container';
import PageTitle from 'components/PageTitle';
import useFormatMessage from 'hooks/useFormatMessage'
import { GET_EXECUTIONS } from 'graphql/queries/get-executions';
+import * as URLS from 'config/urls';
const EXECUTION_PER_PAGE = 10;
@@ -25,7 +29,7 @@ export default function Executions(): React.ReactElement {
const [searchParams, setSearchParams] = useSearchParams();
const page = parseInt(searchParams.get('page') || '', 10) || 1;
- const { data, refetch } = useQuery(GET_EXECUTIONS, {
+ const { data, refetch, loading } = useQuery(GET_EXECUTIONS, {
variables: getLimitAndOffset(page),
fetchPolicy: 'cache-and-network',
pollInterval: 5000,
@@ -38,17 +42,26 @@ export default function Executions(): React.ReactElement {
}, [refetch, page])
const executions: IExecution[] = edges?.map(({ node }: { node: IExecution }) => node);
+ const hasExecutions = executions?.length;
return (
-
+
{formatMessage('executions.title')}
- {executions?.map((execution) => ())}
+
+
+ {loading && }
+
+ {!loading && !hasExecutions && ()}
+
+ {!loading && executions?.map((execution) => ())}
{pageInfo && pageInfo.totalPages > 1 &&