Add cluster wrapper + cleanup

kafka-ui-react-app/src/components/App.tsx

@@ -1,13 +1,10 @@
 import React from 'react';
-import { Switch, Route, Redirect } from 'react-router-dom';
+import { Switch, Route } from 'react-router-dom';
 import './App.scss';
-import BrokersContainer from './Brokers/BrokersContainer';
-import TopicsContainer from './Topics/TopicsContainer';
 import NavContainer from './Nav/NavContainer';
 import PageLoader from './common/PageLoader/PageLoader';
 import Dashboard from './Dashboard/Dashboard';
-import ConsumersGroupsContainer from './ConsumerGroups/ConsumersGroupsContainer';
-import SchemasContainer from './Schemas/SchemasContainer';
+import Cluster from './Cluster/Cluster';
 
 interface AppProps {
   isClusterListFetched: boolean;
@@ -44,29 +41,10 @@ const App: React.FC<AppProps> = ({
               path={['/', '/ui', '/ui/clusters']}
               component={Dashboard}
             />
-            <Route
-              path="/ui/clusters/:clusterName/brokers"
-              component={BrokersContainer}
-            />
-            <Route
-              path="/ui/clusters/:clusterName/topics"
-              component={TopicsContainer}
-            />
-            <Route
-              path="/ui/clusters/:clusterName/consumer-groups"
-              component={ConsumersGroupsContainer}
-            />
-            <Route
-              path="/ui/clusters/:clusterName/schemas"
-              component={SchemasContainer}
-            />
-            <Redirect
-              from="/ui/clusters/:clusterName"
-              to="/ui/clusters/:clusterName/brokers"
-            />
+            <Route path="/ui/clusters/:clusterName" component={Cluster} />
           </Switch>
         ) : (
-          <PageLoader />
+          <PageLoader fullHeight />
         )}
       </main>
     </div>

kafka-ui-react-app/src/components/Cluster/Cluster.tsx

@@ -0,0 +1,30 @@
+import React from 'react';
+import { Switch, Route, Redirect } from 'react-router-dom';
+import BrokersContainer from 'components/Brokers/BrokersContainer';
+import TopicsContainer from 'components/Topics/TopicsContainer';
+import ConsumersGroupsContainer from 'components/ConsumerGroups/ConsumersGroupsContainer';
+import Schemas from 'components/Schemas/Schemas';
+
+const Cluster: React.FC = () => (
+  <Switch>
+    <Route
+      path="/ui/clusters/:clusterName/brokers"
+      component={BrokersContainer}
+    />
+    <Route
+      path="/ui/clusters/:clusterName/topics"
+      component={TopicsContainer}
+    />
+    <Route
+      path="/ui/clusters/:clusterName/consumer-groups"
+      component={ConsumersGroupsContainer}
+    />
+    <Route path="/ui/clusters/:clusterName/schemas" component={Schemas} />
+    <Redirect
+      from="/ui/clusters/:clusterName"
+      to="/ui/clusters/:clusterName/brokers"
+    />
+  </Switch>
+);
+
+export default Cluster;

kafka-ui-react-app/src/components/Schemas/Details/__test__/Details.spec.tsx

@@ -24,6 +24,7 @@ describe('Details', () => {
   describe('View', () => {
     const setupWrapper = (props: Partial<DetailsProps> = {}) => (
       <Details
+        subject={schema.subject}
         schema={schema}
         clusterName="Test cluster"
         fetchSchemaVersions={jest.fn()}

kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/Details.spec.tsx.snap

@@ -16,7 +16,9 @@ exports[`Details View Initial state matches snapshot 1`] = `
           },
         ]
       }
-    />
+    >
+      test
+    </Breadcrumb>
   </div>
   <div
     className="box"
@@ -121,7 +123,9 @@ exports[`Details View when page with schema versions is loading matches snapshot
           },
         ]
       }
-    />
+    >
+      test
+    </Breadcrumb>
   </div>
   <PageLoader />
 </div>
@@ -143,7 +147,9 @@ exports[`Details View when page with schema versions loaded when schema has vers
           },
         ]
       }
-    />
+    >
+      test
+    </Breadcrumb>
   </div>
   <div
     className="box"
@@ -275,7 +281,9 @@ exports[`Details View when page with schema versions loaded when versions are em
           },
         ]
       }
-    />
+    >
+      test
+    </Breadcrumb>
   </div>
   <div
     className="box"