import Image from "next/image";
import Link from "next/link";
import React from "react";
import { useTranslations } from "next-intl";
import { getLocale } from "next-intl/server";

export const PageFooter: React.FC = async () => {

    const t = useTranslations("PageFooter");
    const locale = await getLocale();

    return(
        <div className="bg-base-100 text-base-content mt-10">
            <footer className="footer mx-auto max-w-2xl px-4 py-10">
                <div>
                    <div className="flex items-center gap-2">
                        <Image src="/icon4.png" alt="logo" width={64} height={64}></Image>
                        <div className="font-title inline-flex text-3xl font-black ml-2">Režije</div>
                    </div>
                    <p>{t('app-description')}</p>
                    <div className="flex gap-4">
                        <Link href="/" className="link link-hover">{t('links.home')}</Link>
                        <Link href={`/${locale}/privacy-policy/`} className="link link-hover">{t('links.privacy-policy')}</Link>
                        <Link href={`/${locale}/terms-of-service/`} className="link link-hover">{t('links.terms-of-service')}</Link>
                    </div>
                </div>
            </footer>
        </div>
    );
}