1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
|
/*
* SonarQube
* Copyright (C) 2009-2023 SonarSource SA
* mailto:info AT sonarsource DOT com
*
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU Lesser General Public
* License as published by the Free Software Foundation; either
* version 3 of the License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
* Lesser General Public License for more details.
*
* You should have received a copy of the GNU Lesser General Public License
* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
import { DraggableCore, DraggableData } from 'react-draggable';
import { ButtonIcon } from '../../components/controls/buttons';
import ClearIcon from '../../components/icons/ClearIcon';
import CollapseIcon from '../../components/icons/CollapseIcon';
import ExpandIcon from '../../components/icons/ExpandIcon';
import { IconProps } from '../../components/icons/Icon';
import MinimizeIcon from '../../components/icons/MinimizeIcon';
import { translate } from '../../helpers/l10n';
export interface Props {
children: React.ReactNode;
maximized?: boolean;
onClose: () => void;
onCollapse: () => void;
onMaximize: () => void;
onMinimize: () => void;
onResize: (deltaY: number) => void;
}
export default class WorkspaceHeader extends React.PureComponent<Props> {
handleDrag = (_event: MouseEvent, data: DraggableData) => {
this.props.onResize(data.deltaY);
};
render() {
return (
<header className="workspace-viewer-header">
<h6 className="workspace-viewer-name">{this.props.children}</h6>
<DraggableCore offsetParent={document.body} onDrag={this.handleDrag}>
<div className="workspace-viewer-resize js-resize" />
</DraggableCore>
<div className="workspace-viewer-actions">
<WorkspaceHeaderButton
icon={MinimizeIcon}
onClick={this.props.onCollapse}
tooltip="workspace.minimize"
/>
{this.props.maximized ? (
<WorkspaceHeaderButton
icon={CollapseIcon}
onClick={this.props.onMinimize}
tooltip="workspace.normal_size"
/>
) : (
<WorkspaceHeaderButton
icon={ExpandIcon}
onClick={this.props.onMaximize}
tooltip="workspace.full_window"
/>
)}
<WorkspaceHeaderButton
icon={ClearIcon}
onClick={this.props.onClose}
tooltip="workspace.close"
/>
</div>
</header>
);
}
}
interface WorkspaceHeaderButtonProps {
icon: React.FC<React.PropsWithChildren<React.PropsWithChildren<IconProps>>>;
onClick: () => void;
tooltip: string;
}
function WorkspaceHeaderButton({ icon: Icon, onClick, tooltip }: WorkspaceHeaderButtonProps) {
return (
<ButtonIcon
className="workspace-header-icon"
aria-label={translate(tooltip)}
color="#fff"
onClick={onClick}
tooltip={translate(tooltip)}
>
<Icon fill={undefined} />
</ButtonIcon>
);
}
|
