diff --git a/assets/icons.tsx b/assets/icons.tsx index feaf06a..5cbc617 100644 --- a/assets/icons.tsx +++ b/assets/icons.tsx @@ -204,3 +204,29 @@ export const FeedbackIcon: React.FC = ({ ); }; + +export const InfoIcon: React.FC = ({ + size = 24, + width, + height, + ...props +}) => { + return ( + + + + + + ); +}; diff --git a/components/filters/checkbox-filter.tsx b/components/filters/checkbox-filter.tsx index a385126..83fda2f 100644 --- a/components/filters/checkbox-filter.tsx +++ b/components/filters/checkbox-filter.tsx @@ -2,6 +2,9 @@ import React from "react"; import { usePathname, useRouter } from "next/navigation"; import { Checkbox } from "@nextui-org/checkbox"; +import { Tooltip } from "@nextui-org/tooltip"; +import { InfoIcon } from "@/assets/icons"; +import { GOOD_FIRST_ISSUE_LABELS } from "@/data/filters"; import { createUrl } from "@/utils/url"; interface ICheckboxFilterProps { @@ -28,16 +31,34 @@ export const CheckboxFilter = ({ }; return ( - +
+ Based on the following GitHub labels: +
+ {GOOD_FIRST_ISSUE_LABELS.map((label, idx) => ( +
+ • {label} +
+ ))} + + } > - {placeholder} -
+
+ + {placeholder} + + +
+ ); };