add filterBy and orderBy props to the github-issues plugin

Signed-off-by: Paul Cowan <paul.cowan@cutting.scot>

plugins/github-issues/src/api/gitHubIssuesApi.ts

@@ -22,6 +22,7 @@ import {
 } from '@backstage/core-plugin-api';
 import { readGitHubIntegrationConfigs } from '@backstage/integration';
 import { ForwardedError } from '@backstage/errors';
+import { IssuesByRepoOptions, IssuesFilters } from '../types';
 
 /** @internal */
 export type Assignee = {
@@ -103,6 +104,13 @@ export const gitHubIssuesApi = (
   const fetchIssuesByRepoFromGitHub = async (
     repos: Array<string>,
     itemsPerRepo: number,
+    {
+      filterBy,
+      orderBy = {
+        field: 'UPDATED_AT',
+        direction: 'DESC',
+      },
+    }: IssuesByRepoOptions = {},
   ): Promise<IssuesByRepo> => {
     const graphql = await getOctokit();
     const safeNames: Array<string> = [];
@@ -126,10 +134,17 @@ export const gitHubIssuesApi = (
       };
     });
 
+    // eslint-disable-next-line no-console
+    console.log(`
+    ---------------------------------------------------
+    ${createIssueByRepoQuery(repositories, itemsPerRepo, { filterBy })}
+    ---------------------------------------------------
+    `);
+
     let issuesByRepo: IssuesByRepo = {};
     try {
       issuesByRepo = await graphql(
-        createIssueByRepoQuery(repositories, itemsPerRepo),
+        createIssueByRepoQuery(repositories, itemsPerRepo, { filterBy }),
       );
     } catch (e) {
       if (e.data) {
@@ -151,6 +166,34 @@ export const gitHubIssuesApi = (
   return { fetchIssuesByRepoFromGitHub };
 };
 
+function formatFilterValue(value: IssuesFilters[keyof IssuesFilters]): string {
+  if (Array.isArray(value)) {
+    return `[ ${value.map(formatFilterValue).join(', ')}`;
+  }
+
+  return typeof value === 'string' ? `\"${value}\"` : `${value}`;
+}
+
+function createFilterByClause(filterBy?: IssuesFilters): string {
+  if (typeof filterBy === 'undefined') {
+    return '';
+  }
+
+  return Object.entries(filterBy)
+    .flatMap(([field, value]) => {
+      if (typeof value === 'undefined') {
+        return [];
+      }
+
+      if (field === 'states') {
+        return [`${field}: ${value.join(', ')}`];
+      }
+
+      return [`${field}: ${formatFilterValue}`];
+    })
+    .join(',  ');
+}
+
 function createIssueByRepoQuery(
   repositories: Array<{
     safeName: string;
@@ -158,13 +201,15 @@ function createIssueByRepoQuery(
     owner: string;
   }>,
   itemsPerRepo: number,
+  { filterBy, orderBy }: IssuesByRepoOptions,
 ): string {
   const fragment = `
     fragment issues on Repository {
       issues(
         states: OPEN
         first: ${itemsPerRepo}
-        orderBy: { field: UPDATED_AT, direction: DESC }
+        filterBy: { ${createFilterByClause(filterBy)} }
+        orderBy: { field: ${orderBy?.field}, direction: ${orderBy?.direction} }
       ) {
         totalCount
         edges {

plugins/github-issues/src/components/GitHubIssues/GitHubIssues.tsx

@@ -24,6 +24,7 @@ import { useGetIssuesByRepoFromGitHub } from '../../hooks/useGetIssuesByRepoFrom
 
 import { IssuesList } from './IssuesList';
 import { NoRepositoriesInfo } from './NoRepositoriesInfo';
+import { IssuesByRepoOptions } from '../../types';
 
 /**
  * @public
@@ -31,17 +32,18 @@ import { NoRepositoriesInfo } from './NoRepositoriesInfo';
 export type GitHubIssuesProps = {
   itemsPerPage?: number;
   itemsPerRepo?: number;
+  queryOptions?: IssuesByRepoOptions;
 };
 
 export const GitHubIssues = (props: GitHubIssuesProps) => {
-  const { itemsPerPage = 10, itemsPerRepo = 40 } = props;
+  const { itemsPerPage = 10, itemsPerRepo = 40, queryOptions } = props;
 
   const { repositories } = useEntityGitHubRepositories();
   const {
     isLoading,
     gitHubIssuesByRepo: issuesByRepository,
     retry,
-  } = useGetIssuesByRepoFromGitHub(repositories, itemsPerRepo);
+  } = useGetIssuesByRepoFromGitHub(repositories, itemsPerRepo, queryOptions);
 
   if (!repositories.length) {
     return <NoRepositoriesInfo />;

plugins/github-issues/src/hooks/useGetIssuesByRepoFromGitHub.ts

@@ -17,10 +17,12 @@ import { useApi } from '@backstage/core-plugin-api';
 
 import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { gitHubIssuesApiRef } from '../api';
+import { IssuesByRepoOptions } from '../types';
 
 export const useGetIssuesByRepoFromGitHub = (
   repos: Array<string>,
   itemsPerRepo: number,
+  options?: IssuesByRepoOptions,
 ) => {
   const gitHubIssuesApi = useApi(gitHubIssuesApiRef);
 
@@ -33,6 +35,7 @@ export const useGetIssuesByRepoFromGitHub = (
       return await gitHubIssuesApi.fetchIssuesByRepoFromGitHub(
         repos,
         itemsPerRepo,
+        options,
       );
     }
 

plugins/github-issues/src/types.ts

@@ -0,0 +1,34 @@
+/*
+ * 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.
+ */
+type IssueState = 'OPEN' | 'CLOSED';
+
+/** @internal */
+export interface IssuesFilters {
+  assignee?: string;
+  createdBy?: string;
+  labels?: string[];
+  mentioned?: string;
+  milestone?: string;
+  states?: IssueState[];
+}
+
+export interface IssuesByRepoOptions {
+  filterBy?: IssuesFilters;
+  orderBy?: {
+    field: 'CREATED_AT' | 'UPDATED_AT' | 'COMMENTS';
+    direction: 'ASC' | 'DESC';
+  };
+}