feat: image compress before upload

components/profile/profile-edit-form.tsx

@@ -20,6 +20,7 @@ import Image from "next/image";
 import { ImagePlus, Save, X } from "lucide-react";
 import { useAuth } from "@/components/auth/auth-provider";
 import { auth, AuthError, type User } from "@/lib/auth";
+import { compressImage } from "@/lib/compress-image";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
@@ -74,7 +75,11 @@ export function ProfileEditForm({
     setError(null);
     setUploading(true);
     try {
-      const publicURL = await auth.uploadAvatar(file);
+      // Avatars display at ≤ 200 px in every surface, so cap the
+      // longest edge at 800 px — plenty of retina headroom while
+      // keeping the stored bytes small.
+      const compressed = await compressImage(file, { maxDimension: 800 });
+      const publicURL = await auth.uploadAvatar(compressed);
       setAvatarUrl(publicURL);
     } catch (err) {
       setError(err instanceof AuthError ? err.message : "Upload failed.");