when no limit prop default to orginal functionality

Signed-off-by: Jake Crews <jake.crews@daveramsey.com>

.changeset/sweet-fishes-taste.md

@@ -2,4 +2,4 @@
 '@backstage/plugin-github-pull-requests-board': patch
 ---
 
-Add optional `defaultLimit` prop to `EntityTeamPullRequestsCard` and `EntityTeamPullRequestsContent` to limit the number of PRs shown per repository. Excluding this prop will result in showing all PRs for each repository.
+Add optional `pullRequestLimit` prop to `EntityTeamPullRequestsCard` and `EntityTeamPullRequestsContent` to limit the number of PRs shown per repository. Excluding this prop will default the number of pull requests shown to 10 per repository (the existing functionality).

plugins/github-pull-requests-board/api-report.md

@@ -13,7 +13,7 @@ export const EntityTeamPullRequestsCard: (
 // @public (undocumented)
 export interface EntityTeamPullRequestsCardProps {
   // (undocumented)
-  defaultLimit?: number;
+  pullRequestLimit?: number;
 }
 
 // @public (undocumented)
@@ -24,7 +24,7 @@ export const EntityTeamPullRequestsContent: (
 // @public (undocumented)
 export interface EntityTeamPullRequestsContentProps {
   // (undocumented)
-  defaultLimit?: number;
+  pullRequestLimit?: number;
 }
 
 // (No @packageDocumentation comment for this package)

plugins/github-pull-requests-board/src/api/useGetPullRequestsFromRepository.ts

@@ -18,6 +18,9 @@ import React from 'react';
 import { GraphQlPullRequests, PullRequestsNumber } from '../utils/types';
 import { useOctokitGraphQl } from './useOctokitGraphQl';
 
+const PULL_REQUEST_LIMIT = 10;
+const GITHUB_GRAPHQL_MAX_ITEMS = 100;
+
 export const useGetPullRequestsFromRepository = () => {
   const graphql =
     useOctokitGraphQl<GraphQlPullRequests<PullRequestsNumber[]>>();
@@ -25,23 +28,16 @@ export const useGetPullRequestsFromRepository = () => {
   const fn = React.useRef(
     async (
       repo: string,
-      defaultLimit?: number,
+      pullRequestLimit?: number,
     ): Promise<PullRequestsNumber[]> => {
+      const limit = pullRequestLimit ?? PULL_REQUEST_LIMIT;
       const [organisation, repositoryName] = repo.split('/');
 
-      if (defaultLimit) {
-        return getLimitedPullRequestEdges(
-          graphql,
-          repositoryName,
-          organisation,
-          defaultLimit,
-        );
-      }
-
-      return await getAllPullRequestEdges(
+      return await getPullRequestEdges(
         graphql,
         repositoryName,
         organisation,
+        limit,
       );
     },
   );
@@ -49,46 +45,14 @@ export const useGetPullRequestsFromRepository = () => {
   return fn.current;
 };
 
-async function getLimitedPullRequestEdges(
-  graphql: (
-    path: string,
-    options?: any,
-  ) => Promise<GraphQlPullRequests<PullRequestsNumber[]>>,
-  repositoryName: string,
-  organisation: string,
-  defaultLimit: number,
-): Promise<PullRequestsNumber[]> {
-  const result = await graphql(
-    `
-      query ($name: String!, $owner: String!, $defaultLimit: Int) {
-        repository(name: $name, owner: $owner) {
-          pullRequests(states: OPEN, first: $defaultLimit) {
-            edges {
-              node {
-                number
-              }
-            }
-          }
-        }
-      }
-    `,
-    {
-      name: repositoryName,
-      owner: organisation,
-      defaultLimit: defaultLimit,
-    },
-  );
-
-  return result.repository.pullRequests.edges;
-}
-
-async function getAllPullRequestEdges(
+async function getPullRequestEdges(
   graphql: (
     path: string,
     options?: any,
   ) => Promise<GraphQlPullRequests<PullRequestsNumber[]>>,
   repositoryName: string,
   organisation: string,
+  pullRequestLimit: number,
 ): Promise<PullRequestsNumber[]> {
   const pullRequestEdges: PullRequestsNumber[] = [];
   let result: GraphQlPullRequests<PullRequestsNumber[]> | undefined = undefined;
@@ -96,9 +60,14 @@ async function getAllPullRequestEdges(
   do {
     result = await graphql(
       `
-        query ($name: String!, $owner: String!, $endCursor: String) {
+        query (
+          $name: String!
+          $owner: String!
+          $first: Int
+          $endCursor: String
+        ) {
           repository(name: $name, owner: $owner) {
-            pullRequests(states: OPEN, first: 100, after: $endCursor) {
+            pullRequests(states: OPEN, first: $first, after: $endCursor) {
               edges {
                 node {
                   number
@@ -115,6 +84,10 @@ async function getAllPullRequestEdges(
       {
         name: repositoryName,
         owner: organisation,
+        first:
+          pullRequestLimit > GITHUB_GRAPHQL_MAX_ITEMS
+            ? GITHUB_GRAPHQL_MAX_ITEMS
+            : pullRequestLimit,
         endCursor: result
           ? result.repository.pullRequests.pageInfo.endCursor
           : undefined,
@@ -122,6 +95,8 @@ async function getAllPullRequestEdges(
     );
 
     pullRequestEdges.push(...result.repository.pullRequests.edges);
+
+    if (pullRequestEdges.length >= pullRequestLimit) return pullRequestEdges;
   } while (result.repository.pullRequests.pageInfo.hasNextPage);
 
   return pullRequestEdges;

plugins/github-pull-requests-board/src/components/EntityTeamPullRequestsCard/EntityTeamPullRequestsCard.tsx

@@ -30,16 +30,16 @@ import { useUserRepositories } from '../../hooks/useUserRepositories';
 
 /** @public */
 export interface EntityTeamPullRequestsCardProps {
-  defaultLimit?: number;
+  pullRequestLimit?: number;
 }
 
 const EntityTeamPullRequestsCard = (props: EntityTeamPullRequestsCardProps) => {
-  const { defaultLimit = 100 } = props;
+  const { pullRequestLimit } = props;
   const [infoCardFormat, setInfoCardFormat] = useState<PRCardFormating[]>([]);
   const { repositories } = useUserRepositories();
   const { loading, pullRequests, refreshPullRequests } = usePullRequestsByTeam(
     repositories,
-    defaultLimit,
+    pullRequestLimit,
   );
 
   const header = (

plugins/github-pull-requests-board/src/components/EntityTeamPullRequestsContent/EntityTeamPullRequestsContent.tsx

@@ -28,18 +28,18 @@ import { useUserRepositories } from '../../hooks/useUserRepositories';
 
 /** @public */
 export interface EntityTeamPullRequestsContentProps {
-  defaultLimit?: number;
+  pullRequestLimit?: number;
 }
 
 const EntityTeamPullRequestsContent = (
   props: EntityTeamPullRequestsContentProps,
 ) => {
-  const { defaultLimit } = props;
+  const { pullRequestLimit } = props;
   const [infoCardFormat, setInfoCardFormat] = useState<PRCardFormating[]>([]);
   const { repositories } = useUserRepositories();
   const { loading, pullRequests, refreshPullRequests } = usePullRequestsByTeam(
     repositories,
-    defaultLimit,
+    pullRequestLimit,
   );
 
   const header = (

plugins/github-pull-requests-board/src/hooks/usePullRequestsByTeam.tsx

@@ -21,7 +21,7 @@ import { useGetPullRequestDetails } from '../api/useGetPullRequestDetails';
 
 export function usePullRequestsByTeam(
   repositories: string[],
-  defaultLimit?: number,
+  pullRequestLimit?: number,
 ) {
   const [pullRequests, setPullRequests] = useState<PullRequestsColumn[]>([]);
   const [loading, setLoading] = useState<boolean>(true);
@@ -32,7 +32,7 @@ export function usePullRequestsByTeam(
     async (repository: string): Promise<PullRequests> => {
       const pullRequestsNumbers = await getPullRequests(
         repository,
-        defaultLimit,
+        pullRequestLimit,
       );
 
       const pullRequestsWithDetails = await Promise.all(
@@ -43,7 +43,7 @@ export function usePullRequestsByTeam(
 
       return pullRequestsWithDetails;
     },
-    [getPullRequests, getPullRequestDetails, defaultLimit],
+    [getPullRequests, getPullRequestDetails, pullRequestLimit],
   );
 
   const getPRsFromTeam = useCallback(