[resumes][refactor] update resume badge names

pull/400/head
Keane Chan 3 years ago
parent f6aa4e007f
commit 16a2766726
No known key found for this signature in database
GPG Key ID: 32718398E1E9F87C

@ -2,7 +2,7 @@ type Props = Readonly<{
className: string; className: string;
}>; }>;
export default function SilverReviewerBadgeIcon({ className }: Props) { export default function ResumeBadgeDetectiveIcon({ className }: Props) {
return ( return (
<svg <svg
aria-hidden="true" aria-hidden="true"

@ -2,7 +2,7 @@ type Props = Readonly<{
className: string; className: string;
}>; }>;
export default function BronzeReviewerBadgeIcon({ className }: Props) { export default function ResumeBadgeEagleIcon({ className }: Props) {
return ( return (
<svg <svg
aria-hidden="true" aria-hidden="true"

@ -2,7 +2,7 @@ type Props = Readonly<{
className: string; className: string;
}>; }>;
export default function GoldReviewerBadgeIcon({ className }: Props) { export default function ResumeBadgeSuperheroIcon({ className }: Props) {
return ( return (
<svg <svg
aria-hidden="true" aria-hidden="true"

@ -15,10 +15,10 @@ export default function ResumeUserBadge({
<div className="group flex items-center justify-center"> <div className="group flex items-center justify-center">
<div <div
className="absolute -top-0 hidden w-64 -translate-y-full flex-col justify-center className="absolute -top-0 hidden w-64 -translate-y-full flex-col justify-center
gap-1 rounded-lg bg-white px-2 py-2 text-center drop-shadow-xl gap-1 rounded-lg bg-slate-100 px-2 py-2 text-center drop-shadow-xl
after:absolute after:left-1/2 after:absolute after:left-1/2
after:top-[100%] after:-translate-x-1/2 after:border-8 after:border-x-transparent after:top-[100%] after:-translate-x-1/2 after:border-8 after:border-x-transparent
after:border-b-transparent after:border-t-white after:drop-shadow-lg after:border-b-transparent after:border-t-slate-100 after:drop-shadow-lg
after:content-[''] group-hover:flex"> after:content-[''] group-hover:flex">
<Icon className="self-center" /> <Icon className="self-center" />
<p className="font-medium">{toolTip}</p> <p className="font-medium">{toolTip}</p>

@ -1,12 +1,12 @@
import BronzeReviewerBadgeIcon from '../badgeIcons/reviewer/BronzeReviewerBadgeIcon'; import ResumeBadgeDetectiveIcon from '../badgeIcons/reviewer/ResumeBadgeDetectiveIcon';
import GoldReviewerBadgeIcon from '../badgeIcons/reviewer/GoldReviewerBadgeIcon'; import ResumeBadgeEagleIcon from '../badgeIcons/reviewer/ResumeBadgeEagleIcon';
import SilverReviewerBadgeIcon from '../badgeIcons/reviewer/SilverReviewerBadgeIcon'; import ResumeBadgeSuperheroIcon from '../badgeIcons/reviewer/ResumeBadgeSuperheroIcon';
export type BadgeIcon = ( export type BadgeIcon = (
props: React.ComponentProps< props: React.ComponentProps<
| typeof BronzeReviewerBadgeIcon | typeof ResumeBadgeDetectiveIcon
| typeof GoldReviewerBadgeIcon | typeof ResumeBadgeEagleIcon
| typeof SilverReviewerBadgeIcon | typeof ResumeBadgeSuperheroIcon
>, >,
) => JSX.Element; ) => JSX.Element;
@ -23,35 +23,35 @@ export type BadgePayload = {
reviewedResumesCount: number; reviewedResumesCount: number;
}; };
const GOLD_TIER = 20; const TIER_THREE = 20;
const SILVER_TIER = 10; const TIER_TWO = 10;
const BRONZE_TIER = 5; const TIER_ONE = 5;
export const RESUME_USER_BADGES: Array<BadgeInfo> = [ export const RESUME_USER_BADGES: Array<BadgeInfo> = [
{ {
description: `Reviewed over ${GOLD_TIER} resumes`, description: `Reviewed over ${TIER_ONE} resumes`,
icon: GoldReviewerBadgeIcon, icon: ResumeBadgeSuperheroIcon,
id: 'Superhero', id: 'Superhero',
isValid: (payload: BadgePayload) => isValid: (payload: BadgePayload) =>
payload.reviewedResumesCount >= GOLD_TIER, payload.reviewedResumesCount >= TIER_THREE,
toolTip: 'True saviour of the people', toolTip: 'True saviour of the people',
}, },
{ {
description: `Reviewed over ${SILVER_TIER} resumes`, description: `Reviewed over ${TIER_TWO} resumes`,
icon: SilverReviewerBadgeIcon, icon: ResumeBadgeDetectiveIcon,
id: 'Detective', id: 'Detective',
isValid: (payload: BadgePayload) => isValid: (payload: BadgePayload) =>
payload.reviewedResumesCount >= SILVER_TIER && payload.reviewedResumesCount >= TIER_TWO &&
payload.reviewedResumesCount < GOLD_TIER, payload.reviewedResumesCount < TIER_THREE,
toolTip: 'Keen eye for details like a private eye', toolTip: 'Keen eye for details like a private eye',
}, },
{ {
description: `Reviewed over ${BRONZE_TIER} resumes`, description: `Reviewed over ${TIER_THREE} resumes`,
icon: BronzeReviewerBadgeIcon, icon: ResumeBadgeEagleIcon,
id: 'Eagle', id: 'Eagle',
isValid: (payload: BadgePayload) => isValid: (payload: BadgePayload) =>
payload.reviewedResumesCount >= BRONZE_TIER && payload.reviewedResumesCount >= TIER_ONE &&
payload.reviewedResumesCount < SILVER_TIER, payload.reviewedResumesCount < TIER_TWO,
toolTip: 'As sharp as an eagle', toolTip: 'As sharp as an eagle',
}, },
]; ];

Loading…
Cancel
Save