[QF-3645] Redesign streak progress page

[afifvdin]

Summary

Closes: QF-3645

A brief description for the PR.

Type of change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

Test plan

This should state how this PR have been tested.

Checklist

• My code follows the style guidelines of this project
• I have performed a self-review of my code
• My changes generate no new warnings
• Any dependent changes have been merged and published in downstream modules
• I have commented on my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes

Screenshots or videos

Before	After

Summary by CodeRabbit

• New Features

  • Added "continue reading" button to resume from the last read location.
  • Introduced circular progress visualization on the reading progress page.

• Bug Fixes

  • Improved reading goal state handling for future dates.

• UI/UX Updates

  • Redesigned reading progress page with new hero section and improved layout.
  • Updated day indicators and reading streak display styling.
  • Enhanced responsive design for mobile and tablet screens.
  • Improved reading goal modals organization and interaction flow.

[Copilot]

Copilot encountered an error and was unable to review this pull request. You can try again by re-requesting a review.

[coderabbitai]

Note

Currently processing new changes in this PR. This may take a few minutes, please wait...

📥 Commits

Reviewing files that changed from the base of the PR and between 4697719 and a4f355e.

⛔ Files ignored due to path filters (1)

• public/icons/arrow-left.svg is excluded by !**/*.svg

📒 Files selected for processing (15)

• locales/en/reading-goal.json (2 hunks)
• src/components/HomePage/QuranGrowthJourneySection/CollapsibleSection/QuranReadingGoals/CurrentWeekProgress.tsx (2 hunks)
• src/components/HomePage/QuranGrowthJourneySection/CollapsibleSection/QuranReadingGoals/DayCircle/DayCircle.module.scss (3 hunks)
• src/components/HomePage/QuranGrowthJourneySection/CollapsibleSection/QuranReadingGoals/DayCircle/index.tsx (2 hunks)
• src/components/HomePage/QuranGrowthJourneySection/CollapsibleSection/QuranReadingGoals/ReadingStreak.module.scss (3 hunks)
• src/components/ReadingGoal/DeleteReadingGoalModal/index.tsx (3 hunks)
• src/components/ReadingGoal/UpdateReadingGoalModal/UpdateReadingGoalModal.module.scss (2 hunks)
• src/components/ReadingGoal/UpdateReadingGoalModal/index.tsx (6 hunks)
• src/components/ReadingProgressPage/ProgressPageGoalWidget.tsx (2 hunks)
• src/components/ReadingProgressPage/ProgressPageStreakWidget.tsx (2 hunks)
• src/components/ReadingProgressPage/ReadingProgressPage.module.scss (5 hunks)
• src/components/ReadingProgressPage/index.tsx (3 hunks)
• src/hooks/auth/useGetStreakWithMetadata.ts (4 hunks)
• src/hooks/useGetContinueReadingUrl.ts (1 hunks)
• src/utils/datetime.ts (1 hunks)

 _________________________________
< Winner winner, bug-free dinner. >
 ---------------------------------
  \
   \   (\__/)
       (•ㅅ•)
       / 　 づ

Tip

You can disable poems in the walkthrough.

Disable the reviews.poem setting in your project's settings in CodeRabbit to disable the poems in the walkthrough.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch QF-3645

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}