From f1656acf0f64f0d132979dabe0fd8ccbd7f7ce96 Mon Sep 17 00:00:00 2001 From: John Kapantzakis Date: Mon, 27 Mar 2023 13:35:58 +0300 Subject: [PATCH 1/3] Revert "Loading state on confirmation dialog (#452)" This reverts commit abfc11d650b4c16cd2d5a14e0f6711a0c48f63e3. --- README.md | 15 --------------- .../confirmation-dialog.js | 18 +++--------------- .../confirmation-dialog.stories.js | 19 ------------------- 3 files changed, 3 insertions(+), 49 deletions(-) diff --git a/README.md b/README.md index 987248fd8..aaaf12ce8 100644 --- a/README.md +++ b/README.md @@ -20,21 +20,6 @@ export const MyComponent: FC = (props: PropsT) => <>... You can find latest **master** storybook playground [here](https://netdata.github.io/netdata-ui/) -## Local development - -First, install the dependencies -``` -yarn -``` - -then, build the project and start -``` -yarn build && yarn start -``` - -Open your browser to [localhost:6006](http://localhost:6006) and view the storybook locally. - - ## Components - [Theme and theme utils](https://github.com/netdata/netdata-ui/blob/master/src/theme) diff --git a/src/components/confirmation-dialog/confirmation-dialog.js b/src/components/confirmation-dialog/confirmation-dialog.js index cd1e1d92c..a9bb31684 100644 --- a/src/components/confirmation-dialog/confirmation-dialog.js +++ b/src/components/confirmation-dialog/confirmation-dialog.js @@ -2,7 +2,6 @@ import React from "react" import Flex from "src/components/templates/flex" import { Button } from "src/components/button" import { Text } from "src/components/typography" -import useToggle from "react-use/lib/useToggle" import { Actions, Body, CloseButton, Content, Dialog, Header, Title, TitleIcon } from "./styled" const BodyMessage = ({ children, ...rest }) => @@ -10,7 +9,6 @@ const BodyMessage = ({ children, ...rest }) => const ConfirmationDialog = ({ confirmLabel = "Yes, remove", - confirmLoadingLabel = "Loading...", confirmWidth = "128px", "data-ga": dataGA = "confirmation-dialog", "data-testid": dataTestId = "confirmationDialog", @@ -24,16 +22,7 @@ const ConfirmationDialog = ({ isConfirmPositive, message, title, - showConfirmLoading, - disableConfirmOnLoading, }) => { - const [loading, toggleLoading] = useToggle(false) - - const onConfirm = e => { - if (showConfirmLoading) toggleLoading() - handleConfirm(e, toggleLoading) - } - return ( @@ -64,11 +53,10 @@ const ConfirmationDialog = ({ data-ga={`${dataGA}-::click-confirm::global-view`} data-testid={`${dataTestId}-confirmAction`} danger={!isConfirmPositive && true} - disabled={isConfirmDisabled || (disableConfirmOnLoading && loading)} - label={loading ? confirmLoadingLabel : confirmLabel} - onClick={onConfirm} + disabled={isConfirmDisabled} + label={confirmLabel} + onClick={handleConfirm} width={confirmWidth} - isLoading={loading} /> diff --git a/src/components/confirmation-dialog/confirmation-dialog.stories.js b/src/components/confirmation-dialog/confirmation-dialog.stories.js index 14a9b3cf5..e8e9554b6 100644 --- a/src/components/confirmation-dialog/confirmation-dialog.stories.js +++ b/src/components/confirmation-dialog/confirmation-dialog.stories.js @@ -19,22 +19,3 @@ Story.add("Confirmation dialog", () => { /> ) }) - -Story.add("Confirmation dialog with loading", () => { - return ( - { - console.log("Pressed confirm") - setTimeout(() => toggleLoading(), 2000) - }} - handleDecline={() => alert("Pressed decline")} - isConfirmPositive={boolean("isConfirmPositive", false)} - message="We are about to fulfill your request, there is no return from here. Are you sure?" - title="Are you sure you want to proceed?" - showConfirmLoading={boolean("showConfirmLoading", true)} - disableConfirmOnLoading={boolean("disableConfirmOnLoading", true)} - /> - ) -}) From ec1fe59e6e07c026a1882e3e3d2e47a1000c574b Mon Sep 17 00:00:00 2001 From: John Kapantzakis Date: Mon, 27 Mar 2023 13:43:11 +0300 Subject: [PATCH 2/3] Add props to confirmation dialog --- src/components/confirmation-dialog/confirmation-dialog.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/components/confirmation-dialog/confirmation-dialog.js b/src/components/confirmation-dialog/confirmation-dialog.js index a9bb31684..921adc81b 100644 --- a/src/components/confirmation-dialog/confirmation-dialog.js +++ b/src/components/confirmation-dialog/confirmation-dialog.js @@ -19,6 +19,8 @@ const ConfirmationDialog = ({ hideIcon, iconName = "warning_triangle_hollow", isConfirmDisabled, + isConfirmLoading, + isDeclineDisabled, isConfirmPositive, message, title, @@ -44,6 +46,7 @@ const ConfirmationDialog = ({ data-ga={`${dataGA}-::click-cancel::global-view`} data-testid={`${dataTestId}-cancelAction`} flavour="hollow" + disabled={isDeclineDisabled} label={declineLabel} onClick={handleDecline} width={declineWidth} @@ -57,6 +60,7 @@ const ConfirmationDialog = ({ label={confirmLabel} onClick={handleConfirm} width={confirmWidth} + isLoading={isConfirmLoading} /> From 2ac78163e0a9ba590976ddc97f814576c7268e04 Mon Sep 17 00:00:00 2001 From: John Kapantzakis Date: Mon, 27 Mar 2023 14:08:01 +0300 Subject: [PATCH 3/3] v2.14.1 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 1553dc325..4524d4d59 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@netdata/netdata-ui", - "version": "2.14.0", + "version": "2.14.1", "description": "netdata UI kit", "main": "./lib/index.js", "files": [