Skip to content

fix : navbar-redirect #446

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
greedy-wudpeckr wants to merge 5 commits into
base: main
Choose a base branch
from
Open

fix : navbar-redirect #446

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
15190c8
fix : navbar-redirect
greedy-wudpeckr Feb 3, 2026
de202cb
fix: footer-redirect
greedy-wudpeckr Feb 3, 2026
eee5bfe
added handleLogoClick in utils
greedy-wudpeckr Feb 4, 2026
f6e808e
added tests for handlelogoClick
greedy-wudpeckr Feb 4, 2026
99bc821
updated snapshots
greedy-wudpeckr Feb 4, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 5 additions & 2 deletions frontend/src/components/HomeComponents/Footer/Footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { HighlightLink } from '@/components/ui/link-highlight';
import logo from '../../../assets/logo.png';
import logoLight from '../../../assets/logo_light.png';
import { url } from '@/components/utils/URLs';
import { handleLogoClick } from '@/components/utils/utils';

export const Footer = () => {
return (
Expand All @@ -12,7 +13,8 @@ export const Footer = () => {
<div className="col-span-full xl:col-span-2">
<a
rel="noreferrer noopener"
href="/"
href="#"
onClick={handleLogoClick}
className="ml-2 font-bold text-xl flex items-center dark:hidden"
>
<img
Expand All @@ -23,7 +25,8 @@ export const Footer = () => {
</a>
<a
rel="noreferrer noopener"
href="/"
href="#"
onClick={handleLogoClick}
className="ml-2 font-bold text-xl hidden dark:flex items-center"
>
<img
Expand Down
21 changes: 20 additions & 1 deletion frontend/src/components/HomeComponents/Footer/__tests__/Footer.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { render, screen } from '@testing-library/react';
import { render, screen, fireEvent } from '@testing-library/react';
import '@testing-library/jest-dom';
import { Footer } from '../Footer';
import * as utils from '@/components/utils/utils';

jest.mock('../../../../assets/logo.png', () => 'logo-path');
jest.mock('../../../../assets/logo_light.png', () => 'logo-light-path');
Expand Down Expand Up @@ -29,3 +30,21 @@ describe('Footer component using Snapshot', () => {
expect(asFragment()).toMatchSnapshot();
});
});

describe('Footer logo click handler', () => {
test('should call handleLogoClick when logo link is clicked', () => {
const handleLogoClickSpy = jest.spyOn(utils, 'handleLogoClick');
render(<Footer />);

const logoLinks = screen.getAllByRole('link');
const logoLink = logoLinks.find(
(link) => link.getAttribute('href') === '#'
);

expect(logoLink).toBeDefined();
fireEvent.click(logoLink!);
expect(handleLogoClickSpy).toHaveBeenCalledTimes(1);

handleLogoClickSpy.mockRestore();
});
});
4 changes: 2 additions & 2 deletions frontend/src/components/HomeComponents/Footer/__tests__/__snapshots__/Footer.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ exports[`Footer component using Snapshot renders correctly 1`] = `
>
<a
class="ml-2 font-bold text-xl flex items-center dark:hidden"
href="/"
href="#"
rel="noreferrer noopener"
>
<img
Expand All @@ -27,7 +27,7 @@ exports[`Footer component using Snapshot renders correctly 1`] = `
</a>
<a
class="ml-2 font-bold text-xl hidden dark:flex items-center"
href="/"
href="#"
rel="noreferrer noopener"
>
<img
Expand Down
7 changes: 5 additions & 2 deletions frontend/src/components/HomeComponents/Navbar/Navbar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import logoLight from '../../../assets/logo_light.png';
import { NavbarMobile } from './NavbarMobile';
import { NavbarDesktop } from './NavbarDesktop';
import { Props } from './navbar-utils';
import { handleLogoClick } from '@/components/utils/utils';

export const Navbar = (
props: Props & {
Expand All @@ -25,7 +26,8 @@ export const Navbar = (
<NavigationMenuItem className="font-bold flex">
<a
rel="noreferrer noopener"
href="/"
href="#"
onClick={handleLogoClick}
className="ml-2 font-bold text-xl flex items-center dark:hidden"
>
<img
Expand All @@ -36,7 +38,8 @@ export const Navbar = (
</a>
<a
rel="noreferrer noopener"
href="/"
href="#"
onClick={handleLogoClick}
className="ml-2 font-bold text-xl hidden dark:flex items-center"
>
<img
Expand Down
21 changes: 20 additions & 1 deletion frontend/src/components/HomeComponents/Navbar/__tests__/Navbar.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { render, screen } from '@testing-library/react';
import { render, screen, fireEvent } from '@testing-library/react';
import { Navbar } from '../Navbar';
import { Props } from '../navbar-utils';
import * as utils from '@/components/utils/utils';

// Mocking the NavbarMobile and NavbarDesktop components
jest.mock('../NavbarMobile', () => ({
Expand Down Expand Up @@ -65,3 +66,21 @@ describe('Navbar component using snapshot', () => {
expect(asFragment()).toMatchSnapshot();
});
});

describe('Navbar logo click handler', () => {
test('should call handleLogoClick when logo link is clicked', () => {
const handleLogoClickSpy = jest.spyOn(utils, 'handleLogoClick');
render(<Navbar {...props} />);

const logoLinks = screen.getAllByRole('link');
const logoLink = logoLinks.find(
(link) => link.getAttribute('href') === '#'
);

expect(logoLink).toBeDefined();
fireEvent.click(logoLink!);
expect(handleLogoClickSpy).toHaveBeenCalledTimes(1);

handleLogoClickSpy.mockRestore();
});
});
4 changes: 2 additions & 2 deletions frontend/src/components/HomeComponents/Navbar/__tests__/__snapshots__/Navbar.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ exports[`Navbar component using snapshot renders correctly 1`] = `
>
<a
class="ml-2 font-bold text-xl flex items-center dark:hidden"
href="/"
href="#"
rel="noreferrer noopener"
>
<img
Expand All @@ -35,7 +35,7 @@ exports[`Navbar component using snapshot renders correctly 1`] = `
</a>
<a
class="ml-2 font-bold text-xl hidden dark:flex items-center"
href="/"
href="#"
rel="noreferrer noopener"
>
<img
Expand Down
48 changes: 48 additions & 0 deletions frontend/src/components/utils/__tests__/utils.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
import { MouseEvent } from 'react';
import { handleLogoClick } from '../utils';

describe('handleLogoClick', () => {
let mockEvent: Partial<MouseEvent<HTMLAnchorElement>>;
let reloadMock: jest.Mock;

beforeEach(() => {
mockEvent = {
preventDefault: jest.fn(),
};

// Mock reload using Object.defineProperty
reloadMock = jest.fn();
Object.defineProperty(window, 'location', {
value: { reload: reloadMock },
writable: true,
});
});

it('should call preventDefault on the event', () => {
handleLogoClick(mockEvent as MouseEvent<HTMLAnchorElement>);

expect(mockEvent.preventDefault).toHaveBeenCalledTimes(1);
});

it('should reload the page', () => {
handleLogoClick(mockEvent as MouseEvent<HTMLAnchorElement>);

expect(reloadMock).toHaveBeenCalledTimes(1);
});

it('should call preventDefault before reloading', () => {
const callOrder: string[] = [];

mockEvent.preventDefault = jest.fn(() => {
callOrder.push('preventDefault');
});

reloadMock.mockImplementation(() => {
callOrder.push('reload');
});

handleLogoClick(mockEvent as MouseEvent<HTMLAnchorElement>);

expect(callOrder).toEqual(['preventDefault', 'reload']);
});
});
6 changes: 6 additions & 0 deletions frontend/src/components/utils/utils.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { type ClassValue, clsx } from 'clsx';
import type { MouseEvent } from 'react';
import { twMerge } from 'tailwind-merge';

export function cn(...inputs: ClassValue[]) {
Expand All @@ -19,3 +20,8 @@ export function debounce<T extends (...args: any[]) => void>(
export const getStartOfDay = (date: Date) => {
return new Date(date.getFullYear(), date.getMonth(), date.getDate());
};

export const handleLogoClick = (e: MouseEvent<HTMLAnchorElement>) => {
e.preventDefault();
window.location.reload();
};