Merge branch 'master' of https://github.com/spotify/backstage into samiram/pagerduty-plugin

packages/app/CHANGELOG.md

@@ -1,5 +1,67 @@
 # example-app
 
+## 0.2.5
+
+### Patch Changes
+
+- Updated dependencies [7eb8bfe4a]
+- Updated dependencies [fe7257ff0]
+- Updated dependencies [a2cfa311a]
+- Updated dependencies [69f38457f]
+- Updated dependencies [bec334b33]
+- Updated dependencies [303c5ea17]
+- Updated dependencies [b4488ddb0]
+- Updated dependencies [4a655c89d]
+- Updated dependencies [08835a61d]
+- Updated dependencies [a9fd599f7]
+- Updated dependencies [8a16e8af8]
+- Updated dependencies [bcc211a08]
+- Updated dependencies [00670a96e]
+- Updated dependencies [da2ad65cb]
+- Updated dependencies [ebf37bbae]
+  - @backstage/plugin-api-docs@0.3.1
+  - @backstage/plugin-cost-insights@0.4.2
+  - @backstage/plugin-sentry@0.2.4
+  - @backstage/plugin-welcome@0.2.2
+  - @backstage/cli@0.4.0
+  - @backstage/catalog-model@0.4.0
+  - @backstage/plugin-catalog-import@0.3.0
+  - @backstage/plugin-scaffolder@0.3.2
+  - @backstage/plugin-kubernetes@0.3.1
+  - @backstage/plugin-techdocs@0.3.1
+  - @backstage/plugin-catalog@0.2.5
+  - @backstage/test-utils@0.1.4
+  - @backstage/plugin-circleci@0.2.3
+  - @backstage/plugin-cloudbuild@0.2.3
+  - @backstage/plugin-github-actions@0.2.3
+  - @backstage/plugin-jenkins@0.3.2
+  - @backstage/plugin-lighthouse@0.2.4
+  - @backstage/plugin-register-component@0.2.3
+  - @backstage/plugin-rollbar@0.2.5
+  - @backstage/plugin-search@0.2.2
+
+## 0.2.4
+
+### Patch Changes
+
+- Updated dependencies [294295453]
+- Updated dependencies [f3bb55ee3]
+- Updated dependencies [4b53294a6]
+- Updated dependencies [6f70ed7a9]
+- Updated dependencies [ab94c9542]
+- Updated dependencies [3a201c5d5]
+- Updated dependencies [f538e2c56]
+- Updated dependencies [2daf18e80]
+- Updated dependencies [069cda35f]
+- Updated dependencies [8697dea5b]
+- Updated dependencies [b623cc275]
+  - @backstage/cli@0.3.2
+  - @backstage/plugin-api-docs@0.3.0
+  - @backstage/plugin-techdocs@0.3.0
+  - @backstage/plugin-catalog@0.2.4
+  - @backstage/catalog-model@0.3.1
+  - @backstage/plugin-rollbar@0.2.4
+
 ## 0.2.3
 
 ### Patch Changes

packages/app/package.json

