diff --git a/awx/ui_next/src/components/ContentError/ContentError.jsx b/awx/ui_next/src/components/ContentError/ContentError.jsx index e3723dc48d..6aa43a68e0 100644 --- a/awx/ui_next/src/components/ContentError/ContentError.jsx +++ b/awx/ui_next/src/components/ContentError/ContentError.jsx @@ -9,8 +9,8 @@ import { EmptyStateBody, } from '@patternfly/react-core'; import { ExclamationTriangleIcon } from '@patternfly/react-icons'; - import ErrorDetail from '@components/ErrorDetail'; +import NotFoundError from './NotFoundError'; const EmptyState = styled(PFEmptyState)` width: var(--pf-c-empty-state--m-lg--MaxWidth); @@ -19,6 +19,12 @@ const EmptyState = styled(PFEmptyState)` class ContentError extends React.Component { render() { const { error, i18n } = this.props; + if (error && error.response && error.response.status === 401) { + // TODO: check for session timeout & redirect to /login + } + if (error && error.response && error.response.status === 404) { + return ; + } return ( diff --git a/awx/ui_next/src/components/ContentError/NotFoundError.jsx b/awx/ui_next/src/components/ContentError/NotFoundError.jsx new file mode 100644 index 0000000000..022cf8e927 --- /dev/null +++ b/awx/ui_next/src/components/ContentError/NotFoundError.jsx @@ -0,0 +1,34 @@ +import React from 'react'; +import { t } from '@lingui/macro'; +import styled from 'styled-components'; +import { withI18n } from '@lingui/react'; +import { + Title, + EmptyState as PFEmptyState, + EmptyStateIcon, + EmptyStateBody, +} from '@patternfly/react-core'; +import { ExclamationTriangleIcon } from '@patternfly/react-icons'; +import ErrorDetail from '@components/ErrorDetail'; + +const EmptyState = styled(PFEmptyState)` + width: var(--pf-c-empty-state--m-lg--MaxWidth); +`; + +function NotFoundError ({ i18n, error }) { + return ( + + + + {i18n._(t`Not Found`)} + + + {i18n._(`The page you requested could not be found.`)} + + {error && } + + ); +} + +export { NotFoundError as _NotFoundError }; +export default withI18n()(NotFoundError); diff --git a/awx/ui_next/src/components/ContentError/index.js b/awx/ui_next/src/components/ContentError/index.js index 14587f410d..8f0d6fcf9c 100644 --- a/awx/ui_next/src/components/ContentError/index.js +++ b/awx/ui_next/src/components/ContentError/index.js @@ -1 +1,2 @@ export { default } from './ContentError'; +export { default as NotFoundError } from './NotFoundError'; diff --git a/awx/ui_next/src/index.jsx b/awx/ui_next/src/index.jsx index dfec0c4c49..9fd10daf47 100644 --- a/awx/ui_next/src/index.jsx +++ b/awx/ui_next/src/index.jsx @@ -32,6 +32,7 @@ import License from '@screens/License'; import Teams from '@screens/Team'; import Templates from '@screens/Template'; import Users from '@screens/User'; +import NotFound from '@screens/NotFound'; import App from './App'; import RootProvider from './RootProvider'; @@ -224,8 +225,8 @@ export function main(render) { ], }, ]} - render={({ routeGroups }) => - routeGroups + render={({ routeGroups }) => { + const routeList = routeGroups .reduce( (allRoutes, { routes }) => allRoutes.concat(routes), [] @@ -238,8 +239,16 @@ export function main(render) { )} /> - )) - } + )); + routeList.push( + + ); + return {routeList}; + }} /> )} /> diff --git a/awx/ui_next/src/screens/NotFound.jsx b/awx/ui_next/src/screens/NotFound.jsx new file mode 100644 index 0000000000..a50ed2e05e --- /dev/null +++ b/awx/ui_next/src/screens/NotFound.jsx @@ -0,0 +1,15 @@ +import React from 'react'; +import { PageSection, Card } from '@patternfly/react-core'; +import { NotFoundError } from '@components/ContentError'; + +function NotFound() { + return ( + + + + + + ); +} + +export default NotFound;