front/core/api/entityView: move default components out to components

frontend/packages/core/src/api/entityView/EntityPageBuilder.tsx

@@ -1,19 +1,8 @@
-import React, { ComponentType, FC } from 'react';
-import { Route, Redirect, Switch } from 'react-router-dom';
-import List from '@material-ui/core/List';
-import ListItem from '@material-ui/core/ListItem';
-import { AppComponentBuilder, App } from '../app/types';
-import { useEntity, useEntityUri, useEntityConfig } from './EntityContext';
-import EntityLink from '../../components/EntityLink/EntityLink';
+import React, { ComponentType } from 'react';
+import DefaultEntityPage from '../../components/DefaultEntityPage';
+import { App, AppComponentBuilder } from '../app/types';
 import BackstagePlugin from '../plugin/Plugin';
-import { Header } from '../..';
-import {
-  EntityPageNavbarProps,
-  EntityPageHeaderProps,
-  EntityPageProps,
-  EntityPageNavItem,
-  EntityPageView,
-} from './types';
+import { EntityPageNavItem, EntityPageView } from './types';
 
 // type AppComponents = {
 //   EntityPage: ComponentType<EntityPageProps>;
@@ -21,51 +10,6 @@ import {
 //   EntityPageHeader: ComponentType<EntityPageHeaderProps>;
 // };
 
-const DefaultEntityPageNavbar: FC<EntityPageNavbarProps> = ({ navItems }) => {
-  const entityUri = useEntityUri();
-
-  return (
-    <List>
-      {navItems.map(({ title, target }) => (
-        <ListItem key={target}>
-          <EntityLink uri={entityUri} subPath={target}>
-            {title}
-          </EntityLink>
-        </ListItem>
-      ))}
-    </List>
-  );
-};
-
-const DefaultEntityPageHeader: FC<EntityPageHeaderProps> = () => {
-  const { id } = useEntity();
-  const config = useEntityConfig();
-  return <Header title={`${config.title} - ${id}`} />;
-};
-
-const DefaultEntityPage: FC<EntityPageProps> = ({ navItems, views }) => {
-  const { kind, id } = useEntity();
-  const basePath = `/entity/${kind}/${id}`;
-
-  return (
-    <div>
-      <DefaultEntityPageHeader />
-      <DefaultEntityPageNavbar navItems={navItems} />
-      <Switch>
-        {views.map(({ path, component }) => (
-          <Route
-            key={path}
-            exact
-            path={`${basePath}${path}`}
-            component={component}
-          />
-        ))}
-        <Redirect from={basePath} to={`${basePath}${views[0].path}`} />
-      </Switch>
-    </div>
-  );
-};
-
 type EntityPageRegistration =
   | {
       type: 'page';

frontend/packages/core/src/components/DefaultEntityPage/DefaultEntityPage.tsx

@@ -0,0 +1,31 @@
+import React, { FC } from 'react';
+import { EntityPageProps } from '../../api/entityView/types';
+import { useEntity } from '../../api';
+import { Switch, Route, Redirect } from 'react-router-dom';
+import DefaultEntityPageHeader from '../DefaultEntityPageHeader';
+import DefaultEntityPageNavbar from '../DefaultEntityPageNavbar';
+
+const DefaultEntityPage: FC<EntityPageProps> = ({ navItems, views }) => {
+  const { kind, id } = useEntity();
+  const basePath = `/entity/${kind}/${id}`;
+
+  return (
+    <div>
+      <DefaultEntityPageHeader />
+      <DefaultEntityPageNavbar navItems={navItems} />
+      <Switch>
+        {views.map(({ path, component }) => (
+          <Route
+            key={path}
+            exact
+            path={`${basePath}${path}`}
+            component={component}
+          />
+        ))}
+        <Redirect from={basePath} to={`${basePath}${views[0].path}`} />
+      </Switch>
+    </div>
+  );
+};
+
+export default DefaultEntityPage;

frontend/packages/core/src/components/DefaultEntityPage/index.ts

@@ -0,0 +1 @@
+export { default } from './DefaultEntityPage';

frontend/packages/core/src/components/DefaultEntityPageHeader/DefaultEntityPageHeader.tsx

@@ -0,0 +1,11 @@
+import React, { FC } from 'react';
+import { Header, useEntity, useEntityConfig } from '../..';
+import { EntityPageHeaderProps } from '../../api/entityView/types';
+
+const DefaultEntityPageHeader: FC<EntityPageHeaderProps> = () => {
+  const { id } = useEntity();
+  const config = useEntityConfig();
+  return <Header title={`${config.title} - ${id}`} />;
+};
+
+export default DefaultEntityPageHeader;

frontend/packages/core/src/components/DefaultEntityPageHeader/index.ts

@@ -0,0 +1 @@
+export { default } from './DefaultEntityPageHeader';

frontend/packages/core/src/components/DefaultEntityPageNavbar/DefaultEntityPageNavbar.tsx

@@ -0,0 +1,22 @@
+import React, { FC } from 'react';
+import { EntityPageNavbarProps } from '../../api/entityView/types';
+import { useEntityUri, EntityLink } from '../..';
+import { List, ListItem } from '@material-ui/core';
+
+const DefaultEntityPageNavbar: FC<EntityPageNavbarProps> = ({ navItems }) => {
+  const entityUri = useEntityUri();
+
+  return (
+    <List>
+      {navItems.map(({ title, target }) => (
+        <ListItem key={target}>
+          <EntityLink uri={entityUri} subPath={target}>
+            {title}
+          </EntityLink>
+        </ListItem>
+      ))}
+    </List>
+  );
+};
+
+export default DefaultEntityPageNavbar;

frontend/packages/core/src/components/DefaultEntityPageNavbar/index.ts

@@ -0,0 +1 @@
+export { default } from './DefaultEntityPageNavbar';