From 237307c248454bf0d2a51c9741d74947414dee9f Mon Sep 17 00:00:00 2001 From: Hkaar Date: Wed, 23 Oct 2024 13:00:48 +0800 Subject: [PATCH 01/14] Added w-full to transition slide up --- components/Transitions/SlideUp/SlideUp.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/Transitions/SlideUp/SlideUp.tsx b/components/Transitions/SlideUp/SlideUp.tsx index 703d618..1141b5e 100644 --- a/components/Transitions/SlideUp/SlideUp.tsx +++ b/components/Transitions/SlideUp/SlideUp.tsx @@ -8,7 +8,7 @@ export default function SlideUp( { delay, children }: SlideUpProps, ) { return ( - Date: Wed, 23 Oct 2024 13:02:10 +0800 Subject: [PATCH 02/14] Updated education section --- .../EducationSection/EducationSection.tsx | 63 +++++++++++-------- 1 file changed, 37 insertions(+), 26 deletions(-) diff --git a/components/EducationSection/EducationSection.tsx b/components/EducationSection/EducationSection.tsx index b0770cd..746816d 100644 --- a/components/EducationSection/EducationSection.tsx +++ b/components/EducationSection/EducationSection.tsx @@ -1,15 +1,16 @@ import { Icon } from "@iconify/react"; import Timeline from "../Timeline"; import TimePoint from "../Timeline/TimePoint"; +import SlideUp from "../Transitions/SlideUp"; export default function EducationSection( { ...props }: React.HTMLAttributes, ) { return (
-
+
- - - + + + + + + + + + + +
@@ -63,12 +72,14 @@ export default function EducationSection(
- + + +
From 4d386a9f18c9e16d62e1cc2d891417cb018e9c09 Mon Sep 17 00:00:00 2001 From: Hkaar Date: Wed, 23 Oct 2024 13:02:34 +0800 Subject: [PATCH 03/14] Updated animations for contact cards in contact section --- components/ContactSection/ContactSection.tsx | 39 ++++++++++++-------- 1 file changed, 24 insertions(+), 15 deletions(-) diff --git a/components/ContactSection/ContactSection.tsx b/components/ContactSection/ContactSection.tsx index 1031e0d..3bfc367 100644 --- a/components/ContactSection/ContactSection.tsx +++ b/components/ContactSection/ContactSection.tsx @@ -4,6 +4,7 @@ import ContactForm from "../ContactForm"; import ContactCard from "../Card/ContactCard"; import SlideRight from "../Transitions/SlideRight"; import SlideLeft from "../Transitions/SlideLeft"; +import SlideUp from "../Transitions/SlideUp"; export default function ContactSection() { return ( @@ -18,24 +19,32 @@ export default function ContactSection() {
- - shavashava42@gmail.com - + + + shavashava42@gmail.com + + - - +62 81237102017 - + + + +62 81237102017 + + - - @Hkaar5 - + + + @Hkaar5 + + - - Hkaar - + + + Hkaar + +
From 7b7f10a63eab9e043673cde517b46abf534e546c Mon Sep 17 00:00:00 2001 From: Hkaar Date: Wed, 23 Oct 2024 13:30:10 +0800 Subject: [PATCH 04/14] Updated test cases --- __tests__/page.test.tsx | 17 ++++++----------- 1 file changed, 6 insertions(+), 11 deletions(-) diff --git a/__tests__/page.test.tsx b/__tests__/page.test.tsx index 38de1f8..d40ddde 100644 --- a/__tests__/page.test.tsx +++ b/__tests__/page.test.tsx @@ -1,17 +1,12 @@ +import { assert, expect, test } from "vitest"; import { render, screen } from "@testing-library/react"; -import { Suspense } from "react"; import Home from "../app/(main)/page"; -import { assert, test } from "vitest"; -// RESERVED!! STILL FINDING A WAY TO FIX RSC NOT RENDERING +// RESERVED FOR THE FUTURE WHEN ASYNC COMPONENTS WORK IN TESTS // test("Page", async () => { -// render( -// -// -// , -// ); - -// await screen.findByRole("heading", {level: 3, name: "About myself"}); +// render(await (async () => await Home())()); +// expect(screen.getByRole("heading", { level: 3, name: "About myself" })) +// .toBeDefined(); // }); -test('temp', () => { assert(5 == 5) }) \ No newline at end of file +test('temp', () => { assert( 5 === 5) }) \ No newline at end of file From 3b763e79ce09a337139d5b4dec37358700094470 Mon Sep 17 00:00:00 2001 From: Hkaar Date: Wed, 23 Oct 2024 14:14:56 +0800 Subject: [PATCH 05/14] Added option to repeat transitions --- components/Transitions/SlideDown/SlideDown.tsx | 5 +++-- components/Transitions/SlideLeft/SlideLeft.tsx | 5 +++-- components/Transitions/SlideRight/SlideRight.tsx | 5 +++-- components/Transitions/SlideUp/SlideUp.tsx | 5 +++-- 4 files changed, 12 insertions(+), 8 deletions(-) diff --git a/components/Transitions/SlideDown/SlideDown.tsx b/components/Transitions/SlideDown/SlideDown.tsx index 2603cbf..9831b55 100644 --- a/components/Transitions/SlideDown/SlideDown.tsx +++ b/components/Transitions/SlideDown/SlideDown.tsx @@ -2,16 +2,17 @@ import * as motion from "framer-motion/client"; interface SlideDownProps extends React.HTMLAttributes { delay?: number + repeat?: boolean } export default function SlideDown( - { delay, children }: SlideDownProps, + { delay, repeat, children }: SlideDownProps, ) { return ( {children} diff --git a/components/Transitions/SlideLeft/SlideLeft.tsx b/components/Transitions/SlideLeft/SlideLeft.tsx index 0e13158..d2eb10f 100644 --- a/components/Transitions/SlideLeft/SlideLeft.tsx +++ b/components/Transitions/SlideLeft/SlideLeft.tsx @@ -2,10 +2,11 @@ import * as motion from "framer-motion/client"; interface SlideLeftProps extends React.HTMLAttributes { delay?: number; + repeat?: boolean; } export default function SlideLeft( - { delay, children }: SlideLeftProps, + { delay, repeat, children }: SlideLeftProps, ) { return ( {children} diff --git a/components/Transitions/SlideRight/SlideRight.tsx b/components/Transitions/SlideRight/SlideRight.tsx index 0c7930f..78f2012 100644 --- a/components/Transitions/SlideRight/SlideRight.tsx +++ b/components/Transitions/SlideRight/SlideRight.tsx @@ -2,10 +2,11 @@ import * as motion from "framer-motion/client"; interface SlideRightProps extends React.HTMLAttributes { delay?: number; + repeat?: boolean } export default function SlideRight( - { delay, children }: SlideRightProps, + { delay, repeat, children }: SlideRightProps, ) { return ( {children} diff --git a/components/Transitions/SlideUp/SlideUp.tsx b/components/Transitions/SlideUp/SlideUp.tsx index 1141b5e..11a63d3 100644 --- a/components/Transitions/SlideUp/SlideUp.tsx +++ b/components/Transitions/SlideUp/SlideUp.tsx @@ -2,16 +2,17 @@ import * as motion from "framer-motion/client"; interface SlideUpProps extends React.HTMLAttributes { delay?: number + repeat?: boolean } export default function SlideUp( - { delay, children }: SlideUpProps, + { delay, repeat, children }: SlideUpProps, ) { return ( {children} From 17eb6bae7243732d801ac7e5d4d543f79f70f35e Mon Sep 17 00:00:00 2001 From: Hkaar Date: Wed, 23 Oct 2024 14:15:18 +0800 Subject: [PATCH 06/14] Updated skill card and skill container components --- .../SkillContainer/SkillCard/SkillCard.tsx | 14 +++++- components/SkillContainer/SkillContainer.tsx | 48 +++++++++++-------- 2 files changed, 40 insertions(+), 22 deletions(-) diff --git a/components/SkillContainer/SkillCard/SkillCard.tsx b/components/SkillContainer/SkillCard/SkillCard.tsx index 05dd620..ff77093 100644 --- a/components/SkillContainer/SkillCard/SkillCard.tsx +++ b/components/SkillContainer/SkillCard/SkillCard.tsx @@ -1,4 +1,5 @@ import { Icon } from "@iconify/react"; +import { twMerge } from "tailwind-merge"; interface SkillCardProps extends React.HTMLAttributes { icon: string; @@ -6,8 +7,17 @@ interface SkillCardProps extends React.HTMLAttributes { export default function SkillCard({ icon, ...props }: SkillCardProps) { return ( -
- +
+ + {props.children}
diff --git a/components/SkillContainer/SkillContainer.tsx b/components/SkillContainer/SkillContainer.tsx index 67a8b32..879837e 100644 --- a/components/SkillContainer/SkillContainer.tsx +++ b/components/SkillContainer/SkillContainer.tsx @@ -7,6 +7,7 @@ import { useState } from "react"; import { Icon } from "@iconify/react"; import { twMerge } from "tailwind-merge"; import SlideUp from "../Transitions/SlideUp"; +import SlideDown from "../Transitions/SlideDown"; type Skill = { name: string; @@ -106,7 +107,7 @@ export default function SkillContainer( tab === 0 ? null : "hidden" } border-r border-gray-200 dark:border-gray-800`} > -
+
{languages.map((item, i) => ( -
+
{frameworks.map((item, i) => ( -
+
{tools.map((item, i) => ( {desc ? ( -
-
- - -
-
- {name} -
- - - {level} - + +
+
+ + +
+
+ {name} +
+ + + Experience | {level} + +
-
-

- {desc} -

-
+

+ {desc} +

+
+ ) : (
From 49a9d9aeb41834bbe71a5a731032d8321f1038f5 Mon Sep 17 00:00:00 2001 From: Hkaar Date: Wed, 23 Oct 2024 14:15:32 +0800 Subject: [PATCH 07/14] Fixed pagination --- components/Pagination/Pagination.tsx | 75 +++++++++++++++------------- 1 file changed, 40 insertions(+), 35 deletions(-) diff --git a/components/Pagination/Pagination.tsx b/components/Pagination/Pagination.tsx index 7a9db1d..290308c 100644 --- a/components/Pagination/Pagination.tsx +++ b/components/Pagination/Pagination.tsx @@ -1,24 +1,27 @@ import { twMerge } from "tailwind-merge"; import LinkButton from "../LinkButton"; -import { randomUUID } from "crypto"; interface PaginationProps extends React.HTMLAttributes { currentId: number; href: string; maxId: number; - query?: boolean + query?: boolean; } -const generateIds = (id: number, amount: number, maxId: number) => { +const generateIds = (currentId: number, maxId: number) => { const results: Array = []; + const totalDisplayed = 3; - Array(amount).keys().forEach(i => { - if ((id + i) < maxId) { - results.push(id + i); - } else { - results.push(id - i) - } - }); + let start = Math.max(1, currentId - Math.floor(totalDisplayed / 2)); + let end = Math.min(maxId, start + totalDisplayed); + + if (end === maxId) { + start = Math.max(1, maxId - totalDisplayed); + } + + for (let i = start; i < end; i++) { + results.push(i); + } return results; }; @@ -26,47 +29,49 @@ const generateIds = (id: number, amount: number, maxId: number) => { export default function Pagination( { currentId, maxId, href, query, ...props }: PaginationProps, ) { - const idList = generateIds(currentId, 5, maxId).toSorted((a, b) => a - b); + const idList = generateIds(currentId, maxId+1); return (
- {currentId > 0 - ? ( - 0 && ( + + href={`${href}${query ? "?page=" : "/"}${currentId - 1}`} + icon="mdi-light:arrow-left" + > + Previous - - ) - : null} + + + )} {idList.map((id) => ( - + {id} ))} - {currentId < maxId - ? ( - + {currentId <= maxId - 1 && ( + + Next - - ) - : null} + + + )}
); } From 74c559ee533d654072ba32bd868112f9046c3b3f Mon Sep 17 00:00:00 2001 From: Hkaar Date: Wed, 23 Oct 2024 14:15:57 +0800 Subject: [PATCH 08/14] Updated header --- components/Header/Header.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/components/Header/Header.tsx b/components/Header/Header.tsx index 3911dbe..a565be9 100644 --- a/components/Header/Header.tsx +++ b/components/Header/Header.tsx @@ -47,12 +47,12 @@ export default function Header() { -
+
Shava Jaya
@@ -63,10 +63,10 @@ export default function Header() { onClick={handleCollapse} />
- +
diff --git a/app/(main)/projects/page.tsx b/app/(main)/projects/page.tsx index 70e4cb5..77d2902 100644 --- a/app/(main)/projects/page.tsx +++ b/app/(main)/projects/page.tsx @@ -1,9 +1,16 @@ import Button from "@/components/Button"; import ProjectCard from "@/components/Card/ProjectCard"; import InputField from "@/components/InputField"; +import Pagination from "@/components/Pagination"; import { Suspense } from "react"; -export default function ProjectPage() { +interface ProjectPageProps { + searchParams: Promise<{page: number}> +} + +export default async function ProjectPage(props: ProjectPageProps) { + const searchParams = await props.searchParams; + return (
@@ -114,6 +121,10 @@ export default function ProjectPage() {
+ +
+ +
); From b8226bf2a959f2dcb0bdd6c5ed893a35f483d81f Mon Sep 17 00:00:00 2001 From: Hkaar Date: Wed, 23 Oct 2024 14:17:39 +0800 Subject: [PATCH 12/14] Added suspense for blog section in home --- app/(main)/page.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/app/(main)/page.tsx b/app/(main)/page.tsx index e315f49..7f1072e 100644 --- a/app/(main)/page.tsx +++ b/app/(main)/page.tsx @@ -6,10 +6,12 @@ import EducationSection from "@/components/EducationSection"; import ExperienceSection from "@/components/ExperienceSection"; import Hero from "@/components/Hero"; import ProjectSection from "@/components/ProjectSection"; +import BlogSectionSkeleton from "@/components/Skeletons/CardSectionSkeleton"; import SkillContainer from "@/components/SkillContainer"; import SlideLeft from "@/components/Transitions/SlideLeft"; import SlideUp from "@/components/Transitions/SlideUp"; import client from "@/lib/client"; +import { Suspense } from "react"; export default async function HomePage() { const skills = await client.fetch(`*[_type == "skill"] | order(name asc) { @@ -92,7 +94,9 @@ export default async function HomePage() {
- + }> + +
From a2668f03d11b5f87e91567c8aa3b18fa5fe05186 Mon Sep 17 00:00:00 2001 From: Hkaar Date: Wed, 23 Oct 2024 14:18:31 +0800 Subject: [PATCH 13/14] lint fix --- components/Pagination/Pagination.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/Pagination/Pagination.tsx b/components/Pagination/Pagination.tsx index 290308c..810fdf1 100644 --- a/components/Pagination/Pagination.tsx +++ b/components/Pagination/Pagination.tsx @@ -13,7 +13,7 @@ const generateIds = (currentId: number, maxId: number) => { const totalDisplayed = 3; let start = Math.max(1, currentId - Math.floor(totalDisplayed / 2)); - let end = Math.min(maxId, start + totalDisplayed); + const end = Math.min(maxId, start + totalDisplayed); if (end === maxId) { start = Math.max(1, maxId - totalDisplayed); From d69b9c4fba617074c5258160597ab04a3755f224 Mon Sep 17 00:00:00 2001 From: Hkaar Date: Wed, 23 Oct 2024 14:19:36 +0800 Subject: [PATCH 14/14] Fixed import error --- components/Skeletons/CardSectionSkeleton/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/Skeletons/CardSectionSkeleton/index.tsx b/components/Skeletons/CardSectionSkeleton/index.tsx index 05b1dac..11141f9 100644 --- a/components/Skeletons/CardSectionSkeleton/index.tsx +++ b/components/Skeletons/CardSectionSkeleton/index.tsx @@ -1 +1 @@ -export { default } from './BlogSectionSkeleton'; \ No newline at end of file +export { default } from './CardSectionSkeleton'; \ No newline at end of file