Update Next.js configuration and package dependencies

- Modified redirects in next.config.ts to change the destination for "/sohbet" to "/listem".
- Added new dependencies in package.json: marked, motion, react-markdown, remark-breaks, remark-gfm, shiki, and use-stick-to-bottom.
- Updated pnpm-lock.yaml to reflect the new package versions and dependencies.
- Removed obsolete stack files for Flutter, Nuxt, Nuxt.js, React Native, and Svelte from the UI/UX Pro Max skill data.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

src/app/sonuc/sihirbaz-cagri-karti.tsx

@@ -1,7 +1,15 @@
 "use client";
 
-import { useEffect, useState, useSyncExternalStore } from "react";
+import {
+  useEffect,
+  useRef,
+  useState,
+  useSyncExternalStore,
+} from "react";
+import Link from "next/link";
+import { useRouter } from "next/navigation";
 import { Sparkles, X } from "lucide-react";
+import { toast } from "sonner";
 import { Button } from "@/components/ui/button";
 import type { SihirbazFacetleri } from "@/lib/db";
 import {
@@ -9,11 +17,14 @@ import {
   sihirbazDogrula,
   type SihirbazSecimleri,
 } from "@/lib/sihirbaz";
+import { SihirbazModal } from "./sihirbaz-modal";
+import { SIHIRBAZ_AC_EVENT } from "./funnel-banner";
 import {
-  SihirbazModal,
+  ListePaneli,
   type MevcutRapor,
-  type OnizlemeSatir,
-} from "./sihirbaz-modal";
+  type PanelDurum,
+} from "./liste-paneli";
+import { listeOlustur, listeRevize } from "./actions";
 
 const KAPATMA_KEY = "kolaytercih.sihirbaz-karti-kapali";
 
