React MobX

1// React + MobX .cursorrules
2 
3// Prefer functional components with hooks
4 
5const preferFunctionalComponents = true;
6 
7// MobX best practices
8 
9const mobxBestPractices = [
10  "Use MobX-react-lite for optimal performance with functional components",
11  "Implement stores for managing application state",
12  "Utilize computed values for derived state",
13  "Use actions for modifying observable state",
14  "Implement proper error handling in asynchronous actions",
15];
16 
17// Folder structure
18 
19const folderStructure = `
20src/
21  components/
22  stores/
23  hooks/
24  pages/
25  utils/
26`;
27 
28// Additional instructions
29 
30const additionalInstructions = `
311. Use TypeScript for type safety with MobX
322. Implement strict mode for MobX for better debugging
333. Use observer HOC or useObserver hook for reactive components
344. Implement proper dependency injection for stores
355. Use reaction for side-effects based on observable changes
366. Utilize MobX DevTools for debugging
377. Follow MobX best practices for scalable state management
38`;
39 
40