harshapitla/stackoverflow

1{"version":3,"file":"static/js/715.43666f3e.chunk.js","mappings":"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","sources":["components/overview/KpiOverview.jsx"],"sourcesContent":["import React, { useMemo } from \"react\";\r\nimport \"./overview.css\";\r\n\r\n/* ================= KPI CARD ================= */\r\nfunction KpiCard({ icon, title, value, subtitle, accent }) {\r\n  return (\r\n    <div className={`kpi-card ${accent || \"\"}`}>\r\n      <div className=\"kpi-header\">\r\n        <span className=\"kpi-icon\">{icon}</span>\r\n        <span className=\"kpi-title\">{title}</span>\r\n      </div>\r\n      <div className=\"kpi-value\">{value}</div>\r\n      {subtitle && <div className=\"kpi-sub\">{subtitle}</div>}\r\n    </div>\r\n  );\r\n}\r\n\r\n/* ================= MAIN OVERVIEW ================= */\r\nexport default function KpiOverview({ rows = [] }) {\r\n  const metrics = useMemo(() => {\r\n    if (!rows.length) return null;\r\n\r\n    let totalFollowers = 0;\r\n    let totalReviews = 0;\r\n    let totalUsage = 0;\r\n    let totalAwards = 0;\r\n    let ratingSum = 0;\r\n    let ratingCount = 0;\r\n\r\n    const categories = new Set();\r\n\r\n    rows.forEach((r) => {\r\n      totalFollowers += r.followers_count || 0;\r\n      totalReviews += r.reviews_count || 0;\r\n      totalUsage += r.used_by_count || 0;\r\n      totalAwards += r.awards_count || 0;\r\n\r\n      if (r.rating_average && r.rating_average > 0) {\r\n        ratingSum += r.rating_average;\r\n        ratingCount += 1;\r\n      }\r\n\r\n      if (r.categories) {\r\n        String(r.categories)\r\n          .replace(/[\\[\\]\"]/g, \"\")\r\n          .split(\",\")\r\n          .map((c) => c.trim())\r\n          .filter(Boolean)\r\n          .forEach((c) => categories.add(c));\r\n      }\r\n    });\r\n\r\n    return {\r\n      totalProducts: rows.length,\r\n      totalFollowers,\r\n      totalReviews,\r\n      totalUsage,\r\n      totalAwards,\r\n      avgFollowers: totalFollowers / rows.length,\r\n      avgReviews: totalReviews / rows.length,\r\n      avgUsage: totalUsage / rows.length,\r\n      avgRating: ratingCount ? ratingSum / ratingCount : 0,\r\n      ratingCoverage: (ratingCount / rows.length) * 100,\r\n      uniqueCategories: categories.size,\r\n    };\r\n  }, [rows]);\r\n\r\n  if (!metrics) return null;\r\n\r\n  return (\r\n    <>\r\n      {/* ================= CONTEXT ================= */}\r\n      <div className=\"snapshot-banner\">\r\n        <strong>Data snapshot</strong> — based on Product Hunt marketplace data\r\n      </div>\r\n\r\n      {/* ================= KPI GRID ================= */}\r\n      <div className=\"kpi-grid\">\r\n        <KpiCard\r\n          icon=\"📦\"\r\n          title=\"Total Products\"\r\n          value={metrics.totalProducts.toLocaleString()}\r\n        />\r\n\r\n        <KpiCard\r\n          icon=\"👥\"\r\n          title=\"Total Followers\"\r\n          value={metrics.totalFollowers.toLocaleString()}\r\n        />\r\n\r\n        <KpiCard\r\n          icon=\"📝\"\r\n          title=\"Total Reviews\"\r\n          value={metrics.totalReviews.toLocaleString()}\r\n        />\r\n\r\n        <KpiCard\r\n          icon=\"🚀\"\r\n          title=\"Total Users\"\r\n          value={metrics.totalUsage.toLocaleString()}\r\n        />\r\n\r\n        <KpiCard\r\n          icon=\"🏅\"\r\n          title=\"Total Awards\"\r\n          value={metrics.totalAwards.toLocaleString()}\r\n        />\r\n\r\n        <KpiCard\r\n          icon=\"⭐\"\r\n          title=\"Avg Rating\"\r\n          value={metrics.avgRating.toFixed(1)}\r\n          subtitle={`${metrics.ratingCoverage.toFixed(1)}% products rated`}\r\n        />\r\n\r\n        <KpiCard\r\n          icon=\"📊\"\r\n          title=\"Avg Followers\"\r\n          value={metrics.avgFollowers.toFixed(0)}\r\n          subtitle=\"Per product\"\r\n        />\r\n\r\n        <KpiCard\r\n          icon=\"💬\"\r\n          title=\"Avg Reviews\"\r\n          value={metrics.avgReviews.toFixed(1)}\r\n          subtitle=\"Per product\"\r\n        />\r\n\r\n        <KpiCard\r\n          icon=\"👤\"\r\n          title=\"Avg Usage\"\r\n          value={metrics.avgUsage.toFixed(1)}\r\n          subtitle=\"Active users\"\r\n        />\r\n\r\n        <KpiCard\r\n          icon=\"🧩\"\r\n          title=\"Categories\"\r\n          value={metrics.uniqueCategories}\r\n          subtitle=\"Unique segments\"\r\n        />\r\n      </div>\r\n\r\n      {/* ================= INSIGHTS ================= */}\r\n      <div className=\"insights-box\">\r\n        <strong>Key Insights</strong>\r\n        <ul>\r\n          <li>\r\n            The dataset contains{\" \"}\r\n            <strong>{metrics.totalProducts.toLocaleString()}</strong> products,\r\n            showing a diverse and competitive Product Hunt ecosystem.\r\n          </li>\r\n          <li>\r\n            While many products attract followers, the average usage remains\r\n            significantly lower, highlighting a gap between visibility and real\r\n            adoption.\r\n          </li>\r\n          <li>\r\n            A strong average rating of{\" \"}\r\n            <strong>{metrics.avgRating.toFixed(1)}</strong> indicates generally\r\n            positive product quality across categories.\r\n          </li>\r\n          <li>\r\n            The presence of <strong>{metrics.uniqueCategories}</strong> unique\r\n            categories reflects a well-distributed innovation landscape rather\r\n            than dominance by a single segment.\r\n          </li>\r\n        </ul>\r\n      </div>\r\n    </>\r\n  );\r\n}\r\n"],"names":["KpiCard","_ref","icon","title","value","subtitle","accent","_jsxs","className","concat","children","_jsx","KpiOverview","_ref2","rows","metrics","useMemo","length","totalFollowers","totalReviews","totalUsage","totalAwards","ratingSum","ratingCount","categories","Set","forEach","r","followers_count","reviews_count","used_by_count","awards_count","rating_average","String","replace","split","map","c","trim","filter","Boolean","add","totalProducts","avgFollowers","avgReviews","avgUsage","avgRating","ratingCoverage","uniqueCategories","size","_Fragment","toLocaleString","toFixed"],"sourceRoot":""}