55 lines
1.6 KiB
JavaScript
55 lines
1.6 KiB
JavaScript
import { useEffect, useState } from "react";
|
|
|
|
// Helper function to load either file or default data
|
|
// into a URL and ensure that it is revoked if needed
|
|
function useDataSource(data, defaultSources, unknownSource) {
|
|
const [dataSource, setDataSource] = useState(null);
|
|
useEffect(() => {
|
|
if (!data) {
|
|
setDataSource(unknownSource);
|
|
return;
|
|
}
|
|
let url = unknownSource;
|
|
if (data.type === "file") {
|
|
if (data.resolutions) {
|
|
// Check is a resolution is specified
|
|
if (data.quality && data.resolutions[data.quality]) {
|
|
url = URL.createObjectURL(
|
|
new Blob([data.resolutions[data.quality].file])
|
|
);
|
|
}
|
|
// If no file available fallback to the highest resolution
|
|
else if (!data.file) {
|
|
const resolutionArray = Object.keys(data.resolutions);
|
|
url = URL.createObjectURL(
|
|
new Blob([
|
|
data.resolutions[resolutionArray[resolutionArray.length - 1]]
|
|
.file,
|
|
])
|
|
);
|
|
} else {
|
|
url = URL.createObjectURL(new Blob([data.file]));
|
|
}
|
|
} else {
|
|
url = URL.createObjectURL(new Blob([data.file]));
|
|
}
|
|
} else if (data.type === "default") {
|
|
url = defaultSources[data.key];
|
|
}
|
|
setDataSource(url);
|
|
|
|
return () => {
|
|
if (data.type === "file" && url) {
|
|
// Remove file url after 5 seconds as we still may be using it while the next image loads
|
|
setTimeout(() => {
|
|
URL.revokeObjectURL(url);
|
|
}, 5000);
|
|
}
|
|
};
|
|
}, [data, defaultSources, unknownSource]);
|
|
|
|
return dataSource;
|
|
}
|
|
|
|
export default useDataSource;
|