// frontend/components/automation/LogView.tsx — auto.jsx LogView 이식
"use client";
import { Icon } from "@/components/Icon";
import type { RunLogOut } from "@/lib/types";

export function LogView({ log }: { log: RunLogOut[] }) {
  const todayN = log.filter((l) => !l.time.startsWith("어제")).length;
  return (
    <div className="board">
      <section className="card sp2">
        <div className="ch">
          <div className="ico">
            <Icon name="clock" />
          </div>
          <div className="htext">
            <h3>실행 기록</h3>
            <div className="sub">규칙이 움직인 순간들</div>
          </div>
          <span className="count">오늘 {todayN}건</span>
        </div>
        <div className="rb-log">
          {log.map((l) => (
            <div className="lg-row" key={l.id}>
              <span className="lg-time">{l.time}</span>
              <div className="lg-body">
                <span className="lg-rule">{l.rule}</span>
                <div className="lg-text">{l.text}</div>
              </div>
              <button className="lg-undo">되돌리기</button>
            </div>
          ))}
        </div>
      </section>
    </div>
  );
}
