From 512ce16099b7a280fba738a0766e32a143b984a7 Mon Sep 17 00:00:00 2001
From: Rajgupta36 <raj.gupta369@outlook.com>
Date: Sun, 8 Jun 2025 18:49:44 +0530
Subject: [PATCH 1/7] handle empty auth credentials

---
 .../src/app/api/auth/[...nextauth]/route.ts   | 23 ++++++++++++++-----
 frontend/src/app/login/page.tsx               | 11 ++++++++-
 frontend/src/components/UserMenu.tsx          |  8 ++++---
 frontend/src/utils/constants.ts               |  3 +++
 frontend/src/utils/credentials.ts             |  2 +-
 5 files changed, 36 insertions(+), 11 deletions(-)

diff --git a/frontend/src/app/api/auth/[...nextauth]/route.ts b/frontend/src/app/api/auth/[...nextauth]/route.ts
index fb7f22c16a..32f338077c 100644
--- a/frontend/src/app/api/auth/[...nextauth]/route.ts
+++ b/frontend/src/app/api/auth/[...nextauth]/route.ts
@@ -2,6 +2,7 @@ import { gql } from '@apollo/client'
 import NextAuth from 'next-auth'
 import GitHubProvider from 'next-auth/providers/github'
 import { apolloClient } from 'server/apolloClient'
