High: Race Condition in Rate Limiting Logic

[happybigmtn]

Summary

The rate limiting implementation has race conditions that can lead to request storms or missed updates.

Affected Files

• src/hooks/useCraps.ts (lines 42-56)
• src/hooks/useBoard.ts (lines 129-149)

Problem

// Current pattern with race condition
const fetchingRef = useRef(false);

const fetchData = async () => {
  if (fetchingRef.current) return; // Race: check and set not atomic
  fetchingRef.current = true;
  try {
    await doFetch();
  } finally {
    fetchingRef.current = false;
  }
};

Multiple rapid calls can pass the check before first sets the flag.

Impact

• Duplicate RPC requests during rapid state changes
• Potential rate limit hits on RPC providers
• Inconsistent state updates

Proposed Fix

Use proper mutex or debouncing:

import { useMemo } from 'react';
import debounce from 'lodash/debounce';

const debouncedFetch = useMemo(
  () => debounce(async () => {
    // fetch logic here
  }, 300, { leading: true, trailing: false }),
  [dependencies]
);

Or use a proper async mutex pattern.

Labels

bug, high-priority