Egor Pozharov
4e0899d3ce
- Move all frontend code to frontend/ directory - Add backend/ with Go project structure (cmd, internal, pkg) - Add docker-compose.yml for orchestration
35 lines
917 B
TypeScript
35 lines
917 B
TypeScript
import type { DeliveryStatus } from '../../types';
|
|
import { statusLabels } from '../../types';
|
|
|
|
interface StatusBadgeProps {
|
|
status: DeliveryStatus;
|
|
onClick?: () => void;
|
|
size?: 'sm' | 'md' | 'lg';
|
|
}
|
|
|
|
export const StatusBadge = ({ status, onClick, size = 'md' }: StatusBadgeProps) => {
|
|
const baseStyles = 'inline-flex items-center justify-center font-medium rounded-full transition-colors';
|
|
|
|
const variants = {
|
|
new: 'bg-[#ffdcc3] text-[#6e3900]',
|
|
delivered: 'bg-[#dcfce7] text-[#166534]',
|
|
};
|
|
|
|
const sizes = {
|
|
sm: 'px-2 py-0.5 text-xs',
|
|
md: 'px-3 py-1 text-sm',
|
|
lg: 'px-4 py-2 text-base',
|
|
};
|
|
|
|
const clickableStyles = onClick ? 'cursor-pointer hover:opacity-80 active:scale-95' : '';
|
|
|
|
return (
|
|
<span
|
|
className={`${baseStyles} ${variants[status]} ${sizes[size]} ${clickableStyles}`}
|
|
onClick={onClick}
|
|
>
|
|
{statusLabels[status]}
|
|
</span>
|
|
);
|
|
};
|