Add an Empty State to the Issues Page

[Vedant1703]

The /issues page currently has no empty state. When a user visits this page and has no watched repositories (or no issues to show), they see a completely blank screen with no explanation or call-to-action. This is a confusing experience, especially for new users who haven't set up their watchlist yet.

A well-designed empty state with an icon, a clear message, and a helpful link will guide users toward the next step.

---

📍 Files to Change / Create

• Create: frontend/app/(auth)/issues/components/EmptyIssuesState.tsx
• Modify: The issues page to render this component when there are no issues

---

✅ What To Do

Create a new file EmptyIssuesState.tsx:

import { Bug } from 'lucide-react';
import Link from 'next/link';

export default function EmptyIssuesState() {
  return (
    <div className="flex flex-col items-center justify-center py-24 text-center">
      <div className="w-16 h-16 rounded-full bg-[#161b22] border border-[#30363d] flex items-center justify-center mb-6">
        <Bug className="w-8 h-8 text-[#8b949e]" />
      </div>
      <h2 className="text-xl font-semibold text-[#c9d1d9] mb-2">No issues found</h2>
      <p className="text-sm text-[#8b949e] max-w-sm mb-6">
        Watch some repositories from the Discover page to start seeing their open issues here.
      </p>
      <Link
        href="/discover"
        className="inline-flex items-center gap-2 px-4 py-2 rounded-lg bg-[#238636] text-white text-sm hover:bg-[#2ea043] transition-colors"
      >
        Go to Discover
      </Link>
    </div>
  );
}

Then use it in the issues page file when there are no issues to render.

---

🏁 Acceptance Criteria

• A new EmptyIssuesState.tsx component is created inside frontend/app/(auth)/issues/components/
• It is rendered when there are no issues to display
• The design matches the dark theme used throughout the app (bg-[#0d1117], text-[#8b949e], etc.)
• A link/button navigates the user to /discover
• The component includes an icon, a heading, and a helpful description

---

💡 Technical Hints

• Look at frontend/app/(auth)/discover/components/emptystate.tsx as a direct reference — the pattern is the same
• Bug and other icons are available from lucide-react (already installed)
• Use Link from next/link for the CTA button, not a plain <a> tag

---

🚀 Getting Started

1. Fork the repository
2. Create a branch: git checkout -b fix/issue-5-issues-empty-state
3. Create frontend/app/(auth)/issues/components/EmptyIssuesState.tsx
4. Integrate it into the issues page
5. Run locally: cd frontend && npm run dev → navigate to /issues
6. Open a Pull Request!