Merge branch 'neetzsche/fix-poll-bug' into 'main'

Fix poll percentage bug

See merge request soapbox-pub/soapbox!2917

src/components/badge.tsx

@@ -13,7 +13,9 @@ const Badge: React.FC<IBadge> = ({ title, slug, color }) => {
   const fallback = !['patron', 'admin', 'moderator', 'opaque', 'badge:donor'].includes(slug);
 
   const isDark = useMemo(() => {
-    const hsl = hexToHsl(color!);
+    if (!color) return false;
+
+    const hsl = hexToHsl(color);
 
     if (hsl && hsl.l > 50) return false;
 

src/components/polls/poll-option.tsx

@@ -111,7 +111,7 @@ const PollOption: React.FC<IPollOption> = (props): JSX.Element | null => {
 
   if (!poll) return null;
 
-  const pollVotesCount = poll.voters_count || poll.votes_count;
+  const pollVotesCount = poll.votes_count || poll.voters_count;
   const percent = pollVotesCount === 0 ? 0 : (option.votes_count / pollVotesCount) * 100;
   const voted = poll.own_votes?.includes(index);
   const message = intl.formatMessage(messages.votes, { votes: option.votes_count });

src/components/ui/counter/counter.tsx

@@ -12,7 +12,7 @@ interface ICounter {
 /** A simple counter for notifications, etc. */
 const Counter: React.FC<ICounter> = ({ count, countMax }) => {
   return (
-    <span className='flex h-5 min-w-[20px] max-w-[26px] items-center justify-center rounded-full bg-secondary-500 text-xs font-medium text-white ring-2 ring-white dark:ring-gray-800'>
+    <span className='flex h-5 min-w-[20px] max-w-[26px] items-center justify-center rounded-full bg-secondary-500 text-xs font-medium text-white ring-2 ring-white black:ring-black dark:ring-gray-800'>
       {shortNumberFormat(count, countMax)}
     </span>
   );