diff --git a/kafka-ui-react-app/src/components/App.styled.ts b/kafka-ui-react-app/src/components/App.styled.ts index 39e9e83b05..cb01bd94fc 100644 --- a/kafka-ui-react-app/src/components/App.styled.ts +++ b/kafka-ui-react-app/src/components/App.styled.ts @@ -1,4 +1,5 @@ import styled, { css } from 'styled-components'; +import { Link } from 'react-router-dom'; export const Layout = styled.div` min-width: 1200px; @@ -166,7 +167,7 @@ export const Span = styled.span( ` ); -export const Hyperlink = styled.a( +export const Hyperlink = styled(Link)( ({ theme }) => css` position: relative; diff --git a/kafka-ui-react-app/src/components/App.tsx b/kafka-ui-react-app/src/components/App.tsx index 9be24aa71d..9d7acc2a1b 100644 --- a/kafka-ui-react-app/src/components/App.tsx +++ b/kafka-ui-react-app/src/components/App.tsx @@ -58,7 +58,7 @@ const App: React.FC = () => { - + UI for Apache Kafka @@ -86,12 +86,8 @@ const App: React.FC = () => { /> {areClustersFulfilled ? ( - - + + ) : ( diff --git a/kafka-ui-react-app/src/components/Cluster/Cluster.tsx b/kafka-ui-react-app/src/components/Cluster/Cluster.tsx index 54538de4a7..fd060f57cf 100644 --- a/kafka-ui-react-app/src/components/Cluster/Cluster.tsx +++ b/kafka-ui-react-app/src/components/Cluster/Cluster.tsx @@ -99,8 +99,8 @@ const Cluster: React.FC = () => { /> )} diff --git a/kafka-ui-react-app/src/components/Cluster/__tests__/Cluster.spec.tsx b/kafka-ui-react-app/src/components/Cluster/__tests__/Cluster.spec.tsx index cb26131eef..575b02a28a 100644 --- a/kafka-ui-react-app/src/components/Cluster/__tests__/Cluster.spec.tsx +++ b/kafka-ui-react-app/src/components/Cluster/__tests__/Cluster.spec.tsx @@ -29,7 +29,7 @@ jest.mock('components/KsqlDb/KsqlDb', () => () =>
KsqlDb
); describe('Cluster', () => { const renderComponent = (pathname: string) => render( - + , { pathname, store } diff --git a/kafka-ui-react-app/src/components/Connect/Details/Actions/__tests__/__snapshots__/Actions.spec.tsx.snap b/kafka-ui-react-app/src/components/Connect/Details/Actions/__tests__/__snapshots__/Actions.spec.tsx.snap index 2a7e19bd94..14b0ba8d8c 100644 --- a/kafka-ui-react-app/src/components/Connect/Details/Actions/__tests__/__snapshots__/Actions.spec.tsx.snap +++ b/kafka-ui-react-app/src/components/Connect/Details/Actions/__tests__/__snapshots__/Actions.spec.tsx.snap @@ -145,7 +145,7 @@ exports[`Actions view matches snapshot 1`] = ` {!isReadOnly && !isInternal && ( - + } right> @@ -173,22 +170,22 @@ const Details: React.FC = ({ diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/__test__/__snapshots__/Details.spec.tsx.snap b/kafka-ui-react-app/src/components/Topics/Topic/Details/__test__/__snapshots__/Details.spec.tsx.snap index 08ea5b1dae..96cc3d9fae 100644 --- a/kafka-ui-react-app/src/components/Topics/Topic/Details/__test__/__snapshots__/Details.spec.tsx.snap +++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/__test__/__snapshots__/Details.spec.tsx.snap @@ -107,22 +107,22 @@ exports[`Details when it has readonly flag does not render the Action button a T role="navigation" > Overview Messages Consumers Settings diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Topic.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Topic.tsx index 3b821658d2..e2180b9d39 100644 --- a/kafka-ui-react-app/src/components/Topics/Topic/Topic.tsx +++ b/kafka-ui-react-app/src/components/Topics/Topic/Topic.tsx @@ -35,16 +35,16 @@ const Topic: React.FC = ({ diff --git a/kafka-ui-react-app/src/components/common/Breadcrumb/__tests__/Breadcrumb.spec.tsx b/kafka-ui-react-app/src/components/common/Breadcrumb/__tests__/Breadcrumb.spec.tsx index 2012305ef0..b0d67d72a1 100644 --- a/kafka-ui-react-app/src/components/common/Breadcrumb/__tests__/Breadcrumb.spec.tsx +++ b/kafka-ui-react-app/src/components/common/Breadcrumb/__tests__/Breadcrumb.spec.tsx @@ -4,11 +4,11 @@ import { BreadcrumbProvider } from 'components/common/Breadcrumb/Breadcrumb.prov import { BreadcrumbRoute } from 'components/common/Breadcrumb/Breadcrumb.route'; import { render } from 'lib/testHelpers'; -const createTopicPath = '/ui/clusters/local/topics/create-new'; -const createTopicRoutePath = '/ui/clusters/:clusterName/topics/create-new'; +const createTopicPath = '/clusters/local/topics/create-new'; +const createTopicRoutePath = '/clusters/:clusterName/topics/create-new'; -const topicPath = '/ui/clusters/secondLocal/topics/topic-name'; -const topicRoutePath = '/ui/clusters/:clusterName/topics/:topicName'; +const topicPath = '/clusters/secondLocal/topics/topic-name'; +const topicRoutePath = '/clusters/:clusterName/topics/:topicName'; describe('Breadcrumb component', () => { const setupComponent = (pathname: string, routePath: string) => diff --git a/kafka-ui-react-app/src/lib/__test__/paths.spec.ts b/kafka-ui-react-app/src/lib/__test__/paths.spec.ts index 3103114233..96deab97e4 100644 --- a/kafka-ui-react-app/src/lib/__test__/paths.spec.ts +++ b/kafka-ui-react-app/src/lib/__test__/paths.spec.ts @@ -15,9 +15,7 @@ describe('Paths', () => { ); }); it('clusterPath', () => { - expect(paths.clusterPath(clusterName)).toEqual( - `/ui/clusters/${clusterName}` - ); + expect(paths.clusterPath(clusterName)).toEqual(`/clusters/${clusterName}`); }); it('clusterBrokersPath', () => { expect(paths.clusterBrokersPath(clusterName)).toEqual( diff --git a/kafka-ui-react-app/src/lib/paths.ts b/kafka-ui-react-app/src/lib/paths.ts index 6e82423db0..5a2b41458c 100644 --- a/kafka-ui-react-app/src/lib/paths.ts +++ b/kafka-ui-react-app/src/lib/paths.ts @@ -12,7 +12,7 @@ export const gitCommitPath = (commit: string) => `${GIT_REPO_LINK}/commit/${commit}`; export const clusterPath = (clusterName: ClusterName) => - `/ui/clusters/${clusterName}`; + `/clusters/${clusterName}`; // Brokers export const clusterBrokersPath = (clusterName: ClusterName) =>