finish delete implementation and restructure components

scm-ui/src/repos/components/DeleteNavAction.js

@@ -0,0 +1,59 @@
+//@flow
+import React from "react";
+import { translate } from "react-i18next";
+import { confirmAlert } from "../../components/modals/ConfirmAlert";
+import { NavAction } from "../../components/navigation";
+import type { Repository } from "../types/Repositories";
+
+type Props = {
+  repository: Repository,
+  confirmDialog?: boolean,
+  delete: Repository => void,
+
+  // context props
+  t: string => string
+};
+
+class DeleteNavAction extends React.Component<Props> {
+  static defaultProps = {
+    confirmDialog: true
+  };
+
+  delete = () => {
+    this.props.delete(this.props.repository);
+  };
+
+  confirmDelete = () => {
+    const { t } = this.props;
+    confirmAlert({
+      title: t("delete-nav-action.confirm-alert.title"),
+      message: t("delete-nav-action.confirm-alert.message"),
+      buttons: [
+        {
+          label: t("delete-nav-action.confirm-alert.submit"),
+          onClick: () => this.delete()
+        },
+        {
+          label: t("delete-nav-action.confirm-alert.cancel"),
+          onClick: () => null
+        }
+      ]
+    });
+  };
+
+  isDeletable = () => {
+    return this.props.repository._links.delete;
+  };
+
+  render() {
+    const { confirmDialog, t } = this.props;
+    const action = confirmDialog ? this.confirmDelete : this.delete();
+
+    if (!this.isDeletable()) {
+      return null;
+    }
+    return <NavAction label={t("delete-nav-action.label")} action={action} />;
+  }
+}
+
+export default translate("repos")(DeleteNavAction);

scm-ui/src/repos/components/DeleteNavAction.test.js

@@ -0,0 +1,79 @@
+import React from "react";
+import { mount, shallow } from "enzyme";
+import "../../tests/enzyme";
+import "../../tests/i18n";
+import DeleteNavAction from "./DeleteNavAction";
+
+import { confirmAlert } from "../../components/modals/ConfirmAlert";
+jest.mock("../../components/modals/ConfirmAlert");
+
+describe("DeleteNavAction", () => {
+  it("should render nothing, if the delete link is missing", () => {
+    const repository = {
+      _links: {}
+    };
+
+    const navLink = shallow(
+      <DeleteNavAction repository={repository} delete={() => {}} />
+    );
+    expect(navLink.text()).toBe("");
+  });
+
+  it("should render the navLink", () => {
+    const repository = {
+      _links: {
+        delete: {
+          href: "/repositories"
+        }
+      }
+    };
+
+    const navLink = mount(
+      <DeleteNavAction repository={repository} delete={() => {}} />
+    );
+    expect(navLink.text()).not.toBe("");
+  });
+
+  it("should open the confirm dialog on navLink click", () => {
+    const repository = {
+      _links: {
+        delete: {
+          href: "/repositorys"
+        }
+      }
+    };
+
+    const navLink = mount(
+      <DeleteNavAction repository={repository} delete={() => {}} />
+    );
+    navLink.find("a").simulate("click");
+
+    expect(confirmAlert.mock.calls.length).toBe(1);
+  });
+
+  it("should call the delete repository function with delete url", () => {
+    const repository = {
+      _links: {
+        delete: {
+          href: "/repos"
+        }
+      }
+    };
+
+    let calledUrl = null;
+    function capture(repository) {
+      calledUrl = repository._links.delete.href;
+    }
+
+    const navLink = mount(
+      <DeleteNavAction
+        repository={repository}
+        confirmDialog={false}
+        delete={capture}
+      />
+    );
+    navLink.find("a").simulate("click");
+
+    expect(calledUrl).toBe("/repos");
+  });
+});

scm-ui/src/repos/components/form/RepositoryForm.js

@@ -1,12 +1,12 @@
 // @flow
 import React from "react";
 import { translate } from "react-i18next";
-import { InputField, Select } from "../../components/forms";
-import { SubmitButton } from "../../components/buttons";
-import type { Repository } from "../types/Repositories";
+import { InputField, Select } from "../../../components/forms/index";
+import { SubmitButton } from "../../../components/buttons/index";
+import type { Repository } from "../../types/Repositories";
 import * as validator from "./repositoryValidation";
-import type { RepositoryType } from "../types/RepositoryTypes";
-import Textarea from "../../components/forms/Textarea";
+import type { RepositoryType } from "../../types/RepositoryTypes";
+import Textarea from "../../../components/forms/Textarea";
 
 type Props = {
   submitForm: Repository => void,

scm-ui/src/repos/components/form/index.js

@@ -0,0 +1,2 @@
+import RepositoryForm from "./RepositoryForm";
+export default RepositoryForm;

scm-ui/src/repos/components/form/repositoryValidation.js

@@ -1,5 +1,5 @@
 // @flow
-import * as generalValidator from "../../components/validation";
+import * as generalValidator from "../../../components/validation";
 
 export const isNameValid = (name: string) => {
   return generalValidator.isNameValid(name);

scm-ui/src/repos/components/list/RepositoryEntry.js

@@ -2,12 +2,12 @@
 import React from "react";
 import { Link } from "react-router-dom";
 import injectSheet from "react-jss";
-import type { Repository } from "../types/Repositories";
-import DateFromNow from "../../components/DateFromNow";
+import type { Repository } from "../../types/Repositories";
+import DateFromNow from "../../../components/DateFromNow";
 import RepositoryEntryLink from "./RepositoryEntryLink";
 import classNames from "classnames";
 
-import icon from "../../images/blib.jpg";
+import icon from "../../../images/blib.jpg";
 
 // TODO we need a variable or something central for the hover
 

scm-ui/src/repos/components/list/RepositoryGroupEntry.js

@@ -1,6 +1,6 @@
 //@flow
 import React from "react";
-import type { RepositoryGroup } from "../types/Repositories";
+import type { RepositoryGroup } from "../../types/Repositories";
 import injectSheet from "react-jss";
 import classNames from "classnames";
 import RepositoryEntry from "./RepositoryEntry";

scm-ui/src/repos/components/list/RepositoryList.js

@@ -1,7 +1,7 @@
 //@flow
 import React from "react";
 
-import type { Repository } from "../types/Repositories";
+import type { Repository } from "../../types/Repositories";
 
 import groupByNamespace from "./groupByNamespace";
 import RepositoryGroupEntry from "./RepositoryGroupEntry";

scm-ui/src/repos/components/list/groupByNamespace.js

@@ -1,5 +1,5 @@
 // @flow
-import type { Repository, RepositoryGroup } from "../types/Repositories";
+import type { Repository, RepositoryGroup } from "../../types/Repositories";
 
 export default function groupByNamespace(
   repositories: Repository[]

scm-ui/src/repos/components/list/index.js

@@ -0,0 +1,2 @@
+import RepositoryList from "./RepositoryList";
+export default RepositoryList;