add route to set password component

scm-ui/public/locales/en/users.json

@@ -29,6 +29,9 @@
   "edit-user-button": {
     "label": "Edit"
   },
+  "set-password-button": {
+    "label": "Set password"
+  },
   "user-form": {
     "submit": "Submit"
   },

scm-ui/src/users/components/SetUserPassword.js

@@ -0,0 +1,17 @@
+// @flow
+import React from "react";
+import type { User } from "@scm-manager/ui-types";
+
+type Props = {
+  user: User
+};
+
+export default class SetUserPassword extends React.Component<Props> {
+
+  render() {
+
+    return (
+      "Hey, Change Password!"
+    );
+  }
+}

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

@@ -0,0 +1,28 @@
+//@flow
+import React from "react";
+import { translate } from "react-i18next";
+import type { User } from "@scm-manager/ui-types";
+import { NavLink } from "@scm-manager/ui-components";
+
+type Props = {
+  t: string => string,
+  user: User,
+  passwordUrl: String
+};
+
+class ChangePasswordNavLink extends React.Component<Props> {
+  render() {
+    const { t, passwordUrl } = this.props;
+
+    if (!this.hasPermissionToSetPassword()) {
+      return null;
+    }
+    return <NavLink label={t("set-password-button.label")} to={passwordUrl} />;
+  }
+
+  hasPermissionToSetPassword = () => {
+    return this.props.user._links.password;
+  };
+}
+
+export default translate("users")(ChangePasswordNavLink);

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

@@ -0,0 +1,31 @@
+import React from "react";
+import { shallow } from "enzyme";
+import "../../../tests/enzyme";
+import "../../../tests/i18n";
+import ChangePasswordNavLink from "./SetPasswordNavLink";
+
+it("should render nothing, if the password link is missing", () => {
+  const user = {
+    _links: {}
+  };
+
+  const navLink = shallow(
+    <ChangePasswordNavLink user={user} passwordUrl="/user/password" />
+  );
+  expect(navLink.text()).toBe("");
+});
+
+it("should render the navLink", () => {
+  const user = {
+    _links: {
+      password: {
+        href: "/password"
+      }
+    }
+  };
+
+  const navLink = shallow(
+    <ChangePasswordNavLink user={user} passwordUrl="/user/password" />
+  );
+  expect(navLink.text()).not.toBe("");
+});

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

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

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

@@ -24,9 +24,14 @@ import {
   getDeleteUserFailure
 } from "../modules/users";
 
-import { DeleteUserNavLink, EditUserNavLink } from "./../components/navLinks";
+import {
+  DeleteUserNavLink,
+  EditUserNavLink,
+  SetPasswordNavLink
+} from "./../components/navLinks";
 import { translate } from "react-i18next";
 import { getUsersLink } from "../../modules/indexResource";
+import SetUserPassword from "../components/SetUserPassword";
 
 type Props = {
   name: string,
@@ -97,6 +102,10 @@ class SingleUser extends React.Component<Props> {
               path={`${url}/edit`}
               component={() => <EditUser user={user} />}
             />
+            <Route
+              path={`${url}/password`}
+              component={() => <SetUserPassword user={user} />}
+            />
           </div>
           <div className="column">
             <Navigation>
@@ -106,6 +115,10 @@ class SingleUser extends React.Component<Props> {
                   label={t("single-user.information-label")}
                 />
                 <EditUserNavLink user={user} editUrl={`${url}/edit`} />
+                <SetPasswordNavLink
+                  user={user}
+                  passwordUrl={`${url}/password`}
+                />
               </Section>
               <Section label={t("single-user.actions-label")}>
                 <DeleteUserNavLink user={user} deleteUser={this.deleteUser} />