Feliday/Feliday-UI
5
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

added Keybind handler

Browse source
This commit is contained in:
dankxiaobong 2023-07-03 19:04:24 +02:00
parent a5d183f4e7
commit 47e98c2b85
1 changed files with 17 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
src/shared/components/comment/comment-node.tsx
View file

@ -292,15 +292,16 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
mark: this.isCommentNew || this.commentView.comment.distinguished,
})}
>
<button
<div
className={classNames({
"ms-2": !this.props.noIndent,
})}
onClick={linkEvent(this, this.handleCommentCollapse)}
role={"textbox"}
onKeyDown={linkEvent(this, this.handleKeyBinds)}
aria-label={this.expandText}
data-tippy-content={this.expandText}
tabIndex={cv.comment.id}
role="button"
tabIndex={0}
>
<div className="d-flex flex-wrap align-items-center text-muted small">
<button
@ -308,6 +309,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
onClick={linkEvent(this, this.handleCommentCollapse)}
aria-label={this.expandText}
data-tippy-content={this.expandText}
aria-expanded={this.state.collapsed}
>
<Icon
icon={`${this.state.collapsed ? "plus" : "minus"}-square`}
@ -926,7 +928,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
{/* end of button group */}
</div>
)}
</button>
</div>
</article>
{showMoreChildren && (
<div
@ -1421,6 +1423,17 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
return isBefore(now, then);
}
handleKeyBinds(i: CommentNode, event: KeyboardEvent) {
if (event.ctrlKey || event.metaKey) {
switch (event.key) {
case "ArrowLeft": {
i.handleCommentCollapse(i, event);
break;
}
}
}
}
handleCommentCollapse(i: CommentNode, event: any) {
event.stopPropagation();
i.setState({ collapsed: !i.state.collapsed });