Function useFrustumTexture

src/hooks/useFrustumTexture.ts:266–318

(
  imageFile: File | undefined,
  imageName: string,
  enabled: boolean
)

 * @returns The loaded texture or null
 */
export function useFrustumTexture(
  imageFile: File | undefined,
  imageName: string,
  enabled: boolean
): THREE.Texture | null {
  const cacheVersion = useSyncExternalStore(
    subscribeFrustumTextureCacheChanges,
    getFrustumTextureCacheVersion,
    getFrustumTextureCacheVersion
  );
  void cacheVersion;

  useEffect(() => {
    if (!enabled || !imageFile) return;
    if (getCachedFrustumBitmap(bitmapCache, imageName)) return;
    void loadFrustumBitmapFromFile(imageFile, imageName);
  }, [enabled, imageFile, imageName]);

  const cachedBitmap = enabled ? getCachedFrustumBitmap(bitmapCache, imageName) : null;
  const cacheToken = cachedBitmap ? `bitmap:${imageName}` : null;
  const resourceRef = useRef<FrustumTextureResource | null>(null);
  resourceRef.current ??= createFrustumTextureResource({
    getCachedTexture: getCachedFrustumTexture,
    getOrLoadBitmap,
    createTextureFromBitmap,
  });
  const resource = resourceRef.current;
  const snapshot = useSyncExternalStore(
    resource.subscribe,
    resource.getSnapshot,
    resource.getSnapshot
  );
  const cacheKey = getFrustumTextureCacheKey(cacheToken, imageName, enabled);

  useEffect(() => {
    resource.sync({
      cachedUrl: cacheToken,
      enabled,
      imageName,
    });
  }, [cacheToken, enabled, imageName, resource]);

  const texture = snapshot.cacheKey === cacheKey ? snapshot.texture : null;

  // Update lastUsed time when texture is accessed
  useEffect(() => {
    if (texture && imageName) {
      touchActiveFrustumTexture(activeTextures, imageName);
    }
  }, [texture, imageName]);

  return texture;
}

/**
 * Hook to get a high-resolution texture for the selected image.