37 lines
992 B
JavaScript
37 lines
992 B
JavaScript
import React from 'react';
|
|
import { Link } from 'react-router-dom';
|
|
import "./css/Button.css";
|
|
|
|
import Loader from "./puff-loader.svg";
|
|
|
|
export default function Button(props) {
|
|
let newProps = { ...props };
|
|
delete newProps["icon"];
|
|
delete newProps["className"];
|
|
delete newProps["children"];
|
|
delete newProps["disabled"];
|
|
delete newProps["loading"];
|
|
delete newProps["disabled"];
|
|
return (
|
|
<Link
|
|
className={`button ${props.className ? props.className : ""} ${props.icon && props.children ? "button--icon-and-text" : ""} ${props.loading ? "button--loading" : ""} ${props.disabled ? "button--disabled" : ""}`}
|
|
to={props.to}
|
|
style={props.disabled ? {pointerEvents: "none"} : null}
|
|
{...newProps}
|
|
>
|
|
{props.loading ? <img className="button-loader" src={Loader} alt="Loading..." /> : ""}
|
|
{props.icon
|
|
?
|
|
<span className="button-icon">
|
|
{props.icon}
|
|
</span>
|
|
:
|
|
""
|
|
}
|
|
<span className="button-children">
|
|
{props.children}
|
|
</span>
|
|
</Link>
|
|
)
|
|
}
|