fix(hitl): use renderPayload from ui-shared-lite to fix undefined (#5454

)

* fix(hitl): use renderPaylood from ui-shared-lite to fix undefined

* fix(hitl): remove broken dependencies to extensions

Co-authored-by: Samuel Massé <59894025+samuelmasse@users.noreply.github.com>

modules/hitl/src/views/full/components/messages/Message.tsx

@@ -60,7 +60,7 @@ export default class Message extends React.Component<{ message: HitlMessage }> {
   }
 
   renderDropdown() {
-    const Dropdown = getComponent('extensions', 'Dropdown')
+    const Dropdown = getComponent('channel-web', 'Dropdown')
     return Dropdown ? (
       <Dropdown isLastGroup={true} isLastOfGroup={true} options={this.props.message.raw_message.options} />
     ) : null

modules/hitl/src/views/full/components/messages/MessageList.tsx

@@ -1,7 +1,7 @@
-import { contentPayloads } from 'botpress/shared'
 import _ from 'lodash'
 import moment from 'moment'
 import React, { FC } from 'react'
+import { renderPayload } from '../../../../../../../packages/ui-shared-lite/Payloads'
 
 import { Message as HitlMessage } from '../../../../backend/typings'
 
@@ -26,11 +26,7 @@ class MessageWrapper extends React.Component<{ message: any }> {
       return <p className="bph-chat-error">* Cannot display message *</p>
     }
 
-    return (
-      <Message
-        message={{ ...this.props.message, raw_message: contentPayloads.renderPayload(this.props.message.raw_message) }}
-      />
-    )
+    return <Message message={{ ...this.props.message, raw_message: renderPayload(this.props.message.raw_message) }} />
   }
 }
 

modules/hitl/src/views/full/index.tsx

@@ -37,9 +37,6 @@ export default class HitlModule extends React.Component<{ bp: any }, State> {
   }
 
   async componentDidMount() {
-    // Loads the extensions module to display dropdown components
-    window.botpress.injector.loadModuleView('extensions', true)
-
     this.props.bp.events.on('hitl.message', this.updateSessionOverview)
     this.props.bp.events.on('hitl.new_session', this.refreshSessions)
     this.props.bp.events.on('hitl.session.changed', this.updateSession)