You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

header-wrapper.tsx 1.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. 'use client'
  2. import React, { useState } from 'react'
  3. import { usePathname } from 'next/navigation'
  4. import s from './index.module.css'
  5. import { useEventEmitterContextContext } from '@/context/event-emitter'
  6. import classNames from '@/utils/classnames'
  7. type HeaderWrapperProps = {
  8. children: React.ReactNode
  9. }
  10. const HeaderWrapper = ({
  11. children,
  12. }: HeaderWrapperProps) => {
  13. const pathname = usePathname()
  14. const isBordered = ['/apps', '/datasets', '/datasets/create', '/tools'].includes(pathname)
  15. // // Check if the current path is a workflow canvas & fullscreen
  16. const inWorkflowCanvas = pathname.endsWith('/workflow')
  17. const workflowCanvasMaximize = localStorage.getItem('workflow-canvas-maximize') === 'true'
  18. const [hideHeader, setHideHeader] = useState(workflowCanvasMaximize)
  19. const { eventEmitter } = useEventEmitterContextContext()
  20. eventEmitter?.useSubscription((v: any) => {
  21. if (v?.type === 'workflow-canvas-maximize')
  22. setHideHeader(v.payload)
  23. })
  24. if (hideHeader && inWorkflowCanvas)
  25. return null
  26. return (
  27. <div className={classNames(
  28. 'sticky top-0 left-0 right-0 z-30 flex flex-col grow-0 shrink-0 basis-auto min-h-[56px]',
  29. s.header,
  30. isBordered ? 'border-b border-divider-regular' : '',
  31. )}
  32. >
  33. {children}
  34. </div>
  35. )
  36. }
  37. export default HeaderWrapper