import React from 'react';

export const ConnectionStatusIndicator = ({ connectionStatus }) => {
    return (
        <div style={{
            position: 'absolute',
            top: '10px',
            right: '10px',
            padding: '5px 10px',
            borderRadius: '4px',
            backgroundColor: connectionStatus === 'connected' ? '#4CAF50' :
                connectionStatus === 'error' ? '#F44336' : '#FFC107',
            color: 'white',
            fontSize: '12px'
        }}>
            {connectionStatus === 'connected' ? 'Online' :
                connectionStatus === 'error' ? 'Connection Error' : 'Offline'}
        </div>
    );
};