Skip to content

v0.2.4

Choose a tag to compare

@BCFCODE BCFCODE released this 22 Apr 14:04
· 258 commits to main since this release

BCFCODE v0.2.4 Release Notes

Welcome to BCFCODE v0.2.4 — a significant update focused on enhancing codebase structure, improving performance, and streamlining user management and state handling.
This release introduces a more modular architecture, Zustand for state management, and TanStack Query for efficient data fetching.

Below are the key changes, features, and improvements:


🚀 New Features

Zustand State Management

  • Integrated Zustand for lightweight and performant global state management.
  • Added users.ts, leaderboard.ts, and codewars.ts stores to centralize state logic.
  • Implemented actions for updating user data, Codewars challenges, and leaderboard status.

TanStack React Query Integration

  • Adopted TanStack React Query for robust data fetching and caching.
  • Prefetching user data in Providers.tsx to enhance initial load performance.
  • Added React Query Devtools for easier debugging during development.

Improved Database Operations

  • Enhanced db.ts with new methods and transactional support:
    • getCurrentUser: Fetches a single user with aggregated diamonds and Codewars data.
    • addNewUser: Atomically creates a user with associated Codewars and diamonds records.
    • connectCodewarsUser and reconnectCodewarsUser: Streamlined Codewars account linking with upsert support.
    • resetDiamonds: Replaces diamond records for a user, ensuring consistency.

Refactored Layout and Providers

  • Moved core app setup to Providers.tsx for better separation of concerns.
  • Consolidated session handling, navigation, branding, and query client setup.
  • Improved hydration with HydrationBoundary for seamless server-client transitions.

Enhanced Codewars Integration

  • Simplified Codewars challenge handling:
    • Removed untrackedChallenges array, replacing it with a boolean untrackedChallengesAvailable flag.
    • Updated currentUserReducer to support new actions:
      • CHECK_UNTRACKED_CHALLENGES_AVAILABILITY
      • ADD_UNTRACKED_CHALLENGES_TO_LIST

🛠️ Improvements

Codebase Restructuring

  • Renamed and reorganized leaderboard-related files for clarity (e.g., Head/Header.tsx → UsersTable/Header.tsx).
  • Consolidated Codewars table components under UsersTable/UserRow/Cells/CollapseButton/CodewarsTable.
  • Moved font definitions to app/styles/fonts.ts for consistency.

Performance Optimizations

  • Optimized useFilter.ts by removing unused hooks and simplifying logic.
  • Reduced redundant state updates in useChallengesListEffect.ts and useCollectedDiamondsEffect.ts.
  • Improved dependency arrays in hooks like useCounterEffect.ts for better React performance.

Error Handling and Robustness

  • Enhanced transaction handling in db.ts with proper session management and error logging.
  • Removed commented-out code and unused imports to reduce bundle size and improve readability.

UI/UX Enhancements

  • Simplified tooltip logic in Tooltips.tsx by commenting out unused functionality (preparing for future updates).
  • Improved theme consistency by updating font imports in theme.ts.

🐛 Bug Fixes

  • Fixed potential race conditions in database operations by using MongoDB transactions.
  • Corrected import paths in renamed files to prevent runtime errors.
  • Resolved issues with useCollectedDiamondsEffect.ts by removing unnecessary allUsersDispatch dependency.
  • Fixed commented-out code causing linting errors in useMarkUntrackedChallenges.ts and useUntrackedChallenges.ts.

🗑️ Removed Features

Deprecated Files and Hooks

  • Removed useMarkUntrackedChallenges.ts, useUntrackedChallenges.ts, and related tooltip components, replacing them with simplified logic in the Zustand store.
  • Deleted Error.tsx, CodewarsSection, UsersMap.tsx, and other redundant leaderboard components.
  • Eliminated useDispatchActions.ts as state management shifted to Zustand.

Simplified Untracked Challenges

  • Dropped complex untracked challenge tracking in favor of a boolean flag, reducing state management overhead.

📚 Technical Details

Dependencies Added

  • @tanstack/react-query@^5.74.4
  • @tanstack/react-query-devtools@^5.74.4
  • zustand@^5.0.3

File Changes

  • Added: Providers.tsx, StoreInitializer.tsx, store/users.ts, store/leaderboard.ts, store/codewars.ts.
  • Renamed: Multiple leaderboard components for better organization.
  • Modified: db.ts, currentUserReducer.ts, layout.tsx, and various effects/hooks for compatibility with new state management.

Database Schema Updates

  • Updated CodewarsUser type to use untrackedChallengesAvailable boolean instead of an array.
  • Ensured upsert operations in database methods to handle edge cases.

🔧 Developer Notes

Migration Guide

  • Update any components relying on old context providers (AllUsersProvider, CurrentUserProvider) to use Zustand stores.
  • Replace manual data fetching with TanStack Query hooks where applicable.
  • Remove references to deleted files and hooks.

Testing Recommendations

  • Test database transactions thoroughly, especially addNewUser and reconnectCodewarsUser.
  • Verify Zustand store updates in leaderboard and user management flows.
  • Check TanStack Query caching behavior in production-like environments.

Known Issues

  • Some commented-out code remains in Tooltips.tsx and useUntrackedChallenges.ts for future iterations (to be addressed in v0.2.5).
  • StoreInitializer is currently disabled; enable it after testing client-side hydration.

🌟 What's Next?

v0.2.5 Goals

  • Fully enable StoreInitializer for client-side state initialization.
  • Reintroduce simplified tooltip functionality for untracked challenges.
  • Add pagination support for Codewars challenges in the leaderboard.
  • Enhance error handling with user-friendly UI feedback.

🙌 Contributors

  • Bakhshandeh Morteza — Lead Developer
  • BCFCODE Team — UI/UX and Testing Support

Thank you for using BCFCODE!
Join the coding battles and climb the leaderboard! 🚀

BCFCODE LOGO