fix: File manager not showing all files

This commit is contained in:
Naterfute
2026-01-15 10:53:15 -08:00
parent 9074e11ef6
commit 1bf979c4ea

View File

@@ -1,7 +1,6 @@
import { hashToPath } from '@/helpers';
import { useVirtualizer } from '@tanstack/react-virtual';
import debounce from 'debounce';
import { For } from 'million/react';
import { useEffect, useRef, useState } from 'react';
import { useLocation } from 'react-router-dom';
@@ -85,7 +84,7 @@ const FileManagerContainer = () => {
searchInputRef.current.value = '';
}
}, [hash, pathname, directory]);
console.log(filesArray);
const rowVirtualizer = useVirtualizer({
// count: 10000,
count: filesArray.length,
@@ -140,40 +139,56 @@ const FileManagerContainer = () => {
<p className={`text-sm text-zinc-400 text-center`}>This folder is empty.</p>
) : (
<>
<div ref={parentRef}>
<div className='p-1 border-[1px] border-[#ffffff12] rounded-md sm:ml-12 sm:mr-12 mx-2'>
<svg
xmlns='http://www.w3.org/2000/svg'
fill='none'
viewBox='0 0 24 24'
strokeWidth={1.5}
stroke='currentColor'
className='w-5 h-5 absolute top-1/2 -translate-y-1/2 left-5 opacity-40'
>
<path
strokeLinecap='round'
strokeLinejoin='round'
d='m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z'
/>
</svg>
<input
ref={searchInputRef}
className='pl-14 py-4 w-full rounded-lg bg-[#ffffff11] text-sm font-bold'
type='text'
placeholder='Search...'
onChange={(event) => debouncedSearchTerm(event.target.value)}
/>
</div>
<div ref={parentRef} className='max-h-[60vh] overflow-auto'>
<div
data-pyro-file-manager-files
className='p-1 border-[1px] border-[#ffffff12] rounded-xl sm:ml-12 sm:mr-12 mx-2 bg-[radial-gradient(124.75%_124.75%_at_50.01%_-10.55%,_rgb(16,16,16)_0%,rgb(4,4,4)_100%)]'
style={{ height: `${rowVirtualizer.getTotalSize()}px` }}
>
<div className='relative w-full h-full mb-1'>
<svg
xmlns='http://www.w3.org/2000/svg'
fill='none'
viewBox='0 0 24 24'
strokeWidth={1.5}
stroke='currentColor'
className='w-5 h-5 absolute top-1/2 -translate-y-1/2 left-5 opacity-40'
>
<path
strokeLinecap='round'
strokeLinejoin='round'
d='m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z'
/>
</svg>
<input
ref={searchInputRef}
className='pl-14 py-4 w-full rounded-lg bg-[#ffffff11] text-sm font-bold'
type='text'
placeholder='Search...'
onChange={(event) => debouncedSearchTerm(event.target.value)}
/>
</div>
<div className='w-full overflow-hidden rounded-lg gap-0.5 flex flex-col'>
<div
className='w-full overflow-hidden rounded-lg gap-0.5 flex flex-col'
style={{
height: `${rowVirtualizer.getTotalSize()}px`,
width: '100%',
position: 'relative',
}}
>
{rowVirtualizer.getVirtualItems().map((item) => {
if (filesArray[item.index] !== undefined) {
return (
<div key={item.key} className='w-full'>
<div
key={item.key}
className='w-full absolute left-0 top-0'
style={{
height: `${item.size}px`,
transform: `translateY(${item.start}px)`,
}}
>
<FileObjectRow
// @ts-expect-error - Legacy type suppression
file={filesArray[item.index]}