import Image from 'next/image'
import { redirect } from 'next/navigation'
import { Button } from '@/components/ui/button'
import Link from 'next/link';

interface routeParamsProps {
  params: {
    id: string
  }
}

interface ResultProps {
  id: string
  user_id: string
  emotion: string
}

  async function getUserExists(id: string): Promise<ResultProps> {
    try {
    const response = await fetch(`http://moodscan.com.br/api/results/${id}`)

    const userCheck = await response.json()

    return userCheck
    } catch (error) {
      console.log(error);
      redirect('/')
    }
  }



export default async function Result({ params }: routeParamsProps) {
  if (!params.id) {
    redirect('/')
  }

  const result = await getUserExists(params.id)
  let perfil = ""; 
  let perfilIcon = "";

  

  switch (result.emotion){
      case '1':
        perfil = "Sustentabilidade"
        perfilIcon = "/icon-sustentabilidade.png"
      break;
      case '2':
        perfil = "Inovador"
        perfilIcon = "/icon-inovador.png"
      break
      case '3':
        perfil = "Influencer"
        perfilIcon = "/icon-influencer.png"
      break
      case '4':
        perfil = "Segurança"
        perfilIcon = "/icon-seguranca.png"
      break
      case '5':
        perfil = "Voluntário"
        perfilIcon = "/icon-voluntario.png"
      break
      default:
  }

 
  return (
    <main className="max-w-lg w-full h-screen mx-auto justify-center items-center flex flex-col gap-10">
      <Image
        className="w-48"
        src='/totalenergies-logo.png'
        alt="Total Energies Brasil"
        width={400}
        height={400}
        quality={100}
      />
      <div className="bg-red-50 border-2 flex flex-col justify-center items-center border-[#dc3545] rounded-lg shadow-xl  p-12 pt-4">

      <Image
        className="w-288"
        src={perfilIcon}
        alt="Perfil Inovador"
        width={288}
        height={288}
        quality={100}
      />
     
        <p className="mt-6 items-center">
          De acordo com suas reações durante cada vídeo, nosso algoritmo entendeu que você se identificou mais com o perfil {perfil}. 
        </p>
        <Button
              className={`w-full mt-6 bg-[#dc3545] font-bold gap-3 hover:bg-red-800 `}
            >
               <Link href="/">
            Voltar ao início
            </Link>
              
        </Button>
      </div>
    </main>
  )
}