Rename

md11-nav-data/src/contexts/NavigraphAuth/NavigraphAuthProvider.tsx

@@ -0,0 +1,37 @@
+import type { User } from 'navigraph/auth';
+import { useEffect, useState } from 'react';
+import { auth } from '../../lib/navigraph';
+import { authContext } from './NavigraphAuthContext';
+
+// Provider hook that creates auth object and handles state
+function useProvideAuth() {
+  const [user, setUser] = useState<User | null>(null);
+  const [initialized, setinitialized] = useState(false);
+
+  // Subscribe to user on mount
+  // Because this sets state in the callback it will cause any
+  // component that utilizes this hook to re-render with the latest auth object.
+  useEffect(() => {
+    const unsubscribe = auth.onAuthStateChanged((u) => {
+      if (!initialized) setinitialized(true);
+      setUser(u);
+    });
+    // Cleanup subscription on unmount
+    return () => unsubscribe();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  return {
+    user,
+    initialized,
+    signIn: auth.signInWithDeviceFlow,
+  };
+}
+
+// Provider component that wraps your app and makes auth object
+// available to any child component that calls useAuth().
+export function NavigraphAuthProvider({ children }: { children: React.ReactNode }) {
+  const _auth = useProvideAuth();
+  return <authContext.Provider value={_auth}>{children}</authContext.Provider>;
+}
+