AI Review Center

Project

Showing AI reviews for website

Project AI Score ?

71%

Quality Avg ?

72%

Security Avg ?

74%

Reviews ?

123

Review Result ?

solutionbowl/website · ef88aee4

The commit adds UI components and logic related to 'fancy market' identification and selectively removing jockey and trainer names from display on certain market types. The code is mostly straightforward and UI-focused, with clear conditional display logic. However, commit message is vague and contains typos which hurt clarity. The UI changes improve user experience by visually distinguishing fancy markets and adapting displayed information accordingly. Bug risk is low but could be improved by ensuring better typing and defensive checks on undefined data. Security risk is minimal as changes are client-side display. Minor risk of fake work due to unclear commit message and bulk addition of UI code without context.

Quality ?

75%

Security ?

80%

Business Value ?

60%

Maintainability ?

78%

Issues & Suggested Fixes ?

1AI detects the issue

2Shows file, line, or evidence

3Suggests the fix to apply

Unclear And Has Typos

Where commit message

Issue / Evidence unclear and has typos

Suggested Fix rewrite message clearly describing the purpose and impact of the change

Add Explicit Type Checks And Handle Potent...

Where src/components/racing/HorseRow.tsx:44-50

Issue / Evidence add explicit type checks and handle potential null/undefined better

Suggested Fix improve bug risk score

Add Comments To Clarify Rationale For Hidi...

Where src/components/racing/HorseRow.tsx:400-409

Issue / Evidence add comments to clarify rationale for hiding jockey/trainer for fancy markets

Suggested Fix improve code maintainability and business value

Consider Breaking Large Jsx Blocks Into Sm...

Where src/components/SportBet/SportBet.tsx:65-123

Issue / Evidence consider breaking large JSX blocks into smaller components for better readability and maintainability

Suggested Fix improve quality score

Verify Case Sensitivity And Market Type No...

Where src/components/racing/BettingPanel.tsx:284-285

Issue / Evidence verify case sensitivity and market type normalization logic is consistent across usages

Suggested Fix reduce bug risk

Code Change Preview · src/components/racing/BettingPanel.tsx ?

Removed / Before Commit

