- {isLoggedIn ? (
+ {user ? (
<>
- {userInfo?.photoURL && (
+ {user.photoURL && (
{
/>
)}
Log out
diff --git a/webview-ui/src/context/FirebaseAuthContext.tsx b/webview-ui/src/context/FirebaseAuthContext.tsx
new file mode 100644
index 0000000000..c4c8d4aa26
--- /dev/null
+++ b/webview-ui/src/context/FirebaseAuthContext.tsx
@@ -0,0 +1,105 @@
+import { User, getAuth, signInWithCustomToken, signOut } from "firebase/auth"
+import { initializeApp } from "firebase/app"
+import React, { createContext, useCallback, useContext, useEffect, useState } from "react"
+import { vscode } from "../utils/vscode"
+
+// Firebase configuration from extension
+const firebaseConfig = {
+ apiKey: "AIzaSyDcXAaanNgR2_T0dq2oOl5XyKPksYHppVo",
+ authDomain: "cline-bot.firebaseapp.com",
+ projectId: "cline-bot",
+ storageBucket: "cline-bot.firebasestorage.app",
+ messagingSenderId: "364369702101",
+ appId: "1:364369702101:web:0013885dcf20b43799c65c",
+ measurementId: "G-MDPRELSCD1",
+}
+
+interface FirebaseAuthContextType {
+ user: User | null
+ isInitialized: boolean
+ signInWithToken: (token: string) => Promise
+ handleSignOut: () => Promise
+}
+
+const FirebaseAuthContext = createContext(undefined)
+
+export const FirebaseAuthProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+ const [user, setUser] = useState(null)
+ const [isInitialized, setIsInitialized] = useState(false)
+
+ // Initialize Firebase
+ const app = initializeApp(firebaseConfig)
+ const auth = getAuth(app)
+
+ // Handle auth state changes
+ useEffect(() => {
+ const unsubscribe = auth.onAuthStateChanged((user) => {
+ setUser(user)
+ setIsInitialized(true)
+
+ // Sync auth state with extension
+ vscode.postMessage({
+ type: "authStateChanged",
+ user: user
+ ? {
+ displayName: user.displayName,
+ email: user.email,
+ photoURL: user.photoURL,
+ }
+ : null,
+ })
+ })
+
+ return () => unsubscribe()
+ }, [auth])
+
+ // Listen for auth callback from extension
+ useEffect(() => {
+ const handleMessage = (event: MessageEvent) => {
+ const message = event.data
+ if (message.type === "authCallback" && message.customToken) {
+ signInWithToken(message.customToken)
+ }
+ }
+
+ window.addEventListener("message", handleMessage)
+ return () => window.removeEventListener("message", handleMessage)
+ }, [])
+
+ const signInWithToken = useCallback(
+ async (token: string) => {
+ try {
+ await signInWithCustomToken(auth, token)
+ console.log("Successfully signed in with custom token")
+ } catch (error) {
+ console.error("Error signing in with custom token:", error)
+ throw error
+ }
+ },
+ [auth],
+ )
+
+ const handleSignOut = useCallback(async () => {
+ try {
+ await signOut(auth)
+ console.log("Successfully signed out of Firebase")
+ } catch (error) {
+ console.error("Error signing out of Firebase:", error)
+ throw error
+ }
+ }, [auth])
+
+ return (
+
+ {children}
+
+ )
+}
+
+export const useFirebaseAuth = () => {
+ const context = useContext(FirebaseAuthContext)
+ if (context === undefined) {
+ throw new Error("useFirebaseAuth must be used within a FirebaseAuthProvider")
+ }
+ return context
+}
- {userInfo?.displayName &&
{userInfo.displayName}
}
- {userInfo?.email && {userInfo.email}
}
+ {user.displayName && {user.displayName}
}
+ {user.email && {user.email}
}