Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 | 4x 51x 51x 51x 51x 16x 16x 16x 16x 16x 16x 16x 16x 16x 51x 2x 2x 2x 2x 2x 2x 2x 51x 51x 51x 51x 51x 51x 4x 18x 23x | import { showMessage } from "@common/Toast";
import { useEffect, useState } from "react";
import {
TChangeFileDirection,
TDocument,
TFileNavigation,
} from "@common/FilePreview/types";
import {
isValidExtension,
sanitizeList,
} from "@common/FilePreview/utils/fileList.utils";
const useDocumentListV2 = (
list: TDocument[],
file?: TDocument,
handleClose?: () => void,
) => {
const [documentList, setDocumentList] = useState<TDocument[]>([]);
const [currentIndex, setCurrentIndex] = useState<number>(0);
const [currentFile, setCurrentFile] = useState<TDocument | null>(
file || null,
);
useEffect(() => {
const filteredList = sanitizeList(list);
Iif (filteredList.length === 0) {
handleClose?.();
showMessage(
"Error",
"The provided list does not contain any supported file",
);
}
Iif (file?.type && !isValidExtension(file.type)) {
handleClose?.();
showMessage(
"Error",
"The preview for the provided file is not supported",
);
}
setDocumentList(filteredList);
Eif (file !== undefined) {
const index = getFileIndex(file, filteredList);
const fileIndex = index !== -1 ? index : 0;
setCurrentIndex(fileIndex);
setCurrentFile(filteredList[fileIndex]);
}
}, [list]);
const handleFileChange: TChangeFileDirection = (direction, deleteFile) => {
Iif (!currentFile) return;
const index = getFileIndex(currentFile, documentList);
Iif (
(index === 0 && direction === "prev") ||
(index === documentList.length - 1 && direction === "next")
)
return;
const newIndex = direction === "prev" ? index - 1 : index + 1;
setCurrentFile(documentList[newIndex]);
setCurrentIndex(newIndex);
Iif (deleteFile) {
updatePreviewList(deleteFile, documentList[newIndex]);
}
};
const updatePreviewList = (
file: TDocument | null,
nextFile: TDocument | null,
) => {
if (!file?.id) return documentList;
const newList = documentList.filter((item) => item.id !== file?.id);
setDocumentList(newList);
nextFile && setCurrentIndex(getFileIndex(nextFile, newList));
return newList;
};
const displayNavigation =
!currentFile || (!!currentFile && currentIndex !== -1);
const hasPrevElements = currentIndex > 0;
const hasNextElements = currentIndex < documentList.length - 1;
const navigation: TFileNavigation = {
showPrev: displayNavigation && hasPrevElements,
showNext: displayNavigation && hasNextElements,
changeFile: handleFileChange,
handleClose: handleClose,
};
return {
currentFile,
currentIndex,
navigation,
};
};
export default useDocumentListV2;
const getFileIndex = (file?: TDocument, list?: TDocument[]) =>
list?.findIndex(
(f) =>
f.name === file?.name && f.type === file?.type && f.URL === file?.URL,
) ?? -1;
|