/* eslint-disable @typescript-eslint/no-explicit-any */
import ky from "ky";
import { useEffect, useState } from "react";

function HistoryPage() {
  const [history, setHistory] = useState([]);

  async function getHistory() {
    const result: any = await ky
      .get(`${import.meta.env.VITE_COORD_URL}/session_history`)
      .json();

    setHistory(result);
  }

  useEffect(() => {
    getHistory();
  }, []);

  return (
    <div className="text-[#F2F2F2] space-y-4 p-4">
      <p>Всего сессий: {history.length}</p>
      {history.map((item: any) => (
        <div key={item.id} className="p-4 rounded-lg bg-[#22222A]">
          <p>
            Дата и время: {new Date(item.createdAt).toLocaleString()}
          </p>
          <p>Сборка: "{item.build}"</p>
          <p>Локация: "{item.location}"</p>
          <p>Сервер: "{item.server}"</p>
          <p>IP клиента: {item.ownerIp}</p>
          {/* <p>Город: {item.city}</p> */}
          {/* <p>Устройство: {item.headers["user-agent"]}</p> */}
        </div>
      ))}
    </div>
  );
}

export default HistoryPage;
