Audit app for any architectural improvements

cra-rxjs-styled-components/src/components/pull-request/PRTabHeader/PRTabHeader.tsx

@@ -9,8 +9,8 @@ import PullRequestIcon from '../../icons/PullRequestIcon';
 
 interface Props {
   toggleTab: any;
-  openPRCount: number;
-  closedPRCount: number;
+  openPRCount?: number;
+  closedPRCount?: number;
 }
 
 export default function PullRequestTabHeader(props: Props) {

cra-rxjs-styled-components/src/components/pull-request/PullRequest/PullRequest.data.tsx

@@ -7,60 +7,80 @@ import {
   tap,
   zip,
 } from 'rxjs';
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 
 import type { PRTabValues } from '../types';
 import { PULLS_URL } from '../../../constants/url.constants';
-import type { PullRequest } from './PullRequest.type';
+import type { PullRequests } from './PullRequest.type';
 import PullRequestView from './PullRequest.view';
 import { fromFetchWithAuth } from '../../../hooks/auth/from-fetch-with-auth';
 import { useParams } from 'react-router-dom';
 
 export default function PullRequestCtrl() {
   const [activeTab, setActiveTab] = useState<PRTabValues>('open');
-  const [pullRequests, setPullRequests] = useState<PullRequest[]>([]);
+  const [openPullRequests, setOpenPullRequests] = useState<PullRequests>();
+  const [closedPullRequests, setClosedPullRequests] = useState<PullRequests>();
   const { username, repo } = useParams();
 
   useEffect(() => {
     if (username && repo) {
-      const subscription: Subscription = fromFetchWithAuth<PullRequest[]>(
-        PULLS_URL(username, repo),
+      const openPRsSubscription: Subscription = fromFetchWithAuth<PullRequests>(
+        PULLS_URL(username, repo, 'open'),
         {
           selector: (response: Response) => {
             return response.json();
           },
         }
       )
         .pipe(
+          tap((val) => console.log(val)),
+          filter((pulls) => !!pulls.items.length),
+          switchMap((pulls: PullRequests) => {
+            const requests = pulls.map(createCommentCountRequest);
+            return zip(...requests).pipe(
+              map(mergePullRequestsWithCommentCount(pulls))
+            );
+          }),
+          tap(setOpenPullRequests)
+        )
+        .subscribe();
+
+      const closedPRsSubscription: Subscription = fromFetchWithAuth<
+        PullRequest[]
+      >(PULLS_URL(username, repo, 'closed'), {
+        selector: (response: Response) => {
+          return response.json();
+        },
+      })
+        .pipe(
+          tap((val) => console.log(val)),
           filter((pulls) => !!pulls.length),
           switchMap((pulls: PullRequest[]) => {
             const requests = pulls.map(createCommentCountRequest);
             return zip(...requests).pipe(
               map(mergePullRequestsWithCommentCount(pulls))
             );
           }),
-          tap(setPullRequests)
+          tap(setClosedPullRequests)
         )
         .subscribe();
 
       return () => {
-        subscription.unsubscribe();
+        openPRsSubscription.unsubscribe();
+        closedPRsSubscription.unsubscribe();
       };
     }
   }, [username, repo]);
 
-  const OPEN_PRS: PullRequest[] = pullRequests?.filter(
-    (pr) => pr.state === 'open'
-  );
-  const CLOSED_PRS: PullRequest[] = pullRequests?.filter(
-    (pr) => pr.state === 'closed'
-  );
-
   return (
     <PullRequestView
-      pullRequests={activeTab === 'open' ? OPEN_PRS : CLOSED_PRS}
-      openPRCount={OPEN_PRS?.length}
-      closedPRCount={CLOSED_PRS?.length}
+      pullRequests={
+        activeTab === 'open'
+          ? openPullRequests?.items
+          : closedPullRequests?.items
+      }
+      openPRCount={openPullRequests?.total_count}
+      closedPRCount={closedPullRequests?.total_count}
       changeActiveTab={setActiveTab}
     />
   );

cra-rxjs-styled-components/src/components/pull-request/PullRequest/PullRequest.type.ts

@@ -1,3 +1,9 @@
+export type PullRequests = {
+  total_count: number;
+  incomplete_results: boolean;
+  items: PullRequest[];
+};
+
 export type PullRequest = {
   title: string;
   number: string;

cra-rxjs-styled-components/src/components/pull-request/PullRequest/PullRequest.view.tsx

@@ -7,10 +7,10 @@ import PullRequestTabHeader from '../PRTabHeader';
 import { getPullsState } from '../../../helpers/getPullsState';
 
 type PullRequestProps = {
-  pullRequests: PullRequest[];
+  pullRequests?: PullRequest[];
   changeActiveTab: (value: PRTabValues) => void;
-  openPRCount: number;
-  closedPRCount: number;
+  openPRCount?: number;
+  closedPRCount?: number;
 };
 
 export default function PullRequestView({
@@ -27,7 +27,7 @@ export default function PullRequestView({
           closedPRCount={closedPRCount}
           toggleTab={changeActiveTab}
         />
-        {pullRequests.map((pr, index) => (
+        {pullRequests?.map((pr, index) => (
           <PullRequestCard
             title={pr.title}
             number={pr.number}

cra-rxjs-styled-components/src/constants/url.constants.ts

@@ -32,8 +32,12 @@ export const USER_REPO_LIST = (user: string, page: string = '1') =>
 export const GISTS_URL = (user: string) =>
   `${GITHUB_URL_BASE}/users/${user}/gists?per_page=10`;
 
-export const PULLS_URL = (owner: string, repoName: string) =>
-  `${GITHUB_URL_BASE}/repos/${owner}/${repoName}/pulls?state=all`;
+export const PULLS_URL = (
+  owner: string,
+  repoName: string,
+  state: 'open' | 'closed'
+) =>
+  `${GITHUB_URL_BASE}/search/issues?q=test+is:pr+repo:${owner}/${repoName}+is:${state}`;
 
 export const ISSUE_PR_SEARCH = (
   user: string,