Jfeat: github comment block (#636)

core/domain/contribution/models/contribution-activity-model.ts

@@ -1,12 +1,12 @@
 import { ContributionItemDto } from "@/core/domain/contribution/dto/contribution-item-dto";
-import { GithubUser, GithubUserInterface } from "@/core/domain/github/models/github-user-model";
+import { Applicant, ApplicantInterface } from "@/core/domain/user/models/applicant-model";
 import { components } from "@/core/infrastructure/marketplace-api-client-adapter/__generated/api";
 
 export type ContributionActivityResponse = components["schemas"]["ContributionActivityPageItemResponse"];
 
 export interface ContributionActivityInterface
   extends Omit<ContributionActivityResponse, "applicants" | "contributors" | "assignees" | "uuid"> {
-  applicants: GithubUserInterface[];
+  applicants: ApplicantInterface[];
   contributors: NonNullable<ContributionActivityResponse["contributors"]>;
   isNotAssigned(): boolean;
   isInProgress(): boolean;
@@ -23,7 +23,7 @@ export interface ContributionActivityInterface
 
 export class ContributionActivity implements ContributionActivityInterface {
   activityStatus!: ContributionActivityResponse["activityStatus"];
-  applicants!: GithubUserInterface[];
+  applicants!: ApplicantInterface[];
   completedAt!: ContributionActivityResponse["completedAt"];
   contributors!: NonNullable<ContributionActivityResponse["contributors"]>;
   createdAt!: ContributionActivityResponse["createdAt"];
@@ -46,7 +46,7 @@ export class ContributionActivity implements ContributionActivityInterface {
 
   constructor(props: ContributionActivityResponse) {
     Object.assign(this, props);
-    this.applicants = (props.applicants ?? []).map(applicant => new GithubUser(applicant));
+    this.applicants = (props.applicants ?? []).map(applicant => new Applicant(applicant));
     this.contributors = props.contributors ?? [];
     this.id = props.uuid;
   }

core/domain/user/models/applicant-model.ts

@@ -0,0 +1,17 @@
+import { components } from "@/core/infrastructure/marketplace-api-client-adapter/__generated/api";
+
+export type ApplicantResponse = components["schemas"]["ApplicantResponse"];
+
+export interface ApplicantInterface extends ApplicantResponse {}
+
+export class Applicant implements ApplicantInterface {
+  applicationId!: ApplicantResponse["applicationId"];
+  avatarUrl!: ApplicantResponse["avatarUrl"];
+  githubUserId!: ApplicantResponse["githubUserId"];
+  login!: ApplicantResponse["login"];
+  since!: ApplicantResponse["since"];
+
+  constructor(props: ApplicantResponse) {
+    Object.assign(this, props);
+  }
+}

shared/panels/contribution-sidepanel/_features/description/description.tsx

@@ -12,7 +12,7 @@ export function Description({ description }: DescriptionProps) {
 
   return (
     <Paper size={"lg"} border={"primary"} classNames={{ base: "flex flex-col gap-lg" }}>
-      <Typo size={"sm"} weight={"medium"} translate={{ token: "panels:projectDetail.description.title" }} />
+      <Typo size={"sm"} weight={"medium"} translate={{ token: "common:description" }} />
 
       <Typo as={"p"} size={"xs"} color={"secondary"}>
         <Emoji>{description}</Emoji>

shared/panels/contribution-sidepanel/_features/github-comment/github-comment.tsx

@@ -0,0 +1,22 @@
+import dynamic from "next/dynamic";
+
+import { Paper } from "@/design-system/atoms/paper";
+import { Typo } from "@/design-system/atoms/typo";
+
+import { GithubCommentProps } from "@/shared/panels/contribution-sidepanel/_features/github-comment/github-comment.types";
+
+const Emoji = dynamic(() => import("react-emoji-render"));
+
+export function GithubComment({ comment }: GithubCommentProps) {
+  if (!comment) return null;
+
+  return (
+    <Paper size={"lg"} border={"primary"} classNames={{ base: "flex flex-col gap-lg" }}>
+      <Typo size={"sm"} weight={"medium"} translate={{ token: "panels:contribution.githubComment.title" }} />
+
+      <Typo as={"p"} size={"xs"} color={"secondary"}>
+        <Emoji>{comment}</Emoji>
+      </Typo>
+    </Paper>
+  );
+}

shared/panels/contribution-sidepanel/_features/github-comment/github-comment.types.ts

@@ -0,0 +1,3 @@
+export interface GithubCommentProps {
+  comment?: string;
+}

shared/panels/contribution-sidepanel/contributions-sidepanel.en.json

@@ -78,11 +78,13 @@
     }
   },
   "rewardedCard": {
-    "title": "Rewarded",
-    "status": "Rewarded"
+    "title": "Rewarded"
   },
   "userCard": {
     "assignedBy": "Assigned by",
     "mergedBy": "Merged by"
+  },
+  "githubComment": {
+    "title": "Github comment"
   }
 }

shared/panels/contribution-sidepanel/contributions-sidepanel.hooks.tsx

@@ -1,3 +1,4 @@
+import { ApplicationReactQueryAdapter } from "@/core/application/react-query-adapter/application";
 import { bootstrap } from "@/core/bootstrap";
 import { ContributionActivityInterface } from "@/core/domain/contribution/models/contribution-activity-model";
 import { ContributionAs, ContributionAsUnion } from "@/core/domain/contribution/models/contribution.types";
@@ -7,6 +8,7 @@ import { useAuthUser } from "@/shared/hooks/auth/use-auth-user";
 import { AssignContributors } from "@/shared/panels/contribution-sidepanel/_features/assign-contributors/assign-contributors";
 import { Assignees } from "@/shared/panels/contribution-sidepanel/_features/assignees/assignees";
 import { Description } from "@/shared/panels/contribution-sidepanel/_features/description/description";
+import { GithubComment } from "@/shared/panels/contribution-sidepanel/_features/github-comment/github-comment";
 import { IssueAppliedKpi } from "@/shared/panels/contribution-sidepanel/_features/issue-applied-kpi/issue-applied-kpi";
 import { IssueOverview } from "@/shared/panels/contribution-sidepanel/_features/issue-overview/issue-overview";
 import { LinkedIssues } from "@/shared/panels/contribution-sidepanel/_features/linked-issues/linked-issues";
@@ -96,6 +98,16 @@ function useContributionBlocksAsContributor({ contribution }: UseContributionBlo
   const recipientIds = githubUserId ? [githubUserId] : undefined;
   const dateKernelPort = bootstrap.getDateKernelPort();
 
+  const contributorApplicationId =
+    contribution?.applicants.find(applicant => applicant.githubUserId === githubUserId)?.applicationId ?? "";
+
+  const { data: application } = ApplicationReactQueryAdapter.client.useGetApplicationById({
+    pathParams: { applicationId: contributorApplicationId },
+    options: {
+      enabled: !!contributorApplicationId,
+    },
+  });
+
   if (!contribution) {
     return null;
   }
@@ -112,7 +124,7 @@ function useContributionBlocksAsContributor({ contribution }: UseContributionBlo
           openSince={parseInt(dateKernelPort.formatDistanceToNow(new Date(contribution.createdAt), { unit: "day" }))}
         />
         <Description description={contribution.githubBody} />
-        {/*// GithubComment*/}
+        <GithubComment comment={application?.githubComment} />
       </>
     );
   }

shared/panels/project-sidepanel/_components/project-description/project-description.tsx

@@ -8,7 +8,7 @@ import { ProjectDescriptionProps } from "./project-description.types";
 export function ProjectDescription({ description, moreInfo }: ProjectDescriptionProps) {
   return (
     <Paper size={"lg"} border={"primary"} classNames={{ base: "flex flex-col gap-lg" }}>
-      <Typo size={"sm"} weight={"medium"} translate={{ token: "panels:projectDetail.description.title" }} />
+      <Typo size={"sm"} weight={"medium"} translate={{ token: "common:description" }} />
 
       <Typo as={"p"} size={"xs"} color={"secondary"}>
         {description}

shared/panels/project-sidepanel/project-sidepanel.en.json

@@ -4,9 +4,6 @@
   "information": {
     "title": "Information"
   },
-  "description": {
-    "title": "Description"
-  },
   "languages": {
     "title": "Languages"
   },

shared/translation/translations/common/common.en.json

@@ -85,5 +85,6 @@
   "form": {
     "reset": "Reset",
     "save": "Save"
-  }
+  },
+  "description": "Description"
 }