import type { Metadata } from "next";
import Link from "next/link";
import EntwederOder from "@/components/tools/entweder-oder";
import SubpageLayout from "@/components/subpage-layout";

const SITE_URL = "https://entscheidomat.com";
const PAGE_URL = `${SITE_URL}/entweder-oder`;
const PAGE_TITLE = "Entweder-oder-Generator – zwischen zwei Optionen entscheiden";
const PAGE_DESCRIPTION =
  "Entweder oder? Trage zwei Optionen ein und lass den Generator zufällig entscheiden. Als Entscheidungsrad für zwei Möglichkeiten – kostenlos und ohne Anmeldung.";
const UPDATED = "3. August 2026";

export const metadata: Metadata = {
  title: PAGE_TITLE,
  description: PAGE_DESCRIPTION,
  alternates: { canonical: "/entweder-oder" },
  openGraph: { type: "website", locale: "de_DE", siteName: "Entscheidomat", title: PAGE_TITLE, description: PAGE_DESCRIPTION, url: PAGE_URL, images: ["/opengraph-image"] },
  twitter: { card: "summary_large_image", title: PAGE_TITLE, description: PAGE_DESCRIPTION, images: ["/twitter-image"] },
};

const FAQS = [
  {
    q: "Wie entscheidet der Entweder-oder-Generator?",
    a: "Bei jedem Durchlauf erzeugt das Tool im Browser einen neuen Zufallswert. Beide Optionen haben dieselbe Chance – unabhängig davon, welche du zuerst eingetragen hast oder wie oft eine Option zuletzt gewonnen hat.",
  },
  {
    q: "Kann ich eigene Optionen eintragen?",
    a: "Ja. Trage in beide Felder frei wählbare Texte mit bis zu 28 Zeichen ein, zum Beispiel „Italiener“ und „Sushi“ oder „heute“ und „morgen“. Ohne Eingabe entscheidet das Tool zwischen „Option A“ und „Option B“.",
  },
  {
    q: "Was ist der Unterschied zum Münzwurf?",
    a: "Technisch nichts – beide wählen zufällig eine von zwei Möglichkeiten. Der Entweder-oder-Generator zeigt deine Optionen aber direkt als Text an, statt sie auf Kopf und Zahl zu übertragen. Das erspart die Frage, wofür welche Seite stand.",
  },
  {
    q: "Was mache ich bei mehr als zwei Optionen?",
    a: "Dann ist ein Glücksrad übersichtlicher, weil du dort bis zu zwölf Möglichkeiten gleichzeitig siehst. Bei längeren Namenslisten passt die Namen-Auslosung besser.",
  },
  {
    q: "Eignet sich der Generator für wichtige Entscheidungen?",
    a: "Nein. Er ist für folgenarme Alltagsentscheidungen gedacht. Bei Gesundheit, Geld, rechtlichen Fragen oder Entscheidungen, die andere Menschen mittragen, gehört eine echte Abwägung davor – und bei Bedarf fachlicher Rat.",
  },
];

const jsonLd = {
  "@context": "https://schema.org",
  "@graph": [
    {
      "@type": "BreadcrumbList",
      itemListElement: [
        { "@type": "ListItem", position: 1, name: "Entscheidomat", item: SITE_URL },
        { "@type": "ListItem", position: 2, name: "Entweder oder", item: PAGE_URL },
      ],
    },
    {
      "@type": "WebApplication",
      name: "Entweder-oder-Generator",
      url: PAGE_URL,
      description: PAGE_DESCRIPTION,
      applicationCategory: "UtilitiesApplication",
      operatingSystem: "Any (Web-Browser)",
      isPartOf: { "@id": `${SITE_URL}/#website` },
      offers: { "@type": "Offer", price: "0", priceCurrency: "EUR" },
    },
    {
      "@type": "FAQPage",
      mainEntity: FAQS.map((f) => ({
        "@type": "Question",
        name: f.q,
        acceptedAnswer: { "@type": "Answer", text: f.a },
      })),
    },
  ],
};

