import Link from "next/link";
import type { CompanyInformation } from '../../types/api/company-information';
import type { SiteConfig } from '../../types/config';
import { SocialIcon } from '../elements';

interface FooterHomeProps {
    config?: SiteConfig;
    companyInformation?: CompanyInformation | null;
}

const COLUMN_TITLES = ['Home', 'Services', 'Locations', 'About Us'];

function buildSocialLinks(ci: CompanyInformation | null | undefined) {
    const links: { platform: string; url: string }[] = [];
    if (!ci) return links;
    if (ci.facebook_url) links.push({ platform: 'facebook', url: ci.facebook_url });
    if (ci.instagram_url) links.push({ platform: 'instagram', url: ci.instagram_url });
    if (ci.tiktok_url) links.push({ platform: 'tiktok', url: ci.tiktok_url });
    if (ci.linkedin_url) links.push({ platform: 'linkedin', url: ci.linkedin_url });
    if (ci.twitter_url) links.push({ platform: 'twitter', url: ci.twitter_url });
    if (ci.youtube_url) links.push({ platform: 'youtube', url: ci.youtube_url });
    if (ci.pinterest_url) links.push({ platform: 'pinterest', url: ci.pinterest_url });
    if (ci.google_my_business_url) links.push({ platform: 'google_my_business', url: ci.google_my_business_url });
    if (ci.yelp_url) links.push({ platform: 'yelp', url: ci.yelp_url });
    if (ci.tripadvisor_url) links.push({ platform: 'tripadvisor', url: ci.tripadvisor_url });
    if (ci.google_reviews_url) links.push({ platform: 'google_reviews', url: ci.google_reviews_url });
    return links;
}

export const FooterHome = ({
    config,
    companyInformation,
}: FooterHomeProps) => {
    const currentYear = new Date().getFullYear();
    
    const footerColumns = config?.navigation?.footer || [];
    const companyName = companyInformation?.company_name || '';
    const socialLinks = buildSocialLinks(companyInformation);

    return (
        <footer className="bg-primary border-t border-secondary py-12 md:py-16">
            <div className="mx-auto max-w-container px-4 md:px-8">
                <div className="grid grid-cols-1 gap-12 md:grid-cols-4">
                    {footerColumns.map((column, i) => (
                        <div key={i}>
                            <h4 className="font-body text-sm font-medium uppercase tracking-wide text-fg-primary mb-4">
                                {COLUMN_TITLES[i] || `Column ${i + 1}`}
                            </h4>
                            <ul className="space-y-2">
                                {column.map((link, j) => (
                                    <li key={j}>
                                        <Link
                                            href={link.href}
                                            className="font-body text-sm text-tertiary hover:underline"
                                        >
                                            {link.label}
                                        </Link>
                                    </li>
                                ))}
                            </ul>
                        </div>
                    ))}
                </div>

                {socialLinks.length > 0 && (
                    <div className="flex flex-wrap justify-center gap-4 mt-10">
                        {socialLinks.map(({ platform, url }) => (
                            <a
                                key={platform}
                                href={url}
                                target="_blank"
                                rel="noopener noreferrer"
                                className="text-tertiary hover:text-fg-primary transition-colors"
                                aria-label={platform}
                            >
                                <SocialIcon platform={platform} className="w-6 h-6 flex-shrink-0" />
                            </a>
                        ))}
                    </div>
                )}
                
                <div className="mt-12 pt-8 border-t border-secondary text-center">
                    <p className="font-body text-sm text-tertiary">
                        © {currentYear} {companyName || 'Company Name'}. All rights reserved.
                    </p>
                </div>
            </div>
        </footer>
    );
};

import { registerThemeVariant } from '../../lib/component-registry';
registerThemeVariant('footer-home', 'aman', FooterHome);
