From c9c6bf39326e7c4168502c0f84a4abd17f69f91d Mon Sep 17 00:00:00 2001 From: Kamil Wolny Date: Thu, 28 Jul 2022 14:35:54 +0100 Subject: [PATCH 01/17] feat: github issues plugin mvp Signed-off-by: Kamil Wolny --- packages/app/package.json | 1 + packages/app/src/App.tsx | 2 + .../app/src/components/catalog/EntityPage.tsx | 18 + plugins/github-issues/.eslintrc.js | 1 + plugins/github-issues/README.md | 13 + plugins/github-issues/dev/index.tsx | 27 ++ plugins/github-issues/package.json | 60 +++ .../GitHubIssues/GitHubIssues.test.tsx | 49 +++ .../components/GitHubIssues/GitHubIssues.tsx | 150 +++++++ .../GitHubIssues/IssueCard/Assignees.tsx | 61 +++ .../GitHubIssues/IssueCard/CommentsCount.tsx | 40 ++ .../GitHubIssues/IssueCard/IssueCard.tsx | 93 +++++ .../GitHubIssues/IssueCard/index.ts | 16 + .../IssuesList/Filters/Filters.tsx | 64 +++ .../GitHubIssues/IssuesList/Filters/index.ts | 16 + .../GitHubIssues/IssuesList/IssuesList.tsx | 101 +++++ .../GitHubIssues/IssuesList/index.tsx | 16 + .../NoRepositoriesInfo/NoRepositoriesInfo.tsx | 27 ++ .../GitHubIssues/NoRepositoriesInfo/index.tsx | 16 + .../src/components/GitHubIssues/index.ts | 16 + .../GitHubIssuesCard/GitHubIssuesCard.tsx | 24 ++ .../src/components/GitHubIssuesCard/index.ts | 16 + .../GitHubIssuesPage/GitHubIssuesPage.tsx | 23 ++ .../src/components/GitHubIssuesPage/index.ts | 16 + .../src/hooks/useEntityGitHubRepositories.ts | 69 ++++ .../useGetIssuesBeRepoFromGitHub.test.tsx | 105 +++++ .../src/hooks/useGetIssuesByRepoFromGitHub.ts | 177 ++++++++ .../src/hooks/useGitHubIssues.ts | 21 + .../src/hooks/useOctokitGraphQL.ts | 47 +++ plugins/github-issues/src/index.ts | 20 + plugins/github-issues/src/plugin.test.ts | 22 + plugins/github-issues/src/plugin.ts | 48 +++ plugins/github-issues/src/routes.ts | 20 + plugins/github-issues/src/setupTests.ts | 17 + yarn.lock | 378 +++++++++++++++++- 35 files changed, 1770 insertions(+), 20 deletions(-) create mode 100644 plugins/github-issues/.eslintrc.js create mode 100644 plugins/github-issues/README.md create mode 100644 plugins/github-issues/dev/index.tsx create mode 100644 plugins/github-issues/package.json create mode 100644 plugins/github-issues/src/components/GitHubIssues/GitHubIssues.test.tsx create mode 100644 plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx create mode 100644 plugins/github-issues/src/components/GitHubIssues/IssueCard/Assignees.tsx create mode 100644 plugins/github-issues/src/components/GitHubIssues/IssueCard/CommentsCount.tsx create mode 100644 plugins/github-issues/src/components/GitHubIssues/IssueCard/IssueCard.tsx create mode 100644 plugins/github-issues/src/components/GitHubIssues/IssueCard/index.ts create mode 100644 plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/Filters.tsx create mode 100644 plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/index.ts create mode 100644 plugins/github-issues/src/components/GitHubIssues/IssuesList/IssuesList.tsx create mode 100644 plugins/github-issues/src/components/GitHubIssues/IssuesList/index.tsx create mode 100644 plugins/github-issues/src/components/GitHubIssues/NoRepositoriesInfo/NoRepositoriesInfo.tsx create mode 100644 plugins/github-issues/src/components/GitHubIssues/NoRepositoriesInfo/index.tsx create mode 100644 plugins/github-issues/src/components/GitHubIssues/index.ts create mode 100644 plugins/github-issues/src/components/GitHubIssuesCard/GitHubIssuesCard.tsx create mode 100644 plugins/github-issues/src/components/GitHubIssuesCard/index.ts create mode 100644 plugins/github-issues/src/components/GitHubIssuesPage/GitHubIssuesPage.tsx create mode 100644 plugins/github-issues/src/components/GitHubIssuesPage/index.ts create mode 100644 plugins/github-issues/src/hooks/useEntityGitHubRepositories.ts create mode 100644 plugins/github-issues/src/hooks/useGetIssuesBeRepoFromGitHub.test.tsx create mode 100644 plugins/github-issues/src/hooks/useGetIssuesByRepoFromGitHub.ts create mode 100644 plugins/github-issues/src/hooks/useGitHubIssues.ts create mode 100644 plugins/github-issues/src/hooks/useOctokitGraphQL.ts create mode 100644 plugins/github-issues/src/index.ts create mode 100644 plugins/github-issues/src/plugin.test.ts create mode 100644 plugins/github-issues/src/plugin.ts create mode 100644 plugins/github-issues/src/routes.ts create mode 100644 plugins/github-issues/src/setupTests.ts diff --git a/packages/app/package.json b/packages/app/package.json index 738dbc2246..d1ab52a6a8 100644 --- a/packages/app/package.json +++ b/packages/app/package.json @@ -33,6 +33,7 @@ "@backstage/plugin-gcalendar": "^0.3.4-next.0", "@backstage/plugin-gcp-projects": "^0.3.27-next.0", "@backstage/plugin-github-actions": "^0.5.8-next.0", + "@backstage/plugin-github-issues": "^0.0.0", "@backstage/plugin-gocd": "^0.1.14-next.0", "@backstage/plugin-graphiql": "^0.2.40-next.0", "@backstage/plugin-home": "^0.4.24-next.0", diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx index 289af8d40f..bc1d86b650 100644 --- a/packages/app/src/App.tsx +++ b/packages/app/src/App.tsx @@ -100,6 +100,7 @@ import { techDocsPage } from './components/techdocs/TechDocsPage'; import { ApacheAirflowPage } from '@backstage/plugin-apache-airflow'; import { PermissionedRoute } from '@backstage/plugin-permission-react'; import { catalogEntityCreatePermission } from '@backstage/plugin-catalog-common'; +import { GitHubIssuesPage } from '@backstage/plugin-github-issues'; const app = createApp({ apis, @@ -241,6 +242,7 @@ const routes = ( } /> } /> + } /> ); diff --git a/packages/app/src/components/catalog/EntityPage.tsx b/packages/app/src/components/catalog/EntityPage.tsx index 288196266e..166157a2bc 100644 --- a/packages/app/src/components/catalog/EntityPage.tsx +++ b/packages/app/src/components/catalog/EntityPage.tsx @@ -150,6 +150,11 @@ import { ReportIssue, } from '@backstage/plugin-techdocs-module-addons-contrib'; +import { + GitHubIssuesCard, + GitHubIssuesPage, +} from '@backstage/plugin-github-issues'; + const customEntityFilterKind = ['Component', 'API', 'System']; const EntityLayoutWrapper = (props: { children?: ReactNode }) => { @@ -325,6 +330,10 @@ const overviewContent = ( + + + + @@ -624,6 +633,9 @@ const userPage = ( entityFilterKind={customEntityFilterKind} /> + + + @@ -646,8 +658,14 @@ const groupPage = ( + + + + + + ); diff --git a/plugins/github-issues/.eslintrc.js b/plugins/github-issues/.eslintrc.js new file mode 100644 index 0000000000..e2a53a6ad2 --- /dev/null +++ b/plugins/github-issues/.eslintrc.js @@ -0,0 +1 @@ +module.exports = require('@backstage/cli/config/eslint-factory')(__dirname); diff --git a/plugins/github-issues/README.md b/plugins/github-issues/README.md new file mode 100644 index 0000000000..65757bef00 --- /dev/null +++ b/plugins/github-issues/README.md @@ -0,0 +1,13 @@ +# github-issues + +Welcome to the github-issues plugin! + +_This plugin was created through the Backstage CLI_ + +## Getting started + +Your plugin has been added to the example app in this repository, meaning you'll be able to access it by running `yarn start` in the root directory, and then navigating to [/github-issues](http://localhost:3000/github-issues). + +You can also serve the plugin in isolation by running `yarn start` in the plugin directory. +This method of serving the plugin provides quicker iteration speed and a faster startup and hot reloads. +It is only meant for local development, and the setup for it can be found inside the [/dev](./dev) directory. diff --git a/plugins/github-issues/dev/index.tsx b/plugins/github-issues/dev/index.tsx new file mode 100644 index 0000000000..4de5a78b2f --- /dev/null +++ b/plugins/github-issues/dev/index.tsx @@ -0,0 +1,27 @@ +/* + * Copyright 2022 The Backstage Authors + * + * 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 { createDevApp } from '@backstage/dev-utils'; +import { gitHubIssuesPlugin, GitHubIssuesPage } from '../src/plugin'; + +createDevApp() + .registerPlugin(gitHubIssuesPlugin) + .addPage({ + element: , + title: 'Root Page', + path: '/github-issues', + }) + .render(); diff --git a/plugins/github-issues/package.json b/plugins/github-issues/package.json new file mode 100644 index 0000000000..ab2f7b914e --- /dev/null +++ b/plugins/github-issues/package.json @@ -0,0 +1,60 @@ +{ + "name": "@backstage/plugin-github-issues", + "version": "0.0.0", + "main": "src/index.ts", + "types": "src/index.ts", + "license": "Apache-2.0", + "publishConfig": { + "access": "public", + "main": "dist/index.esm.js", + "types": "dist/index.d.ts" + }, + "backstage": { + "role": "frontend-plugin" + }, + "scripts": { + "start": "backstage-cli package start", + "build": "backstage-cli package build", + "lint": "backstage-cli package lint", + "test": "backstage-cli package test", + "clean": "backstage-cli package clean", + "prepack": "backstage-cli package prepack", + "postpack": "backstage-cli package postpack" + }, + "prettier": "@spotify/prettier-config", + "dependencies": { + "@backstage/catalog-model": "^1.0.3", + "@backstage/core-components": "^0.9.5", + "@backstage/core-plugin-api": "^1.0.3", + "@backstage/integration": "^1.2.1", + "@backstage/plugin-catalog-react": "^1.1.1", + "@backstage/theme": "^0.2.15", + "@material-ui/core": "^4.12.4", + "@material-ui/icons": "^4.9.1", + "@material-ui/lab": "^4.0.0-alpha.61", + "@octokit/rest": "^18.12.0", + "luxon": "^2.4.0", + "react-use": "^17.2.4" + }, + "peerDependencies": { + "react": "^16.13.1 || ^17.0.0" + }, + "devDependencies": { + "@backstage/cli": "^0.17.2", + "@backstage/core-app-api": "^1.0.3", + "@backstage/dev-utils": "^1.0.3", + "@backstage/test-utils": "^1.1.1", + "@spotify/prettier-config": "^13.0.1", + "@testing-library/jest-dom": "^5.10.1", + "@testing-library/react": "^12.1.3", + "@testing-library/user-event": "^14.0.0", + "@types/jest": "*", + "@types/node": "*", + "cross-fetch": "^3.1.5", + "msw": "^0.42.0", + "prettier": "^2.7.1" + }, + "files": [ + "dist" + ] +} diff --git a/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.test.tsx b/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.test.tsx new file mode 100644 index 0000000000..ebb9c78f19 --- /dev/null +++ b/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.test.tsx @@ -0,0 +1,49 @@ +/* + * Copyright 2022 The Backstage Authors + * + * 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 { GitHubIssues } from './GitHubIssues'; +import { ThemeProvider } from '@material-ui/core'; +import { lightTheme } from '@backstage/theme'; +import { rest } from 'msw'; +import { setupServer } from 'msw/node'; +import { + setupRequestMockHandlers, + renderInTestApp, +} from '@backstage/test-utils'; + +// test for repo duplicates + +describe('GitHubIssues', () => { + const server = setupServer(); + // Enable sane handlers for network requests + setupRequestMockHandlers(server); + + // setup mock response + beforeEach(() => { + server.use( + rest.get('/*', (_, res, ctx) => res(ctx.status(200), ctx.json({}))), + ); + }); + + it('should render', async () => { + const rendered = await renderInTestApp( + + + , + ); + expect(rendered.getByText('Welcome to github-issues!')).toBeInTheDocument(); + }); +}); diff --git a/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx b/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx new file mode 100644 index 0000000000..da31869000 --- /dev/null +++ b/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx @@ -0,0 +1,150 @@ +/* + * Copyright 2022 The Backstage Authors + * + * 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 { Box, IconButton, Typography } from '@material-ui/core'; +import { InfoCard, Progress } from '@backstage/core-components'; +import RefreshIcon from '@material-ui/icons/Refresh'; + +import { useEntityGitHubRepositories } from '../../hooks/useEntityGitHubRepositories'; +import { + RepoIssues, + useGetIssuesByRepoFromGitHub, +} from '../../hooks/useGetIssuesByRepoFromGitHub'; + +import { IssueList } from './IssuesList'; +import { NoRepositoriesInfo } from './NoRepositoriesInfo'; + +export type PluginMode = 'page' | 'card'; + +export type Props = { + mode: PluginMode; + itemsPerPage?: number; + itemsPerRepo?: number; +}; + +export const GitHubIssues = ({ + itemsPerPage = 10, + itemsPerRepo = 40, +}: Props) => { + const [isLoading, setIsLoading] = React.useState(true); + const [activeFilter, setActiveFilter] = React.useState>([]); + + const [issuesByRepository, setIssuesByRepository] = + React.useState>(); + + const { repositories } = useEntityGitHubRepositories(); + const getIssues = useGetIssuesByRepoFromGitHub(); + + const filters = React.useMemo( + () => + issuesByRepository + ? Object.keys(issuesByRepository) + .filter(repo => issuesByRepository[repo].issues.totalCount > 0) + .map(repo => ({ + label: `${repo} (${issuesByRepository[repo].issues.totalCount})`, + value: repo, + })) + : [], + [issuesByRepository], + ); + + const totalIssuesInGitHub = React.useMemo( + () => + issuesByRepository + ? Object.values(issuesByRepository).reduce( + (acc, { issues: { totalCount } }) => acc + totalCount, + 0, + ) + : 0, + [issuesByRepository], + ); + + const filteredRepos = React.useMemo( + () => + issuesByRepository && activeFilter.length + ? activeFilter.reduce( + (acc, val) => ({ + [val]: issuesByRepository[val], + ...acc, + }), + {}, + ) + : issuesByRepository, + [issuesByRepository, activeFilter], + ); + + const issues = React.useMemo( + () => + filteredRepos + ? Object.values(filteredRepos) + .map(({ issues: { edges } }) => edges) + .flat() + .sort((a, b) => { + if (a.node.updatedAt > b.node.updatedAt) { + return -1; + } else if (b.node.updatedAt > a.node.updatedAt) { + return 1; + } + return 0; + }) + : [], + [filteredRepos], + ); + + const fetchGitHubIssues = React.useCallback(async () => { + setIsLoading(true); + const issuesByRepo = await getIssues(repositories, itemsPerRepo); + + setIssuesByRepository(issuesByRepo); + setIsLoading(false); + }, [itemsPerRepo, getIssues, repositories]); + + React.useEffect(() => { + if (repositories.length) { + fetchGitHubIssues(); + } else { + setIsLoading(false); + } + }, [repositories.length, fetchGitHubIssues]); + + if (!repositories.length) { + return ; + } + + return ( + + Open GitHub Issues + + + + + } + > + {isLoading && } + + + + ); +}; diff --git a/plugins/github-issues/src/components/GitHubIssues/IssueCard/Assignees.tsx b/plugins/github-issues/src/components/GitHubIssues/IssueCard/Assignees.tsx new file mode 100644 index 0000000000..e6abdbb6fe --- /dev/null +++ b/plugins/github-issues/src/components/GitHubIssues/IssueCard/Assignees.tsx @@ -0,0 +1,61 @@ +/* + * Copyright 2022 The Backstage Authors + * + * 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, { FunctionComponent } from 'react'; +import { Typography, Box, Avatar, makeStyles } from '@material-ui/core'; + +type Props = { + name?: string; + avatar?: string; +}; + +const useStyles = makeStyles(theme => ({ + small: { + width: theme.spacing(4), + height: theme.spacing(4), + marginLeft: theme.spacing(1), + }, + noAssignees: { + height: theme.spacing(4), + }, +})); + +export const Assignees: FunctionComponent = (props: Props) => { + const { name, avatar } = props; + const classes = useStyles(); + + // todo: many assignees -> NUM assignees + stock images on each other + return name ? ( + + + {name} + + + + ) : ( + + + No assignees + + + ); +}; + +export default Assignees; diff --git a/plugins/github-issues/src/components/GitHubIssues/IssueCard/CommentsCount.tsx b/plugins/github-issues/src/components/GitHubIssues/IssueCard/CommentsCount.tsx new file mode 100644 index 0000000000..d3e7f355e0 --- /dev/null +++ b/plugins/github-issues/src/components/GitHubIssues/IssueCard/CommentsCount.tsx @@ -0,0 +1,40 @@ +/* + * Copyright 2022 The Backstage Authors + * + * 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, { FunctionComponent } from 'react'; +import { ChatIcon } from '@backstage/core-components'; +import { Box, Badge } from '@material-ui/core'; + +type Props = { + commentsCount: number; +}; + +export const CommentsCount: FunctionComponent = (props: Props) => { + const { commentsCount } = props; + + return ( + + + + + + ); +}; diff --git a/plugins/github-issues/src/components/GitHubIssues/IssueCard/IssueCard.tsx b/plugins/github-issues/src/components/GitHubIssues/IssueCard/IssueCard.tsx new file mode 100644 index 0000000000..73010d50c9 --- /dev/null +++ b/plugins/github-issues/src/components/GitHubIssues/IssueCard/IssueCard.tsx @@ -0,0 +1,93 @@ +/* + * Copyright 2022 The Backstage Authors + * + * 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, { FunctionComponent } from 'react'; +import { DateTime } from 'luxon'; + +import { Box, Paper, Typography, CardActionArea } from '@material-ui/core'; +import Assignees from './Assignees'; +import { CommentsCount } from './CommentsCount'; + +import Divider from '@material-ui/core/Divider'; + +type Props = { + title: string; + createdAt: string; + updatedAt?: string; + url: string; + authorName: string; + assigneeName?: string; + assigneeAvatar?: string; + authorAvatar?: string; + repositoryName: string; + commentsCount: number; + even: boolean; +}; + +const getElapsedTime = (isoDate: string) => + DateTime.fromISO(isoDate).toRelative(); + +export const IssueCard: FunctionComponent = (props: Props) => { + const { + title, + createdAt, + updatedAt, + url, + assigneeName, + assigneeAvatar, + authorName, + repositoryName, + commentsCount, + } = props; + + return ( + + + + + + + {repositoryName} + + + + + + {title} + + + + + + + Created at: {getElapsedTime(createdAt)} by{' '} + {authorName} + + {updatedAt && ( + + Last update at: {getElapsedTime(updatedAt)} + + )} + + {commentsCount > 0 && ( + + )} + + + + + + ); +}; diff --git a/plugins/github-issues/src/components/GitHubIssues/IssueCard/index.ts b/plugins/github-issues/src/components/GitHubIssues/IssueCard/index.ts new file mode 100644 index 0000000000..5c60abf6ab --- /dev/null +++ b/plugins/github-issues/src/components/GitHubIssues/IssueCard/index.ts @@ -0,0 +1,16 @@ +/* + * Copyright 2022 The Backstage Authors + * + * 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. + */ +export { IssueCard } from './IssueCard'; diff --git a/plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/Filters.tsx b/plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/Filters.tsx new file mode 100644 index 0000000000..7f654dd9e5 --- /dev/null +++ b/plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/Filters.tsx @@ -0,0 +1,64 @@ +/* + * Copyright 2022 The Backstage Authors + * + * 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 { Select } from '@backstage/core-components'; +import { SelectedItems } from '@backstage/core-components'; +import { makeStyles, Box } from '@material-ui/core'; + +export type FilterItem = { + label: string; + value: string; +}; + +type Props = { + items: Array; + totalIssuesInGitHub: number; + onChange: (active: Array) => void; +}; + +const useStyles = makeStyles(theme => ({ + filters: { + margin: theme.spacing(0, 0, 2, 0), + '& > div': { + width: '600px', + '& > div': { + maxWidth: '600px', + }, + }, + }, +})); + +const checkSelectedItems: ( + onChange: (active: Array) => void, +) => (active: SelectedItems) => void = onChange => active => { + return onChange(active as Array); +}; + +export const Filters = ({ items, totalIssuesInGitHub, onChange }: Props) => { + const css = useStyles(); + + return ( + + + + *Repositories with more Issues in GitHub than available to view in + Backstage. To view them go to GitHub. + ); }; diff --git a/plugins/github-issues/src/components/GitHubIssues/IssuesList/IssuesList.tsx b/plugins/github-issues/src/components/GitHubIssues/IssuesList/IssuesList.tsx index 152a888785..34ccab597d 100644 --- a/plugins/github-issues/src/components/GitHubIssues/IssuesList/IssuesList.tsx +++ b/plugins/github-issues/src/components/GitHubIssues/IssuesList/IssuesList.tsx @@ -19,29 +19,86 @@ import { Box } from '@material-ui/core'; import { Pagination } from '@material-ui/lab'; import { IssueCard } from '../IssueCard'; -import { Issue } from '../../../hooks/useGetIssuesByRepoFromGitHub'; -import { Filters, FilterItem } from './Filters'; +import { RepoIssues } from '../../../hooks/useGetIssuesByRepoFromGitHub'; +import { Filters } from './Filters'; export type PluginMode = 'page' | 'card'; export type Props = { itemsPerPage?: number; - issues: Array<{ - node: Issue; - }>; - filters: Array; - totalIssuesInGitHub: number; - setActiveFilter: (active: Array) => void; + issuesByRepository?: Record; }; -export const IssueList = ({ - itemsPerPage = 10, - issues, - filters, - setActiveFilter, - totalIssuesInGitHub, -}: Props) => { +const getIssuesCountForFilterLabel = ( + totalIssues: number, + issuesAvailable: number, +) => + `(${totalIssues} ${totalIssues === 1 ? 'Issue' : `Issues`})${ + issuesAvailable < totalIssues ? '*' : '' + }`; + +export const IssueList = ({ itemsPerPage = 10, issuesByRepository }: Props) => { const [currentPage, setCurrentPage] = React.useState(1); + const [activeFilter, setActiveFilter] = React.useState>([]); + + const filters = React.useMemo( + () => + issuesByRepository + ? Object.keys(issuesByRepository) + .filter(repo => issuesByRepository[repo].issues.totalCount > 0) + .map(repo => ({ + label: `${repo} ${getIssuesCountForFilterLabel( + issuesByRepository[repo].issues.totalCount, + issuesByRepository[repo].issues.edges.length, + )}`, + value: repo, + })) + : [], + [issuesByRepository], + ); + + const totalIssuesInGitHub = React.useMemo( + () => + issuesByRepository + ? Object.values(issuesByRepository).reduce( + (acc, { issues: { totalCount } }) => acc + totalCount, + 0, + ) + : 0, + [issuesByRepository], + ); + + const filteredRepos = React.useMemo( + () => + issuesByRepository && activeFilter.length + ? activeFilter.reduce( + (acc, val) => ({ + [val]: issuesByRepository[val], + ...acc, + }), + {}, + ) + : issuesByRepository, + [issuesByRepository, activeFilter], + ); + + const issues = React.useMemo( + () => + filteredRepos + ? Object.values(filteredRepos) + .map(({ issues: { edges } }) => edges) + .flat() + .sort((a, b) => { + if (a.node.updatedAt > b.node.updatedAt) { + return -1; + } else if (b.node.updatedAt > a.node.updatedAt) { + return 1; + } + return 0; + }) + : [], + [filteredRepos], + ); const displayIssues = issues.slice( (currentPage - 1) * itemsPerPage, @@ -50,11 +107,17 @@ export const IssueList = ({ return ( - + {issues.length > 0 && ( + + )} {displayIssues.length > 0 ? ( displayIssues.map( @@ -88,7 +151,7 @@ export const IssueList = ({ ), ) ) : ( -

No issues 🚀

+

Hurray! No Issues 🚀

)} {issues.length / itemsPerPage > 1 ? ( { const Helper = () => { const getIssues = useGetIssuesByRepoFromGitHub(); - getIssues(['mrwolny/yo-yo', 'mrwolny/yoyo'], 10); + getIssues(['mrwolny/yo-yo', 'mrwolny/yoyo', 'mrwolny/yo.yo'], 10); return
; }; render(); - expect(mockGraphQLQuery).toHaveBeenCalled(); + expect(mockGraphQLQuery).toHaveBeenCalledTimes(1); expect(mockGraphQLQuery).toHaveBeenCalledWith( '\n' + ' \n' + @@ -46,7 +46,6 @@ describe('useGetIssuesBeRepoFromGitHub', () => { ' ) {\n' + ' totalCount\n' + ' edges {\n' + - ' cursor\n' + ' node {\n' + ' assignees(first: 10) {\n' + ' edges {\n' + @@ -64,7 +63,6 @@ describe('useGetIssuesBeRepoFromGitHub', () => { ' repository {\n' + ' nameWithOwner\n' + ' }\n' + - ' body\n' + ' title\n' + ' url\n' + ' participants {\n' + @@ -90,6 +88,10 @@ describe('useGetIssuesBeRepoFromGitHub', () => { ' yoyox: repository(name: "yoyo", owner: "mrwolny") {\n' + ' ...issues\n' + ' }\n' + + ' ,\n' + + ' yoyoxx: repository(name: "yo.yo", owner: "mrwolny") {\n' + + ' ...issues\n' + + ' }\n' + ' \n' + ' } \n' + ' ', diff --git a/plugins/github-issues/src/hooks/useGetIssuesByRepoFromGitHub.ts b/plugins/github-issues/src/hooks/useGetIssuesByRepoFromGitHub.ts index c75bd495ec..271cd6c741 100644 --- a/plugins/github-issues/src/hooks/useGetIssuesByRepoFromGitHub.ts +++ b/plugins/github-issues/src/hooks/useGetIssuesByRepoFromGitHub.ts @@ -36,13 +36,11 @@ type IssueAuthor = { }; export type Issue = { - cursor: string; assignees: EdgesWithNodes; author: IssueAuthor; repository: { nameWithOwner: string; }; - body: string; title: string; url: string; participants: { @@ -80,7 +78,6 @@ const createQuery = ( ) { totalCount edges { - cursor node { assignees(first: 10) { edges { @@ -98,7 +95,6 @@ const createQuery = ( repository { nameWithOwner } - body title url participants { diff --git a/plugins/github-issues/src/hooks/useGitHubIssues.ts b/plugins/github-issues/src/hooks/useGitHubIssues.ts deleted file mode 100644 index ffe3ca20f1..0000000000 --- a/plugins/github-issues/src/hooks/useGitHubIssues.ts +++ /dev/null @@ -1,21 +0,0 @@ -/* - * Copyright 2022 The Backstage Authors - * - * 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 { Issue } from './useGetIssuesByRepoFromGitHub'; - -export type GitHubIssues = { - getIssues: (repo?: string) => Array; - getIssuesTotalCountByRepo: () => Record; -}; From f9445b8d7b41996e655dae898c7eed21f19e3196 Mon Sep 17 00:00:00 2001 From: Kamil Wolny Date: Fri, 29 Jul 2022 14:51:32 +0100 Subject: [PATCH 07/17] feat: api report added Signed-off-by: Kamil Wolny --- plugins/github-issues/api-report.md | 34 +++++++++++++++++++++++++++++ plugins/github-issues/src/plugin.ts | 3 +++ 2 files changed, 37 insertions(+) create mode 100644 plugins/github-issues/api-report.md diff --git a/plugins/github-issues/api-report.md b/plugins/github-issues/api-report.md new file mode 100644 index 0000000000..5e6f75460d --- /dev/null +++ b/plugins/github-issues/api-report.md @@ -0,0 +1,34 @@ +## API Report File for "@backstage/plugin-github-issues" + +> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/). + +```ts +/// + +import { BackstagePlugin } from '@backstage/core-plugin-api'; +import { FunctionComponent } from 'react'; +import { RouteRef } from '@backstage/core-plugin-api'; + +// @public (undocumented) +export const GitHubIssuesCard: FunctionComponent<{ + itemsPerPage?: number | undefined; + itemsPerRepo?: number | undefined; +}>; + +// @public (undocumented) +export const GitHubIssuesPage: FunctionComponent<{ + itemsPerPage?: number | undefined; + itemsPerRepo?: number | undefined; +}>; + +// @public (undocumented) +export const gitHubIssuesPlugin: BackstagePlugin< + { + root: RouteRef; + }, + {}, + {} +>; + +// (No @packageDocumentation comment for this package) +``` diff --git a/plugins/github-issues/src/plugin.ts b/plugins/github-issues/src/plugin.ts index 60bae268c5..c5bf1cdbce 100644 --- a/plugins/github-issues/src/plugin.ts +++ b/plugins/github-issues/src/plugin.ts @@ -21,6 +21,7 @@ import { import { rootRouteRef } from './routes'; +/** @public */ export const gitHubIssuesPlugin = createPlugin({ id: 'github-issues', routes: { @@ -28,6 +29,7 @@ export const gitHubIssuesPlugin = createPlugin({ }, }); +/** @public */ export const GitHubIssuesCard = gitHubIssuesPlugin.provide( createComponentExtension({ name: 'GitHubIssuesCard', @@ -38,6 +40,7 @@ export const GitHubIssuesCard = gitHubIssuesPlugin.provide( }), ); +/** @public */ export const GitHubIssuesPage = gitHubIssuesPlugin.provide( createRoutableExtension({ name: 'GitHubIssuesPage', From 34f8a7acb395562b78db6f50eb12816f6dea2135 Mon Sep 17 00:00:00 2001 From: Kamil Wolny Date: Fri, 29 Jul 2022 15:27:25 +0100 Subject: [PATCH 08/17] feat: docs Signed-off-by: Kamil Wolny --- plugins/github-issues/README.md | 66 +++++++++++++++++++++++++++++---- 1 file changed, 58 insertions(+), 8 deletions(-) diff --git a/plugins/github-issues/README.md b/plugins/github-issues/README.md index 65757bef00..eeb93ab27b 100644 --- a/plugins/github-issues/README.md +++ b/plugins/github-issues/README.md @@ -1,13 +1,63 @@ -# github-issues +# GitHub Issues plugin -Welcome to the github-issues plugin! +Welcome to the GitHub Issues plugin! -_This plugin was created through the Backstage CLI_ +Based on the [well-known GitHub slug annotation](https://backstage.io/docs/features/software-catalog/well-known-annotations#githubcomproject-slug) associated with the Entity, it renders the list of Open issues in GitHub. -## Getting started +The plugin is designed to work with four Entity kinds, and it behaves a bit differently depending on that kind: -Your plugin has been added to the example app in this repository, meaning you'll be able to access it by running `yarn start` in the root directory, and then navigating to [/github-issues](http://localhost:3000/github-issues). +- Kind: Group/User: plugin renders issues from all repositories for which the Entity is the owner. +- Kind: API/Component: plugin renders issues from only one repository assigned to the Entity -You can also serve the plugin in isolation by running `yarn start` in the plugin directory. -This method of serving the plugin provides quicker iteration speed and a faster startup and hot reloads. -It is only meant for local development, and the setup for it can be found inside the [/dev](./dev) directory. +**Issues are sorted from the recently updated DESC order (the plugin might not render all issues from a single repo next to each other).** + +## Prerequisites + +- [GitHub Authentication Provider](https://backstage.io/docs/auth/github/provider) + +## Usage + +Install the plugin by running the following command **from your Backstage root directory** + +`yarn --cwd packages/app add @backstage/plugin-github-issues` + +After installation, the plugin can be used as a Card or as a Page. + +```typescript +import { + GitHubIssuesCard, + GitHubIssuesPage, +} from '@backstage/plugin-github-issues'; + +// To use as a page Plugin needs to be wrapped in EntityLayout.Route +const RenderGitHubIssuesPage = () => ( + + + + + + + +); + +// To use as a card and make it render correctly please place it inside appropriate Grid elements +const RenderGitHubIssuesCard = () => ( + + + + + + + + + +); +``` + +## Configuration + +Both `GitHubIssuesPage` and `GitHubIssuesCard` provide default configuration. It is ready to use out of the box. +However, you can configure the plugin with props: + +- `itemsPerPage: number = 10` - Issues in the list are paginated, number of issues on a single page is controlled with this prop +- `itemsPerRepo: number = 40` - the plugin doesn't download all Issues available on GitHub. By default, it will get at most 40 Issues - this prop controls this behaviour From ecabc7a35ed457831763762d47184bd93a8272c4 Mon Sep 17 00:00:00 2001 From: Kamil Wolny Date: Fri, 29 Jul 2022 15:32:48 +0100 Subject: [PATCH 09/17] feat: removed local changes to package/app Signed-off-by: Kamil Wolny --- packages/app/package.json | 1 - packages/app/src/App.tsx | 2 -- .../app/src/components/catalog/EntityPage.tsx | 18 ------------------ 3 files changed, 21 deletions(-) diff --git a/packages/app/package.json b/packages/app/package.json index d1ab52a6a8..738dbc2246 100644 --- a/packages/app/package.json +++ b/packages/app/package.json @@ -33,7 +33,6 @@ "@backstage/plugin-gcalendar": "^0.3.4-next.0", "@backstage/plugin-gcp-projects": "^0.3.27-next.0", "@backstage/plugin-github-actions": "^0.5.8-next.0", - "@backstage/plugin-github-issues": "^0.0.0", "@backstage/plugin-gocd": "^0.1.14-next.0", "@backstage/plugin-graphiql": "^0.2.40-next.0", "@backstage/plugin-home": "^0.4.24-next.0", diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx index bc1d86b650..289af8d40f 100644 --- a/packages/app/src/App.tsx +++ b/packages/app/src/App.tsx @@ -100,7 +100,6 @@ import { techDocsPage } from './components/techdocs/TechDocsPage'; import { ApacheAirflowPage } from '@backstage/plugin-apache-airflow'; import { PermissionedRoute } from '@backstage/plugin-permission-react'; import { catalogEntityCreatePermission } from '@backstage/plugin-catalog-common'; -import { GitHubIssuesPage } from '@backstage/plugin-github-issues'; const app = createApp({ apis, @@ -242,7 +241,6 @@ const routes = ( } /> } /> - } /> ); diff --git a/packages/app/src/components/catalog/EntityPage.tsx b/packages/app/src/components/catalog/EntityPage.tsx index 166157a2bc..288196266e 100644 --- a/packages/app/src/components/catalog/EntityPage.tsx +++ b/packages/app/src/components/catalog/EntityPage.tsx @@ -150,11 +150,6 @@ import { ReportIssue, } from '@backstage/plugin-techdocs-module-addons-contrib'; -import { - GitHubIssuesCard, - GitHubIssuesPage, -} from '@backstage/plugin-github-issues'; - const customEntityFilterKind = ['Component', 'API', 'System']; const EntityLayoutWrapper = (props: { children?: ReactNode }) => { @@ -330,10 +325,6 @@ const overviewContent = ( - - - - @@ -633,9 +624,6 @@ const userPage = ( entityFilterKind={customEntityFilterKind} /> - - - @@ -658,14 +646,8 @@ const groupPage = ( - - - - - - ); From 42d301b43c6ea9f0c129a1d877570edc5835b967 Mon Sep 17 00:00:00 2001 From: Kamil Wolny Date: Fri, 29 Jul 2022 16:07:37 +0100 Subject: [PATCH 10/17] fix: add missing react types + fixed typo Signed-off-by: Kamil Wolny --- plugins/github-issues/package.json | 1 + .../GitHubIssues/IssuesList/Filters/Filters.tsx | 2 +- yarn.lock | 14 +++++++++++--- 3 files changed, 13 insertions(+), 4 deletions(-) diff --git a/plugins/github-issues/package.json b/plugins/github-issues/package.json index f1ee17b2a3..f32ccc039e 100644 --- a/plugins/github-issues/package.json +++ b/plugins/github-issues/package.json @@ -50,6 +50,7 @@ "@testing-library/user-event": "^14.0.0", "@types/jest": "*", "@types/node": "*", + "@types/react": "^18.0.15", "cross-fetch": "^3.1.5", "msw": "^0.42.0", "prettier": "^2.7.1" diff --git a/plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/Filters.tsx b/plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/Filters.tsx index 9a6ceb103f..eab1d8f57b 100644 --- a/plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/Filters.tsx +++ b/plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/Filters.tsx @@ -60,7 +60,7 @@ export const Filters = ({ items, onChange, placeholder }: Props) => { onChange={checkSelectedItems(onChange)} /> - *Repositories with more Issues in GitHub than available to view in + *Repositories with more Issues on GitHub than available to view in Backstage. To view them go to GitHub. diff --git a/yarn.lock b/yarn.lock index 28ba459975..a7a5d687cf 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7432,7 +7432,7 @@ resolved "https://registry.npmjs.org/@types/range-parser/-/range-parser-1.2.3.tgz#7ee330ba7caafb98090bece86a5ee44115904c2c" integrity sha512-ewFXqrQHlFsgc09MK5jP5iR7vumV/BYayNC6PgJO2LPe8vrnNFyjQjSppfEngITi0qvfKtzFvgKymGheFM9UOA== -"@types/react-dom@*", "@types/react-dom@<18.0.0", "@types/react-dom@^17": +"@types/react-dom@*", "@types/react-dom@<18.0.0": version "17.0.17" resolved "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.17.tgz#2e3743277a793a96a99f1bf87614598289da68a1" integrity sha512-VjnqEmqGnasQKV0CWLevqMTXBYG9GbwuE6x3VetERLh0cq2LTptFE73MrQi2S7GkKXCf2GgwItB/melLnxfnsg== @@ -7507,6 +7507,15 @@ "@types/scheduler" "*" csstype "^3.0.2" +"@types/react@^18.0.15": + version "18.0.15" + resolved "https://registry.npmjs.org/@types/react/-/react-18.0.15.tgz#d355644c26832dc27f3e6cbf0c4f4603fc4ab7fe" + integrity sha512-iz3BtLuIYH1uWdsv6wXYdhozhqj20oD4/Hk2DNXIn1kFsmp9x8d9QB6FnPhfkbhd2PgEONt9Q1x/ebkwjfFLow== + dependencies: + "@types/prop-types" "*" + "@types/scheduler" "*" + csstype "^3.0.2" + "@types/recharts@^1.8.14", "@types/recharts@^1.8.15": version "1.8.23" resolved "https://registry.npmjs.org/@types/recharts/-/recharts-1.8.23.tgz#eeb6c52c6b2b916e9383bd5cf8fb5fd941c9c6fe" @@ -13160,7 +13169,6 @@ evp_bytestokey@^1.0.0, evp_bytestokey@^1.0.3: "@backstage/plugin-gcalendar" "^0.3.4-next.0" "@backstage/plugin-gcp-projects" "^0.3.27-next.0" "@backstage/plugin-github-actions" "^0.5.8-next.0" - "@backstage/plugin-github-issues" "^0.0.0" "@backstage/plugin-gocd" "^0.1.14-next.0" "@backstage/plugin-graphiql" "^0.2.40-next.0" "@backstage/plugin-home" "^0.4.24-next.0" @@ -26700,7 +26708,7 @@ ws@^7.3.1, ws@^7.4.6: resolved "https://registry.npmjs.org/ws/-/ws-7.5.7.tgz#9e0ac77ee50af70d58326ecff7e85eb3fa375e67" integrity sha512-KMvVuFzpKBuiIXW3E4u3mySRO2/mCHSyZDJQM5NQ9Q9KHWHWh0NHgfbRMLLrceUK5qAL4ytALJbpRMjixFZh8A== -ws@^8.0.0, ws@^8.3.0: +ws@^8.3.0: version "8.8.1" resolved "https://registry.npmjs.org/ws/-/ws-8.8.1.tgz#5dbad0feb7ade8ecc99b830c1d77c913d4955ff0" integrity sha512-bGy2JzvzkPowEJV++hF07hAD6niYSr0JzBNo/J29WsB57A2r7Wlc1UFcTR9IzrPvuNVO4B8LGqF8qcpsVOhJCA== From 043fb69c3d2b32dfa38ab00bdea4d412bbb155c6 Mon Sep 17 00:00:00 2001 From: Kamil Wolny Date: Fri, 29 Jul 2022 16:46:19 +0100 Subject: [PATCH 11/17] fix: @types/react as dependecy in plugins/github-issues Signed-off-by: Kamil Wolny --- plugins/github-issues/package.json | 2 +- yarn.lock | 13 ++----------- 2 files changed, 3 insertions(+), 12 deletions(-) diff --git a/plugins/github-issues/package.json b/plugins/github-issues/package.json index f32ccc039e..861a67ffa2 100644 --- a/plugins/github-issues/package.json +++ b/plugins/github-issues/package.json @@ -33,6 +33,7 @@ "@material-ui/icons": "^4.9.1", "@material-ui/lab": "^4.0.0-alpha.61", "@octokit/rest": "^18.12.0", + "@types/react": "^16.13.1 || ^17.0.0", "luxon": "^2.4.0", "react-use": "^17.2.4" }, @@ -50,7 +51,6 @@ "@testing-library/user-event": "^14.0.0", "@types/jest": "*", "@types/node": "*", - "@types/react": "^18.0.15", "cross-fetch": "^3.1.5", "msw": "^0.42.0", "prettier": "^2.7.1" diff --git a/yarn.lock b/yarn.lock index a7a5d687cf..44409c647b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7432,7 +7432,7 @@ resolved "https://registry.npmjs.org/@types/range-parser/-/range-parser-1.2.3.tgz#7ee330ba7caafb98090bece86a5ee44115904c2c" integrity sha512-ewFXqrQHlFsgc09MK5jP5iR7vumV/BYayNC6PgJO2LPe8vrnNFyjQjSppfEngITi0qvfKtzFvgKymGheFM9UOA== -"@types/react-dom@*", "@types/react-dom@<18.0.0": +"@types/react-dom@*", "@types/react-dom@<18.0.0", "@types/react-dom@^17": version "17.0.17" resolved "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.17.tgz#2e3743277a793a96a99f1bf87614598289da68a1" integrity sha512-VjnqEmqGnasQKV0CWLevqMTXBYG9GbwuE6x3VetERLh0cq2LTptFE73MrQi2S7GkKXCf2GgwItB/melLnxfnsg== @@ -7507,15 +7507,6 @@ "@types/scheduler" "*" csstype "^3.0.2" -"@types/react@^18.0.15": - version "18.0.15" - resolved "https://registry.npmjs.org/@types/react/-/react-18.0.15.tgz#d355644c26832dc27f3e6cbf0c4f4603fc4ab7fe" - integrity sha512-iz3BtLuIYH1uWdsv6wXYdhozhqj20oD4/Hk2DNXIn1kFsmp9x8d9QB6FnPhfkbhd2PgEONt9Q1x/ebkwjfFLow== - dependencies: - "@types/prop-types" "*" - "@types/scheduler" "*" - csstype "^3.0.2" - "@types/recharts@^1.8.14", "@types/recharts@^1.8.15": version "1.8.23" resolved "https://registry.npmjs.org/@types/recharts/-/recharts-1.8.23.tgz#eeb6c52c6b2b916e9383bd5cf8fb5fd941c9c6fe" @@ -26708,7 +26699,7 @@ ws@^7.3.1, ws@^7.4.6: resolved "https://registry.npmjs.org/ws/-/ws-7.5.7.tgz#9e0ac77ee50af70d58326ecff7e85eb3fa375e67" integrity sha512-KMvVuFzpKBuiIXW3E4u3mySRO2/mCHSyZDJQM5NQ9Q9KHWHWh0NHgfbRMLLrceUK5qAL4ytALJbpRMjixFZh8A== -ws@^8.3.0: +ws@^8.0.0, ws@^8.3.0: version "8.8.1" resolved "https://registry.npmjs.org/ws/-/ws-8.8.1.tgz#5dbad0feb7ade8ecc99b830c1d77c913d4955ff0" integrity sha512-bGy2JzvzkPowEJV++hF07hAD6niYSr0JzBNo/J29WsB57A2r7Wlc1UFcTR9IzrPvuNVO4B8LGqF8qcpsVOhJCA== From ff3d0e67799753e7a97ef43298f383ae491a7598 Mon Sep 17 00:00:00 2001 From: Kamil Wolny Date: Mon, 1 Aug 2022 22:51:25 +0100 Subject: [PATCH 12/17] feat: renamed react props to include components name + removed redundant default export Signed-off-by: Kamil Wolny --- .../components/GitHubIssues/GitHubIssues.tsx | 7 ++----- .../GitHubIssues/IssueCard/Assignees.tsx | 8 +++----- .../GitHubIssues/IssueCard/CommentsCount.tsx | 6 +++--- .../GitHubIssues/IssueCard/IssueCard.tsx | 8 ++++---- .../GitHubIssues/IssuesList/Filters/Filters.tsx | 17 ++++++++--------- .../GitHubIssues/IssuesList/IssuesList.tsx | 11 +++++++---- 6 files changed, 27 insertions(+), 30 deletions(-) diff --git a/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx b/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx index 1e50ececbf..e873028060 100644 --- a/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx +++ b/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx @@ -28,10 +28,7 @@ import { import { IssueList } from './IssuesList'; import { NoRepositoriesInfo } from './NoRepositoriesInfo'; -export type PluginMode = 'page' | 'card'; - -export type Props = { - mode: PluginMode; +export type GitHubIssuesProps = { itemsPerPage?: number; itemsPerRepo?: number; }; @@ -39,7 +36,7 @@ export type Props = { export const GitHubIssues = ({ itemsPerPage = 10, itemsPerRepo = 40, -}: Props) => { +}: GitHubIssuesProps) => { const [isLoading, setIsLoading] = React.useState(true); const [issuesByRepository, setIssuesByRepository] = diff --git a/plugins/github-issues/src/components/GitHubIssues/IssueCard/Assignees.tsx b/plugins/github-issues/src/components/GitHubIssues/IssueCard/Assignees.tsx index e6abdbb6fe..173c8d9439 100644 --- a/plugins/github-issues/src/components/GitHubIssues/IssueCard/Assignees.tsx +++ b/plugins/github-issues/src/components/GitHubIssues/IssueCard/Assignees.tsx @@ -13,10 +13,10 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import React, { FunctionComponent } from 'react'; +import React from 'react'; import { Typography, Box, Avatar, makeStyles } from '@material-ui/core'; -type Props = { +type AssigneesProps = { name?: string; avatar?: string; }; @@ -32,7 +32,7 @@ const useStyles = makeStyles(theme => ({ }, })); -export const Assignees: FunctionComponent = (props: Props) => { +export const Assignees = (props: AssigneesProps) => { const { name, avatar } = props; const classes = useStyles(); @@ -57,5 +57,3 @@ export const Assignees: FunctionComponent = (props: Props) => { ); }; - -export default Assignees; diff --git a/plugins/github-issues/src/components/GitHubIssues/IssueCard/CommentsCount.tsx b/plugins/github-issues/src/components/GitHubIssues/IssueCard/CommentsCount.tsx index d3e7f355e0..80a365cbbb 100644 --- a/plugins/github-issues/src/components/GitHubIssues/IssueCard/CommentsCount.tsx +++ b/plugins/github-issues/src/components/GitHubIssues/IssueCard/CommentsCount.tsx @@ -13,15 +13,15 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import React, { FunctionComponent } from 'react'; +import React from 'react'; import { ChatIcon } from '@backstage/core-components'; import { Box, Badge } from '@material-ui/core'; -type Props = { +type CommentsCountProps = { commentsCount: number; }; -export const CommentsCount: FunctionComponent = (props: Props) => { +export const CommentsCount = (props: CommentsCountProps) => { const { commentsCount } = props; return ( diff --git a/plugins/github-issues/src/components/GitHubIssues/IssueCard/IssueCard.tsx b/plugins/github-issues/src/components/GitHubIssues/IssueCard/IssueCard.tsx index 5b0abe79b3..95658fb343 100644 --- a/plugins/github-issues/src/components/GitHubIssues/IssueCard/IssueCard.tsx +++ b/plugins/github-issues/src/components/GitHubIssues/IssueCard/IssueCard.tsx @@ -13,7 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import React, { FunctionComponent } from 'react'; +import React from 'react'; import { DateTime } from 'luxon'; import { @@ -23,12 +23,12 @@ import { CardActionArea, Link, } from '@material-ui/core'; -import Assignees from './Assignees'; +import { Assignees } from './Assignees'; import { CommentsCount } from './CommentsCount'; import Divider from '@material-ui/core/Divider'; -type Props = { +type IssueCardProps = { title: string; createdAt: string; updatedAt?: string; @@ -45,7 +45,7 @@ type Props = { const getElapsedTime = (isoDate: string) => DateTime.fromISO(isoDate).toRelative(); -export const IssueCard: FunctionComponent = (props: Props) => { +export const IssueCard = (props: IssueCardProps) => { const { title, createdAt, diff --git a/plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/Filters.tsx b/plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/Filters.tsx index eab1d8f57b..de071ab5bb 100644 --- a/plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/Filters.tsx +++ b/plugins/github-issues/src/components/GitHubIssues/IssuesList/Filters/Filters.tsx @@ -14,16 +14,11 @@ * limitations under the License. */ import React from 'react'; -import { Select, SelectedItems } from '@backstage/core-components'; +import { Select, SelectedItems, SelectItem } from '@backstage/core-components'; import { makeStyles, Box, Typography } from '@material-ui/core'; -export type FilterItem = { - label: string; - value: string; -}; - -type Props = { - items: Array; +type RepositoryFiltersProps = { + items: Array; totalIssuesInGitHub: number; placeholder: string; onChange: (active: Array) => void; @@ -47,7 +42,11 @@ const checkSelectedItems: ( return onChange(active as Array); }; -export const Filters = ({ items, onChange, placeholder }: Props) => { +export const RepositoryFilters = ({ + items, + onChange, + placeholder, +}: RepositoryFiltersProps) => { const css = useStyles(); return ( diff --git a/plugins/github-issues/src/components/GitHubIssues/IssuesList/IssuesList.tsx b/plugins/github-issues/src/components/GitHubIssues/IssuesList/IssuesList.tsx index 34ccab597d..f279294928 100644 --- a/plugins/github-issues/src/components/GitHubIssues/IssuesList/IssuesList.tsx +++ b/plugins/github-issues/src/components/GitHubIssues/IssuesList/IssuesList.tsx @@ -20,11 +20,11 @@ import { Pagination } from '@material-ui/lab'; import { IssueCard } from '../IssueCard'; import { RepoIssues } from '../../../hooks/useGetIssuesByRepoFromGitHub'; -import { Filters } from './Filters'; +import { RepositoryFilters } from './Filters'; export type PluginMode = 'page' | 'card'; -export type Props = { +export type IssueListProps = { itemsPerPage?: number; issuesByRepository?: Record; }; @@ -37,7 +37,10 @@ const getIssuesCountForFilterLabel = ( issuesAvailable < totalIssues ? '*' : '' }`; -export const IssueList = ({ itemsPerPage = 10, issuesByRepository }: Props) => { +export const IssueList = ({ + itemsPerPage = 10, + issuesByRepository, +}: IssueListProps) => { const [currentPage, setCurrentPage] = React.useState(1); const [activeFilter, setActiveFilter] = React.useState>([]); @@ -108,7 +111,7 @@ export const IssueList = ({ itemsPerPage = 10, issuesByRepository }: Props) => { return ( {issues.length > 0 && ( - Date: Mon, 1 Aug 2022 22:52:42 +0100 Subject: [PATCH 13/17] feat: export the same github component as card and as a page Signed-off-by: Kamil Wolny --- .../GitHubIssuesCard/GitHubIssuesCard.tsx | 24 ------------------- .../src/components/GitHubIssuesCard/index.ts | 16 ------------- .../GitHubIssuesPage/GitHubIssuesPage.tsx | 23 ------------------ .../src/components/GitHubIssuesPage/index.ts | 16 ------------- plugins/github-issues/src/plugin.ts | 5 ++-- 5 files changed, 2 insertions(+), 82 deletions(-) delete mode 100644 plugins/github-issues/src/components/GitHubIssuesCard/GitHubIssuesCard.tsx delete mode 100644 plugins/github-issues/src/components/GitHubIssuesCard/index.ts delete mode 100644 plugins/github-issues/src/components/GitHubIssuesPage/GitHubIssuesPage.tsx delete mode 100644 plugins/github-issues/src/components/GitHubIssuesPage/index.ts diff --git a/plugins/github-issues/src/components/GitHubIssuesCard/GitHubIssuesCard.tsx b/plugins/github-issues/src/components/GitHubIssuesCard/GitHubIssuesCard.tsx deleted file mode 100644 index 2db4cabb21..0000000000 --- a/plugins/github-issues/src/components/GitHubIssuesCard/GitHubIssuesCard.tsx +++ /dev/null @@ -1,24 +0,0 @@ -/* - * Copyright 2022 The Backstage Authors - * - * 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, { FunctionComponent } from 'react'; - -import { GitHubIssues, Props as GitHubIssuesProps } from '../GitHubIssues'; - -type Props = Omit; - -export const GitHubIssuesCard: FunctionComponent = props => { - return ; -}; diff --git a/plugins/github-issues/src/components/GitHubIssuesCard/index.ts b/plugins/github-issues/src/components/GitHubIssuesCard/index.ts deleted file mode 100644 index c300af125c..0000000000 --- a/plugins/github-issues/src/components/GitHubIssuesCard/index.ts +++ /dev/null @@ -1,16 +0,0 @@ -/* - * Copyright 2022 The Backstage Authors - * - * 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. - */ -export * from './GitHubIssuesCard'; diff --git a/plugins/github-issues/src/components/GitHubIssuesPage/GitHubIssuesPage.tsx b/plugins/github-issues/src/components/GitHubIssuesPage/GitHubIssuesPage.tsx deleted file mode 100644 index 0c9bf4d08e..0000000000 --- a/plugins/github-issues/src/components/GitHubIssuesPage/GitHubIssuesPage.tsx +++ /dev/null @@ -1,23 +0,0 @@ -/* - * Copyright 2022 The Backstage Authors - * - * 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, { FunctionComponent } from 'react'; -import { GitHubIssues, Props as GitHubIssuesProps } from '../GitHubIssues'; - -type Props = Omit; - -export const GitHubIssuesPage: FunctionComponent = props => { - return ; -}; diff --git a/plugins/github-issues/src/components/GitHubIssuesPage/index.ts b/plugins/github-issues/src/components/GitHubIssuesPage/index.ts deleted file mode 100644 index 83f7f4eb87..0000000000 --- a/plugins/github-issues/src/components/GitHubIssuesPage/index.ts +++ /dev/null @@ -1,16 +0,0 @@ -/* - * Copyright 2022 The Backstage Authors - * - * 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. - */ -export * from './GitHubIssuesPage'; diff --git a/plugins/github-issues/src/plugin.ts b/plugins/github-issues/src/plugin.ts index c5bf1cdbce..ece3fd09a2 100644 --- a/plugins/github-issues/src/plugin.ts +++ b/plugins/github-issues/src/plugin.ts @@ -34,8 +34,7 @@ export const GitHubIssuesCard = gitHubIssuesPlugin.provide( createComponentExtension({ name: 'GitHubIssuesCard', component: { - lazy: () => - import('./components/GitHubIssuesCard').then(m => m.GitHubIssuesCard), + lazy: () => import('./components/GitHubIssues').then(m => m.GitHubIssues), }, }), ); @@ -45,7 +44,7 @@ export const GitHubIssuesPage = gitHubIssuesPlugin.provide( createRoutableExtension({ name: 'GitHubIssuesPage', component: () => - import('./components/GitHubIssuesPage').then(m => m.GitHubIssuesPage), + import('./components/GitHubIssues').then(m => m.GitHubIssues), mountPoint: rootRouteRef, }), ); From d51e5223d6c06838f7c17282bfc10c42f84e9597 Mon Sep 17 00:00:00 2001 From: Kamil Wolny Date: Tue, 2 Aug 2022 08:57:29 +0100 Subject: [PATCH 14/17] feat: updated api-report.md Signed-off-by: Kamil Wolny --- plugins/github-issues/api-report.md | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/plugins/github-issues/api-report.md b/plugins/github-issues/api-report.md index 5e6f75460d..6679fec610 100644 --- a/plugins/github-issues/api-report.md +++ b/plugins/github-issues/api-report.md @@ -6,20 +6,21 @@ /// import { BackstagePlugin } from '@backstage/core-plugin-api'; -import { FunctionComponent } from 'react'; import { RouteRef } from '@backstage/core-plugin-api'; +// Warning: (ae-forgotten-export) The symbol "GitHubIssuesProps" needs to be exported by the entry point index.d.ts +// // @public (undocumented) -export const GitHubIssuesCard: FunctionComponent<{ - itemsPerPage?: number | undefined; - itemsPerRepo?: number | undefined; -}>; +export const GitHubIssuesCard: ({ + itemsPerPage, + itemsPerRepo, +}: GitHubIssuesProps) => JSX.Element; // @public (undocumented) -export const GitHubIssuesPage: FunctionComponent<{ - itemsPerPage?: number | undefined; - itemsPerRepo?: number | undefined; -}>; +export const GitHubIssuesPage: ({ + itemsPerPage, + itemsPerRepo, +}: GitHubIssuesProps) => JSX.Element; // @public (undocumented) export const gitHubIssuesPlugin: BackstagePlugin< From ffd5e47fb5c6338aa0e6965d687d0028e0baabb5 Mon Sep 17 00:00:00 2001 From: Kamil Wolny Date: Tue, 2 Aug 2022 10:35:51 +0100 Subject: [PATCH 15/17] feat: pr review fixes + changeset Signed-off-by: Kamil Wolny --- .changeset/silver-carpets-grin.md | 5 ++ plugins/github-issues/api-report.md | 8 +- plugins/github-issues/package.json | 4 +- .../components/GitHubIssues/GitHubIssues.tsx | 10 ++- .../src/hooks/useOctokitGraphQL.ts | 2 +- plugins/github-issues/src/index.ts | 2 + yarn.lock | 78 +------------------ 7 files changed, 23 insertions(+), 86 deletions(-) create mode 100644 .changeset/silver-carpets-grin.md diff --git a/.changeset/silver-carpets-grin.md b/.changeset/silver-carpets-grin.md new file mode 100644 index 0000000000..9865393631 --- /dev/null +++ b/.changeset/silver-carpets-grin.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-github-issues': minor +--- + +New plugin for displaying GitHub Issues added diff --git a/plugins/github-issues/api-report.md b/plugins/github-issues/api-report.md index 6679fec610..8c77aaf674 100644 --- a/plugins/github-issues/api-report.md +++ b/plugins/github-issues/api-report.md @@ -8,8 +8,6 @@ import { BackstagePlugin } from '@backstage/core-plugin-api'; import { RouteRef } from '@backstage/core-plugin-api'; -// Warning: (ae-forgotten-export) The symbol "GitHubIssuesProps" needs to be exported by the entry point index.d.ts -// // @public (undocumented) export const GitHubIssuesCard: ({ itemsPerPage, @@ -31,5 +29,11 @@ export const gitHubIssuesPlugin: BackstagePlugin< {} >; +// @public (undocumented) +export type GitHubIssuesProps = { + itemsPerPage?: number; + itemsPerRepo?: number; +}; + // (No @packageDocumentation comment for this package) ``` diff --git a/plugins/github-issues/package.json b/plugins/github-issues/package.json index 861a67ffa2..74f108cd94 100644 --- a/plugins/github-issues/package.json +++ b/plugins/github-issues/package.json @@ -32,9 +32,9 @@ "@material-ui/core": "^4.12.4", "@material-ui/icons": "^4.9.1", "@material-ui/lab": "^4.0.0-alpha.61", - "@octokit/rest": "^18.12.0", "@types/react": "^16.13.1 || ^17.0.0", "luxon": "^2.4.0", + "octokit": "^2.0.4", "react-use": "^17.2.4" }, "peerDependencies": { @@ -52,7 +52,7 @@ "@types/jest": "*", "@types/node": "*", "cross-fetch": "^3.1.5", - "msw": "^0.42.0", + "msw": "^0.44.0", "prettier": "^2.7.1" }, "files": [ diff --git a/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx b/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx index e873028060..5380c8eb22 100644 --- a/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx +++ b/plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx @@ -28,15 +28,17 @@ import { import { IssueList } from './IssuesList'; import { NoRepositoriesInfo } from './NoRepositoriesInfo'; +/** + * @public + */ export type GitHubIssuesProps = { itemsPerPage?: number; itemsPerRepo?: number; }; -export const GitHubIssues = ({ - itemsPerPage = 10, - itemsPerRepo = 40, -}: GitHubIssuesProps) => { +export const GitHubIssues = (props: GitHubIssuesProps) => { + const { itemsPerPage = 10, itemsPerRepo = 40 } = props; + const [isLoading, setIsLoading] = React.useState(true); const [issuesByRepository, setIssuesByRepository] = diff --git a/plugins/github-issues/src/hooks/useOctokitGraphQL.ts b/plugins/github-issues/src/hooks/useOctokitGraphQL.ts index e408360c53..6b783efd6f 100644 --- a/plugins/github-issues/src/hooks/useOctokitGraphQL.ts +++ b/plugins/github-issues/src/hooks/useOctokitGraphQL.ts @@ -13,7 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { Octokit } from '@octokit/rest'; +import { Octokit } from 'octokit'; import { useApi, githubAuthApiRef, diff --git a/plugins/github-issues/src/index.ts b/plugins/github-issues/src/index.ts index 7905d2fba2..5f6c248db7 100644 --- a/plugins/github-issues/src/index.ts +++ b/plugins/github-issues/src/index.ts @@ -18,3 +18,5 @@ export { GitHubIssuesPage, GitHubIssuesCard, } from './plugin'; + +export type { GitHubIssuesProps } from './components/GitHubIssues'; diff --git a/yarn.lock b/yarn.lock index 44409c647b..3b60557a67 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5431,19 +5431,6 @@ before-after-hook "^2.1.0" universal-user-agent "^6.0.0" -"@octokit/core@^3.5.1": - version "3.6.0" - resolved "https://registry.npmjs.org/@octokit/core/-/core-3.6.0.tgz#3376cb9f3008d9b3d110370d90e0a1fcd5fe6085" - integrity sha512-7RKRKuA4xTjMhY+eG3jthb3hlZCsOwg3rztWh75Xc+ShDWOfDDATWbeZpAHBNRpm4Tv9WgBMOy1zEJYXG6NJ7Q== - dependencies: - "@octokit/auth-token" "^2.4.4" - "@octokit/graphql" "^4.5.8" - "@octokit/request" "^5.6.3" - "@octokit/request-error" "^2.0.5" - "@octokit/types" "^6.0.3" - before-after-hook "^2.2.0" - universal-user-agent "^6.0.0" - "@octokit/core@^4.0.0": version "4.0.2" resolved "https://registry.npmjs.org/@octokit/core/-/core-4.0.2.tgz#4eaf9c5fd39913b541c5e31a2b8fdc3cf50480bc" @@ -5560,11 +5547,6 @@ resolved "https://registry.npmjs.org/@octokit/openapi-types/-/openapi-types-11.2.0.tgz#b38d7fc3736d52a1e96b230c1ccd4a58a2f400a6" integrity sha512-PBsVO+15KSlGmiI8QAzaqvsNlZlrDlyAJYcrXBCvVUxCp7VnXjkwPoFHgjEJXx3WF9BAwkA6nfCUA7i9sODzKA== -"@octokit/openapi-types@^12.11.0": - version "12.11.0" - resolved "https://registry.npmjs.org/@octokit/openapi-types/-/openapi-types-12.11.0.tgz#da5638d64f2b919bca89ce6602d059f1b52d3ef0" - integrity sha512-VsXyi8peyRq9PqIz/tpqiL2w3w80OgVMwBHltTml3LmVvXiphgeqmY9mvBw9Wu7e0QWk/fqD37ux8yP5uVekyQ== - "@octokit/openapi-types@^12.4.0": version "12.4.0" resolved "https://registry.npmjs.org/@octokit/openapi-types/-/openapi-types-12.4.0.tgz#fd8bf5db72bd566c5ba2cb76754512a9ebe66e71" @@ -5585,13 +5567,6 @@ resolved "https://registry.npmjs.org/@octokit/plugin-enterprise-rest/-/plugin-enterprise-rest-6.0.1.tgz#e07896739618dab8da7d4077c658003775f95437" integrity sha512-93uGjlhUD+iNg1iWhUENAtJata6w5nE+V4urXOAlIXdco6xNZtUSfYY8dzp3Udy74aqO/B5UZL80x/YMa5PKRw== -"@octokit/plugin-paginate-rest@^2.16.8": - version "2.21.3" - resolved "https://registry.npmjs.org/@octokit/plugin-paginate-rest/-/plugin-paginate-rest-2.21.3.tgz#7f12532797775640dbb8224da577da7dc210c87e" - integrity sha512-aCZTEf0y2h3OLbrgKkrfFdjRL6eSOo8komneVQJnYecAxIej7Bafor2xhuDJOIFau4pk0i/P28/XgtbyPF0ZHw== - dependencies: - "@octokit/types" "^6.40.0" - "@octokit/plugin-paginate-rest@^2.6.2": version "2.7.0" resolved "https://registry.npmjs.org/@octokit/plugin-paginate-rest/-/plugin-paginate-rest-2.7.0.tgz#6bb7b043c246e0654119a6ec4e72a172c9e2c7f3" @@ -5624,14 +5599,6 @@ "@octokit/types" "^6.16.2" deprecation "^2.3.1" -"@octokit/plugin-rest-endpoint-methods@^5.12.0": - version "5.16.2" - resolved "https://registry.npmjs.org/@octokit/plugin-rest-endpoint-methods/-/plugin-rest-endpoint-methods-5.16.2.tgz#7ee8bf586df97dd6868cf68f641354e908c25342" - integrity sha512-8QFz29Fg5jDuTPXVtey05BLm7OB+M8fnvE64RNegzX7U+5NUXcOcnpTIK0YfSHBg8gYd0oxIq3IZTe9SfPZiRw== - dependencies: - "@octokit/types" "^6.39.0" - deprecation "^2.3.1" - "@octokit/plugin-rest-endpoint-methods@^6.0.0": version "6.0.0" resolved "https://registry.npmjs.org/@octokit/plugin-rest-endpoint-methods/-/plugin-rest-endpoint-methods-6.0.0.tgz#e4a55d83ec5a00e6b4d7a780f4ec9009095bff6f" @@ -5708,16 +5675,6 @@ "@octokit/plugin-request-log" "^1.0.2" "@octokit/plugin-rest-endpoint-methods" "5.3.1" -"@octokit/rest@^18.12.0": - version "18.12.0" - resolved "https://registry.npmjs.org/@octokit/rest/-/rest-18.12.0.tgz#f06bc4952fc87130308d810ca9d00e79f6988881" - integrity sha512-gDPiOHlyGavxr72y0guQEhLsemgVjwRePayJ+FcKc2SJqKUbxbkvf5kAZEWA/MKvsfYlQAMVzNJE3ezQcxMJ2Q== - dependencies: - "@octokit/core" "^3.5.1" - "@octokit/plugin-paginate-rest" "^2.16.8" - "@octokit/plugin-request-log" "^1.0.4" - "@octokit/plugin-rest-endpoint-methods" "^5.12.0" - "@octokit/rest@^19.0.3": version "19.0.3" resolved "https://registry.npmjs.org/@octokit/rest/-/rest-19.0.3.tgz#b9a4e8dc8d53e030d611c053153ee6045f080f02" @@ -5763,13 +5720,6 @@ dependencies: "@octokit/openapi-types" "^12.7.0" -"@octokit/types@^6.40.0": - version "6.41.0" - resolved "https://registry.npmjs.org/@octokit/types/-/types-6.41.0.tgz#e58ef78d78596d2fb7df9c6259802464b5f84a04" - integrity sha512-eJ2jbzjdijiL3B4PrSQaSjuF2sPEQPVCPzBvTHJD9Nz+9dw2SGH4K4xeQJ77YfTq5bRQ+bD8wT11JbeDPmxmGg== - dependencies: - "@octokit/openapi-types" "^12.11.0" - "@octokit/webhooks-methods@^3.0.0": version "3.0.0" resolved "https://registry.npmjs.org/@octokit/webhooks-methods/-/webhooks-methods-3.0.0.tgz#4f4443605233f46abc5f85a857ba105095aa1181" @@ -19310,32 +19260,6 @@ msw@^0.39.2: type-fest "^1.2.2" yargs "^17.3.1" -msw@^0.42.0: - version "0.42.3" - resolved "https://registry.npmjs.org/msw/-/msw-0.42.3.tgz#150c475e2cb6d53c67503bd0e3f6251bfd075328" - integrity sha512-zrKBIGCDsNUCZLd3DLSeUtRruZ0riwJgORg9/bSDw3D0PTI8XUGAK3nC0LJA9g0rChGuKaWK/SwObA8wpFrz4g== - dependencies: - "@mswjs/cookies" "^0.2.0" - "@mswjs/interceptors" "^0.16.3" - "@open-draft/until" "^1.0.3" - "@types/cookie" "^0.4.1" - "@types/js-levenshtein" "^1.1.1" - chalk "4.1.1" - chokidar "^3.4.2" - cookie "^0.4.2" - graphql "^16.3.0" - headers-polyfill "^3.0.4" - inquirer "^8.2.0" - is-node-process "^1.0.1" - js-levenshtein "^1.1.6" - node-fetch "^2.6.7" - outvariant "^1.3.0" - path-to-regexp "^6.2.0" - statuses "^2.0.0" - strict-event-emitter "^0.2.0" - type-fest "^1.2.2" - yargs "^17.3.1" - msw@^0.43.0: version "0.43.1" resolved "https://registry.npmjs.org/msw/-/msw-0.43.1.tgz#57cb4af56f07442e8a6d14d76032a0ab41434256" @@ -20090,7 +20014,7 @@ octokit-plugin-create-pull-request@^3.10.0: dependencies: "@octokit/types" "^6.8.2" -octokit@^2.0.0: +octokit@^2.0.0, octokit@^2.0.4: version "2.0.4" resolved "https://registry.npmjs.org/octokit/-/octokit-2.0.4.tgz#cfd3adee6b775d3fa8cd8746590bed36127cc0a0" integrity sha512-9QvgYGzrSTGmr3koSGtbgeMgqYI20QI0Vv8Bk9y6phchk6L2aHFhcrUOIeNUPj1Z+KZnEBd6A/8faNpDFNfVjg== From 0ef08ee6bf4038d49262466cd3477b9bea52981f Mon Sep 17 00:00:00 2001 From: Kamil Wolny Date: Tue, 2 Aug 2022 16:16:17 +0100 Subject: [PATCH 16/17] feat: updated api-reports Signed-off-by: Kamil Wolny --- plugins/github-issues/api-report.md | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/plugins/github-issues/api-report.md b/plugins/github-issues/api-report.md index 8c77aaf674..eb69fc8e8e 100644 --- a/plugins/github-issues/api-report.md +++ b/plugins/github-issues/api-report.md @@ -9,16 +9,10 @@ import { BackstagePlugin } from '@backstage/core-plugin-api'; import { RouteRef } from '@backstage/core-plugin-api'; // @public (undocumented) -export const GitHubIssuesCard: ({ - itemsPerPage, - itemsPerRepo, -}: GitHubIssuesProps) => JSX.Element; +export const GitHubIssuesCard: (props: GitHubIssuesProps) => JSX.Element; // @public (undocumented) -export const GitHubIssuesPage: ({ - itemsPerPage, - itemsPerRepo, -}: GitHubIssuesProps) => JSX.Element; +export const GitHubIssuesPage: (props: GitHubIssuesProps) => JSX.Element; // @public (undocumented) export const gitHubIssuesPlugin: BackstagePlugin< From 44ed5ed6a2c61670a62ecdcaa9c5ad98fe4336d5 Mon Sep 17 00:00:00 2001 From: Kamil Wolny Date: Tue, 2 Aug 2022 16:48:52 +0100 Subject: [PATCH 17/17] fix: move types to dev dependencies Signed-off-by: Kamil Wolny --- plugins/github-issues/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/github-issues/package.json b/plugins/github-issues/package.json index 74f108cd94..5435f81324 100644 --- a/plugins/github-issues/package.json +++ b/plugins/github-issues/package.json @@ -32,7 +32,6 @@ "@material-ui/core": "^4.12.4", "@material-ui/icons": "^4.9.1", "@material-ui/lab": "^4.0.0-alpha.61", - "@types/react": "^16.13.1 || ^17.0.0", "luxon": "^2.4.0", "octokit": "^2.0.4", "react-use": "^17.2.4" @@ -51,6 +50,7 @@ "@testing-library/user-event": "^14.0.0", "@types/jest": "*", "@types/node": "*", + "@types/react": "^16.13.1 || ^17.0.0", "cross-fetch": "^3.1.5", "msw": "^0.44.0", "prettier": "^2.7.1"