Merge branch 'ws-connection-closed' into 'dev'

Download button

See merge request turris/reforis/foris-js!22

src/bootstrap/DownloadButton.js

@@ -0,0 +1,21 @@
+/*
+ * Copyright (C) 2019 CZ.NIC z.s.p.o. (http://www.nic.cz/)
+ *
+ * This is free software, licensed under the GNU General Public License v3.
+ * See /LICENSE for more information.
+ */
+
+import React from "react";
+import PropTypes from "prop-types";
+
+DownloadButton.propTypes = {
+    href: PropTypes.string.isRequired,
+    children: PropTypes.oneOfType([
+        PropTypes.arrayOf(PropTypes.node),
+        PropTypes.node,
+    ]),
+};
+
+export function DownloadButton({ href, children }) {
+    return <a href={href} className="btn btn-primary" download>{children}</a>;
+}

src/bootstrap/DownloadButton.md

@@ -0,0 +1,7 @@
+Hyperlink with apperance of a button.
+
+It has `download` attribute, which prevents closing WebSocket connection on Firefox. See [related issue](https://bugzilla.mozilla.org/show_bug.cgi?id=858538) for more details.
+
+```js
+<DownloadButton href="example.zip">Download</DownloadButton>
+```

src/bootstrap/__tests__/DownloadButton.test.js

@@ -0,0 +1,19 @@
+/*
+ * Copyright (C) 2019 CZ.NIC z.s.p.o. (http://www.nic.cz/)
+ *
+ * This is free software, licensed under the GNU General Public License v3.
+ * See /LICENSE for more information.
+ */
+
+import React from "react";
+
+import { render } from "customTestRender";
+
+import { DownloadButton } from "../DownloadButton";
+
+describe("<DownloadButton />", () => {
+    it("should have download attribute", () => {
+        const { container } = render(<DownloadButton href="http://example.com">Test Button</DownloadButton>);
+        expect(container.firstChild.getAttribute("download")).not.toBeNull();
+    });
+});

src/index.js

@@ -15,6 +15,7 @@ export { useAPIPatch } from "api/patch";
 export { Alert } from "bootstrap/Alert";
 export { Button } from "bootstrap/Button";
 export { CheckBox } from "bootstrap/CheckBox";
+export { DownloadButton } from "bootstrap/DownloadButton";
 export { DataTimeInput } from "bootstrap/DataTimeInput";
 export { EmailInput } from "bootstrap/EmailInput";
 export { FileInput } from "bootstrap/FileInput";