rannes.dev/sw-jobs-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

hydration errors?
All checks were successful
Vercel Production Deployment / Deploy-Production (push) Successful in 1m17s
Details

Browse Source
This commit is contained in:
hook-lord 2024-12-09 10:05:17 +01:00
parent 0fef6de78a
commit 043c944b1c
4 changed files with 23 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/ITJobbank.tsx
View File

@ -36,7 +36,7 @@ export default async function ITJobbank() {
const jobs = await fetchJobs();
return (
<>
<h1 className="text-4xl my-4">IT Jobbank</h1>
<h2 className="text-4xl my-4">IT Jobbank</h2>
<p className="text-xl">
It jobbank do not optimize their images for the web, and like to use
images and videos in their job postings. This is heavily impacting the

2
src/app/_jobcard/JobCard.tsx
View File

@ -73,7 +73,7 @@ export default async function JobCard(props: { job: JobPosting }) {
</div>
</AccordionTrigger>
<AccordionContent>
<div className="flex flex-col gap-2">
<div suppressHydrationWarning className="flex flex-col gap-2">
{title.length > 50 && title}
<div className={`py-4 ${styles.parsedDescription}`}>
{parsedDescription}

18
src/app/_jobcard/ParsedDescription.tsx Normal file
View File

@ -0,0 +1,18 @@
'use client';
import parse from 'html-react-parser';
interface ParsedDescriptionProps {
description: string;
className?: string;
}
export default function ParsedDescription({ description, className }: ParsedDescriptionProps) {
const parsedDescription = parse(description);
return (
<div className={`py-4 ${className}`}>
{parsedDescription}
</div>
);
}

10
src/app/layout.tsx
View File

@ -5,6 +5,7 @@ import { cn } from "@/lib/utils";
import { Analytics } from "@vercel/analytics/react";
import giteaIcon from "/public/icons/gitea.svg";
import Image from "next/image";
import { Suspense } from "react";
const fontSans = FontSans({
subsets: ["latin"],
@ -23,13 +24,8 @@ export default function RootLayout({
}>) {
return (
<html lang="en">
<body
className={cn(
"min-h-screen bg-background font-sans antialiased",
fontSans.variable
)}
>
{children}
<body className={cn("min-h-screen bg-background font-sans antialiased", fontSans.variable)}>
<Suspense fallback={<p>Loading...</p>}>{children}</Suspense>
<Analytics />
<footer className="flex justify-center text-sm text-stone-500 py-4">
<a href="https://gitea.rannes.dev/christian">