diff --git a/components/molecules/ContributorListTableHeader/contributor-list-table-header.tsx b/components/molecules/ContributorListTableHeader/contributor-list-table-header.tsx
index a8915e0253..55c1dda881 100644
--- a/components/molecules/ContributorListTableHeader/contributor-list-table-header.tsx
+++ b/components/molecules/ContributorListTableHeader/contributor-list-table-header.tsx
@@ -52,7 +52,7 @@ const ContributorListTableHeaders = ({ selected, handleOnSelectAllContributor }:
Last Contributed
-
Language
+
Most Used Languages
diff --git a/components/molecules/ContributorListTableRow/contributor-list-table-row.tsx b/components/molecules/ContributorListTableRow/contributor-list-table-row.tsx
index 6dbd41bbf0..dc2408baa3 100644
--- a/components/molecules/ContributorListTableRow/contributor-list-table-row.tsx
+++ b/components/molecules/ContributorListTableRow/contributor-list-table-row.tsx
@@ -43,6 +43,40 @@ function getLastContributedRepo(pullRequests: DbRepoPR[]) {
return sortedPullRequests[0].full_name;
}
+
+function getTopContributorLanguages(contributor: DbUser) {
+ // some contributors will have empty language objects so we will pull their popular language from the interests field instead of defaulting to nothing
+ const entries = Object.entries
(contributor.languages);
+ if (entries.length === 0) {
+ return [contributor.interests];
+ }
+ return entries
+ .sort(([, a], [, b]) => (a < b ? -1 : 1))
+ .slice(0, 2)
+ .map(([language]) => language);
+}
+
+function getLanguageAbbreviation(language: string) {
+ switch (language.toLowerCase()) {
+ case "javascript":
+ return "JS";
+ case "typescript":
+ return "TS";
+ case "powershell":
+ return "Shell"; // Powershell is too long for our current table design
+ case "batchfile":
+ return "Batch"; // Batchfile is too long for our current table design
+ case "vim script": // Vim script is too long for our current table design
+ return "Vim";
+ case "dockerfile":
+ return "Docker"; // Dockerfile is too long for our current table design
+ case "makefile":
+ return "Make"; // Makefile is too long for our current table design
+ default:
+ return language;
+ }
+}
+
const ContributorListTableRow = ({
contributor,
topic,
@@ -62,7 +96,7 @@ const ContributorListTableRow = ({
});
const repoList = useRepoList(Array.from(new Set(data.map((prData) => prData.full_name))).join(","));
- const contributorLanguageList = user ? Object.keys(user.languages).map((language) => language) : [];
+ const contributorLanguageList = user ? getTopContributorLanguages(user) : [];
const days = getPullRequestsToDays(data, Number(range || "30"));
const totalPrs = data.length;
const last30days = [
@@ -73,6 +107,7 @@ const ContributorListTableRow = ({
},
];
const mergedPrs = data.filter((prData) => prData.merged);
+ const [firstContributorLanguage, secondContributorLanguage] = contributorLanguageList;
return (
<>
@@ -134,13 +169,11 @@ const ContributorListTableRow = ({
Languages
- {contributorLanguageList.length > 0 ? (
+ {contributorLanguageList && (
- {contributorLanguageList[0]}
- {contributorLanguageList.length > 1 ? `,+${contributorLanguageList.length - 1}` : ""}
+ {firstContributorLanguage && getLanguageAbbreviation(firstContributorLanguage)}
+ {secondContributorLanguage && `, ${getLanguageAbbreviation(secondContributorLanguage)}`}
- ) : (
- "-"
)}
@@ -192,13 +225,11 @@ const ContributorListTableRow = ({
{/* Column: Language */}
- {contributorLanguageList.length > 0 ? (
+ {contributorLanguageList && (
- {contributorLanguageList[0]}
- {contributorLanguageList.length > 1 ? `,+${contributorLanguageList.length - 1}` : ""}
+ {firstContributorLanguage && getLanguageAbbreviation(firstContributorLanguage)}
+ {secondContributorLanguage && `, ${getLanguageAbbreviation(secondContributorLanguage)}`}
- ) : (
- "-"
)}