You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
43 lines
1.2 KiB
TypeScript
43 lines
1.2 KiB
TypeScript
/**
|
|
* Provider Banner Component
|
|
*
|
|
* Displays informational banner for bookings managed by external providers.
|
|
* Used to communicate read-only state for FairPlay clubs.
|
|
*/
|
|
|
|
import { Info } from 'lucide-react';
|
|
import type { ProviderInfo } from '@/src/types/bookings';
|
|
|
|
interface ProviderBannerProps {
|
|
provider: ProviderInfo;
|
|
className?: string;
|
|
}
|
|
|
|
export default function ProviderBanner({ provider, className = '' }: ProviderBannerProps) {
|
|
// Only show banner for non-local providers
|
|
if (provider.type === 'local') {
|
|
return null;
|
|
}
|
|
|
|
const providerName = provider.type === 'fairplay' ? 'FairPlay' : 'an external provider';
|
|
|
|
return (
|
|
<div
|
|
className={`bg-blue-50 border-2 border-blue-200 rounded-lg p-4 ${className}`}
|
|
role="alert"
|
|
>
|
|
<div className="flex items-start space-x-3">
|
|
<Info className="w-5 h-5 text-blue-600 flex-shrink-0 mt-0.5" />
|
|
<div className="flex-1">
|
|
<h4 className="text-sm font-semibold text-blue-900 mb-1">
|
|
This club is managed by {providerName}
|
|
</h4>
|
|
<p className="text-sm text-blue-700">
|
|
Admin edits are disabled here. Changes must be made in the provider's system.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|