diff --git a/.github/styles/vocab.txt b/.github/styles/vocab.txt index 5d0f0da52e..d012264ae2 100644 --- a/.github/styles/vocab.txt +++ b/.github/styles/vocab.txt @@ -46,7 +46,6 @@ configmaps configs const cookiecutter -cors css dariddler dataflow diff --git a/plugins/splunk-on-call/README.md b/plugins/splunk-on-call/README.md index 5dc1e87809..592914fad2 100644 --- a/plugins/splunk-on-call/README.md +++ b/plugins/splunk-on-call/README.md @@ -75,15 +75,7 @@ proxy: $env: SPLUNK_ON_CALL_API_KEY ``` -In addition, to make certain API calls (trigger-resolve-acknowledge an incident) you need to add the `PATCH` method to the backend cors methods list. - -```yaml -# app-config.yaml -backend: - # ... - cors: - methods: [GET, POST, PUT, DELETE, PATCH] -``` +In addition, to make certain API calls (trigger-resolve-acknowledge an incident) you need to add the `PATCH` method to the backend `cors` methods list: `[GET, POST, PUT, DELETE, PATCH]`. ### Adding your team name to the entity annotation @@ -92,7 +84,7 @@ If you want to use this plugin for an entity, you need to label it with the belo ```yaml annotations: - splunk-on-call.com/team: + splunk.com/on-call-team': ``` ## Providing the API key and API id diff --git a/plugins/splunk-on-call/dev/index.tsx b/plugins/splunk-on-call/dev/index.tsx index 5a21c809ce..346c92c37e 100644 --- a/plugins/splunk-on-call/dev/index.tsx +++ b/plugins/splunk-on-call/dev/index.tsx @@ -13,7 +13,14 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +import React from 'react'; import { createDevApp } from '@backstage/dev-utils'; -import { plugin } from '../src/plugin'; +import { splunkOnCallPlugin, SplunkOnCallPage } from '../src/plugin'; -createDevApp().registerPlugin(plugin).render(); +createDevApp() + .registerPlugin(splunkOnCallPlugin) + .addPage({ + title: 'Splunk On-Call', + element: , + }) + .render(); diff --git a/plugins/splunk-on-call/src/components/SplunkOnCallCard.test.tsx b/plugins/splunk-on-call/src/components/SplunkOnCallCard.test.tsx index ebc5fca15c..b1280ab21c 100644 --- a/plugins/splunk-on-call/src/components/SplunkOnCallCard.test.tsx +++ b/plugins/splunk-on-call/src/components/SplunkOnCallCard.test.tsx @@ -71,7 +71,7 @@ const entity: Entity = { metadata: { name: 'splunkoncall-test', annotations: { - 'splunk-on-call.com/team': 'Example', + 'splunk.com/on-call-team': 'Example', }, }, }; diff --git a/plugins/splunk-on-call/src/components/SplunkOnCallCard.tsx b/plugins/splunk-on-call/src/components/SplunkOnCallCard.tsx index 54dbebbf9d..c3ba0adf95 100644 --- a/plugins/splunk-on-call/src/components/SplunkOnCallCard.tsx +++ b/plugins/splunk-on-call/src/components/SplunkOnCallCard.tsx @@ -58,7 +58,7 @@ const useStyles = makeStyles({ }, }); -export const SPLUNK_ON_CALL_TEAM = 'splunk-on-call.com/team'; +export const SPLUNK_ON_CALL_TEAM = 'splunk.com/on-call-team'; export const MissingTeamAnnotation = () => ( diff --git a/plugins/splunk-on-call/src/components/SplunkOnCallPage.tsx b/plugins/splunk-on-call/src/components/SplunkOnCallPage.tsx new file mode 100644 index 0000000000..4222cbfbeb --- /dev/null +++ b/plugins/splunk-on-call/src/components/SplunkOnCallPage.tsx @@ -0,0 +1,72 @@ +/* + * 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 { Grid, makeStyles } from '@material-ui/core'; +import { + Content, + ContentHeader, + Page, + Header, + SupportButton, +} from '@backstage/core'; +import { SplunkOnCallCard } from './SplunkOnCallCard'; +import { useEntity } from '@backstage/plugin-catalog-react'; + +const useStyles = makeStyles(() => ({ + overflowXScroll: { + overflowX: 'scroll', + }, +})); + +export type SplunkOnCallPageProps = { + title?: string; + subtitle?: string; + pageTitle?: string; +}; + +export const SplunkOnCallPage = ({ + title, + subtitle, + pageTitle, +}: SplunkOnCallPageProps): JSX.Element => { + const classes = useStyles(); + const { entity } = useEntity(); + + return ( + +
+ + + + This is used to help you automate incident management. + + + + + + + + + + ); +}; + +SplunkOnCallPage.defaultProps = { + title: 'Splunk On-Call', + subtitle: 'Automate incident management', + pageTitle: 'Dashboard', +}; diff --git a/plugins/splunk-on-call/src/index.ts b/plugins/splunk-on-call/src/index.ts index 8d9555d0be..c8de96f8ea 100644 --- a/plugins/splunk-on-call/src/index.ts +++ b/plugins/splunk-on-call/src/index.ts @@ -13,7 +13,11 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -export { plugin } from './plugin'; +export { + splunkOnCallPlugin, + splunkOnCallPlugin as plugin, + SplunkOnCallPage, +} from './plugin'; export { isPluginApplicableToEntity, SplunkOnCallCard, diff --git a/plugins/splunk-on-call/src/plugin.test.ts b/plugins/splunk-on-call/src/plugin.test.ts index a64e5474a1..b846eba706 100644 --- a/plugins/splunk-on-call/src/plugin.test.ts +++ b/plugins/splunk-on-call/src/plugin.test.ts @@ -13,10 +13,10 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { plugin } from './plugin'; +import { splunkOnCallPlugin } from './plugin'; describe('splunk-on-call', () => { it('should export plugin', () => { - expect(plugin).toBeDefined(); + expect(splunkOnCallPlugin).toBeDefined(); }); }); diff --git a/plugins/splunk-on-call/src/plugin.ts b/plugins/splunk-on-call/src/plugin.ts index 38235d5b48..835cda48df 100644 --- a/plugins/splunk-on-call/src/plugin.ts +++ b/plugins/splunk-on-call/src/plugin.ts @@ -19,15 +19,15 @@ import { createRouteRef, discoveryApiRef, configApiRef, + createRoutableExtension, } from '@backstage/core'; import { splunkOnCallApiRef, SplunkOnCallClient } from './api'; export const rootRouteRef = createRouteRef({ - path: '/splunk-on-call', title: 'splunk-on-call', }); -export const plugin = createPlugin({ +export const splunkOnCallPlugin = createPlugin({ id: 'splunk-on-call', apis: [ createApiFactory({ @@ -37,4 +37,15 @@ export const plugin = createPlugin({ SplunkOnCallClient.fromConfig(configApi, discoveryApi), }), ], + routes: { + root: rootRouteRef, + }, }); + +export const SplunkOnCallPage = splunkOnCallPlugin.provide( + createRoutableExtension({ + component: () => + import('./components/SplunkOnCallPage').then(m => m.SplunkOnCallPage), + mountPoint: rootRouteRef, + }), +);