"use client";
import React from "react";
import CompanyAnalytics from "./CompanyAnalytics";
import type { CompanyRow } from "@/lib/api/types/company.types";

interface Props {
  companies: CompanyRow[];  // ALL companies (not current page)
  cityFilter?: string;
  standardFilter?: string;
  monthFilter?: string;     // ✅ added
}

export default function CompanyAnalyticsInline({
  companies,
  cityFilter,
  standardFilter,
  monthFilter,
}: Props) {
  return (
    <div style={{ marginBottom: "20px", padding: "16px", backgroundColor: "#f0fdfa", borderRadius: "12px", border: "1px solid #99f6e4" }}>
      <div style={{ display: "flex", alignItems: "center", gap: "8px", marginBottom: "16px" }}>
        <span style={{ fontSize: "16px" }}>📊</span>
        <h2 style={{ margin: 0, fontSize: "14px", fontWeight: 700, color: "#0f766e" }}>Company Analytics</h2>
        <span style={{ marginLeft: "auto", fontSize: "12px", color: "#6b7280" }}>
          {companies.length.toLocaleString()} companies loaded
        </span>
      </div>
      <CompanyAnalytics
        companies={companies}
        cityFilter={cityFilter}
        standardFilter={standardFilter}
        monthFilter={monthFilter}
      />
    </div>
  );
}