import { useEffect, useState } from "react";
import { useParams } from "react-router-dom";
import { TProfileData, TProfileResponse } from "../../types/profile.ts";
import { ContentLoader } from "../../components/mini/loaders/ContentLoader.tsx";
import { WarningAlert } from "../../components/mini/alerts/Warning.tsx";
import { ProfileCard } from "../../components/pages/profile/Profile.tsx";
import { useTranslation } from "react-i18next";
import { PageTitle } from "../../components/mini/util/PageTitle.tsx";

export const Profile = () =>
{
    const { id } = useParams();


    const [ error, setError ] = useState<0 | 1 | 2 | 3>(0);
    const [ data, setData ] = useState<TProfileData>(undefined!);

    useEffect(() =>
    {
        fetch(`${ import.meta.env.VITE_API_URL }/profiles/${ id }`).then(x => x.json()).then((data: TProfileResponse) =>
        {
            switch (data.code)
            {
                case 404:
                    setError(2);
                    break;
                case 403:
                    setError(3);
                    break;
                case 200:
                    setError(1);
                    setData(data.data);
                    break;
            }
        });
    }, []);

    const { t } = useTranslation();

    return (
        <>
            {/* LOADING */ }
            { error === 0 && <ContentLoader/> }
            {/* NOT FOUND */ }
            { error === 2 && <PageTitle title={ `simrail.alekswilc.dev | Profile not found` }/> }
            { error === 2 && <WarningAlert title={ t("profile.errors.notfound.title") }
                                           description={ t("profile.errors.notfound.description") }/> }
            {/* BLACKLISTED PROFILE */ }
            { error === 3 && <PageTitle title={ `simrail.alekswilc.dev | Blacklisted profile` }/> }
            { error === 3 && <WarningAlert title={ t("profile.errors.blacklist.title") }
                                           description={ t("profile.errors.blacklist.description") }/> }
            {/* SUCCESS */ }
            { error === 1 && <PageTitle title={ `simrail.alekswilc.dev | ${ data.steam.personname }'s profile` }/> }
            { error === 1 && <ProfileCard data={ data }/> }
        </>
    );
};