1 files changed, 58 insertions, 0 deletions
diff --git a/src/client/views/nodes/generativeFill/GenerativeFillButtons.tsx b/src/client/views/nodes/generativeFill/GenerativeFillButtons.tsx
new file mode 100644
index 000000000..348e27a16
--- /dev/null
+++ b/src/client/views/nodes/generativeFill/GenerativeFillButtons.tsx
@@ -0,0 +1,58 @@
+import { Button } from '@mui/material';
+import { ImageUtility } from './generativeFillUtils/ImageHandler';
+import { canvasSize } from './generativeFillUtils/generativeFillConstants';
+import { Oval } from 'react-loader-spinner';
+import './GenerativeFillButtons.scss';
+import React from 'react';
+
+interface ButtonContainerProps {
+    canvasRef: React.RefObject<HTMLCanvasElement>;
+    backgroundref: React.RefObject<HTMLCanvasElement>;
+    currImg: React.MutableRefObject<HTMLImageElement | null>;
+    undoStack: React.MutableRefObject<ImageData[]>;
+    getEdit: () => Promise<void>;
+    loading: boolean;
+}
+
+const Buttons = ({ canvasRef, backgroundref, currImg, undoStack, loading, getEdit }: ButtonContainerProps) => {
+    const handleReset = () => {
+        if (!canvasRef.current || !currImg.current) return;
+        const ctx = ImageUtility.getCanvasContext(canvasRef);
+        if (!ctx) return;
+        ctx.clearRect(0, 0, canvasSize, canvasSize);
+        ImageUtility.drawImgToCanvas(currImg.current, canvasRef, true);
+    };
+
+    return (
+        <div className="generativeFillBtnContainer">
+            <Button onClick={handleReset}>Reset</Button>
+            <Button
+                onClick={() => {
+                    if (!canvasRef.current) return;
+                    ImageUtility.downloadCanvas(canvasRef.current);
+                }}>
+                Download
+            </Button>
+            {/* <Button
+        onClick={() => {
+          if (!canvasRef.current) return;
+          ImageUtility.downloadImageCanvas("/assets/firefly.png");
+        }}
+      >
+        Download Original
+      </Button> */}
+            <Button
+                variant="contained"
+                onClick={() => {
+                    getEdit();
+                }}>
+                <span style={{ display: 'flex', alignItems: 'center', gap: '0.5rem' }}>
+                    Get Edit
+                    {loading && <Oval height={20} width={20} color="#ffffff" visible={true} ariaLabel="oval-loading" secondaryColor="#ffffff89" strokeWidth={3} strokeWidthSecondary={3} />}
+                </span>
+            </Button>
+        </div>
+    );
+};
+
+export default Buttons;