mirror of
https://github.com/dergigi/boris.git
synced 2026-02-17 04:54:56 +01:00
9ae918f744
- Create useFilteredHighlights hook for highlight filtering - Extract HighlightsPanelCollapsed component - Extract HighlightsPanelHeader component - Reduce HighlightsPanel.tsx from 232 lines to 118 lines
31 lines
911 B
TypeScript
31 lines
911 B
TypeScript
import React from 'react'
|
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
|
import { faHighlighter, faChevronRight } from '@fortawesome/free-solid-svg-icons'
|
|
|
|
interface HighlightsPanelCollapsedProps {
|
|
hasHighlights: boolean
|
|
onToggleCollapse: () => void
|
|
}
|
|
|
|
const HighlightsPanelCollapsed: React.FC<HighlightsPanelCollapsedProps> = ({
|
|
hasHighlights,
|
|
onToggleCollapse
|
|
}) => {
|
|
return (
|
|
<div className="highlights-container collapsed">
|
|
<button
|
|
onClick={onToggleCollapse}
|
|
className={`toggle-highlights-btn with-icon ${hasHighlights ? 'has-highlights' : ''}`}
|
|
title="Expand highlights panel"
|
|
aria-label="Expand highlights panel"
|
|
>
|
|
<FontAwesomeIcon icon={faHighlighter} className={hasHighlights ? 'glow' : ''} />
|
|
<FontAwesomeIcon icon={faChevronRight} />
|
|
</button>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default HighlightsPanelCollapsed
|
|
|