- diff --git a/src/components/racing/BettingPanel.tsx b/src/components/racing/BettingPanel.tsx
- index 3296ebc..e310c20 100644
- const selectedMarket = markets.find((m) => m.marketId === activeMarket)
- const marketNameLower = selectedMarket?.marketName?.toLowerCase() || ''
- const isWinnerMarket = marketNameLower.includes('winner') || marketNameLower.includes('win')
-     const isFancyMarket = marketNameLower.includes('fancy')
- 
- // Check if there's an active bet for this market
- if (!activeBet || (activeMarket !== "all" && activeBet.marketId !== activeMarket)) {
- raceId={raceId}
- marketId={activeMarket}
- raceType={selectedMarket?.marketOddsType}
- activeBet={activeBet}
- setActiveBet={setActiveBet}
- profitLoss={pl[index] || 0}

Added / After Commit

+ diff --git a/src/components/racing/BettingPanel.tsx b/src/components/racing/BettingPanel.tsx
+ index 3296ebc..e310c20 100644
+ const selectedMarket = markets.find((m) => m.marketId === activeMarket)
+ const marketNameLower = selectedMarket?.marketName?.toLowerCase() || ''
+ const isWinnerMarket = marketNameLower.includes('winner') || marketNameLower.includes('win')
+     const isFancyMarket =
+       marketNameLower.includes('fancy') || selectedMarket?.marketType?.toUpperCase() === 'FANCY'
+ 
+ // Check if there's an active bet for this market
+ if (!activeBet || (activeMarket !== "all" && activeBet.marketId !== activeMarket)) {
+ raceId={raceId}
+ marketId={activeMarket}
+ raceType={selectedMarket?.marketOddsType}
+                     marketType={selectedMarket?.marketType}
+ activeBet={activeBet}
+ setActiveBet={setActiveBet}
+ profitLoss={pl[index] || 0}

Removed / Before Commit

- diff --git a/src/components/racing/HorseRow.tsx b/src/components/racing/HorseRow.tsx
- index 06b7304..c11e98a 100644
- raceId?: string
- marketId?: string
- raceType?: string
- activeBet?: ActiveBet | null
- setActiveBet?: (bet: ActiveBet | null) => void
- profitLoss?: number
- 
- const BACK_ODDS_BUTTON_CLASS = "bg-[#4a90c4] hover:bg-[#3d7aa8]"
- const LAY_ODDS_BUTTON_CLASS = "bg-[#d88899] hover:bg-[#c77485]"
- 
- const HorseRow = memo(({
- runner,
- raceId = 'unknown',
- marketId = 'unknown',
- raceType,
- activeBet,

Added / After Commit

+ diff --git a/src/components/racing/HorseRow.tsx b/src/components/racing/HorseRow.tsx
+ index 06b7304..c11e98a 100644
+ raceId?: string
+ marketId?: string
+ raceType?: string
+   marketType?: string
+ activeBet?: ActiveBet | null
+ setActiveBet?: (bet: ActiveBet | null) => void
+ profitLoss?: number
+ 
+ const BACK_ODDS_BUTTON_CLASS = "bg-[#4a90c4] hover:bg-[#3d7aa8]"
+ const LAY_ODDS_BUTTON_CLASS = "bg-[#d88899] hover:bg-[#c77485]"
+ const ODDS_BUTTON_BASE_CLASS =
+   "w-full h-[44px] text-white px-[8px] rounded-[6px] text-[11px] font-semibold transition-colors flex flex-col justify-center overflow-hidden active:scale-95"
+ const ODDS_VALUE_CLASS = "h-[14px] leading-[14px] font-bold truncate"
+ const ODDS_VOLUME_CLASS = "h-[12px] leading-[12px] text-[9px] opacity-80 truncate"
+ const isSelectableOddsValue = (odds: number | null | undefined, isFancyMarket: boolean) => {
+   if (odds === null || odds === undefined || !Number.isFinite(odds) || odds <= 0) {

Removed / Before Commit

- diff --git a/src/components/racing/MarketCard.tsx b/src/components/racing/MarketCard.tsx
- index 35a7346..dd8ad66 100644
- const calculatePL = () => {
- const marketNameLower = market.marketName?.toLowerCase() || ''
- const isWinnerMarket = marketNameLower.includes('winner') || marketNameLower.includes('win')
-     const isFancyMarket = marketNameLower.includes('fancy')
- 
- // Check if there's an active bet for this market
- if (!activeBet || activeBet.marketId !== market.marketId) {
- raceId={raceId}
- marketId={market.marketId}
- raceType={raceType}
- activeBet={activeBet}
- setActiveBet={setActiveBet}
- profitLoss={pl[index] || 0}

Added / After Commit

+ diff --git a/src/components/racing/MarketCard.tsx b/src/components/racing/MarketCard.tsx
+ index 35a7346..dd8ad66 100644
+ const calculatePL = () => {
+ const marketNameLower = market.marketName?.toLowerCase() || ''
+ const isWinnerMarket = marketNameLower.includes('winner') || marketNameLower.includes('win')
+     const isFancyMarket =
+       marketNameLower.includes('fancy') || market.marketType?.toUpperCase() === 'FANCY'
+ 
+ // Check if there's an active bet for this market
+ if (!activeBet || activeBet.marketId !== market.marketId) {
+ raceId={raceId}
+ marketId={market.marketId}
+ raceType={raceType}
+                       marketType={market.marketType}
+ activeBet={activeBet}
+ setActiveBet={setActiveBet}
+ profitLoss={pl[index] || 0}

Removed / Before Commit

- diff --git a/src/components/SportBet/SportBet.tsx b/src/components/SportBet/SportBet.tsx
- index 5983e3d..e5691e8 100644
- 
- export default function BetSlip() {
- const colors = useThemeColors();
-   const {
-     bets,
-     removeBet,
-     updateStake,
-     clearAll,
-     getTotalStake,
-     getTotalReturn,
-   } = useBetSlipStore();
- const [isSettingsOpen, setIsSettingsOpen] = useState(false);
- const [mobileOpen, setMobileOpen] = useState(false);
- 
- {/* Header */}
- <div className="mb-[16px] flex shrink-0 items-center justify-between gap-[12px]">

Added / After Commit

+ diff --git a/src/components/SportBet/SportBet.tsx b/src/components/SportBet/SportBet.tsx
+ index 5983e3d..e5691e8 100644
+ 
+ export default function BetSlip() {
+ const colors = useThemeColors();
+   const { bets, removeBet, updateStake, clearAll, getTotalStake, getTotalReturn } = useBetSlipStore();
+ const [isSettingsOpen, setIsSettingsOpen] = useState(false);
+ const [mobileOpen, setMobileOpen] = useState(false);
+ 
+ {/* Header */}
+ <div className="mb-[16px] flex shrink-0 items-center justify-between gap-[12px]">
+ <div className="flex items-center gap-[8px]">
+           <i className="fa-solid fa-receipt text-[15px]" style={{ color: colors.primary }} />
+           <h2 className="text-[16px] font-bold" style={{ color: colors.textPrimary }}>Bet Slip</h2>
+ {bets.length > 0 && (
+ <span
+ className="flex h-[20px] min-w-[20px] items-center justify-center rounded-full px-[6px] text-[11px] font-bold"
+ style={{ scrollbarColor: `${colors.primary} transparent` }}

Removed / Before Commit

- diff --git a/src/components/sports/MarketCard.tsx b/src/components/sports/MarketCard.tsx
- index 58da807..8ca8a23 100644
- market: Market;
- defaultOpen?: boolean;
- eventName?: string;
-   singleBetMode?: boolean;
- }
- 
- const OVERLAY_STATUSES = [
-   "suspended",
-   "closed",
-   "ball running",
-   "ball_running",
- ];
- 
- export default function MarketCard({
-   market,
-   defaultOpen = false,

Added / After Commit

+ diff --git a/src/components/sports/MarketCard.tsx b/src/components/sports/MarketCard.tsx
+ index 58da807..8ca8a23 100644
+ market: Market;
+ defaultOpen?: boolean;
+ eventName?: string;
+ }
+ 
+ const OVERLAY_STATUSES = ["suspended", "closed", "ball running", "ball_running"];
+ 
+ export default function MarketCard({ market, defaultOpen = false, eventName = "" }: MarketCardProps) {
+ const colors = useThemeColors();
+ const [isOpen, setIsOpen] = useState(defaultOpen);
+ const contentRef = useRef<HTMLDivElement>(null);
+ const [contentHeight, setContentHeight] = useState(0);
+ const { addBet } = useBetSlipStore();
+   const [priceChanges, setPriceChanges] = useState<Record<string, { backPrice?: number; layPrice?: number }>>({});
+   const prevPricesRef = useRef<Record<string, { backPrice?: number; layPrice?: number }>>({});
+

Removed / Before Commit

- diff --git a/src/store/betSlipStore.ts b/src/store/betSlipStore.ts
- index e3eb8f9..cfa1c89 100644
- import { create } from "zustand";
- 
- export interface BetSlipItem {
- id: string;
- marketName: string;
- eventName: string;
- odds: number;
-   size: number; // for fancy: percentage; for others: 0
-   marketType: "fancy" | "other";
-   type: "back" | "lay";
- stake: number;
- }
- 
- confirmBeforeBet: boolean;
- oneClickBetting: boolean;
- defaultStake: number;

Added / After Commit

+ diff --git a/src/store/betSlipStore.ts b/src/store/betSlipStore.ts
+ index e3eb8f9..cfa1c89 100644
+ import { create } from 'zustand';
+ 
+ export interface BetSlipItem {
+ id: string;
+ marketName: string;
+ eventName: string;
+ odds: number;
+   type: 'back' | 'lay';
+ stake: number;
+ }
+ 
+ confirmBeforeBet: boolean;
+ oneClickBetting: boolean;
+ defaultStake: number;
+   profitView: 'return' | 'profit';
+ }