diff --git a/frontend/packages/core/src/api/entityView/EntityPageBuilder.tsx b/frontend/packages/core/src/api/entityView/EntityPageBuilder.tsx index 19f2e3ec8b..da6b315534 100644 --- a/frontend/packages/core/src/api/entityView/EntityPageBuilder.tsx +++ b/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; @@ -21,51 +10,6 @@ import { // EntityPageHeader: ComponentType; // }; -const DefaultEntityPageNavbar: FC = ({ navItems }) => { - const entityUri = useEntityUri(); - - return ( - - {navItems.map(({ title, target }) => ( - - - {title} - - - ))} - - ); -}; - -const DefaultEntityPageHeader: FC = () => { - const { id } = useEntity(); - const config = useEntityConfig(); - return
; -}; - -const DefaultEntityPage: FC = ({ navItems, views }) => { - const { kind, id } = useEntity(); - const basePath = `/entity/${kind}/${id}`; - - return ( -
- - - - {views.map(({ path, component }) => ( - - ))} - - -
- ); -}; - type EntityPageRegistration = | { type: 'page'; diff --git a/frontend/packages/core/src/components/DefaultEntityPage/DefaultEntityPage.tsx b/frontend/packages/core/src/components/DefaultEntityPage/DefaultEntityPage.tsx new file mode 100644 index 0000000000..df68484609 --- /dev/null +++ b/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 = ({ navItems, views }) => { + const { kind, id } = useEntity(); + const basePath = `/entity/${kind}/${id}`; + + return ( +
+ + + + {views.map(({ path, component }) => ( + + ))} + + +
+ ); +}; + +export default DefaultEntityPage; diff --git a/frontend/packages/core/src/components/DefaultEntityPage/index.ts b/frontend/packages/core/src/components/DefaultEntityPage/index.ts new file mode 100644 index 0000000000..4f683076c4 --- /dev/null +++ b/frontend/packages/core/src/components/DefaultEntityPage/index.ts @@ -0,0 +1 @@ +export { default } from './DefaultEntityPage'; diff --git a/frontend/packages/core/src/components/DefaultEntityPageHeader/DefaultEntityPageHeader.tsx b/frontend/packages/core/src/components/DefaultEntityPageHeader/DefaultEntityPageHeader.tsx new file mode 100644 index 0000000000..b93f54b7e5 --- /dev/null +++ b/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 = () => { + const { id } = useEntity(); + const config = useEntityConfig(); + return
; +}; + +export default DefaultEntityPageHeader; diff --git a/frontend/packages/core/src/components/DefaultEntityPageHeader/index.ts b/frontend/packages/core/src/components/DefaultEntityPageHeader/index.ts new file mode 100644 index 0000000000..5c9304bad7 --- /dev/null +++ b/frontend/packages/core/src/components/DefaultEntityPageHeader/index.ts @@ -0,0 +1 @@ +export { default } from './DefaultEntityPageHeader'; diff --git a/frontend/packages/core/src/components/DefaultEntityPageNavbar/DefaultEntityPageNavbar.tsx b/frontend/packages/core/src/components/DefaultEntityPageNavbar/DefaultEntityPageNavbar.tsx new file mode 100644 index 0000000000..3b827cf838 --- /dev/null +++ b/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 = ({ navItems }) => { + const entityUri = useEntityUri(); + + return ( + + {navItems.map(({ title, target }) => ( + + + {title} + + + ))} + + ); +}; + +export default DefaultEntityPageNavbar; diff --git a/frontend/packages/core/src/components/DefaultEntityPageNavbar/index.ts b/frontend/packages/core/src/components/DefaultEntityPageNavbar/index.ts new file mode 100644 index 0000000000..14a807a40f --- /dev/null +++ b/frontend/packages/core/src/components/DefaultEntityPageNavbar/index.ts @@ -0,0 +1 @@ +export { default } from './DefaultEntityPageNavbar';