Faro & grafana improvements

apps/frontend-mobile/hooks/useResponsive.ts

@@ -0,0 +1,29 @@
+import { useWindowDimensions } from 'react-native';
+
+const TABLET_MIN_WIDTH = 768;
+
+export function useResponsive() {
+  const { width, height } = useWindowDimensions();
+
+  const isTablet = width >= TABLET_MIN_WIDTH;
+  const isLandscape = width > height;
+
+  // Scale factor for tablet: 1.0 on phone, ~1.2 on tablet
+  const scale = isTablet ? 1.2 : 1.0;
+
+  // Max content width to prevent stretching on large screens
+  const maxContentWidth = isTablet ? Math.min(600, width * 0.6) : width;
+
+  // Horizontal padding: more on tablets to center content
+  const horizontalPadding = isTablet ? 48 : 24;
+
+  return {
+    width,
+    height,
+    isTablet,
+    isLandscape,
+    scale,
+    maxContentWidth,
+    horizontalPadding,
+  };
+}