Awesome Reviewers expert instructions

domains / app-frameworks / ant-design/ant-design

Use semantic naming

Choose semantic, non-redundant names that clearly express intent and context. Remove unnecessary prefixes when the context is already clear, use semantic design tokens instead of hardcoded values, and prefer precise type definitions over generic ones.

raw .md Naming Conventions TypeScript updated

Choose semantic, non-redundant names that clearly express intent and context. Remove unnecessary prefixes when the context is already clear, use semantic design tokens instead of hardcoded values, and prefer precise type definitions over generic ones.

Key practices:

  • Remove redundant prefixes: Use quickJumperInputWidth instead of paginationQuickJumperInputWidth when the context (pagination) is already established
  • Use semantic design tokens: Replace hardcoded values like 8px with semantic tokens like token.marginXS
  • Avoid unnecessary type aliases: Export functions directly rather than maintaining separate type definitions when the function signature is self-explanatory
  • Use precise union types: Specify exact values like 'timePicker' | 'datePicker' instead of generic string types

Example:

// ❌ Redundant prefix and hardcoded value
const paginationQuickJumperInputWidth = '8px';

// ✅ Semantic naming
const quickJumperInputWidth = token.marginXS;

// ❌ Unnecessary type alias
type UseOrientation = (orientation?: Orientation) => [Orientation, boolean];
const useOrientation: UseOrientation = (orientation) => { ... };

// ✅ Direct export with clear signature
export default function useOrientation(orientation?: Orientation): [Orientation, boolean] { ... }
Source discussions