improve not found for service

yoga-app/src/app/page.tsx

@@ -16,8 +16,6 @@ import webApi from "@/api/web-client/web-api";
 export default async function Home() {
         const pageData = await webApi.getHomePage();
 
-        console.info(JSON.stringify(pageData))
-
         const {
                 header,
                 ourServices,

yoga-app/src/app/services/[slug]/not-found.tsx

@@ -0,0 +1,11 @@
+import Link from 'next/link'
+
+export default function NotFound() {
+    return (
+        <div>
+            <h2>Nem található</h2>
+            <p>Could not find requested resource</p>
+            <Link href="/">Vissza a kezdőoldalra</Link>
+        </div>
+    )
+}

yoga-app/src/app/services/[slug]/page.tsx

@@ -8,6 +8,7 @@ import AosComponent from "@/components/aos.component";
 import styles from './page.module.css'
 import NextBlocksRenderer from "@/components/next.blocks.renderer";
 import clsx from "clsx";
+import {notFound} from "next/navigation";
 
 const rewriteStrapiImageUrlToNextImageUrl = (content: BlocksContent) =>{
     console.info("content", content);
@@ -25,14 +26,18 @@ export default async function ServiceArticlePage({params}: {
     params: Promise<{ slug: string }>
 }) {
     const {slug} = await params
-    const {footer, subscribeNow} = await strapiApi.getServicePage();
+
+    const servicePage = await strapiApi.getServicePage();
+    if (!servicePage) {
+        return notFound()
+    }
+    const {subscribeNow, footer} = servicePage;
     const servicesByName = await strapiApi.getService(slug);
+    if (!servicesByName || servicesByName.length === 0) {
+        return notFound();
+    }
     const selectedService = servicesByName[0];
-    console.info("selectedService",selectedService);
     const article: BlocksContent = rewriteStrapiImageUrlToNextImageUrl( selectedService.article);
-    console.info(article);
-
-
 
     return (
         <>

yoga-app/src/components/our.services.item.component.tsx

@@ -9,11 +9,12 @@ export interface Props {
     config: YogaSingleService_Plain
 }
 
-const OurServiceItemComponent = ({config: {header,description,image}}: Props) => {
+const OurServiceItemComponent = ({config: {header,description,image,name}}: Props) => {
     const imageFile: StrapiFile = image as StrapiFile;
     if (!imageFile || !imageFile.url) {
         return null
     }
+    const path = '/services/' + name;
     return (
 
         <div className={styles.serviceSlide}>
@@ -28,7 +29,7 @@ const OurServiceItemComponent = ({config: {header,description,image}}: Props) =>
                     <h3>{header}</h3>
                     <p>{description}</p>
                     <div className="btn_wrapper">
-                        <Link href="/services" className="text-decoration-none"><i
+                        <Link href={path} className="text-decoration-none"><i
                             className="fa-solid fa-arrow-right" aria-hidden="true"></i></Link>
                     </div>
                 </div>