refactor: Toast 升级为全局 Context，消除 onToast prop 透传

将 useToast 从独立 state hook 改为 Context-based，在 layout 中挂载 ToastProvider 全局渲染 Toast。QrInviteModal、RoomManageModal、 ShareCardModal 不再需要 onToast prop，直接 useToast() 调用即可。父组件 TopNav、MatchResult、profile、blindbox 移除了本地 Toast 渲染和 onToast 传递逻辑。
2026-02-26 17:57:34 +08:00
parent b98920858c
commit d4c6da57a1
10 changed files with 68 additions and 55 deletions
@@ -23,7 +23,6 @@ import {
 import confetti from "canvas-confetti";
 import { getCachedProfile, isRegistered } from "@/lib/userId";
 import ShareCardModal from "@/components/ShareCardModal";
-import Toast from "@/components/Toast";
 import { useToast } from "@/hooks/useToast";
 import { BlindboxRoomSkeleton } from "@/components/Skeleton";
 import type { UserProfile } from "@/types";
@@ -815,7 +814,6 @@ export default function BlindboxRoomPage() {
            drawer: revealedIdea.drawnBy ?? undefined,
            roomName: room.name,
          }}
-          onToast={toast.show}
        />
      )}

@@ -850,8 +848,6 @@ export default function BlindboxRoomPage() {
        </motion.div>
      )}

-      <Toast message={toast.message} position="bottom" />
-
      <div className="h-8 shrink-0" />
    </div>
  );
@@ -4,6 +4,7 @@ import "./globals.css";
 import GlobalUserBadge from "@/components/GlobalUserBadge";
 import ServiceWorkerRegistrar from "@/components/ServiceWorkerRegistrar";
 import PageTransition from "@/components/PageTransition";
+import ToastProvider from "@/components/ToastProvider";

 const geistSans = Geist({
  variable: "--font-geist-sans",
@@ -40,8 +41,10 @@ export default function RootLayout({
      </head>
      <body className={`${geistSans.variable} font-sans antialiased`}>
        <ServiceWorkerRegistrar />
-        <PageTransition>{children}</PageTransition>
-        <GlobalUserBadge />
+        <ToastProvider>
+          <PageTransition>{children}</PageTransition>
+          <GlobalUserBadge />
+        </ToastProvider>
      </body>
    </html>
  );
@@ -24,7 +24,6 @@ import {
  Heart,
 } from "lucide-react";
 import EmptyState from "@/components/EmptyState";
-import Toast from "@/components/Toast";
 import { useToast } from "@/hooks/useToast";
 import RestaurantImage from "@/components/RestaurantImage";
 import { ProfileCardSkeleton, RecordItemSkeleton } from "@/components/Skeleton";
@@ -711,7 +710,6 @@ export default function ProfilePage() {
        </motion.div>
      </div>

-      <Toast message={toast.message} />
    </div>
  );
 }