@pixelated-tech/components 3.3.6 → 3.4.1

package/dist/components/admin/site-health/site-health-on-site-seo.integration.js

@@ -0,0 +1,669 @@
+"use server";
+/**
+ * On-Site SEO Analysis Integration Services
+ * Server-side utilities for performing comprehensive SEO analysis on websites
+ * Note: This makes external HTTP requests and should only be used server-side
+ */
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+import puppeteer from 'puppeteer';
+import { EXCLUDED_URL_PATTERNS, EXCLUDED_FILE_EXTENSIONS, EXCLUDED_DIRECTORY_NAMES } from './seo-constants';
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const seoMetricsConfig = JSON.parse(fs.readFileSync(path.join(__dirname, 'seo-metrics.config.json'), 'utf8'));
+/**
+ * Registry of data collection functions
+ */
+const dataCollectors = {
+    collectSemanticTagsData,
+    collectTitleTagsData,
+    collectMetaKeywordsData,
+    collectMetaDescriptionsData
+};
+/**
+ * Registry of scoring functions
+ */
+const scorers = {
+    calculateSemanticTagsScore,
+    calculateTitleTagsScore,
+    calculateMetaKeywordsScore,
+    calculateMetaDescriptionsScore
+};
+/**
+ * Data collection functions
+ */
+function collectSemanticTagsData(html) {
+    const hasHeader = /<header[^>]*>/i.test(html);
+    const hasFooter = /<footer[^>]*>/i.test(html);
+    const hasNav = /<nav[^>]*>/i.test(html);
+    const hasMain = /<main[^>]*>/i.test(html);
+    const hasSection = /<section[^>]*>/i.test(html);
+    const hasArticle = /<article[^>]*>/i.test(html);
+    const hasAside = /<aside[^>]*>/i.test(html);
+    const hasFigure = /<figure[^>]*>/i.test(html);
+    const hasFigcaption = /<figcaption[^>]*>/i.test(html);
+    const hasTime = /<time[^>]*>/i.test(html);
+    const hasMark = /<mark[^>]*>/i.test(html);
+    return {
+        requiredTags: [
+            { tag: 'header', present: hasHeader },
+            { tag: 'footer', present: hasFooter },
+            { tag: 'nav', present: hasNav },
+            { tag: 'main', present: hasMain },
+            { tag: 'section', present: hasSection }
+        ],
+        optionalTags: [
+            { tag: 'article', present: hasArticle },
+            { tag: 'aside', present: hasAside },
+            { tag: 'figure', present: hasFigure },
+            { tag: 'figcaption', present: hasFigcaption },
+            { tag: 'time', present: hasTime },
+            { tag: 'mark', present: hasMark }
+        ]
+    };
+}
+function collectTitleTagsData(html, titleMatch) {
+    return {
+        content: titleMatch ? titleMatch[1].trim() : '',
+        length: titleMatch ? titleMatch[1].trim().length : 0
+    };
+}
+function collectMetaKeywordsData(html) {
+    const keywordsMatch = html.match(/<meta[^>]*name=["']keywords["'][^>]*content=["']([^"']*)["'][^>]*>/i);
+    const content = keywordsMatch ? keywordsMatch[1].trim() : '';
+    const length = content.length;
+    return {
+        content,
+        length
+    };
+}
+function collectMetaDescriptionsData(html) {
+    const descriptionMatch = html.match(/<meta[^>]*name=["']description["'][^>]*content=["']([^"']*)["'][^>]*>/i);
+    const content = descriptionMatch ? descriptionMatch[1].trim() : '';
+    const length = content.length;
+    return {
+        content,
+        length,
+        optimal: length > 0 && length <= 160
+    };
+}
+/**
+ * Generic function to analyze pattern-based metrics
+ */
+function analyzePatternMetric(html, metric) {
+    if (!metric.pattern) {
+        return { score: 0, displayValue: 'No pattern defined' };
+    }
+    const regex = new RegExp(metric.pattern, 'gi');
+    const matches = html.match(regex) || [];
+    const count = matches.length;
+    let score = 0;
+    let displayValue = '';
+    let details = undefined;
+    // Apply count logic
+    switch (metric.countLogic) {
+        case 'exact':
+            score = count === (metric.expectedCount || 1) ? 1 : 0;
+            break;
+        case 'min':
+            score = count >= (metric.expectedCount || 1) ? 1 : 0;
+            break;
+        case 'max':
+            score = count <= (metric.expectedCount || 1) ? 1 : 0;
+            break;
+        case 'or':
+            score = count > 0 ? 1 : 0;
+            break;
+        case 'count':
+        default:
+            score = count > 0 ? 1 : 0;
+            break;
+    }
+    // Apply score logic
+    if (metric.scoreLogic === 'optimal' && metric.optimalRange) {
+        const { min, max } = metric.optimalRange;
+        score = count >= min && count <= max ? 1 : 0;
+    }
+    else if (metric.scoreLogic === 'percentage') {
+        // For percentage-based scoring, we'd need additional logic
+        score = count > 0 ? 1 : 0;
+    }
+    // Generate display value
+    if (metric.displayTemplate) {
+        displayValue = metric.displayTemplate
+            .replace('{{count}}', count.toString())
+            .replace('{{matches}}', matches.length.toString());
+    }
+    else {
+        displayValue = `${count} match(es) found`;
+    }
+    // Generate details based on metric type
+    if (metric.id === 'h1-tags' || metric.id === 'h2-tags') {
+        const headings = matches.map(match => {
+            const text = match.replace(/<[^>]*>/g, '').trim();
+            return { tag: metric.id.replace('-tags', ''), text };
+        });
+        details = { items: headings };
+    }
+    else if (metric.id === 'image-alt-text') {
+        // Special logic for image alt text - check each image individually
+        const images = matches.map(match => {
+            const srcMatch = match.match(/src=["']([^"']*)["']/);
+            const altMatch = match.match(/alt=["']([^"']*)["']/);
+            return {
+                src: srcMatch ? srcMatch[1] : '',
+                alt: altMatch ? altMatch[1] : null
+            };
+        });
+        const imagesWithAlt = images.filter(img => img.alt !== null).length;
+        const totalImages = images.length;
+        score = totalImages > 0 && imagesWithAlt === totalImages ? 1 : 0;
+        displayValue = `${imagesWithAlt}/${totalImages} images have alt text`;
+        details = { items: images };
+    }
+    else if (metric.id === 'canonical-urls') {
+        const canonicalMatch = matches[0]?.match(/href=["']([^"']*)["']/);
+        const canonicalUrl = canonicalMatch ? canonicalMatch[1] : null;
+        displayValue = canonicalUrl || 'No canonical URL found';
+    }
+    else if (metric.id === 'language-tags') {
+        const langMatch = matches[0]?.match(/lang=["']([^"']*)["']/);
+        const lang = langMatch ? langMatch[1] : null;
+        displayValue = lang ? `Language: ${lang}` : 'No language tag found';
+    }
+    return { score, displayValue, details };
+}
+function calculateSemanticTagsScore(semanticData) {
+    const requiredTagsPresent = semanticData.requiredTags.filter(tag => tag.present).length;
+    const optionalTagsPresent = semanticData.optionalTags.filter(tag => tag.present).length;
+    const totalSemanticTags = requiredTagsPresent + optionalTagsPresent;
+    return {
+        score: requiredTagsPresent >= 5 ? 1 : 0,
+        displayValue: `${requiredTagsPresent}/5 required, ${optionalTagsPresent} optional (${totalSemanticTags} total)`,
+        details: {
+            items: [
+                { type: 'required', tags: semanticData.requiredTags },
+                { type: 'optional', tags: semanticData.optionalTags },
+                { type: 'summary', requiredCount: requiredTagsPresent, optionalCount: optionalTagsPresent, totalCount: totalSemanticTags }
+            ]
+        }
+    };
+}
+function calculateTitleTagsScore(titleData) {
+    const score = titleData.length > 0 && titleData.length <= 60 ? 1 : 0;
+    const displayValue = titleData.content || 'No title tag found';
+    return {
+        score,
+        displayValue,
+        details: {
+            items: [
+                { type: 'title', content: titleData.content, length: titleData.length, optimal: titleData.length > 0 && titleData.length <= 60 }
+            ]
+        }
+    };
+}
+function calculateMetaKeywordsScore(keywordsData) {
+    const score = keywordsData.length > 0 ? 1 : 0;
+    const displayValue = keywordsData.content || 'No meta keywords found';
+    return {
+        score,
+        displayValue,
+        details: {
+            items: [
+                { type: 'keywords', content: keywordsData.content, length: keywordsData.length, present: keywordsData.length > 0 }
+            ]
+        }
+    };
+}
+function calculateMetaDescriptionsScore(descriptionData) {
+    const score = descriptionData.optimal ? 1 : 0;
+    const displayValue = descriptionData.content || 'No meta description found';
+    return {
+        score,
+        displayValue,
+        details: {
+            items: [
+                { type: 'description', content: descriptionData.content, length: descriptionData.length, optimal: descriptionData.optimal }
+            ]
+        }
+    };
+}
+/**
+ * Crawl the site to discover internal pages
+ */
+async function crawlSite(baseUrl, maxPages = 10) {
+    const visited = new Set();
+    const toVisit = [baseUrl];
+    const discovered = [];
+    try {
+        // Parse base URL for domain matching
+        const baseUrlObj = new URL(baseUrl);
+        const baseDomain = baseUrlObj.hostname;
+        while (toVisit.length > 0 && discovered.length < maxPages) {
+            const currentUrl = toVisit.shift();
+            if (visited.has(currentUrl))
+                continue;
+            visited.add(currentUrl);
+            discovered.push(currentUrl);
+            try {
+                const response = await fetch(currentUrl, {
+                    headers: { 'User-Agent': 'Mozilla/5.0 (compatible; SEO Analysis Bot)' }
+                });
+                if (!response.ok)
+                    continue;
+                const html = await response.text();
+                // Extract internal links
+                const linkRegex = /<a[^>]*href=["']([^"']*)["'][^>]*>/gi;
+                let match;
+                while ((match = linkRegex.exec(html)) !== null) {
+                    try {
+                        const href = match[1];
+                        const absoluteUrl = new URL(href, currentUrl).toString();
+                        // Only include same domain links that look like pages
+                        const urlObj = new URL(absoluteUrl);
+                        const pathname = urlObj.pathname.toLowerCase();
+                        // Exclude common non-page directories and files
+                        const isExcluded = EXCLUDED_URL_PATTERNS.some(pattern => pathname.includes(pattern)) ||
+                            pathname.match(EXCLUDED_FILE_EXTENSIONS) ||
+                            EXCLUDED_DIRECTORY_NAMES.some(dir => pathname.endsWith(`/${dir}`));
+                        if (urlObj.hostname === baseDomain && !visited.has(absoluteUrl) && !toVisit.includes(absoluteUrl) && !isExcluded) {
+                            toVisit.push(absoluteUrl);
+                        }
+                    }
+                    catch {
+                        // Invalid URL, skip
+                    }
+                }
+            }
+            catch (error) {
+                console.warn(`Failed to crawl ${currentUrl}:`, error);
+            }
+        }
+    }
+    catch (error) {
+        console.warn('Error during site crawling:', error);
+    }
+    return discovered.slice(0, maxPages);
+}
+/**
+ * Analyze a single page for on-page SEO elements using Puppeteer for full rendering
+ */
+async function analyzeSinglePage(url) {
+    let browser;
+    try {
+        // Reuse browser instance if available, otherwise create new one
+        browser = globalThis.__seoBrowser;
+        if (!browser || browser.isConnected() === false) {
+            browser = await puppeteer.launch({
+                headless: true,
+                args: [
+                    '--no-sandbox',
+                    '--disable-setuid-sandbox',
+                    '--disable-dev-shm-usage',
+                    '--disable-accelerated-2d-canvas',
+                    '--no-first-run',
+                    '--no-zygote',
+                    '--disable-gpu',
+                    '--disable-web-security',
+                    '--disable-features=VizDisplayCompositor',
+                    '--disable-extensions',
+                    '--disable-plugins',
+                    '--disable-default-apps',
+                    '--disable-background-timer-throttling',
+                    '--disable-backgrounding-occluded-windows',
+                    '--disable-renderer-backgrounding'
+                ]
+            });
+            globalThis.__seoBrowser = browser;
+        }
+        const page = await browser.newPage();
+        // Block unnecessary resources for faster loading while preserving SEO-relevant content
+        await page.setRequestInterception(true);
+        page.on('request', (request) => {
+            const resourceType = request.resourceType();
+            const url = request.url();
+            // Block heavy resources that slow down loading but aren't needed for HTML structure
+            if (resourceType === 'image' ||
+                resourceType === 'media' ||
+                url.includes('.jpg') ||
+                url.includes('.jpeg') ||
+                url.includes('.png') ||
+                url.includes('.gif') ||
+                url.includes('.webp') ||
+                url.includes('google-analytics.com') ||
+                url.includes('googletagmanager.com') ||
+                url.includes('facebook.com/tr') ||
+                url.includes('doubleclick.net')) {
+                request.abort();
+            }
+            else {
+                request.continue();
+            }
+        });
+        // Set smaller viewport for faster rendering
+        await page.setViewport({ width: 800, height: 600 });
+        // Set user agent to avoid bot detection
+        await page.setUserAgent('Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36');
+        // Navigate to the page with faster waiting strategy
+        const response = await page.goto(url, {
+            waitUntil: 'domcontentloaded', // Wait for DOM instead of all network requests
+            timeout: 15000 // Reduced timeout
+        });
+        // Wait for H1 elements to be rendered (if any) with a short timeout
+        try {
+            await page.waitForSelector('h1', { timeout: 2000 });
+        }
+        catch {
+            // H1 not found within timeout, continue anyway
+        }
+        // Get title and heading counts directly from DOM for speed
+        const pageData = await page.evaluate(() => {
+            return {
+                title: document.title,
+                h1Count: document.querySelectorAll('h1').length,
+                h2Count: document.querySelectorAll('h2').length,
+                h1Elements: Array.from(document.querySelectorAll('h1')).map(h1 => ({
+                    text: h1.textContent?.trim() || ''
+                })),
+                h2Elements: Array.from(document.querySelectorAll('h2')).map(h2 => ({
+                    text: h2.textContent?.trim() || ''
+                }))
+            };
+        });
+        // Get the rendered HTML for other pattern-based checks
+        const html = await page.content();
+        await page.close();
+        const audits = [];
+        // Process on-page metrics from configuration
+        const config = seoMetricsConfig;
+        const onPageCategory = config.categories['on-page'];
+        for (const metric of Object.values(onPageCategory.metrics)) {
+            let score = 0;
+            let displayValue = '';
+            let details = undefined;
+            // Use data collector and scorer if available
+            if (metric.dataCollector && metric.scorer) {
+                const collector = dataCollectors[metric.dataCollector];
+                const scorer = scorers[metric.scorer];
+                if (collector && scorer) {
+                    const rawData = collector(html, pageData.title);
+                    const result = scorer(rawData);
+                    score = result.score;
+                    displayValue = result.displayValue;
+                    details = result.details;
+                }
+            }
+            else if (metric.pattern) {
+                // Use pattern-based analysis
+                const result = analyzePatternMetric(html, metric);
+                score = result.score;
+                displayValue = result.displayValue;
+                details = result.details;
+            }
+            // Override H1 and H2 results with direct DOM counts for accuracy and speed
+            if (metric.id === 'h1-tags') {
+                score = pageData.h1Count === (metric.expectedCount || 1) ? 1 : 0;
+                displayValue = `${pageData.h1Count} H1 tag(s) found`;
+                details = { items: pageData.h1Elements.map((h1) => ({ tag: 'h1', text: h1.text })) };
+            }
+            else if (metric.id === 'h2-tags') {
+                score = pageData.h2Count > 0 ? 1 : 0;
+                displayValue = `${pageData.h2Count} H2 tag(s) found`;
+                details = { items: pageData.h2Elements.map((h2) => ({ tag: 'h2', text: h2.text })) };
+            }
+            audits.push({
+                id: metric.id,
+                title: metric.title,
+                score,
+                scoreDisplayMode: metric.scoreDisplayMode,
+                displayValue,
+                category: 'on-page',
+                details
+            });
+        }
+        return {
+            url,
+            title: pageData.title,
+            statusCode: response.status(),
+            audits,
+            crawledAt: new Date().toISOString()
+        };
+    }
+    catch (error) {
+        console.warn(`Failed to analyze ${url}:`, error);
+        // Return a basic analysis for failed requests
+        return {
+            url,
+            title: undefined,
+            statusCode: 0, // Indicates analysis failed
+            audits: [],
+            crawledAt: new Date().toISOString()
+        };
+    }
+    finally {
+        if (browser) {
+            await browser.close();
+        }
+    }
+}
+async function performSiteWideAudits(baseUrl) {
+    const audits = [];
+    try {
+        // Parse base URL
+        const baseUrlObj = new URL(baseUrl);
+        const baseDomain = baseUrlObj.hostname;
+        const protocol = baseUrlObj.protocol;
+        // Process on-site metrics from configuration
+        const config = seoMetricsConfig;
+        const onSiteCategory = config.categories['on-site'];
+        for (const metric of Object.values(onSiteCategory.metrics)) {
+            let score = 0;
+            let displayValue = '';
+            // Handle metrics without custom collectors/scorers
+            switch (metric.id) {
+                case 'https':
+                    score = protocol === 'https:' ? 1 : 0;
+                    displayValue = score ? 'Site uses HTTPS' : 'Site does not use HTTPS';
+                    break;
+                case 'url-structure': {
+                    const hasQueryParams = baseUrlObj.search.length > 0;
+                    score = hasQueryParams ? 0 : 1;
+                    displayValue = score ? 'Clean URL structure' : 'URL contains query parameters';
+                    break;
+                }
+                case 'robots-txt':
+                    try {
+                        const robotsUrl = `${protocol}//${baseDomain}/robots.txt`;
+                        const robotsResponse = await fetch(robotsUrl);
+                        score = robotsResponse.ok ? 1 : 0;
+                        displayValue = score ? 'Robots.txt accessible' : 'Robots.txt not found or inaccessible';
+                    }
+                    catch {
+                        score = 0;
+                        displayValue = 'Robots.txt not accessible';
+                    }
+                    break;
+                case 'sitemap-xml':
+                    try {
+                        const sitemapUrl = `${protocol}//${baseDomain}/sitemap.xml`;
+                        const sitemapResponse = await fetch(sitemapUrl);
+                        score = sitemapResponse.ok ? 1 : 0;
+                        displayValue = score ? 'Sitemap.xml accessible' : 'Sitemap.xml not found or inaccessible';
+                    }
+                    catch {
+                        score = 0;
+                        displayValue = 'Sitemap.xml not accessible';
+                    }
+                    break;
+                case 'internal-linking':
+                    score = 1; // Placeholder - would need full crawl analysis
+                    displayValue = 'Internal links found during crawl';
+                    break;
+                case 'navigation':
+                    score = 1; // Placeholder - would need content analysis
+                    displayValue = 'Navigation structure found';
+                    break;
+                case 'broken-links':
+                    score = 1; // Placeholder - would need comprehensive link checking
+                    displayValue = 'No obvious broken links detected';
+                    break;
+                case 'manifest-file':
+                    try {
+                        const manifestUrl = `${protocol}//${baseDomain}/manifest.webmanifest`;
+                        const manifestResponse = await fetch(manifestUrl);
+                        score = manifestResponse.ok ? 1 : 0;
+                        displayValue = score ? 'Manifest.webmanifest accessible' : 'Manifest.webmanifest not found or inaccessible';
+                    }
+                    catch {
+                        score = 0;
+                        displayValue = 'Manifest.webmanifest not accessible';
+                    }
+                    break;
+                default:
+                    score = 0;
+                    displayValue = 'Not implemented';
+            }
+            audits.push({
+                id: metric.id,
+                title: metric.title,
+                score,
+                scoreDisplayMode: metric.scoreDisplayMode,
+                displayValue,
+                category: 'on-site'
+            });
+        }
+    }
+    catch (error) {
+        console.error('Error performing site-wide audits:', error);
+    }
+    return audits;
+}
+/**
+ * Fetch and parse sitemap.xml to get all site URLs
+ */
+async function getUrlsFromSitemap(baseUrl) {
+    try {
+        const sitemapUrl = `${baseUrl}/sitemap.xml`;
+        const response = await fetch(sitemapUrl);
+        if (!response.ok) {
+            throw new Error(`Failed to fetch sitemap: ${response.status}`);
+        }
+        const xmlText = await response.text();
+        const baseUrlObj = new URL(baseUrl);
+        // Simple XML parsing to extract URLs
+        const urlRegex = /<loc>([^<]+)<\/loc>/g;
+        const urls = [];
+        let match;
+        while ((match = urlRegex.exec(xmlText)) !== null) {
+            const url = match[1].trim();
+            // Only include URLs from the same domain and that look like valid page URLs
+            try {
+                const urlObj = new URL(url);
+                if (urlObj.hostname === baseUrlObj.hostname) {
+                    const pathname = urlObj.pathname.toLowerCase();
+                    // Exclude common non-page directories and files
+                    const isExcluded = EXCLUDED_URL_PATTERNS.some(pattern => pathname.includes(pattern)) ||
+                        pathname.match(EXCLUDED_FILE_EXTENSIONS) ||
+                        EXCLUDED_DIRECTORY_NAMES.some(dir => pathname.endsWith(`/${dir}`));
+                    if (!isExcluded) {
+                        urls.push(url);
+                    }
+                }
+            }
+            catch {
+                // Invalid URL, skip
+            }
+        }
+        return urls.slice(0, 20); // Limit to 20 pages to prevent excessive analysis
+    }
+    catch (error) {
+        console.warn('Failed to fetch sitemap:', error);
+        return [];
+    }
+}
+/**
+ * Main function to perform comprehensive on-site SEO analysis
+ */
+export async function performOnSiteSEOAnalysis(baseUrl) {
+    try {
+        let pagesToAnalyze = [];
+        // Try to get URLs from sitemap first
+        const sitemapUrls = await getUrlsFromSitemap(baseUrl);
+        if (sitemapUrls.length > 0) {
+            pagesToAnalyze = sitemapUrls;
+        }
+        else {
+            // Fallback to crawling if sitemap not available
+            pagesToAnalyze = await crawlSite(baseUrl, 5);
+        }
+        if (pagesToAnalyze.length === 0) {
+            return {
+                site: baseUrl,
+                url: baseUrl,
+                overallScore: null,
+                pagesAnalyzed: [],
+                onSiteAudits: [],
+                totalPages: 0,
+                timestamp: new Date().toISOString(),
+                status: 'error',
+                error: 'No pages could be analyzed'
+            };
+        }
+        // Analyze each page
+        const pagesAnalyzed = [];
+        for (const pageUrl of pagesToAnalyze) {
+            try {
+                const pageAnalysis = await analyzeSinglePage(pageUrl);
+                pagesAnalyzed.push(pageAnalysis);
+            }
+            catch (error) {
+                console.warn(`Failed to analyze ${pageUrl}:`, error);
+            }
+        }
+        // Perform site-wide audits
+        const onSiteAudits = await performSiteWideAudits(baseUrl);
+        // Calculate overall score (simplified - average of all page scores)
+        let totalScore = 0;
+        let totalAudits = 0;
+        for (const page of pagesAnalyzed) {
+            for (const audit of page.audits) {
+                if (audit.score !== null) {
+                    totalScore += audit.score;
+                    totalAudits++;
+                }
+            }
+        }
+        for (const audit of onSiteAudits) {
+            if (audit.score !== null) {
+                totalScore += audit.score;
+                totalAudits++;
+            }
+        }
+        const overallScore = totalAudits > 0 ? Math.round((totalScore / totalAudits) * 100) / 100 : null;
+        return {
+            site: baseUrl,
+            url: baseUrl,
+            overallScore,
+            pagesAnalyzed,
+            onSiteAudits,
+            totalPages: pagesAnalyzed.length,
+            timestamp: new Date().toISOString(),
+            status: 'success'
+        };
+    }
+    catch (error) {
+        console.error('Error performing on-site SEO analysis:', error);
+        return {
+            site: baseUrl,
+            url: baseUrl,
+            overallScore: null,
+            pagesAnalyzed: [],
+            onSiteAudits: [],
+            totalPages: 0,
+            timestamp: new Date().toISOString(),
+            status: 'error',
+            error: error instanceof Error ? error.message : 'Unknown error'
+        };
+    }
+}