import PageComponentProps from "../../PageComponentProps";
import React, { Fragment, FunctionComponent, ReactElement } from "react";
import { useParams } from "react-router-dom";
import ObjectID from "Common/Types/ObjectID";
import ModelTable from "Common/UI/Components/ModelTable/ModelTable";
import AIAgentTaskLog from "Common/Models/DatabaseModels/AIAgentTaskLog";
import FieldType from "Common/UI/Components/Types/FieldType";
import Navigation from "Common/UI/Utils/Navigation";
import LogSeverity from "Common/Types/Log/LogSeverity";
import Pill from "Common/UI/Components/Pill/Pill";
import { Green, Red, Yellow, Blue, Gray500 } from "Common/Types/BrandColors";

const AIAgentTaskLogsPage: FunctionComponent<
  PageComponentProps
> = (): ReactElement => {
  const { id } = useParams();
  const modelId: ObjectID = new ObjectID(id || "");

  const getSeverityPill: (severity: LogSeverity) => ReactElement = (
    severity: LogSeverity,
  ): ReactElement => {
    switch (severity) {
      case LogSeverity.Error:
      case LogSeverity.Fatal:
        return <Pill text={severity} color={Red} />;
      case LogSeverity.Warning:
        return <Pill text={severity} color={Yellow} />;
      case LogSeverity.Information:
        return <Pill text={severity} color={Green} />;
      case LogSeverity.Debug:
      case LogSeverity.Trace:
        return <Pill text={severity} color={Blue} />;
      default:
        return <Pill text={severity} color={Gray500} />;
    }
  };

  return (
    <Fragment>
      <>
        <ModelTable<AIAgentTaskLog>
          modelType={AIAgentTaskLog}
          id="ai-agent-task-logs-table"
          isDeleteable={false}
          isEditable={false}
          isCreateable={false}
          userPreferencesKey="ai-agent-task-logs-table"
          name="AI Agent Task Logs"
          query={{
            aiAgentTaskId: modelId,
          }}
          isViewable={false}
          cardProps={{
            title: "Task Logs",
            description:
              "Log entries generated by the AI agent during task execution.",
          }}
          noItemsMessage={"No logs have been generated for this task yet."}
          showRefreshButton={true}
          viewPageRoute={Navigation.getCurrentRoute()}
          filters={[
            {
              field: {
                createdAt: true,
              },
              title: "Created At",
              type: FieldType.Date,
            },
            {
              field: {
                severity: true,
              },
              title: "Severity",
              type: FieldType.Text,
            },
            {
              field: {
                aiAgent: {
                  name: true,
                },
              },
              title: "AI Agent",
              type: FieldType.Entity,
            },
          ]}
          columns={[
            {
              field: {
                createdAt: true,
              },
              title: "Timestamp",
              type: FieldType.DateTime,
            },
            {
              field: {
                severity: true,
              },
              title: "Severity",
              type: FieldType.Text,
              getElement: (item: AIAgentTaskLog): ReactElement => {
                return getSeverityPill(item.severity as LogSeverity);
              },
            },
            {
              field: {
                message: true,
              },
              title: "Message",
              type: FieldType.Text,
            },
            {
              field: {
                aiAgent: {
                  name: true,
                },
              },
              title: "AI Agent",
              type: FieldType.Entity,
              getElement: (item: AIAgentTaskLog): ReactElement => {
                return <>{item.aiAgent?.name || "Unknown"}</>;
              },
            },
          ]}
        />
      </>
    </Fragment>
  );
};

export default AIAgentTaskLogsPage;
