Initial commit

2026-04-24 08:02:13 +02:00
commit 867c06295c
76 changed files with 10573 additions and 0 deletions
@@ -0,0 +1,42 @@
+import { useState, useEffect } from 'react';
+import { useSleepSession } from '../../hooks/useSleepSession';
+import { formatElapsedTime } from '../../utils/time';
+
+const StatusBanner = () => {
+  const { activeSession, isLoading } = useSleepSession();
+  const [elapsed, setElapsed] = useState<string>('');
+
+  useEffect(() => {
+    if (!activeSession) {
+      setElapsed('');
+      return;
+    }
+
+    const updateElapsed = () => {
+      setElapsed(formatElapsedTime(activeSession.start_time));
+    };
+
+    updateElapsed();
+    const interval = setInterval(updateElapsed, 1000);
+    return () => clearInterval(interval);
+  }, [activeSession?.start_time]);
+
+  if (isLoading) return <div className="p-4 text-center">Loading...</div>;
+
+  if (activeSession) {
+    return (
+      <div className="bg-amber-100 text-amber-800 p-4 rounded-lg shadow-sm mb-4 flex items-center justify-center space-x-2">
+        <span>Baby is sleeping 😴</span>
+        {elapsed && <span className="font-mono">({elapsed})</span>}
+      </div>
+    );
+  }
+
+  return (
+    <div className="bg-blue-100 text-blue-800 p-4 rounded-lg shadow-sm mb-4 flex items-center justify-center space-x-2">
+      <span>Baby is awake 👶</span>
+    </div>
+  );
+};
+
+export default StatusBanner;