fix image uploads

src/components/FollowingItem.svelte

···
-<script lang="ts" module>
-	const profileCache = new SvelteMap<string, { displayName?: string; handle: string }>();
-</script>
-
 <script lang="ts">
 	import ProfilePicture from './ProfilePicture.svelte';
 	import BlockedUserIndicator from './BlockedUserIndicator.svelte';
···
 	import type { Did } from '@atcute/lexicons';
 	import type { calculateFollowedUserStats, Sort } from '$lib/following';
 	import { resolveDidDoc, type AtpClient } from '$lib/at/client.svelte';
-	import { SvelteMap } from 'svelte/reactivity';
-	import { router, getBlockRelationship } from '$lib/state.svelte';
+	import { router, getBlockRelationship, profiles, handles } from '$lib/state.svelte';
 	import { map } from '$lib/result';
 
 	interface Props {
···
 	);
 	const isBlocked = $derived(blockRel.userBlocked || blockRel.blockedByTarget);
 
-	const cached = $derived(profileCache.get(did));
-	const displayName = $derived(cached?.displayName);
-	const handle = $derived(cached?.handle ?? 'handle.invalid');
+	const displayName = $derived(profiles.get(did)?.displayName);
+	const handle = $derived(handles.get(did) ?? 'loading...');
 
 	let error = $state('');
 
 	const loadProfile = async (targetDid: Did) => {
-		if (profileCache.has(targetDid)) return;
+		if (profiles.has(targetDid) && handles.has(targetDid)) return;
 
 		try {
 			const [profileRes, handleRes] = await Promise.all([
···
 			]);
 			if (did !== targetDid) return;
 
-			profileCache.set(targetDid, {
-				handle: handleRes.ok ? handleRes.value : handle,
-				displayName: profileRes.ok ? profileRes.value.displayName : displayName
-			});
+			if (profileRes.ok) profiles.set(targetDid, profileRes.value);
+			if (handleRes.ok) handles.set(targetDid, handleRes.value);
+			else handles.set(targetDid, 'handle.invalid');
 		} catch (e) {
 			if (did !== targetDid) return;
 			console.error(`failed to load profile for ${targetDid}`, e);

src/components/PostComposer.svelte

···
 	);
 
 	const uploadVideo = async (blobUrl: string, mimeType: string) => {
-		const blob = await (await fetch(blobUrl)).blob();
-		return await client.uploadVideo(blob, mimeType, (status) => {
+		const file = await (await fetch(blobUrl)).blob();
+		return await client.uploadVideo(file, mimeType, (status) => {
 			if (status.stage === 'uploading' && status.progress !== undefined) {
 				_state.blobsState.set(blobUrl, { state: 'uploading', progress: status.progress * 0.5 });
 			} else if (status.stage === 'processing' && status.progress !== undefined) {
···
 		});
 	};
 	const uploadImage = async (blobUrl: string) => {
-		const blob = await (await fetch(blobUrl)).blob();
-		return await client.uploadBlob(blob, (progress) => {
+		const file = await (await fetch(blobUrl)).blob();
+		return await client.uploadBlob(file, (progress) => {
 			_state.blobsState.set(blobUrl, { state: 'uploading', progress });
 		});
 	};
···
 					video: upload.blob
 				};
 		}
-		console.log('media', media);
+		// console.log('media', media);
 
 		const record: AppBskyFeedPost.Main = {
 			$type: 'app.bsky.feed.post',
···
 	let fileInputEl: HTMLInputElement | undefined = $state();
 	let selectingFile = $state(false);
 
+	const canUpload = $derived(
+		!(
+			_state.attachedMedia?.$type === 'app.bsky.embed.video' ||
+			(_state.attachedMedia?.$type === 'app.bsky.embed.images' &&
+				_state.attachedMedia.images.length >= 4)
+		)
+	);
+
 	const unfocus = () => (_state.focus = 'null');
 
 	const handleFiles = (files: File[]) => {
-		if (!files || files.length === 0) return;
+		if (!canUpload || !files || files.length === 0) return;
 
 		const existingImages =
 			_state.attachedMedia?.$type === 'app.bsky.embed.images' ? _state.attachedMedia.images : [];
···
 			};
 		}
 
-		const handleUpload = (blobUrl: string, blob: Result<AtpBlob<string>, string>) => {
-			if (blob.ok) _state.blobsState.set(blobUrl, { state: 'uploaded', blob: blob.value });
-			else _state.blobsState.set(blobUrl, { state: 'error', message: blob.error });
+		const handleUpload = (blobUrl: string, res: Result<AtpBlob<string>, string>) => {
+			if (res.ok) _state.blobsState.set(blobUrl, { state: 'uploaded', blob: res.value });
+			else _state.blobsState.set(blobUrl, { state: 'error', message: res.error });
 		};
 
 		const media = _state.attachedMedia;
···
 				fileInputEl?.click();
 			}}
 			onmousedown={(e) => e.preventDefault()}
-			disabled={_state.attachedMedia?.$type === 'app.bsky.embed.video' ||
-				(_state.attachedMedia?.$type === 'app.bsky.embed.images' &&
-					_state.attachedMedia.images.length >= 4)}
+			disabled={!canUpload}
 			class="rounded-sm p-1.5 transition-all duration-150 enabled:hover:scale-110 disabled:cursor-not-allowed disabled:opacity-50"
 			style="background: color-mix(in srgb, {color} 15%, transparent); color: {color};"
 			title="attach media"

src/lib/at/client.svelte.ts

···
 			(uploaded, total) => onProgress?.(uploaded / total)
 		);
 		if (!result.ok) return err(`upload failed: ${result.error.message}`);
-		return ok(result.value);
+		return ok(result.value.blob);
 	}
 
 	async uploadVideo(