From ef8a004c1ae95349ff150f558884f55dd76ab1ef Mon Sep 17 00:00:00 2001 From: Harsh Date: Tue, 27 Jan 2026 18:59:31 +0000 Subject: [PATCH 1/2] feat(about): combine separate GraphQL queries into single request --- frontend/__tests__/e2e/pages/About.spec.ts | 24 +- frontend/__tests__/unit/pages/About.test.tsx | 275 +++++------------- frontend/src/app/about/page.tsx | 93 ++---- frontend/src/server/queries/aboutQueries.ts | 84 ++++++ .../__generated__/aboutQueries.generated.ts | 18 ++ 5 files changed, 201 insertions(+), 293 deletions(-) create mode 100644 frontend/src/server/queries/aboutQueries.ts create mode 100644 frontend/src/types/__generated__/aboutQueries.generated.ts diff --git a/frontend/__tests__/e2e/pages/About.spec.ts b/frontend/__tests__/e2e/pages/About.spec.ts index 56dd64ddfc..9f1bc1cdea 100644 --- a/frontend/__tests__/e2e/pages/About.spec.ts +++ b/frontend/__tests__/e2e/pages/About.spec.ts @@ -8,17 +8,25 @@ test.describe('About Page', () => { const request = route.request() const postData = request.postDataJSON() - if (postData.query?.includes('user')) { - const username = postData.variables.key - const userData = mockAboutData.users[username] - await route.fulfill({ status: 200, json: { data: { user: userData } } }) - } else if (postData.query?.includes('topContributors')) { + if (postData.operationName === 'GetAboutPageData') { + const leaders = ['arkid15r', 'kasya', 'mamicidal'] + const leaderData = leaders.reduce( + (acc, leader, index) => ({ + ...acc, + [`leader${index + 1}`]: mockAboutData.users[leader], + }), + {} + ) await route.fulfill({ status: 200, - json: { data: { topContributors: mockAboutData.topContributors } }, + json: { + data: { + project: mockAboutData.project, + topContributors: mockAboutData.topContributors, + ...leaderData, + }, + }, }) - } else { - await route.fulfill({ status: 200, json: { data: { project: mockAboutData.project } } }) } }) diff --git a/frontend/__tests__/unit/pages/About.test.tsx b/frontend/__tests__/unit/pages/About.test.tsx index 9af466b734..7261c348b5 100644 --- a/frontend/__tests__/unit/pages/About.test.tsx +++ b/frontend/__tests__/unit/pages/About.test.tsx @@ -6,11 +6,7 @@ import { useRouter } from 'next/navigation' import React, { act } from 'react' import { render } from 'wrappers/testUtil' import About from 'app/about/page' -import { - GetProjectMetadataDocument, - GetTopContributorsDocument, -} from 'types/__generated__/projectQueries.generated' -import { GetLeaderDataDocument } from 'types/__generated__/userQueries.generated' +import { GetAboutPageDataDocument } from 'types/__generated__/aboutQueries.generated' jest.mock('@apollo/client/react', () => ({ ...jest.requireActual('@apollo/client/react'), @@ -201,42 +197,23 @@ jest.mock('components/ShowMoreButton', () => ({ }, })) -const mockUserData = (username) => ({ - data: { user: mockAboutData.users[username] }, - loading: false, - error: null, -}) - -const mockProjectData = { - data: { project: mockAboutData.project }, - loading: false, - error: null, -} - -const mockTopContributorsData = { - data: { topContributors: mockAboutData.topContributors }, - loading: false, - error: null, -} - describe('About Component', () => { let mockRouter: { push: jest.Mock } beforeEach(() => { - ;(useQuery as unknown as jest.Mock).mockImplementation((query, options) => { - const key = options?.variables?.key - - if (query === GetProjectMetadataDocument) { - if (key === 'nest') { - return mockProjectData + ;(useQuery as unknown as jest.Mock).mockImplementation((query) => { + if (query === GetAboutPageDataDocument) { + return { + data: { + project: mockAboutData.project, + topContributors: mockAboutData.topContributors, + leader1: mockAboutData.users['arkid15r'], + leader2: mockAboutData.users['kasya'], + leader3: mockAboutData.users['mamicidal'], + }, + loading: false, + error: null, } - } else if (query === GetTopContributorsDocument) { - if (key === 'nest') { - return mockTopContributorsData - } - } else if (query === GetLeaderDataDocument) { - return mockUserData(key) } - return { loading: true } }) mockRouter = { push: jest.fn() } @@ -451,11 +428,19 @@ describe('About Component', () => { }) test('handles null project in data response gracefully', async () => { - ;(useQuery as unknown as jest.Mock).mockImplementation((query, options) => { - if (options?.variables?.key === 'nest') { - return { data: { project: null }, loading: false, error: null } - } else if (['arkid15r', 'kasya', 'mamicidal'].includes(options?.variables?.key)) { - return mockUserData(options?.variables?.key) + ;(useQuery as unknown as jest.Mock).mockImplementation((query) => { + if (query === GetAboutPageDataDocument) { + return { + data: { + project: null, + topContributors: mockAboutData.topContributors, + leader1: mockAboutData.users['arkid15r'], + leader2: mockAboutData.users['kasya'], + leader3: mockAboutData.users['mamicidal'], + }, + loading: false, + error: null, + } } return { loading: true } }) @@ -487,29 +472,25 @@ describe('About Component', () => { }) test('handles partial user data in leader response', async () => { - const partialUserData = { - data: { - user: { - avatarUrl: 'https://avatars.githubusercontent.com/u/2201626?v=4', - company: 'OWASP', - // name is missing - login: 'arkid15r', - url: '/members/arkid15r', - }, - }, - loading: false, - error: null, - } - - ;(useQuery as unknown as jest.Mock).mockImplementation((query, options) => { - if (query === GetProjectMetadataDocument && options?.variables?.key === 'nest') { - return mockProjectData - } else if (query === GetTopContributorsDocument && options?.variables?.key === 'nest') { - return mockTopContributorsData - } else if (options?.variables?.key === 'arkid15r') { - return partialUserData - } else if (options?.variables?.key === 'kasya' || options?.variables?.key === 'mamicidal') { - return mockUserData(options?.variables?.key) + ;(useQuery as unknown as jest.Mock).mockImplementation((query) => { + if (query === GetAboutPageDataDocument) { + return { + data: { + project: mockAboutData.project, + topContributors: mockAboutData.topContributors, + leader1: { + avatarUrl: 'https://avatars.githubusercontent.com/u/2201626?v=4', + company: 'OWASP', + // name is missing + login: 'arkid15r', + url: '/members/arkid15r', + }, + leader2: mockAboutData.users['kasya'], + leader3: mockAboutData.users['mamicidal'], + }, + loading: false, + error: null, + } } return { loading: true } }) @@ -526,15 +507,8 @@ describe('About Component', () => { }) test('renders LoadingSpinner when project data is loading', async () => { - ;(useQuery as unknown as jest.Mock).mockImplementation((query, options) => { - if (options?.variables?.key === 'nest') { - return { loading: true, data: null, error: null } - } - return { - loading: false, - data: { user: { avatarUrl: '', company: '', name: 'Dummy', location: '' } }, - error: null, - } + ;(useQuery as unknown as jest.Mock).mockImplementation(() => { + return { loading: true, data: null, error: null } }) await act(async () => { @@ -550,15 +524,21 @@ describe('About Component', () => { }) test('renders ErrorDisplay when project is null', async () => { - ;(useQuery as unknown as jest.Mock).mockImplementation((query, options) => { - if (options?.variables?.key === 'nest') { - return { loading: false, data: { project: null }, error: null } - } - return { - loading: false, - data: { user: { avatarUrl: '', company: '', name: 'Dummy', location: '' } }, - error: null, + ;(useQuery as unknown as jest.Mock).mockImplementation((query) => { + if (query === GetAboutPageDataDocument) { + return { + loading: false, + data: { + project: null, + topContributors: mockAboutData.topContributors, + leader1: mockAboutData.users['arkid15r'], + leader2: mockAboutData.users['kasya'], + leader3: mockAboutData.users['mamicidal'], + }, + error: null, + } } + return { loading: true } }) await act(async () => { render() @@ -571,145 +551,20 @@ describe('About Component', () => { }) }) - test('triggers toaster error when GraphQL request fails for project', async () => { - ;(useQuery as unknown as jest.Mock).mockImplementation((query, options) => { - if (query === GetProjectMetadataDocument && options?.variables?.key === 'nest') { - return { loading: false, data: null, error: new Error('GraphQL error') } - } - return { - loading: false, - data: { user: { avatarUrl: '', company: '', name: 'Dummy', location: '' } }, - error: null, - } - }) - await act(async () => { - render() - }) - await waitFor(() => { - expect(addToast).toHaveBeenCalledWith({ - color: 'danger', - description: 'GraphQL error', - shouldShowTimeoutProgress: true, - timeout: 5000, - title: 'Server Error', - variant: 'solid', - }) - }) - }) - - test('triggers toaster error when GraphQL request fails for topContributors', async () => { - ;(useQuery as unknown as jest.Mock).mockImplementation((query, options) => { - if (query === GetTopContributorsDocument && options?.variables?.key === 'nest') { + test('triggers toaster error when GraphQL request fails', async () => { + ;(useQuery as unknown as jest.Mock).mockImplementation((query) => { + if (query === GetAboutPageDataDocument) { return { loading: false, data: null, error: new Error('GraphQL error') } } - return { - loading: false, - data: { user: { avatarUrl: '', company: '', name: 'Dummy', location: '' } }, - error: null, - } - }) - await act(async () => { - render() - }) - await waitFor(() => { - expect(addToast).toHaveBeenCalledWith({ - color: 'danger', - description: 'GraphQL error', - shouldShowTimeoutProgress: true, - timeout: 5000, - title: 'Server Error', - variant: 'solid', - }) - }) - }) - - test('renders mission and who its for sections correctly', async () => { - await act(async () => { - render() - }) - - const missionSection = screen.getByText('Our Mission').closest('div') - expect(missionSection).toBeInTheDocument() - expect(screen.getByText('Test mission statement')).toBeInTheDocument() - - const whoItsForSection = screen.getByText("Who It's For").closest('div') - expect(whoItsForSection).toBeInTheDocument() - expect(screen.getByText('Test target audience description')).toBeInTheDocument() - }) - - test('renders mission section', async () => { - await act(async () => { - render() - }) - expect(screen.getByText('Our Mission')).toBeInTheDocument() - expect(screen.getByText('Test mission statement')).toBeInTheDocument() - }) - - test("renders 'Who It's For' section", async () => { - await act(async () => { - render() - }) - expect(screen.getByText("Who It's For")).toBeInTheDocument() - expect(screen.getByText(/Test target audience description/)).toBeInTheDocument() - }) - - test('renders key features section', async () => { - await act(async () => { - render() - }) - expect(screen.getByText('Key Features')).toBeInTheDocument() - expect(screen.getByText('Feature 1')).toBeInTheDocument() - expect(screen.getByText('Feature 2')).toBeInTheDocument() - expect(screen.getByText('Feature 1 description')).toBeInTheDocument() - expect(screen.getByText('Feature 2 description')).toBeInTheDocument() - }) - - test('renders get involved section', async () => { - await act(async () => { - render() - }) - expect(screen.getByText('Get Involved')).toBeInTheDocument() - expect(screen.getByText('Get involved description')).toBeInTheDocument() - expect(screen.getByText('Way 1')).toBeInTheDocument() - expect(screen.getByText('Way 2')).toBeInTheDocument() - expect(screen.getByText('Test call to action')).toBeInTheDocument() - }) - - test('renders project history timeline section', async () => { - await act(async () => { - render() - }) - expect(screen.getByText('Project Timeline')).toBeInTheDocument() - expect(screen.getByText('Timeline Event 7')).toBeInTheDocument() - expect(screen.getByText('Timeline Event 2')).toBeInTheDocument() - expect(screen.queryByText('Timeline Event 1')).not.toBeInTheDocument() - }) - - test('triggers toaster error when GraphQL request fails for a leader', async () => { - ;(useQuery as unknown as jest.Mock).mockImplementation((query, options) => { - if (query === GetLeaderDataDocument && options?.variables?.key === 'arkid15r') { - return { loading: false, data: null, error: new Error('GraphQL error for leader') } - } - if (query === GetProjectMetadataDocument) { - return mockProjectData - } - if (query === GetTopContributorsDocument) { - return mockTopContributorsData - } - if (query === GetLeaderDataDocument) { - return mockUserData(options?.variables?.key) - } return { loading: true } }) - await act(async () => { render() }) - await waitFor(() => { expect(addToast).toHaveBeenCalledWith({ color: 'danger', - description: 'GraphQL error for leader', + description: 'GraphQL error', shouldShowTimeoutProgress: true, timeout: 5000, title: 'Server Error', diff --git a/frontend/src/app/about/page.tsx b/frontend/src/app/about/page.tsx index f447e70caa..955f1dc781 100644 --- a/frontend/src/app/about/page.tsx +++ b/frontend/src/app/about/page.tsx @@ -11,11 +11,7 @@ import { FaCircleCheck, FaClock, FaScroll, FaBullseye, FaUser, FaUsersGear } fro import { HiUserGroup } from 'react-icons/hi' import { IconWrapper } from 'wrappers/IconWrapper' import { ErrorDisplay, handleAppError } from 'app/global-error' -import { - GetProjectMetadataDocument, - GetTopContributorsDocument, -} from 'types/__generated__/projectQueries.generated' -import { GetLeaderDataDocument } from 'types/__generated__/userQueries.generated' +import { GetAboutPageDataDocument } from 'types/__generated__/aboutQueries.generated' import { technologies, missionContent, @@ -65,49 +61,38 @@ const getMilestoneIcon = (progress: number) => { } const About = () => { - const { - data: projectMetadataResponse, - loading: projectMetadataLoading, - error: projectMetadataRequestError, - } = useQuery(GetProjectMetadataDocument, { - variables: { key: projectKey }, - }) - - const { - data: topContributorsResponse, - loading: topContributorsLoading, - error: topContributorsRequestError, - } = useQuery(GetTopContributorsDocument, { + const { data, loading, error } = useQuery(GetAboutPageDataDocument, { variables: { + projectKey, excludedUsernames: Object.keys(leaders), hasFullName: true, - key: projectKey, limit: 24, + leader1: 'arkid15r', + leader2: 'kasya', + leader3: 'mamicidal', }, }) - const { leadersData, isLoading: leadersLoading } = useLeadersData() - // Derive data directly from response to prevent race conditions. - const projectMetadata = projectMetadataResponse?.project - const topContributors = topContributorsResponse?.topContributors + const projectMetadata = data?.project + const topContributors = data?.topContributors + + const leadersData = [data?.leader1, data?.leader2, data?.leader3].filter(Boolean).map((user) => ({ + description: user?.login ? leaders[user.login as keyof typeof leaders] : '', + memberName: user?.name || user?.login, + member: user, + })) const [showAllRoadmap, setShowAllRoadmap] = useState(false) const [showAllTimeline, setShowAllTimeline] = useState(false) useEffect(() => { - if (projectMetadataRequestError) { - handleAppError(projectMetadataRequestError) + if (error) { + handleAppError(error) } - }, [projectMetadataRequestError]) + }, [error]) - useEffect(() => { - if (topContributorsRequestError) { - handleAppError(topContributorsRequestError) - } - }, [topContributorsRequestError]) - - const isLoading = leadersLoading || projectMetadataLoading || topContributorsLoading + const isLoading = loading if (isLoading) { return @@ -319,46 +304,4 @@ const About = () => { ) } -const useLeadersData = () => { - const { - data: leader1Data, - loading: loading1, - error: error1, - } = useQuery(GetLeaderDataDocument, { - variables: { key: 'arkid15r' }, - }) - const { - data: leader2Data, - loading: loading2, - error: error2, - } = useQuery(GetLeaderDataDocument, { - variables: { key: 'kasya' }, - }) - const { - data: leader3Data, - loading: loading3, - error: error3, - } = useQuery(GetLeaderDataDocument, { - variables: { key: 'mamicidal' }, - }) - - const isLoading = loading1 || loading2 || loading3 - - useEffect(() => { - if (error1) handleAppError(error1) - if (error2) handleAppError(error2) - if (error3) handleAppError(error3) - }, [error1, error2, error3]) - - const leadersData = [leader1Data?.user, leader2Data?.user, leader3Data?.user] - .filter(Boolean) - .map((user) => ({ - description: leaders[user.login], - memberName: user.name || user.login, - member: user, - })) - - return { leadersData, isLoading } -} - export default About diff --git a/frontend/src/server/queries/aboutQueries.ts b/frontend/src/server/queries/aboutQueries.ts new file mode 100644 index 0000000000..6d4f109350 --- /dev/null +++ b/frontend/src/server/queries/aboutQueries.ts @@ -0,0 +1,84 @@ +import { gql } from '@apollo/client' + +export const GET_ABOUT_PAGE_DATA = gql` + query GetAboutPageData( + $projectKey: String! + $excludedUsernames: [String!] + $hasFullName: Boolean = false + $limit: Int = 20 + $leader1: String! + $leader2: String! + $leader3: String! + ) { + project(key: $projectKey) { + id + contributorsCount + forksCount + issuesCount + name + starsCount + summary + recentMilestones(limit: 25) { + id + title + url + body + progress + state + } + } + topContributors( + project: $projectKey + excludedUsernames: $excludedUsernames + hasFullName: $hasFullName + limit: $limit + ) { + id + avatarUrl + login + name + } + leader1: user(login: $leader1) { + id + avatarUrl + login + name + badgeCount + badges { + cssClass + description + id + name + weight + } + } + leader2: user(login: $leader2) { + id + avatarUrl + login + name + badgeCount + badges { + cssClass + description + id + name + weight + } + } + leader3: user(login: $leader3) { + id + avatarUrl + login + name + badgeCount + badges { + cssClass + description + id + name + weight + } + } + } +` diff --git a/frontend/src/types/__generated__/aboutQueries.generated.ts b/frontend/src/types/__generated__/aboutQueries.generated.ts new file mode 100644 index 0000000000..5eb6274795 --- /dev/null +++ b/frontend/src/types/__generated__/aboutQueries.generated.ts @@ -0,0 +1,18 @@ +import * as Types from './graphql'; + +import { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/core'; +export type GetAboutPageDataQueryVariables = Types.Exact<{ + projectKey: Types.Scalars['String']['input']; + excludedUsernames?: Types.InputMaybe | Types.Scalars['String']['input']>; + hasFullName?: Types.InputMaybe; + limit?: Types.InputMaybe; + leader1: Types.Scalars['String']['input']; + leader2: Types.Scalars['String']['input']; + leader3: Types.Scalars['String']['input']; +}>; + + +export type GetAboutPageDataQuery = { project: { __typename: 'ProjectNode', id: string, contributorsCount: number, forksCount: number, issuesCount: number, name: string, starsCount: number, summary: string, recentMilestones: Array<{ __typename: 'MilestoneNode', id: string, title: string, url: string, body: string, progress: number, state: string }> } | null, topContributors: Array<{ __typename: 'RepositoryContributorNode', id: string, avatarUrl: string, login: string, name: string }>, leader1: { __typename: 'UserNode', id: string, avatarUrl: string, login: string, name: string, badgeCount: number, badges: Array<{ __typename: 'BadgeNode', cssClass: string, description: string, id: string, name: string, weight: number }> } | null, leader2: { __typename: 'UserNode', id: string, avatarUrl: string, login: string, name: string, badgeCount: number, badges: Array<{ __typename: 'BadgeNode', cssClass: string, description: string, id: string, name: string, weight: number }> } | null, leader3: { __typename: 'UserNode', id: string, avatarUrl: string, login: string, name: string, badgeCount: number, badges: Array<{ __typename: 'BadgeNode', cssClass: string, description: string, id: string, name: string, weight: number }> } | null }; + + +export const GetAboutPageDataDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"GetAboutPageData"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"projectKey"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"String"}}}},{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"excludedUsernames"}},"type":{"kind":"ListType","type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"String"}}}}},{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"hasFullName"}},"type":{"kind":"NamedType","name":{"kind":"Name","value":"Boolean"}},"defaultValue":{"kind":"BooleanValue","value":false}},{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"limit"}},"type":{"kind":"NamedType","name":{"kind":"Name","value":"Int"}},"defaultValue":{"kind":"IntValue","value":"20"}},{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"leader1"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"String"}}}},{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"leader2"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"String"}}}},{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"leader3"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"String"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"project"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"key"},"value":{"kind":"Variable","name":{"kind":"Name","value":"projectKey"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"contributorsCount"}},{"kind":"Field","name":{"kind":"Name","value":"forksCount"}},{"kind":"Field","name":{"kind":"Name","value":"issuesCount"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"starsCount"}},{"kind":"Field","name":{"kind":"Name","value":"summary"}},{"kind":"Field","name":{"kind":"Name","value":"recentMilestones"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"limit"},"value":{"kind":"IntValue","value":"25"}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"title"}},{"kind":"Field","name":{"kind":"Name","value":"url"}},{"kind":"Field","name":{"kind":"Name","value":"body"}},{"kind":"Field","name":{"kind":"Name","value":"progress"}},{"kind":"Field","name":{"kind":"Name","value":"state"}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"topContributors"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"project"},"value":{"kind":"Variable","name":{"kind":"Name","value":"projectKey"}}},{"kind":"Argument","name":{"kind":"Name","value":"excludedUsernames"},"value":{"kind":"Variable","name":{"kind":"Name","value":"excludedUsernames"}}},{"kind":"Argument","name":{"kind":"Name","value":"hasFullName"},"value":{"kind":"Variable","name":{"kind":"Name","value":"hasFullName"}}},{"kind":"Argument","name":{"kind":"Name","value":"limit"},"value":{"kind":"Variable","name":{"kind":"Name","value":"limit"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"avatarUrl"}},{"kind":"Field","name":{"kind":"Name","value":"login"}},{"kind":"Field","name":{"kind":"Name","value":"name"}}]}},{"kind":"Field","alias":{"kind":"Name","value":"leader1"},"name":{"kind":"Name","value":"user"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"login"},"value":{"kind":"Variable","name":{"kind":"Name","value":"leader1"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"avatarUrl"}},{"kind":"Field","name":{"kind":"Name","value":"login"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"badgeCount"}},{"kind":"Field","name":{"kind":"Name","value":"badges"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"cssClass"}},{"kind":"Field","name":{"kind":"Name","value":"description"}},{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"weight"}}]}}]}},{"kind":"Field","alias":{"kind":"Name","value":"leader2"},"name":{"kind":"Name","value":"user"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"login"},"value":{"kind":"Variable","name":{"kind":"Name","value":"leader2"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"avatarUrl"}},{"kind":"Field","name":{"kind":"Name","value":"login"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"badgeCount"}},{"kind":"Field","name":{"kind":"Name","value":"badges"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"cssClass"}},{"kind":"Field","name":{"kind":"Name","value":"description"}},{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"weight"}}]}}]}},{"kind":"Field","alias":{"kind":"Name","value":"leader3"},"name":{"kind":"Name","value":"user"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"login"},"value":{"kind":"Variable","name":{"kind":"Name","value":"leader3"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"avatarUrl"}},{"kind":"Field","name":{"kind":"Name","value":"login"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"badgeCount"}},{"kind":"Field","name":{"kind":"Name","value":"badges"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"cssClass"}},{"kind":"Field","name":{"kind":"Name","value":"description"}},{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"weight"}}]}}]}}]}}]} as unknown as DocumentNode; \ No newline at end of file From f49469a278c29c6a0574b760d887ceed7c8b9d31 Mon Sep 17 00:00:00 2001 From: Harsh Date: Wed, 28 Jan 2026 14:42:08 +0000 Subject: [PATCH 2/2] fix: code rabbit comments --- frontend/__tests__/e2e/pages/About.spec.ts | 3 +- frontend/__tests__/unit/pages/About.test.tsx | 30 ++++++++++++++++++++ 2 files changed, 32 insertions(+), 1 deletion(-) diff --git a/frontend/__tests__/e2e/pages/About.spec.ts b/frontend/__tests__/e2e/pages/About.spec.ts index 9f1bc1cdea..7f7dbe6c7a 100644 --- a/frontend/__tests__/e2e/pages/About.spec.ts +++ b/frontend/__tests__/e2e/pages/About.spec.ts @@ -17,7 +17,7 @@ test.describe('About Page', () => { }), {} ) - await route.fulfill({ + return route.fulfill({ status: 200, json: { data: { @@ -28,6 +28,7 @@ test.describe('About Page', () => { }, }) } + return route.continue() }) await page.context().addCookies([ diff --git a/frontend/__tests__/unit/pages/About.test.tsx b/frontend/__tests__/unit/pages/About.test.tsx index 7261c348b5..c227a08818 100644 --- a/frontend/__tests__/unit/pages/About.test.tsx +++ b/frontend/__tests__/unit/pages/About.test.tsx @@ -224,6 +224,36 @@ describe('About Component', () => { jest.clearAllMocks() }) + test('renders mission and who its for sections correctly', async () => { + await act(async () => { + render() + }) + + const missionSection = screen.getByText('Our Mission').closest('div') + expect(missionSection).toBeInTheDocument() + expect(screen.getByText('Test mission statement')).toBeInTheDocument() + + const whoItsForSection = screen.getByText("Who It's For").closest('div') + expect(whoItsForSection).toBeInTheDocument() + expect(screen.getByText('Test target audience description')).toBeInTheDocument() + }) + + test('renders mission section', async () => { + await act(async () => { + render() + }) + expect(screen.getByText('Our Mission')).toBeInTheDocument() + expect(screen.getByText('Test mission statement')).toBeInTheDocument() + }) + + test("renders 'Who It's For' section", async () => { + await act(async () => { + render() + }) + expect(screen.getByText("Who It's For")).toBeInTheDocument() + expect(screen.getByText(/Test target audience description/)).toBeInTheDocument() + }) + test('renders key features section correctly', async () => { await act(async () => { render()