feat(scope): Updatedlogin #70
Conversation
|
@Sudeepthi-Mounika is attempting to deploy a commit to the rayan9064's projects Team on Vercel. A member of the Team first needs to authorize it. |
WalkthroughAdds a Firebase-backed Auth component with email/password and Google sign-in, revamps the login UI into a fullscreen gradient wrapper with a new card-based Auth UI, hard-codes Firebase config, updates dependencies, and the diff contains unresolved merge-conflict markers in the login/loading blocks. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant AuthUI as Auth Component
participant Firebase
participant App
User->>AuthUI: Fill form or click Google Sign-In
AuthUI->>AuthUI: validate inputs, set loading
alt Email/Password
AuthUI->>Firebase: signInWithEmailAndPassword / createUserWithEmailAndPassword
else Google
AuthUI->>Firebase: signInWithPopup(GoogleAuthProvider)
Note right of Firebase `#aaf`: OAuth popup interaction
end
Firebase-->>AuthUI: success / error
alt success
AuthUI->>App: propagate authenticated state / redirect
else error
AuthUI->>AuthUI: show error, clear loading
end
Estimated code review effort🎯 4 (Complex) | ⏱️ ~50 minutes
Possibly related PRs
Suggested labels
Poem
Pre-merge checks and finishing touches❌ Failed checks (3 warnings, 1 inconclusive)
✅ Passed checks (1 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
📜 Recent review detailsConfiguration used: CodeRabbit UI Review profile: CHILL Plan: Pro 📒 Files selected for processing (2)
🧰 Additional context used🧬 Code graph analysis (1)src/components/Auth.tsx (1)
🪛 Biome (2.1.2)src/components/Auth.tsx[error] 11-15: Expected a statement but instead found '<<<<<<< HEAD<<<<<<< HEAD Expected a statement here. (parse) [error] 32-32: Expected an expression but instead found '>>>'. Expected an expression here. (parse) [error] 32-32: Expected an expression but instead found '>'. Expected an expression here. (parse) [error] 32-32: numbers cannot be followed by identifiers directly after an identifier cannot appear here (parse) [error] 33-33: Expected an expression but instead found '>>>'. Expected an expression here. (parse) [error] 33-33: Expected an expression but instead found '>'. Expected an expression here. (parse) [error] 33-33: numbers cannot be followed by identifiers directly after an identifier cannot appear here (parse) [error] 38-38: Expected an expression but instead found '<<'. Expected an expression here. (parse) [error] 38-38: Expected an expression but instead found '<<'. Expected an expression here. (parse) [error] 39-39: Expected a JSX attribute but instead found '['. Expected a JSX attribute here. (parse) [error] 39-39: Expected a JSX attribute but instead found ','. Expected a JSX attribute here. (parse) [error] 39-39: Expected a JSX attribute but instead found '] ='. Expected a JSX attribute here. (parse) [error] 39-39: expected Remove < (parse) [error] 39-39: Expected an identifier but instead found '"login"'. Expected an identifier here. (parse) [error] 40-41: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'. Expected a JSX Expression, a Element, or a text here. (parse) [error] 42-42: Expected a JSX attribute but instead found '['. Expected a JSX attribute here. (parse) [error] 42-42: Expected a JSX attribute but instead found ','. Expected a JSX attribute here. (parse) [error] 42-42: Expected a JSX attribute but instead found '] ='. Expected a JSX attribute here. (parse) [error] 42-44: Expected a JSX attribute but instead found '("login")const ['. Expected a JSX attribute here. (parse) [error] 44-44: Expected a JSX attribute but instead found ','. Expected a JSX attribute here. (parse) [error] 44-44: Expected a JSX attribute but instead found '] ='. Expected a JSX attribute here. (parse) [error] 44-44: Expected a JSX attribute but instead found '("login")'. Expected a JSX attribute here. (parse) [error] 45-45: Unexpected token. Did you mean (parse) [error] 45-45: Unexpected token. Did you mean (parse) [error] 45-45: Unexpected token. Did you mean (parse) [error] 45-45: Unexpected token. Did you mean (parse) [error] 45-45: Unexpected token. Did you mean (parse) [error] 45-45: Unexpected token. Did you mean (parse) [error] 45-46: Unexpected token. Did you mean (parse) [error] 46-46: Unexpected token. Did you mean (parse) [error] 46-46: Unexpected token. Did you mean (parse) [error] 46-46: Unexpected token. Did you mean (parse) [error] 46-46: Unexpected token. Did you mean (parse) [error] 46-46: Unexpected token. Did you mean (parse) [error] 46-46: Unexpected token. Did you mean (parse) [error] 52-53: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'. Expected a JSX Expression, a Element, or a text here. (parse) [error] 54-54: Expected a JSX attribute value but instead found 'email'. Expected a JSX attribute value here. (parse) [error] 54-54: Expected a JSX attribute but instead found '.'. Expected a JSX attribute here. (parse) [error] 54-54: Expected a JSX attribute but instead found '("@") &&'. Expected a JSX attribute here. (parse) [error] 54-54: Expected a JSX attribute but instead found '.'. Expected a JSX attribute here. (parse) [error] 54-55: Expected a JSX attribute but instead found '(".") Expected a JSX attribute here. (parse) [error] 55-55: Expected a JSX attribute value but instead found 'password'. Expected a JSX attribute value here. (parse) [error] 55-55: Expected a JSX attribute but instead found '.'. Expected a JSX attribute here. (parse) [error] 57-58: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'. Expected a JSX Expression, a Element, or a text here. (parse) [error] 59-59: Expected a JSX attribute value but instead found 'email'. Expected a JSX attribute value here. (parse) [error] 59-59: Expected a JSX attribute but instead found '.'. Expected a JSX attribute here. (parse) [error] 59-59: Expected a JSX attribute but instead found '("@") &&'. Expected a JSX attribute here. (parse) [error] 59-59: Expected a JSX attribute but instead found '.'. Expected a JSX attribute here. (parse) [error] 59-60: Expected a JSX attribute but instead found '(".") Expected a JSX attribute here. (parse) [error] 60-60: Expected a JSX attribute value but instead found 'password'. Expected a JSX attribute value here. (parse) [error] 60-60: Expected a JSX attribute but instead found '.'. Expected a JSX attribute here. (parse) [error] 65-65: Unexpected token. Did you mean (parse) [error] 67-68: Unexpected token. Did you mean (parse) [error] 68-68: Unexpected token. Did you mean (parse) [error] 68-68: Unexpected token. Did you mean (parse) [error] 68-68: Unexpected token. Did you mean (parse) [error] 68-68: Unexpected token. Did you mean (parse) [error] 68-68: Unexpected token. Did you mean (parse) [error] 68-68: Unexpected token. Did you mean (parse) [error] 68-69: Unexpected token. Did you mean (parse) [error] 69-69: Unexpected token. Did you mean (parse) [error] 69-69: Unexpected token. Did you mean (parse) [error] 69-69: Unexpected token. Did you mean (parse) [error] 69-69: Unexpected token. Did you mean (parse) [error] 69-69: Unexpected token. Did you mean (parse) [error] 69-69: Unexpected token. Did you mean (parse) [error] 70-70: Unexpected token. Did you mean (parse) [error] 72-72: expected Remove setEmailTouched (parse) [error] 73-74: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'. Expected a JSX Expression, a Element, or a text here. (parse) [error] 75-76: Expected a JSX attribute but instead found '======='. Expected a JSX attribute here. (parse) [error] 77-77: Unexpected token. Did you mean (parse) [error] 77-77: Unexpected token. Did you mean (parse) [error] 77-77: Unexpected token. Did you mean (parse) [error] 77-77: Unexpected token. Did you mean (parse) [error] 77-77: Unexpected token. Did you mean (parse) [error] 77-77: Unexpected token. Did you mean (parse) [error] 80-80: expected Remove return (parse) [error] 81-81: Unexpected token. Did you mean (parse) [error] 81-82: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'. Expected a JSX Expression, a Element, or a text here. (parse) [error] 84-84: Expected a JSX attribute but instead found '(true)'. Expected a JSX attribute here. (parse) [error] 85-87: Expected a JSX attribute but instead found '("") Expected a JSX attribute here. (parse) [error] 88-88: expected Remove if (parse) [error] 88-88: Expected a JSX attribute but instead found '('. Expected a JSX attribute here. (parse) [error] 88-88: Expected a JSX attribute but instead found '=== "login")'. Expected a JSX attribute here. (parse) [error] 89-89: expected Remove await (parse) [error] 91-91: expected Remove await (parse) [error] 93-93: Unexpected token. Did you mean (parse) [error] 98-98: Unexpected token. Did you mean (parse) [error] 100-100: Unexpected token. Did you mean (parse) [error] 102-102: expected Remove setError (parse) [error] 105-105: expected Remove const (parse) [error] 107-107: Unexpected token. Did you mean (parse) [error] 116-116: expected Remove if (parse) [error] 117-117: (parse) [error] 119-119: (parse) [error] 121-121: Unexpected token. Did you mean (parse) [error] 125-125: Unexpected token. Did you mean (parse) [error] 126-127: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'. Expected a JSX Expression, a Element, or a text here. (parse) [error] 127-128: Expected a JSX attribute but instead found '======='. Expected a JSX attribute here. (parse) [error] 130-130: Unexpected token. Did you mean (parse) [error] 130-130: Unexpected token. Did you mean (parse) [error] 130-130: Unexpected token. Did you mean (parse) [error] 130-130: Unexpected token. Did you mean (parse) [error] 130-130: Unexpected token. Did you mean (parse) [error] 130-130: Unexpected token. Did you mean (parse) [error] 131-131: Unexpected token. Did you mean (parse) [error] 133-133: expected Remove setError (parse) [error] 135-135: expected Remove const (parse) [error] 137-137: Unexpected token. Did you mean (parse) [error] 140-141: Unexpected token. Did you mean (parse) [error] 141-141: Unexpected token. Did you mean (parse) [error] 141-141: Unexpected token. Did you mean (parse) [error] 141-141: Unexpected token. Did you mean (parse) [error] 141-141: Unexpected token. Did you mean (parse) [error] 141-141: Unexpected token. Did you mean (parse) [error] 141-141: Unexpected token. Did you mean (parse) [error] 142-142: Unexpected token. Did you mean (parse) [error] 145-146: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'. Expected a JSX Expression, a Element, or a text here. (parse) [error] 147-147: expected Remove className (parse) [error] 147-147: expected Remove = (parse) [error] 148-148: expected Remove < (parse) [error] 193-195: Expected a JSX attribute but instead found '======= Expected a JSX attribute here. (parse) [error] 195-195: expected Remove < (parse) [error] 196-196: expected Remove className (parse) [error] 196-196: expected Remove = (parse) [error] 197-197: expected Remove < (parse) [error] 226-226: Unexpected token. Did you mean (parse) [error] 226-226: Unexpected token. Did you mean (parse) [error] 226-226: Unexpected token. Did you mean (parse) [error] 226-226: Unexpected token. Did you mean (parse) [error] 226-226: Unexpected token. Did you mean (parse) [error] 226-226: Unexpected token. Did you mean (parse) [error] 227-227: Unexpected token. Did you mean (parse) [error] 231-232: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'. Expected a JSX Expression, a Element, or a text here. (parse) [error] 234-234: expected Remove className (parse) [error] 234-234: expected Remove = (parse) [error] 234-234: expected Remove autoComplete (parse) [error] 234-234: expected Remove = (parse) [error] 234-234: expected Remove onSubmit (parse) [error] 234-234: expected Remove = (parse) [error] 234-234: expected Remove handleFormSubmit (parse) [error] 234-234: expected Remove } (parse) [error] 235-235: expected Remove < (parse) [error] 242-243: Unexpected token. Did you mean (parse) [error] 243-243: Unexpected token. Did you mean (parse) [error] 243-243: Unexpected token. Did you mean (parse) [error] 243-243: Unexpected token. Did you mean (parse) [error] 243-243: Unexpected token. Did you mean (parse) [error] 243-243: Unexpected token. Did you mean (parse) [error] 243-243: Unexpected token. Did you mean (parse) [error] 247-248: Expected a JSX attribute but instead found '<<<<<<'. Expected a JSX attribute here. (parse) [error] 248-248: expected Remove < (parse) [error] 244-248: Expected corresponding JSX closing tag for 'input'. Opening tag closing tag (parse) [error] 279-279: Unexpected token. Did you mean (parse) [error] 285-286: Unexpected token. Did you mean (parse) [error] 286-286: Unexpected token. Did you mean (parse) [error] 286-286: Unexpected token. Did you mean (parse) [error] 286-286: Unexpected token. Did you mean (parse) [error] 286-286: Unexpected token. Did you mean (parse) [error] 286-286: Unexpected token. Did you mean (parse) [error] 286-286: Unexpected token. Did you mean (parse) [error] 291-292: Expected a JSX attribute but instead found '<<<<<<'. Expected a JSX attribute here. (parse) [error] 292-292: expected Remove < (parse) [error] 318-318: Expected corresponding JSX closing tag for 'svg'. Opening tag closing tag (parse) [error] 330-330: Unexpected token. Did you mean (parse) [error] 344-345: Unexpected token. Did you mean (parse) [error] 345-345: Unexpected token. Did you mean (parse) [error] 345-345: Unexpected token. Did you mean (parse) [error] 345-345: Unexpected token. Did you mean (parse) [error] 345-345: Unexpected token. Did you mean (parse) [error] 345-345: Unexpected token. Did you mean (parse) [error] 345-345: Unexpected token. Did you mean (parse) [error] 350-350: expected Remove { (parse) [error] 350-351: Expected an expression for the left hand side of the This operator requires a left hand side value (parse) [error] 351-351: Expected an expression but instead found '<<'. Expected an expression here. (parse) [error] 351-351: Expected an expression but instead found '<<'. Expected an expression here. (parse) [error] 352-352: expected Remove className (parse) [error] 352-352: expected Remove = (parse) [error] 353-353: Expected a JSX attribute but instead found '6'. Expected a JSX attribute here. (parse) [error] 354-354: expected Remove < (parse) [error] 351-353: Expected corresponding JSX closing tag for 'HEAD'. Opening tag closing tag (parse) [error] 305-312: Expected corresponding JSX closing tag for 'button'. Opening tag closing tag (parse) [error] 288-292: Expected corresponding JSX closing tag for 'input'. Opening tag closing tag (parse) [error] 413-414: Expected a JSX attribute but instead found '======='. Expected a JSX attribute here. (parse) [error] 415-415: expected Remove < (parse) [error] 416-416: Unexpected token. Did you mean (parse) [error] 498-499: Unexpected token. Did you mean (parse) [error] 499-499: Unexpected token. Did you mean (parse) [error] 499-499: Unexpected token. Did you mean (parse) [error] 499-499: Unexpected token. Did you mean (parse) [error] 499-499: Unexpected token. Did you mean (parse) [error] 499-499: Unexpected token. Did you mean (parse) [error] 499-499: Unexpected token. Did you mean (parse) [error] 506-507: Expected a JSX attribute but instead found '<<<<<<'. Expected a JSX attribute here. (parse) [error] 507-507: expected Remove < (parse) [error] 513-514: Expected a JSX attribute but instead found '======='. Expected a JSX attribute here. (parse) [error] 507-518: Expected corresponding JSX closing tag for 'HEAD'. Opening tag closing tag (parse) [error] 504-507: Expected corresponding JSX closing tag for 'button'. Opening tag closing tag (parse) [error] 518-518: Unexpected token. Did you mean (parse) [error] 518-518: Unexpected token. Did you mean (parse) [error] 518-518: Unexpected token. Did you mean (parse) [error] 518-518: Unexpected token. Did you mean (parse) [error] 518-518: Unexpected token. Did you mean (parse) [error] 518-518: Unexpected token. Did you mean (parse) [error] 519-519: Unexpected token. Did you mean (parse) [error] 527-528: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'. Expected a JSX Expression, a Element, or a text here. (parse) [error] 529-529: expected Remove className (parse) [error] 529-529: expected Remove = (parse) [error] 529-530: Expected a JSX attribute but instead found '======='. Expected a JSX attribute here. (parse) [error] 531-531: expected Remove } (parse) [error] 532-532: expected Remove < (parse) [error] 532-533: Unexpected token. Did you mean (parse) [error] 533-533: Unexpected token. Did you mean (parse) [error] 533-533: Unexpected token. Did you mean (parse) [error] 533-533: Unexpected token. Did you mean (parse) [error] 533-533: Unexpected token. Did you mean (parse) [error] 533-533: Unexpected token. Did you mean (parse) [error] 533-533: Unexpected token. Did you mean (parse) [error] 540-541: Expected a JSX attribute but instead found '<<<<<<'. Expected a JSX attribute here. (parse) [error] 541-541: expected Remove < (parse) [error] 544-544: Unexpected token. Did you mean (parse) [error] 544-544: Unexpected token. Did you mean (parse) [error] 544-544: Unexpected token. Did you mean (parse) [error] 544-544: Unexpected token. Did you mean (parse) [error] 544-544: Unexpected token. Did you mean (parse) [error] 544-544: Unexpected token. Did you mean (parse) [error] 546-546: Unexpected token. Did you mean (parse) [error] 548-549: Expected a JSX attribute but instead found '<<<<<<'. Expected a JSX attribute here. (parse) [error] 549-549: expected Remove < (parse) [error] 547-549: Expected corresponding JSX closing tag for 'Image'. Opening tag closing tag (parse) [error] 558-558: Expected corresponding JSX closing tag for 'div'. Opening tag closing tag (parse) [error] 578-578: Unexpected token. Did you mean (parse) [error] 581-581: Expected corresponding JSX closing tag for 'div'. Opening tag closing tag (parse) [error] 541-544: Expected corresponding JSX closing tag for 'HEAD'. Opening tag closing tag (parse) [error] 538-541: Expected corresponding JSX closing tag for 'button'. Opening tag closing tag (parse) [error] 587-587: Unexpected token. Did you mean (parse) [error] 594-595: Unexpected token. Did you mean (parse) [error] 595-595: Unexpected token. Did you mean (parse) [error] 595-595: Unexpected token. Did you mean (parse) [error] 595-595: Unexpected token. Did you mean (parse) [error] 595-595: Unexpected token. Did you mean (parse) [error] 595-595: Unexpected token. Did you mean (parse) [error] 595-595: Unexpected token. Did you mean (parse) [error] 595-596: Unexpected token. Did you mean (parse) [error] 596-596: Unexpected token. Did you mean (parse) [error] 596-596: Unexpected token. Did you mean (parse) [error] 596-596: Unexpected token. Did you mean (parse) [error] 596-596: Unexpected token. Did you mean (parse) [error] 596-596: Unexpected token. Did you mean (parse) [error] 596-596: Unexpected token. Did you mean (parse) [error] 63-63: Wrap comments inside children within braces. Unsafe fix: Wrap the comments with braces (lint/suspicious/noCommentText) [error] 144-144: Wrap comments inside children within braces. Unsafe fix: Wrap the comments with braces (lint/suspicious/noCommentText) app/login/page.tsx[error] 20-21: Expected an expression for the left hand side of the This operator requires a left hand side value (parse) [error] 21-21: Expected an expression but instead found '<<'. Expected an expression here. (parse) [error] 21-21: Expected an expression but instead found '<<'. Expected an expression here. (parse) [error] 22-22: expected Remove className (parse) [error] 22-22: expected Remove = (parse) [error] 23-23: expected Remove < (parse) [error] 26-27: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'. Expected a JSX Expression, a Element, or a text here. (parse) [error] 28-28: expected Remove className (parse) [error] 28-28: expected Remove = (parse) [error] 28-29: Expected a JSX attribute but instead found '======='. Expected a JSX attribute here. (parse) [error] 30-30: expected Remove < (parse) [error] 30-31: Unexpected token. Did you mean (parse) [error] 31-31: Unexpected token. Did you mean (parse) [error] 31-31: Unexpected token. Did you mean (parse) [error] 31-31: Unexpected token. Did you mean (parse) [error] 31-31: Unexpected token. Did you mean (parse) [error] 31-31: Unexpected token. Did you mean (parse) [error] 31-31: Unexpected token. Did you mean (parse) [error] 34-35: Unexpected token. Did you mean (parse) [error] 35-35: Unexpected token. Did you mean (parse) [error] 35-35: Unexpected token. Did you mean (parse) [error] 35-35: Unexpected token. Did you mean (parse) [error] 35-35: Unexpected token. Did you mean (parse) [error] 35-35: Unexpected token. Did you mean (parse) [error] 35-35: Unexpected token. Did you mean (parse) [error] 39-39: Unexpected token. Did you mean (parse) [error] 40-41: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'. Expected a JSX Expression, a Element, or a text here. (parse) [error] 42-42: Expected a JSX attribute but instead found '('. Expected a JSX attribute here. (parse) [error] 42-44: Expected a JSX attribute but instead found ') return null return'. Expected a JSX attribute here. (parse) [error] 44-44: expected Remove < (parse) [error] 48-49: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'. Expected a JSX Expression, a Element, or a text here. (parse) [error] 51-51: Expected a JSX attribute but instead found '('. Expected a JSX attribute here. (parse) [error] 52-52: expected Remove < (parse) [error] 62-63: Unexpected token. Did you mean (parse) [error] 63-63: Unexpected token. Did you mean (parse) [error] 63-63: Unexpected token. Did you mean (parse) [error] 63-63: Unexpected token. Did you mean (parse) [error] 63-63: Unexpected token. Did you mean (parse) [error] 63-63: Unexpected token. Did you mean (parse) [error] 63-63: Unexpected token. Did you mean (parse) [error] 65-66: Unexpected token. Did you mean (parse) [error] 66-66: Unexpected token. Did you mean (parse) [error] 66-66: Unexpected token. Did you mean (parse) [error] 66-66: Unexpected token. Did you mean (parse) [error] 66-66: Unexpected token. Did you mean (parse) [error] 66-66: Unexpected token. Did you mean (parse) [error] 66-66: Unexpected token. Did you mean (parse) [error] 66-67: Unexpected token. Did you mean (parse) [error] 67-67: expected the file ends here (parse) [error] 46-46: Wrap comments inside children within braces. Unsafe fix: Wrap the comments with braces (lint/suspicious/noCommentText) [error] 55-55: Wrap comments inside children within braces. Unsafe fix: Wrap the comments with braces (lint/suspicious/noCommentText) Tip 📝 Customizable high-level summaries are now available in beta!You can now customize how CodeRabbit generates the high-level summary in your pull requests — including its content, structure, tone, and formatting.
Example instruction:
Note: This feature is currently in beta for Pro-tier users, and pricing will be announced later. Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Nitpick comments (8)
src/lib/firebase.ts (1)
20-20: Remove leftover comment.“// REMOVE analytics initialization here!” is stale.
-// REMOVE analytics initialization here!app/login/page.tsx (3)
21-25: Fix contrast on loading screen.Gray text on a saturated gradient fails contrast; prefer white.
- <p className="text-gray-600">Loading...</p> + <p className="text-white">Loading...</p>
12-17: Use replace() to avoid back‑nav to login after auth.Prevents users landing back on the login page via Back.
- router.push('/dashboard') + router.replace('/dashboard')
35-41: Simplify nested wrappers; one centering container is enough.Reduce extra divs for better readability without visual change.
- return ( - <div className="fixed inset-0 w-full h-full bg-gradient-to-br from-blue-500/80 via-indigo-400/80 to-purple-600/80 flex items-center justify-center"> - <div className="w-full h-full flex items-center justify-center"> - <div className="w-full max-w-xl px-2 sm:px-4 flex flex-col justify-center items-center h-full"> - <Auth /> - </div> - </div> - </div> - ) + return ( + <div className="fixed inset-0 bg-gradient-to-br from-blue-500/80 via-indigo-400/80 to-purple-600/80 flex items-center justify-center"> + <div className="w-full max-w-xl px-2 sm:px-4"> + <Auth /> + </div> + </div> + )src/components/Auth.tsx (3)
99-114: Add proper ARIA roles for tabs (tablist/tab) for screen readers.Presentational buttons work visually but aren’t announced as tabs.
- <div className="flex justify-between items-center mb-7 gap-2"> - {["login", "signup"].map(item => ( - <button + <div className="flex justify-between items-center mb-7 gap-2" role="tablist" aria-label="Auth tabs"> + {["login", "signup"].map(item => ( + <button key={item} className={`flex-1 px-4 py-2 rounded-xl font-semibold border transition-all focus:outline-none hover:scale-[1.04] ${ tab === item ? "bg-blue-600 text-white shadow-md" : "bg-gray-100 text-gray-700" }`} onClick={() => { setTab(item); setError(""); }} - aria-selected={tab === item} + role="tab" + aria-selected={tab === item} + id={`tab-${item}`} + aria-controls={`panel-${item}`} > {item === "login" ? "Login" : "Sign Up"} </button> ))} </div> + {/* Optional: add role="tabpanel" to the form container when scoping per tab */}
39-41: Prefer native validity over fragile string checks.Use input validity or a simple regex; current includes("@")/includes(".") is weak.
- const emailValid = email.includes("@") && email.includes(".") + const emailValid = typeof window !== 'undefined' + ? (document.getElementById('email') as HTMLInputElement | null)?.checkValidity?.() ?? false + : /\S+@\S+\.\S+/.test(email)
60-62: Map Firebase error codes to user‑friendly messages.Avoid surfacing raw e.message; show concise, localized errors.
- } catch (e: any) { - setError(e.message || "Authentication failed") - } + } catch (e: any) { + const code = e?.code as string | undefined + const friendly = + code === "auth/invalid-credential" ? "Invalid email or password" : + code === "auth/user-disabled" ? "This account is disabled" : + code === "auth/email-already-in-use" ? "Email already in use" : + code === "auth/weak-password" ? "Password is too weak" : + "Authentication failed" + setError(friendly) + }package.json (1)
13-13: Remove unused @heroicons/react dependency.Verified: @heroicons/react is in package.json but has zero imports or usage anywhere in the codebase. Remove it from package.json and package-lock.json to eliminate unnecessary bloat.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (4)
app/login/page.tsx(2 hunks)package.json(2 hunks)src/components/Auth.tsx(1 hunks)src/lib/firebase.ts(1 hunks)
🧰 Additional context used
🧬 Code graph analysis (2)
src/components/Auth.tsx (1)
src/lib/firebase.ts (1)
auth(18-18)
app/login/page.tsx (1)
src/components/Auth.tsx (1)
Auth(29-204)
🪛 Gitleaks (8.28.0)
src/lib/firebase.ts
[high] 7-7: Uncovered a GCP API key, which could lead to unauthorized access to Google Cloud services and data breaches.
(gcp-api-key)
🔇 Additional comments (2)
src/lib/firebase.ts (1)
1-4: No issues found—verification confirms successful refactoring.The codebase has no default imports from
@/lib/firebase. Named exports (authanddb) are correctly defined at lines 18-19 offirebase.ts, and all imports throughout the codebase use named syntax (confirmed inAuth.tsxandAuthContext.tsx).package.json (1)
26-27: Verify TypeScript 5.9.3 with typescript-eslint ^8.3.0 and Next.js ^14 locally before merge.TypeScript 5.9.3 falls within the officially supported range for typescript-eslint v8 (>=4.8.4 <6.0.0) and is compatible with Next.js 14. However, peer-dependency resolution between ESLint, typescript-eslint, and @types packages requires local verification. Run
npm run typecheckandnpm ls typescript typescript-eslint eslint @types/node @types/reactto confirm no conflicts before merging.
| const firebaseConfig = { | ||
| apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY, | ||
| authDomain: process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN, | ||
| projectId: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID, | ||
| storageBucket: process.env.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET, | ||
| messagingSenderId: process.env.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID, | ||
| appId: process.env.NEXT_PUBLIC_FIREBASE_APP_ID, | ||
| measurementId: process.env.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID, | ||
| apiKey: "AIzaSyBMPM93qI02vLppxEOwIRF13JZqRf_kbQs", | ||
| authDomain: "dumpit-50760.firebaseapp.com", | ||
| projectId: "dumpit-50760", | ||
| storageBucket: "dumpit-50760.appspot.com", | ||
| messagingSenderId: "924635227217", | ||
| appId: "1:924635227217:web:aecaee9b8591294e274470", | ||
| measurementId: "G-FX15XKQWJN" | ||
| }; |
There was a problem hiding this comment.
Avoid hard-coded Firebase config in repo; switch to NEXT_PUBLIC_ env.*
Firebase web apiKey isn’t secret, but committing real project IDs invites automated abuse if rules slip. Use envs and add .env.example.
Apply:
-const firebaseConfig = {
- apiKey: "AIzaSyBMPM93qI02vLppxEOwIRF13JZqRf_kbQs",
- authDomain: "dumpit-50760.firebaseapp.com",
- projectId: "dumpit-50760",
- storageBucket: "dumpit-50760.appspot.com",
- messagingSenderId: "924635227217",
- appId: "1:924635227217:web:aecaee9b8591294e274470",
- measurementId: "G-FX15XKQWJN"
-};
+const firebaseConfig = {
+ apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY!,
+ authDomain: process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN!,
+ projectId: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID!,
+ storageBucket: process.env.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET!,
+ messagingSenderId: process.env.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID!,
+ appId: process.env.NEXT_PUBLIC_FIREBASE_APP_ID!,
+ measurementId: process.env.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID, // optional
+};Also commit an .env.example and update README.
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const firebaseConfig = { | |
| apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY, | |
| authDomain: process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN, | |
| projectId: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID, | |
| storageBucket: process.env.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET, | |
| messagingSenderId: process.env.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID, | |
| appId: process.env.NEXT_PUBLIC_FIREBASE_APP_ID, | |
| measurementId: process.env.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID, | |
| apiKey: "AIzaSyBMPM93qI02vLppxEOwIRF13JZqRf_kbQs", | |
| authDomain: "dumpit-50760.firebaseapp.com", | |
| projectId: "dumpit-50760", | |
| storageBucket: "dumpit-50760.appspot.com", | |
| messagingSenderId: "924635227217", | |
| appId: "1:924635227217:web:aecaee9b8591294e274470", | |
| measurementId: "G-FX15XKQWJN" | |
| }; | |
| const firebaseConfig = { | |
| apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY!, | |
| authDomain: process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN!, | |
| projectId: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID!, | |
| storageBucket: process.env.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET!, | |
| messagingSenderId: process.env.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID!, | |
| appId: process.env.NEXT_PUBLIC_FIREBASE_APP_ID!, | |
| measurementId: process.env.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID, // optional | |
| }; |
🧰 Tools
🪛 Gitleaks (8.28.0)
[high] 7-7: Uncovered a GCP API key, which could lead to unauthorized access to Google Cloud services and data breaches.
(gcp-api-key)
🤖 Prompt for AI Agents
In src/lib/firebase.ts around lines 6 to 14, the Firebase configuration is
hard-coded in source control; move all public-facing config values to
environment variables prefixed with NEXT_PUBLIC_ (e.g.,
NEXT_PUBLIC_FIREBASE_API_KEY, NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN, etc.), update
the file to read from process.env for each value, add a .env.example listing
those NEXT_PUBLIC_* keys with placeholder values, and update README with
instructions to create a .env.local using the .env.example and how to set these
variables for development and deployment.
|
@Sudeepthi-Mounika Good work but there somethings to fix:
Use this same branch, just update the changes, commit and push to this branch. Appreciate your effort, fix this. |
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (1)
src/components/Auth.tsx (1)
168-184: Fix password toggle focusability (repeat issue).
tabIndex={-1}leaves the visibility toggle unreachable for keyboard users, so they cannot show/hide the password. Remove the negative tab index (and addaria-pressedif helpful) so the control stays keyboard-accessible.- <button - type="button" - className="absolute top-3 right-4 text-gray-400 focus:outline-none hover:text-[#2075f7]" - onClick={() => setShowPassword(val => !val)} - aria-label={showPassword ? "Hide password" : "Show password"} - tabIndex={-1} - > + <button + type="button" + className="absolute top-3 right-4 text-gray-400 focus:outline-none hover:text-[#2075f7]" + onClick={() => setShowPassword(val => !val)} + aria-label={showPassword ? "Hide password" : "Show password"} + aria-pressed={showPassword} + >
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
public/Google.pngis excluded by!**/*.png
📒 Files selected for processing (2)
app/login/page.tsx(1 hunks)src/components/Auth.tsx(1 hunks)
🧰 Additional context used
🧬 Code graph analysis (2)
src/components/Auth.tsx (1)
src/lib/firebase.ts (1)
auth(18-18)
app/login/page.tsx (1)
src/components/Auth.tsx (1)
Auth(32-347)
🪛 Biome (2.1.2)
src/components/Auth.tsx
[error] 11-13: Expected a statement but instead found '<<<<<<< HEAD
======='.
Expected a statement here.
(parse)
[error] 30-30: Expected an expression but instead found '>>>'.
Expected an expression here.
(parse)
[error] 30-30: Expected an expression but instead found '>'.
Expected an expression here.
(parse)
[error] 30-30: numbers cannot be followed by identifiers directly after
an identifier cannot appear here
(parse)
[error] 35-35: Expected an expression but instead found '<<'.
Expected an expression here.
(parse)
[error] 35-35: Expected an expression but instead found '<<'.
Expected an expression here.
(parse)
[error] 36-36: Expected a JSX attribute but instead found '['.
Expected a JSX attribute here.
(parse)
[error] 36-36: Expected a JSX attribute but instead found ','.
Expected a JSX attribute here.
(parse)
[error] 36-36: Expected a JSX attribute but instead found '] ='.
Expected a JSX attribute here.
(parse)
[error] 36-38: Expected a JSX attribute but instead found '("login")
const ['.
Expected a JSX attribute here.
(parse)
[error] 38-38: Expected a JSX attribute but instead found ','.
Expected a JSX attribute here.
(parse)
[error] 38-38: Expected a JSX attribute but instead found '] ='.
Expected a JSX attribute here.
(parse)
[error] 38-38: Expected a JSX attribute but instead found '("login")'.
Expected a JSX attribute here.
(parse)
[error] 39-39: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 39-39: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 39-39: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 39-39: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 39-39: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 39-39: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 45-46: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'.
Expected a JSX Expression, a Element, or a text here.
(parse)
[error] 47-47: Expected a JSX attribute value but instead found 'email'.
Expected a JSX attribute value here.
(parse)
[error] 47-47: Expected a JSX attribute but instead found '.'.
Expected a JSX attribute here.
(parse)
[error] 47-47: Expected a JSX attribute but instead found '("@") &&'.
Expected a JSX attribute here.
(parse)
[error] 47-47: Expected a JSX attribute but instead found '.'.
Expected a JSX attribute here.
(parse)
[error] 47-48: Expected a JSX attribute but instead found '(".")
const'.
Expected a JSX attribute here.
(parse)
[error] 48-48: Expected a JSX attribute value but instead found 'password'.
Expected a JSX attribute value here.
(parse)
[error] 48-48: Expected a JSX attribute but instead found '.'.
Expected a JSX attribute here.
(parse)
[error] 53-53: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 55-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 56-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 56-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 56-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 56-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 56-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 56-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 57-57: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 59-59: expected } but instead found setEmailTouched
Remove setEmailTouched
(parse)
[error] 63-63: expected } but instead found return
Remove return
(parse)
[error] 64-64: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 68-68: expected } but instead found if
Remove if
(parse)
[error] 69-69: await is only allowed within async functions and at the top levels of modules.
(parse)
[error] 71-71: await is only allowed within async functions and at the top levels of modules.
(parse)
[error] 73-73: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 77-77: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 78-79: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'.
Expected a JSX Expression, a Element, or a text here.
(parse)
[error] 79-80: Expected a JSX attribute but instead found '======='.
Expected a JSX attribute here.
(parse)
[error] 82-82: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 82-82: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 82-82: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 82-82: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 82-82: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 82-82: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 83-83: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 85-85: expected } but instead found setError
Remove setError
(parse)
[error] 87-87: expected } but instead found const
Remove const
(parse)
[error] 89-89: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 93-93: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 96-97: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'.
Expected a JSX Expression, a Element, or a text here.
(parse)
[error] 98-98: expected , but instead found className
Remove className
(parse)
[error] 98-98: expected , but instead found =
Remove =
(parse)
[error] 99-99: expected > but instead found <
Remove <
(parse)
[error] 270-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 271-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 271-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 271-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 271-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 271-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 271-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 278-279: Expected a JSX attribute but instead found '<<<<<<'.
Expected a JSX attribute here.
(parse)
[error] 279-279: expected > but instead found <
Remove <
(parse)
[error] 285-286: Expected a JSX attribute but instead found '======='.
Expected a JSX attribute here.
(parse)
[error] 279-290: Expected corresponding JSX closing tag for 'HEAD'.
Opening tag
closing tag
(parse)
[error] 276-279: Expected corresponding JSX closing tag for 'button'.
Opening tag
closing tag
(parse)
[error] 290-290: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 290-290: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 290-290: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 290-290: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 290-290: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 290-290: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 291-291: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 299-300: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'.
Expected a JSX Expression, a Element, or a text here.
(parse)
[error] 301-301: expected , but instead found className
Remove className
(parse)
[error] 301-301: expected , but instead found =
Remove =
(parse)
[error] 301-302: Expected a JSX attribute but instead found '======='.
Expected a JSX attribute here.
(parse)
[error] 303-303: expected ... but instead found }
Remove }
(parse)
[error] 304-304: expected > but instead found <
Remove <
(parse)
[error] 304-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 305-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 305-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 305-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 305-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 305-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 305-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 312-313: Expected a JSX attribute but instead found '<<<<<<'.
Expected a JSX attribute here.
(parse)
[error] 313-313: expected > but instead found <
Remove <
(parse)
[error] 328-328: Expected corresponding JSX closing tag for 'div'.
Opening tag
closing tag
(parse)
[error] 310-313: Expected corresponding JSX closing tag for 'button'.
Opening tag
closing tag
(parse)
[error] 300-303: Expected corresponding JSX closing tag for 'HEAD'.
Opening tag
closing tag
(parse)
[error] 334-334: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 341-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 342-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 342-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 342-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 342-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 342-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 342-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 51-51: Wrap comments inside children within braces.
Unsafe fix: Wrap the comments with braces
(lint/suspicious/noCommentText)
[error] 95-95: Wrap comments inside children within braces.
Unsafe fix: Wrap the comments with braces
(lint/suspicious/noCommentText)
app/login/page.tsx
[error] 21-22: Expected an expression for the left hand side of the << operator.
This operator requires a left hand side value
(parse)
[error] 22-22: Expected an expression but instead found '<<'.
Expected an expression here.
(parse)
[error] 22-22: Expected an expression but instead found '<<'.
Expected an expression here.
(parse)
[error] 23-23: expected , but instead found className
Remove className
(parse)
[error] 23-23: expected , but instead found =
Remove =
(parse)
[error] 23-24: Expected a JSX attribute but instead found '======='.
Expected a JSX attribute here.
(parse)
[error] 25-25: expected > but instead found <
Remove <
(parse)
[error] 25-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 26-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 26-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 26-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 26-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 26-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 26-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 33-33: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 37-38: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'.
Expected a JSX Expression, a Element, or a text here.
(parse)
[error] 40-40: Expected a JSX attribute but instead found '('.
Expected a JSX attribute here.
(parse)
[error] 41-41: expected > but instead found <
Remove <
(parse)
[error] 51-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 52-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 52-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 52-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 52-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 52-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 52-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 54-55: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 55-55: expected < but instead the file ends
the file ends here
(parse)
[error] 35-35: Wrap comments inside children within braces.
Unsafe fix: Wrap the comments with braces
(lint/suspicious/noCommentText)
[error] 44-44: Wrap comments inside children within braces.
Unsafe fix: Wrap the comments with braces
(lint/suspicious/noCommentText)
| <<<<<<< HEAD | ||
| <div className="fixed inset-0 z-50 flex items-center justify-center w-full h-full bg-gradient-to-br from-blue-500/80 via-indigo-400/80 to-purple-600/80"> | ||
| ======= | ||
| <div className="fixed inset-0 flex items-center justify-center w-full h-full bg-gradient-to-br from-blue-500/80 via-indigo-400/80 to-purple-600/80"> | ||
| >>>>>>> 103a9a3825538b99686d415d2314c828cd229ade | ||
| <div className="text-center"> | ||
| <div className="animate-spin rounded-full h-12 w-12 border-b-2 border-blue-600 mx-auto mb-4"></div> | ||
| <p className="text-gray-600">Loading...</p> | ||
| <div className="animate-spin rounded-full h-14 w-14 border-4 border-t-4 border-blue-300 border-t-blue-600 mx-auto mb-5"></div> | ||
| <p className="text-blue-700 font-semibold text-lg drop-shadow">Loading...</p> | ||
| </div> | ||
| </div> | ||
| ) | ||
| } | ||
|
|
||
| // If user is authenticated, don't render anything (effect will redirect) | ||
| if (user) { | ||
| return null | ||
| } | ||
| if (user) return null | ||
|
|
||
| // Show login component for unauthenticated users | ||
| <<<<<<< HEAD | ||
| // Main login page layout (centered) | ||
| return ( | ||
| <div className="fixed inset-0 w-full h-full bg-gradient-to-br from-blue-500/80 via-indigo-400/80 to-purple-600/80 flex items-center justify-center px-2"> | ||
| <Auth /> | ||
| ======= | ||
| // Responsive Fullscreen login with advanced background & centering | ||
| return ( | ||
| <div className="min-h-screen flex items-center justify-center bg-gray-50"> | ||
| <div className="max-w-md w-full"> | ||
| <Auth /> | ||
| <div className="fixed inset-0 w-full h-full bg-gradient-to-br from-blue-500/80 via-indigo-400/80 to-purple-600/80 flex items-center justify-center"> | ||
| <div className="w-full h-full flex items-center justify-center"> | ||
| <div className="w-full max-w-xl px-2 sm:px-4 flex flex-col justify-center items-center h-full"> | ||
| <Auth /> | ||
| </div> | ||
| </div> | ||
| >>>>>>> 103a9a3825538b99686d415d2314c828cd229ade |
There was a problem hiding this comment.
Resolve merge conflict markers before merge.
<<<<<<<, =======, >>>>>>> are still in the loading/layout JSX, so this file will not even compile. Pick the intended variant, delete the conflict markers, and ensure the resulting JSX is valid before merging.
🧰 Tools
🪛 Biome (2.1.2)
[error] 22-22: Expected an expression but instead found '<<'.
Expected an expression here.
(parse)
[error] 22-22: Expected an expression but instead found '<<'.
Expected an expression here.
(parse)
[error] 23-23: expected , but instead found className
Remove className
(parse)
[error] 23-23: expected , but instead found =
Remove =
(parse)
[error] 23-24: Expected a JSX attribute but instead found '======='.
Expected a JSX attribute here.
(parse)
[error] 25-25: expected > but instead found <
Remove <
(parse)
[error] 25-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 26-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 26-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 26-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 26-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 26-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 26-26: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 33-33: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 37-38: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'.
Expected a JSX Expression, a Element, or a text here.
(parse)
[error] 40-40: Expected a JSX attribute but instead found '('.
Expected a JSX attribute here.
(parse)
[error] 41-41: expected > but instead found <
Remove <
(parse)
[error] 51-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 52-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 52-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 52-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 52-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 52-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 52-52: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 35-35: Wrap comments inside children within braces.
Unsafe fix: Wrap the comments with braces
(lint/suspicious/noCommentText)
[error] 44-44: Wrap comments inside children within braces.
Unsafe fix: Wrap the comments with braces
(lint/suspicious/noCommentText)
🤖 Prompt for AI Agents
In app/login/page.tsx around lines 22 to 52 there are unresolved git merge
conflict markers (<<<<<<<, =======, >>>>>>>) leaving two competing JSX variants
for the loading and main layout; remove the conflict markers and choose the
intended variant (or merge their desired attributes), ensure the resulting JSX
is valid (matching opening/closing tags, no duplicate fragments), and keep any
necessary classes (e.g., z-50 on the loading overlay or the responsive wrapper
for the main layout) so the file compiles and behavior is as expected before
committing.
| ======= | ||
|
|
||
| export function Auth() { | ||
| const [isLogin, setIsLogin] = useState(true); | ||
| const [email, setEmail] = useState(''); | ||
| const [password, setPassword] = useState(''); | ||
| const [username, setUsername] = useState(''); | ||
| const [loading, setLoading] = useState(false); | ||
| const [googleLoading, setGoogleLoading] = useState(false); | ||
| const [error, setError] = useState(''); | ||
| const [usernameError, setUsernameError] = useState(''); | ||
| const [usernameSuggestions, setUsernameSuggestions] = useState<string[]>([]); | ||
| const { signIn, signUp, signInWithGoogle } = useAuth(); | ||
|
|
||
| // Username validation regex: 3-20 characters, lowercase, numbers, underscores, hyphens | ||
| const usernameRegex = /^[a-z0-9_-]{3,20}$/; | ||
|
|
||
| // Map Firebase error codes to user-friendly messages | ||
| const getFriendlyErrorMessage = (errorCode: string): string => { | ||
| switch (errorCode) { | ||
| case 'auth/email-already-in-use': | ||
| return 'This email is already registered. Try signing in instead.'; | ||
| case 'auth/weak-password': | ||
| return 'Password should be at least 6 characters long.'; | ||
| case 'auth/invalid-email': | ||
| return 'Please enter a valid email address.'; | ||
| case 'auth/user-not-found': | ||
| return 'No account found with this email. Please sign up first.'; | ||
| case 'auth/wrong-password': | ||
| return 'Incorrect password. Please try again.'; | ||
| case 'auth/too-many-requests': | ||
| return 'Too many failed attempts. Please try again later.'; | ||
| case 'auth/network-request-failed': | ||
| return 'Network error. Please check your connection and try again.'; | ||
| case 'auth/user-disabled': | ||
| return 'This account has been disabled. Please contact support.'; | ||
| default: | ||
| return 'An unexpected error occurred. Please try again.'; | ||
| } | ||
| }; | ||
|
|
||
| const validateUsernameFormat = (username: string): boolean => { | ||
| return usernameRegex.test(username); | ||
| }; | ||
|
|
||
| const checkUsernameUniqueness = async (username: string): Promise<boolean> => { | ||
| try { | ||
| const response = await fetch('/api/check-username', { | ||
| method: 'POST', | ||
| headers: { 'Content-Type': 'application/json' }, | ||
| body: JSON.stringify({ username }), | ||
| }); | ||
|
|
||
| if (!response.ok) { | ||
| console.error('API error:', response.status); | ||
| return false; // Assume taken on error | ||
| } | ||
|
|
||
| const data = await response.json(); | ||
| return data.available; | ||
| } catch (error) { | ||
| console.error('Error checking username uniqueness:', error); | ||
| return false; // Assume taken on error | ||
| } | ||
| }; | ||
|
|
||
| const generateUsernameSuggestions = (baseUsername: string): string[] => { | ||
| const suggestions: string[] = []; | ||
| const cleanBase = baseUsername.replace(/[^a-z0-9_-]/g, '').toLowerCase(); | ||
|
|
||
| // Add numbers | ||
| for (let i = 1; i <= 5; i++) { | ||
| suggestions.push(`${cleanBase}${i}`); | ||
| } | ||
|
|
||
| // Add underscores with numbers | ||
| for (let i = 1; i <= 3; i++) { | ||
| suggestions.push(`${cleanBase}_${i}`); | ||
| } | ||
|
|
||
| return suggestions.slice(0, 5); // Return first 5 suggestions | ||
| }; | ||
| const GoogleLogo = () => ( | ||
| <svg className="w-5 h-5 mr-2" viewBox="0 0 48 48"> | ||
| <g> | ||
| <path fill="#4285F4" d="M44.5 20H24v8.5h11.6C34.6 34.6 29.6 38 24 38c-7.2 0-13-5.8-13-13s5.8-13 | ||
| 13-13c3.2 0 6.2 1.2 8.5 3.2l6.9-6.9C34.3 6 29.4 4 24 4 12.9 4 4 12.9 4 24s8.9 20 20 20c11.1 0 | ||
| 20-8.9 20-20 0-1.3-.1-2.7-.3-4z"/> | ||
| <path fill="#34A853" d="M6.3 14.7l7 5.1C15.6 16.1 19.5 13 24 13c3.2 0 6.2 1.2 8.5 3.2l6.9-6.9C34.3 | ||
| 6 29.4 4 24 4c-7.1 0-13.2 3.9-16.7 10.7z"/> | ||
| <path fill="#FBBC05" d="M24 44c5.2 0 10-1.8 13.7-5.1l-6.5-5.3C29.7 35 26.9 36 24 36c-5.5 0-10.3- | ||
| 3.4-12.4-8.2l-7 5.4C7.1 39.1 14.9 44 24 44z"/> | ||
| <path fill="#EA4335" d="M44.5 20H24v8.5h11.6c-1.4 4.3-5.3 7.5-11.6 7.5-5.5 0-10.2-3.2-12.1-7.8 | ||
| l-7-5.4C7.5 39.1 14.9 44 24 44c7.6 0 14-4.6 17.1-11.3z"/> | ||
| </g> | ||
| </svg> | ||
| ) | ||
| >>>>>>> 103a9a3825538b99686d415d2314c828cd229ade | ||
|
|
||
| const handleUsernameChange = async (value: string) => { | ||
| setUsername(value); | ||
| setUsernameError(''); | ||
| setUsernameSuggestions([]); | ||
| export function Auth() { | ||
| const [loading, setLoading] = useState(false) | ||
| const [error, setError] = useState("") | ||
| <<<<<<< HEAD | ||
| const [tab, setTab] = useState("login") | ||
| ======= | ||
| const [tab, setTab] = useState("login") // login or signup | ||
| >>>>>>> 103a9a3825538b99686d415d2314c828cd229ade | ||
| const [showPassword, setShowPassword] = useState(false) | ||
| const [email, setEmail] = useState("") | ||
| const [password, setPassword] = useState("") | ||
| const [emailTouched, setEmailTouched] = useState(false) | ||
| const [passwordTouched, setPasswordTouched] = useState(false) | ||
|
|
||
| if (value.trim() === '') return; | ||
| <<<<<<< HEAD | ||
| const emailValid = email.includes("@") && email.includes(".") | ||
| const passwordValid = password.length >= 6 | ||
|
|
||
| // Check format | ||
| if (!validateUsernameFormat(value)) { | ||
| setUsernameError('Username must be 3-20 characters, lowercase letters, numbers, underscores, or hyphens only.'); | ||
| return; | ||
| } | ||
| ======= | ||
| // Input validations | ||
| const emailValid = email.includes("@") && email.includes(".") | ||
| const passwordValid = password.length >= 6 | ||
|
|
||
| // Check uniqueness | ||
| const isAvailable = await checkUsernameUniqueness(value); | ||
| if (!isAvailable) { | ||
| setUsernameError('This username is already taken.'); | ||
| const suggestions = generateUsernameSuggestions(value); | ||
| setUsernameSuggestions(suggestions); | ||
| // Email/Password login or signup | ||
| >>>>>>> 103a9a3825538b99686d415d2314c828cd229ade | ||
| const handleFormSubmit = async (e: React.FormEvent) => { | ||
| e.preventDefault() | ||
| setEmailTouched(true) | ||
| setPasswordTouched(true) | ||
| if (!emailValid || !passwordValid) { | ||
| setError("Please fix the errors above") | ||
| return | ||
| } | ||
| }; | ||
|
|
||
| const handleSubmit = async (e: React.FormEvent) => { | ||
| e.preventDefault(); | ||
| setError(''); | ||
| setLoading(true); | ||
|
|
||
| setLoading(true) | ||
| setError("") | ||
| try { | ||
| if (isLogin) { | ||
| const { error } = await signIn(email, password); | ||
| if (error) { | ||
| setError(getFriendlyErrorMessage(error.code || '')); | ||
| setLoading(false); | ||
| } | ||
| // Success - auth state change will trigger navigation | ||
| if (tab === "login") { | ||
| await signInWithEmailAndPassword(auth, email, password) | ||
| } else { | ||
| // Validate username for signup | ||
| if (!username.trim()) { | ||
| setError('Username is required'); | ||
| setLoading(false); | ||
| return; | ||
| } | ||
|
|
||
| if (!validateUsernameFormat(username)) { | ||
| setError('Username must be 3-20 characters, lowercase letters, numbers, underscores, or hyphens only.'); | ||
| setLoading(false); | ||
| return; | ||
| } | ||
|
|
||
| const isAvailable = await checkUsernameUniqueness(username); | ||
| if (!isAvailable) { | ||
| setError('This username is already taken. Please choose a different one.'); | ||
| setLoading(false); | ||
| return; | ||
| } | ||
|
|
||
| const { error } = await signUp(email, password, username); | ||
| if (error) { | ||
| setError(getFriendlyErrorMessage(error.code || '')); | ||
| setLoading(false); | ||
| } | ||
| // Success - auth state change will trigger navigation | ||
| await createUserWithEmailAndPassword(auth, email, password) | ||
| } | ||
| } catch (err) { | ||
| console.error('Auth error:', err); | ||
| setError('An unexpected error occurred. Please try again.'); | ||
| setLoading(false); | ||
| } catch (e: any) { | ||
| setError(e.message || "Authentication failed") | ||
| } | ||
| }; | ||
|
|
||
| setLoading(false) | ||
| } | ||
|
|
||
| <<<<<<< HEAD | ||
| ======= | ||
| // Google sign in | ||
| >>>>>>> 103a9a3825538b99686d415d2314c828cd229ade | ||
| const handleGoogleSignIn = async () => { | ||
| setError(''); | ||
| setGoogleLoading(true); | ||
|
|
||
| setLoading(true) | ||
| setError("") | ||
| try { | ||
| const { error } = await signInWithGoogle(); | ||
| if (error) { | ||
| setError(getFriendlyErrorMessage(error.code || '') || 'Failed to sign in with Google'); | ||
| } | ||
| // Success - auth state change will trigger navigation | ||
| } catch (err) { | ||
| console.error('Google auth error:', err); | ||
| setError('An unexpected error occurred with Google sign-in. Please try again.'); | ||
| } finally { | ||
| setGoogleLoading(false); | ||
| const provider = new GoogleAuthProvider() | ||
| await signInWithPopup(auth, provider) | ||
| } catch (e: any) { | ||
| setError("Google sign-in failed: " + (e.message || "")) | ||
| } | ||
| }; | ||
| setLoading(false) | ||
| } | ||
|
|
||
| // UI | ||
| return ( | ||
| <div className="min-h-screen bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 flex items-center justify-center px-4"> | ||
| <div className="max-w-md w-full"> | ||
| <div className="bg-white rounded-2xl shadow-2xl p-8"> | ||
| <div className="text-center mb-8"> | ||
| <div className="inline-flex items-center justify-center w-16 h-16 bg-gradient-to-br from-blue-500 to-blue-600 rounded-2xl mb-4"> | ||
| <span className="text-2xl font-bold text-white">D</span> | ||
| </div> | ||
| <h1 className="text-3xl font-bold text-gray-900 mb-2">DumpIt</h1> | ||
| <p className="text-gray-600">Your Personal Resource Vault</p> | ||
| </div> | ||
|
|
||
| <div className="flex gap-2 mb-6"> | ||
| <<<<<<< HEAD | ||
| <div className="fixed inset-0 w-full h-full flex items-center justify-center bg-gradient-to-br from-blue-500 via-violet-400 to-purple-300 px-2"> | ||
| <div | ||
| className="relative w-full max-w-md flex flex-col items-center justify-center | ||
| overflow-y-auto min-h-0 sm:min-h-[70vh] max-h-[98vh] | ||
| rounded-2xl border border-[rgba(100,170,255,0.34)] | ||
| bg-gradient-to-br from-white/80 via-white/70 to-blue-50/80 | ||
| shadow-xl p-4 sm:p-7 md:p-10" | ||
| style={{ | ||
| boxShadow: '0 8px 48px -8px rgba(66,110,255,0.23)' | ||
| }} | ||
| > | ||
| <span className="rounded-full bg-white shadow-md p-1 mb-2 -mt-4"> | ||
| <Image src="/logo.png" alt="DumpIt Logo" width={56} height={56} className="mx-auto" priority /> | ||
| </span> | ||
| <h1 className="mb-1 text-3xl md:text-4xl font-bold text-[#2075f7] text-center" | ||
| style={{ | ||
| textShadow: '0 1px 22px #79b5ff, 0 0 1px #2075f7' | ||
| }} | ||
| >DumpIt</h1> | ||
| <div className="text-gray-700 text-base sm:text-lg mb-6 text-center font-medium">Your Personal Resource Vault</div> | ||
| <div className="flex justify-center w-full mb-6 gap-2"> | ||
| {["login", "signup"].map(item => ( | ||
| <button | ||
| type="button" | ||
| onClick={() => setIsLogin(true)} | ||
| className={`flex-1 py-2 px-4 rounded-lg font-medium transition-colors ${ | ||
| isLogin | ||
| ? 'bg-blue-600 text-white' | ||
| : 'bg-gray-100 text-gray-600 hover:bg-gray-200' | ||
| }`} | ||
| key={item} | ||
| className={`flex-1 py-2 rounded-xl text-base font-bold focus:outline-none transition-all | ||
| ${tab === item | ||
| ? "bg-[#2075f7] text-white shadow hover:bg-[#2075f7]/90" | ||
| : "bg-white text-[#2075f7] border border-blue-200/50 hover:bg-blue-50"}`} | ||
| onClick={() => { setTab(item); setError(""); }} | ||
| aria-selected={tab === item} | ||
| > | ||
| Login | ||
| {item === "login" ? "Login" : "Sign Up"} | ||
| </button> | ||
| <button | ||
| type="button" | ||
| onClick={() => setIsLogin(false)} | ||
| className={`flex-1 py-2 px-4 rounded-lg font-medium transition-colors ${ | ||
| !isLogin | ||
| ? 'bg-blue-600 text-white' | ||
| : 'bg-gray-100 text-gray-600 hover:bg-gray-200' | ||
| }`} | ||
| > | ||
| Sign Up | ||
| </button> | ||
| </div> | ||
|
|
||
| <form onSubmit={handleSubmit} className="space-y-4"> | ||
| {!isLogin && ( | ||
| <div> | ||
| <label htmlFor="username" className="block text-sm font-medium text-gray-700 mb-1"> | ||
| Username | ||
| </label> | ||
| <input | ||
| id="username" | ||
| type="text" | ||
| value={username} | ||
| onChange={(e) => handleUsernameChange(e.target.value)} | ||
| className={`w-full px-4 py-2 border rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none transition-all ${ | ||
| usernameError ? 'border-red-500' : 'border-gray-300' | ||
| }`} | ||
| placeholder="johndoe" | ||
| required={!isLogin} | ||
| /> | ||
| {usernameError && ( | ||
| <p className="mt-1 text-sm text-red-600">{usernameError}</p> | ||
| )} | ||
| {usernameSuggestions.length > 0 && ( | ||
| <div className="mt-2"> | ||
| <p className="text-sm text-gray-600 mb-1">Try these instead:</p> | ||
| <div className="flex flex-wrap gap-1"> | ||
| {usernameSuggestions.map((suggestion) => ( | ||
| <button | ||
| key={suggestion} | ||
| type="button" | ||
| onClick={() => handleUsernameChange(suggestion)} | ||
| className="px-2 py-1 text-xs bg-blue-100 text-blue-700 rounded hover:bg-blue-200 transition-colors" | ||
| > | ||
| {suggestion} | ||
| </button> | ||
| ))} | ||
| </div> | ||
| </div> | ||
| )} | ||
| </div> | ||
| ))} | ||
| </div> | ||
| <form className="w-full flex flex-col gap-4" autoComplete="off" onSubmit={handleFormSubmit}> | ||
| <div> | ||
| <label htmlFor="email" className="block mb-1 text-gray-600 font-semibold text-[0.99rem]">Email</label> | ||
| <input | ||
| type="email" | ||
| id="email" | ||
| value={email} | ||
| className={`w-full rounded-lg border border-gray-300 p-3 text-base bg-white focus:outline-none | ||
| focus:ring-2 focus:ring-[#2075f7] transition-all | ||
| ${emailTouched && !emailValid && "border-red-400 bg-red-50"}`} | ||
| placeholder="you@example.com" | ||
| required | ||
| onChange={(e: React.ChangeEvent<HTMLInputElement>) => setEmail(e.target.value)} | ||
| onBlur={() => setEmailTouched(true)} | ||
| /> | ||
| {emailTouched && !emailValid && ( | ||
| <div className="text-red-500 text-xs mt-1 pl-1">Enter a valid email</div> | ||
| )} | ||
|
|
||
| <div> | ||
| <label htmlFor="email" className="block text-sm font-medium text-gray-700 mb-1"> | ||
| </label> | ||
| <input | ||
| id="email" | ||
| type="email" | ||
| value={email} | ||
| onChange={(e) => setEmail(e.target.value)} | ||
| className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none transition-all" | ||
| placeholder="you@example.com" | ||
| required | ||
| /> | ||
| </div> | ||
|
|
||
| <div> | ||
| <label htmlFor="password" className="block text-sm font-medium text-gray-700 mb-1"> | ||
| Password | ||
| </label> | ||
| </div> | ||
| <div> | ||
| <label htmlFor="password" className="block mb-1 text-gray-600 font-semibold text-[0.99rem]">Password</label> | ||
| <div className="relative"> | ||
| <input | ||
| type={showPassword ? "text" : "password"} | ||
| id="password" | ||
| type="password" | ||
| value={password} | ||
| onChange={(e) => setPassword(e.target.value)} | ||
| className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none transition-all" | ||
| placeholder="••••••••" | ||
| className={`w-full rounded-lg border border-gray-300 p-3 pr-12 text-base bg-white | ||
| focus:outline-none focus:ring-2 focus:ring-[#2075f7] transition-all | ||
| ${passwordTouched && !passwordValid && "border-red-400 bg-red-50"}`} | ||
| placeholder="Enter password" | ||
| required | ||
| minLength={6} | ||
| onChange={(e: React.ChangeEvent<HTMLInputElement>) => setPassword(e.target.value)} | ||
| onBlur={() => setPasswordTouched(true)} | ||
| /> | ||
| <button | ||
| type="button" | ||
| className="absolute top-3 right-4 text-gray-400 focus:outline-none hover:text-[#2075f7]" | ||
| onClick={() => setShowPassword(val => !val)} | ||
| aria-label={showPassword ? "Hide password" : "Show password"} | ||
| tabIndex={-1} | ||
| > | ||
| {showPassword ? ( | ||
| <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | ||
| <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M17.94 17.94A10.02 10.02 0 0112 20a10.02 10.02 0 01-7.94-2.06M3 3l18 18"></path> | ||
| </svg> | ||
| ) : ( | ||
| <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | ||
| <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 12a3 3 0 11-6 0 3 3 0 016 0zm2.7 6.3a10 10 0 01-7.4 2.7 10 10 0 01-7.4-2.7"></path> | ||
| </svg> | ||
| )} | ||
| </button> | ||
| </div> | ||
|
|
||
| {error && ( | ||
| <div className="bg-red-50 border border-red-200 text-red-700 px-4 py-3 rounded-lg text-sm"> | ||
| {error} | ||
| </div> | ||
| {passwordTouched && !passwordValid && ( | ||
| <div className="text-red-500 text-xs mt-1 pl-1">Password must be at least 6 characters</div> | ||
| )} | ||
|
|
||
| ======= | ||
| <div className="w-full h-full flex items-center justify-center"> | ||
| <div className="w-full max-w-md rounded-2xl bg-white/90 shadow-[0_12px_60px_-12px_rgba(30,64,175,0.32)] p-6 md:p-10 transition-all"> | ||
| {/* Logo & Header */} | ||
| <div className="flex flex-col items-center space-y-2 pb-7 animate-fade-in"> | ||
| <span className="block rounded-full bg-white shadow-lg p-2"> | ||
| <Image | ||
| src="/logo.png" | ||
| alt="DumpIt Logo" | ||
| width={64} | ||
| height={64} | ||
| className="mx-auto" | ||
| priority | ||
| /> | ||
| </span> | ||
| <h1 className="mt-3 text-3xl md:text-4xl font-extrabold text-gray-800 tracking-tight">DumpIt</h1> | ||
| <div className="text-gray-500 text-base md:text-lg font-medium text-center">Your Personal Resource Vault</div> | ||
| </div> | ||
| {/* Tab switch */} | ||
| <div className="flex justify-between items-center mb-7 gap-2"> | ||
| {["login", "signup"].map(item => ( | ||
| <button | ||
| type="submit" | ||
| disabled={loading || googleLoading} | ||
| className="w-full bg-gradient-to-r from-blue-600 to-blue-700 text-white py-3 px-4 rounded-lg font-medium hover:from-blue-700 hover:to-blue-800 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-all disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2" | ||
| key={item} | ||
| className={`flex-1 px-4 py-2 rounded-xl font-semibold border transition-all focus:outline-none hover:scale-[1.04] ${ | ||
| tab === item | ||
| ? "bg-blue-600 text-white shadow-md" | ||
| : "bg-gray-100 text-gray-700" | ||
| }`} | ||
| onClick={() => { setTab(item); setError(""); }} | ||
| aria-selected={tab === item} | ||
| > | ||
| {loading ? ( | ||
| <Loader2 className="w-5 h-5 animate-spin" /> | ||
| ) : isLogin ? ( | ||
| <> | ||
| <LogIn className="w-5 h-5" /> | ||
| Login | ||
| </> | ||
| ) : ( | ||
| <> | ||
| <UserPlus className="w-5 h-5" /> | ||
| Create Account | ||
| </> | ||
| )} | ||
| {item === "login" ? "Login" : "Sign Up"} | ||
| </button> | ||
|
|
||
| <div className="mt-6 relative flex items-center"> | ||
| <div className="flex-grow border-t border-gray-300"></div> | ||
| <span className="flex-shrink mx-4 text-gray-600 text-sm">or continue with</span> | ||
| <div className="flex-grow border-t border-gray-300"></div> | ||
| </div> | ||
|
|
||
| ))} | ||
| </div> | ||
| {/* Form */} | ||
| <form className="space-y-5" autoComplete="off" onSubmit={handleFormSubmit}> | ||
| <div> | ||
| <label htmlFor="email" className="block mb-1 text-gray-700 font-semibold text-sm">Email</label> | ||
| <input | ||
| type="email" | ||
| id="email" | ||
| value={email} | ||
| className={`w-full rounded-xl border border-gray-300 p-3 text-base focus:outline-none focus:ring-2 focus:ring-blue-400 transition-all ${emailTouched && !emailValid && "border-red-400"}`} | ||
| placeholder="you@example.com" | ||
| required | ||
| onChange={e => setEmail(e.target.value)} | ||
| onBlur={() => setEmailTouched(true)} | ||
| /> | ||
| {emailTouched && !emailValid && <div className="text-red-500 text-xs mt-1">Enter a valid email</div>} | ||
| </div> | ||
| <div className="relative"> | ||
| <label htmlFor="password" className="block mb-1 text-gray-700 font-semibold text-sm">Password</label> | ||
| <input | ||
| type={showPassword ? "text" : "password"} | ||
| id="password" | ||
| value={password} | ||
| className={`w-full rounded-xl border border-gray-300 p-3 pr-12 text-base focus:outline-none focus:ring-2 focus:ring-blue-400 transition-all ${passwordTouched && !passwordValid && "border-red-400"}`} | ||
| placeholder="Enter password" | ||
| required | ||
| minLength={6} | ||
| onChange={e => setPassword(e.target.value)} | ||
| onBlur={() => setPasswordTouched(true)} | ||
| /> | ||
| <button | ||
| type="button" | ||
| onClick={handleGoogleSignIn} | ||
| disabled={loading || googleLoading} | ||
| className="mt-4 w-full bg-white border border-gray-300 text-gray-700 py-3 px-4 rounded-lg font-medium hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-all disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2" | ||
| className="absolute top-9 right-3 text-gray-500 focus:outline-none hover:text-blue-700" | ||
| onClick={() => setShowPassword(val => !val)} | ||
| aria-label={showPassword ? "Hide password" : "Show password"} | ||
| tabIndex={-1} | ||
| > | ||
| {googleLoading ? ( | ||
| <Loader2 className="w-5 h-5 animate-spin" /> | ||
| {showPassword ? ( | ||
| <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | ||
| <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M17.94 17.94A10.02 10.02 0 0112 20a10.02 10.02 0 01-7.94-2.06M3 3l18 18"></path> | ||
| </svg> | ||
| ) : ( | ||
| <> | ||
| <svg className="w-5 h-5" viewBox="0 0 24 24"> | ||
| <path | ||
| d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z" | ||
| fill="#4285F4" | ||
| /> | ||
| <path | ||
| d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" | ||
| fill="#34A853" | ||
| /> | ||
| <path | ||
| d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z" | ||
| fill="#FBBC05" | ||
| /> | ||
| <path | ||
| d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z" | ||
| fill="#EA4335" | ||
| /> | ||
| </svg> | ||
| Continue with Google | ||
| </> | ||
| <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> | ||
| <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 12a3 3 0 11-6 0 3 3 0 016 0zm2.7 6.3a10 10 0 01-7.4 2.7 10 10 0 01-7.4-2.7"></path> | ||
| </svg> | ||
| )} | ||
| </button> | ||
| </form> | ||
| {passwordTouched && !passwordValid && <div className="text-red-500 text-xs mt-1">Password must be at least 6 characters</div>} | ||
| >>>>>>> 103a9a3825538b99686d415d2314c828cd229ade | ||
| </div> | ||
| {error && ( | ||
| <div className="text-red-600 text-sm mt-1 text-center">{error}</div> | ||
| )} | ||
| <button | ||
| type="submit" | ||
| disabled={!emailValid || !passwordValid || loading} | ||
| <<<<<<< HEAD | ||
| className={`w-full py-3 rounded-lg font-bold flex items-center justify-center gap-2 shadow-lg | ||
| text-[1.07rem] transition-all | ||
| ${emailValid && passwordValid && !loading | ||
| ? "bg-gradient-to-r from-[#287ffd] via-[#0b4edf] to-[#2ac6fa] text-white hover:brightness-110" | ||
| : "bg-gradient-to-r from-gray-300 to-gray-200 text-white" | ||
| }`} | ||
| ======= | ||
| className={`w-full py-3 rounded-xl font-bold text-white flex items-center justify-center gap-2 shadow-lg transition-all text-lg | ||
| ${emailValid && passwordValid && !loading ? "bg-blue-700 cursor-pointer hover:bg-blue-800" : "bg-gray-300 cursor-not-allowed"} | ||
| `} | ||
| >>>>>>> 103a9a3825538b99686d415d2314c828cd229ade | ||
| > | ||
| <span>{tab === "login" ? "Login" : "Sign Up"}</span> | ||
| {!loading ? ( | ||
| <svg className="w-5 h-5" fill="none" stroke="white" viewBox="0 0 24 24"><path d="M17 8l4 4m0 0l-4 4m4-4H3" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/></svg> | ||
| ) : ( | ||
| <svg className="w-5 h-5 animate-spin" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" stroke="#fff" strokeWidth="4" fill="none"/><path d="M4 12a8 8 0 018-8v8z" fill="#fff"/></svg> | ||
| )} | ||
| </button> | ||
| </form> | ||
| <<<<<<< HEAD | ||
| <div className="flex items-center my-7 w-full"> | ||
| ======= | ||
| {/* Social login separator and Google */} | ||
| <div className="flex items-center my-7"> | ||
| >>>>>>> 103a9a3825538b99686d415d2314c828cd229ade | ||
| <span className="border-t flex-1"></span> | ||
| <span className="mx-3 text-gray-400 text-xs">OR</span> | ||
| <span className="border-t flex-1"></span> | ||
| </div> | ||
| <button | ||
| type="button" | ||
| onClick={handleGoogleSignIn} | ||
| <<<<<<< HEAD | ||
| className="w-full py-3 flex items-center justify-center rounded-lg border border-gray-300 | ||
| bg-white shadow hover:bg-blue-50/50 transition font-semibold text-base text-gray-700" | ||
| disabled={loading} | ||
| > | ||
| <Image | ||
| src="/Google.png" | ||
| alt="Google logo" | ||
| width={24} | ||
| height={24} | ||
| className="mr-2" | ||
| style={{ objectFit: "cover" }} | ||
| /> | ||
| <span>{loading ? "Signing in..." : "Continue with Google"}</span> | ||
| </button> | ||
| <div className="flex flex-col items-center mt-5 text-xs text-gray-500 gap-1"> | ||
| <span>By logging in, you accept our <a className="underline hover:text-[#2075f7]" href="/privacy" tabIndex={0}>Privacy Policy</a>.</span> | ||
| <span>Need help? <a className="underline hover:text-[#2075f7]" href="/support" tabIndex={0}>Contact Support</a></span> | ||
| ======= | ||
| className="w-full py-3 flex items-center justify-center rounded-xl border border-gray-300 bg-white shadow-md hover:bg-gray-50 transition font-semibold text-base text-gray-600" | ||
| disabled={loading} | ||
| > | ||
| <GoogleLogo /> | ||
| <span>{loading ? "Signing in..." : "Continue with Google"}</span> | ||
| </button> | ||
| {/* Legal/support links */} | ||
| <div className="flex flex-col items-center mt-5 text-xs text-gray-500 gap-1"> | ||
| <span>By logging in, you accept our <a className="underline hover:text-blue-600" href="/privacy" tabIndex={0}>Privacy Policy</a>.</span> | ||
| <span>Need help? <a className="underline hover:text-blue-600" href="/support" tabIndex={0}>Contact Support</a></span> | ||
| >>>>>>> 103a9a3825538b99686d415d2314c828cd229ade | ||
| </div> |
There was a problem hiding this comment.
Remove merge conflict markers from the Auth component.
The component still contains <<<<<<<, =======, >>>>>>> across imports, state, and JSX. This breaks TypeScript compilation and blocks the app from running. Resolve the conflict, choose the desired implementation, and clean up the markers before merging.
🧰 Tools
🪛 Biome (2.1.2)
[error] 30-30: Expected an expression but instead found '>>>'.
Expected an expression here.
(parse)
[error] 30-30: Expected an expression but instead found '>'.
Expected an expression here.
(parse)
[error] 30-30: numbers cannot be followed by identifiers directly after
an identifier cannot appear here
(parse)
[error] 35-35: Expected an expression but instead found '<<'.
Expected an expression here.
(parse)
[error] 35-35: Expected an expression but instead found '<<'.
Expected an expression here.
(parse)
[error] 36-36: Expected a JSX attribute but instead found '['.
Expected a JSX attribute here.
(parse)
[error] 36-36: Expected a JSX attribute but instead found ','.
Expected a JSX attribute here.
(parse)
[error] 36-36: Expected a JSX attribute but instead found '] ='.
Expected a JSX attribute here.
(parse)
[error] 36-38: Expected a JSX attribute but instead found '("login")
const ['.
Expected a JSX attribute here.
(parse)
[error] 38-38: Expected a JSX attribute but instead found ','.
Expected a JSX attribute here.
(parse)
[error] 38-38: Expected a JSX attribute but instead found '] ='.
Expected a JSX attribute here.
(parse)
[error] 38-38: Expected a JSX attribute but instead found '("login")'.
Expected a JSX attribute here.
(parse)
[error] 39-39: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 39-39: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 39-39: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 39-39: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 39-39: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 39-39: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 45-46: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'.
Expected a JSX Expression, a Element, or a text here.
(parse)
[error] 47-47: Expected a JSX attribute value but instead found 'email'.
Expected a JSX attribute value here.
(parse)
[error] 47-47: Expected a JSX attribute but instead found '.'.
Expected a JSX attribute here.
(parse)
[error] 47-47: Expected a JSX attribute but instead found '("@") &&'.
Expected a JSX attribute here.
(parse)
[error] 47-47: Expected a JSX attribute but instead found '.'.
Expected a JSX attribute here.
(parse)
[error] 47-48: Expected a JSX attribute but instead found '(".")
const'.
Expected a JSX attribute here.
(parse)
[error] 48-48: Expected a JSX attribute value but instead found 'password'.
Expected a JSX attribute value here.
(parse)
[error] 48-48: Expected a JSX attribute but instead found '.'.
Expected a JSX attribute here.
(parse)
[error] 53-53: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 55-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 56-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 56-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 56-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 56-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 56-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 56-56: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 57-57: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 59-59: expected } but instead found setEmailTouched
Remove setEmailTouched
(parse)
[error] 63-63: expected } but instead found return
Remove return
(parse)
[error] 64-64: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 68-68: expected } but instead found if
Remove if
(parse)
[error] 69-69: await is only allowed within async functions and at the top levels of modules.
(parse)
[error] 71-71: await is only allowed within async functions and at the top levels of modules.
(parse)
[error] 73-73: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 77-77: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 78-79: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'.
Expected a JSX Expression, a Element, or a text here.
(parse)
[error] 79-80: Expected a JSX attribute but instead found '======='.
Expected a JSX attribute here.
(parse)
[error] 82-82: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 82-82: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 82-82: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 82-82: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 82-82: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 82-82: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 83-83: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 85-85: expected } but instead found setError
Remove setError
(parse)
[error] 87-87: expected } but instead found const
Remove const
(parse)
[error] 89-89: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 93-93: Unexpected token. Did you mean {'}'} or }?
(parse)
[error] 96-97: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'.
Expected a JSX Expression, a Element, or a text here.
(parse)
[error] 98-98: expected , but instead found className
Remove className
(parse)
[error] 98-98: expected , but instead found =
Remove =
(parse)
[error] 99-99: expected > but instead found <
Remove <
(parse)
[error] 270-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 271-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 271-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 271-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 271-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 271-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 271-271: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 278-279: Expected a JSX attribute but instead found '<<<<<<'.
Expected a JSX attribute here.
(parse)
[error] 279-279: expected > but instead found <
Remove <
(parse)
[error] 285-286: Expected a JSX attribute but instead found '======='.
Expected a JSX attribute here.
(parse)
[error] 279-290: Expected corresponding JSX closing tag for 'HEAD'.
Opening tag
closing tag
(parse)
[error] 276-279: Expected corresponding JSX closing tag for 'button'.
Opening tag
closing tag
(parse)
[error] 290-290: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 290-290: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 290-290: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 290-290: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 290-290: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 290-290: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 291-291: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 299-300: Expected a JSX Expression, a Element, or a text but instead found '<<<<<<'.
Expected a JSX Expression, a Element, or a text here.
(parse)
[error] 301-301: expected , but instead found className
Remove className
(parse)
[error] 301-301: expected , but instead found =
Remove =
(parse)
[error] 301-302: Expected a JSX attribute but instead found '======='.
Expected a JSX attribute here.
(parse)
[error] 303-303: expected ... but instead found }
Remove }
(parse)
[error] 304-304: expected > but instead found <
Remove <
(parse)
[error] 304-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 305-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 305-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 305-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 305-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 305-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 305-305: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 312-313: Expected a JSX attribute but instead found '<<<<<<'.
Expected a JSX attribute here.
(parse)
[error] 313-313: expected > but instead found <
Remove <
(parse)
[error] 328-328: Expected corresponding JSX closing tag for 'div'.
Opening tag
closing tag
(parse)
[error] 310-313: Expected corresponding JSX closing tag for 'button'.
Opening tag
closing tag
(parse)
[error] 300-303: Expected corresponding JSX closing tag for 'HEAD'.
Opening tag
closing tag
(parse)
[error] 334-334: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 341-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 342-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 342-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 342-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 342-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 342-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 342-342: Unexpected token. Did you mean {'>'} or >?
(parse)
[error] 51-51: Wrap comments inside children within braces.
Unsafe fix: Wrap the comments with braces
(lint/suspicious/noCommentText)
[error] 95-95: Wrap comments inside children within braces.
Unsafe fix: Wrap the comments with braces
(lint/suspicious/noCommentText)
|
Sir, I have Resolved Merge Conflicts Once Please check it and Merge |
|
I don't think so! 
|
3 participants
Closes #34
Issue:-
The page is centered with a white login card on a dark gradient background.
The design looks clean and modern — using a blue accent color for action buttons.
Both Login and Sign Up tabs are present, but only Login seems active (blue background).
The Email and Password fields appear normal.
Description:-
The login page UI was revamped to match the new color theme, giving it a modern and vibrant look. The Dumplt logo was added and enlarged for better brand visibility. Button colors and gradients were adjusted for consistency, improving overall visual appeal and user experience.
Before:-
After:-
Summary by CodeRabbit
New Features
UX Improvements
Bug Fixes
✏️ Tip: You can customize this high-level summary in your review settings.