Skip to content

Latest commit

Β 

History

History
94 lines (72 loc) Β· 3.83 KB

File metadata and controls

94 lines (72 loc) Β· 3.83 KB

AGENTS.md

Instruction file for AI coding agents (Windsurf, OpenAI Codex CLI, Gemini CLI, and similar tools). Read this before making any changes.


What This Project Is

A production-ready React Native + TypeScript boilerplate. Everything is pre-wired: navigation, dark/light theming, localization, HTTP hooks, animations, and a provider-agnostic AI service layer supporting OpenAI, Anthropic, and Google Gemini.

Stack: React Native 0.84 Β· React 19 Β· TypeScript 5 (strict) Β· react-navigation v7 Β· reanimated v4 Β· axios Β· i18next


Project Layout

src/
β”œβ”€β”€ hooks/             # useAIChat, useAICompletion
β”œβ”€β”€ navigation/        # Stack + Bottom Tab wiring
β”œβ”€β”€ screens/           # One folder per screen (Screen.tsx + Screen.style.ts)
β”œβ”€β”€ services/
β”‚   β”œβ”€β”€ ai/            # AI service layer (providers/, AIService.ts, types.ts)
β”‚   β”œβ”€β”€ event-emitter/ # Shared event bus
β”‚   └── models/        # Shared TypeScript interfaces
β”œβ”€β”€ shared/
β”‚   β”œβ”€β”€ components/    # RN-prefixed shared components + barrel index.ts
β”‚   β”œβ”€β”€ constants/     # SCREENS enum
β”‚   β”œβ”€β”€ localization/  # i18next (en + tr-TR)
β”‚   └── theme/         # palette, LightTheme, DarkTheme, fonts, font-size
└── utils/

Key Rules

Imports

  • Always use path aliases, never deep relative paths (../../..)
  • Common aliases: @shared-components, @services/*, @screens/*, @hooks, @theme/*, @fonts, @utils
  • Import from @services/ai barrel β€” never from individual provider files

Styling

  • Call useMemo(() => createStyles(theme), [theme]) in every component that needs styles
  • createStyles(theme: ExtendedTheme) returns a StyleSheet.create({...})
  • Colors always come from const { colors } = useTheme() β€” never hardcoded

Components

  • Text: always TextWrapper from @shared-components/text-wrapper/TextWrapper
  • Touchables: always RNBounceable from @freakycoder/react-native-bounceable
  • Safe area: SafeAreaView from react-native-safe-area-context
  • Shared component files go in src/shared/components/<name>/RN<Name>.tsx + RN<Name>.style.ts
  • Export new components from src/shared/components/index.ts

TypeScript

  • Props interfaces use I prefix: IMyComponentProps
  • noUnusedLocals and noUnusedParameters are enforced β€” every declared identifier must be used
  • Use export type { Foo } for type-only re-exports
  • Exhaustive switch default: const x: never = val; throw new Error(...)

Navigation

  • Screen names live only in SCREENS (src/shared/constants/index.ts)
  • Register screens in src/navigation/index.tsx

AI Service Layer

  • AIConfig.model is a plain string β€” the developer supplies it; the service never hardcodes model names
  • To add a new AI provider: implement IAIProvider, add a case in createProvider() in AIService.ts
  • Streaming: use streamAIMessage() or useAIChat().streamMessage() β€” tokens arrive via onToken callback
  • API keys stay in component state only β€” never in source files

Scripts

Command Description
npm start Start Metro bundler
npm run start:fresh Metro with cache reset (use after adding path aliases)
npm run ios iOS simulator
npm run android Android emulator
npm run lint ESLint
npm test Jest

Extending This Boilerplate

Task Files to touch
Add a screen SCREENS const β†’ navigation/index.tsx β†’ new screens/<name>/ folder
Add a shared component shared/components/<name>/RN<Name>.tsx + style + barrel export
Add an AI provider services/ai/providers/<name>.ts β†’ AIService.ts β†’ types.ts
Add a path alias babel.config.js + tsconfig.json β†’ run npm run start:fresh
Add a translation key shared/localization/index.ts (en + tr-TR objects)