add mobile device detection and redirect to external site

src/main.tsx

@@ -2,9 +2,15 @@ import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
 import App from './App.tsx';
 import './index.css';
+import { isMobileDevice } from './utils/deviceDetection';
 
-createRoot(document.getElementById('root')!).render(
-  <StrictMode>
-    <App />
-  </StrictMode>
-);
+// Check for mobile device and redirect if necessary
+if (isMobileDevice()) {
+  window.location.href = 'https://blog.ivanch.me';
+} else {
+  createRoot(document.getElementById('root')!).render(
+    <StrictMode>
+      <App />
+    </StrictMode>
+  );
+}

src/utils/deviceDetection.ts

@@ -0,0 +1,21 @@
+function isPortraitAndNarrow(): boolean {
+  return window.innerWidth < window.innerHeight && window.innerWidth < 768;
+}
+
+export function isMobileDevice(): boolean {
+  const toMatch = [
+    /Android/i,
+    /webOS/i,
+    /iPhone/i,
+    /iPad/i,
+    /iPod/i,
+    /BlackBerry/i,
+    /Windows Phone/i
+  ];
+
+  const isMobileUserAgent = toMatch.some((toMatchItem) => {
+    return navigator.userAgent.match(toMatchItem);
+  });
+
+  return isMobileUserAgent || isPortraitAndNarrow();
+}