"use client";
import React from 'react';
import { useAttendance } from '../hooks/useAttendance';

export default function ClockButton({ teacherId }: { teacherId: string }) {
  const { todayRecords, clockToggle } = useAttendance();
  const last = todayRecords.filter(r => r.teacherId === teacherId).pop();
  const nextType = last?.type === 'in' ? 'out' : 'in';

  return (
    <button
      onClick={() => clockToggle(teacherId)}
      className="px-4 py-2 border rounded"
    >
      {nextType === 'in' ? 'Clock In' : 'Clock Out'}
    </button>
  );
}