/**
 * System Logs Page
 * Enterprise Logging System — Super Admin Console
 *
 * Paginated system/infrastructure logs with type/severity filters,
 * export, and metadata inspection.
 */

'use client';

import { useState } from 'react';
import { LogPageShell } from '@/components/logs/LogPageShell';
import { LogFilters } from '@/components/logs/LogFilters';
import { SystemLogsTable } from '@/components/logs/SystemLogsTable';
import { useLogsData } from '@/hooks/useLogsData';
import { loggingService } from '@/services/logging.service';
import type { SystemLog } from '@/types/logging.types';

const TYPE_OPTIONS = [
  { label: 'Startup', value: 'STARTUP' },
  { label: 'Shutdown', value: 'SHUTDOWN' },
  { label: 'Deployment', value: 'DEPLOYMENT' },
  { label: 'Cron Job', value: 'CRON_JOB' },
  { label: 'Database', value: 'DATABASE' },
  { label: 'Cache', value: 'CACHE' },
  { label: 'Queue', value: 'QUEUE' },
  { label: 'WebSocket', value: 'WEBSOCKET' },
  { label: 'Third Party', value: 'THIRD_PARTY' },
  { label: 'Config Change', value: 'CONFIG_CHANGE' },
  { label: 'Security', value: 'SECURITY' },
  { label: 'Performance', value: 'PERFORMANCE' },
  { label: 'Maintenance', value: 'MAINTENANCE' },
];

const SEVERITY_OPTIONS = [
  { label: 'Critical', value: 'CRITICAL' },
  { label: 'Error', value: 'ERROR' },
  { label: 'High', value: 'HIGH' },
  { label: 'Medium', value: 'MEDIUM' },
  { label: 'Low', value: 'LOW' },
  { label: 'Info', value: 'INFO' },
];

export default function SystemLogsPage() {
  const [type, setType] = useState('');
  const [severity, setSeverity] = useState('');
  const [filters, setFilters] = useState<{ from?: string; to?: string }>({});

  const { data, meta, loading, error, applyFilters, changePage } = useLogsData<SystemLog>({
    type: 'system',
    fetcher: (params) => loggingService.getSystemLogs(params),
  });

  const handleApply = (f: any) => {
    setFilters({ from: f.from, to: f.to });
    applyFilters({ type: type || undefined, severity: severity || undefined, from: f.from, to: f.to });
  };

  return (
    <LogPageShell
      title="System Logs"
      description="Infrastructure events — startup, shutdown, deployments, cron jobs, database, cache, queue, WebSocket, third-party services."
      logType="system"
      loading={loading}
      error={error}
      exportFrom={filters.from}
      exportTo={filters.to}
      filters={
        <div className="space-y-3">
          <div className="grid gap-3 sm:grid-cols-2">
            <LogFilters
              onApply={handleApply}
              typeOptions={TYPE_OPTIONS}
              typeLabel="Type"
              typeValue={type}
              onTypeChange={setType}
              showQuery={false}
            />
            <LogFilters
              onApply={handleApply}
              typeOptions={SEVERITY_OPTIONS}
              typeLabel="Severity"
              typeValue={severity}
              onTypeChange={setSeverity}
              showQuery
              queryPlaceholder="Search message, service, hostname..."
            />
          </div>
        </div>
      }
      table={
        <SystemLogsTable
          logs={data}
          page={meta.page}
          totalPages={meta.totalPages}
          total={meta.total}
          limit={meta.limit}
          onPageChange={changePage}
        />
      }
    />
  );
}