33 lines
877 B
JavaScript
33 lines
877 B
JavaScript
import React from 'react';
|
|
import { useNavigate } from 'react-router-dom';
|
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
|
|
export function ToolbarButton({ icon, label, onClick, navigateTo, navigateBack = false, active = false }) {
|
|
const navigate = useNavigate();
|
|
|
|
const handleClick = () => {
|
|
if (navigateBack) {
|
|
navigate(-1, { replace: true });
|
|
} else if (navigateTo) {
|
|
navigate(navigateTo, { replace: true });
|
|
} else if (onClick) {
|
|
onClick();
|
|
}
|
|
};
|
|
|
|
return (
|
|
<button
|
|
onClick={handleClick}
|
|
className={`
|
|
flex items-center gap-2 px-4 py-2 rounded-lg transition-colors
|
|
${active
|
|
? 'bg-green-600 text-white'
|
|
: 'text-gray-300 hover:text-green-600'
|
|
}
|
|
`}
|
|
>
|
|
<FontAwesomeIcon icon={icon} />
|
|
{label && <span>{label}</span>}
|
|
</button>
|
|
);
|
|
} |