Merged heads

scm-ui/src/users/components/buttons/EditUserButton.js

@@ -1,34 +0,0 @@
-//@flow
-import React from "react";
-import { translate } from "react-i18next";
-import { EditButton } from "../../../components/buttons";
-import type { UserEntry } from "../../types/UserEntry";
-
-type Props = {
-  t: string => string,
-  entry: UserEntry
-};
-
-class EditUserButton extends React.Component<Props> {
-  render() {
-    const { entry, t } = this.props;
-    const link = "/users/edit/" + entry.entry.name;
-
-    if (!this.isEditable()) {
-      return "";
-    }
-    return (
-      <EditButton
-        label={t("edit-user-button.label")}
-        link={link}
-        loading={entry.loading}
-      />
-    );
-  }
-
-  isEditable = () => {
-    return this.props.entry.entry._links.update;
-  };
-}
-
-export default translate("users")(EditUserButton);

scm-ui/src/users/components/buttons/EditUserButton.test.js

@@ -1,31 +0,0 @@
-import React from "react";
-import { shallow } from "enzyme";
-import "../../../tests/enzyme";
-import "../../../tests/i18n";
-import EditUserButton from "./EditUserButton";
-
-it("should render nothing, if the edit link is missing", () => {
-  const entry = {
-    entry: {
-      _links: {}
-    }
-  };
-
-  const button = shallow(<EditUserButton entry={entry} />);
-  expect(button.text()).toBe("");
-});
-
-it("should render the button", () => {
-  const entry = {
-    entry: {
-      _links: {
-        update: {
-          href: "/users"
-        }
-      }
-    }
-  };
-
-  const button = shallow(<EditUserButton entry={entry} />);
-  expect(button.text()).not.toBe("");
-});

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

@@ -1,2 +0,0 @@
-export { default as DeleteUserButton } from "./DeleteUserButton";
-export { default as EditUserButton } from "./EditUserButton";

scm-ui/src/users/components/navLinks/DeleteUserNavLink.js

@@ -12,7 +12,7 @@ type Props = {
   deleteUser: (user: User) => void
 };
 
