|
|
import { useMemo, useRef } from 'react'; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
export const useOpacityCache = () => { |
|
|
const opacityCacheRef = useRef(new Map()); |
|
|
|
|
|
|
|
|
const getOpacity = useMemo(() => { |
|
|
return (font, filter, searchTerm, selectedFont) => { |
|
|
|
|
|
const cacheKey = `${font.name}-${filter}-${searchTerm}-${selectedFont?.name || 'none'}`; |
|
|
|
|
|
|
|
|
if (opacityCacheRef.current.has(cacheKey)) { |
|
|
return opacityCacheRef.current.get(cacheKey); |
|
|
} |
|
|
|
|
|
|
|
|
const familyMatch = filter === 'all' || font.family === filter; |
|
|
const searchMatch = !searchTerm || |
|
|
font.name.toLowerCase().includes(searchTerm.toLowerCase()) || |
|
|
font.family.toLowerCase().includes(searchTerm.toLowerCase()); |
|
|
const isActive = selectedFont && selectedFont.name === font.name; |
|
|
|
|
|
const opacity = isActive ? 1 : (familyMatch && searchMatch ? 1 : 0.2); |
|
|
|
|
|
|
|
|
if (opacityCacheRef.current.size > 10000) { |
|
|
opacityCacheRef.current.clear(); |
|
|
} |
|
|
opacityCacheRef.current.set(cacheKey, opacity); |
|
|
|
|
|
return opacity; |
|
|
}; |
|
|
}, []); |
|
|
|
|
|
|
|
|
const invalidateCache = () => { |
|
|
opacityCacheRef.current.clear(); |
|
|
}; |
|
|
|
|
|
return { |
|
|
getOpacity, |
|
|
invalidateCache |
|
|
}; |
|
|
}; |
|
|
|