import { prisma } from '@/lib/prisma';
import { deleteShout } from '@/actions/admin-radio';

export const dynamic = 'force-dynamic';

type Shout = {
  id: bigint;
  userId: bigint;
  message: string;
  createdAt: Date | null;
};

type Application = {
  id: bigint;
  userId: bigint;
  realName: string;
  age: number;
  status: string;
  musicStyle: string | null;
  discordUsername: string | null;
  createdAt: Date | null;
};

type Schedule = {
  id: bigint;
  userId: bigint;
  day: string;
  startTime: Date;
  endTime: Date;
  showName: string | null;
  isActive: boolean;
};

function formatDate(d: Date | null): string {
  return d ? d.toISOString().slice(0, 16).replace('T', ' ') : '—';
}

function formatTime(d: Date | null): string {
  return d ? d.toISOString().slice(11, 16) : '—';
}

export default async function AdminRadioPage() {
  let shouts: Shout[] = [];
  let applications: Application[] = [];
  let schedules: Schedule[] = [];

  try {
    shouts = await prisma.radioShouts.findMany({
      select: { id: true, userId: true, message: true, createdAt: true },
      orderBy: { id: 'desc' },
      take: 25,
    });
  } catch {
    shouts = [];
  }

  try {
    applications = await prisma.radioApplications.findMany({
      select: {
        id: true,
        userId: true,
        realName: true,
        age: true,
        status: true,
        musicStyle: true,
        discordUsername: true,
        createdAt: true,
      },
      orderBy: { id: 'desc' },
      take: 25,
    });
  } catch {
    applications = [];
  }

  try {
    schedules = await prisma.radioSchedules.findMany({
      select: {
        id: true,
        userId: true,
        day: true,
        startTime: true,
        endTime: true,
        showName: true,
        isActive: true,
      },
      orderBy: { id: 'desc' },
      take: 25,
    });
  } catch {
    schedules = [];
  }

  return (
    <main>
      <h1>Radio Moderation</h1>

      <section style={{ marginBottom: '2rem' }}>
        <h2>Recent Shouts</h2>
        {shouts.length === 0 ? (
          <p className="muted">No shouts.</p>
        ) : (
          <table>
            <thead>
              <tr>
                <th>ID</th>
                <th>User</th>
                <th>Message</th>
                <th>Posted</th>
                <th />
              </tr>
            </thead>
            <tbody>
              {shouts.map((s) => (
                <tr key={String(s.id)}>
                  <td>{String(s.id)}</td>
                  <td>{String(s.userId)}</td>
                  <td>{s.message}</td>
                  <td className="muted">{formatDate(s.createdAt)}</td>
                  <td>
                    <form action={deleteShout}>
                      <input type="hidden" name="id" value={String(s.id)} />
                      <button type="submit" className="btn btn-danger">
                        Delete
                      </button>
                    </form>
                  </td>
                </tr>
              ))}
            </tbody>
          </table>
        )}
      </section>

      <section style={{ marginBottom: '2rem' }}>
        <h2>DJ Applications</h2>
        {applications.length === 0 ? (
          <p className="muted">No applications.</p>
        ) : (
          <table>
            <thead>
              <tr>
                <th>ID</th>
                <th>User</th>
                <th>Real Name</th>
                <th>Age</th>
                <th>Style</th>
                <th>Discord</th>
                <th>Status</th>
                <th>Applied</th>
              </tr>
            </thead>
            <tbody>
              {applications.map((a) => (
                <tr key={String(a.id)}>
                  <td>{String(a.id)}</td>
                  <td>{String(a.userId)}</td>
                  <td>{a.realName}</td>
                  <td>{a.age}</td>
                  <td>{a.musicStyle ?? '—'}</td>
                  <td>{a.discordUsername ?? '—'}</td>
                  <td>{a.status}</td>
                  <td className="muted">{formatDate(a.createdAt)}</td>
                </tr>
              ))}
            </tbody>
          </table>
        )}
      </section>

      <section>
        <h2>Schedules</h2>
        {schedules.length === 0 ? (
          <p className="muted">No schedules.</p>
        ) : (
          <table>
            <thead>
              <tr>
                <th>ID</th>
                <th>User</th>
                <th>Day</th>
                <th>Start</th>
                <th>End</th>
                <th>Show</th>
                <th>Active</th>
              </tr>
            </thead>
            <tbody>
              {schedules.map((sc) => (
                <tr key={String(sc.id)}>
                  <td>{String(sc.id)}</td>
                  <td>{String(sc.userId)}</td>
                  <td>{sc.day}</td>
                  <td>{formatTime(sc.startTime)}</td>
                  <td>{formatTime(sc.endTime)}</td>
                  <td>{sc.showName ?? '—'}</td>
                  <td>{sc.isActive ? '●' : '○'}</td>
                </tr>
              ))}
            </tbody>
          </table>
        )}
      </section>
    </main>
  );
}