From d8cab3aa93119055736268ded5242e010319fd22 Mon Sep 17 00:00:00 2001 From: w3bdesign <45217974+w3bdesign@users.noreply.github.com> Date: Tue, 17 Dec 2024 03:43:50 +0100 Subject: [PATCH 1/4] =?UTF-8?q?=E2=9C=A8=20feat:=20add=20volunteer=20work?= =?UTF-8?q?=20section=20to=20CV?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Implement volunteer work display in CV section with data schema updates and UI components. This enhances the CV by showcasing community involvement and contributions alongside professional experience. --- src/components/CV/CVContent.component.tsx | 25 ++++++++++++- src/lib/sanity/queries.ts | 6 +++ studio/schemaTypes/documents/cv.ts | 45 ++++++++++++++++++++++- 3 files changed, 73 insertions(+), 3 deletions(-) diff --git a/src/components/CV/CVContent.component.tsx b/src/components/CV/CVContent.component.tsx index eb58347f..e1174173 100644 --- a/src/components/CV/CVContent.component.tsx +++ b/src/components/CV/CVContent.component.tsx @@ -16,6 +16,12 @@ interface CVData { degree: string; description: string; }>; + volunteerWork: Array<{ + period: string; + organization: string; + role: string; + description: string; + }>; } interface CVContentProps { @@ -76,6 +82,23 @@ const CVContent: React.FC = ({ cvData }) => { ), }, + { + id: "volunteerWork", + label: "Frivillig arbeid", + content: ( +
+ {cvData.volunteerWork?.map((vol) => ( +
+

+ {vol.period} - {vol.organization} +

+ {vol.role &&

{vol.role}

} +

{vol.description}

+
+ ))} +
+ ), + } ]; return ( @@ -84,7 +107,7 @@ const CVContent: React.FC = ({ cvData }) => { CV
-
+
diff --git a/src/lib/sanity/queries.ts b/src/lib/sanity/queries.ts index c3cf0969..912e8a70 100644 --- a/src/lib/sanity/queries.ts +++ b/src/lib/sanity/queries.ts @@ -38,6 +38,12 @@ export const cvQuery = groq` institution, degree, description + }, + volunteerWork[] { + period, + organization, + role, + description } } `; diff --git a/studio/schemaTypes/documents/cv.ts b/studio/schemaTypes/documents/cv.ts index 11b2e422..52ae29c1 100644 --- a/studio/schemaTypes/documents/cv.ts +++ b/studio/schemaTypes/documents/cv.ts @@ -36,8 +36,18 @@ export default { type: 'object', fields: [ {name: 'period', title: 'Period', type: 'string'}, - {name: 'company', title: 'Company', type: 'string'}, - {name: 'role', title: 'Role', type: 'string'}, + { + name: 'company', + title: 'Company/Project', + type: 'string', + description: 'Company name or personal project/community name' + }, + { + name: 'role', + title: 'Role', + type: 'string', + description: 'Job title or role in the project/community' + }, {name: 'description', title: 'Description', type: 'text'}, ], }, @@ -59,5 +69,36 @@ export default { }, ], }, + { + name: 'volunteerWork', + title: 'Volunteer work', + type: 'array', + of: [ + { + type: 'object', + fields: [ + {name: 'period', title: 'Period', type: 'string'}, + { + name: 'organization', + title: 'Organization', + type: 'string', + description: 'Name of the community or organization' + }, + { + name: 'role', + title: 'Role', + type: 'string', + description: 'Your role in the community' + }, + { + name: 'description', + title: 'Description', + type: 'text', + description: 'Describe your contributions and impact' + }, + ], + }, + ], + }, ], } From 650681e29d9167ea633cec37ecbdb455c52a8c67 Mon Sep 17 00:00:00 2001 From: w3bdesign <45217974+w3bdesign@users.noreply.github.com> Date: Tue, 17 Dec 2024 03:47:06 +0100 Subject: [PATCH 2/4] =?UTF-8?q?=F0=9F=92=84=20ui:=20adjust=20max=20height?= =?UTF-8?q?=20of=20vertical=20tab=20layout?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The max height of the vertical tab list is increased from 135px to 181px to better accommodate tab content and prevent unnecessary scroll bars --- src/components/UI/Tabs.component.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/UI/Tabs.component.tsx b/src/components/UI/Tabs.component.tsx index d5a83679..1717805e 100644 --- a/src/components/UI/Tabs.component.tsx +++ b/src/components/UI/Tabs.component.tsx @@ -37,7 +37,7 @@ const Tabs: React.FC = ({ tabs, orientation = "vertical" }) => { className={`flex ${isVertical ? "flex-col sm:flex-row" : "flex-col"} bg-gray-800 rounded-lg h-[calc(75vh-2rem)] mt-4`} >
Date: Tue, 17 Dec 2024 03:55:11 +0100 Subject: [PATCH 3/4] =?UTF-8?q?=F0=9F=92=84=20ui:=20update=20tab=20indicat?= =?UTF-8?q?or=20color=20to=20matrix=20dark=20theme?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Changes the active tab indicator color from indigo-500 to the matrix dark theme variable for better consistency with the overall design system. --- src/components/UI/Tabs.component.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/UI/Tabs.component.tsx b/src/components/UI/Tabs.component.tsx index 1717805e..fa7d7392 100644 --- a/src/components/UI/Tabs.component.tsx +++ b/src/components/UI/Tabs.component.tsx @@ -63,7 +63,7 @@ const Tabs: React.FC = ({ tabs, orientation = "vertical" }) => { {activeTab === tab.id && ( From 841695e9741295b4d41e7674e32e6d0dbb0ea826 Mon Sep 17 00:00:00 2001 From: w3bdesign <45217974+w3bdesign@users.noreply.github.com> Date: Tue, 17 Dec 2024 03:59:45 +0100 Subject: [PATCH 4/4] =?UTF-8?q?=E2=9C=85=20test:=20add=20volunteer=20work?= =?UTF-8?q?=20tab=20testing?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This commit enhances test coverage for the CV component by adding comprehensive tests for the volunteer work tab functionality and its content rendering. --- __tests__/CV/CVContent.test.tsx | 25 ++++++++++++++++++++++++- 1 file changed, 24 insertions(+), 1 deletion(-) diff --git a/__tests__/CV/CVContent.test.tsx b/__tests__/CV/CVContent.test.tsx index f36e55fc..3f3c9e7a 100644 --- a/__tests__/CV/CVContent.test.tsx +++ b/__tests__/CV/CVContent.test.tsx @@ -4,6 +4,7 @@ import React from "react"; import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; import CVContent from "../../src/components/CV/CVContent.component"; const mockCVData = { @@ -24,10 +25,18 @@ const mockCVData = { description: "Studied various aspects of computer science", }, ], + volunteerWork: [ + { + period: "2023-2024", + organization: "AI Community", + role: "Technical Lead", + description: "Managing AI Discord community and developing bots", + }, + ], }; describe("CVContent", () => { - it("CVContent renders correctly with mock data", () => { + it("CVContent renders correctly with mock data", async () => { render(); // Check if the CV header is present @@ -44,12 +53,26 @@ describe("CVContent", () => { }); const experienceTab = screen.getByRole("tab", { name: /erfaring/i }); const educationTab = screen.getByRole("tab", { name: /utdanning/i }); + const volunteerWorkTab = screen.getByRole("tab", { name: /frivillig arbeid/i }); expect(qualificationsTab).toBeInTheDocument(); expect(experienceTab).toBeInTheDocument(); expect(educationTab).toBeInTheDocument(); + expect(volunteerWorkTab).toBeInTheDocument(); // Check if mock data is rendered (you might need to click on tabs to see this content) const qualification = screen.getByText(/qualification 1/i); expect(qualification).toBeInTheDocument(); + + // Set up user event + const user = userEvent.setup(); + + // Click on volunteer work tab and check its content + await user.click(volunteerWorkTab); + + // Check volunteer work content + const volunteerRole = await screen.findByText(/technical lead/i); + expect(volunteerRole).toBeInTheDocument(); + const volunteerOrg = await screen.findByText(/ai community/i); + expect(volunteerOrg).toBeInTheDocument(); }); });