replace react-intersection-observer package with mantine hooks

package.json

@@ -119,7 +119,6 @@
         "react-i18next": "^11.18.6",
         "react-icons": "^5.5.0",
         "react-image": "^4.1.0",
-        "react-intersection-observer": "^9.16.0",
         "react-loading-skeleton": "^3.5.0",
         "react-player": "^2.11.0",
         "react-router": "^6.16.0",

pnpm-lock.yaml

@@ -185,9 +185,6 @@ importers:
       react-image:
         specifier: ^4.1.0
         version: 4.1.0(@babel/runtime@7.27.1)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
-      react-intersection-observer:
-        specifier: ^9.16.0
-        version: 9.16.0(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
       react-loading-skeleton:
         specifier: ^3.5.0
         version: 3.5.0(react@19.1.0)
@@ -4483,15 +4480,6 @@ packages:
       react: '>=16.8'
       react-dom: '>=16.8'
 
-  react-intersection-observer@9.16.0:
-    resolution: {integrity: sha512-w9nJSEp+DrW9KmQmeWHQyfaP6b03v+TdXynaoA964Wxt7mdR3An11z4NNCQgL4gKSK7y1ver2Fq+JKH6CWEzUA==}
-    peerDependencies:
-      react: ^17.0.0 || ^18.0.0 || ^19.0.0
-      react-dom: ^17.0.0 || ^18.0.0 || ^19.0.0
-    peerDependenciesMeta:
-      react-dom:
-        optional: true
-
   react-is@16.13.1:
     resolution: {integrity: sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==}
 
@@ -10364,12 +10352,6 @@ snapshots:
       react: 19.1.0
       react-dom: 19.1.0(react@19.1.0)
 
-  react-intersection-observer@9.16.0(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
-    dependencies:
-      react: 19.1.0
-    optionalDependencies:
-      react-dom: 19.1.0(react@19.1.0)
-
   react-is@16.13.1: {}
 
   react-loading-skeleton@3.5.0(react@19.1.0):

src/shared/hooks/use-in-viewport.ts

@@ -0,0 +1,3 @@
+import { useInViewport as useMantineInViewport } from '@mantine/hooks';
+
+export const useInViewport = useMantineInViewport;

src/shared/hooks/use-intersection.ts

@@ -0,0 +1,3 @@
+import { useIntersection as useMantineIntersection } from '@mantine/hooks';
+
+export const useIntersection = useMantineIntersection;