import { TriggerProvider } from "@trigger.dev/react";//you don't have to put TriggerProvider in layout.tsx,//the hooks need this to be above them in the hierarchyexport default function RootLayout({ children,}: { children: React.ReactNode;}) { return ( <html lang="en"> <body className={inter.className}> <TriggerProvider publicApiKey={process.env.NEXT_PUBLIC_TRIGGER_API_KEY ?? ""} apiUrl={process.env.NEXT_PUBLIC_TRIGGER_API_URL} > {children} </TriggerProvider> </body> </html> );}
React SDK
TriggerProvider
The TriggerProvider component allows any hooks lower in the React hierarchy to connect to the Trigger.dev API.
Copy
Ask AI
import { TriggerProvider } from "@trigger.dev/react";//you don't have to put TriggerProvider in layout.tsx,//the hooks need this to be above them in the hierarchyexport default function RootLayout({ children,}: { children: React.ReactNode;}) { return ( <html lang="en"> <body className={inter.className}> <TriggerProvider publicApiKey={process.env.NEXT_PUBLIC_TRIGGER_API_KEY ?? ""} apiUrl={process.env.NEXT_PUBLIC_TRIGGER_API_URL} > {children} </TriggerProvider> </body> </html> );}
Ensure this component is above any Trigger.dev hooks in the React component tree.
You only need to set this if you’re self-hosting Trigger.dev. It defaults to
https://api.trigger.dev.
Copy
Ask AI
import { TriggerProvider } from "@trigger.dev/react";//you don't have to put TriggerProvider in layout.tsx,//the hooks need this to be above them in the hierarchyexport default function RootLayout({ children,}: { children: React.ReactNode;}) { return ( <html lang="en"> <body className={inter.className}> <TriggerProvider publicApiKey={process.env.NEXT_PUBLIC_TRIGGER_API_KEY ?? ""} apiUrl={process.env.NEXT_PUBLIC_TRIGGER_API_URL} > {children} </TriggerProvider> </body> </html> );}