diff --git a/plugins/tech-radar/src/example/ExampleRadar.test.tsx b/plugins/tech-radar/src/example/ExampleRadar.test.tsx new file mode 100644 index 0000000000..ed8e678060 --- /dev/null +++ b/plugins/tech-radar/src/example/ExampleRadar.test.tsx @@ -0,0 +1,34 @@ +/* + * 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 { render } from '@testing-library/react'; +import mockFetch from 'jest-fetch-mock'; +import ExampleRadar from './ExampleRadar'; +import { ThemeProvider } from '@material-ui/core'; +import { lightTheme } from '@backstage/theme'; + +describe('ExampleRadar', () => { + it('should render', () => { + mockFetch.mockResponse(() => new Promise(() => {})); + const rendered = render( + + + , + ); + expect(rendered.getByText('Welcome to the Tech Radar')).toBeInTheDocument(); + }); +}); diff --git a/plugins/tech-radar/src/example/ExampleRadar.tsx b/plugins/tech-radar/src/example/ExampleRadar.tsx new file mode 100644 index 0000000000..0d9a762ad7 --- /dev/null +++ b/plugins/tech-radar/src/example/ExampleRadar.tsx @@ -0,0 +1,45 @@ +/* + * 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, { FC } from 'react'; +import { Grid } from '@material-ui/core'; +import { Page, Header, Content, pageTheme } from '@backstage/core'; +import Radar from '../components/Radar'; +import mockData from './data'; + +const ExampleRadar: FC<{}> = () => { + return ( + +
+ + + + + + + + + ); +}; + +export default ExampleRadar; diff --git a/plugins/tech-radar/src/example/data.ts b/plugins/tech-radar/src/example/data.ts new file mode 100644 index 0000000000..8071195977 --- /dev/null +++ b/plugins/tech-radar/src/example/data.ts @@ -0,0 +1,99 @@ +/* + * 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. + */ + +interface Ring { + id: string; + name: string; + color: string; +} + +const rings = new Array(); +rings.push({ id: 'use', name: 'USE', color: '#93c47d' }); +rings.push({ id: 'trial', name: 'TRIAL', color: '#93d2c2' }); +rings.push({ id: 'assess', name: 'ASSESS', color: '#fbdb84' }); +rings.push({ id: 'hold', name: 'HOLD', color: '#efafa9' }); + +interface Quadrant { + id: string; + name: string; +} + +const quadrants = new Array(); +quadrants.push({ id: 'infrastructure', name: 'Infrastructure' }); +quadrants.push({ id: 'frameworks', name: 'Frameworks' }); +quadrants.push({ id: 'languages', name: 'Languages' }); +quadrants.push({ id: 'process', name: 'Process' }); + +interface Entry { + key: string; // react key + id: string; + moved: number; + quadrant: string; + ring: string; + title: string; + url: string; +} + +const entries = new Array(); +const createEntry = (overrides: Partial) => + ({ + moved: 0, + ring: 'use', + url: '#', + key: overrides.id, + ...overrides, + } as Entry); + +entries.push( + createEntry({ id: 'javascript', title: 'JavaScript', quadrant: 'languages' }), +); +entries.push( + createEntry({ id: 'typescript', title: 'TypeScript', quadrant: 'languages' }), +); +entries.push( + createEntry({ id: 'webpack', title: 'Webpack', quadrant: 'frameworks' }), +); +entries.push( + createEntry({ id: 'react', title: 'React', quadrant: 'frameworks' }), +); +entries.push( + createEntry({ + id: 'code-reviews', + title: 'Code Reviews', + quadrant: 'process', + }), +); +entries.push( + createEntry({ + id: 'mob-programming', + title: 'Mob Programming', + quadrant: 'process', + ring: 'assess', + }), +); +entries.push( + createEntry({ + id: 'github-actions', + title: 'GitHub Actions', + quadrant: 'infrastructure', + }), +); + +export default { + rings, + quadrants, + entries, +}; diff --git a/plugins/tech-radar/src/plugin.ts b/plugins/tech-radar/src/plugin.ts index c5420e3b9c..f337aac56f 100644 --- a/plugins/tech-radar/src/plugin.ts +++ b/plugins/tech-radar/src/plugin.ts @@ -15,11 +15,11 @@ */ import { createPlugin } from '@backstage/core'; -import ExampleComponent from './components/ExampleComponent'; +import ExampleRadar from './example/ExampleRadar'; export const plugin = createPlugin({ id: 'tech-radar', register({ router }) { - router.registerRoute('/tech-radar', ExampleComponent); + router.registerRoute('/tech-radar', ExampleRadar); }, });