+import { isAuthEnable } from 'utils/constants'
 import {
   GITHUB_CLIENT_ID,
   GITHUB_CLIENT_SECRET,
@@ -9,18 +10,28 @@ import {
   NEXTAUTH_URL,
 } from 'utils/credentials'
 
-const authOptions = {
-  providers: [
+const providers = []
+
+if (isAuthEnable) {
+  providers.push(
     GitHubProvider({
-      clientId: GITHUB_CLIENT_ID!,
-      clientSecret: GITHUB_CLIENT_SECRET!,
-    }),
-  ],
+      clientId: GITHUB_CLIENT_ID,
+      clientSecret: GITHUB_CLIENT_SECRET,
+    })
+  )
+}
+
+const authOptions = {
+  providers,
   session: {
     strategy: 'jwt' as const,
   },
   callbacks: {
     async signIn({ account }) {
+      if (!isAuthEnable && account?.provider === 'github') {
+        return false
+      }
+
       if (account?.provider === 'github' && account.access_token) {
         try {
           const { data } = await apolloClient.mutate({
diff --git a/frontend/src/app/login/page.tsx b/frontend/src/app/login/page.tsx
index 9083e9bdce..58c93e8906 100644
--- a/frontend/src/app/login/page.tsx
+++ b/frontend/src/app/login/page.tsx
@@ -7,7 +7,7 @@ import { addToast } from '@heroui/toast'
 import { useRouter } from 'next/navigation'
 import { useSession, signIn } from 'next-auth/react'
 import { useEffect } from 'react'
-import { userAuthStatus } from 'utils/constants'
+import { isAuthEnable, userAuthStatus } from 'utils/constants'
 
 export default function LoginPage() {
   const { status } = useSession()
@@ -27,6 +27,15 @@ export default function LoginPage() {
     }
   }, [status, router])
 
+  if (!isAuthEnable) {
+    return (
+      <div className="flex min-h-[80vh] items-center justify-center">
+        <FontAwesomeIcon icon={faSpinner} height={16} width={16} />
+        <span className="text-lg text-gray-500">Authentication is disabled</span>
+      </div>
+    )
+  }
+
   if (status === userAuthStatus.LOADING) {
     return (
       <div className="flex min-h-[80vh] items-center justify-center">
diff --git a/frontend/src/components/UserMenu.tsx b/frontend/src/components/UserMenu.tsx
index e448aa73ba..7222419db7 100644
--- a/frontend/src/components/UserMenu.tsx
+++ b/frontend/src/components/UserMenu.tsx
@@ -3,7 +3,7 @@
 import { Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, Skeleton } from '@heroui/react'
 import Image from 'next/image'
 import { useSession, signIn, signOut } from 'next-auth/react'
-import { userAuthStatus } from 'utils/constants'
+import { isAuthEnable, userAuthStatus } from 'utils/constants'
 
 export default function UserMenu() {
   const { data: session, status } = useSession()
@@ -15,10 +15,12 @@ export default function UserMenu() {
       </div>
     )
   }
-  if (!session) {
+
+  if (!session || !isAuthEnable) {
     return (
       <button
-        onClick={() => signIn('github', { callbackUrl: '/', prompt: 'login' })}
+        onClick={() => isAuthEnable && signIn('github', { callbackUrl: '/', prompt: 'login' })}
+        disabled={!isAuthEnable}
         className="group relative flex h-10 w-full cursor-pointer items-center justify-center gap-2 overflow-hidden whitespace-pre rounded-md bg-[#87a1bc] px-4 py-2 text-sm font-medium text-black hover:ring-1 hover:ring-[#b0c7de] hover:ring-offset-0 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 dark:bg-slate-900 dark:text-white dark:hover:bg-slate-900/90 dark:hover:ring-[#46576b] md:flex"
       >
         Sign in
diff --git a/frontend/src/utils/constants.ts b/frontend/src/utils/constants.ts
index 51a33be1db..ac37b53f3c 100644
--- a/frontend/src/utils/constants.ts
+++ b/frontend/src/utils/constants.ts
@@ -1,6 +1,7 @@
 import { faGithub, faSlack, faBluesky, faLinkedin } from '@fortawesome/free-brands-svg-icons'
 import { Link } from 'types/link'
 import { Section } from 'types/section'
+import { GITHUB_CLIENT_ID } from 'utils/credentials'
 
 export const headerLinks: Link[] = [
   {
@@ -123,3 +124,5 @@ export const userAuthStatus = {
   LOADING: 'loading',
   UNAUTHENTICATED: 'unauthenticated',
 }
+
+export const isAuthEnable = Boolean(GITHUB_CLIENT_ID)
diff --git a/frontend/src/utils/credentials.ts b/frontend/src/utils/credentials.ts
index 55fcc9887b..db31f36c08 100644
--- a/frontend/src/utils/credentials.ts
+++ b/frontend/src/utils/credentials.ts
@@ -2,7 +2,7 @@ export const API_URL = process.env.NEXT_PUBLIC_API_URL
 export const CSRF_URL = process.env.NEXT_PUBLIC_CSRF_URL
 export const ENVIRONMENT = process.env.NEXT_PUBLIC_ENVIRONMENT
 export const GRAPHQL_URL = process.env.NEXT_PUBLIC_GRAPHQL_URL
-export const GITHUB_CLIENT_ID = process.env.NEXT_SERVER_GITHUB_CLIENT_ID
+export const GITHUB_CLIENT_ID = process.env.NEXT_PUBLIC_GITHUB_CLIENT_ID
 export const GITHUB_CLIENT_SECRET = process.env.NEXT_SERVER_GITHUB_CLIENT_SECRET
 export const GTM_ID = process.env.NEXT_PUBLIC_GTM_ID
 export const IDX_URL = process.env.NEXT_PUBLIC_IDX_URL

From af53a367984a6445fd88b41f34119535c73acfce Mon Sep 17 00:00:00 2001
From: Rajgupta36 <raj.gupta369@outlook.com>
Date: Sun, 8 Jun 2025 21:58:35 +0530
Subject: [PATCH 2/7] update test cases

---
 frontend/.env.example                         |  4 +--
 frontend/__tests__/e2e/pages/Login.spec.ts    | 29 ++-------------
 frontend/__tests__/unit/pages/Login.test.tsx  | 35 ++++++++++++++++---
 .../src/app/api/auth/[...nextauth]/route.ts   |  4 +--
 frontend/src/app/login/page.tsx               |  2 +-
 frontend/src/components/UserMenu.tsx          |  6 ++--
 frontend/src/utils/constants.ts               |  4 ++-
 frontend/src/utils/credentials.ts             |  2 +-
 8 files changed, 45 insertions(+), 41 deletions(-)

diff --git a/frontend/.env.example b/frontend/.env.example
index 6fdce70c49..eb3184eaf6 100644
--- a/frontend/.env.example
+++ b/frontend/.env.example
@@ -10,6 +10,6 @@ NEXT_PUBLIC_SENTRY_DSN=
 NEXT_SERVER_CSRF_URL=http://backend:8000/csrf/
 NEXT_SERVER_DISABLE_SSR=false
 NEXT_SERVER_GRAPHQL_URL=http://backend:8000/graphql/
-NEXT_SERVER_GITHUB_CLIENT_ID=
+NEXT_PUBLIC_GITHUB_CLIENT_ID=
 NEXT_SERVER_GITHUB_CLIENT_SECRET=
-NEXT_SERVER_NEXTAUTH_SECRET=
+NEXTAUTH_SECRET=
diff --git a/frontend/__tests__/e2e/pages/Login.spec.ts b/frontend/__tests__/e2e/pages/Login.spec.ts
index 5671a2c733..7588a0f9dd 100644
--- a/frontend/__tests__/e2e/pages/Login.spec.ts
+++ b/frontend/__tests__/e2e/pages/Login.spec.ts
@@ -1,7 +1,7 @@
 import { mockHomeData } from '@e2e/data/mockHomeData'
 import { test, expect } from '@playwright/test'
 
-test.describe('Login Page', () => {
+test.describe('LoginPage - Auth Disabled State', () => {
   test.beforeEach(async ({ page }) => {
     await page.route('**/graphql/', async (route) => {
       await route.fulfill({
@@ -23,31 +23,8 @@ test.describe('Login Page', () => {
     ])
   })
 
-  test('displays GitHub login button when unauthenticated', async ({ page }) => {
+  test('should display auth disabled message if env vars are missing', async ({ page }) => {
     await page.goto('/login')
-
-    const button = page.getByRole('button', { name: /sign in with github/i })
-    await expect(button).toBeVisible()
-  })
-
-  test('displays loading spinner when logging in', async ({ page }) => {
-    await page.goto('/login')
-
-    const button = page.getByRole('button', { name: /sign in with github/i })
-    await button.click()
-    await expect(page).toHaveURL(/github\.com/)
-  })
-  test('shows spinner while loading session', async ({ page }) => {
-    await page.route('**/api/auth/session', async (route) => {
-      await new Promise((resolve) => setTimeout(resolve, 500))
-      await route.fulfill({
-        status: 200,
-        body: JSON.stringify({}),
-      })
-    })
-
-    await page.goto('/login')
-
-    await expect(page.getByText(/checking session/i)).toBeVisible()
+    await expect(page.getByText(/authentication is disabled/i)).toBeVisible()
   })
 })
diff --git a/frontend/__tests__/unit/pages/Login.test.tsx b/frontend/__tests__/unit/pages/Login.test.tsx
index 476cad20c8..3d4da907a9 100644
--- a/frontend/__tests__/unit/pages/Login.test.tsx
+++ b/frontend/__tests__/unit/pages/Login.test.tsx
@@ -4,6 +4,7 @@ import { useRouter } from 'next/navigation'
 import { useSession, signIn } from 'next-auth/react'
 import { render } from 'wrappers/testUtil'
 import LoginPage from 'app/login/page'
+import { isAuthEnable } from 'utils/constants'
 
 jest.mock('next-auth/react', () => ({
   useSession: jest.fn(),
@@ -18,22 +19,44 @@ jest.mock('@heroui/toast', () => ({
   addToast: jest.fn(),
 }))
 
+jest.mock('utils/constants', () => ({
+  isAuthEnable: jest.fn(),
+  userAuthStatus: {
+    LOADING: 'loading',
+    AUTHENTICATED: 'authenticated',
+    UNAUTHENTICATED: 'unauthenticated',
+  },
+}))
+
 describe('LoginPage', () => {
   const pushMock = jest.fn()
+  const mockIsAuthEnable = isAuthEnable as jest.Mock
 
   beforeEach(() => {
     jest.clearAllMocks()
     ;(useRouter as jest.Mock).mockReturnValue({ push: pushMock })
   })
 
-  it('renders loading state', () => {
+  it('shows "Authentication is disabled" if auth is turned off', () => {
+    mockIsAuthEnable.mockReturnValue(false)
+    ;(useSession as jest.Mock).mockReturnValue({ status: 'unauthenticated' })
+
+    render(<LoginPage />)
+
+    expect(screen.getByText(/Authentication is disabled/i)).toBeInTheDocument()
+  })
+
+  it('renders loading spinner when session is loading', () => {
+    mockIsAuthEnable.mockReturnValue(true)
     ;(useSession as jest.Mock).mockReturnValue({ status: 'loading' })
 
     render(<LoginPage />)
+
     expect(screen.getByText(/Checking session/i)).toBeInTheDocument()
   })
 
-  it('shows redirect spinner if authenticated and calls router.push and addToast', () => {
+  it('renders redirect spinner and calls router + toast when authenticated', () => {
+    mockIsAuthEnable.mockReturnValue(true)
     ;(useSession as jest.Mock).mockReturnValue({ status: 'authenticated' })
 
     render(<LoginPage />)
@@ -48,7 +71,8 @@ describe('LoginPage', () => {
     expect(pushMock).toHaveBeenCalledWith('/')
   })
 
-  it('shows login button if unauthenticated', () => {
+  it('shows login button when unauthenticated and auth enabled', () => {
+    mockIsAuthEnable.mockReturnValue(true)
     ;(useSession as jest.Mock).mockReturnValue({ status: 'unauthenticated' })
 
     render(<LoginPage />)
@@ -56,12 +80,13 @@ describe('LoginPage', () => {
     expect(screen.getByText(/Sign in with GitHub/i)).toBeInTheDocument()
   })
 
-  it('calls signIn on GitHub login button click', () => {
+  it('triggers signIn when login button clicked', () => {
+    mockIsAuthEnable.mockReturnValue(true)
     ;(useSession as jest.Mock).mockReturnValue({ status: 'unauthenticated' })
 
     render(<LoginPage />)
-
     fireEvent.click(screen.getByText(/Sign in with GitHub/i))
+
     expect(signIn).toHaveBeenCalledWith('github', { callbackUrl: '/' })
   })
 })
diff --git a/frontend/src/app/api/auth/[...nextauth]/route.ts b/frontend/src/app/api/auth/[...nextauth]/route.ts
index 32f338077c..583426ce60 100644
--- a/frontend/src/app/api/auth/[...nextauth]/route.ts
+++ b/frontend/src/app/api/auth/[...nextauth]/route.ts
@@ -12,7 +12,7 @@ import {
 
 const providers = []
 
-if (isAuthEnable) {
+if (isAuthEnable()) {
   providers.push(
     GitHubProvider({
       clientId: GITHUB_CLIENT_ID,
@@ -28,7 +28,7 @@ const authOptions = {
   },
   callbacks: {
     async signIn({ account }) {
-      if (!isAuthEnable && account?.provider === 'github') {
+      if (!isAuthEnable() && account?.provider === 'github') {
         return false
       }
 
diff --git a/frontend/src/app/login/page.tsx b/frontend/src/app/login/page.tsx
index 58c93e8906..a9b26b4503 100644
--- a/frontend/src/app/login/page.tsx
+++ b/frontend/src/app/login/page.tsx
@@ -27,7 +27,7 @@ export default function LoginPage() {
     }
   }, [status, router])
 
-  if (!isAuthEnable) {
+  if (!isAuthEnable()) {
     return (
       <div className="flex min-h-[80vh] items-center justify-center">
         <FontAwesomeIcon icon={faSpinner} height={16} width={16} />
diff --git a/frontend/src/components/UserMenu.tsx b/frontend/src/components/UserMenu.tsx
index 7222419db7..f498fed6a2 100644
--- a/frontend/src/components/UserMenu.tsx
+++ b/frontend/src/components/UserMenu.tsx
@@ -16,11 +16,11 @@ export default function UserMenu() {
     )
   }
 
-  if (!session || !isAuthEnable) {
+  if (!session || !isAuthEnable()) {
     return (
       <button
-        onClick={() => isAuthEnable && signIn('github', { callbackUrl: '/', prompt: 'login' })}
-        disabled={!isAuthEnable}
+        onClick={() => isAuthEnable() && signIn('github', { callbackUrl: '/', prompt: 'login' })}
+        disabled={!isAuthEnable()}
         className="group relative flex h-10 w-full cursor-pointer items-center justify-center gap-2 overflow-hidden whitespace-pre rounded-md bg-[#87a1bc] px-4 py-2 text-sm font-medium text-black hover:ring-1 hover:ring-[#b0c7de] hover:ring-offset-0 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 dark:bg-slate-900 dark:text-white dark:hover:bg-slate-900/90 dark:hover:ring-[#46576b] md:flex"
       >
         Sign in
diff --git a/frontend/src/utils/constants.ts b/frontend/src/utils/constants.ts
index ac37b53f3c..f548b82bf8 100644
--- a/frontend/src/utils/constants.ts
+++ b/frontend/src/utils/constants.ts
@@ -125,4 +125,6 @@ export const userAuthStatus = {
   UNAUTHENTICATED: 'unauthenticated',
 }
 
-export const isAuthEnable = Boolean(GITHUB_CLIENT_ID)
+export const isAuthEnable = () => {
+  return Boolean(GITHUB_CLIENT_ID)
+}
diff --git a/frontend/src/utils/credentials.ts b/frontend/src/utils/credentials.ts
index db31f36c08..6ace8e0ff4 100644
--- a/frontend/src/utils/credentials.ts
+++ b/frontend/src/utils/credentials.ts
@@ -8,5 +8,5 @@ export const GTM_ID = process.env.NEXT_PUBLIC_GTM_ID
 export const IDX_URL = process.env.NEXT_PUBLIC_IDX_URL
 export const RELEASE_VERSION = process.env.NEXT_PUBLIC_RELEASE_VERSION
 export const SENTRY_DSN = process.env.NEXT_PUBLIC_SENTRY_DSN
-export const NEXTAUTH_SECRET = process.env.NEXT_SERVER_NEXTAUTH_SECRET
+export const NEXTAUTH_SECRET = process.env.NEXTAUTH_SECRET
 export const NEXTAUTH_URL = process.env.NEXT_SERVER_NEXTAUTH_URL

From 13a7ffc0de603088c5cd8199617660df663b5dc6 Mon Sep 17 00:00:00 2001
From: Rajgupta36 <raj.gupta369@outlook.com>
Date: Sun, 8 Jun 2025 22:07:41 +0530
Subject: [PATCH 3/7] upgrade code

---
 frontend/src/app/login/page.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/frontend/src/app/login/page.tsx b/frontend/src/app/login/page.tsx
index a9b26b4503..ef37a9b59d 100644
--- a/frontend/src/app/login/page.tsx
+++ b/frontend/src/app/login/page.tsx
@@ -30,7 +30,6 @@ export default function LoginPage() {
   if (!isAuthEnable()) {
     return (
       <div className="flex min-h-[80vh] items-center justify-center">
-        <FontAwesomeIcon icon={faSpinner} height={16} width={16} />
         <span className="text-lg text-gray-500">Authentication is disabled</span>
       </div>
     )

From 1032c60dbcf9d019626f3597cb74248a786625e6 Mon Sep 17 00:00:00 2001
From: Rajgupta36 <raj.gupta369@outlook.com>
Date: Thu, 12 Jun 2025 00:38:50 +0530
Subject: [PATCH 4/7] update code

---
 .github/workflows/run-ci-cd.yaml                 | 10 +++++-----
 frontend/.env.example                            |  4 ++--
 frontend/src/app/api/auth/[...nextauth]/route.ts | 13 +++++--------
 frontend/src/app/login/page.tsx                  | 10 +---------
 frontend/src/components/UserMenu.tsx             |  7 +++----
 frontend/src/middleware.ts                       |  2 +-
 frontend/src/utils/constants.ts                  |  5 -----
 frontend/src/utils/credentials.ts                |  4 ++--
 8 files changed, 19 insertions(+), 36 deletions(-)

diff --git a/.github/workflows/run-ci-cd.yaml b/.github/workflows/run-ci-cd.yaml
index a526856506..c3313f08db 100644
--- a/.github/workflows/run-ci-cd.yaml
+++ b/.github/workflows/run-ci-cd.yaml
@@ -295,8 +295,6 @@ jobs:
       - name: Prepare frontend environment
         run: |
           touch frontend/.env
-          echo "GITHUB_CLIENT_ID=${{ secrets.GITHUB_CLIENT_ID }}" >> frontend/.env
-          echo "GITHUB_CLIENT_SECRET=${{ secrets.GITHUB_CLIENT_SECRET }}" >> frontend/.env
           echo "NEXTAUTH_SECRET=${{ secrets.NEXTAUTH_SECRET }}" >> frontend/.env
           echo "NEXTAUTH_URL=${{ secrets.VITE_API_URL }}" >> frontend/.env
           echo "NEXT_PUBLIC_API_URL=${{ secrets.VITE_API_URL }}" >> frontend/.env
@@ -309,6 +307,8 @@ jobs:
           echo "NEXT_PUBLIC_SENTRY_DSN=${{ secrets.VITE_SENTRY_DSN }}" >> frontend/.env
           echo "NEXT_SERVER_CSRF_URL=${{ secrets.NEXT_SERVER_CSRF_URL }}" >> frontend/.env
           echo "NEXT_SERVER_GRAPHQL_URL=${{ secrets.NEXT_SERVER_GRAPHQL_URL }}" >> frontend/.env
+          echo "NEXT_SERVER_GITHUB_CLIENT_ID=${{ secrets.GITHUB_CLIENT_ID }}" >> frontend/.env
+          echo "NEXT_SERVER_GITHUB_CLIENT_SECRET=${{ secrets.GITHUB_CLIENT_SECRET }}" >> frontend/.env
 
       - name: Build frontend image
         uses: docker/build-push-action@263435318d21b8e681c14492fe198d362a7d2c83
@@ -490,8 +490,6 @@ jobs:
       - name: Prepare frontend environment
         run: |
           touch frontend/.env
-          echo "GITHUB_CLIENT_ID=${{ secrets.GITHUB_CLIENT_ID }}" >> frontend/.env
-          echo "GITHUB_CLIENT_SECRET=${{ secrets.GITHUB_CLIENT_SECRET }}" >> frontend/.env
           echo "NEXTAUTH_SECRET=${{ secrets.NEXTAUTH_SECRET }}" >> frontend/.env
           echo "NEXTAUTH_URL=${{ secrets.VITE_API_URL }}" >> frontend/.env
           echo "NEXT_PUBLIC_API_URL=${{ secrets.VITE_API_URL }}" >> frontend/.env
@@ -504,8 +502,10 @@ jobs:
           echo "NEXT_PUBLIC_SENTRY_DSN=${{ secrets.VITE_SENTRY_DSN }}" >> frontend/.env
           echo "NEXT_SERVER_CSRF_URL=${{ secrets.NEXT_SERVER_CSRF_URL }}" >> frontend/.env
           echo "NEXT_SERVER_GRAPHQL_URL=${{ secrets.NEXT_SERVER_GRAPHQL_URL }}" >> frontend/.env
+          echo "NEXT_SERVER_GITHUB_CLIENT_ID=${{ secrets.GITHUB_CLIENT_ID }}" >> frontend/.env
+          echo "NEXT_SERVER_GITHUB_CLIENT_SECRET=${{ secrets.GITHUB_CLIENT_SECRET }}" >> frontend/.env
 
-      - name: Build frontend image
+          - name: Build frontend image
         uses: docker/build-push-action@263435318d21b8e681c14492fe198d362a7d2c83
         with:
           cache-from: |
diff --git a/frontend/.env.example b/frontend/.env.example
index eb3184eaf6..9167fde4b5 100644
--- a/frontend/.env.example
+++ b/frontend/.env.example
@@ -1,3 +1,4 @@
+NEXTAUTH_SECRET=
 NEXTAUTH_URL=http://localhost:3000
 NEXT_PUBLIC_API_URL=http://localhost:8000/api/v1/
 NEXT_PUBLIC_CSRF_URL=http://localhost:8000/csrf/
@@ -10,6 +11,5 @@ NEXT_PUBLIC_SENTRY_DSN=
 NEXT_SERVER_CSRF_URL=http://backend:8000/csrf/
 NEXT_SERVER_DISABLE_SSR=false
 NEXT_SERVER_GRAPHQL_URL=http://backend:8000/graphql/
-NEXT_PUBLIC_GITHUB_CLIENT_ID=
+NEXT_SERVER_GITHUB_CLIENT_ID=
 NEXT_SERVER_GITHUB_CLIENT_SECRET=
-NEXTAUTH_SECRET=
diff --git a/frontend/src/app/api/auth/[...nextauth]/route.ts b/frontend/src/app/api/auth/[...nextauth]/route.ts
index 583426ce60..2fe03d69c6 100644
--- a/frontend/src/app/api/auth/[...nextauth]/route.ts
+++ b/frontend/src/app/api/auth/[...nextauth]/route.ts
@@ -2,7 +2,6 @@ import { gql } from '@apollo/client'
 import NextAuth from 'next-auth'
 import GitHubProvider from 'next-auth/providers/github'
 import { apolloClient } from 'server/apolloClient'
-import { isAuthEnable } from 'utils/constants'
 import {
   GITHUB_CLIENT_ID,
   GITHUB_CLIENT_SECRET,
@@ -12,7 +11,7 @@ import {
 
 const providers = []
 
-if (isAuthEnable()) {
+if (GITHUB_CLIENT_ID && GITHUB_CLIENT_SECRET) {
   providers.push(
     GitHubProvider({
       clientId: GITHUB_CLIENT_ID,
@@ -28,10 +27,6 @@ const authOptions = {
   },
   callbacks: {
     async signIn({ account }) {
-      if (!isAuthEnable() && account?.provider === 'github') {
-        return false
-      }
-
       if (account?.provider === 'github' && account.access_token) {
         try {
           const { data } = await apolloClient.mutate({
@@ -59,14 +54,16 @@ const authOptions = {
     },
 
     async jwt({ token, account }) {
-      if (account) {
+      if (account?.access_token) {
         token.accessToken = account.access_token
       }
       return token
     },
 
     async session({ session, token }) {
-      session.accessToken = token.accessToken
+      if (token?.accessToken) {
+        session.accessToken = token.accessToken
+      }
       return session
     },
   },
diff --git a/frontend/src/app/login/page.tsx b/frontend/src/app/login/page.tsx
index ef37a9b59d..9083e9bdce 100644
--- a/frontend/src/app/login/page.tsx
+++ b/frontend/src/app/login/page.tsx
@@ -7,7 +7,7 @@ import { addToast } from '@heroui/toast'
 import { useRouter } from 'next/navigation'
 import { useSession, signIn } from 'next-auth/react'
 import { useEffect } from 'react'
-import { isAuthEnable, userAuthStatus } from 'utils/constants'
+import { userAuthStatus } from 'utils/constants'
 
 export default function LoginPage() {
   const { status } = useSession()
@@ -27,14 +27,6 @@ export default function LoginPage() {
     }
   }, [status, router])
 
-  if (!isAuthEnable()) {
-    return (
-      <div className="flex min-h-[80vh] items-center justify-center">
-        <span className="text-lg text-gray-500">Authentication is disabled</span>
-      </div>
-    )
-  }
-
   if (status === userAuthStatus.LOADING) {
     return (
       <div className="flex min-h-[80vh] items-center justify-center">
diff --git a/frontend/src/components/UserMenu.tsx b/frontend/src/components/UserMenu.tsx
index f498fed6a2..085c5ae70e 100644
--- a/frontend/src/components/UserMenu.tsx
+++ b/frontend/src/components/UserMenu.tsx
@@ -3,7 +3,7 @@
 import { Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, Skeleton } from '@heroui/react'
 import Image from 'next/image'
 import { useSession, signIn, signOut } from 'next-auth/react'
-import { isAuthEnable, userAuthStatus } from 'utils/constants'
+import { userAuthStatus } from 'utils/constants'
 
 export default function UserMenu() {
   const { data: session, status } = useSession()
@@ -16,11 +16,10 @@ export default function UserMenu() {
     )
   }
 
-  if (!session || !isAuthEnable()) {
+  if (!session) {
     return (
       <button
-        onClick={() => isAuthEnable() && signIn('github', { callbackUrl: '/', prompt: 'login' })}
-        disabled={!isAuthEnable()}
+        onClick={() => signIn('github', { callbackUrl: '/', prompt: 'login' })}
         className="group relative flex h-10 w-full cursor-pointer items-center justify-center gap-2 overflow-hidden whitespace-pre rounded-md bg-[#87a1bc] px-4 py-2 text-sm font-medium text-black hover:ring-1 hover:ring-[#b0c7de] hover:ring-offset-0 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 dark:bg-slate-900 dark:text-white dark:hover:bg-slate-900/90 dark:hover:ring-[#46576b] md:flex"
       >
         Sign in
diff --git a/frontend/src/middleware.ts b/frontend/src/middleware.ts
index 20775888b7..28e4bfcd35 100644
--- a/frontend/src/middleware.ts
+++ b/frontend/src/middleware.ts
@@ -13,5 +13,5 @@ export async function middleware(request: NextRequest) {
 
 export const config = {
   // required authentication for all defined routes under matcher
-  matcher: [],
+  matcher: ['/projects'],
 }
diff --git a/frontend/src/utils/constants.ts b/frontend/src/utils/constants.ts
index f548b82bf8..51a33be1db 100644
--- a/frontend/src/utils/constants.ts
+++ b/frontend/src/utils/constants.ts
@@ -1,7 +1,6 @@
 import { faGithub, faSlack, faBluesky, faLinkedin } from '@fortawesome/free-brands-svg-icons'
 import { Link } from 'types/link'
 import { Section } from 'types/section'
-import { GITHUB_CLIENT_ID } from 'utils/credentials'
 
 export const headerLinks: Link[] = [
   {
@@ -124,7 +123,3 @@ export const userAuthStatus = {
   LOADING: 'loading',
   UNAUTHENTICATED: 'unauthenticated',
 }
-
-export const isAuthEnable = () => {
-  return Boolean(GITHUB_CLIENT_ID)
-}
diff --git a/frontend/src/utils/credentials.ts b/frontend/src/utils/credentials.ts
index 6ace8e0ff4..4f8e7f019a 100644
--- a/frontend/src/utils/credentials.ts
+++ b/frontend/src/utils/credentials.ts
@@ -2,11 +2,11 @@ export const API_URL = process.env.NEXT_PUBLIC_API_URL
 export const CSRF_URL = process.env.NEXT_PUBLIC_CSRF_URL
 export const ENVIRONMENT = process.env.NEXT_PUBLIC_ENVIRONMENT
 export const GRAPHQL_URL = process.env.NEXT_PUBLIC_GRAPHQL_URL
-export const GITHUB_CLIENT_ID = process.env.NEXT_PUBLIC_GITHUB_CLIENT_ID
+export const GITHUB_CLIENT_ID = process.env.NEXT_SERVER_GITHUB_CLIENT_ID
 export const GITHUB_CLIENT_SECRET = process.env.NEXT_SERVER_GITHUB_CLIENT_SECRET
 export const GTM_ID = process.env.NEXT_PUBLIC_GTM_ID
 export const IDX_URL = process.env.NEXT_PUBLIC_IDX_URL
 export const RELEASE_VERSION = process.env.NEXT_PUBLIC_RELEASE_VERSION
 export const SENTRY_DSN = process.env.NEXT_PUBLIC_SENTRY_DSN
 export const NEXTAUTH_SECRET = process.env.NEXTAUTH_SECRET
-export const NEXTAUTH_URL = process.env.NEXT_SERVER_NEXTAUTH_URL
+export const NEXTAUTH_URL = process.env.NEXTAUTH_URL

From 63d13a0d88fda4c63abc7385ecbe9562ebc65ba6 Mon Sep 17 00:00:00 2001
From: Rajgupta36 <raj.gupta369@outlook.com>
Date: Thu, 12 Jun 2025 00:41:40 +0530
Subject: [PATCH 5/7] remove check route

---
 frontend/src/middleware.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/middleware.ts b/frontend/src/middleware.ts
index 28e4bfcd35..20775888b7 100644
--- a/frontend/src/middleware.ts
+++ b/frontend/src/middleware.ts
@@ -13,5 +13,5 @@ export async function middleware(request: NextRequest) {
 
 export const config = {
   // required authentication for all defined routes under matcher
-  matcher: ['/projects'],
+  matcher: [],
 }

From 0f617014e8e154de9824726beb2b9159635ba534 Mon Sep 17 00:00:00 2001
From: Rajgupta36 <raj.gupta369@outlook.com>
Date: Thu, 12 Jun 2025 00:53:20 +0530
Subject: [PATCH 6/7] fix test case

---
 frontend/__tests__/e2e/pages/Login.spec.ts   | 23 +++++++++---
 frontend/__tests__/unit/pages/Login.test.tsx | 38 +++-----------------
 2 files changed, 24 insertions(+), 37 deletions(-)

diff --git a/frontend/__tests__/e2e/pages/Login.spec.ts b/frontend/__tests__/e2e/pages/Login.spec.ts
index 7588a0f9dd..91cd9d4fda 100644
--- a/frontend/__tests__/e2e/pages/Login.spec.ts
+++ b/frontend/__tests__/e2e/pages/Login.spec.ts
@@ -1,7 +1,7 @@
 import { mockHomeData } from '@e2e/data/mockHomeData'
 import { test, expect } from '@playwright/test'
 
-test.describe('LoginPage - Auth Disabled State', () => {
+test.describe('Login Page', () => {
   test.beforeEach(async ({ page }) => {
     await page.route('**/graphql/', async (route) => {
       await route.fulfill({
@@ -9,7 +9,6 @@ test.describe('LoginPage - Auth Disabled State', () => {
         body: JSON.stringify(mockHomeData),
       })
     })
-
     await page.context().addCookies([
       {
         name: 'csrftoken',
@@ -23,8 +22,24 @@ test.describe('LoginPage - Auth Disabled State', () => {
     ])
   })
 
-  test('should display auth disabled message if env vars are missing', async ({ page }) => {
+  test('displays GitHub login button when unauthenticated', async ({ page }) => {
     await page.goto('/login')
-    await expect(page.getByText(/authentication is disabled/i)).toBeVisible()
+
+    const button = page.getByRole('button', { name: /sign in with github/i })
+    await expect(button).toBeVisible()
+  })
+
+  test('shows spinner while loading session', async ({ page }) => {
+    await page.route('**/api/auth/session', async (route) => {
+      await new Promise((resolve) => setTimeout(resolve, 500))
+      await route.fulfill({
+        status: 200,
+        body: JSON.stringify({}),
+      })
+    })
+
+    await page.goto('/login')
+
+    await expect(page.getByText(/checking session/i)).toBeVisible()
   })
 })
diff --git a/frontend/__tests__/unit/pages/Login.test.tsx b/frontend/__tests__/unit/pages/Login.test.tsx
index 3d4da907a9..9025ae425b 100644
--- a/frontend/__tests__/unit/pages/Login.test.tsx
+++ b/frontend/__tests__/unit/pages/Login.test.tsx
@@ -4,63 +4,37 @@ import { useRouter } from 'next/navigation'
 import { useSession, signIn } from 'next-auth/react'
 import { render } from 'wrappers/testUtil'
 import LoginPage from 'app/login/page'
-import { isAuthEnable } from 'utils/constants'
 
 jest.mock('next-auth/react', () => ({
   useSession: jest.fn(),
   signIn: jest.fn(),
 }))
-
 jest.mock('next/navigation', () => ({
   useRouter: jest.fn(),
 }))
-
 jest.mock('@heroui/toast', () => ({
   addToast: jest.fn(),
 }))
 
-jest.mock('utils/constants', () => ({
-  isAuthEnable: jest.fn(),
-  userAuthStatus: {
-    LOADING: 'loading',
-    AUTHENTICATED: 'authenticated',
-    UNAUTHENTICATED: 'unauthenticated',
-  },
-}))
-
 describe('LoginPage', () => {
   const pushMock = jest.fn()
-  const mockIsAuthEnable = isAuthEnable as jest.Mock
 
   beforeEach(() => {
     jest.clearAllMocks()
     ;(useRouter as jest.Mock).mockReturnValue({ push: pushMock })
   })
 
-  it('shows "Authentication is disabled" if auth is turned off', () => {
-    mockIsAuthEnable.mockReturnValue(false)
-    ;(useSession as jest.Mock).mockReturnValue({ status: 'unauthenticated' })
-
-    render(<LoginPage />)
-
-    expect(screen.getByText(/Authentication is disabled/i)).toBeInTheDocument()
-  })
-
-  it('renders loading spinner when session is loading', () => {
-    mockIsAuthEnable.mockReturnValue(true)
+  it('renders loading state', () => {
     ;(useSession as jest.Mock).mockReturnValue({ status: 'loading' })
 
     render(<LoginPage />)
-
     expect(screen.getByText(/Checking session/i)).toBeInTheDocument()
   })
 
-  it('renders redirect spinner and calls router + toast when authenticated', () => {
-    mockIsAuthEnable.mockReturnValue(true)
+  it('shows redirect spinner if authenticated and calls router.push and addToast', () => {
     ;(useSession as jest.Mock).mockReturnValue({ status: 'authenticated' })
 
     render(<LoginPage />)
-
     expect(screen.getByText(/Redirecting/i)).toBeInTheDocument()
     expect(addToast).toHaveBeenCalledWith(
       expect.objectContaining({
@@ -71,8 +45,7 @@ describe('LoginPage', () => {
     expect(pushMock).toHaveBeenCalledWith('/')
   })
 
-  it('shows login button when unauthenticated and auth enabled', () => {
-    mockIsAuthEnable.mockReturnValue(true)
+  it('shows login button if unauthenticated', () => {
     ;(useSession as jest.Mock).mockReturnValue({ status: 'unauthenticated' })
 
     render(<LoginPage />)
@@ -80,13 +53,12 @@ describe('LoginPage', () => {
     expect(screen.getByText(/Sign in with GitHub/i)).toBeInTheDocument()
   })
 
-  it('triggers signIn when login button clicked', () => {
-    mockIsAuthEnable.mockReturnValue(true)
+  it('calls signIn on GitHub login button click', () => {
     ;(useSession as jest.Mock).mockReturnValue({ status: 'unauthenticated' })
 
     render(<LoginPage />)
-    fireEvent.click(screen.getByText(/Sign in with GitHub/i))
 
+    fireEvent.click(screen.getByText(/Sign in with GitHub/i))
     expect(signIn).toHaveBeenCalledWith('github', { callbackUrl: '/' })
   })
 })

From 86921492c7d0123001ef33f143374ef21b306ff6 Mon Sep 17 00:00:00 2001
From: Rajgupta36 <raj.gupta369@outlook.com>
Date: Thu, 12 Jun 2025 03:33:42 +0530
Subject: [PATCH 7/7] fixes and update usermenu

---
 .github/workflows/run-ci-cd.yaml     |  2 +-
 frontend/src/components/UserMenu.tsx | 74 +++++++++++++++++++---------
 2 files changed, 52 insertions(+), 24 deletions(-)

diff --git a/.github/workflows/run-ci-cd.yaml b/.github/workflows/run-ci-cd.yaml
index c3313f08db..c78fb7ca4f 100644
--- a/.github/workflows/run-ci-cd.yaml
+++ b/.github/workflows/run-ci-cd.yaml
@@ -505,7 +505,7 @@ jobs:
           echo "NEXT_SERVER_GITHUB_CLIENT_ID=${{ secrets.GITHUB_CLIENT_ID }}" >> frontend/.env
           echo "NEXT_SERVER_GITHUB_CLIENT_SECRET=${{ secrets.GITHUB_CLIENT_SECRET }}" >> frontend/.env
 
-          - name: Build frontend image
+      - name: Build frontend image
         uses: docker/build-push-action@263435318d21b8e681c14492fe198d362a7d2c83
         with:
           cache-from: |
diff --git a/frontend/src/components/UserMenu.tsx b/frontend/src/components/UserMenu.tsx
index 085c5ae70e..6c8697d7c6 100644
--- a/frontend/src/components/UserMenu.tsx
+++ b/frontend/src/components/UserMenu.tsx
@@ -1,17 +1,31 @@
 'use client'
 
-import { Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, Skeleton } from '@heroui/react'
 import Image from 'next/image'
 import { useSession, signIn, signOut } from 'next-auth/react'
+import { useEffect, useId, useRef, useState } from 'react'
 import { userAuthStatus } from 'utils/constants'
 
 export default function UserMenu() {
   const { data: session, status } = useSession()
+  const [isOpen, setIsOpen] = useState(false)
+  const dropdownRef = useRef<HTMLDivElement>(null)
+  const dropdownId = useId()
+
+  // Close on outside click
+  useEffect(() => {
+    const handleClickOutside = (event: MouseEvent) => {
+      if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node)) {
+        setIsOpen(false)
+      }
+    }
+    document.addEventListener('mousedown', handleClickOutside)
+    return () => document.removeEventListener('mousedown', handleClickOutside)
+  }, [])
 
   if (status === userAuthStatus.LOADING) {
     return (
       <div className="flex h-10 w-10 items-center justify-center">
-        <Skeleton className="h-10 w-10 rounded-full" />
+        <div className="animate-pulse h-10 w-10 rounded-full bg-gray-300 dark:bg-slate-700" />
       </div>
     )
   }
@@ -20,7 +34,7 @@ export default function UserMenu() {
     return (
       <button
         onClick={() => signIn('github', { callbackUrl: '/', prompt: 'login' })}
-        className="group relative flex h-10 w-full cursor-pointer items-center justify-center gap-2 overflow-hidden whitespace-pre rounded-md bg-[#87a1bc] px-4 py-2 text-sm font-medium text-black hover:ring-1 hover:ring-[#b0c7de] hover:ring-offset-0 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 dark:bg-slate-900 dark:text-white dark:hover:bg-slate-900/90 dark:hover:ring-[#46576b] md:flex"
+        className="group relative flex h-10 w-full cursor-pointer items-center justify-center gap-2 overflow-hidden whitespace-pre rounded-md bg-[#87a1bc] px-4 py-2 text-sm font-medium text-black hover:ring-1 hover:ring-[#b0c7de] hover:ring-offset-0 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 dark:bg-slate-900 dark:text-white dark:hover:bg-slate-900/90 dark:hover:ring-[#46576b]"
       >
         Sign in
       </button>
@@ -28,27 +42,41 @@ export default function UserMenu() {
   }
 
   return (
-    <Dropdown className="bg-owasp-blue dark:bg-slate-800">
-      <DropdownTrigger>
-        <Image
-          src={session.user?.image || '/default-avatar.png'}
-          height={40}
-          width={40}
-          alt="User avatar"
-          className="h-10 w-10 cursor-pointer rounded-full object-cover"
-        />
-      </DropdownTrigger>
+    <div ref={dropdownRef} className="relative flex items-center justify-center">
+      <button
+        onClick={() => setIsOpen((prev) => !prev)}
+        aria-expanded={isOpen}
+        aria-haspopup="true"
+        aria-controls={dropdownId}
+        className="w-auto focus:outline-none"
+      >
+        <div className="h-10 w-10 overflow-hidden rounded-full">
+          <Image
+            src={session.user?.image || '/default-avatar.png'}
+            height={40}
+            width={40}
+            alt="User avatar"
+            className="h-full w-full object-cover"
+          />
+        </div>
+      </button>
 
-      <DropdownMenu className="w-48" variant="bordered">
-        <DropdownItem
-          key={'sign-out'}
-          disableAnimation
-          onClick={() => signOut({ callbackUrl: '/' })}
-          className="relative flex h-10 w-full cursor-pointer items-center justify-center gap-2 whitespace-pre rounded-md bg-[#87a1bc] px-4 py-2 text-sm font-medium text-black focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 dark:bg-slate-900 dark:text-white"
+      {isOpen && (
+        <div
+          id={dropdownId}
+          className="absolute right-0 top-full z-20 mt-2 w-48 overflow-hidden rounded-md bg-white shadow-lg dark:bg-slate-800"
         >
-          Sign out
-        </DropdownItem>
-      </DropdownMenu>
-    </Dropdown>
+          <button
+            onClick={() => {
+              signOut({ callbackUrl: '/' })
+              setIsOpen(false)
+            }}
+            className="block w-full px-4 py-2 text-left text-sm font-medium text-slate-600 hover:bg-slate-100 hover:text-slate-900 dark:text-slate-400 dark:hover:bg-slate-700 dark:hover:text-white"
+          >
+            Sign out
+          </button>
+        </div>
+      )}
+    </div>
   )
 }