feat: Added initial logic to PullRequestsPage for displaying pull request groups.

Signed-off-by: Marley Powell <Marley.Powell@exclaimer.com>
2021-11-11 13:41:55 +00:00
parent 367cd7a2ac
commit 051561b635
1 changed files with 72 additions and 3 deletions
@@ -14,15 +14,84 @@
 * limitations under the License.
 */

-import { Content, Header, Page } from '@backstage/core-components';
+import {
+  Content,
+  Header,
+  Page,
+  ResponseErrorPanel,
+} from '@backstage/core-components';
+import { PullRequestGroup, PullRequestGroupConfig } from './lib/types';
+import React, { useEffect, useState } from 'react';
+import { getCreatedByUserFilter, getPullRequestGroups } from './lib/utils';
+import { useDashboardPullRequests, useUserEmail } from '../../hooks';

-import React from 'react';
+import { DashboardPullRequest } from '@backstage/plugin-azure-devops-common';
+import { PullRequestGrid } from './lib/PullRequestGrid';
+
+/**
+ * @deprecated TEMPORARY - This will be configurable in a follow up PR.
+ */
+const PROJECT_NAME = 'projectName';
+
+function usePullRequestGroupConfigs(
+  userEmail: string | undefined,
+): PullRequestGroupConfig[] {
+  const [pullRequestGroupConfigs, setPullRequestGroupConfigs] = useState<
+    PullRequestGroupConfig[]
+  >([]);
+
+  useEffect(() => {
+    const prGroupConfigs: PullRequestGroupConfig[] = [
+      { title: 'Created by me', filter: getCreatedByUserFilter(userEmail) },
+      { title: 'Other PRs', filter: _ => true, simplified: false },
+    ];
+
+    setPullRequestGroupConfigs(prGroupConfigs);
+  }, [userEmail]);
+
+  return pullRequestGroupConfigs;
+}
+
+function usePullRequestGroups(
+  pullRequests: DashboardPullRequest[] | undefined,
+  pullRequestGroupConfigs: PullRequestGroupConfig[],
+): PullRequestGroup[] {
+  const [pullRequestGroups, setPullRequestGroups] = useState<
+    PullRequestGroup[]
+  >([]);
+
+  useEffect(() => {
+    if (pullRequests) {
+      const groups = getPullRequestGroups(
+        pullRequests,
+        pullRequestGroupConfigs,
+      );
+      setPullRequestGroups(groups);
+    }
+  }, [pullRequests, pullRequestGroupConfigs]);
+
+  return pullRequestGroups;
+}

 export const PullRequestsPage = () => {
+  const { pullRequests, error } = useDashboardPullRequests(PROJECT_NAME);
+  const userEmail = useUserEmail();
+  const pullRequestGroupConfigs = usePullRequestGroupConfigs(userEmail);
+  const pullRequestGroups = usePullRequestGroups(
+    pullRequests,
+    pullRequestGroupConfigs,
+  );
+
+  const pullRequestsContent = error ? (
+    <ResponseErrorPanel error={error} />
+  ) : (
+    <PullRequestGrid pullRequestGroups={pullRequestGroups} />
+  );
+
  return (
    <Page themeId="tool">
      <Header title="Azure Pull Requests" />
-      <Content />
+      <Content>{pullRequestsContent}</Content>
    </Page>
  );
 };