clarified ButtonGroup vs ButtonAddons

scm-ui-components/packages/ui-components/src/buttons/ButtonAddons.js

@@ -0,0 +1,29 @@
+// @flow
+import * as React from "react";
+import classNames from "classnames";
+
+type Props = {
+  className?: string,
+  children: React.Node
+};
+
+class ButtonAddons extends React.Component<Props> {
+  render() {
+    const { className, children } = this.props;
+
+    var childWrapper = [];
+    React.Children.forEach(children, child => {
+      if (child) {
+        childWrapper.push(<p className="control">{child}</p>);
+      }
+    });
+
+    return (
+      <div className={classNames("field", "is-addons", className)}>
+        {childWrapper}
+      </div>
+    );
+  }
+}
+
+export default ButtonAddons;

scm-ui-components/packages/ui-components/src/buttons/ButtonGroup.js

@@ -3,39 +3,24 @@ import * as React from "react";
 import classNames from "classnames";
 
 type Props = {
-  connected?: boolean,
-  addons?: boolean,
   className?: string,
   children: React.Node
 };
 
 class ButtonGroup extends React.Component<Props> {
-
-  static defaultProps = {
-    addons: true
-  };
-
   render() {
-    const {connected, addons, className, children} = this.props;
+    const { className, children } = this.props;
 
-    if (!connected) {
-      var childWrapper = [];
-      React.Children.forEach(children, child => {
-        if (child) {
-          childWrapper.push(<p className="control">{child}</p>);
-        }
-      });
-
-      return (
-        <div className={classNames("field", "is-grouped", className)}>
-          {childWrapper}
-        </div>
-      );
-    }
+    var childWrapper = [];
+    React.Children.forEach(children, child => {
+      if (child) {
+        childWrapper.push(<p className="control">{child}</p>);
+      }
+    });
 
     return (
-      <div className={classNames("buttons", addons ? "has-addons" : "", className)}>
-        {children}
+      <div className={classNames("field", "is-grouped", className)}>
+        {childWrapper}
       </div>
     );
   }

scm-ui-components/packages/ui-components/src/buttons/index.js

@@ -8,6 +8,7 @@ export { default as EditButton } from "./EditButton.js";
 export { default as SubmitButton } from "./SubmitButton.js";
 export { default as DownloadButton } from "./DownloadButton.js";
 export { default as ButtonGroup } from "./ButtonGroup.js";
+export { default as ButtonAddons } from "./ButtonAddons.js";
 export {
   default as RemoveEntryOfTableButton
 } from "./RemoveEntryOfTableButton.js";

scm-ui-components/packages/ui-components/src/repos/DiffFile.js

@@ -241,7 +241,7 @@ class DiffFile extends React.Component<Props, State> {
               {this.renderChangeTag(file)}
             </div>
             <div className={classNames("level-right", classes.buttonHeader)}>
-              <ButtonGroup connected={false}>
+              <ButtonGroup>
                 <Button
                   action={this.toggleSideBySide}
                   className="reduced-mobile"

scm-ui-components/packages/ui-components/src/repos/changesets/ChangesetButtonGroup.js

@@ -1,8 +1,7 @@
 //@flow
 import React from "react";
 import type { Changeset, Repository } from "@scm-manager/ui-types";
-import ButtonGroup from "../../buttons/ButtonGroup";
-import Button from "../../buttons/Button";
+import { ButtonAddons, Button } from "../../buttons";
 import { createChangesetLink, createSourcesLink } from "./changesets";
 import { translate } from "react-i18next";
 
@@ -22,7 +21,7 @@ class ChangesetButtonGroup extends React.Component<Props> {
     const sourcesLink = createSourcesLink(repository, changeset);
 
     return (
-      <ButtonGroup connected={true} className="is-pulled-right">
+      <ButtonAddons className="is-pulled-right">
         <Button link={changesetLink} className="reduced-mobile">
           <span className="icon">
             <i className="fas fa-exchange-alt" />
@@ -35,7 +34,7 @@ class ChangesetButtonGroup extends React.Component<Props> {
           </span>
           <span>{t("changeset.buttons.sources")}</span>
         </Button>
-      </ButtonGroup>
+      </ButtonAddons>
     );
   }
 }