From c7dcf1f4a00e8491f6cf2f9be0a9330b5c8e32b0 Mon Sep 17 00:00:00 2001
From: mickr777 <115216705+mickr777@users.noreply.github.com>
Date: Thu, 13 Jul 2023 14:40:09 +1000
Subject: [PATCH] Create ClearNodesButton.tsx

---
 .../nodes/components/ui/ClearNodesButton.tsx  | 41 +++++++++++++++++++
 1 file changed, 41 insertions(+)
 create mode 100644 invokeai/frontend/web/src/features/nodes/components/ui/ClearNodesButton.tsx

diff --git a/invokeai/frontend/web/src/features/nodes/components/ui/ClearNodesButton.tsx b/invokeai/frontend/web/src/features/nodes/components/ui/ClearNodesButton.tsx
new file mode 100644
index 0000000000..f9824268b9
--- /dev/null
+++ b/invokeai/frontend/web/src/features/nodes/components/ui/ClearNodesButton.tsx
@@ -0,0 +1,41 @@
+import { useAppDispatch } from 'app/store/storeHooks';
+import { clearNodes } from 'features/nodes/store/nodesSlice';
+import { makeToast } from 'app/components/Toaster';
+import { addToast } from 'features/system/store/systemSlice';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { FaTrash } from 'react-icons/fa';
+import IAIIconButton from 'common/components/IAIIconButton';
+
+const ClearNodesButton = () => {
+  const { t } = useTranslation();
+  const dispatch = useAppDispatch();
+
+  const handleClearNodes = () => {
+    const confirmed = window.confirm(t('common.clearNodes'));
+
+    if (confirmed) {
+      dispatch(clearNodes());
+
+      dispatch(
+        addToast(
+          makeToast({
+            title: t('toast.nodesCleared'),
+            status: 'success',
+          })
+        )
+      );
+    }
+  };
+
+  return (
+    <IAIIconButton
+      icon={<FaTrash />}
+      tooltip={t('nodes.clearNodes')}
+      aria-label={t('nodes.clearNodes')}
+      onClick={handleClearNodes}
+    />
+  );
+};
+
+export default memo(ClearNodesButton);