24 lines
770 B
TypeScript
24 lines
770 B
TypeScript
import { useEffect, useState } from 'react';
|
|
|
|
/**
|
|
* Creates an object URL for a Blob/File and revokes it when the source changes
|
|
* or the component unmounts. Returns null when given null.
|
|
*/
|
|
export function useObjectUrl(source: Blob | null): string | null {
|
|
const [url, setUrl] = useState<string | null>(null);
|
|
|
|
useEffect(() => {
|
|
if (!source) return;
|
|
const objectUrl = URL.createObjectURL(source);
|
|
// Intended external-resource publish to sync, not a render cascade.
|
|
// eslint-disable-next-line react-hooks/set-state-in-effect
|
|
setUrl(objectUrl);
|
|
return () => {
|
|
URL.revokeObjectURL(objectUrl);
|
|
setUrl(null); // in cleanup, not the effect body — so no suppression needed
|
|
};
|
|
}, [source]);
|
|
|
|
return source ? url : null;
|
|
}
|