-class DeleteUserButton extends React.Component<Props> {
+class DeleteUserNavLink extends React.Component<Props> {
   static defaultProps = {
     confirmDialog: true
   };
@@ -54,4 +54,4 @@ class DeleteUserButton extends React.Component<Props> {
   }
 }
 
-export default translate("users")(DeleteUserButton);
+export default translate("users")(DeleteUserNavLink);

scm-ui/src/users/components/navLinks/DeleteUserNavLink.test.js

@@ -2,24 +2,24 @@ import React from "react";
 import { mount, shallow } from "enzyme";
 import "../../../tests/enzyme";
 import "../../../tests/i18n";
-import DeleteUserButton from "./DeleteUserButton";
+import DeleteUserNavLink from "./DeleteUserNavLink";
 
 import { confirmAlert } from "../../../components/modals/ConfirmAlert";
 jest.mock("../../../components/modals/ConfirmAlert");
 
-describe("DeleteUserButton", () => {
+describe("DeleteUserNavLink", () => {
   it("should render nothing, if the delete link is missing", () => {
     const user = {
       _links: {}
     };
 
-    const button = shallow(
-      <DeleteUserButton user={user} deleteUser={() => {}} />
+    const navLink = shallow(
+      <DeleteUserNavLink user={user} deleteUser={() => {}} />
     );
-    expect(button.text()).toBe("");
+    expect(navLink.text()).toBe("");
   });
 
-  it("should render the button", () => {
+  it("should render the navLink", () => {
     const user = {
       _links: {
         delete: {
@@ -28,13 +28,13 @@ describe("DeleteUserButton", () => {
       }
     };
 
-    const button = mount(
-      <DeleteUserButton user={user} deleteUser={() => {}} />
+    const navLink = mount(
+      <DeleteUserNavLink user={user} deleteUser={() => {}} />
     );
-    expect(button.text()).not.toBe("");
+    expect(navLink.text()).not.toBe("");
   });
 
-  it("should open the confirm dialog on button click", () => {
+  it("should open the confirm dialog on navLink click", () => {
     const user = {
       _links: {
         delete: {
@@ -43,10 +43,10 @@ describe("DeleteUserButton", () => {
       }
     };
 
-    const button = mount(
-      <DeleteUserButton user={user} deleteUser={() => {}} />
+    const navLink = mount(
+      <DeleteUserNavLink user={user} deleteUser={() => {}} />
     );
-    button.find("a").simulate("click");
+    navLink.find("a").simulate("click");
 
     expect(confirmAlert.mock.calls.length).toBe(1);
   });
@@ -65,14 +65,14 @@ describe("DeleteUserButton", () => {
       calledUrl = user._links.delete.href;
     }
 
-    const button = mount(
-      <DeleteUserButton
+    const navLink = mount(
+      <DeleteUserNavLink
         user={user}
         confirmDialog={false}
         deleteUser={capture}
       />
     );
-    button.find("a").simulate("click");
+    navLink.find("a").simulate("click");
 
     expect(calledUrl).toBe("/users");
   });

scm-ui/src/users/components/navLinks/EditUserNavLink.js

@@ -0,0 +1,28 @@
+//@flow
+import React from "react";
+import { translate } from "react-i18next";
+import type { UserEntry } from "../../types/UserEntry";
+import { NavLink } from "../../../components/navigation";
+
+type Props = {
+  t: string => string,
+  user: UserEntry,
+  editUrl: String
+};
+
+class EditUserNavLink extends React.Component<Props> {
+  render() {
+    const { t, editUrl } = this.props;
+
+    if (!this.isEditable()) {
+      return null;
+    }
+    return <NavLink label={t("edit-user-button.label")} to={editUrl} />;
+  }
+
+  isEditable = () => {
+    return this.props.user._links.update;
+  };
+}
+
+export default translate("users")(EditUserNavLink);

scm-ui/src/users/components/navLinks/EditUserNavLink.test.js

@@ -0,0 +1,27 @@
+import React from "react";
+import { shallow } from "enzyme";
+import "../../../tests/enzyme";
+import "../../../tests/i18n";
+import EditUserNavLink from "./EditUserNavLink";
+
+it("should render nothing, if the edit link is missing", () => {
+  const user = {
+      _links: {}
+  };
+
+  const navLink = shallow(<EditUserNavLink user={user} editUrl='/user/edit'/>);
+  expect(navLink.text()).toBe("");
+});
+
+it("should render the navLink", () => {
+  const user = {
+      _links: {
+        update: {
+          href: "/users"
+        }
+      }
+  };
+
+  const navLink = shallow(<EditUserNavLink user={user} editUrl='/user/edit'/>);
+  expect(navLink.text()).not.toBe("");
+});

scm-ui/src/users/components/navLinks/index.js

@@ -0,0 +1,2 @@
+export { default as DeleteUserNavLink } from "./DeleteUserNavLink";
+export { default as EditUserNavLink } from "./EditUserNavLink";

scm-ui/src/users/containers/SingleUser.js

@@ -1,18 +1,18 @@
 //@flow
 import React from "react";
-import {connect} from "react-redux";
-import {Page} from "../../components/layout";
-import {Route} from "react-router";
-import {Details} from "./../components/table";
+import { connect } from "react-redux";
+import { Page } from "../../components/layout";
+import { Route } from "react-router";
+import { Details } from "./../components/table";
 import EditUser from "./EditUser";
-import type {User} from "../types/User";
-import type {UserEntry} from "../types/UserEntry";
-import type {History} from "history";
-import {deleteUser, fetchUser} from "../modules/users";
+import type { User } from "../types/User";
+import type { UserEntry } from "../types/UserEntry";
+import type { History } from "history";
+import { fetchUser, deleteUser } from "../modules/users";
 import Loading from "../../components/Loading";
 
-import {Navigation, NavLink, Section} from "../../components/navigation";
-import {DeleteUserButton} from "./../components/buttons";
+import { Navigation, Section, NavLink } from "../../components/navigation";
+import { DeleteUserNavLink, EditUserNavLink } from "./../components/navLinks";
 import ErrorPage from "../../components/ErrorPage";
 
 type Props = {
@@ -84,10 +84,10 @@ class SingleUser extends React.Component<Props> {
             <Navigation>
               <Section label="Navigation">
                 <NavLink to={`${url}`} label="Information" />
-                <NavLink to={`${url}/edit`} label="Edit" />
+                <EditUserNavLink user={user} editUrl={`${url}/edit`} />
               </Section>
               <Section label="Actions">
-                <DeleteUserButton user={user} deleteUser={this.deleteUser} />
+                <DeleteUserNavLink user={user} deleteUser={this.deleteUser} />
                 <NavLink to="/users" label="Back" />
               </Section>
             </Navigation>