1 files changed, 7 insertions, 7 deletions

diff --git a/packages/renderer/src/components/BrowserViewPlaceholder.tsx b/packages/renderer/src/components/BrowserViewPlaceholder.tsx
index 9bd1176..2bfc9b0 100644
--- a/packages/renderer/src/components/BrowserViewPlaceholder.tsx
+++ b/packages/renderer/src/components/BrowserViewPlaceholder.tsx
@@ -22,29 +22,29 @@ import Box from '@mui/material/Box';
 import throttle from 'lodash-es/throttle';
 import React, { ReactNode, useCallback, useRef } from 'react';
 
-import { useStore } from './StoreProvider';
+import Service from '../stores/Service';
 
 function BrowserViewPlaceholder({
+  service,
   children,
 }: {
+  service: Service;
   children?: ReactNode;
 }): JSX.Element {
-  const store = useStore();
-
   // eslint-disable-next-line react-hooks/exhaustive-deps -- react-hooks doesn't support `throttle`.
   const onResize = useCallback(
     throttle(([entry]: ResizeObserverEntry[]) => {
       if (entry) {
         const { x, y, width, height } = entry.target.getBoundingClientRect();
-        store.setBrowserViewBounds({
+        service.setBrowserViewBounds({
           x: Math.round(x),
           y: Math.round(y),
           width: Math.round(width),
           height: Math.round(height),
         });
       }
-    }, 40),
-    [store],
+    }, 100),
+    [service],
   );
 
   const resizeObserverRef = useRef<ResizeObserver | undefined>();
@@ -61,7 +61,7 @@ function BrowserViewPlaceholder({
       resizeObserverRef.current = new ResizeObserver(onResize);
       resizeObserverRef.current.observe(element);
     },
-    [onResize, resizeObserverRef],
+    [onResize],
   );
 
   return (