[presenterSlug].tsx

 import React from "react";
import SpeakersHeader from "@/app/presenter/[year]/SpeakersHeader";
import SpeakerContent from "@/app/presenter/[year]/[presenterSlug]/SpeakerContent";

import { getDataFromGql } from "@/lib/getDataFromGql";
import { initializeApollo } from "@/lib/apolloClient";
import { speakerQuerySp1, speakerSlugsQuery } from "@/gql/speakers/speakers";
import { Speaker, SpeakerSlug } from "@/app/common/CodeCampInterfaces";
import SpeakerHeader from "@/app/presenter/[year]/[presenterSlug]/SpeakerHeader";

initializeApollo();

async function getDataSpeaker(speakerId: number, year: string) {
  return await getDataFromGql(speakerQuerySp1, {
    year: year,
    attendeeId: speakerId,
  });
}

async function getDataSpeakerSlugs(year: string) {
  return await getDataFromGql(speakerSlugsQuery, {
    year: year,
  });
}

export default async function Page({
  params,
}: {
  params: { presenterSlug: string; year: string };
}) {
  const {
    data: { speakers: speakerSlugs },
  } = await getDataSpeakerSlugs(params.year);

  //return <div>{JSON.stringify(speakerSlugs)}</div>

  let found: boolean = false;
  let speakerId: string = "0";
  if (speakerSlugs && speakerSlugs.length > 0) {
    speakerSlugs.forEach(function (rec: SpeakerSlug) {
      if (rec?.nameSlug === params.presenterSlug) {
        found = true;
        speakerId = rec?.id.toString() ?? "0";
      }
    });
  }

  const { data: {
    speakers: speaker
  }} = found
    ? await getDataSpeaker(parseInt(speakerId), params.year)
    : undefined;

  if (!found) {
    return <div>Speaker Not Found ... {params.presenterSlug}</div>;
  }

  //return <div>{params.year} == {JSON.stringify(speaker)}</div>

  return (
    <>
      {
        // @ts-ignore
        <SpeakerHeader speaker={speaker[0]} year={params.year} />
      }
      {
        // @ts-ignore
        <SpeakerContent speaker={speaker[0]}  year={params.year}/>
      }
    </>
  );
}