diff --git a/src/components/AccountStreak/AccountStreak.tsx b/src/components/AccountStreak/AccountStreak.tsx index f080a3ae7..c7cdfa509 100644 --- a/src/components/AccountStreak/AccountStreak.tsx +++ b/src/components/AccountStreak/AccountStreak.tsx @@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from 'react'; import { isLoggedIn } from '../../lib/jwt'; import { httpGet } from '../../lib/http'; import { useToast } from '../../hooks/use-toast'; -import { Flame, X } from 'lucide-react'; +import {Flame, X, Zap, ZapOff} from 'lucide-react'; import { useOutsideClick } from '../../hooks/use-outside-click'; import { StreakDay } from './StreakDay'; import { @@ -99,8 +99,8 @@ export function AccountStreak(props: AccountStreakProps) { )} onClick={() => setShowDropdown(true)} > - - + + {accountStreak?.count} @@ -144,9 +144,9 @@ export function AccountStreak(props: AccountStreakProps) { isBrokenStreakDay = index === leftCircleCount - 1; icon = isBrokenStreakDay ? ( - + ) : ( - + ); } else if (index < leftCircleCount + currentCircleCount) { // Current streak days @@ -155,7 +155,7 @@ export function AccountStreak(props: AccountStreakProps) { currentCount - currentCircleCount + currentIndex + 1 + 1; isCurrentStreakDay = true; isToday = currentIndex === currentCircleCount - 1; - icon = ; + icon = ; } else { // Remaining streak days const remainingIndex = @@ -180,7 +180,7 @@ export function AccountStreak(props: AccountStreakProps) { -

+

Visit every day to keep your streak alive!

diff --git a/src/components/AccountStreak/StreakDay.tsx b/src/components/AccountStreak/StreakDay.tsx index 81e2d4fea..b80412c56 100644 --- a/src/components/AccountStreak/StreakDay.tsx +++ b/src/components/AccountStreak/StreakDay.tsx @@ -26,28 +26,24 @@ export function StreakDay(props: StreakDayProps) { return (
{isToday ? null : icon}
- - {dayCount} - + {dayCount} {isToday && ( )}