Skip to content
This repository has been archived by the owner on Jan 11, 2023. It is now read-only.

Convert CommandBar to JSX #3614

Merged
merged 1 commit into from Aug 14, 2017
Merged

Convert CommandBar to JSX #3614

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
40 changes: 22 additions & 18 deletions src/components/SecondaryPanes/CommandBar.js
View file
Open in desktop
@@ -1,8 +1,8 @@
// @flow
import { DOM as dom, Component, PropTypes } from "react";

import React, { Component, PropTypes } from "react";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import classnames from "classnames";
import {
getPause,
getIsWaitingOnBreak,
Expand Down Expand Up @@ -68,20 +68,23 @@ function formatKey(action) {
}

function debugBtn(onClick, type, className, tooltip, disabled = false) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe function debugBtn({ type, className, tooltip, ...rest }) then you can make that block below

return (
  <button className={classnames(type, className)} title={tooltip} aria-label={tooltip} {...rest}>
    {Svg(type)}
  </button>
);

)

className = `${type} ${className}`;
return dom.button(
{
onClick,
className,
key: type,
"aria-label": tooltip,
title: tooltip,
disabled
},
Svg(type)
const props = {
onClick,
key: type,
"aria-label": tooltip,
title: tooltip,
disabled
};

return (
<button className={classnames(type, className)} {...props}>
{Svg(type)}
</button>
);
}

debugBtn.displayName = "CommandBarButton";

class CommandBar extends Component {
props: {
sources: SourcesMap,
Expand Down Expand Up @@ -231,11 +234,12 @@ class CommandBar extends Component {
}

render() {
return dom.div(
{ className: "command-bar" },
this.renderPauseButton(),
this.renderStepButtons(),
this.renderPauseOnExceptions()
return (
<div className="command-bar">
{this.renderPauseButton()}
{this.renderStepButtons()}
{this.renderPauseOnExceptions()}
</div>
);
}
}
Expand Down