🐛 Bug Report: Login Page Shows Blank Screen Due to `ArrowLeft is not defined`

[arpit2006]

📌 Description

The /login route is currently broken and renders a completely blank white screen instead of the authentication interface.

Upon inspecting the browser console, a runtime error is thrown:

Uncaught ReferenceError: ArrowLeft is not defined

This JavaScript error prevents the React component from rendering successfully, causing the entire login page to crash.

---

🌐 Affected Route

/login

Production URL:

https://github-spy.netlify.app/login

---

🖼️ Current Behavior

• Login page appears completely blank
• No UI components are rendered
• Users cannot access authentication
• Browser console continuously shows runtime error

---

✅ Expected Behavior

• Login page should load properly
• Authentication form should be visible
• Navigation/back button should render correctly
• No runtime console errors should occur

---

⚠️ Console Error

Uncaught ReferenceError: ArrowLeft is not defined
    at dv (index-C9XWO8td.js:566:26115)
    at gm (index-C9XWO8td.js:38:16998)
    at V2 (index-C9XWO8td.js:40:43963)
    at D2 (index-C9XWO8td.js:40:39727)
    at m3 (index-C9XWO8td.js:40:39655)
    at Mc (index-C9XWO8td.js:40:39508)
    at Op (index-C9XWO8td.js:40:35875)
    at T2 (index-C9XWO8td.js:40:34826)
    at C (index-C9XWO8td.js:25:1554)
    at MessagePort.A (index-C9XWO8td.js:25:1918)

---

🤔 Possible Cause

The ArrowLeft component/icon is likely being used without importing it from the required icon library.

Example problematic code:

<ArrowLeft />

Missing import:

import { ArrowLeft } from "lucide-react";

or another icon package depending on the project setup.

---

🛠️ Suggested Fix

1. Verify Import Statement

Ensure the component is properly imported:

import { ArrowLeft } from "lucide-react";

---

2. Verify Package Installation

If using Lucide icons:

npm install lucide-react

---

3. Check Component References

Ensure:

• No typo in ArrowLeft
• Correct icon library is used
• Import path is valid
• Component exists in the installed package

---

4. Add Error Boundary (Recommended)

To prevent the entire page from crashing due to small component errors, consider implementing a React Error Boundary.

Example:

<ErrorBoundary>
  <LoginPage />
</ErrorBoundary>

---

📷 Screenshots

Blank Login Screen

Attach screenshot here

---

Console Error

Attach screenshot here

---

📌 Impact

This is a high-priority frontend issue because:

• Users cannot access login/authentication
• Entire page crashes on render
• Affects usability and onboarding flow

---

🏷️ Suggested Labels

bug
frontend
react
authentication
high-priority
gssoc

---

🙋 Contribution

I would like to work on this issue under GSSoC.
Please assign this issue to me!

[mehul-m-prajapati]

fixed, check again