2026-04-18 12:57:20 +02:00
|
|
|
/**
|
|
|
|
|
* This file is part of the SplendidBear Websites' projects.
|
|
|
|
|
*
|
|
|
|
|
* Copyright (c) 2026 @ www.splendidbear.org
|
|
|
|
|
*
|
|
|
|
|
* For the full copyright and license information, please view the LICENSE
|
|
|
|
|
* file that was distributed with this source code.
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
import React from 'react';
|
2026-04-21 11:30:07 +02:00
|
|
|
import { func, number, string } from 'prop-types';
|
2026-04-18 12:57:20 +02:00
|
|
|
|
|
|
|
|
const BonusBox = ({ color, points, onClick, title }) => (
|
|
|
|
|
<button
|
|
|
|
|
type="button"
|
|
|
|
|
className={`bonus-box ${color}-bonus`}
|
|
|
|
|
onClick={onClick}
|
|
|
|
|
title={title || 'View bonus statistics'}
|
|
|
|
|
aria-label={`${color} bonus points: ${points}`}
|
|
|
|
|
>
|
|
|
|
|
<i className="fa fa-star bonus-box__icon" />
|
|
|
|
|
<span className="bonus-box__value">{points}</span>
|
|
|
|
|
</button>
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
export default BonusBox;
|
2026-04-21 11:30:07 +02:00
|
|
|
|
|
|
|
|
BonusBox.propTypes = {
|
|
|
|
|
color: string.isRequired,
|
|
|
|
|
points: number.isRequired,
|
|
|
|
|
onClick: func.isRequired,
|
|
|
|
|
title: string,
|
|
|
|
|
};
|