import { HoraRow } from "@/app/lib/panchangParse";

function isNow(row: HoraRow): boolean {
  if (!row.start || !row.end) return false;

  const start = new Date(row.start).getTime();
  const end = new Date(row.end).getTime();
  const now = Date.now();

  return !Number.isNaN(start) && !Number.isNaN(end) && now >= start && now < end;
}

export default function HoraTable({ rows }: { rows: HoraRow[] }) {
  return (
    <div className="panchang-table-wrap">
      <table className="panchang-table">
        <thead>
          <tr>
            <th>#</th>
            <th>Hora Lord</th>
            <th>Start</th>
            <th>End</th>
          </tr>
        </thead>

        <tbody>
          {rows.map((row, index) => {
            const active = isNow(row);

            const [start, end] = row.time.split(" - ");

            return (
              <tr key={`${row.lord}-${index}`} className={active ? "panchang-row-active" : ""}>
                <td>{index + 1}</td>
                <td>
                  <strong className={`hora-planet ${row.lord.toLowerCase()}`}>{row.lord}</strong>
                  {active && <span className="choghadiya-now-badge">NOW</span>}
                </td>
                <td>{start ?? row.time}</td>
                <td>{end ?? ""}</td>
              </tr>
            );
          })}
        </tbody>
      </table>
    </div>
  );
}