import { RuleManager } from './RuleManager';
import { apiFetch } from '../../_lib/api';

interface RuleData {
  id: string;
  matchType: 'HASHTAG' | 'PREFIX' | 'REACTION_EMOJI';
  matchValue: string;
  action: 'FLAG' | 'AUTO_APPROVE' | 'SKIP' | 'REJECT';
  priority: number;
  isActive: boolean;
  createdAt: string;
  updatedAt: string;
}

export default async function RulesSettingsPage() {
  let rules: RuleData[] = [];
  try {
    const res = await apiFetch('/admin/rules');
    if (res.ok) {
      rules = (await res.json()) as RuleData[];
    }
  } catch {
    rules = [];
  }

  return (
    <div className="max-w-2xl">
      <h1 className="text-xl font-semibold mb-6">Rules Engine</h1>
      <p className="text-sm text-gray-600 mb-4">
        Configure which hashtags, prefixes, and reaction emojis trigger message processing
        and what action TOWER should take. Rules are matched in priority order.
      </p>
      <RuleManager initial={rules} />
    </div>
  );
}