/**
 * ScheduledActions Component - Cron-like scheduling for recurring admin tasks
 */

import { useState, useEffect } from 'react'
import { useAdmin } from '../../contexts/AdminContext'
import { TransactionRequestStatus } from '../../types/admin'
import { generateSecureId } from '../../utils/security'
import { CONTRACT_ADDRESSES } from '../../config/contracts'
import toast from 'react-hot-toast'

interface ScheduledAction {
  id: string
  name: string
  contractAddress: `0x${string}` | string
  functionName: string
  args: any[]
  schedule: string // Cron-like expression (simplified: "daily", "weekly", "custom")
  nextExecution: number
  enabled: boolean
}

export default function ScheduledActions() {
  const { createAdminAction, addAuditLog } = useAdmin()
  const [scheduledActions, setScheduledActions] = useState<ScheduledAction[]>([])
  const [newAction, setNewAction] = useState({
    name: '',
    contractAddress: CONTRACT_ADDRESSES.mainnet.MAINNET_TETHER,
    functionName: 'pause',
    args: '[]',
    schedule: 'daily',
  })

  useEffect(() => {
    const stored = localStorage.getItem('scheduled_actions')
    if (stored) {
      setScheduledActions(JSON.parse(stored))
    }
  }, [])

  useEffect(() => {
    localStorage.setItem('scheduled_actions', JSON.stringify(scheduledActions))

    // Check for actions ready to execute
    const checkScheduled = () => {
      const now = Date.now()
      scheduledActions.forEach((action) => {
        if (action.enabled && action.nextExecution <= now) {
          // Execute action
          createAdminAction({
            type: action.functionName as any,
            contractAddress: action.contractAddress as `0x${string}`,
            functionName: action.functionName,
            args: (action.args && typeof action.args === 'string' ? JSON.parse(action.args) : action.args) || [],
            status: TransactionRequestStatus.PENDING,
            createdAt: Date.now(),
            id: generateSecureId(),
          })

          // Calculate next execution
          const nextExecution = calculateNextExecution(action.schedule, now)
          setScheduledActions((prev) =>
            prev.map((a) =>
              a.id === action.id ? { ...a, nextExecution } : a
            )
          )

          toast.success(`Scheduled action "${action.name}" executed`)
          addAuditLog({
            user: 'system',
            action: 'execute_scheduled',
            resourceType: 'scheduled_action',
            resourceId: action.id,
            details: { name: action.name },
            status: 'success',
          })
        }
      })
    }

    const interval = setInterval(checkScheduled, 60000) // Check every minute
    return () => clearInterval(interval)
  }, [scheduledActions, createAdminAction, addAuditLog])

  const calculateNextExecution = (schedule: string, from: number): number => {
    const now = new Date(from)
    switch (schedule) {
      case 'daily':
        now.setDate(now.getDate() + 1)
        now.setHours(0, 0, 0, 0)
        return now.getTime()
      case 'weekly':
        now.setDate(now.getDate() + 7)
        now.setHours(0, 0, 0, 0)
        return now.getTime()
      default:
        return from + 86400000 // Default: 24 hours
    }
  }

  const createScheduledAction = () => {
    if (!newAction.name) {
      toast.error('Enter a name for the scheduled action')
      return
    }

    const action: ScheduledAction = {
      id: `scheduled_${Date.now()}`,
      name: newAction.name,
      contractAddress: newAction.contractAddress as `0x${string}`,
      functionName: newAction.functionName,
      args: JSON.parse(newAction.args || '[]'),
      schedule: newAction.schedule,
      nextExecution: calculateNextExecution(newAction.schedule, Date.now()),
      enabled: true,
    }

    setScheduledActions((prev) => [...prev, action])
    toast.success('Scheduled action created')
    setNewAction({
      name: '',
      contractAddress: CONTRACT_ADDRESSES.mainnet.MAINNET_TETHER,
      functionName: 'pause',
      args: '[]',
      schedule: 'daily',
    })
  }

  const toggleAction = (id: string) => {
    setScheduledActions((prev) =>
      prev.map((a) => (a.id === id ? { ...a, enabled: !a.enabled } : a))
    )
  }

  const deleteAction = (id: string) => {
    setScheduledActions((prev) => prev.filter((a) => a.id !== id))
    toast.success('Scheduled action deleted')
  }

  return (
    <div className="space-y-6">
      <div className="bg-black/20 rounded-xl p-6 border border-white/10">
        <h2 className="text-xl font-bold text-white mb-4">Scheduled Actions</h2>
        <p className="text-white/70 text-sm mb-4">
          Create recurring admin actions that execute automatically on a schedule.
        </p>

        <div className="space-y-4">
          <div>
            <label className="block text-white/70 text-sm mb-2">Action Name</label>
            <input
              type="text"
              value={newAction.name}
              onChange={(e) => setNewAction({ ...newAction, name: e.target.value })}
              placeholder="Daily State Check"
              className="w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white placeholder-white/40 focus:outline-none focus:border-blue-500"
            />
          </div>

          <div>
            <label className="block text-white/70 text-sm mb-2">Contract</label>
            <select
              value={newAction.contractAddress}
              onChange={(e) => setNewAction({ ...newAction, contractAddress: e.target.value as `0x${string}` })}
              className="w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white focus:outline-none focus:border-blue-500"
            >
              <option value={CONTRACT_ADDRESSES.mainnet.MAINNET_TETHER}>MainnetTether</option>
              <option value={CONTRACT_ADDRESSES.mainnet.TRANSACTION_MIRROR}>TransactionMirror</option>
            </select>
          </div>

          <div>
            <label className="block text-white/70 text-sm mb-2">Function</label>
            <input
              type="text"
              value={newAction.functionName}
              onChange={(e) => setNewAction({ ...newAction, functionName: e.target.value })}
              placeholder="pause"
              className="w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white placeholder-white/40 focus:outline-none focus:border-blue-500"
            />
          </div>

          <div>
            <label className="block text-white/70 text-sm mb-2">Schedule</label>
            <select
              value={newAction.schedule}
              onChange={(e) => setNewAction({ ...newAction, schedule: e.target.value })}
              className="w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white focus:outline-none focus:border-blue-500"
            >
              <option value="daily">Daily</option>
              <option value="weekly">Weekly</option>
            </select>
          </div>

          <button
            onClick={createScheduledAction}
            className="w-full px-6 py-3 bg-green-600 hover:bg-green-700 text-white rounded-lg font-semibold transition-colors"
          >
            Create Scheduled Action
          </button>
        </div>
      </div>

      {scheduledActions.length > 0 && (
        <div className="bg-black/20 rounded-xl p-6 border border-white/10">
          <h3 className="text-lg font-bold text-white mb-4">Active Schedules</h3>
          <div className="space-y-3">
            {scheduledActions.map((action) => (
              <div
                key={action.id}
                className="bg-white/5 rounded-lg p-4 border border-white/10"
              >
                <div className="flex justify-between items-start">
                  <div className="flex-1">
                    <div className="flex items-center gap-2 mb-2">
                      <p className="text-white font-semibold">{action.name}</p>
                      <span
                        className={`px-2 py-1 rounded text-xs ${
                          action.enabled
                            ? 'bg-green-500/20 text-green-300'
                            : 'bg-gray-500/20 text-gray-300'
                        }`}
                      >
                        {action.enabled ? 'Enabled' : 'Disabled'}
                      </span>
                    </div>
                    <p className="text-white/60 text-xs">
                      {action.functionName} on {action.contractAddress.slice(0, 20)}...
                    </p>
                    <p className="text-white/60 text-xs">
                      Schedule: {action.schedule} | Next: {new Date(action.nextExecution).toLocaleString()}
                    </p>
                  </div>
                  <div className="flex gap-2">
                    <button
                      onClick={() => toggleAction(action.id)}
                      className={`px-3 py-1 rounded text-sm font-semibold ${
                        action.enabled
                          ? 'bg-yellow-600 hover:bg-yellow-700'
                          : 'bg-green-600 hover:bg-green-700'
                      } text-white`}
                    >
                      {action.enabled ? 'Disable' : 'Enable'}
                    </button>
                    <button
                      onClick={() => deleteAction(action.id)}
                      className="px-3 py-1 bg-red-600 hover:bg-red-700 text-white rounded text-sm font-semibold"
                    >
                      Delete
                    </button>
                  </div>
                </div>
              </div>
            ))}
          </div>
        </div>
      )}
    </div>
  )
}