@@ -32,11 +43,12 @@ type BekleyenSecim = {
 };
 
 /**
- * Sonuç sayfasında sihirbaz akışını yöneten client wrapper:
- * - Sayfa ortasındaki büyük CTA (satır içi)
- * - Sabit alt çağrı kartı
- * - Modal
- * hepsi tek `acik` state'ini paylaşır.
+ * Sonuç sayfasında sihirbaz akışını yöneten client orkestratör:
+ * - Sayfa ortasındaki büyük CTA + sabit alt çağrı kartı (rapor yokken)
+ * - Adımları toplayan modal
+ * - Üretim/önizleme/liste paneli (sayfa gövdesinde)
+ * Akış: adımlar → (girişsizse /giris) → kredi ile üretim → paketsizse
+ * progressive-blur önizleme, paketliyse tam liste.
  */
 export function SihirbazBolumu({
   sira,
@@ -44,10 +56,10 @@ export function SihirbazBolumu({
   facetler,
   girisliMi,
   hasPaket,
-  kredi,
+  kredi: baslangicKredi,
   mevcutRapor,
-  onizlemeSatirlari,
   otomatikAc,
+  acilis,
 }: {
   sira: number;
   tur: string;
@@ -56,18 +68,34 @@ export function SihirbazBolumu({
   hasPaket: boolean;
   kredi: number;
   mevcutRapor: MevcutRapor | null;
-  onizlemeSatirlari: OnizlemeSatir[];
   /** ?sihirbaz=1 ile gelindiyse modalı otomatik aç */
   otomatikAc?: boolean;
+  /** ?acildi=1 (ödeme dönüşü): blur çözülme animasyonuyla aç */
+  acilis?: boolean;
 }) {
+  const router = useRouter();
   const monteEdildi = useMonteEdildi();
+
   const [elleAcik, setElleAcik] = useState(false);
   const [elleKapandi, setElleKapandi] = useState(false);
   const [kartGizle, setKartGizle] = useState(false);
   const [bekleyen, setBekleyen] = useState<BekleyenSecim | null>(null);
 
+  const [rapor, setRapor] = useState<MevcutRapor | null>(mevcutRapor);
+  const [kredi, setKredi] = useState(baslangicKredi);
+  const [paketli, setPaketli] = useState(hasPaket);
+  const [durum, setDurum] = useState<PanelDurum>("bos");
+
+  // Adımlarda yapılan son seçimler (hata sonrası modala dönüşte prefill)
+  const [sonSecimler, setSonSecimler] = useState<SihirbazSecimleri | null>(
+    null,
+  );
+
+  // Aynı üretim için sabit requestId (retry çifte harcama yapmaz)
+  const requestIdRef = useRef<string | null>(null);
+  const otomatikBasladi = useRef(false);
+
   // Mount sonrası storage'dan bekleyen seçimleri + kalıcı kart kapatmayı oku
-  // (dış store'dan başlangıç senkronizasyonu — bir kez).
   useEffect(() => {
     try {
       const kaliciKapali = Boolean(sessionStorage.getItem(KAPATMA_KEY));
@@ -93,11 +121,100 @@ export function SihirbazBolumu({
     } catch {}
   }, [sira, tur]);
 
-  // Giriş/ödeme dönüşünde otomatik üretim: eşleşen bekleyen seçim + paket
-  const otomatikUret = Boolean(bekleyen?.eslesir && girisliMi && hasPaket);
-  // Açık durumu türetilmiş: elle veya otomatik tetik, kullanıcı kapatmadıkça
-  const acik = !elleKapandi && (elleAcik || Boolean(otomatikAc) || otomatikUret);
-  const baslangicSecimler = bekleyen?.eslesir ? bekleyen.secimler : null;
+  // Üstteki funnel banner'ının CTA'sı sihirbaz modalını bu olayla açar
+  useEffect(() => {
+    const ac = () => {
+      setElleAcik(true);
+      setElleKapandi(false);
+    };
+    window.addEventListener(SIHIRBAZ_AC_EVENT, ac);
+    return () => window.removeEventListener(SIHIRBAZ_AC_EVENT, ac);
+  }, []);
+
+  async function uret(secimler: SihirbazSecimleri) {
+    if (!requestIdRef.current) requestIdRef.current = crypto.randomUUID();
+    setElleAcik(false);
+    setDurum("uretiliyor");
+
+    try {
+      const sonuc = await listeOlustur({
+        sira,
+        tur,
+        secimler,
+        requestId: requestIdRef.current,
+      });
+      if (sonuc.ok) {
+        requestIdRef.current = null;
+        setRapor({
+          rapor: sonuc.rapor,
+          params: sonuc.params,
+          revisionCount: sonuc.revisionCount,
+        });
+        setKredi(sonuc.kredi);
+        setPaketli(sonuc.hasPaket);
+        try {
+          localStorage.removeItem(SIHIRBAZ_STORAGE_KEY);
+        } catch {}
+        // AI çıktısı bu sayfada gösterilmez: üretim animasyonu açık kalır,
+        // liste (paketsizse paywall'lı hâliyle) /listem'de karşılar.
+        router.push("/listem");
+        return;
+      }
+      // Hata: aynı requestId'yi koru ki tekrar denemede çifte harcama olmasın
+      if (sonuc.code === "KREDI" || sonuc.code === "PAKET") {
+        setDurum("kredi-yetersiz");
+      } else if (sonuc.code === "AUTH") {
+        secimleriKaydetVeGirise(secimler);
+      } else {
+        toast.error(sonuc.error);
+        setDurum("bos");
+        setElleAcik(true);
+      }
+    } catch {
+      toast.error("Beklenmeyen bir hata oluştu, tekrar dener misin?");
+      setDurum("bos");
+      setElleAcik(true);
+    }
+  }
+
+  function secimleriKaydetVeGirise(secimler: SihirbazSecimleri) {
+    try {
+      localStorage.setItem(
+        SIHIRBAZ_STORAGE_KEY,
+        JSON.stringify({ sira, tur, secimler }),
+      );
+    } catch {}
+    const geri = `/sonuc?sira=${sira}&tur=${tur}&sihirbaz=1`;
+    router.push(`/giris?callback=${encodeURIComponent(geri)}`);
+  }
+
+  function ilerle(secimler: SihirbazSecimleri) {
+    setSonSecimler(secimler);
+    if (!girisliMi) {
+      secimleriKaydetVeGirise(secimler);
+      return;
+    }
+    void uret(secimler);
+  }
+
+  // Giriş dönüşü: storage'daki eşleşen seçimlerle otomatik üretime başla
+  // (bir kez, modal açmadan — üretim sayfa gövdesinde oynar).
+  const otomatikUret = Boolean(bekleyen?.eslesir && girisliMi && !rapor);
+  useEffect(() => {
+    if (otomatikUret && bekleyen && !otomatikBasladi.current) {
+      otomatikBasladi.current = true;
+      setSonSecimler(bekleyen.secimler);
+      void uret(bekleyen.secimler);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [otomatikUret]);
+
+  // ?sihirbaz=1: otomatik üretim devreye girmediyse (seçim kaybolduysa/
+  // eşleşmiyorsa) modalı aç ki kullanıcı adımları tamamlayabilsin.
+  const acik =
+    !elleKapandi &&
+    (elleAcik ||
+      Boolean(otomatikAc && !otomatikUret && !rapor && durum === "bos"));
 
   function acikDegisti(v: boolean) {
     if (v) {
@@ -109,43 +226,80 @@ export function SihirbazBolumu({
     }
   }
 
-  // Üretim başladıysa storage'ı temizle (modal artık state'te tutuyor)
-  useEffect(() => {
-    if (acik && otomatikUret) {
-      try {
-        localStorage.removeItem(SIHIRBAZ_STORAGE_KEY);
-      } catch {}
-    }
-  }, [acik, otomatikUret]);
-
-  const raporVar = Boolean(mevcutRapor);
+  const panelde = Boolean(rapor) || durum !== "bos";
 
   return (
     <>
-      {/* Sayfa ortasındaki büyük CTA */}
-      <section className="mt-16 rounded-2xl bg-primary p-8 text-center text-white sm:p-12">
-        <h2 className="font-heading text-2xl font-bold sm:text-3xl">
-          {raporVar
-            ? "24 tercihlik listen hazır"
-            : "Bu listeyi 24 tercihlik plana çevirelim mi?"}
-        </h2>
-        <p className="mx-auto mt-3 max-w-xl text-white/90">
-          {raporVar
-            ? "Listeni görüntüle, revize et veya listen hakkında soru sor."
-            : "Birkaç adımda ilgi alanların ve şehir tercihine göre gerekçeli, dengeli bir tercih listesi kuralım — her satır için yerleşme riski analiziyle."}
-        </p>
-        <Button
-          size="lg"
-          onClick={() => acikDegisti(true)}
-          className="mt-6 h-12 cursor-pointer bg-orange-500 px-8 text-white transition-colors duration-200 hover:bg-orange-600"
-        >
-          <Sparkles className="size-4" aria-hidden />
-          {raporVar ? "Listemi görüntüle" : "Listemi oluştur"}
-        </Button>
-      </section>
+      {/* AI çıktısı (rapor listesi/haritası) bu sayfada render edilmez;
+          panel yalnızca üretim ve kredi-yetersiz gibi geçici funnel
+          durumlarını gösterir, listenin kendisi /listem'de yaşar. */}
+      {durum !== "bos" ? (
+        <ListePaneli
+          durum={durum}
+          rapor={null}
+          hasPaket={paketli}
+          kredi={kredi}
+          sira={sira}
+          acilis={acilis}
+          onRevize={async (feedback) => {
+            const sonuc = await listeRevize({
+              feedback,
+              requestId: crypto.randomUUID(),
+            });
+            if (sonuc.ok) {
+              setRapor({
+                rapor: sonuc.rapor,
+                params: sonuc.params,
+                revisionCount: sonuc.revisionCount,
+              });
+              setKredi(sonuc.kredi);
+              toast.success("Listen yeniden kuruldu.");
+            } else {
+              toast.error(sonuc.error);
+            }
+            return sonuc.ok;
+          }}
+        />
+      ) : rapor ? (
+        <section className="mt-16 rounded-2xl border border-slate-200 bg-white p-8 text-center sm:p-12">
+          <h2 className="font-heading text-2xl font-bold sm:text-3xl">
+            24 tercihlik listen hazır
+          </h2>
+          <p className="mx-auto mt-3 max-w-xl text-slate-600">
+            Yapay zekânın kurduğu risk analizli listen Listem sayfasında seni
+            bekliyor.
+          </p>
+          <Button
+            asChild
+            size="lg"
+            className="mt-6 h-12 cursor-pointer bg-orange-500 px-8 text-white transition-colors duration-200 hover:bg-orange-600"
+          >
+            <Link href="/listem">Listeni gör</Link>
+          </Button>
+        </section>
+      ) : (
+        <section className="mt-16 rounded-2xl bg-primary p-8 text-center text-white sm:p-12">
+          <h2 className="font-heading text-2xl font-bold sm:text-3xl">
+            Bu listeyi 24 tercihlik plana çevirelim mi?
+          </h2>
+          <p className="mx-auto mt-3 max-w-xl text-white/90">
+            Birkaç adımda ilgi alanların ve şehir tercihine göre gerekçeli,
+            dengeli bir tercih listesi kuralım — her satır için yerleşme riski
+            analiziyle.
+          </p>
+          <Button
+            size="lg"
+            onClick={() => acikDegisti(true)}
+            className="mt-6 h-12 cursor-pointer bg-orange-500 px-8 text-white transition-colors duration-200 hover:bg-orange-600"
+          >
+            <Sparkles className="size-4" aria-hidden />
+            Listemi oluştur
+          </Button>
+        </section>
+      )}
 
-      {/* Sabit alt çağrı kartı — rapor yoksa ve kart kapatılmadıysa */}
-      {monteEdildi && !raporVar && !kartGizle && !acik ? (
+      {/* Sabit alt çağrı kartı — liste/panel yokken ve kart kapatılmadıysa */}
+      {monteEdildi && !panelde && !kartGizle && !acik ? (
         <div className="pointer-events-none fixed inset-x-0 bottom-4 z-40 px-4">
           <div className="pointer-events-auto mx-auto flex max-w-xl items-center gap-4 rounded-2xl border border-slate-200 bg-white p-4 shadow-xl">
             <div className="flex-1">
@@ -184,16 +338,14 @@ export function SihirbazBolumu({
         <SihirbazModal
           acik={acik}
           onAcikDegisti={acikDegisti}
-          sira={sira}
-          tur={tur}
           facetler={facetler}
-          girisliMi={girisliMi}
-          hasPaket={hasPaket}
-          kredi={kredi}
-          mevcutRapor={mevcutRapor}
-          onizlemeSatirlari={onizlemeSatirlari}
-          otomatikUret={otomatikUret}
-          baslangicSecimler={baslangicSecimler}
+          baslangicSecimler={
+            sonSecimler ?? (bekleyen?.eslesir ? bekleyen.secimler : null)
+          }
+          sonButonEtiketi={
+            girisliMi ? "Listemi oluştur (3 kredi)" : "Listemi gör"
+          }
+          onTamamla={ilerle}
         />
       ) : null}
     </>