fix: show contributors name and company in table (#2012)

open-sauced · Oct 26, 2023 · 79776a3 · 79776a3
1 parent 8a8b209
commit 79776a3
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 11 deletions.
diff --git a/components/atoms/Avatar/avatar-hover-card.tsx b/components/atoms/Avatar/avatar-hover-card.tsx
@@ -19,8 +19,8 @@ const AvatarHoverCard = ({ contributor, repositories, size = "large" }: AvatarPr
 
   switch (size) {
     case "small":
-      width = 35;
-      height = 35;
+      width = 45;
+      height = 45;
       break;
     default:
       break;

diff --git a/components/molecules/ContributorListTableRow/contributor-list-table-row.tsx b/components/molecules/ContributorListTableRow/contributor-list-table-row.tsx
@@ -11,7 +11,6 @@ import useContributorPullRequests from "lib/hooks/api/useContributorPullRequests
 import useRepoList from "lib/hooks/useRepoList";
 import { useFetchUser } from "lib/hooks/useFetchUser";
 import Checkbox from "components/atoms/Checkbox/checkbox";
-import AvatarHoverCard from "components/atoms/Avatar/avatar-hover-card";
 import { getActivity } from "../RepoRow/repo-row";
 import DevProfile from "../DevProfile/dev-profile";
 
@@ -156,7 +155,13 @@ const ContributorListTableRow = ({
         )}
 
         {/* Column: Contributors */}
-        <AvatarHoverCard contributor={contributor.username} repositories={[]} size="small" />
+        <div className={clsx("flex-1 lg:min-w-[12.5rem] overflow-hidden")}>
+          <DevProfile
+            company={user?.company || getLastContributedRepo(data)}
+            username={login}
+            hasBorder={!contributor.author_login}
+          />
+        </div>
         {/* Column: Act */}
         <div className={clsx("flex-1 flex lg:max-w-[6.25rem] w-fit justify-center")}>
           {contributor.author_login ? getActivity(totalPrs, false) : "-"}

diff --git a/components/molecules/DevProfile/dev-profile.tsx b/components/molecules/DevProfile/dev-profile.tsx
@@ -5,6 +5,7 @@ import Avatar from "components/atoms/Avatar/avatar";
 
 import { getAvatarByUsername } from "lib/utils/github";
 import { truncateString } from "lib/utils/truncate-string";
+import AvatarHoverCard from "components/atoms/Avatar/avatar-hover-card";
 
 interface DevProfileProps {
   username: string;
@@ -26,13 +27,7 @@ const DevProfile = ({ username, company, hasBorder }: DevProfileProps) => {
       </div>
       {/* Desktop */}
       <div className="hidden rounded-full md:flex">
-        <Avatar
-          className={hasBorder ? "ring-2 ring-orange-500" : ""}
-          size={45}
-          isCircle
-          hasBorder={hasBorder}
-          avatarURL={getAvatarByUsername(username)}
-        />
+        <AvatarHoverCard contributor={username} repositories={[]} size="small" />
       </div>
       <div>
         <h1 className="text-light-slate-12">