Skip to content

Latest commit

 

History

History
56 lines (35 loc) · 2.92 KB

MIGRATION.md

File metadata and controls

56 lines (35 loc) · 2.92 KB
Raw

Instructions for migration when upgrading @weavy/uikit-react

Please refer to Weavy docs for detailed documentation.

UIKit React documentation

Migrate from UIKit React v19.x to v20.0.0

The UIKit React has been replaced with a UIKit powered by the @weavy/uikit-web Web components. It comes with regular React components for Weavy Blocks and React hooks for simplified configuration and usage. That means regular React components have access to all the latest features and updates provided in UIKit Web.

CSS and styling

The previously imported stylesheet is no longer used. Remove any references and style overrides. All new styling options can be found in the UIKit Web styling documentation.

Token URL

The tokenFactory can optionally be replaced with a tokenUrl as long as the API endpoint returns a JSON-encoded access_token.

See UIKit Web Authentication.

Weavy configuration

WeavyClient has been replaced with a configuration using a useWeavy hook or using a predefined <WyContext /> provider. This means there is no requirement to use a <WeavyProvider>. You may also just replace the new WeavyClient() with the underlying new Weavy().

Option 1: Replace WeavyClient with Weavy

  1. Change the name of new WeavyClient({ ...options }) to new Weavy({ ...options }).
  2. Remove the <WeavyProvider>...</WeavyProvider> tag.

Option 2: Replace the <WeavyProvider> with <WyContext>

  1. Replace the <WeavyProvider> tag with <WyContext url={WEAVY_URL} tokenFactory={async () => "access_token" }>
  2. Remove the WeavyClient instance.

Option 3: Change to useWeavy() hook

  1. Replace new WeavyClient({ ...options }) with useWeavy({...options }) and place the hook inside any top-level component such as your App component.
  2. Remove the <WeavyProvider>...</WeavyProvider> tag.

React component names

The names of the React components has changed to have a common Wy prefix and align with the naming of the blocks in UIKit Web. Rename the imports and tags for your components.

Please refer to UIKIt Web documentation if you want to create a custom Messenger to replace the MessengerProvider.

Previous component New component
<Chat /> <WyChat />
<Files /> <WyFiles />
<Messenger /> <WyMessenger />
<Posts /> <WyPosts />
<WeavyProvider /> <WyContext />
<MessengerProvider /> N/A
<ConversationList /> <WyConversationList />
<Conversation /> <WyConversation />
<ConversationBadge /> <WyBadge />