IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

EmptyState: Don't apply animation when prefers-reduced-motion is set (#87638)

Browse Source 
* don't apply animation when prefers-reduced-motion is set

* bail quicker

* early return
This commit is contained in:
Ashley Harrison 2024-05-13 10:48:41 +01:00 committed by GitHub
parent b214f9cc3a
commit 2cdb7d923f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 5 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/grafana-ui/src/components/EmptyState/GrotNotFound/GrotNotFound.tsx
View File

@ -24,6 +24,11 @@ export const GrotNotFound = ({ width = 'auto', height }: Props) => {
useEffect(() => { useEffect(() => {
const handleMouseMove = (event: MouseEvent) => { const handleMouseMove = (event: MouseEvent) => {
// don't apply animation if reduced motion preference is set
if (window.matchMedia('(prefers-reduced-motion: reduce').matches) {
return;
}
const grotArm = svgRef.current?.querySelector('#grot-not-found-arm'); const grotArm = svgRef.current?.querySelector('#grot-not-found-arm');
const grotMagnifier = svgRef.current?.querySelector('#grot-not-found-magnifier'); const grotMagnifier = svgRef.current?.querySelector('#grot-not-found-magnifier');