diff --git a/src/components/Button.jsx b/src/components/Button.jsx index 3af84740..7f44c293 100644 --- a/src/components/Button.jsx +++ b/src/components/Button.jsx @@ -22,7 +22,7 @@ const BUTTON_STYLES = { const SIZES = { small: "small", medium: "medium", large: "large" }; const ICON_POSITIONS = { left: "left", right: "right" }; const BUTTON_TYPES = { button: "button", reset: "reset", submit: "submit" }; -const STATUS = { SUCCESS: "success", ERROR: "error" }; +const STATUS = { SUCCESS: "success", ERROR: "error", NONE: "" }; const Button = React.forwardRef( ( @@ -150,12 +150,18 @@ const Button = React.forwardRef( /> )} {loading && ( - + )} - {j && ( - + {isFeedbackIconVisible && status && ( + )} diff --git a/tests/Button.test.jsx b/tests/Button.test.jsx index b2d452ba..4a5b2d5a 100644 --- a/tests/Button.test.jsx +++ b/tests/Button.test.jsx @@ -1,11 +1,32 @@ -import React from "react"; +import React, { useState } from "react"; -import { render } from "@testing-library/react"; +import { render, screen, waitFor } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import { BrowserRouter } from "react-router-dom"; import { Button } from "components"; +const ButtonWithStatus = ({ status: testingStatus }) => { + const [loading, setLoading] = useState(false); + const [status, setStatus] = useState(""); + + const handleButtonClick = () => { + setLoading(true); + setTimeout(() => { + setStatus(testingStatus); + setLoading(false); + }, 500); + }; + + return ( +