const STEPS = [
  "Trage deine beiden Optionen in die Felder ein (bis 28 Zeichen).",
  "Tippe auf die Karte oder den Button „Entweder oder?“.",
  "Der Generator wählt zufällig eine der beiden Optionen aus.",
  "Das Ergebnis erscheint auf der Karte, der Verlauf zeigt die letzten 10 Durchläufe.",
];

const EXAMPLES = [
  "„Italiener oder Sushi?“",
  "„Heute erledigen oder morgen?“",
  "„Bahn oder Auto?“",
];

const VORTEILE = (
  <p>
    Zwei Optionen im Klartext statt Kopf und Zahl – dadurch entfällt die Zuordnung
    und damit der häufigste Streitpunkt nach der Entscheidung. Für mehr als zwei
    Möglichkeiten eignet sich das{" "}
    <Link href="/gluecksrad" className="text-[#c97d60] font-medium hover:underline underline-offset-2">
      Glücksrad
    </Link>
    , für eine formulierte Frage der{" "}
    <Link href="/ja-nein-generator" className="text-[#c97d60] font-medium hover:underline underline-offset-2">
      Ja-Nein-Generator
    </Link>
    .
  </p>
);

const ADDITIONAL_CONTENT = (
  <article className="space-y-4 text-base leading-relaxed text-ink-soft">
    <h2 className="font-display text-2xl sm:text-3xl font-semibold text-ink">
      Wann ein Entweder-oder-Generator sinnvoll ist
    </h2>
    <p>
      Nicht jede Pattsituation braucht eine Entscheidungshilfe. Sinnvoll wird der
      Zufall dann, wenn beide Optionen vertretbar sind und weiteres Abwägen das
      Ergebnis nicht mehr besser macht. Genau das ist bei kleinen
      Alltagsentscheidungen fast immer der Fall: Beide Wege sind umkehrbar, und
      die Unterschiede sind kleiner als der Aufwand, sie weiter auszuleuchten.
    </p>
    <p>
      Wie du erkennst, ob deine Frage so weit ist – und wie du den Impuls nach dem
      Ergebnis richtig liest – steht im Ratgeber{" "}
      <Link href="/ratgeber/entweder-oder-entscheiden" className="text-[#c97d60] font-medium hover:underline underline-offset-2">
        Entweder oder: Wie du dich zwischen zwei Optionen entscheidest
      </Link>
      .
    </p>
    <h2 className="font-display text-2xl sm:text-3xl font-semibold text-ink">
      Entscheidungsrad für zwei Optionen
    </h2>
    <p>
      Ein klassisches Entscheidungsrad lohnt sich ab etwa drei Möglichkeiten. Bei
      genau zwei Optionen ist eine direkte Ziehung schneller und besser lesbar –
      das Rad hätte hier nur zwei große Segmente. Sobald eine dritte Möglichkeit
      dazukommt, wechsle zum{" "}
      <Link href="/gluecksrad" className="text-[#c97d60] font-medium hover:underline underline-offset-2">
        Glücksrad
      </Link>
      . Geht es dagegen um eine Frage mit Ja oder Nein als Antwort, ist der{" "}
      <Link href="/ja-nein-generator" className="text-[#c97d60] font-medium hover:underline underline-offset-2">
        Ja-Nein-Generator
      </Link>{" "}
      die direktere Wahl.
    </p>
  </article>
);

export default function EntwederOderPage() {
  return (
    <>
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{
          __html: JSON.stringify(jsonLd).replace(/</g, "\\u003c"),
        }}
      />
      <SubpageLayout
        toolSlug="entweder-oder"
        toolName="Entweder-oder-Generator"
        h1Title="Entweder-oder-Generator – zwischen zwei Optionen entscheiden"
        introText="Entweder oder? Trage deine beiden Möglichkeiten ein und lass den Generator zufällig entscheiden. Beide Optionen haben dieselbe Chance – kostenlos, ohne Anmeldung und direkt im Browser."
        steps={STEPS}
        examples={EXAMPLES}
        vorteileText={VORTEILE}
        additionalContent={ADDITIONAL_CONTENT}
        faqs={FAQS}
        updatedDate={UPDATED}
      >
        <EntwederOder />
      </SubpageLayout>
    </>
  );
}
