[IMPROVE] Replace usePrefersReducedMotion (#19759)

client/components/burger/BurgerIcon.js

@@ -1,9 +1,8 @@
 import { css } from '@rocket.chat/css-in-js';
 import { Box } from '@rocket.chat/fuselage';
+import { usePrefersReducedMotion } from '@rocket.chat/fuselage-hooks';
 import React from 'react';
 
-import { useIsReducedMotionPreferred } from '../../hooks/useIsReducedMotionPreferred';
-
 const Wrapper = ({ children }) =>
 	<Box
 		is='span'
@@ -56,7 +55,7 @@ const Line = ({ animated, moved }) =>
 	/>;
 
 function BurgerIcon({ children, open }) {
-	const isReducedMotionPreferred = useIsReducedMotionPreferred();
+	const isReducedMotionPreferred = usePrefersReducedMotion();
 
 	return <Wrapper>
 		<Line animated={!isReducedMotionPreferred} moved={open} />

client/hooks/useIsReducedMotionPreferred.js

@@ -1,3 +0,0 @@
-import { useMediaQuery } from '@rocket.chat/fuselage-hooks';
-
-export const useIsReducedMotionPreferred = () => useMediaQuery('(prefers-reduced-motion: reduce)');

client/sidebar/Item/Condensed.js

@@ -1,8 +1,6 @@
 import React, { useState } from 'react';
 import { Sidebar, ActionButton } from '@rocket.chat/fuselage';
-import { useMutableCallback } from '@rocket.chat/fuselage-hooks';
-
-import { usePrefersReducedMotion } from '../hooks/usePrefersReducedMotion';
+import { useMutableCallback, usePrefersReducedMotion } from '@rocket.chat/fuselage-hooks';
 
 const Condensed = React.memo(({
 	icon,

client/sidebar/Item/Extended.js

@@ -1,9 +1,8 @@
 import React, { useState } from 'react';
 import { Sidebar, ActionButton } from '@rocket.chat/fuselage';
-import { useMutableCallback } from '@rocket.chat/fuselage-hooks';
+import { useMutableCallback, usePrefersReducedMotion } from '@rocket.chat/fuselage-hooks';
 
 import { useShortTimeAgo } from '../../hooks/useTimeAgo';
-import { usePrefersReducedMotion } from '../hooks/usePrefersReducedMotion';
 
 const Extended = React.memo(({
 	icon,

client/sidebar/Item/Medium.js

@@ -1,8 +1,6 @@
 import React, { useState } from 'react';
 import { Sidebar, ActionButton } from '@rocket.chat/fuselage';
-import { useMutableCallback } from '@rocket.chat/fuselage-hooks';
-
-import { usePrefersReducedMotion } from '../hooks/usePrefersReducedMotion';
+import { useMutableCallback, usePrefersReducedMotion } from '@rocket.chat/fuselage-hooks';
 
 const Medium = React.memo(({
 	icon,

client/sidebar/hooks/usePrefersReducedMotion.js

@@ -1,4 +0,0 @@
-import { useMediaQueries } from '@rocket.chat/fuselage-hooks';
-
-
-export const usePrefersReducedMotion = () => useMediaQueries('(prefers-reduced-motion: reduce)')[0];