Skip to main content
withWeaverse HOC is a crucial part of the architecture. It wraps the root component and any error boundaries to ensure that Weaverse functionalities are available throughout the application.

​
Usage

Implement withWeaverse in your root component and error boundary components to provide them with Weaverse integration. This process allows the components to access the loaded Weaverse theme settings and other context-specific data provided by Weaverse. Here’s a basic example of how to wrap your root component with withWeaverse: 
import { withWeaverse } from '@weaverse/hydrogen'

function App() {
  // Your component logic
}

export default withWeaverse(App)
Similarly, for an error boundary component: 
export const ErrorBoundary = withWeaverse(ErrorBoundaryComponent)

​
How It Works

By wrapping a component with withWeaverse, the component gains access to the Weaverse context, which includes theme settings, page configurations, and other essential data loaded via the Weaverse client. This allows for consistent use of Weaverse features across the entire app.
⌘I