# Security Guide

## Current Security Implementation

### Authentication
- JWT tokens stored in localStorage
- Automatic token attachment to API requests via Axios interceptor
- Automatic redirect to login on 401 (Unauthorized) responses
- Token removal on logout

### API Security
- HTTPS enforcement (production requirement)
- CORS configuration on backend
- Error handling for common HTTP status codes (401, 403, 404, 500)
- Network error handling

### Client-Side Protection
- Error boundary for graceful error handling
- Input validation on forms
- XSS protection via React's built-in escaping

## Security Improvements for Production

### 1. Token Storage (High Priority)

**Current Issue:** Tokens in localStorage are vulnerable to XSS attacks.

**Recommended Solution:** Use httpOnly cookies

Backend changes needed:
```javascript
// Set cookie on login
res.cookie('access_token', token, {
  httpOnly: true,
  secure: true, // HTTPS only
  sameSite: 'strict',
  maxAge: 24 * 60 * 60 * 1000 // 24 hours
});
```

Frontend changes:
```typescript
// Remove localStorage token handling
// Cookies are automatically sent with requests
// Update api-client.ts to remove token interceptor
```

### 2. Content Security Policy (CSP)

Add to your hosting platform or nginx configuration:

```
Content-Security-Policy: 
  default-src 'self';
  script-src 'self' 'unsafe-inline' 'unsafe-eval';
  style-src 'self' 'unsafe-inline';
  img-src 'self' data: https:;
  font-src 'self' data:;
  connect-src 'self' https://api.yourdomain.com;
  frame-ancestors 'none';
```

**Note:** Adjust `unsafe-inline` and `unsafe-eval` as you refine your CSP.

### 3. HTTPS Enforcement

**Required for production!**

