// src/components/PermissionStatus.tsx

import React from 'react';

export interface PermissionStatusProps {
  permissionType: 'camera' | 'microphone';
  state: 'granted' | 'denied' | 'prompt' | 'unavailable';
  className?: string;
}

export const PermissionStatus: React.FC<PermissionStatusProps> = ({
  permissionType,
  state,
  className = '',
}) => {
  switch (state) {
    case 'granted':
      return (
        <p className={`text-sm text-green-500 ${className}`}>
          ✔ 
        </p>
      );
    case 'denied':
      return (
        <p className={`text-sm text-red-500 ${className}`}>
          ✘
        </p>
      );
    case 'prompt':
      return (
        <p className={`text-sm text-yellow-500 ${className}`}>
          ⚠
        </p>
      );
    case 'unavailable':
      return (
        <p className={`text-sm text-gray-500 ${className}`}>
          🚫 
        </p>
      );
    default:
      return null; // Assure que le composant retourne toujours un élément valide
  }
};