added things

pages/enter.js

@@ -1,7 +1,41 @@
+import { auth, googleAuthProvider } from '../lib/firebase';
+
+
 export default function EnterPage({ }) {
+    const user = null
+    const username = null;
+
+    // 1. user signed out <SignInButton />
+    // 2. user signed in, but missing username <UsernameForm />
+    // 3. user signed in, has username <SignOutButton />
     return (
         <main>
-            <h1>Sign Up</h1>
+            {user ?
+                !username ? <UsernameForm /> : <SignOutButton />
+                :
+                <SignInButton />
+        }
         </main>
     )
+}
+
+// Sign in with Google button
+function SignInButton() {
+    const signInWithGoogle = async () => {
+        await auth.signInWithPopup(googleAuthProvider);
+      };
+
+    return (
+        <button className="btn-google" onClick={signInWithGoogle}>
+            <img src={'/google.png'} /> Sign in with Google
+        </button>
+    );
+}
+
+function SignOutButton() {
+    return <button onClick={() => auth.signOut()}>Sign Out</button>
+}
+
+function UsernameForm() {
+
 }