c7b4001c3d
Migrating rules to new format but they should be re-written entirely, I don't think they help much and are not auto-included (except architecture)
104 lines
2.5 KiB
Plaintext
104 lines
2.5 KiB
Plaintext
---
|
|
description:
|
|
globs:
|
|
alwaysApply: false
|
|
---
|
|
# Code Style Guidelines
|
|
|
|
## Formatting Standards
|
|
- **Prettier**: 2-space indentation, single quotes, trailing commas, semicolons
|
|
- **Print width**: 80 characters
|
|
- **ESLint**: No unused imports, consistent import ordering, prefer const over let
|
|
|
|
## Naming Conventions
|
|
```typescript
|
|
// ✅ Variables and functions - camelCase
|
|
const userAccountBalance = 1000;
|
|
const calculateMonthlyPayment = () => {};
|
|
|
|
// ✅ Constants - SCREAMING_SNAKE_CASE
|
|
const API_ENDPOINTS = {
|
|
USERS: '/api/users',
|
|
ORDERS: '/api/orders',
|
|
} as const;
|
|
|
|
// ✅ Types and Classes - PascalCase
|
|
class UserService {}
|
|
type UserAccountData = {};
|
|
type ButtonProps = {}; // Component props suffix with 'Props'
|
|
|
|
// ✅ Files and directories - kebab-case
|
|
// user-profile.component.tsx
|
|
// user-profile.styles.ts
|
|
```
|
|
|
|
## Import Organization
|
|
```typescript
|
|
// ✅ Correct import order
|
|
// 1. External libraries
|
|
import React from 'react';
|
|
import { useCallback } from 'react';
|
|
import styled from 'styled-components';
|
|
|
|
// 2. Internal modules (absolute paths)
|
|
import { Button } from '@/components/ui';
|
|
import { UserService } from '@/services';
|
|
|
|
// 3. Relative imports
|
|
import { UserCardProps } from './types';
|
|
```
|
|
|
|
## Function Structure
|
|
```typescript
|
|
// ✅ Small, focused functions
|
|
// ✅ Required parameters first, optional last
|
|
const processUserData = (
|
|
user: User,
|
|
options: ProcessingOptions,
|
|
callback?: (result: ProcessedUser) => void
|
|
): ProcessedUser => {
|
|
const processedUser = transformUserData(user);
|
|
applyOptions(processedUser, options);
|
|
|
|
if (callback) {
|
|
callback(processedUser);
|
|
}
|
|
|
|
return processedUser;
|
|
};
|
|
```
|
|
|
|
## Comments
|
|
```typescript
|
|
// ✅ Explain business logic and non-obvious intentions
|
|
// Apply 15% discount for premium users with orders > $100
|
|
const discount = isPremiumUser && orderTotal > 100 ? 0.15 : 0;
|
|
|
|
// TODO: Replace with proper authentication service
|
|
const isAuthenticated = localStorage.getItem('token') !== null;
|
|
|
|
/**
|
|
* JSDoc for public APIs
|
|
* @param basePrice - The base price before modifications
|
|
* @returns The final price after tax and discount
|
|
*/
|
|
const calculateTotalPrice = (basePrice: number): number => {
|
|
// Implementation
|
|
};
|
|
```
|
|
|
|
## Error Handling
|
|
```typescript
|
|
// ✅ Proper error types and meaningful messages
|
|
try {
|
|
const user = await userService.findById(userId);
|
|
if (!user) {
|
|
throw new UserNotFoundError(`User with ID ${userId} not found`);
|
|
}
|
|
return user;
|
|
} catch (error) {
|
|
logger.error('Failed to fetch user', { userId, error });
|
|
throw error;
|
|
}
|
|
```
|