);
}
function QuickCardsScreen() {
const rows = useStoreQC('quick_cards');
const uploadedCards = rows.filter(card => card && card.uploaded === true)
.slice().sort((a, b) => String(b.created_at || '').localeCompare(String(a.created_at || '')));
const fileInput = React.useRef(null);
const viewerRef = React.useRef(null);
const openRequest = React.useRef(0);
const pendingOpenCard = React.useRef(null);
const [headerLightbox, setHeaderLightbox] = React.useState(null);
const [viewer, setViewer] = React.useState(null);
const [openingId, setOpeningId] = React.useState(null);
const [deletingId, setDeletingId] = React.useState(null);
const [uploading, setUploading] = React.useState(false);
const [message, setMessage] = React.useState(null);
const CHIBI_QC = `${ASSET_QC}/chibi/chibi-quickcards.png`;
React.useEffect(() => { viewerRef.current = viewer; }, [viewer]);
React.useEffect(() => () => {
openRequest.current += 1;
pendingOpenCard.current = null;
const current = viewerRef.current;
if (current && current.ownedUrl) revokeDocUrl(current.src);
}, []);
const replaceViewer = (next) => {
const current = viewerRef.current;
if (current && current.ownedUrl) revokeDocUrl(current.src);
viewerRef.current = next;
setViewer(next);
};
const closeViewer = () => replaceViewer(null);
// Realtime can remove a card while its full-size URL is resolving or already open.
// Only the separately owned viewer URL is revoked here; preview URLs stay with
// UploadedPreview and are cleaned by that component when its row unmounts.
React.useEffect(() => {
const liveIds = new Set(uploadedCards.map(card => card.id));
const pendingId = pendingOpenCard.current;
if (pendingId && !liveIds.has(pendingId)) {
openRequest.current += 1;
pendingOpenCard.current = null;
setOpeningId(null);
}
const current = viewerRef.current;
if (current && current.uploaded && !liveIds.has(current.cardId)) {
replaceViewer(null);
}
}, [rows]);
const openBundled = (card) => {
openRequest.current += 1;
pendingOpenCard.current = null;
setOpeningId(null);
replaceViewer({ src:card.src, alt:card.alt, filename:referenceFilename(card), ownedUrl:false, uploaded:false, cardId:card.id });
};
const openUploaded = async (card) => {
const request = ++openRequest.current;
pendingOpenCard.current = card.id;
setOpeningId(card.id);
setMessage(null);
try {
const url = await resolveDocUrl({ path:card.storage_path, contentType:card.content_type });
if (request !== openRequest.current) { revokeDocUrl(url); return; }
if (!url) throw new Error('התמונה אינה זמינה במטמון. התחברו לאינטרנט ונסו שוב.');
pendingOpenCard.current = null;
replaceViewer({ src:url, alt:uploadedAlt(card), filename:referenceFilename(card), ownedUrl:true, uploaded:true, cardId:card.id });
} catch (error) {
if (request === openRequest.current) setMessage({ kind:'error', text:errorText(error, 'לא הצלחנו לפתוח את התמונה.') });
} finally {
if (request === openRequest.current) {
pendingOpenCard.current = null;
setOpeningId(null);
}
}
};
const chooseFile = () => {
setMessage(null);
fileInput.current?.click();
};
const onFile = async (event) => {
const input = event.currentTarget;
const file = input.files && input.files[0];
input.value = '';
if (!file) return;
if (!file.type || !file.type.toLowerCase().startsWith('image/')) {
setMessage({ kind:'error', text:'אפשר להעלות קובץ תמונה בלבד.' });
return;
}
const suggested = titleFromFilename(file.name) || 'תמונה שימושית';
let title = window.prompt('הזינו כותרת בעברית לתמונה:', suggested);
while (title !== null && !title.trim()) {
title = window.prompt('חובה להזין כותרת. הזינו כותרת בעברית:', suggested);
}
if (title === null) return;
setUploading(true);
setMessage({ kind:'status', text:'מעלים את התמונה…' });
try {
await uploadQuickCard(file, title.trim());
setMessage({ kind:'success', text:'התמונה עלתה ומסונכרנת לשניכם.' });
} catch (error) {
setMessage({ kind:'error', text:errorText(error, 'לא הצלחנו להעלות את התמונה.') });
} finally { setUploading(false); }
};
const removeUploaded = async (card) => {
if (!window.confirm(`למחוק את «${card.title}» אצל שני המטיילים?`)) return;
openRequest.current += 1;
pendingOpenCard.current = null;
setOpeningId(null);
setDeletingId(card.id);
setMessage(null);
try {
await deleteQuickCard(card);
if (viewerRef.current && viewerRef.current.cardId === card.id) closeViewer();
setMessage({ kind:'success', text:'התמונה נמחקה.' });
} catch (error) {
setMessage({ kind:'error', text:errorText(error, 'לא הצלחנו למחוק את התמונה. היא נשארה ברשימה.') });
} finally { setDeletingId(null); }
};
return (