13 changed files with 271 additions and 170 deletions
-
2src/app/candidate-contact/candidate-contact-client.tsx
-
2src/app/finding-match/finding-match-client.tsx
-
122src/app/new-match/new-match-client.tsx
-
4src/app/new-match/profile/page.tsx
-
2src/app/request-accepted/request-accepted-client.tsx
-
2src/app/request-sent/request-sent-client.tsx
-
127src/components/Componentes/advisor-actions-card.test.tsx
-
34src/components/Componentes/advisor-actions-card.tsx
-
34src/components/Componentes/information-sheet.tsx
-
32src/components/Componentes/navigation-button.tsx
-
72src/components/Componentes/page-header.tsx
-
6src/components/Componentes/slider-page.tsx
-
2src/components/Componentes/ui-icon.tsx
@ -0,0 +1,127 @@ |
|||||
|
import { cleanup, render, screen } from "@testing-library/react"; |
||||
|
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest"; |
||||
|
import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; |
||||
|
import { I18nProvider } from "@/translations/provider"; |
||||
|
import { |
||||
|
AdvisorActionsCard, |
||||
|
type AdvisorAvatar, |
||||
|
} from "./advisor-actions-card"; |
||||
|
|
||||
|
let mockAdvisorsData: any = { results: [] }; |
||||
|
let mockIsLoading = false; |
||||
|
|
||||
|
vi.mock("@/hooks/marriage/use-marriage-advisors", () => ({ |
||||
|
useMarriageAdvisorsQuery: () => ({ |
||||
|
data: mockAdvisorsData, |
||||
|
isLoading: mockIsLoading, |
||||
|
}), |
||||
|
})); |
||||
|
|
||||
|
const fallbackAvatars: AdvisorAvatar[] = [ |
||||
|
{ id: "advisor-1", src: "/assets/images/Avatar Image.png" }, |
||||
|
{ id: "advisor-2", src: "/assets/images/Ellipse 370.png" }, |
||||
|
{ id: "advisor-3", src: "/assets/images/Avatar Image.png" }, |
||||
|
]; |
||||
|
|
||||
|
function createWrapper() { |
||||
|
const queryClient = new QueryClient({ |
||||
|
defaultOptions: { |
||||
|
queries: { retry: false }, |
||||
|
}, |
||||
|
}); |
||||
|
|
||||
|
return function Wrapper({ children }: { children: React.ReactNode }) { |
||||
|
return ( |
||||
|
<QueryClientProvider client={queryClient}> |
||||
|
<I18nProvider locale="fa">{children}</I18nProvider> |
||||
|
</QueryClientProvider> |
||||
|
); |
||||
|
}; |
||||
|
} |
||||
|
|
||||
|
describe("AdvisorActionsCard", () => { |
||||
|
beforeEach(() => { |
||||
|
mockAdvisorsData = { results: [] }; |
||||
|
mockIsLoading = false; |
||||
|
}); |
||||
|
|
||||
|
afterEach(() => { |
||||
|
cleanup(); |
||||
|
vi.restoreAllMocks(); |
||||
|
}); |
||||
|
|
||||
|
it("renders up to 3 fallback avatars and +N badge when API returns empty", () => { |
||||
|
const wrapper = createWrapper(); |
||||
|
const { container } = render( |
||||
|
<AdvisorActionsCard |
||||
|
title="دریافت مشاور" |
||||
|
description="توضیحات" |
||||
|
avatars={fallbackAvatars} |
||||
|
extraCount={7} |
||||
|
getAdvisorLabel="دریافت مشاور" |
||||
|
/>, |
||||
|
{ wrapper }, |
||||
|
); |
||||
|
|
||||
|
// 3 avatar images rendered
|
||||
|
const images = container.querySelectorAll("img"); |
||||
|
expect(images.length).toBe(3); |
||||
|
|
||||
|
// +7 badge rendered
|
||||
|
expect(screen.getByText("+7")).toBeDefined(); |
||||
|
}); |
||||
|
|
||||
|
it("renders up to 3 avatars and calculates +N badge when API returns 10 advisors", () => { |
||||
|
mockAdvisorsData = { |
||||
|
results: Array.from({ length: 10 }).map((_, i) => ({ |
||||
|
username: `consultant_${i}`, |
||||
|
fullname: `مشاور ${i}`, |
||||
|
avatar_url: i === 0 ? "https://example.com/avatar0.jpg" : null, |
||||
|
})), |
||||
|
}; |
||||
|
|
||||
|
const wrapper = createWrapper(); |
||||
|
const { container } = render( |
||||
|
<AdvisorActionsCard |
||||
|
title="دریافت مشاور" |
||||
|
description="توضیحات" |
||||
|
avatars={fallbackAvatars} |
||||
|
extraCount={7} |
||||
|
getAdvisorLabel="دریافت مشاور" |
||||
|
/>, |
||||
|
{ wrapper }, |
||||
|
); |
||||
|
|
||||
|
const images = container.querySelectorAll("img"); |
||||
|
expect(images.length).toBe(3); |
||||
|
|
||||
|
// 10 - 3 = 7
|
||||
|
expect(screen.getByText("+7")).toBeDefined(); |
||||
|
}); |
||||
|
|
||||
|
it("renders exact count and no +N badge when API returns 2 advisors", () => { |
||||
|
mockAdvisorsData = { |
||||
|
results: [ |
||||
|
{ username: "c1", fullname: "مشاور 1", avatar_url: "https://example.com/1.jpg" }, |
||||
|
{ username: "c2", fullname: "مشاور 2", avatar_url: "https://example.com/2.jpg" }, |
||||
|
], |
||||
|
}; |
||||
|
|
||||
|
const wrapper = createWrapper(); |
||||
|
const { container } = render( |
||||
|
<AdvisorActionsCard |
||||
|
title="دریافت مشاور" |
||||
|
description="توضیحات" |
||||
|
avatars={fallbackAvatars} |
||||
|
extraCount={7} |
||||
|
getAdvisorLabel="دریافت مشاور" |
||||
|
/>, |
||||
|
{ wrapper }, |
||||
|
); |
||||
|
|
||||
|
const images = container.querySelectorAll("img"); |
||||
|
expect(images.length).toBe(2); |
||||
|
|
||||
|
expect(screen.queryByText(/^\+/)).toBeNull(); |
||||
|
}); |
||||
|
}); |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue