import { Button } from '@app/components/general/buttons' import { Link } from '@app/components/general/link' import { usePageSpeed } from '@app/data/external/pagespeed/results' import { classNames } from '@app/utils/classes' import Head from 'next/head' import { memo, useMemo } from 'react' import { GrView } from 'react-icons/gr' type CellHeaderProps = { url?: string totalIssues?: number warningCount?: number errorCount?: number domain: string online?: boolean pageInsights?: boolean duration?: number handleMainClick?(data: any, name: string, _mini: boolean, url: string): any totalTTL: number } const ListCellPagesHeaderW = ({ url = '', online, pageInsights, duration, handleMainClick, totalTTL, }: CellHeaderProps) => { const { getPageSpeed } = usePageSpeed(url, (eventData) => { if (handleMainClick) { // curry function handleMainClick(eventData, 'Lighthouse', false, url)() } }) const [u, link] = useMemo(() => { if (typeof window !== 'undefined' && url) { try { return [ url.startsWith('https://') ? url.replace('https://', '') : url.replace('http://', ''), `/website-details?url=${encodeURI(url)}`, ] } catch (e) { console.error(e) } } return ['', ''] }, [url]) const ttlPercentage = ( Math.ceil((((duration || 1) / (totalTTL || 1)) * 100) / 5) * 5 ).toFixed(0) const dynamicTTLPercentage = `w-${ttlPercentage}-after` // return a small single row of the page and issues with a dropdown return ( <>
  • {u}
    {pageInsights ? ( ) : ( 'false' )}
    {!!online || typeof online === 'undefined' ? 'true' : 'false'}
    {duration ? `${duration}ms` : 'N/A'}
    • ) } export const ListCellPagesHeader = memo(ListCellPagesHeaderW)