- Obtain SSL/TLS certificate (Let's Encrypt, Cloudflare, etc.)
- Configure your hosting platform to enforce HTTPS
- Add HSTS header:

```
Strict-Transport-Security: max-age=31536000; includeSubDomains; preload
```

### 4. Input Validation & Sanitization

Always validate and sanitize user inputs:

```typescript
// Example: Email validation
const validateEmail = (email: string): boolean => {
  const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
  return emailRegex.test(email);
};

// Example: Sanitize HTML (if displaying user content)
import DOMPurify from 'dompurify';
const clean = DOMPurify.sanitize(dirty);
```

### 5. Rate Limiting

Implement on backend:
- Login attempts: 5 per 15 minutes per IP
- API calls: 100 per minute per user
- Password reset: 3 per hour per email

Consider using:
- express-rate-limit (Node.js)
- Cloudflare rate limiting
- API Gateway rate limiting (AWS, Azure, GCP)

### 6. Dependency Security

Regular security audits:

```bash
# Check for vulnerabilities
npm audit

# Fix automatically (if possible)
npm audit fix

# Update dependencies
npm update

# Check for outdated packages
npm outdated
```

Set up automated dependency updates:
- Dependabot (GitHub)
- Renovate Bot
- Snyk

### 7. Error Handling

**Don't expose sensitive information in errors:**

```typescript
// Bad
catch (error) {
  toast.error(error.message); // May expose stack traces
}

// Good
catch (error) {
  console.error('Error details:', error); // Log for debugging
  toast.error('An error occurred. Please try again.'); // Generic message
}
```

### 8. Secrets Management

**Never commit secrets to git:**

- Use environment variables
- Use secret management services (AWS Secrets Manager, Azure Key Vault, etc.)
- Add `.env*` to `.gitignore` ✓
- Use different secrets for dev/staging/production

### 9. API Key Protection

If using third-party APIs:

```typescript
// Bad - API key in client code
const API_KEY = 'sk_live_123456789';

// Good - Proxy through your backend
const response = await fetch('/api/proxy/third-party-service', {
  method: 'POST',
  body: JSON.stringify(data)
});
```

### 10. Session Management

Implement proper session handling:

- Session timeout after inactivity (15-30 minutes)
- Logout on browser close (optional)
- Single session per user (optional)
- Session invalidation on password change

```typescript
// Example: Auto-logout on inactivity
let inactivityTimer: NodeJS.Timeout;

const resetInactivityTimer = () => {
  clearTimeout(inactivityTimer);
  inactivityTimer = setTimeout(() => {
    // Logout user
    localStorage.removeItem('access_token');
    window.location.href = '/login';
  }, 30 * 60 * 1000); // 30 minutes
};

// Reset timer on user activity
document.addEventListener('mousemove', resetInactivityTimer);
document.addEventListener('keypress', resetInactivityTimer);
```

## Security Headers Checklist

Configure these headers on your server/hosting platform:

- [x] `X-Frame-Options: SAMEORIGIN` ✓
- [x] `X-Content-Type-Options: nosniff` ✓
- [x] `X-XSS-Protection: 1; mode=block` ✓
- [x] `Referrer-Policy: strict-origin-when-cross-origin` ✓
- [ ] `Strict-Transport-Security: max-age=31536000; includeSubDomains`
- [ ] `Content-Security-Policy: ...`
- [ ] `Permissions-Policy: geolocation=(), microphone=(), camera=()`

## Monitoring & Incident Response

### 1. Error Tracking

Implement error tracking service:

```typescript
// Example: Sentry integration
import * as Sentry from "@sentry/react";

Sentry.init({
  dsn: import.meta.env.VITE_SENTRY_DSN,
  environment: import.meta.env.VITE_ENV,
  tracesSampleRate: 1.0,
});
```

### 2. Security Monitoring

Monitor for:
- Failed login attempts
- Unusual API usage patterns
- Error rate spikes
- Slow response times
- Unauthorized access attempts

### 3. Incident Response Plan

1. **Detection:** Monitor logs and alerts
2. **Assessment:** Determine severity and impact
3. **Containment:** Isolate affected systems
4. **Eradication:** Remove threat
5. **Recovery:** Restore normal operations
6. **Lessons Learned:** Document and improve

## Compliance Considerations

### GDPR (if applicable)
- User data encryption
- Right to be forgotten
- Data export functionality
- Privacy policy
- Cookie consent

### HIPAA (if handling health data)
- Additional encryption requirements
- Audit logging
- Access controls
- Business Associate Agreements

### PCI DSS (if handling payments)
- Never store credit card data in frontend
- Use payment gateway (Stripe, PayPal, etc.)
- Secure transmission (HTTPS)

## Security Testing

### Manual Testing
- [ ] Test authentication flows
- [ ] Test authorization (role-based access)
- [ ] Test input validation
- [ ] Test error handling
- [ ] Test session management

### Automated Testing
- [ ] OWASP ZAP scan
- [ ] npm audit
- [ ] Lighthouse security audit
- [ ] SSL Labs test (https://www.ssllabs.com/ssltest/)

### Penetration Testing
Consider hiring security professionals for:
- Vulnerability assessment
- Penetration testing
- Security code review

## Security Checklist for Production

- [ ] HTTPS enabled with valid certificate
- [ ] All security headers configured
- [ ] CSP implemented
- [ ] Tokens stored securely (httpOnly cookies)
- [ ] Input validation on all forms
- [ ] Rate limiting configured
- [ ] Error tracking service active
- [ ] Regular security audits scheduled
- [ ] Dependency updates automated
- [ ] Secrets properly managed
- [ ] Backup and recovery plan in place
- [ ] Incident response plan documented
- [ ] Team trained on security best practices

## Resources

- [OWASP Top 10](https://owasp.org/www-project-top-ten/)
- [MDN Web Security](https://developer.mozilla.org/en-US/docs/Web/Security)
- [React Security Best Practices](https://react.dev/learn/security)
- [Vite Security](https://vitejs.dev/guide/security.html)

## Reporting Security Issues

If you discover a security vulnerability:

1. **Do not** open a public issue
2. Email security@yourdomain.com
3. Include detailed description and steps to reproduce
4. Allow reasonable time for fix before disclosure

## Regular Security Tasks

### Daily
- Monitor error logs
- Check failed login attempts

### Weekly
- Review security alerts
- Check for dependency updates

### Monthly
- Run security audit: `npm audit`
- Update dependencies
- Review access logs

### Quarterly
- Security training for team
- Review and update security policies
- Penetration testing (if budget allows)

### Annually
- Comprehensive security audit
- Update incident response plan
- Review compliance requirements