From 54214323c60c6e1a8850df15ea1803248f6b14e7 Mon Sep 17 00:00:00 2001 From: Patrik Oldsberg Date: Tue, 10 Mar 2020 15:54:04 +0100 Subject: [PATCH] packages/core: removed entity-related APIs --- packages/app/src/App.tsx | 2 - packages/app/src/entities/MockEntityCard.tsx | 9 -- packages/app/src/entities/MockEntityPage.tsx | 12 -- packages/app/src/entities/index.ts | 45 ------- packages/core/src/api/api.ts | 10 -- packages/core/src/api/app/AppBuilder.tsx | 92 ++------------ packages/core/src/api/app/types.ts | 2 - packages/core/src/api/entity/EntityKind.ts | 21 ---- .../core/src/api/entityView/EntityContext.tsx | 42 ------- .../src/api/entityView/EntityPageBuilder.tsx | 114 ------------------ packages/core/src/api/entityView/types.ts | 24 ---- packages/core/src/api/index.ts | 5 - packages/core/src/api/plugin/Plugin.tsx | 47 -------- packages/core/src/api/plugin/types.ts | 22 +--- .../DefaultEntityPage/DefaultEntityPage.tsx | 61 ---------- .../src/components/DefaultEntityPage/index.ts | 1 - .../DefaultEntityPageHeader.tsx | 18 --- .../DefaultEntityPageHeader/index.ts | 1 - .../DefaultEntityPageNavbar.tsx | 37 ------ .../DefaultEntityPageNavbar/NavbarItem.tsx | 71 ----------- .../DefaultEntityPageNavbar/index.ts | 1 - .../src/components/EntityLink/EntityLink.tsx | 51 -------- .../EntityLink/RelativeEntityLink.tsx | 16 --- .../core/src/components/EntityLink/index.ts | 2 - packages/core/src/index.ts | 4 - .../src/components/HomePage/HomePage.tsx | 7 +- 26 files changed, 12 insertions(+), 705 deletions(-) delete mode 100644 packages/app/src/entities/MockEntityCard.tsx delete mode 100644 packages/app/src/entities/MockEntityPage.tsx delete mode 100644 packages/app/src/entities/index.ts delete mode 100644 packages/core/src/api/entity/EntityKind.ts delete mode 100644 packages/core/src/api/entityView/EntityContext.tsx delete mode 100644 packages/core/src/api/entityView/EntityPageBuilder.tsx delete mode 100644 packages/core/src/api/entityView/types.ts delete mode 100644 packages/core/src/components/DefaultEntityPage/DefaultEntityPage.tsx delete mode 100644 packages/core/src/components/DefaultEntityPage/index.ts delete mode 100644 packages/core/src/components/DefaultEntityPageHeader/DefaultEntityPageHeader.tsx delete mode 100644 packages/core/src/components/DefaultEntityPageHeader/index.ts delete mode 100644 packages/core/src/components/DefaultEntityPageNavbar/DefaultEntityPageNavbar.tsx delete mode 100644 packages/core/src/components/DefaultEntityPageNavbar/NavbarItem.tsx delete mode 100644 packages/core/src/components/DefaultEntityPageNavbar/index.ts delete mode 100644 packages/core/src/components/EntityLink/EntityLink.tsx delete mode 100644 packages/core/src/components/EntityLink/RelativeEntityLink.tsx delete mode 100644 packages/core/src/components/EntityLink/index.ts diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx index 17aa13599b..484ae671ec 100644 --- a/packages/app/src/App.tsx +++ b/packages/app/src/App.tsx @@ -3,7 +3,6 @@ import { BackstageTheme, createApp } from '@spotify-backstage/core'; import React, { FC } from 'react'; import { BrowserRouter as Router } from 'react-router-dom'; import Root from './components/Root'; -import entities from './entities'; import * as plugins from './plugins'; const useStyles = makeStyles(theme => ({ @@ -25,7 +24,6 @@ const useStyles = makeStyles(theme => ({ })); const app = createApp(); -app.registerEntityKind(...entities); app.registerPlugin(...Object.values(plugins)); const AppComponent = app.build(); diff --git a/packages/app/src/entities/MockEntityCard.tsx b/packages/app/src/entities/MockEntityCard.tsx deleted file mode 100644 index 3f61d45877..0000000000 --- a/packages/app/src/entities/MockEntityCard.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import React, { FC } from 'react'; -import { useEntityUri } from '@spotify-backstage/core'; - -const MockEntityPage: FC<{}> = () => { - const uri = useEntityUri(); - return Mock card for {uri}, replace with some userful plugin; -}; - -export default MockEntityPage; diff --git a/packages/app/src/entities/MockEntityPage.tsx b/packages/app/src/entities/MockEntityPage.tsx deleted file mode 100644 index db7fbb4c9f..0000000000 --- a/packages/app/src/entities/MockEntityPage.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import React, { FC } from 'react'; -import { Typography } from '@material-ui/core'; - -const MockEntityPage: FC<{}> = () => { - return ( - - This page is intentionally left blank - - ); -}; - -export default MockEntityPage; diff --git a/packages/app/src/entities/index.ts b/packages/app/src/entities/index.ts deleted file mode 100644 index f30c0b64bb..0000000000 --- a/packages/app/src/entities/index.ts +++ /dev/null @@ -1,45 +0,0 @@ -import { - createEntityKind, - createWidgetView, - createEntityPage, -} from '@spotify-backstage/core'; -import ComputerIcon from '@material-ui/icons/Computer'; -import WebIcon from '@material-ui/icons/Web'; -import VerifiedUserIcon from '@material-ui/icons/VerifiedUser'; -import CloudIcon from '@material-ui/icons/Cloud'; -import TimelineIcon from '@material-ui/icons/Timeline'; -import CheckCircleIcon from '@material-ui/icons/CheckCircle'; -import VpnKeyIcon from '@material-ui/icons/VpnKey'; -import DnsIcon from '@material-ui/icons/Dns'; -import MockEntityPage from './MockEntityPage'; -import MockEntityCard from './MockEntityCard'; - -/* SERVICE */ -const serviceOverviewPage = createWidgetView().add({ - size: 4, - component: MockEntityCard, -}); - -const serviceView = createEntityPage() - .addPage('Overview', WebIcon, '/overview', serviceOverviewPage) - .addComponent('Tests', VerifiedUserIcon, '/tests', MockEntityPage) - .addComponent('Deployment', CloudIcon, '/deployment', MockEntityPage) - .addComponent('Monitoring', TimelineIcon, '/monitoring', MockEntityPage) - .addComponent('Service Levels', CheckCircleIcon, '/sla', MockEntityPage) - .addComponent('Secrets', VpnKeyIcon, '/secrets', MockEntityPage) - .addComponent('DNS', DnsIcon, '/dns', MockEntityPage); - -const serviceEntity = createEntityKind({ - kind: 'service', - title: 'Service', - color: { - primary: '#f00', - secondary: '#ba5', - }, - icon: ComputerIcon, - pages: { - view: serviceView, - }, -}); - -export default [serviceEntity]; diff --git a/packages/core/src/api/api.ts b/packages/core/src/api/api.ts index 9bff1e2a46..6581d7f656 100644 --- a/packages/core/src/api/api.ts +++ b/packages/core/src/api/api.ts @@ -1,25 +1,15 @@ import AppBuilder from './app/AppBuilder'; -import EntityKind, { EntityConfig } from './entity/EntityKind'; import WidgetViewBuilder from './widgetView/WidgetViewBuilder'; -import EntityPageBuilder from './entityView/EntityPageBuilder'; import BackstagePlugin, { PluginConfig } from './plugin/Plugin'; export function createApp() { return new AppBuilder(); } -export function createEntityKind(config: EntityConfig) { - return new EntityKind(config); -} - export function createWidgetView() { return new WidgetViewBuilder(); } -export function createEntityPage() { - return new EntityPageBuilder(); -} - export function createPlugin(config: PluginConfig): BackstagePlugin { return new BackstagePlugin(config); } diff --git a/packages/core/src/api/app/AppBuilder.tsx b/packages/core/src/api/app/AppBuilder.tsx index 2ba0ca543c..4429a17ad4 100644 --- a/packages/core/src/api/app/AppBuilder.tsx +++ b/packages/core/src/api/app/AppBuilder.tsx @@ -1,9 +1,7 @@ -import React, { ComponentType, FC } from 'react'; -import { Route, Switch, useParams, Redirect } from 'react-router-dom'; +import React, { ComponentType } from 'react'; +import { Route, Switch, Redirect } from 'react-router-dom'; import { AppContextProvider } from './AppContext'; -import { App, AppComponentBuilder } from './types'; -import EntityKind, { EntityConfig } from '../entity/EntityKind'; -import { EntityContextProvider } from '../entityView/EntityContext'; +import { App } from './types'; import BackstagePlugin from '../plugin/Plugin'; import { IconComponent, @@ -13,49 +11,17 @@ import { } from '../../icons'; class AppImpl implements App { - constructor( - private readonly entities: Map, - private readonly systemIcons: SystemIcons, - ) {} - - getEntityConfig(kind: string): EntityConfig { - const entity = this.entities.get(kind); - if (!entity) { - throw new Error('EntityKind not found'); - } - return entity.config; - } + constructor(private readonly systemIcons: SystemIcons) {} getSystemIcon(key: SystemIconKey): IconComponent { return this.systemIcons[key]; } } -function builtComponent( - app: App, - component: ComponentType | AppComponentBuilder, -) { - if (component instanceof AppComponentBuilder) { - return component.build(app); - } - return component; -} - export default class AppBuilder { - private readonly entities = new Map(); private systemIcons = { ...defaultSystemIcons }; private readonly plugins = new Set(); - registerEntityKind(...entity: EntityKind[]) { - for (const e of entity) { - const { kind } = e.config; - if (this.entities.has(e.config.kind)) { - throw new Error(`EntityKind '${kind}' is already registered`); - } - this.entities.set(e.config.kind, e); - } - } - registerIcons(icons: Partial) { this.systemIcons = { ...this.systemIcons, ...icons }; } @@ -70,49 +36,9 @@ export default class AppBuilder { } build(): ComponentType<{}> { - const app = new AppImpl(this.entities, this.systemIcons); + const app = new AppImpl(this.systemIcons); - const entityRoutes = new Array(); - - for (const { config } of this.entities.values()) { - const { kind, pages } = config; - const basePath = `/entity/${kind}`; - - if (pages.list) { - const ListComponent = builtComponent(app, pages.list); - - const Component: FC<{}> = () => ( - - - - ); - - const path = basePath; - entityRoutes.push( - , - ); - } - - if (pages.view) { - const ViewComponent = builtComponent(app, pages.view); - - const Component: FC<{}> = () => { - const { entityId } = useParams<{ entityId: string }>(); - return ( - - - - ); - }; - - const path = `${basePath}/:entityId`; - entityRoutes.push( - , - ); - } - } - - const pluginRoutes = new Array(); + const routes = new Array(); for (const plugin of this.plugins.values()) { for (const output of plugin.output()) { @@ -120,7 +46,7 @@ export default class AppBuilder { case 'route': { const { path, component, options = {} } = output; const { exact = true } = options; - pluginRoutes.push( + routes.push( , ); break; @@ -144,8 +70,6 @@ export default class AppBuilder { } } - const routes = [...pluginRoutes, ...entityRoutes]; - return () => ( diff --git a/packages/core/src/api/app/types.ts b/packages/core/src/api/app/types.ts index b99553dcf3..44fffcac6b 100644 --- a/packages/core/src/api/app/types.ts +++ b/packages/core/src/api/app/types.ts @@ -1,9 +1,7 @@ import { ComponentType } from 'react'; -import { EntityConfig } from '../entity/EntityKind'; import { IconComponent, SystemIconKey } from '../../icons'; export type App = { - getEntityConfig(kind: string): EntityConfig; getSystemIcon(key: SystemIconKey): IconComponent; }; diff --git a/packages/core/src/api/entity/EntityKind.ts b/packages/core/src/api/entity/EntityKind.ts deleted file mode 100644 index 85f749975b..0000000000 --- a/packages/core/src/api/entity/EntityKind.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { ComponentType } from 'react'; -import { AppComponentBuilder } from '../app/types'; -import { IconComponent } from '../../icons'; - -export type EntityConfig = { - kind: string; - title: string; - icon: IconComponent; - color: { - primary: string; - secondary: string; - }; - pages: { - list?: ComponentType<{}> | AppComponentBuilder; - view?: ComponentType<{}> | AppComponentBuilder; - }; -}; - -export default class EntityKind { - constructor(readonly config: EntityConfig) {} -} diff --git a/packages/core/src/api/entityView/EntityContext.tsx b/packages/core/src/api/entityView/EntityContext.tsx deleted file mode 100644 index 0a229fd1b3..0000000000 --- a/packages/core/src/api/entityView/EntityContext.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import React, { createContext, useContext, FC } from 'react'; -import { EntityConfig } from '../entity/EntityKind'; - -type Value = { - config: EntityConfig; - id?: string; -}; - -const Context = createContext(undefined); - -type Props = { - config: EntityConfig; - id?: string; -}; - -export const EntityContextProvider: FC = ({ config, id, children }) => ( - -); - -export const useEntity = (): { kind: string; id: string } => { - const value = useContext(Context); - if (!value) { - throw new Error('No entity context available'); - } - if (!value.id) { - throw new Error('Entity context does not contain entity id'); - } - return { kind: value.config.kind, id: value.id }; -}; - -export const useEntityConfig = (): EntityConfig => { - const value = useContext(Context); - if (!value) { - throw new Error('No entity context available'); - } - return value.config; -}; - -export const useEntityUri = (): string => { - const { kind, id } = useEntity(); - return `entity:${kind}:${id}`; -}; diff --git a/packages/core/src/api/entityView/EntityPageBuilder.tsx b/packages/core/src/api/entityView/EntityPageBuilder.tsx deleted file mode 100644 index 0e1fdff16b..0000000000 --- a/packages/core/src/api/entityView/EntityPageBuilder.tsx +++ /dev/null @@ -1,114 +0,0 @@ -import React, { ComponentType } from 'react'; -import DefaultEntityPage from '../../components/DefaultEntityPage'; -import { App, AppComponentBuilder } from '../app/types'; -import BackstagePlugin from '../plugin/Plugin'; -import { EntityPageNavItem, EntityPageView } from './types'; -import { IconComponent } from '../../icons'; - -// type AppComponents = { -// EntityPage: ComponentType; -// EntityPageNavbar: ComponentType; -// EntityPageHeader: ComponentType; -// }; - -type EntityPageRegistration = - | { - type: 'page'; - title: string; - icon: IconComponent; - path: string; - page: AppComponentBuilder; - } - | { - type: 'plugin'; - plugin: BackstagePlugin; - } - | { - type: 'component'; - title: string; - icon: IconComponent; - path: string; - component: ComponentType; - }; - -export default class EntityPageBuilder extends AppComponentBuilder { - private readonly registrations = new Array(); - - addPage( - title: string, - icon: IconComponent, - path: string, - page: AppComponentBuilder, - ): EntityPageBuilder { - this.registrations.push({ type: 'page', title, icon, path, page }); - return this; - } - - addComponent( - title: string, - icon: IconComponent, - path: string, - component: ComponentType, - ): EntityPageBuilder { - this.registrations.push({ - type: 'component', - title, - icon, - path, - component, - }); - return this; - } - - register(plugin: BackstagePlugin): EntityPageBuilder { - this.registrations.push({ type: 'plugin', plugin }); - return this; - } - - build(app: App): ComponentType { - const navItems = new Array(); - const views = new Array(); - - for (const reg of this.registrations) { - switch (reg.type) { - case 'page': { - const { title, icon, path, page } = reg; - navItems.push({ title, icon, target: path }); - views.push({ path, component: page.build(app) }); - break; - } - case 'component': { - const { title, icon, path, component } = reg; - navItems.push({ title, icon, target: path }); - views.push({ path, component }); - break; - } - case 'plugin': { - let added = false; - for (const output of reg.plugin.output()) { - switch (output.type) { - case 'entity-page-nav-item': - const { title, icon, target } = output; - navItems.push({ title, icon, target }); - added = true; - break; - case 'entity-page-view-route': - const { path, component } = output; - views.push({ path, component }); - added = true; - break; - } - } - if (!added) { - throw new Error( - `Plugin ${reg.plugin} was registered as entity view, but did not provide any output`, - ); - } - break; - } - } - } - - return () => ; - } -} diff --git a/packages/core/src/api/entityView/types.ts b/packages/core/src/api/entityView/types.ts deleted file mode 100644 index f11f1aef5c..0000000000 --- a/packages/core/src/api/entityView/types.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { ComponentType } from 'react'; -import { IconComponent } from '../../icons'; - -export type EntityPageNavItem = { - icon: IconComponent; - title: string; - target: string; -}; - -export type EntityPageView = { - path: string; - component: ComponentType; -}; - -export type EntityPageProps = { - navItems: EntityPageNavItem[]; - views: EntityPageView[]; -}; - -export type EntityPageNavbarProps = { - navItems: EntityPageNavItem[]; -}; - -export type EntityPageHeaderProps = {}; diff --git a/packages/core/src/api/index.ts b/packages/core/src/api/index.ts index 03bd5c07dc..6af1e07588 100644 --- a/packages/core/src/api/index.ts +++ b/packages/core/src/api/index.ts @@ -1,7 +1,2 @@ export * from './api'; export { useApp } from './app/AppContext'; -export { - useEntity, - useEntityConfig, - useEntityUri, -} from './entityView/EntityContext'; diff --git a/packages/core/src/api/plugin/Plugin.tsx b/packages/core/src/api/plugin/Plugin.tsx index f54dc63bbb..abd8b1e700 100644 --- a/packages/core/src/api/plugin/Plugin.tsx +++ b/packages/core/src/api/plugin/Plugin.tsx @@ -1,6 +1,5 @@ import { ComponentType } from 'react'; import { PluginOutput, RoutePath, RouteOptions } from './types'; -import { IconComponent } from '../../icons'; import { Widget } from '../widgetView/types'; export type PluginConfig = { @@ -10,7 +9,6 @@ export type PluginConfig = { export type PluginHooks = { router: RouterHooks; - entityPage: EntityPageHooks; widgets: WidgetHooks; }; @@ -28,21 +26,6 @@ export type RouterHooks = { ): void; }; -type EntityPageSidebarItemOptions = { - title: string; - icon: IconComponent; - target: RoutePath; -}; - -export type EntityPageHooks = { - navItem(options: EntityPageSidebarItemOptions): void; - route( - path: RoutePath, - component: ComponentType, - options?: RouteOptions, - ): void; -}; - export type WidgetHooks = { add(widget: Widget): void; }; @@ -63,47 +46,17 @@ export default class Plugin { return []; } - const { id } = this.config; - const outputs = new Array(); this.config.register({ router: { registerRoute(path, component, options) { - if (path.startsWith('/entity/')) { - throw new Error( - `Plugin ${id} tried to register forbidden route ${path}`, - ); - } outputs.push({ type: 'route', path, component, options }); }, registerRedirect(path, target, options) { - if (path.startsWith('/entity/')) { - throw new Error( - `Plugin ${id} tried to register forbidden redirect ${path}`, - ); - } outputs.push({ type: 'redirect-route', path, target, options }); }, }, - entityPage: { - navItem({ title, icon, target }) { - outputs.push({ - type: 'entity-page-nav-item', - title, - icon, - target, - }); - }, - route(path, component, options) { - outputs.push({ - type: 'entity-page-view-route', - path, - component, - options, - }); - }, - }, widgets: { add(widget: Widget) { outputs.push({ type: 'widget', widget }); diff --git a/packages/core/src/api/plugin/types.ts b/packages/core/src/api/plugin/types.ts index 52ae23959f..c2386fb6c7 100644 --- a/packages/core/src/api/plugin/types.ts +++ b/packages/core/src/api/plugin/types.ts @@ -1,5 +1,4 @@ import { ComponentType } from 'react'; -import { IconComponent } from '../../icons'; import { Widget } from '../widgetView/types'; export type RouteOptions = { @@ -28,23 +27,4 @@ export type WidgetOutput = { widget: Widget; }; -export type EntityPageViewRouteOutput = { - type: 'entity-page-view-route'; - path: RoutePath; - component: ComponentType; - options?: RouteOptions; -}; - -export type EntityPageNavItemOutput = { - type: 'entity-page-nav-item'; - title: string; - icon: IconComponent; - target: RoutePath; -}; - -export type PluginOutput = - | RouteOutput - | RedirectRouteOutput - | WidgetOutput - | EntityPageViewRouteOutput - | EntityPageNavItemOutput; +export type PluginOutput = RouteOutput | RedirectRouteOutput | WidgetOutput; diff --git a/packages/core/src/components/DefaultEntityPage/DefaultEntityPage.tsx b/packages/core/src/components/DefaultEntityPage/DefaultEntityPage.tsx deleted file mode 100644 index 6accdfe1c8..0000000000 --- a/packages/core/src/components/DefaultEntityPage/DefaultEntityPage.tsx +++ /dev/null @@ -1,61 +0,0 @@ -import React, { FC } from 'react'; -import { makeStyles, Theme } from '@material-ui/core'; -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 useStyles = makeStyles({ - root: { - display: 'grid', - gridTemplateAreas: ` - 'header header' - 'navbar content' - `, - gridTemplateRows: 'auto 1fr', - gridTemplateColumns: 'auto 1fr', - minHeight: '100%', - }, - header: { - gridArea: 'header', - }, - navbar: { - gridArea: 'navbar', - }, - content: { - gridArea: 'content', - }, -}); - -const DefaultEntityPage: FC = ({ navItems, views }) => { - const classes = useStyles(); - const { kind, id } = useEntity(); - const basePath = `/entity/${kind}/${id}`; - - return ( -
-
- -
-
- -
-
- - {views.map(({ path, component }) => ( - - ))} - - -
-
- ); -}; - -export default DefaultEntityPage; diff --git a/packages/core/src/components/DefaultEntityPage/index.ts b/packages/core/src/components/DefaultEntityPage/index.ts deleted file mode 100644 index 4f683076c4..0000000000 --- a/packages/core/src/components/DefaultEntityPage/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './DefaultEntityPage'; diff --git a/packages/core/src/components/DefaultEntityPageHeader/DefaultEntityPageHeader.tsx b/packages/core/src/components/DefaultEntityPageHeader/DefaultEntityPageHeader.tsx deleted file mode 100644 index 219fa21cfc..0000000000 --- a/packages/core/src/components/DefaultEntityPageHeader/DefaultEntityPageHeader.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import React, { FC } from 'react'; -import { Header, useEntity, useEntityConfig, pageTheme } from '../..'; -import { EntityPageHeaderProps } from '../../api/entityView/types'; -import { Theme } from '../../layout/Page/Page'; - -const DefaultEntityPageHeader: FC = () => { - const { id } = useEntity(); - const config = useEntityConfig(); - - // TODO(rugvip): provide theme through entity config - return ( - -
- - ); -}; - -export default DefaultEntityPageHeader; diff --git a/packages/core/src/components/DefaultEntityPageHeader/index.ts b/packages/core/src/components/DefaultEntityPageHeader/index.ts deleted file mode 100644 index 5c9304bad7..0000000000 --- a/packages/core/src/components/DefaultEntityPageHeader/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './DefaultEntityPageHeader'; diff --git a/packages/core/src/components/DefaultEntityPageNavbar/DefaultEntityPageNavbar.tsx b/packages/core/src/components/DefaultEntityPageNavbar/DefaultEntityPageNavbar.tsx deleted file mode 100644 index 93e0b50c59..0000000000 --- a/packages/core/src/components/DefaultEntityPageNavbar/DefaultEntityPageNavbar.tsx +++ /dev/null @@ -1,37 +0,0 @@ -import React, { FC } from 'react'; -import { EntityPageNavbarProps } from '../../api/entityView/types'; -import { useEntityUri } from '../..'; -import { List, makeStyles, Theme } from '@material-ui/core'; -import NavbarItem from './NavbarItem'; - -const useStyles = makeStyles({ - nav: { - gridArea: 'pageNav', - width: 220, - transition: 'width 0.07s, height 0s', - transitionTimingFunction: 'ease-in', - backgroundColor: '#eeeeee', - boxShadow: '0px 0 4px 0px rgba(0,0,0,0.35)', - height: '100%', - }, - list: { - padding: 0, - }, -}); - -const DefaultEntityPageNavbar: FC = ({ navItems }) => { - const classes = useStyles(); - const entityUri = useEntityUri(); - - return ( - - ); -}; - -export default DefaultEntityPageNavbar; diff --git a/packages/core/src/components/DefaultEntityPageNavbar/NavbarItem.tsx b/packages/core/src/components/DefaultEntityPageNavbar/NavbarItem.tsx deleted file mode 100644 index 7526fb7739..0000000000 --- a/packages/core/src/components/DefaultEntityPageNavbar/NavbarItem.tsx +++ /dev/null @@ -1,71 +0,0 @@ -import React, { FC } from 'react'; -import { EntityLink } from '../..'; -import { - ListItem, - makeStyles, - Theme, - ListItemIcon, - ListItemText, - Typography, -} from '@material-ui/core'; -import { EntityPageNavItem } from '../../api/entityView/types'; - -const useStyles = makeStyles(theme => ({ - root: { - display: 'block', - overflow: 'hidden', - borderBottom: `1px solid #d9d9d9`, - }, - label: { - color: '#333', - fontWeight: 'bolder', - whiteSpace: 'nowrap', - lineHeight: 1.0, - }, - iconImg: { - width: 24, - height: 24, - }, - icon: { - margin: theme.spacing(0.5, 2, 0.5, 0), - minWidth: 0, - fontSize: 24, - }, - expand: { - color: 'white', - }, -})); - -type Props = { - navItem: EntityPageNavItem; - entityUri: string; -}; - -const NavbarItem: FC = ({ navItem, entityUri }) => { - const classes = useStyles(); - const IconComponent = navItem.icon; - - return ( - - - - - - - {navItem.title} - - } - disableTypography - /> - - - ); -}; - -export default NavbarItem; diff --git a/packages/core/src/components/DefaultEntityPageNavbar/index.ts b/packages/core/src/components/DefaultEntityPageNavbar/index.ts deleted file mode 100644 index 14a807a40f..0000000000 --- a/packages/core/src/components/DefaultEntityPageNavbar/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './DefaultEntityPageNavbar'; diff --git a/packages/core/src/components/EntityLink/EntityLink.tsx b/packages/core/src/components/EntityLink/EntityLink.tsx deleted file mode 100644 index 57993f8abf..0000000000 --- a/packages/core/src/components/EntityLink/EntityLink.tsx +++ /dev/null @@ -1,51 +0,0 @@ -import React, { FC } from 'react'; -import { Link, LinkProps } from 'react-router-dom'; - -type Props = Omit & { - subPath?: string; -} & ( - | { - kind: string; - id?: string; - } - | { - uri: string; - } - ); - -export function buildPath(kind: string, id?: string, subPath?: string) { - if (id) { - if (subPath) { - return `/entity/${kind}/${id}/${subPath.replace(/^\//, '')}`; - } - return `/entity/${kind}/${id}`; - } - return `/entity/${kind}`; -} - -const EntityLink: FC = ({ subPath, children, ...props }) => { - if ('kind' in props) { - const { kind, id } = props; - return ( - - {children} - - ); - } else { - const match = props.uri.match(/entity:([^:]+)(:[^:]+)?/); - if (!match) { - throw new TypeError(`Invalid entity uri: '${props.uri}'`); - } - - const [, kind, maybeId] = match; - const id = maybeId ? maybeId.slice(1) : undefined; - - return ( - - {children} - - ); - } -}; - -export default EntityLink; diff --git a/packages/core/src/components/EntityLink/RelativeEntityLink.tsx b/packages/core/src/components/EntityLink/RelativeEntityLink.tsx deleted file mode 100644 index aa61abcc01..0000000000 --- a/packages/core/src/components/EntityLink/RelativeEntityLink.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import React, { FC } from 'react'; -import { Link } from 'react-router-dom'; -import { useEntity } from '../../api'; -import { buildPath } from './EntityLink'; - -type Props = { - view: string; -}; - -const RelativeEntityLink: FC = ({ view, children }) => { - const entity = useEntity(); - - return {children}; -}; - -export default RelativeEntityLink; diff --git a/packages/core/src/components/EntityLink/index.ts b/packages/core/src/components/EntityLink/index.ts deleted file mode 100644 index f067ebf3e2..0000000000 --- a/packages/core/src/components/EntityLink/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export { default } from './EntityLink'; -export { default as RelativeEntityLink } from './RelativeEntityLink'; diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts index 9c84e12416..663961458f 100644 --- a/packages/core/src/index.ts +++ b/packages/core/src/index.ts @@ -1,8 +1,4 @@ export * from './api'; -export { - default as EntityLink, - RelativeEntityLink, -} from './components/EntityLink'; export { default as Page } from './layout/Page'; export { gradients, pageTheme, PageTheme } from './layout/Page'; export { default as Content } from './layout/Content/Content'; diff --git a/plugins/home-page/src/components/HomePage/HomePage.tsx b/plugins/home-page/src/components/HomePage/HomePage.tsx index 7b6e3ff9da..028f470575 100644 --- a/plugins/home-page/src/components/HomePage/HomePage.tsx +++ b/plugins/home-page/src/components/HomePage/HomePage.tsx @@ -1,9 +1,8 @@ import React, { FC } from 'react'; -import { Typography, Grid } from '@material-ui/core'; +import { Typography, Link, Grid } from '@material-ui/core'; import HomePageTimer from '../HomepageTimer'; import { Content, - EntityLink, InfoCard, Header, Page, @@ -27,9 +26,9 @@ const HomePage: FC<{}> = () => { return { id, entity: ( - + {id} - + ), kind: {kind}, };