Blog post Leaderboard MCP Deploy agents
Back to all reviewers

Maintain naming consistency

langfuse/langfuse
Based on 6 comments
TSX

Use consistent and descriptive names for variables, components, and functions throughout the codebase. When the same concept appears in multiple places, use identical naming to prevent confusion and bugs. This includes:

Naming Conventions TSX

Reviewer Prompt

Use consistent and descriptive names for variables, components, and functions throughout the codebase. When the same concept appears in multiple places, use identical naming to prevent confusion and bugs. This includes:

  1. Consistent variable names within functions: If you name a variable in one way at the start of a function, use the same name throughout.
// Inconsistent (confusing):
const modelToProviderMap = useMemo(() => {
  const modelProviderMap: Record<string, string> = {}; // Different name!
  // ...
}, [apiKeys.data]);

// Consistent (clear):
const modelToProviderMap = useMemo(() => {
  const modelToProviderMap: Record<string, string> = {}; // Same name
  // ...
}, [apiKeys.data]);
  1. Component names that reflect functionality: When a component’s purpose changes, rename it to match its current behavior.
// Misleading (no longer a dropdown):
export function DownloadDropdown({ /* ... */ }) {
  // Renders a single button, not a dropdown
}

// Clear (matches functionality):
export function DownloadButton({ /* ... */ }) {
  // Renders a single button
}
  1. Boolean variables with ‘is’ prefix: Use the ‘is’ prefix for boolean variables to improve readability.
// Less clear:
const autoLocked = useState<boolean>(isExistingWidget);

// More clear:
const isAutoLocked = useState<boolean>(isExistingWidget);
  1. Consistent property names: Use the same property names across related components.
// Inconsistent:
totalTokens: props.observations.map(/* ... */)

// Consistent with other code:
totalUsage: props.observations.map(/* ... */)
  1. Avoid typos in identifiers: Ensure component and variable names are spelled correctly.
// Incorrect:
export const PeakViewTraceDetail = ({ projectId }: { projectId: string }) => {

// Correct (matches file path and context):
export const PeekViewTraceDetail = ({ projectId }: { projectId: string }) => {

Consistent naming reduces cognitive load for developers, makes the codebase more maintainable, and helps prevent bugs caused by name confusion.

6
Comments Analyzed
TSX
Primary Language
Naming Conventions
Category

Source Discussions