@@ -1,43 +1,44 @@
 {
   "name": "example-app",
-  "version": "0.2.3",
+  "version": "0.2.5",
   "private": true,
   "bundled": true,
   "dependencies": {
-    "@backstage/catalog-model": "^0.3.0",
-    "@backstage/cli": "^0.3.1",
+    "@backstage/catalog-model": "^0.4.0",
+    "@backstage/cli": "^0.4.0",
     "@backstage/core": "^0.3.2",
-    "@backstage/plugin-api-docs": "^0.2.2",
-    "@backstage/plugin-catalog": "^0.2.3",
-    "@backstage/plugin-circleci": "^0.2.2",
-    "@backstage/plugin-cloudbuild": "^0.2.2",
-    "@backstage/plugin-cost-insights": "^0.4.1",
+    "@backstage/plugin-api-docs": "^0.3.1",
+    "@backstage/plugin-catalog": "^0.2.5",
+    "@backstage/plugin-catalog-import": "^0.3.0",
+    "@backstage/plugin-circleci": "^0.2.3",
+    "@backstage/plugin-cloudbuild": "^0.2.3",
+    "@backstage/plugin-cost-insights": "^0.4.2",
     "@backstage/plugin-explore": "^0.2.1",
     "@backstage/plugin-gcp-projects": "^0.2.1",
-    "@backstage/plugin-github-actions": "^0.2.2",
+    "@backstage/plugin-github-actions": "^0.2.3",
     "@backstage/plugin-gitops-profiles": "^0.2.1",
     "@backstage/plugin-graphiql": "^0.2.1",
-    "@backstage/plugin-jenkins": "^0.3.1",
-    "@backstage/plugin-kubernetes": "^0.3.0",
-    "@backstage/plugin-lighthouse": "^0.2.3",
+    "@backstage/plugin-jenkins": "^0.3.2",
+    "@backstage/plugin-kubernetes": "^0.3.1",
+    "@backstage/plugin-lighthouse": "^0.2.4",
     "@backstage/plugin-newrelic": "^0.2.1",
     "@backstage/plugin-pagerduty": "0.2.1",
-    "@backstage/plugin-register-component": "^0.2.2",
-    "@backstage/plugin-rollbar": "^0.2.3",
-    "@backstage/plugin-scaffolder": "^0.3.1",
-    "@backstage/plugin-search": "^0.2.1",
-    "@backstage/plugin-sentry": "^0.2.3",
+    "@backstage/plugin-register-component": "^0.2.3",
+    "@backstage/plugin-rollbar": "^0.2.5",
+    "@backstage/plugin-scaffolder": "^0.3.2",
+    "@backstage/plugin-sentry": "^0.2.4",
+    "@backstage/plugin-search": "^0.2.2",
     "@backstage/plugin-tech-radar": "^0.3.0",
-    "@backstage/plugin-techdocs": "^0.2.3",
+    "@backstage/plugin-techdocs": "^0.3.1",
     "@backstage/plugin-user-settings": "^0.2.2",
-    "@backstage/plugin-welcome": "^0.2.1",
-    "@backstage/test-utils": "^0.1.3",
+    "@backstage/plugin-welcome": "^0.2.2",
+    "@backstage/test-utils": "^0.1.4",
     "@backstage/theme": "^0.2.1",
     "@material-ui/core": "^4.11.0",
     "@material-ui/icons": "^4.9.1",
     "@octokit/rest": "^18.0.0",
     "@roadiehq/backstage-plugin-buildkite": "^0.1.3",
-    "@roadiehq/backstage-plugin-github-insights": "^0.2.15",
+    "@roadiehq/backstage-plugin-github-insights": "^0.2.16",
     "@roadiehq/backstage-plugin-github-pull-requests": "^0.6.3",
     "@roadiehq/backstage-plugin-travis-ci": "^0.2.8",
     "history": "^5.0.0",

packages/app/src/App.tsx

@@ -34,6 +34,7 @@ import { Router as TechRadarRouter } from '@backstage/plugin-tech-radar';
 import { Router as LighthouseRouter } from '@backstage/plugin-lighthouse';
 import { Router as RegisterComponentRouter } from '@backstage/plugin-register-component';
 import { Router as SettingsRouter } from '@backstage/plugin-user-settings';
+import { Router as ImportComponentRouter } from '@backstage/plugin-catalog-import';
 import { Route, Routes, Navigate } from 'react-router';
 
 import { EntityPage } from './components/catalog/EntityPage';
@@ -67,6 +68,10 @@ const catalogRouteRef = createRouteRef({
 const AppRoutes = () => (
   <Routes>
     <Navigate key="/" to="/catalog" />
+    <Route
+      path="/catalog-import/*"
+      element={<ImportComponentRouter catalogRouteRef={catalogRouteRef} />}
+    />
     <Route
       path={`${catalogRouteRef.path}/*`}
       element={<CatalogRouter EntityPage={EntityPage} />}

packages/app/src/components/catalog/EntityPage.tsx

@@ -13,67 +13,70 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import { ApiEntity, Entity } from '@backstage/catalog-model';
+import { EmptyState } from '@backstage/core';
 import {
-  isPluginApplicableToEntity as isTravisCIAvailable,
-  RecentTravisCIBuildsWidget,
-  Router as TravisCIRouter,
-} from '@roadiehq/backstage-plugin-travis-ci';
+  ApiDefinitionCard,
+  Router as ApiDocsRouter,
+} from '@backstage/plugin-api-docs';
+import {
+  AboutCard,
+  EntityPageLayout,
+  useEntity,
+} from '@backstage/plugin-catalog';
+import {
+  isPluginApplicableToEntity as isCircleCIAvailable,
+  Router as CircleCIRouter,
+} from '@backstage/plugin-circleci';
+import {
+  isPluginApplicableToEntity as isCloudbuildAvailable,
+  Router as CloudbuildRouter,
+} from '@backstage/plugin-cloudbuild';
 import {
   isPluginApplicableToEntity as isGitHubActionsAvailable,
   RecentWorkflowRunsCard,
   Router as GitHubActionsRouter,
 } from '@backstage/plugin-github-actions';
 import {
-  Router as CloudbuildRouter,
-  isPluginApplicableToEntity as isCloudbuildAvailable,
-} from '@backstage/plugin-cloudbuild';
-import {
-  Router as JenkinsRouter,
   isPluginApplicableToEntity as isJenkinsAvailable,
   LatestRunCard as JenkinsLatestRunCard,
+  Router as JenkinsRouter,
 } from '@backstage/plugin-jenkins';
-import {
-  isPluginApplicableToEntity as isCircleCIAvailable,
-  Router as CircleCIRouter,
-} from '@backstage/plugin-circleci';
-import { Router as ApiDocsRouter } from '@backstage/plugin-api-docs';
-import { Router as SentryRouter } from '@backstage/plugin-sentry';
-import { EmbeddedDocsRouter as DocsRouter } from '@backstage/plugin-techdocs';
 import { Router as KubernetesRouter } from '@backstage/plugin-kubernetes';
-import {
-  Router as GitHubInsightsRouter,
-  isPluginApplicableToEntity as isGitHubAvailable,
-  ReadMeCard,
-  LanguagesCard,
-  ReleasesCard,
-} from '@roadiehq/backstage-plugin-github-insights';
-import React, { ReactNode } from 'react';
-import {
-  AboutCard,
-  EntityPageLayout,
-  useEntity,
-} from '@backstage/plugin-catalog';
-import { Entity } from '@backstage/catalog-model';
-import { Button, Grid } from '@material-ui/core';
-import { EmptyState } from '@backstage/core';
 import {
   EmbeddedRouter as LighthouseRouter,
-  LastLighthouseAuditCard,
   isPluginApplicableToEntity as isLighthouseAvailable,
-} from '@backstage/plugin-lighthouse/';
+  LastLighthouseAuditCard,
+} from '@backstage/plugin-lighthouse';
+import { Router as SentryRouter } from '@backstage/plugin-sentry';
+import { EmbeddedDocsRouter as DocsRouter } from '@backstage/plugin-techdocs';
+import { Button, Grid } from '@material-ui/core';
+import {
+  isPluginApplicableToEntity as isBuildkiteAvailable,
+  Router as BuildkiteRouter,
+} from '@roadiehq/backstage-plugin-buildkite';
+import {
+  isPluginApplicableToEntity as isGitHubAvailable,
+  LanguagesCard,
+  ReadMeCard,
+  ReleasesCard,
+  Router as GitHubInsightsRouter,
+} from '@roadiehq/backstage-plugin-github-insights';
 import {
-  Router as PullRequestsRouter,
   isPluginApplicableToEntity as isPullRequestsAvailable,
   PullRequestsStatsCard,
+  Router as PullRequestsRouter,
 } from '@roadiehq/backstage-plugin-github-pull-requests';
 import {
   isPluginApplicableToEntity as isPagerDutyAvailable,
   PagerDutyCard,
 } from '@backstage/plugin-pagerduty';
 import {
-  Router as BuildkiteRouter,
-  isPluginApplicableToEntity as isBuildkiteAvailable,
-} from '@roadiehq/backstage-plugin-buildkite';
+  isPluginApplicableToEntity as isTravisCIAvailable,
+  RecentTravisCIBuildsWidget,
+  Router as TravisCIRouter,
+} from '@roadiehq/backstage-plugin-travis-ci';
+import React, { ReactNode } from 'react';
 
 export const CICDSwitcher = ({ entity }: { entity: Entity }) => {
   // This component is just an example of how you can implement your company's logic in entity page.
@@ -138,7 +141,7 @@ const RecentCICDRunsSwitcher = ({ entity }: { entity: Entity }) => {
   );
 };
 
-const OverviewContent = ({ entity }: { entity: Entity }) => (
+const ComponentOverviewContent = ({ entity }: { entity: Entity }) => (
   <Grid container spacing={3} alignItems="stretch">
     <Grid item md={6}>
       <AboutCard entity={entity} variant="gridItem" />
@@ -178,7 +181,7 @@ const ServiceEntityPage = ({ entity }: { entity: Entity }) => (
     <EntityPageLayout.Content
       path="/"
       title="Overview"
-      element={<OverviewContent entity={entity} />}
+      element={<ComponentOverviewContent entity={entity} />}
     />
     <EntityPageLayout.Content
       path="/ci-cd/*"
@@ -223,7 +226,7 @@ const WebsiteEntityPage = ({ entity }: { entity: Entity }) => (
     <EntityPageLayout.Content
       path="/"
       title="Overview"
-      element={<OverviewContent entity={entity} />}
+      element={<ComponentOverviewContent entity={entity} />}
     />
     <EntityPageLayout.Content
       path="/ci-cd/*"
@@ -262,12 +265,13 @@ const WebsiteEntityPage = ({ entity }: { entity: Entity }) => (
     />
   </EntityPageLayout>
 );
+
 const DefaultEntityPage = ({ entity }: { entity: Entity }) => (
   <EntityPageLayout>
     <EntityPageLayout.Content
       path="/*"
       title="Overview"
-      element={<OverviewContent entity={entity} />}
+      element={<ComponentOverviewContent entity={entity} />}
     />
     <EntityPageLayout.Content
       path="/docs/*"
@@ -277,8 +281,7 @@ const DefaultEntityPage = ({ entity }: { entity: Entity }) => (
   </EntityPageLayout>
 );
 
-export const EntityPage = () => {
-  const { entity } = useEntity();
+export const ComponentEntityPage = ({ entity }: { entity: Entity }) => {
   switch (entity?.spec?.type) {
     case 'service':
       return <ServiceEntityPage entity={entity} />;
@@ -288,3 +291,47 @@ export const EntityPage = () => {
       return <DefaultEntityPage entity={entity} />;
   }
 };
+
+const ApiOverviewContent = ({ entity }: { entity: Entity }) => (
+  <Grid container spacing={3}>
+    <Grid item md={6}>
+      <AboutCard entity={entity} />
+    </Grid>
+  </Grid>
+);
+
+const ApiDefinitionContent = ({ entity }: { entity: ApiEntity }) => (
+  <Grid container spacing={3}>
+    <Grid item xs={12}>
+      <ApiDefinitionCard apiEntity={entity} />
+    </Grid>
+  </Grid>
+);
+
+const ApiEntityPage = ({ entity }: { entity: Entity }) => (
+  <EntityPageLayout>
+    <EntityPageLayout.Content
+      path="/*"
+      title="Overview"
+      element={<ApiOverviewContent entity={entity} />}
+    />
+    <EntityPageLayout.Content
+      path="/definition/*"
+      title="Definition"
+      element={<ApiDefinitionContent entity={entity as ApiEntity} />}
+    />
+  </EntityPageLayout>
+);
+
+export const EntityPage = () => {
+  const { entity } = useEntity();
+
+  switch (entity?.kind?.toLowerCase()) {
+    case 'component':
+      return <ComponentEntityPage entity={entity} />;
+    case 'api':
+      return <ApiEntityPage entity={entity} />;
+    default:
+      return <DefaultEntityPage entity={entity} />;
+  }
+};

packages/app/src/plugins.ts

@@ -37,6 +37,7 @@ export { plugin as Kubernetes } from '@backstage/plugin-kubernetes';
 export { plugin as Cloudbuild } from '@backstage/plugin-cloudbuild';
 export { plugin as CostInsights } from '@backstage/plugin-cost-insights';
 export { plugin as GitHubInsights } from '@roadiehq/backstage-plugin-github-insights';
+export { plugin as CatalogImport } from '@backstage/plugin-catalog-import';
 export { plugin as UserSettings } from '@backstage/plugin-user-settings';
 export { plugin as PagerDuty } from '@backstage/plugin-pagerduty';
 export { plugin as Buildkite } from '@roadiehq/backstage-plugin-buildkite';