paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 20 Packages Projects Releases Wiki Activity

Merge pull request #3843 from backstage/mob/sentryport

Browse Source 
sentry: port plugin to new composability API and dev-utils
This commit is contained in:
Ben Lambert
2021-01-05 16:00:16 +01:00
committed by GitHub
parent cf583b9547 7f970fe448
commit 474ecd911c
7 changed files with 124 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/hungry-mice-clap.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/plugin-sentry': patch
---
Port to new composability API by exporting new `EntitySentryContent` and `EntitySentryCard` component extensions.
.github/styles/vocab.txt
+1
View File
@@ -36,6 +36,7 @@ Codecov
codehilite
Codehilite
codeowners
composability
composable
config
Config
plugins/sentry/dev/index.tsx
+57 -57
View File
@@ -15,24 +15,32 @@
*/
import { Entity } from '@backstage/catalog-model';
import {
Content,
createPlugin,
createRouteRef,
Header,
Page,
} from '@backstage/core';
import { createDevApp } from '@backstage/dev-utils';
import { EntityProvider } from '@backstage/plugin-catalog';
import { Content, Header, Page } from '@backstage/core';
import { createDevApp, EntityGridItem } from '@backstage/dev-utils';
import { Grid } from '@material-ui/core';
import React from 'react';
import {
MockSentryApi,
SentryApi,
sentryApiRef,
SentryIssuesWidget,
EntitySentryCard,
EntitySentryContent,
} from '../src';
import { SENTRY_PROJECT_SLUG_ANNOTATION } from '../src/components/useProjectSlug';
const entity = (name?: string) =>
({
apiVersion: 'backstage.io/v1alpha1',
kind: 'Component',
metadata: {
annotations: {
[SENTRY_PROJECT_SLUG_ANNOTATION]: name,
},
name: name,
},
} as Entity);
createDevApp()
.registerApi({
api: sentryApiRef,
@@ -56,52 +64,44 @@ createDevApp()
},
} as SentryApi),
})
.registerPlugin(
createPlugin({
id: 'sentry-demo',
register({ router }) {
const entity = (name?: string) =>
({
apiVersion: 'backstage.io/v1alpha1',
kind: 'Component',
metadata: {
annotations: {
[SENTRY_PROJECT_SLUG_ANNOTATION]: name,
},
name: name,
},
} as Entity);
const ExamplePage = () => (
<Page themeId="home">
<Header title="Sentry" />
<Content>
<Grid container>
<Grid item xs={12} md={6}>
<SentryIssuesWidget entity={entity('error')} />
</Grid>
<Grid item xs={12} md={6}>
<SentryIssuesWidget entity={entity('empty')} />
</Grid>
<Grid item xs={12} md={6}>
<SentryIssuesWidget entity={entity('never')} />
</Grid>
<Grid item xs={12} md={6}>
<SentryIssuesWidget entity={entity('with-values')} />
</Grid>
<Grid item xs={12}>
<SentryIssuesWidget entity={entity(undefined)} />
</Grid>
</Grid>
</Content>
</Page>
);
router.addRoute(
createRouteRef({ path: '/', title: 'Sentry' }),
ExamplePage,
);
},
}),
)
.addPage({
title: 'Entity Content',
element: (
<Page themeId="home">
<Header title="Sentry" />
<Content>
<EntityProvider entity={entity('error')}>
<EntitySentryContent />
</EntityProvider>
</Content>
</Page>
),
})
.addPage({
title: 'Cards',
element: (
<Page themeId="home">
<Header title="Sentry" />
<Content>
<Grid container>
<EntityGridItem xs={12} md={6} entity={entity('error')}>
<EntitySentryCard />
</EntityGridItem>
<EntityGridItem xs={12} md={6} entity={entity('empty')}>
<EntitySentryCard />
</EntityGridItem>
<EntityGridItem xs={12} md={6} entity={entity('never')}>
<EntitySentryCard />
</EntityGridItem>
<EntityGridItem xs={12} md={6} entity={entity('with-values')}>
<EntitySentryCard />
</EntityGridItem>
<EntityGridItem xs={12} entity={entity(undefined)}>
<EntitySentryCard />
</EntityGridItem>
</Grid>
</Content>
</Page>
),
})
.render();
plugins/sentry/package.json
+1
View File
@@ -33,6 +33,7 @@
"dependencies": {
"@backstage/catalog-model": "^0.6.0",
"@backstage/core": "^0.4.3",
"@backstage/plugin-catalog": "^0.2.9",
"@backstage/theme": "^0.2.2",
"@material-ui/core": "^4.11.0",
"@material-ui/icons": "^4.9.1",
plugins/sentry/src/extensions.tsx
+56
View File
@@ -0,0 +1,56 @@
/*
* Copyright 2020 Spotify AB
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import React from 'react';
import {
createComponentExtension,
createRoutableExtension,
} from '@backstage/core';
import { useEntity } from '@backstage/plugin-catalog';
import { plugin, rootRouteRef } from './plugin';
export const EntitySentryContent = plugin.provide(
createRoutableExtension({
mountPoint: rootRouteRef,
component: () =>
import('./components/SentryIssuesWidget').then(
({ SentryIssuesWidget }) => {
const SentryPage = () => {
const { entity } = useEntity();
return <SentryIssuesWidget entity={entity} statsFor="24h" />;
};
return SentryPage;
},
),
}),
);
export const EntitySentryCard = plugin.provide(
createComponentExtension({
component: {
lazy: () =>
import('./components/SentryIssuesWidget').then(
({ SentryIssuesWidget }) => {
const SentryCard = () => {
const { entity } = useEntity();
return <SentryIssuesWidget entity={entity} />;
};
return SentryCard;
},
),
},
}),
);
plugins/sentry/src/index.ts
+1
View File
@@ -17,4 +17,5 @@
export * from './api';
export * from './components';
export { plugin } from './plugin';
export { EntitySentryCard, EntitySentryContent } from './extensions';
export { Router } from './components/Router';
plugins/sentry/src/plugin.ts
+3
View File
@@ -41,4 +41,7 @@ export const plugin = createPlugin({
),
}),
],
routes: {
root: rootRouteRef,
},
});