ebiz-dify-ai/web/hooks/use-channel.ts

'use client'
import { useEffect, useState } from 'react'

// enum channelType {
//   layout = 'layout',
// }

// export function useChannel(type: channelType) {
//   switch (type) {
//     case 'layout':
//       return useGetLayoutByChannel();
//   }
// }

export function useGetLayoutByChannel(message = 'layout 信息') {
  const [showLayout, setShowLayout] = useState(true)

  // 与父节点通信， 若有通信内容，获取父页面的传递内容
  // 由父节点控制页面展示内容， 默认展示
  useEffect(() => {
    const msg = {
      type: 'layout',
      message,
    }

    // 后续通过 channel 持久化，优化显示速度
    const win = window as any
    if (win.port) {
      win.port.postMessage(msg)
      win.port.onmessage = (event: MessageEvent) => {
        // console.log(`${msg.message}: ${event.data}`)
        setShowLayout(event.data)
      }
    }
    else {
      // console.warn('window.port 不存在，无法发送消息')
    }
  }, [showLayout, message])

  return showLayout
}