Fix: thumbnail border styles and auto-refresh logic
All checks were successful
Automated Container Build / build-and-push (push) Successful in 41s
All checks were successful
Automated Container Build / build-and-push (push) Successful in 41s
This commit is contained in:
parent
a87bb351d0
commit
d8526afd45
3 changed files with 20 additions and 3 deletions
|
|
@ -375,6 +375,17 @@ export default function FileExplorer({ onLogout }: FileExplorerProps) {
|
||||||
}
|
}
|
||||||
}, [currentPath, activeSection]);
|
}, [currentPath, activeSection]);
|
||||||
|
|
||||||
|
// Refresh files after editing to catch the debounced thumbnail generation
|
||||||
|
useEffect(() => {
|
||||||
|
if (!editingFile && activeSection === 'files') {
|
||||||
|
loadFiles(currentPath, true);
|
||||||
|
const timer = setTimeout(() => {
|
||||||
|
loadFiles(currentPath, true);
|
||||||
|
}, 12000);
|
||||||
|
return () => clearTimeout(timer);
|
||||||
|
}
|
||||||
|
}, [editingFile, activeSection, currentPath, loadFiles]);
|
||||||
|
|
||||||
const loadFolderTree = useCallback(async () => {
|
const loadFolderTree = useCallback(async () => {
|
||||||
try {
|
try {
|
||||||
const data = await api.getFolderTree();
|
const data = await api.getFolderTree();
|
||||||
|
|
|
||||||
|
|
@ -122,6 +122,12 @@ export default function OfficeHome({ type, onFileSelect, onCreateBlank, onPinCha
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
fetchFiles();
|
fetchFiles();
|
||||||
api.createDownloadToken().then(setDownloadToken).catch(console.error);
|
api.createDownloadToken().then(setDownloadToken).catch(console.error);
|
||||||
|
|
||||||
|
// Refresh files after 12 seconds to catch any debounced thumbnail updates from recent edits
|
||||||
|
const timer = setTimeout(() => {
|
||||||
|
fetchFiles();
|
||||||
|
}, 12000);
|
||||||
|
return () => clearTimeout(timer);
|
||||||
}, [type]);
|
}, [type]);
|
||||||
|
|
||||||
// Close context menu on click elsewhere
|
// Close context menu on click elsewhere
|
||||||
|
|
|
||||||
|
|
@ -18,10 +18,10 @@ export default function ThumbnailImage({ checksum, fallbackIcon, downloadToken }
|
||||||
key={key}
|
key={key}
|
||||||
src={downloadToken ? `${api.getThumbnailUrl(checksum, downloadToken)}${errorCount > 0 ? `&t=${key}` : ''}` : ''}
|
src={downloadToken ? `${api.getThumbnailUrl(checksum, downloadToken)}${errorCount > 0 ? `&t=${key}` : ''}` : ''}
|
||||||
alt=""
|
alt=""
|
||||||
className="w-full h-full object-contain"
|
className="w-full h-full object-contain bg-white border border-black/10 dark:border-white/10 shadow-sm rounded-sm"
|
||||||
style={{ display: showFallback ? 'none' : 'block' }}
|
style={{ display: showFallback ? 'none' : 'block', padding: '2px' }}
|
||||||
onError={(e) => {
|
onError={(e) => {
|
||||||
if (errorCount < 5) {
|
if (errorCount < 20) {
|
||||||
e.currentTarget.style.display = 'none';
|
e.currentTarget.style.display = 'none';
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
setErrorCount(c => c + 1);
|
setErrorCount(c => c + 1);
|
||||||
|
|
|
||||||
Reference in a new issue