fix: show camera-uploaded images immediately in mobile new post

- Remove 12-item limit so all library images are visible (scrollable grid)
- Track newly uploaded items in recentUploads state so camera captures
  appear instantly without waiting for the API refetch to complete

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
MichaelandClaude Sonnet 4.6 committed 2026-03-25 08:40:16 +01:00
1 parent b353fb6ded
commit be46d43dd6
1 file changed
+13 -9
+13 -9
View File
@@ -110,6 +110,7 @@ export default function NewPostMobile() {
const [productInfo, setProductInfo] = useState(''); const [productInfo, setProductInfo] = useState('');
const [selectedMedia, setSelectedMedia] = useState<string[]>([]); const [selectedMedia, setSelectedMedia] = useState<string[]>([]);
const [recentUploads, setRecentUploads] = useState<Media[]>([]);
const [selectedPages, setSelectedPages] = useState<string[]>([]); const [selectedPages, setSelectedPages] = useState<string[]>([]);
const [scheduledDate, setScheduledDate] = useState<Date | undefined>(undefined); const [scheduledDate, setScheduledDate] = useState<Date | undefined>(undefined);
const [generatedVariants, setGeneratedVariants] = useState<any[]>([]); const [generatedVariants, setGeneratedVariants] = useState<any[]>([]);
@@ -126,14 +127,16 @@ export default function NewPostMobile() {
}); });
const mediaList = useMemo(() => { const mediaList = useMemo(() => {
return [...allMedia] const combined = [
.sort((a, b) => { ...recentUploads,
const dateA = a.createdAt ? new Date(a.createdAt).getTime() : 0; ...allMedia.filter(m => !recentUploads.some(r => r.id === m.id)),
const dateB = b.createdAt ? new Date(b.createdAt).getTime() : 0; ];
return dateB - dateA; return combined.sort((a, b) => {
}) const dateA = a.createdAt ? new Date(a.createdAt).getTime() : 0;
.slice(0, 12); const dateB = b.createdAt ? new Date(b.createdAt).getTime() : 0;
}, [allMedia]); return dateB - dateA;
});
}, [allMedia, recentUploads]);
const { data: scheduledPosts = [] } = useQuery<ScheduledPost[]>({ const { data: scheduledPosts = [] } = useQuery<ScheduledPost[]>({
queryKey: ['/api/scheduled-posts'], queryKey: ['/api/scheduled-posts'],
@@ -150,7 +153,8 @@ export default function NewPostMobile() {
if (!response.ok) throw new Error("Upload failed"); if (!response.ok) throw new Error("Upload failed");
return response.json(); return response.json();
}, },
onSuccess: (data) => { onSuccess: (data: Media) => {
setRecentUploads(prev => [data, ...prev.filter(m => m.id !== data.id)]);
queryClient.invalidateQueries({ queryKey: ["/api/media"] }); queryClient.invalidateQueries({ queryKey: ["/api/media"] });
setSelectedMedia(prev => { setSelectedMedia(prev => {
if (prev.length >= 10) { if (prev.length >= 10) {