feat(18-05): add profile hooks and profile edit UI in settings

- Create usePublicProfile and useUpdateProfile hooks
- Create ProfileSection component with avatar upload, display name, bio
- Add Profile section to settings page (visible when authenticated)

src/client/routes/settings.tsx

@@ -1,5 +1,6 @@
 import { createFileRoute, Link } from "@tanstack/react-router";
 import { useRef, useState } from "react";
+import { ProfileSection } from "../components/ProfileSection";
 import {
 	useApiKeys,
 	useAuth,
@@ -280,7 +281,13 @@ function SettingsPage() {
 				<h1 className="text-xl font-semibold text-gray-900">Settings</h1>
 			</div>
 
-			<div className="bg-white rounded-xl border border-gray-100 p-5 space-y-6">
+			{auth?.user && (
+				<div className="bg-white rounded-xl border border-gray-100 p-5 space-y-6">
+					<ProfileSection />
+				</div>
+			)}
+
+			<div className="bg-white rounded-xl border border-gray-100 p-5 space-y-6 mt-4">
 				<div className="flex items-center justify-between">
 					<div>
 						<h3 className="text-sm font-medium text-gray-900">Weight Unit</h3>