feat: implement user avatars with DiceBear integration

- Add avatar_url field to MemberSettingsUpdate schema
- Create AvatarService for generating default avatars using DiceBear
- Update auth service to generate avatars on user registration
- Add avatar upload UI to settings page
- Update settings endpoint to handle avatar URL updates
- Display current avatar in settings with upload/generate options

Generated by Mistral Vibe.
Co-Authored-By: Mistral Vibe <vibe@mistral.ai>

TYPESCRIPT_FIX_SUMMARY.md

@@ -0,0 +1,92 @@
+# TypeScript Fix Summary
+
+## Error Fixed
+```
+src/pages/SongPage.tsx(212,43): error TS2345: Argument of type 'number | null' is not assignable to parameter of type 'number'.
+  Type 'null' is not assignable to type 'number'.
+```
+
+## Root Cause
+The `seekTo` function in `useWaveform.ts` expects a parameter of type `number`:
+```typescript
+const seekTo = (time: number) => { ... }
+```
+
+But we were trying to pass `c.timestamp` which is of type `number | null`:
+```typescript
+onClick={() => seekTo(c.timestamp)}  // ❌ Error: c.timestamp could be null
+```
+
+## Solution Applied
+Added non-null assertion operator `!` since we already check that timestamp is not null:
+```typescript
+{c.timestamp !== undefined && c.timestamp !== null && (
+  <button onClick={() => seekTo(c.timestamp!)}>  {/* ✅ Fixed */}
+    {formatTime(c.timestamp)}
+  </button>
+)}
+```
+
+## Why This is Safe
+1. **Runtime check**: We only render the button when `c.timestamp !== null`
+2. **Type safety**: The `!` operator tells TypeScript "I know this isn't null"
+3. **Logical consistency**: If we're showing the timestamp button, we must have a valid timestamp
+
+## Type Flow
+```typescript
+// Interface definition
+interface SongComment {
+  timestamp: number | null;  // Can be null for old comments
+}
+
+// Usage with safety check
+{c.timestamp !== null && (
+  <button onClick={() => seekTo(c.timestamp!)}>  // Safe because of the check
+    {formatTime(c.timestamp)}
+  </button>
+)}
+
+// Function signature
+const seekTo = (time: number) => { ... }  // Requires number, not number | null
+```
+
+## Other Considerations
+
+### CommentMarker Interface
+The `CommentMarker` interface also expects `time: number`:
+```typescript
+export interface CommentMarker {
+  id: string;
+  time: number; // Time in seconds
+  onClick: () => void;
+  icon?: string;
+}
+```
+
+But this is safe because we only call `addMarker` when timestamp is not null:
+```typescript
+if (comment.timestamp !== undefined && comment.timestamp !== null) {
+  addMarker({
+    id: comment.id,
+    time: comment.timestamp,  // ✅ Safe: we checked it's not null
+    // ...
+  });
+}
+```
+
+### FormatTime Function
+The `formatTime` function also expects a `number`, but this is safe for the same reason:
+```typescript
+{formatTime(c.timestamp)}  // ✅ Safe: only called when timestamp !== null
+```
+
+## Backward Compatibility
+- **Old comments** (timestamp = null): No timestamp button shown, no markers created ✅
+- **New comments** (timestamp = number): Timestamp button shown, markers created ✅
+- **Type safety**: Maintained throughout the codebase ✅
+
+## Testing Recommendations
+1. **Test with old comments**: Verify no errors when timestamp is null
+2. **Test with new comments**: Verify timestamp button works correctly
+3. **Check TypeScript compilation**: Run `npm run check` to ensure no type errors
+4. **Test marker creation**: Verify markers only created for comments with timestamps