Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add OSCR tooltip to user page #3857

Merged
merged 10 commits into from
Aug 8, 2024
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@ import IssueCommentsTable from "components/Profiles/IssueCommentsTable/issue-com
import { contributionsOptions, useContributionsFilter } from "components/Profiles/contributors-sub-tab-list";
import { SubTabsList } from "components/TabList/tab-list";
import { OscrButton } from "components/Contributors/Oscr";
import InfoTooltip from "components/shared/InfoTooltip";
import { INITIAL_DEV_STATS_TIMESTAMP } from "lib/utils/devStats";
import UserRepositoryRecommendations from "../UserRepositoryRecommendations/user-repository-recommendations";

Expand Down Expand Up @@ -369,9 +370,14 @@ const ContributorProfileTab = ({
<div className="flex justify-end">
<DayRangePicker />
</div>
<div className="grid grid-cols-2 2xl:grid-cols-4 justify-between gap-2 lg:flex-row md:gap-12 lg:gap-16">
<div className="grid grid-cols-2 2xl:grid-cols-4 justify-between my-2 gap-2 lg:flex-row md:gap-12 lg:gap-16 items-center">
<div>
<span className="text-xs text-light-slate-11">OSCR</span>
<span className="relative text-xs text-light-slate-11 flex gap-0.5 items-center">
<span>OSCR Rating</span>
<span className="text-sm grid place-content-center">
<InfoTooltip information="OSCR evaluates the engagement and impact of contributors across the entire open source ecosystem." />
</span>
</span>
<div className="flex mt-1 text-lg md:text-xl lg:text-2xl !text-black leading-none">
<OscrButton
rating={contributor?.oscr}
Expand All @@ -381,7 +387,7 @@ const ContributorProfileTab = ({
</div>
</div>
<div>
<span className="text-xs text-light-slate-11">PRs opened</span>
<span className="text-xs text-light-slate-11 flex items-center">PRs opened</span>
{totalPrs ? (
<div className="flex mt-1 !text-lg md:!text-xl lg:!text-2xl !text-black !leading-none">
{totalPrs} PRs
Expand All @@ -392,7 +398,7 @@ const ContributorProfileTab = ({
</div>

<div>
<span className="text-xs text-light-slate-11">Avg PR velocity</span>
<span className="text-xs text-light-slate-11 flex items-center">Avg PR velocity</span>
{prVelocity ? (
<div className="flex mt-1 gap-2 !text-lg md:!text-xl lg:!text-2xl !text-black !leading-none">
<span>{prVelocity} PRs</span>
Expand All @@ -403,7 +409,7 @@ const ContributorProfileTab = ({
)}
</div>
<div>
<span className="text-xs text-light-slate-11">Contributed Repos</span>
<span className="text-xs text-light-slate-11 flex items-center">Contributed Repos</span>
{recentContributionCount ? (
<div className="flex mt-1 !text-lg md:!text-xl lg:!text-2xl !text-black !leading-none">
{`${recentContributionCount} Repo${recentContributionCount > 1 ? "s" : ""}`}
Expand Down
2 changes: 1 addition & 1 deletion components/shared/InfoTooltip.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export default function InfoTooltip({ information, icon }: { information: string
<TooltipPortal>
<TooltipContent
side="bottom"
className="w-fit max-w-xs text-sm shadow-lg text-slate-100 px-4 py-3 rounded-xl bg-[#171E29]"
className="z-50 w-fit max-w-xs text-sm shadow-lg text-slate-100 px-4 py-3 rounded-xl bg-[#171E29]"
>
<TooltipArrow className="fill-[#171E29]" />
{information}
Expand Down
Loading