I pulled the latest changes from v0/chekanamkaliwaotz-2044-b8335733 in peterAi.
Let me check the debug logs and the relevant files to understand the error:
The error is Objects are not valid as a React child (found: object with keys {code, message}) at the <Toaster> component in layout.tsx. This is likely caused by a broken module import (probably from the Baileys packages we added earlier that can't run in this environment). Let me check the layout and package.json:
The error is Objects are not valid as a React child (found: object with keys {code, message}). This is coming from @whiskeysockets/baileys or its dependency @hapi/boom leaking error objects. Even though these are listed in serverExternalPackages, they're failing to load and the error object is being thrown at module evaluation time, corrupting the React render tree. Let me check which files import from baileys:
The issue is clear: lib/whapi.ts has a top-level import { downloadMediaMessage } from "@whiskeysockets/baileys" and lib/baileys.ts has top-level imports from @whiskeysockets/baileys. These fail in the Vercel sandbox because the native Node modules can't load, and this error propagates everywhere. Let me read both files:
Now I can see the root cause clearly. The problem is:
lib/baileys.ts has top-level import makeWASocket, {...} from "@whiskeysockets/baileys" and import { Boom } from "@hapi/boom" and import pino from "pino" -- these are eager imports at module evaluation timelib/whapi.ts has import { downloadMediaMessage } from "@whiskeysockets/baileys" -- also eager{code, message} error objectswhapi.ts -> bot-handler.ts -> and eventually corrupts the React renderThe fix: Convert all @whiskeysockets/baileys, @hapi/boom, and pino imports to lazy dynamic imports inside the functions that use them, so they never execute at module load time. Only keep import type (which is erased at compile time).
Now fix whapi.ts - the downloadMediaMessage import must also be lazy:
Now fix the getMediaUrl function in whapi.ts to use a lazy import for downloadMediaMessage:
Now update next.config.mjs to also include qrcode:
Now let me also check the QR route to make sure qrcode is also lazily imported:
The QR route has a top-level import QRCode from "qrcode" -- this is also a native module that could fail. Let me make it lazy too:
Now let me verify there are absolutely no remaining top-level eager imports of the problematic native modules:
No eager runtime imports of the native modules remain. Let me also double-check only type imports exist at the top level:
You can send messages while the preview loads