"use client";

import { isValidAutomergeUrl } from "@automerge/automerge-repo";
import PollView from "./PollView.js";

export default function PollPageClient({ id }: { id: string }) {
  const automergeUrl = `automerge:${id}` as const;

  if (!isValidAutomergeUrl(automergeUrl)) {
    return (
      <div className="rounded-lg border border-red-200 bg-red-50 p-6 text-center">
        <h2 className="text-lg font-semibold text-red-800">Invalid Poll ID</h2>
        <p className="mt-2 text-sm text-red-600">
          The poll ID in the URL is not valid.
        </p>
        <a href="/" className="mt-4 inline-block text-sm text-blue-600 hover:underline">
          Go back home
        </a>
      </div>
    );
  }

  return (
    <div className="rounded-lg border border-gray-200 bg-white p-6 shadow-sm">
      <PollView docUrl={automergeUrl} />
    </div>
  );
}
