chore: update dependencies and devDependencies in package.json

fix: add IconProp type for FontAwesome icons in Header and Paginator components

refactor: change string quotes from double to single in Paginator component

fix: update tsconfig.json to use react-jsx and include additional type definitions
This commit is contained in:
DerTyp7
2025-12-25 20:25:13 +01:00
parent 2594d50b09
commit 76a7ac9d83
5 changed files with 1016 additions and 452 deletions
+3 -2
View File
@@ -3,6 +3,7 @@
import logo from '@/assets/logo_text.png';
import { deleteSessionCookie } from '@/lib/actions';
import styles from '@/styles/Header.module.scss';
import type { IconProp } from '@fortawesome/fontawesome-svg-core';
import { faInstagram } from '@fortawesome/free-brands-svg-icons';
import { faEnvelope } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
@@ -74,11 +75,11 @@ export default function Header() {
)}
<div className={styles.navSocials}>
<Link className={styles.navLink} href="https://www.instagram.com/f1r3wave" target="_blank">
<FontAwesomeIcon icon={faInstagram} />
<FontAwesomeIcon icon={faInstagram as IconProp} />
</Link>
<Link className={styles.navLink} href="mailto:eric@f1r3wave.photos" target="_blank">
<FontAwesomeIcon icon={faEnvelope} />
<FontAwesomeIcon icon={faEnvelope as IconProp} />
</Link>
</div>
</nav>
+14 -12
View File
@@ -1,10 +1,11 @@
"use client";
'use client';
import styles from "@/styles/Paginator.module.scss";
import { PaginatorPosition } from "@/interfaces/paginator";
import { useRouter } from "next/navigation";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faArrowLeft, faArrowRight } from "@fortawesome/free-solid-svg-icons";
import { PaginatorPosition } from '@/interfaces/paginator';
import styles from '@/styles/Paginator.module.scss';
import { IconProp } from '@fortawesome/fontawesome-svg-core';
import { faArrowLeft, faArrowRight } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { useRouter } from 'next/navigation';
interface PaginatorProps {
page: number;
@@ -17,27 +18,28 @@ export default function Paginator({ page, totalPages, position }: PaginatorProps
if (totalPages <= 1) return null;
const setPage = (newPage: number) => {
const pathParts = window.location.pathname.split("/");
const pathParts = window.location.pathname.split('/');
pathParts[pathParts.length - 1] = newPage.toString();
const newPath = pathParts.join("/");
const newPath = pathParts.join('/');
router.push(newPath);
};
return (
<div className={`${styles.paginator} ${position === PaginatorPosition.TOP ? styles.paginatorTop : position === PaginatorPosition.BOTTOM ? styles.paginatorBottom : ""}`}>
<div
className={`${styles.paginator} ${position === PaginatorPosition.TOP ? styles.paginatorTop : position === PaginatorPosition.BOTTOM ? styles.paginatorBottom : ''}`}>
<button disabled={page === 1} onClick={() => setPage(page - 1)}>
<FontAwesomeIcon icon={faArrowLeft} />
<FontAwesomeIcon icon={faArrowLeft as IconProp} />
</button>
{Array.from({ length: totalPages }, (_, index) => (
<button key={index + 1} className={+page === index + 1 ? styles.active : ""} onClick={() => setPage(index + 1)}>
<button key={index + 1} className={+page === index + 1 ? styles.active : ''} onClick={() => setPage(index + 1)}>
{index + 1}
</button>
))}
<button disabled={page === totalPages} onClick={() => setPage(+page + 1)}>
<FontAwesomeIcon icon={faArrowRight} />
<FontAwesomeIcon icon={faArrowRight as IconProp} />
</button>
</div>
);