AI Review Center

Commit Review Workspace ?

Select a commit on the left to inspect quality, security, business value, findings, and suggested code changes.
Showing AI reviews for website
Project AI Score ?
71%
Quality Avg ?
72%
Security Avg ?
74%
Reviews ?
123

Review Result ?

solutionbowl/website · a0a27027
The commit adds handling for 'ball running' market statuses across multiple components, along with UI enhancements and socket updates for real-time odds. However, the presence of console.log debugging statements raises concerns for production readiness. The memoization in useMemo hook is incorrectly dependent on matches.length, potentially causing stale data if matches array content changes don't update UI. The socket update logic lacks error boundary and validation which can introduce bugs.
Quality ?
70%
Security ?
80%
Business Value ?
75%
Maintainability ?
70%
Issues & Suggested Fixes ?
1AI detects the issue
2Shows file, line, or evidence
3Suggests the fix to apply
Debug Console.log Statement Left In Code
Where src/components/sports/MarketRunner.tsx:20
Issue / Evidence debug console.log statement left in code
Suggested Fix remove or replace with proper logging mechanism
Usememo Dependency On Matches.length Inste...
Where src/pages/Home.tsx:31
Issue / Evidence useMemo dependency on matches.length instead of matches array
Suggested Fix change dependency to matches or a stable identifier array to avoid stale memoized value
Missing Validation
Where src/pages/Home.tsx:33-53
Issue / Evidence socket update logic lacks error handling and validation
Suggested Fix add checks and error boundaries to handle malformed socket data or network issues
Non Descriptive Merge Commit Message
Where commit message
Issue / Evidence non-descriptive merge commit message
Suggested Fix write clear, meaningful commit messages describing changes for traceability
Code Change Preview · src/components/sports/MarketCard.tsx ?
Removed / Before Commit
- diff --git a/src/components/sports/MarketCard.tsx b/src/components/sports/MarketCard.tsx
- index 2f1ac5d..58707f2 100644
- eventName?: string;
- }
- 
- const OVERLAY_STATUSES = ['suspended', 'closed', 'ball running'];
- 
- export default function MarketCard({ market, defaultOpen = false, eventName = "" }: MarketCardProps) {
- const colors = useThemeColors();
- 
- const getOverlayText = (item: any) => {
- const s = item.marketStatus?.toLowerCase();
-     if (item.inplay || s === 'ball running') return 'Ball Running';
- return item.marketStatus;
- };
- 
- onClick={() => item.no?.price && handleOddsClick(item.runner, 'lay', item.no.price)}
- disabled={!item.no?.price}
Added / After Commit
+ diff --git a/src/components/sports/MarketCard.tsx b/src/components/sports/MarketCard.tsx
+ index 2f1ac5d..58707f2 100644
+ eventName?: string;
+ }
+ 
+ const OVERLAY_STATUSES = ['suspended', 'closed', 'ball running', 'ball_running'];
+ 
+ export default function MarketCard({ market, defaultOpen = false, eventName = "" }: MarketCardProps) {
+ const colors = useThemeColors();
+ 
+ const getOverlayText = (item: any) => {
+ const s = item.marketStatus?.toLowerCase();
+     if (item.inplay || s === 'ball running' || s === 'ball_running') return 'Ball Running';
+ return item.marketStatus;
+ };
+ 
+ onClick={() => item.no?.price && handleOddsClick(item.runner, 'lay', item.no.price)}
+ disabled={!item.no?.price}
Removed / Before Commit
- diff --git a/src/components/sports/MarketRunner.tsx b/src/components/sports/MarketRunner.tsx
- index e3926b5..aa54ff1 100644
- const colors = useThemeColors();
- const isActive = runner.status === "ACTIVE";
- 
- // Sort odds
- const sortedBackOdds =
- runner.back?.slice().sort((a, b) => a.price - b.price) || [];
- </div>
- 
- {/* Odds / Suspended */}
-       <div className="relative flex items-center justify-center " style={{width:'90%'}}>
-         {marketStatus && ['suspended', 'closed', 'ball running'].includes(marketStatus.toLowerCase()) && (
-           <div className="absolute inset-0 flex items-center justify-center font-bold text-[11px] text-white z-20 rounded"
-             style={{ backgroundColor: 'rgba(55,55,55,0.90)', pointerEvents: 'none' }}
- >
-             {marketStatus.toLowerCase() === 'ball running' ? 'Ball Running' : marketStatus}
- </div>
Added / After Commit
+ diff --git a/src/components/sports/MarketRunner.tsx b/src/components/sports/MarketRunner.tsx
+ index e3926b5..aa54ff1 100644
+ const colors = useThemeColors();
+ const isActive = runner.status === "ACTIVE";
+ 
+   // Debug: Log marketStatus
+   console.log(`MarketRunner: ${runner.runnerName} - Status: ${marketStatus} - Active: ${isActive}`);
+ 
+ // Sort odds
+ const sortedBackOdds =
+ runner.back?.slice().sort((a, b) => a.price - b.price) || [];
+ </div>
+ 
+ {/* Odds / Suspended */}
+       <div className="relative flex items-center justify-center" style={{width:'90%'}}>
+         {marketStatus && ['suspended', 'closed', 'ball running', 'ball_running'].includes(marketStatus.toLowerCase()) && (
+           <div 
+             className="absolute inset-0 flex items-center justify-center font-bold text-white rounded"
Removed / Before Commit
- diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
- index 4dd8ed2..22b1484 100644
- import { useState, useEffect } from "react";
- import { useParams } from "react-router-dom";
- import BannerCarousel from "../components/banner/BannerCarousel";
- import SportsTabNavigation from "../components/sports/SportsTabNavigation";
- // Local state for matches with real-time updates
- const [matches, setMatches] = useState<CricketMatch[]>([]);
- 
-   // Update local matches when initial data loads
- useEffect(() => {
-     // console.log("📥 Initial matches loaded:", initialMatches.length);
- setMatches(initialMatches);
- }, [initialMatches]);
- 
-   // Get all event IDs for socket connection
-   const eventIds = matches.map(m => m.eventId);
-
Added / After Commit
+ diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
+ index 4dd8ed2..22b1484 100644
+ import { useState, useEffect, useMemo, useCallback } from "react";
+ import { useParams } from "react-router-dom";
+ import BannerCarousel from "../components/banner/BannerCarousel";
+ import SportsTabNavigation from "../components/sports/SportsTabNavigation";
+ // Local state for matches with real-time updates
+ const [matches, setMatches] = useState<CricketMatch[]>([]);
+ 
+ useEffect(() => {
+ setMatches(initialMatches);
+ }, [initialMatches]);
+ 
+   // All eventIds for socket join
+   const allEventIds = useMemo(() => matches.map(m => m.eventId), [matches.length]);
+ 
+   const handleSocketUpdate = useCallback((socketData: any) => {
+     const updatedEventId = String(socketData?.eventId);