overleaf-cep/services/web/frontend/js/features/ide-redesign/components/rail-panel-header.tsx
David f0d2df3c43 Merge pull request #27040 from overleaf/dp-file-tree-close-button
Add close button to file tree rail panel

GitOrigin-RevId: d8abac122e266922b9ca914bc5df6ae7895b3796
2025-07-11 08:06:19 +00:00

38 lines
1 KiB
TypeScript

import { useTranslation } from 'react-i18next'
import { useRailContext } from '../contexts/rail-context'
import OLIconButton from '@/features/ui/components/ol/ol-icon-button'
import React from 'react'
import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
export default function RailPanelHeader({
title,
actions,
}: {
title: string
actions?: React.ReactNode[]
}) {
const { t } = useTranslation()
const { handlePaneCollapse } = useRailContext()
return (
<header className="rail-panel-header">
<h4 className="rail-panel-title">{title}</h4>
<div className="rail-panel-header-actions">
{actions}
<OLTooltip
id="close-rail-panel"
description={t('close')}
overlayProps={{ placement: 'bottom' }}
>
<OLIconButton
onClick={handlePaneCollapse}
className="rail-panel-header-button-subdued"
icon="close"
accessibilityLabel={t('close')}
size="sm"
/>
</OLTooltip>
</div>
</header>
)
}