Improve page responsiveness

elastic · Sep 29, 2020 · ffe51a3 · ffe51a3
1 parent 69a6e62
commit ffe51a3
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 7 deletions.
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/Panels/PageLoadAndViews.tsx b/x-pack/plugins/apm/public/components/app/RumDashboard/Panels/PageLoadAndViews.tsx
@@ -9,10 +9,10 @@ import { EuiPanel, EuiResizableContainer } from '@elastic/eui';
 import { FULL_HEIGHT } from '../RumDashboard';
 import { PageLoadDistribution } from '../PageLoadDistribution';
 import { PageViewsTrend } from '../PageViewsTrend';
-import { usBreakPoints } from '../hooks/useBreakPoints';
+import { useBreakPoints } from '../hooks/useBreakPoints';
 
 export function PageLoadAndViews() {
-  const { isLarge } = usBreakPoints();
+  const { isLarge } = useBreakPoints();
 
   return (
     <EuiResizableContainer

diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/Panels/VisitorBreakdowns.tsx b/x-pack/plugins/apm/public/components/app/RumDashboard/Panels/VisitorBreakdowns.tsx
@@ -9,10 +9,10 @@ import { EuiPanel, EuiResizableContainer } from '@elastic/eui';
 import { VisitorBreakdown } from '../VisitorBreakdown';
 import { VisitorBreakdownMap } from '../VisitorBreakdownMap';
 import { FULL_HEIGHT } from '../RumDashboard';
-import { usBreakPoints } from '../hooks/useBreakPoints';
+import { useBreakPoints } from '../hooks/useBreakPoints';
 
 export function VisitorBreakdownsPanel() {
-  const { isLarge } = usBreakPoints();
+  const { isLarge } = useBreakPoints();
 
   return (
     <EuiResizableContainer

diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/RumDashboard.tsx b/x-pack/plugins/apm/public/components/app/RumDashboard/RumDashboard.tsx
@@ -19,12 +19,12 @@ import { UXMetrics } from './UXMetrics';
 import { ImpactfulMetrics } from './ImpactfulMetrics';
 import { PageLoadAndViews } from './Panels/PageLoadAndViews';
 import { VisitorBreakdownsPanel } from './Panels/VisitorBreakdowns';
-import { usBreakPoints } from './hooks/useBreakPoints';
+import { useBreakPoints } from './hooks/useBreakPoints';
 
 export const FULL_HEIGHT = { height: '100%' };
 
 export function RumDashboard() {
-  const { isLarge, isSmall } = usBreakPoints();
+  const { isLarge, isSmall } = useBreakPoints();
 
   return (
     <EuiFlexGroup direction={isSmall ? 'row' : 'column'} gutterSize="s">

diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/hooks/useBreakPoints.ts b/x-pack/plugins/apm/public/components/app/RumDashboard/hooks/useBreakPoints.ts
@@ -9,7 +9,7 @@ import useWindowSize from 'react-use/lib/useWindowSize';
 import useDebounce from 'react-use/lib/useDebounce';
 import { isWithinMaxBreakpoint } from '@elastic/eui';
 
-export function usBreakPoints() {
+export function useBreakPoints() {
   const [screenSizes, setScreenSizes] = useState({
     isSmall: false,
     isMedium: false,