All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 3m14s
52 lines
1.4 KiB
TypeScript
52 lines
1.4 KiB
TypeScript
'use client';
|
||
|
||
import { LiveIndicator } from './LiveIndicator';
|
||
import { ShareButton } from './ShareButton';
|
||
import { CollaboratorAvatars } from './CollaboratorAvatars';
|
||
import type { Share } from '@/lib/share-utils';
|
||
|
||
interface CollaborationToolbarProps {
|
||
isConnected: boolean;
|
||
error: string | null;
|
||
lastEventUser: string | null;
|
||
canEdit: boolean;
|
||
shares: Share[];
|
||
onShareClick: () => void;
|
||
}
|
||
|
||
export function CollaborationToolbar({
|
||
isConnected,
|
||
error,
|
||
lastEventUser,
|
||
canEdit,
|
||
shares,
|
||
onShareClick,
|
||
}: CollaborationToolbarProps) {
|
||
return (
|
||
<div className="mb-4 flex items-center justify-between rounded-lg border border-border bg-card p-3">
|
||
<div className="flex items-center gap-4">
|
||
<LiveIndicator isConnected={isConnected} error={error} />
|
||
|
||
{lastEventUser && (
|
||
<div className="flex items-center gap-2 text-sm text-muted animate-pulse">
|
||
<span>✏️</span>
|
||
<span>{lastEventUser} édite...</span>
|
||
</div>
|
||
)}
|
||
|
||
{!canEdit && (
|
||
<div className="flex items-center gap-2 rounded-full bg-yellow/10 px-3 py-1.5 text-sm text-yellow">
|
||
<span>👁️</span>
|
||
<span>Mode lecture</span>
|
||
</div>
|
||
)}
|
||
</div>
|
||
|
||
<div className="flex items-center gap-2">
|
||
<CollaboratorAvatars shares={shares} />
|
||
<ShareButton onClick={onShareClick} />
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|