1
0
mirror of https://gitlab.nic.cz/turris/reforis/foris-js.git synced 2024-11-14 17:35:35 +01:00

Compare commits

..

1 Commits

Author SHA1 Message Date
Štěpán Henek
6d70eef2fb Merge branch 'feature/ws-included' into 'dev'
Using socket.io for websocket handling and make reforis configurable

See merge request turris/reforis/foris-js!201
2024-09-27 22:44:39 +02:00
7 changed files with 12 additions and 39 deletions

View File

@ -8,13 +8,6 @@ and this project adheres to
## [Unreleased] ## [Unreleased]
## [6.4.0] - 2024-10-02
### Changed
- Refactored Alert component to include dismiss animation and timeout
- Refactored ThreeDotsMenu component to include additional props
## [6.3.0] - 2024-09-27 ## [6.3.0] - 2024-09-27
### Added ### Added
@ -405,8 +398,7 @@ and this project adheres to
## [0.0.7] - 2019-09-02 ## [0.0.7] - 2019-09-02
[unreleased]: [unreleased]:
https://gitlab.nic.cz/turris/reforis/foris-js/-/compare/v6.4.0...dev https://gitlab.nic.cz/turris/reforis/foris-js/-/compare/v6.3.0...dev
[6.4.0]: https://gitlab.nic.cz/turris/reforis/foris-js/-/compare/v6.3.0...v6.4.0
[6.3.0]: https://gitlab.nic.cz/turris/reforis/foris-js/-/compare/v6.2.1...v6.3.0 [6.3.0]: https://gitlab.nic.cz/turris/reforis/foris-js/-/compare/v6.2.1...v6.3.0
[6.2.1]: https://gitlab.nic.cz/turris/reforis/foris-js/-/compare/v6.2.0...v6.2.1 [6.2.1]: https://gitlab.nic.cz/turris/reforis/foris-js/-/compare/v6.2.0...v6.2.1
[6.2.0]: https://gitlab.nic.cz/turris/reforis/foris-js/-/compare/v6.1.1...v6.2.0 [6.2.0]: https://gitlab.nic.cz/turris/reforis/foris-js/-/compare/v6.1.1...v6.2.0

4
package-lock.json generated
View File

@ -1,12 +1,12 @@
{ {
"name": "foris", "name": "foris",
"version": "6.4.0", "version": "6.3.0",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "foris", "name": "foris",
"version": "6.4.0", "version": "6.3.0",
"license": "GPL-3.0", "license": "GPL-3.0",
"dependencies": { "dependencies": {
"@fortawesome/fontawesome-svg-core": "^6.6.0", "@fortawesome/fontawesome-svg-core": "^6.6.0",

View File

@ -1,6 +1,6 @@
{ {
"name": "foris", "name": "foris",
"version": "6.4.0", "version": "6.3.0",
"description": "Foris JS library is a set of components and utils for reForis application and plugins.", "description": "Foris JS library is a set of components and utils for reForis application and plugins.",
"author": "CZ.NIC, z.s.p.o.", "author": "CZ.NIC, z.s.p.o.",
"repository": { "repository": {

View File

@ -5,7 +5,7 @@
* See /LICENSE for more information. * See /LICENSE for more information.
*/ */
import React, { useRef, useEffect, useState } from "react"; import React, { useRef } from "react";
import PropTypes from "prop-types"; import PropTypes from "prop-types";
@ -40,36 +40,20 @@ Alert.defaultProps = {
function Alert({ type, onDismiss, children }) { function Alert({ type, onDismiss, children }) {
const alertRef = useRef(); const alertRef = useRef();
const [isVisible, setIsVisible] = useState(true);
useFocusTrap(alertRef, !!onDismiss); useFocusTrap(alertRef, !!onDismiss);
useEffect(() => {
if (onDismiss) {
const timeout = setTimeout(() => setIsVisible(false), 7000);
return () => clearTimeout(timeout);
}
}, [onDismiss]);
const handleAnimationEnd = () => {
if (!isVisible && onDismiss) {
onDismiss();
}
};
return ( return (
<div <div
ref={alertRef} ref={alertRef}
className={`alert alert-${type} ${isVisible ? "alert-fade-in" : "alert-slide-out-top"} ${ className={`alert alert-${type} ${
onDismiss ? "alert-dismissible" : "" onDismiss ? "alert-dismissible" : ""
}`.trim()} }`.trim()}
role="alert" role="alert"
onAnimationEnd={handleAnimationEnd}
> >
{onDismiss && ( {onDismiss && (
<button <button
type="button" type="button"
className="btn-close" className="btn-close"
onClick={() => setIsVisible(false)} onClick={onDismiss}
aria-label={_("Close")} aria-label={_("Close")}
/> />
)} )}

View File

@ -18,9 +18,9 @@ ThreeDotsMenu.propTypes = {
children: PropTypes.arrayOf(PropTypes.node).isRequired, children: PropTypes.arrayOf(PropTypes.node).isRequired,
}; };
function ThreeDotsMenu({ children, ...props }) { function ThreeDotsMenu({ children }) {
return ( return (
<div className="dropdown position-static" {...props}> <div className="dropdown">
<Button <Button
className="btn-sm btn-link text-body" className="btn-sm btn-link text-body"
data-bs-toggle="dropdown" data-bs-toggle="dropdown"

View File

@ -43,17 +43,14 @@ describe("AlertContext", () => {
expect(componentContainer).toMatchSnapshot(); expect(componentContainer).toMatchSnapshot();
}); });
it("should dismiss alert with alert button", async () => { it("should dismiss alert with alert button", () => {
fireEvent.click(getByText(componentContainer, "Set alert")); fireEvent.click(getByText(componentContainer, "Set alert"));
// Alert is present // Alert is present
expect(getByText(componentContainer, "Alert content")).toBeDefined(); expect(getByText(componentContainer, "Alert content")).toBeDefined();
fireEvent.click(componentContainer.querySelector(".btn-close")); fireEvent.click(componentContainer.querySelector(".btn-close"));
// Alert is gone // Alert is gone
await (() => expect(queryByText(componentContainer, "Alert content")).toBeNull();
expect(
queryByText(componentContainer, "Alert content")
).toBeNull());
}); });
it("should dismiss alert with external button", () => { it("should dismiss alert with external button", () => {

View File

@ -6,7 +6,7 @@ exports[`AlertContext should render alert 1`] = `
id="alert-container" id="alert-container"
> >
<div <div
class="alert alert-danger alert-fade-in alert-dismissible" class="alert alert-danger alert-dismissible"
role="alert" role="alert"
> >
<button <button