-
-
-
-
-
- Last ned PDF
-
+interface CVContentProps {
+ cvData: CVData;
+}
+
+const CVContent: React.FC
= ({ cvData }) => {
+ const tabs = [
+ {
+ id: "qualifications",
+ label: "Nøkkelkvalifikasjoner",
+ content: (
+
+ {cvData.keyQualifications.map((qual, id) => (
+
+ {qual}
+
+ ))}
+
+ ),
+ },
+ {
+ id: "experience",
+ label: "Erfaring",
+ content: (
+
+ {cvData.experience.map((exp, id) => (
+
+
+ {exp.period} - {exp.company}
+
+ {exp.role &&
{exp.role}
}
+
{exp.description}
+
+ ))}
+
+ ),
+ },
+ {
+ id: "education",
+ label: "Utdanning",
+ content: (
+
+ {cvData.education.map((edu, id) => (
+
+
+ {edu.period} - {edu.institution}
+
+ {edu.degree &&
{edu.degree}
}
+
{edu.description}
+
+ ))}
+
+ ),
+ },
+ ];
+
+ return (
+
+
+
CV
+
+
+
+
+
+
+
+
+
+ Last ned PDF
+
+
-
-
-);
+
+ );
+};
export default CVContent;
diff --git a/src/components/CV/CVTest.component.tsx b/src/components/CV/CVTest.component.tsx
deleted file mode 100644
index 02fc7fa9..00000000
--- a/src/components/CV/CVTest.component.tsx
+++ /dev/null
@@ -1,164 +0,0 @@
-"use client";
-
-import Tabs from "@/components/UI/Tabs.component";
-
-interface CVData {
- keyQualifications: string[];
- experience: Array<{
- period: string;
- company: string;
- role: string;
- description: string;
- }>;
- education: Array<{
- period: string;
- institution: string;
- degree: string;
- description: string;
- }>;
-}
-
-const cvData: CVData = {
- keyQualifications: [
- "Totalt over 10 års erfaring med utvikling og design av nettbutikker og nettsider, erfaring både med fullstack og frontend, men i nyere tid spesialisert på frontend.",
- "Erfaring med språk som Javascript (ES 6) og Typescript med rammeverk som React, Gatsby, Vue 2 og 3, Nuxt, Next, Node.js, Storybook, testing med Jest og Cypress samt design med Tailwind CSS, Bootstrap, Styled Components og mange andre relevante verktøy og rammeverk.",
- ],
- experience: [
- {
- period: "2007 – 2023",
- company: "Frilans",
- role: "",
- description:
- "Arbeid med utvikling og design av hjemmesider i PHP, mySQL, WordPress og JavaScript.",
- },
- {
- period: "2021 – 2021",
- company: "NovaCare",
- role: "Senior frontendutvikler",
- description:
- "Ansvar for utvikling av løsninger i Javascript med bruk av Vue 2 som rammeverk samt SCSS for styling. Har også brukt Storybook for dokumentasjon av komponenter.",
- },
- {
- period: "2016 – 2019",
- company: "M360 Media Group",
- role: "",
- description:
- "Utvikling og design av nettbutikker og nettsider (WordPress, WooCommerce og Magento). Supportansvarlig på Pckasse og nettbutikk. Utvikling av løsninger i PHP og Javascript med mer.",
- },
- {
- period: "2014 – 2015",
- company: "Qurius",
- role: "",
- description:
- "Utvikling, design og implementering av firmaets og kunders hjemmesider (Opencart og WordPress). Utvikling av løsninger i PHP og Javascript med mer.",
- },
- {
- period: "2010 – 2012",
- company: "Markedsmateriell",
- role: "",
- description:
- "Utvikling, design og implementering av hjemmesider i Joomla samt prosjektledelse. Arbeidet også med trykk og print, samt drift og support av nettverk og tilhørende løsninger. Utvikling av løsninger i PHP og Javascript med mer.",
- },
- {
- period: "2007 – 2008",
- company: "Experian",
- role: "",
- description:
- "Salg av kredittløsninger over telefon til bedriftsmarkedet.",
- },
- {
- period: "2007 – 2007",
- company: "EBGames",
- role: "",
- description: "Salg av spill og elektronikk i butikk.",
- },
- {
- period: "2000 – 2002",
- company: "Vianett",
- role: "",
- description:
- "Utvikling, design og implementering av hjemmesider i HTML og CSS, med hovedfokus på ASP.",
- },
- ],
- education: [
- {
- period: "2019 – 2023",
- institution: "Kompetanseheving / egenlæring frontendutvikling",
- degree: "",
- description:
- "Kompetanseheving og egenlæring i frontendutvikling primært med fokus på React, Vue, JavaScript og andre rammeverk og verktøy. Læringsprosessen er dokumentert via Github.",
- },
- {
- period: "2005 - 2006",
- institution: "Greåker VGS",
- degree: "Allmennfaglig påbygning",
- description: "Fordypning i matematikk.",
- },
- {
- period: "2002 - 2005",
- institution: "Malakoff VGS",
- degree: "GK, VK1 og VK2 Service-elektroniker",
- description: "Fordypning i data og kontormaskiner.",
- },
- ],
-};
-
-const CV: React.FC = () => {
- const tabs = [
- {
- id: "qualifications",
- label: "Nøkkelkvalifikasjoner",
- content: (
-
- {cvData.keyQualifications.map((qual, id) => (
-
- {qual}
-
- ))}
-
- ),
- },
- {
- id: "experience",
- label: "Erfaring",
- content: (
-
- {cvData.experience.map((exp, id) => (
-
-
- {exp.period} - {exp.company}
-
- {exp.role &&
{exp.role}
}
-
{exp.description}
-
- ))}
-
- ),
- },
- {
- id: "education",
- label: "Utdanning",
- content: (
-
- {cvData.education.map((edu, id) => (
-
-
- {edu.period} - {edu.institution}
-
- {edu.degree &&
{edu.degree}
}
-
{edu.description}
-
- ))}
-
- ),
- },
- ];
-
- return (
-
-
-
- );
-};
-
-export default CV;
diff --git a/src/lib/sanity/queries.ts b/src/lib/sanity/queries.ts
index 4323474d..e9c0284a 100644
--- a/src/lib/sanity/queries.ts
+++ b/src/lib/sanity/queries.ts
@@ -21,3 +21,21 @@ export const projectsQuery = groq`
"projectimage": projectimage.asset->url
}
`;
+
+export const cvQuery = groq`
+ *[_type == "cv"][0] {
+ keyQualifications,
+ experience[] {
+ period,
+ company,
+ role,
+ description
+ },
+ education[] {
+ period,
+ institution,
+ degree,
+ description
+ }
+ }
+`;
From c69c003b68a01d2210e8cdd5d901ef5717d7ab8e Mon Sep 17 00:00:00 2001
From: Daniel <45217974+w3bdesign@users.noreply.github.com>
Date: Wed, 24 Jul 2024 06:14:58 +0200
Subject: [PATCH 33/37] Max width
---
src/components/CV/CVContent.component.tsx | 2 +-
src/components/UI/Tabs.component.tsx | 2 +-
2 files changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/components/CV/CVContent.component.tsx b/src/components/CV/CVContent.component.tsx
index e3597db4..1752d3bf 100644
--- a/src/components/CV/CVContent.component.tsx
+++ b/src/components/CV/CVContent.component.tsx
@@ -81,7 +81,7 @@ const CVContent: React.FC
= ({ cvData }) => {
-
+
diff --git a/src/components/UI/Tabs.component.tsx b/src/components/UI/Tabs.component.tsx
index bc6a61a0..f9bb66c3 100644
--- a/src/components/UI/Tabs.component.tsx
+++ b/src/components/UI/Tabs.component.tsx
@@ -32,7 +32,7 @@ const Tabs: React.FC
= ({ tabs, orientation = "vertical" }) => {
const isVertical = orientation === "vertical";
return (
-
+
From 5ea89306434b816d5b4bf671616fcb36b1664505 Mon Sep 17 00:00:00 2001
From: Daniel <45217974+w3bdesign@users.noreply.github.com>
Date: Wed, 24 Jul 2024 06:17:10 +0200
Subject: [PATCH 34/37] Padding
---
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 f9bb66c3..3d9f2ef9 100644
--- a/src/components/UI/Tabs.component.tsx
+++ b/src/components/UI/Tabs.component.tsx
@@ -34,7 +34,7 @@ const Tabs: React.FC
= ({ tabs, orientation = "vertical" }) => {
return (
Date: Wed, 24 Jul 2024 06:19:22 +0200
Subject: [PATCH 35/37] Margin
---
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 3d9f2ef9..8e502944 100644
--- a/src/components/UI/Tabs.component.tsx
+++ b/src/components/UI/Tabs.component.tsx
@@ -34,7 +34,7 @@ const Tabs: React.FC
= ({ tabs, orientation = "vertical" }) => {
return (
Date: Wed, 24 Jul 2024 06:31:44 +0200
Subject: [PATCH 36/37] Fix index
---
src/components/CV/CVContent.component.tsx | 12 ++++++------
1 file changed, 6 insertions(+), 6 deletions(-)
diff --git a/src/components/CV/CVContent.component.tsx b/src/components/CV/CVContent.component.tsx
index 1752d3bf..d4a11e52 100644
--- a/src/components/CV/CVContent.component.tsx
+++ b/src/components/CV/CVContent.component.tsx
@@ -29,8 +29,8 @@ const CVContent: React.FC
= ({ cvData }) => {
label: "Nøkkelkvalifikasjoner",
content: (
- {cvData.keyQualifications.map((qual, id) => (
-
+ {cvData.keyQualifications.map((qual) => (
+
{qual}
))}
@@ -42,8 +42,8 @@ const CVContent: React.FC = ({ cvData }) => {
label: "Erfaring",
content: (
- {cvData.experience.map((exp, id) => (
-
+ {cvData.experience.map((exp) => (
+
{exp.period} - {exp.company}
@@ -59,8 +59,8 @@ const CVContent: React.FC
= ({ cvData }) => {
label: "Utdanning",
content: (
- {cvData.education.map((edu, id) => (
-
+ {cvData.education.map((edu) => (
+
{edu.period} - {edu.institution}
From e4e3c163aae87445f298a22dad35e01075cc8851 Mon Sep 17 00:00:00 2001
From: Daniel <45217974+w3bdesign@users.noreply.github.com>
Date: Wed, 24 Jul 2024 06:35:43 +0200
Subject: [PATCH 37/37] Fix Jest
---
__tests__/CV/CVContent.test.tsx | 56 ++++++++++++++++++++++++++-------
1 file changed, 44 insertions(+), 12 deletions(-)
diff --git a/__tests__/CV/CVContent.test.tsx b/__tests__/CV/CVContent.test.tsx
index e1f82451..f36e55fc 100644
--- a/__tests__/CV/CVContent.test.tsx
+++ b/__tests__/CV/CVContent.test.tsx
@@ -2,22 +2,54 @@
* @jest-environment jsdom
*/
+import React from "react";
import { render, screen } from "@testing-library/react";
-
import CVContent from "../../src/components/CV/CVContent.component";
+const mockCVData = {
+ keyQualifications: ["Qualification 1", "Qualification 2"],
+ experience: [
+ {
+ period: "2020-2022",
+ company: "Example Company",
+ role: "Software Developer",
+ description: "Worked on various projects",
+ },
+ ],
+ education: [
+ {
+ period: "2016-2020",
+ institution: "University of Example",
+ degree: "Bachelor in Computer Science",
+ description: "Studied various aspects of computer science",
+ },
+ ],
+};
+
describe("CVContent", () => {
- it("CVContent laster inn og kan vises", () => {
- render( );
- const cvcontent = screen.getByRole("heading", { name: /cv/i });
- expect(cvcontent).toBeInTheDocument();
- });
+ it("CVContent renders correctly with mock data", () => {
+ render( );
+
+ // Check if the CV header is present
+ const cvHeader = screen.getByRole("heading", { name: /cv/i });
+ expect(cvHeader).toBeInTheDocument();
+
+ // Check if the "Last ned PDF" button is present
+ const pdfButton = screen.getByRole("link", { name: /last ned pdf/i });
+ expect(pdfButton).toBeInTheDocument();
+
+ // Check if tabs are present
+ const qualificationsTab = screen.getByRole("tab", {
+ name: /nøkkelkvalifikasjoner/i,
+ });
+ const experienceTab = screen.getByRole("tab", { name: /erfaring/i });
+ const educationTab = screen.getByRole("tab", { name: /utdanning/i });
+ expect(qualificationsTab).toBeInTheDocument();
+ expect(experienceTab).toBeInTheDocument();
+ expect(educationTab).toBeInTheDocument();
- /*
- it("PDF laster inn og kan vises", async () => {
- render( );
- const pdf = await screen.findByText(/nøkkelkvalifikasjoner/i);
- expect(pdf).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();
});
- */
});