'use client'; import { DealerInfo } from '@/types/dealer'; import Image from 'next/image'; import { DealerScripts } from '@/components/DealerScripts'; import { HeroSlider } from '@/components/HeroSlider'; import { QuickLinks } from './QuickLinks'; import { MobileNav } from './MobileNav'; import ContactSection from '@/app/components/contact-section'; import { resolveAmsoilLink, isAmsoilUrl, appendZoParam, getEffectiveLinkDomain, } from '@/lib/amsoil-link-resolver'; import { AMSOIL_LINKS } from '@/lib/amsoil-links'; import { getDealerOrigin } from '@/lib/seo-utils'; import { MapPin, Phone } from 'lucide-react'; import { formatPhoneForDisplay, formatPhoneForTel } from '@/lib/phone-utils'; import { createDefaultSliderContent } from '@/types/slider'; import { sanitizeHtmlRelaxedWithSecureLinks } from '@/lib/cms/sanitize-client'; import { useLanguage } from './LanguageProvider'; import { LanguageSwitcher } from './LanguageSwitcher'; import { t } from '@/lib/translations/dealer-template'; /** * Generate JSON-LD schema for dealer page based on MetaSchemaPlan.txt * Uses getEffectiveLinkDomain to resolve the correct AMSOIL brand URL for US vs Canadian dealers */ export function generateDealerSchema(dealer: DealerInfo): object { // Build the dealer's bare origin via the shared helper so shopamsoil vs // myamsoil dealers emit correct structured-data @id / url values. Previously // this hardcoded "myamsoil", which pointed shopamsoil dealers at their sibling's // site in Google/Bing knowledge graphs. // getDealerOrigin returns no trailing slash: the `url` fields below use it as-is // to match the no-slash canonical Next.js renders, and `${pageUrl}/#localbusiness` // fragment @id values can't produce double slashes. const pageUrl = getDealerOrigin({ subdomain: dealer.subdomain, domain: dealer.domain, domainPrefix: dealer.domainPrefix, }); const pageName = `AMSOIL Synthetic Oil in ${dealer.address.city}, ${dealer.address.state} | ${dealer.name}`; // AMSOIL base URL (resolved for effective link domain) const linkDomain = getEffectiveLinkDomain(dealer.domain, dealer.amsoilLinkDomain); const amsoilBase = linkDomain === 'ca' ? 'https://amsoil.ca' : 'https://www.amsoil.com'; // Only surface the dealer's named contact when they opted to show it publicly. const showDealer = Boolean(dealer.showContactName && dealer.contactName); return { '@context': 'https://schema.org', '@graph': [ { '@type': 'AutoPartsStore', '@id': `${pageUrl}/#localbusiness`, name: `${dealer.name}, Authorized AMSOIL Dealer`, description: `Authorized Independent AMSOIL Dealer specializing in premium AMSOIL synthetic lubricants and filters in ${dealer.address.city}, ${dealer.address.state}.`, // Disambiguates this independent dealer from AMSOIL INC. in the entity graph. disambiguatingDescription: `Independent, authorized AMSOIL dealer based in ${dealer.address.city}, ${dealer.address.state}.`, url: pageUrl, telephone: dealer.phone, ...(dealer.email ? { email: dealer.email } : {}), image: `${pageUrl}/og`, priceRange: '$-$$$', // Topics linked to their canonical Wikipedia entities for entity grounding. knowsAbout: [ { '@type': 'Thing', name: 'Synthetic oil', sameAs: 'https://en.wikipedia.org/wiki/Synthetic_oil', }, { '@type': 'Thing', name: 'Motor oil', sameAs: 'https://en.wikipedia.org/wiki/Motor_oil', }, { '@type': 'Thing', name: 'Lubricant', sameAs: 'https://en.wikipedia.org/wiki/Lubricant', }, { '@type': 'Thing', name: 'Grease', sameAs: 'https://en.wikipedia.org/wiki/Grease_(lubricant)', }, { '@type': 'Thing', name: 'Oil filter', sameAs: 'https://en.wikipedia.org/wiki/Oil_filter', }, { '@type': 'Thing', name: 'Air filter', sameAs: 'https://en.wikipedia.org/wiki/Air_filter', }, { '@type': 'Thing', name: 'Fuel filter', sameAs: 'https://en.wikipedia.org/wiki/Fuel_filter', }, ], ...(dealer.logoUrl ? { logo: dealer.logoUrl } : {}), ...(dealer.address.city && dealer.address.state ? { hasMap: `https://www.google.com/maps/search/?api=1&query=${encodeURIComponent( dealer.hideAddress ? `${dealer.address.city}, ${dealer.address.state} ${dealer.address.zip}` : `${dealer.address.street ? dealer.address.street + ', ' : ''}${dealer.address.city}, ${dealer.address.state} ${dealer.address.zip}` )}`, } : {}), ...(() => { const links = dealer.socialLinks; if (!links) return {}; const urls = [ links.facebook, links.instagram, links.youtube, links.pinterest, links.linkedin, links.x || links.twitter, ].filter((v): v is string => Boolean(v)); return urls.length > 0 ? { sameAs: urls } : {}; })(), // Authorized-dealer status as a credential AMSOIL recognizes (not brand ownership). hasCredential: { '@type': 'EducationalOccupationalCredential', name: 'Authorized AMSOIL Dealer', credentialCategory: 'Authorized Dealer', recognizedBy: { '@id': `${amsoilBase}/#organization` }, }, ...(showDealer ? { founder: { '@id': `${pageUrl}/#dealer` } } : {}), address: { '@type': 'PostalAddress', ...(!dealer.hideAddress && dealer.address.street ? { streetAddress: dealer.address.street } : {}), addressLocality: dealer.address.city, addressRegion: dealer.address.state, postalCode: dealer.address.zip, addressCountry: dealer.address.country === 'Canada' ? 'CA' : 'US', }, }, { '@type': 'Organization', '@id': `${amsoilBase}/#organization`, name: 'AMSOIL INC.', url: `${amsoilBase}/`, }, { '@type': 'WebSite', '@id': `${pageUrl}/#website`, url: pageUrl, name: dealer.name, publisher: { '@id': `${pageUrl}/#localbusiness`, }, }, { '@type': 'WebPage', '@id': `${pageUrl}/#webpage`, url: pageUrl, name: pageName, isPartOf: { '@id': `${pageUrl}/#website`, }, about: { '@id': `${pageUrl}/#localbusiness`, }, }, // The named contact is the dealer or their authorized rep; emit as the business founder. ...(showDealer ? [ { '@type': 'Person', '@id': `${pageUrl}/#dealer`, name: dealer.contactName, jobTitle: 'Authorized AMSOIL Dealer', worksFor: { '@id': `${pageUrl}/#localbusiness` }, }, ] : []), ], }; } /** * DEALER PAGE TEMPLATE - Wireframe Version (Updated for New Design) * * DESIGN SOURCE: Figma landing page design approved by AMSOIL * STATUS: Wireframe only - NO STYLING (awaiting design refresh completion) * * STRUCTURE: 9 sections based on new Figma design: * 1. Split 2-row header (dealer info in top row) * 2. Hero slider section with CTA * 3. Product categories (FIND YOUR PRODUCTS) * 4. Featured products (THREE TIERS OF PREMIUM PERFORMANCE) * 5. Request catalog (2-column blue section) * 6. Dealer info section (2-column with dynamic dealer data) * 7. Preferred customer CTA (4 benefits + CTA) * 8. Pick a category grid (8 product category cards) * 9. Footer (dealer contact info in right column) * * DYNAMIC DATA LOCATIONS: * - Header row 1: location (city, state) + phone * - Header row 2: dealer name * - Dealer Info section: name, description/bio * - Footer: name, address, phone, email * * TODO: Future Implementation Plan * ================================ * - Called from app/page.tsx with subdomain extraction * - Dealer data fetched from database using subdomain * - Apply final design styling once design refresh is complete * * @param dealer - Dealer information object with name, contact, and address */ interface DealerTemplateProps { dealer: DealerInfo; dealerNumber?: string; leadFormEnabled?: boolean; turnstileSiteKey?: string | null; allowLanguageSwitch?: boolean; } export function DealerTemplate({ dealer, dealerNumber, leadFormEnabled = true, turnstileSiteKey, allowLanguageSwitch = true, }: DealerTemplateProps) { // Get language from context const { language } = useLanguage(); // Helper to get resolved AMSOIL links with ZO number (URL-encoded for safety) const zoNumber = encodeURIComponent(dealerNumber || '101'); const linkDomain = getEffectiveLinkDomain(dealer.domain, dealer.amsoilLinkDomain); const getLink = (key: keyof typeof AMSOIL_LINKS): string => { const resolvedUrl = resolveAmsoilLink(AMSOIL_LINKS[key], linkDomain); return appendZoParam(resolvedUrl, zoNumber); }; // Helper to resolve navigation hrefs for Canadian dealers and add ZO parameter const resolveNavHref = (href: string | null): string | null => { if (!href) return null; if (isAmsoilUrl(href)) { // Resolve for correct domain (US vs CA). Links already on amsoil.ca // (e.g., a Canadian dealer's custom nav link) skip domain resolution // but still get ZO appended for attribution tracking. const resolvedUrl = href.includes('amsoil.com') ? resolveAmsoilLink(href, linkDomain) : href; return appendZoParam(resolvedUrl, zoNumber); } return href; }; // Helper to resolve slider content URLs for Canadian dealers const resolveSliderContent = () => { const rawContent = dealer.heroSlider && dealer.heroSlider.slides && dealer.heroSlider.slides.length > 0 ? dealer.heroSlider : createDefaultSliderContent(dealerNumber); // Transform slide button URLs for correct region (US vs CA) // Filter to only active slides (slides without `active` field default to active) return { ...rawContent, slides: rawContent.slides .filter((slide) => slide.active !== false) .map((slide) => ({ ...slide, button: { ...slide.button, url: slide.button.url ? (resolveNavHref(slide.button.url) ?? slide.button.url) : '', }, })), }; }; return (
{/* ==================== DEALER SCRIPTS (GTM, Analytics, etc.) ==================== */} {/* Uses next/script with afterInteractive strategy - properly integrates with Next.js */} {/* JSON-LD Schema for SEO */}