fixed callibration and iphone UI

Author: marcebd

apps/admin/src/pages/CalibrationRedesign.tsx

@@ -33,6 +33,7 @@ type CalibrationPhase =
 interface CalibrationSessionState {
   phase: CalibrationPhase;
   selectedDoorId: string | null;
+  selectedDoorName: string | null;
   selectedStartCornerIndex: number | null;
   currentCornerIndex: number;
   totalCorners: number;
@@ -109,6 +110,7 @@ const calibrationLinksByCode = new Map<string, CalibrationLink>();
 
 const broadcast = (event: CalibrationEvent) => {
   const payload = `event: ${event.type}\ndata: ${JSON.stringify(event)}\n\n`;
+  console.log(`[SSE] Broadcasting ${event.type} to ${sseClients.size} clients:`, JSON.stringify(event.payload || {}).slice(0, 200));
   for (const res of sseClients) {
     try {
       res.write(payload);
@@ -181,6 +183,7 @@ router.post('/session/start', (req: Request, res: Response) => {
   const defaultState: CalibrationSessionState = {
     phase: 'paired',
     selectedDoorId: null,
+    selectedDoorName: null,
     selectedStartCornerIndex: null,
     currentCornerIndex: 0,
     totalCorners: roomData?.corners?.length ?? 0,
@@ -670,14 +673,15 @@ router.patch('/session/:sessionId/state', (req: Request, res: Response) => {
 // Select door (can be called from admin or calibrator)
 router.post('/session/:sessionId/select-door', (req: Request, res: Response) => {
   const { sessionId } = req.params;
-  const { doorId, doorPosition, source } = req.body ?? {};
+  const { doorId, doorName, doorPosition, source } = req.body ?? {};
 
   const session = sessions.get(sessionId);
   if (!session) {
     return res.status(404).json({ success: false, error: 'Session not found' });
   }
 
   session.state.selectedDoorId = doorId;
+  session.state.selectedDoorName = doorName || null;
   session.state.doorPosition = doorPosition || null;
   session.state.phase = 'door-selected';
 
@@ -686,13 +690,13 @@ router.post('/session/:sessionId/select-door', (req: Request, res: Response) =>
     id: randomUUID(),
     timestamp: Date.now(),
     type: 'milestone',
-    data: { milestone: `Door selected (from ${source})`, phase: 'door-selected' }
+    data: { milestone: `Door ${doorName || doorId} selected (from ${source})`, phase: 'door-selected' }
   });
 
   const event: CalibrationEvent = {
     type: 'door-selected',
     sessionId,
-    payload: { doorId, doorPosition, source, state: session.state },
+    payload: { doorId, doorName, doorPosition, source, state: session.state },
     timestamp: Date.now(),
   };
   broadcast(event);
@@ -738,8 +742,11 @@ router.post('/session/:sessionId/milestone', (req: Request, res: Response) => {
   const { sessionId } = req.params;
   const { type, cornerIndex, message } = req.body ?? {};
 
+  console.log(`[Milestone] Received milestone request: sessionId=${sessionId}, type=${type}, cornerIndex=${cornerIndex}`);
+
   const session = sessions.get(sessionId);
   if (!session) {
+    console.log(`[Milestone] Session not found: ${sessionId}`);
     return res.status(404).json({ success: false, error: 'Session not found' });
   }
 

apps/backend/src/routes/calibration.ts

@@ -1,9 +1,12 @@
 import { Stack } from 'expo-router';
+import { SafeAreaProvider } from 'react-native-safe-area-context';
 
 export default function RootLayout() {
   return (
-    <Stack>
-      <Stack.Screen name="index" options={{ headerShown: false }} />
-    </Stack>
+    <SafeAreaProvider>
+      <Stack>
+        <Stack.Screen name="index" options={{ headerShown: false }} />
+      </Stack>
+    </SafeAreaProvider>
   );
 }